*, *:before, *:after { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
* { text-shadow:1px 1px 1px rgba(0,0,0,0.07); }
html, body { height:100%; padding:0; margin:0; }
body { position:relative; font-family: 'Advent Pro', sans-serif; font-size:1.2rem; letter-spacing:.1px; line-height:normal; font-weight:500; color:#000; background-color:#e2e2e2; overflow:hidden; }
a, a:visited, a:active { color: #3333ff; transition: all 0.12s ease-out; text-decoration:none; text-shadow: none; }
svg { transition:fill 0.12s ease-out; }
a:hover { color: #0000ff; text-decoration:underline; }
.no-transition { -webkit-transition: none !important; -moz-transition: none !important; -o-transition: none !important; transition: none !important; }
h2 { font-size: 1.4rem; }

/* MAP */
#rsMap-wrap { position:relative; width:100%; height:100%; overflow:hidden; }
#rsMap { position:absolute; top:0; right:0; bottom:0; left:0; background-color:#efefef; } 

/* LOGOS */
#rs-logo { position:absolute; top:20px; right:20px; z-index: 1000; }
#rs-logo img { width:100px; height:auto; }
#rs-sublogo { position:absolute; bottom:10px; right:20px; z-index:1000; }
#rs-sublogo img { width:auto; height:40px; }

/* MENU ACTIONS */
.block-actions { position:absolute; top:15px; right:-60px; border-top: 1px solid #ccc; border-left: 1px solid #ccc; box-shadow: 1px 3px 8px 1px rgba(0, 0, 0, .55); z-index:100; }
.block-actions .ibtn { position:relative; width:38px; height:38px; display: flex; justify-content: center; align-items: center; cursor:pointer; transition: all 0.12s ease-out; border-bottom: 1px solid #ccc;border-right: 1px solid #ccc; background-color:#fff; }
.block-actions .action-zoomIn > svg, .block-actions .action-zoomOut > svg { width:23px; height:23px; fill: #2e2e2e; }
.block-actions .action-resetView > svg { width:25px; height:25px; fill: #2e2e2e; }
.block-actions .ibtn:hover { background-color:#ccc; }
.block-actions .ibtn.disabled { background-color:#ccc; color:#fff; cursor:default; }

/* FULLSCREEN IMAGE */
#image-full { position:absolute; padding:50px 40px 60px 40px; top:0; right:0; bottom:0; left:0; background-color:#ffffffcc; z-index: 10000; display:flex; justify-content: center; align-items: center; }
#image-full > div { position:relative; width:100%; height:100%; }
#image-full > div > div { background-color:#ffffff; border:1px solid #ccc; border-radius: 3px; box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23); display:flex; flex-direction:column; position: absolute; margin: auto; left: 0; right: 0; top: 0; bottom: 0; max-width: 100%; max-height: 100%; aspect-ratio:14/11; padding:40px 0 25px 0; }
#image-full-loader { position:absolute; top:0; left:0; right:0; bottom:0; background-image:url(../images/horizontal_loader.svg); background-position: center; background-repeat: no-repeat; }
#image-full-close { position:absolute; top: -13px; right: -14px; background-color: #fff; border-radius: 50%; font-size: 0; line-height: 0; cursor: pointer; box-shadow: 0px 1px 0px rgba(0,0,0,0.19), 3px 2px 3px rgba(0,0,0,0.23); }
#image-full-close > svg { fill:#999; width: 30px; height: 30px; }
#image-full-close:hover { background-color:#efefef; }
#image-full-close:hover > svg { }
#image-full-content { width:100%; height:100%; display: flex; justify-content: center; align-items: center; }
#image-full-content > div { width:100%; height:100%; }
#image-full-content button { font-size: 0; line-height: 0; padding: 0; cursor:pointer; border: none; background-color: transparent; }
#image-full-content button > svg { fill:#555; width:50px; height:50px; }
#image-full-content button:hover > svg { fill:#000; }
#image-full-content .slick-track { height: 100%; }
#image-full-content .slick-dots li button:before { font-size: 10px; }
#image-full-content .image-full-block { width:100%; height:100%; display: flex; flex-direction: column; }
#image-full-content .image-full-info {  width:100%; padding:0; }
#image-full-content .image-full-info > div { width:100%; min-height:80px; }
#image-full-content .image-full-info > div > div:first-child { color: #000; font-size: 1.05rem; font-weight:700; padding:10px 0 8px 0; }
#image-full-content .image-full-info > div > div:last-child { font-size: .9rem; color: #444; }
#image-full-content .image-full-info > div svg { width: 12px; height: 12px; margin-right: 10px; }
#image-full-content .image-full-image { position:relative; flex:1; background-color:#efefef; }
#image-full-content .image-full-image > div { position:absolute; top:0; left:0; right:0; bottom:0; }
#image-full-content .image-full-image > div > img { width: 100%; height: 100%; object-fit: cover; }
#image-full-content .image-full-image > div > img.landscape { object-fit: contain; }
@media all and (max-width:1023px) {
	#image-full > div > div { padding:30px 0 15px 0; }
}
@media all and (max-width:767px) {
	#image-full { padding:40px 30px 50px 30px; }
}
@media all and (max-width:599px) {
	#image-full-content button > svg { width: 40px; height: 40px; }
	#image-full-content .image-full-info > div > div:first-child { font-size: .95rem; }
	#image-full-content .image-full-info > div svg { width: 10px; height: 10px; margin-right: 6px; }
	#image-full-content .image-full-info > div > div:last-child { font-size: .8rem; color: #222; }
	#image-full > div > div { aspect-ratio: 14/12; }
}
@media all and (max-width:449px) {
	#image-full > div > div { aspect-ratio: 14/14; }
	#image-full-content button > svg { width: 30px; height: 30px; }
	#image-full { padding: 30px 20px 40px 20px; }
	#image-full > div > div { aspect-ratio: 14/13; }
	#image-full > div > div { padding: 15px 0 5px 0; }
}
@media all and (max-width:379px) {
	#image-full > div > div { aspect-ratio: 14/14; }
}
@media all and (max-width:329px) {
	#image-full > div > div { aspect-ratio: 14/15; }
}

/* LEFT BLOCK */
#block-left-pages { position:absolute; top:0; bottom:0; left:0; right:0; background-color:#fff; transition: all 0.5s linear; }
#block-left-pages > div { position:absolute; top:0; bottom:0; left:0; right:0; display: flex; flex-direction: column; }
#block-left-pages > div .content { flex:1; overflow-y:auto; scrollbar-width: thin; padding:0 15px 15px 15px; }
.block-leftwrap .block-slideButton > .left { background-color:#fff; transition: all 0.5s linear; }
.block-leftwrap.slide-color #block-left-pages { background-color:#fef7e5; }
.block-leftwrap.slide-color .block-slideButton > .left { background-color: #fef7e5; }

CCC.block-left-page-category { background-color:#fef7e5; }
/* LEFT BLOCK : CATEGORY */
.block-left-page-category > .content-top { position:relative; height:240px; width:100%; background-color:#00ffff55; margin-bottom:15px; }
.block-left-page-category > .content-top img { width: 100%; height: 100%; object-fit: cover; }
.block-left-page-category > .content-top a { position:absolute; top:10px; left:10px; font-size:0; line-height:0; }
.block-left-page-category > .content-top a svg { fill:#e81f27; width: 40px; height: 40px; }
.block-left-page-category > .content-top a:hover svg { fill:#000 !important; }
.block-left-page-category > .content-bottom { height:70px; width:100%; display: flex; justify-content: flex-end; align-items: center; padding:0 15px 5px 15px; }
.block-left-page-category > .content-bottom a { color:#e81f27; font-weight: 700; display: flex; align-items: center; font-size: 1.25rem; letter-spacing: .5px; }
.block-left-page-category > .content-bottom a svg { fill:#e81f27; width: 40px; height: 40px; margin-left:5px; }
.block-left-page-category > .content-bottom a:hover  {  color:#000 !important; text-decoration:none; }
.block-left-page-category > .content-bottom a:hover svg { fill:#000 !important; }
.block-left-page-category > .content-bottom.empty-space { height:10px; }
.block-left-page-category .route-info-category { display: flex; align-items: center; font-weight:600; font-size:.9rem; }
.block-left-page-category .route-info-category svg { width:13px; height:13px; margin-right:7px; }
.block-left-page-category .route-info-category span { margin-bottom:1px; }
.block-left-page-category .route-info-title { font-weight: 700; font-size:1.15rem; padding:2px 0 12px 0; }
.block-left-page-category .route-info-text { font-size:1.06rem; font-weight:400; letter-spacing:.3px; }
.block-left-page-category .route-info-text p { margin:10px 0; }
.block-left-page-category .route-info-text > p:first-child { margin-top:0; }
.block-left-page-category .route-info-text > p:last-child { margin-bottom:0; }
.block-left-page-category .route-info-details > div:first-child { font-weight: 700; font-size: 1rem; padding:24px 0 12px 0; border-bottom: 1px solid #999; margin-bottom: 12px; }
.block-left-page-category .route-info-details > table { font-size:.95rem; width:100%; }
.block-left-page-category .route-info-details > table tr > td:first-child { width:75px; }
.block-left-page-category .route-info-details > table tr > td:last-child { font-weight:700; }
.block-left-page-category .route-info-details > table tr > td { padding:4px 0; }
.block-left-page-category .route-info-details > table tr:last-child > td { font-weight:inherit; }
.block-left-page-category .route-info-details > table ul { padding: 0 15px; }
/* LEFT BLOCK : MENU */
#block-left-page-0 { background-image:url(../images/bg-left-block.png); background-repeat: no-repeat; background-size: contain; background-position: center bottom; }
#block-left-page-0 .title { height:77px; border-bottom:3px solid #ff6b01; }
#block-left-page-0 .title > div { height:70px; width:100%; background-color: #ff6b01; display:flex; justify-content:flex-start; align-items: center; padding: 0 15px; }
#block-left-page-0 .title span { font-size: 1.6rem; font-weight:700; margin: 0; padding: 0; color:#fff; letter-spacing: .5px; }
#block-left-page-0 .category-holder { padding: 15px 0; }
#block-left-page-0 .category-holder .eye-open { display:none; }
#block-left-page-0 .category-holder .eye-close { display:inline-block; }
#block-left-page-0 .category-holder.show .eye-open { display:inline-block; }
#block-left-page-0 .category-holder.show .eye-close { display:none; }
#block-left-page-0 .category-title { display:inline-flex; align-items: center; padding: 0 0 7px 0; color:#000; cursor:default; }
#block-left-page-0 .category-title svg.circle { width:18px; height:18px; }
#block-left-page-0 .category-title svg.eye { fill:#666; width:22px; height:22px; }
#block-left-page-0 .category-title span { margin:0 5px 0 10px; font-weight:700; }
#block-left-page-0 .category-title a { font-size: 0; line-height: 0; }
#block-left-page-0 .category-holder .category-routes { pointer-events:none; }
#block-left-page-0 .category-holder .category-routes a { font-size:.85em; color:#AAA; padding: 2px 0; display: inline-block; font-weight: 700; }
#block-left-page-0 .category-holder.show .category-routes { pointer-events:all; }
#block-left-page-0 .category-holder.show .category-routes a { font-size:.85em; color:#555; padding: 2px 0; display: inline-block; font-weight: 700; }
#block-left-page-0 .category-holder.show .category-routes a.active { text-decoration:underline; }

/* BOTTOM GALLERY */
#gallery { position:absolute; top:0; bottom:0; left:0; right:0; background-color:#ffffff; padding:10px; }
#gallery-images-holder { width:100%; height:154px; display:flex; }
#gallery-content-window { position:relative; overflow: hidden; flex:1; }
#gallery-content { position:absolute;top:0; left:0; display:flex; transition: all 0.25s ease-out 0s; }
#gallery-content .block-image { border-radius:3px; padding: 4px; transition: all 0.12s ease-out; }
#gallery-content .block-image > div { position:relative; width:210px; height:140px; background-color: #eee; }
#gallery-content .block-image > div.landscape { width:105px; height:140px; }
#gallery-content .block-image img { height:100%; width:100%; cursor:pointer; object-fit: cover; transition: all 0.12s ease-out; }
#gallery-content .block-image span { opacity:0; position:absolute; top:5px; right: 5px; padding: 5px; font-size: 0; line-height: 0; border-radius: 3px; cursor:pointer; transition: all 0.12s ease-out; }
#gallery-content .block-image span > svg { width:18px; height:18px; fill:#ffffff; transition: all 0.12s ease-out; }
#gallery-content .block-image:hover span { opacity:.75; }
#gallery-content .block-image span:hover { opacity:1; }
#gallery-content .block-image span:hover {background-color: #ff0000ff; }
#gallery-title { position: absolute; bottom:23px; left: 66px; display: flex; align-items: center; font-weight: 700; }
#gallery-title svg { width: 15px; height: 15px; margin-right:10px; }
#gallery .gallery-arrows { width:50px; display:flex; justify-content:center; align-items:center; }
#gallery .gallery-arrows a { width:50px; height:50px; display:inline-block; }
#gallery .gallery-arrows a > svg { fill:#999; }
#gallery .gallery-arrows a:hover > svg { fill:#000; }
#gallery .gallery-arrows.disabled { pointer-events:none; }
#gallery .gallery-arrows.disabled svg { fill:#efefef; }
	




.noview {

	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' preserveAspectRatio='none' viewBox='0 0 100 100'><path d='M1 0 L0 1 L99 100 L100 99' fill='black' /><path d='M0 99 L99 0 L100 1 L1 100' fill='black' /></svg>");

	background-repeat:no-repeat;

	background-position:center center;

	background-size: 100% 100%, auto;

	color:#666;

}



















.block-actions .rs-popup.active {

	background-color:#000;

	color:#fff;

}

#block-bottomwrap {
	position: absolute;
	right: 0;
	bottom: -225px;
	height: 225px;
	border-top: 1px solid #ccc;
	box-shadow: 1px 3px 8px 1px rgba(0, 0, 0, 0);
	z-index: 99;
	transition: bottom 0.15s ease-out;
}
#block-bottomwrap.active {
	bottom: 0;
	box-shadow: 1px 3px 8px 1px rgba(0, 0, 0, .55);
}

.block-leftwrap { position:absolute; top:-2px; left:-360px; bottom:0; width:360px; border-top: 1px solid #ccc; border-left: 1px solid #ccc; box-shadow: 1px 3px 8px 1px rgba(0, 0, 0, 0); z-index:100; transition: all 0.25s ease-out; }
.block-leftwrap.active { left:0; box-shadow: 1px 3px 8px 1px rgba(0, 0, 0, .55); }

/* SLIDE BUTTON */
.block-slideButton { position:absolute; top:0; bottom:0; right:-36px; width:36px; display: flex; align-items: center; overflow: hidden; padding-right:5px; pointer-events: none; }
.block-slideButton > div { font-size: 0; border-top:1px solid #ccc; border-right:1px solid #ccc; border-bottom:1px solid #ccc; height:100px; background-color:#fff; width:100%; display:flex; align-items: center; justify-content: center; border-top-right-radius: 8px; border-bottom-right-radius: 8px; box-shadow: 1px 3px 8px 1px rgba(0, 0, 0, .55); pointer-events: all; cursor:pointer; }
.block-slideButton > div > svg { display:block; width: 16px; height:16px; fill: #555; transition: all 0.12s ease-out; }
.block-slideButton > div.left > svg.right { display:none; }
.block-slideButton > div.right > svg.left { display:none; }
.block-slideButton > div:hover > svg { fill:#ccc; }





.action-maptype { position:relative; }

.action-maptype .mapStyleId { position: absolute;

bottom: -2px;

right: 1px;

font-size: 1rem; }



.mapboxgl-marker:hover { cursor:pointer; }

.mapboxgl-popup hr { border:none; border-top:1px solid #ccc; }

.mapboxgl-popup-content { padding: 12px 20px; font-family: 'EB Garamond', serif; font-size: 1.05rem; box-shadow: 1px 3px 8px 1px rgba(0, 0, 0, .55); }

.mapboxgl-popup-close-button { outline: none; }



.village-info > div > ion-icon { cursor:pointer; position: absolute; right: 10px; top: 0; width: 30px; height: 30px; border: 1px solid #ccc; padding:2px; }

.village-info > div > ion-icon:hover { background-color:#ccc; }

.village-info { position:relative; }

.village-info > div { position:relative; padding:0 20px 20px 20px; }

.village-info > img { width: 100%; height: 240px; object-fit: cover; margin-bottom:10px; }

.village-info-municipality { }

.village-info h2 { margin:6px 0 10px 0; line-height: 1.2; text-shadow: none; }

.village-info h2 > span { color: #666; font-size: 1.1rem; font-weight: 500; }

.village-info-subtitle { color:#ce992b; margin-bottom: 10px; font-weight: 500; text-shadow: none; }

.village-info-content > p:first-child { margin-top:0; }

.village-info-content > p:last-child { margin-bottom:0; }

.village-info-general { border-top: 1px solid #ccc; padding-top: 17px; margin-top: 20px; }

.village-info h3 { margin: 0 0 6px 0; font-size: 1rem; font-weight: 500; text-decoration: underline; }

.village-info-general > div { margin-bottom: 2px; }