@charset "utf-8";
/*
Theme Name: visitxarpolar_v01
Theme URI:
Description: Design created by Panda Creatiu.
Version: 1.0
Author: Panda Creatiu
Author URI: http://www.pandacreatiu.com/
Tags:
*/
/* ------------------------------------------------------------------ */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;/*vertical-align: baseline*/;background: transparent;list-style:none;
	webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';content: none;}
:focus {outline: 0;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {border-collapse: collapse;border-spacing: 0;}
a {text-decoration:none;}
/* -------------------------------------------------------------------- */
html, body{ overflow-x: hidden; }
body { font-family: 'Montserrat', sans-serif; font-size:14px; font-weight:300; }

body .hidden { display: none !important; }

.wrapper{ width: 100%; margin: 0; }

.txtgen{ font-size: 16px; line-height: 1.6; font-weight: 400; }
.txtgen p, .txtgen h1, .txtgen h2, .txtgen h3{ margin-bottom: 30px; }
.txtgen h1{ font-size: 140%; }
.txtgen h2{ font-size: 120%;  }
.txtgen h3{ font-size: 100%; }
.txtgen img { width: 100% !important; max-width: 1200px !important; height: auto !important; }
.txtgen a{ color: #000; text-decoration:underline; }
.txtgen a:hover{ text-decoration: underline; }
.txtgen ul, .txtgen ol{ padding-left:40px; margin-bottom:25px; margin-top:15px; }
.txtgen ul li, .txtgen ol li{  list-style:outside; margin-bottom:12px; }
.txtgen ol li { list-style:decimal; }
.txtgen iframe { max-width: 100%; height: 300px; }

.transition{
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}

.shadow{ -webkit-box-shadow: 0px 5px 15px 0px rgba(96,67,17,0.4); -moz-box-shadow: 0px 5px 15px 0px rgba(96,67,17,0.4); box-shadow: 0px 5px 15px 0px rgba(96,67,17,0.4); }
.radius{ -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; }

::selection { background: #F1F1F1; }
::-moz-selection { background: #F1F1F1; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-button { width: 0px; height: 0px; }
::-webkit-scrollbar-thumb { background: #7f7f7f; border: 0px none #ffffff; border-radius: 0px; }
::-webkit-scrollbar-thumb:hover { background: #7f7f7f; }
::-webkit-scrollbar-thumb:active { background: #000000; }
::-webkit-scrollbar-track { background: #f1f1f1; border: 0px none #ffffff; border-radius: 50px; }
::-webkit-scrollbar-track:hover { background: #f1f1f1; }
::-webkit-scrollbar-track:active { background: #333333; }
::-webkit-scrollbar-corner { background: transparent; }

select{
    padding: .3125rem 3rem .3125rem 1rem;
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E');
    background-repeat: no-repeat, repeat;
    background-position: right 1rem center;
    border-radius: .25rem;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: 1px solid #d8e2ef;
    color: #344040;
    background-size: 10px 12px;
    background-color: #fff;
    box-shadow: 0 1px 2px rgba(0,0,0,0.075);
    outline:none;
}

.clear{ clear: both; }

.container{ width: 100%; max-width: 1400px; min-width: 320px; margin: auto; padding: 0 10px; position: relative; }

/* MENU / SUBMENU -------------------- */
.header{ position: fixed; z-index: 99; width: 100%; height: 70px; background-color: #fff;
	-webkit-box-shadow: 0 0 7px rgba(0,0,0,.1)!important; -moz-box-shadow: 0 0 7px rgba(0,0,0,.1)!important; box-shadow: 0 0 7px rgba(0,0,0,.1)!important; }

	.logo{ position: absolute; margin: 20px 10px; font-size:30px; }
	.logo a{ color:#000; }

	.menu_movil_trigger{ position:absolute; right:20px; top:25px; font-size:12px; font-weight:500; }
	.menu_movil_trigger a{ display: flex; align-items: center; color:#000; }
	.menu_movil_trigger a div{ width:11px; height:17px; background-image:url('images/arrow_right.png'); margin-left:7px; background-size:contain; background-position:center; 
		background-repeat: no-repeat; }

.header_height{ height: 70px; }

/* menu mobile*/
.menu_mobile{ margin-top: 0px; }

	.sidr { display: block; position: fixed; top: 0; height: 100%; z-index: 999999; width: 260px; overflow-x: hidden; overflow-y: auto;
	  font-size: 14px; background: #000; padding: 15px; }

	.sidr .sidr-inner { padding: 0 0 15px; }

	.sidr.right { left: auto; right: -260px; }
	.sidr.left { left: -260px; right: auto; }

	.menu_mobile{ font-size: 13px; text-transform: uppercase; }
	.menu_mobile li{ padding: 7px 0; }
	.menu_mobile li a{ color: #fff; display: block; width: 230px !important; padding-bottom: 5px; font-weight: bold; }
	

@media only screen and (max-width: 763px) {
	.header{ height: 50px; }

		.logo{ margin: 16px 10px; font-size:20px; }

		.menu_movil_trigger{ right:10px; top:21px; font-size:11px; }
		.menu_movil_trigger a div{ width:6px; height:9px; }

	.header_height{ height: 50px; }
}

.when_menu_open{ position: fixed; z-index: 9999; width: 100vw; height: 100vh; background-color: rgba(0,0,0,.2); display: none; }


/* HOME ========================================================================================================================== */
.sle_video{ display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; width: 100%; margin: 0; min-height: calc(100vh - 70px); }

	.sle_video_text{ width: 100%; max-width: 800px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; 
		text-align:center; padding:0 10px; color:#fff; font-weight:900; font-size:68px; line-height:1.4; text-shadow: 0px 0px 3px rgba(0,0,0,.6); }

	.sle_video video { z-index: 1; object-fit: cover; width: 100%; height: 100%; position: absolute; }

video::-webkit-media-controls-panel { display: flex !important; opacity: 1 !important; }

#videoheader::-webkit-media-controls {
    display: none;
}

@media only screen and (max-width: 763px) {
	/*.sle_video{ min-height: 40px; aspect-ratio: 16 / 9; }*/
	.sle_video{ min-height: calc(70vh - 50px); }
	.sle_video_text{ font-size:50px; }
}

.home_text{ width:100%; max-width: 670px; margin:80px auto; text-align:center; }

.mapa{ width: 100%; height: calc(90vh - 70px); margin-bottom:10px; }
	.map{ height: calc(90vh - 70px); margin: auto; width: 100%; position: relative; }
		#map{ height: calc(90vh - 70px); overflow: hidden; }

.popup_nom{ position:absolute; width:230px; height:47px; margin-top:-47px; display: flex; align-items: center; }
	.popup_nom_nom{ font-size:17px; text-transform:uppercase;  }
	.popup_nom_comarca{ font-size:11px; font-weight:bold; }

	.popup_map_img{ width:240px; height:150px; background-size:cover; background-position:center; background-repeat:no-repeat; }

	.popup_nom_permalink{ margin-top:10px; font-weight:bold; font-weight:bold; }
	.popup_nom_permalink a{ color:#000; text-decoration:underline; }


.swiper_container{ position:relative; }
.next_cats1, .prev_cats1{ display:none !important; }

.swiper_cover{ width:100%; aspect-ratio:1.38; background-size:cover; background-position:center; background-repeat:no-repeat; position:relative; }
	
	.swiper_text{ position:absolute; z-index: 5; left:10px; bottom:10px; color:#fff; line-height:1.1; }
		.swiper_nom{ font-size:35px; text-transform:uppercase; text-shadow: #333 1px 0 10px; }
		.swiper_comarca{ font-size:21px; font-weight:bold; }

	.swiper_white{ position:absolute; z-index: 3; width:100%; height: 40px; left:0; bottom:0; background-color:#fff; }
	.swiper_grey{ position:absolute; z-index: 4; bottom:0; left:0; width:90%; height:60px; background-color:#333; }


@media only screen and (max-width: 763px) {

	.home_text{ margin:40px auto; }

	.swiper_nom{ font-size:25px; }
	.swiper_comarca{ font-size:17px; }

	.swiper_grey{ height:45px; }

}


/* POBLE ========================================================================================================================= */
.poble_banner{ position: relative; width: 100%; margin: 0; min-height: calc(90vh - 70px); background-size:cover; background-position:center; background-repeat:no-repeat; }
	
	.poble_banner .container{ width: 100%; height:calc(90vh - 70px); }

	.poble_banner_text{ position: absolute; left: 0; bottom: -30px; z-index: 2; line-height:1.4; }
		
		.poble_banner_text_content{ position:relative; z-index:5; padding:0 0 15px 15px; color:#fff; line-height: 1.1; }

			.poble_banner_nom{ font-size:56px; text-transform:uppercase; 
				text-shadow: #333 1px 0 10px; }

			.poble_banner_comarca{ font-size:34px; font-weight:bold; padding-left:5px; }
		
		.poble_banner_text_back{ position:absolute; z-index: 4; bottom:0; left:0; width:130%; height:90px; background-color:#333; }

.poble_tornar{ width:fit-content; display: flex; align-items: center; margin-top:70px; }
	.poble_tornar_arrow{ width:11px; height:18px; background-image:url('images/arrow_black_left.png'); }
	.poble_tornar_text{ font-size:20px; color:#000; margin-left:10px; }

.poble_content{ width: 100%; margin-top:30px; display:flex; }
	.poble_content_text{ width:calc(100% - 350px); padding-right:90px; }
	.poble_content_dades{ width: 350px; }

.proximas{ margin:90px 0 50px 0; font-size:54px; }


@media only screen and (max-width: 800px) {

	.poble_banner_nom{ font-size:40px; }
	.poble_banner_comarca{ font-size:27px; }

	.poble_banner_text_back{ height:70px; }

	.poble_content{ width: 100%; margin-top:30px; display:block; }
		.poble_content_text{ width:100%; padding-right:0px; }
		.poble_content_dades{ width: 100%; }


	.proximas{ margin:50px 0 10px 0; font-size:30px; }
}



/* FOOTER ======================================================================================================================== */
footer{ width: 100%; border-top:1px solid #000; height: 70px; margin-top:100px; position:relative; }

	.footer_logo{ position: absolute; margin: 23px 10px 10px 10px; font-size:30px; }
	.footer_logo a{ color:#000; }

	.footer_menu{ position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%); }
	.footer_menu a{ color:#000; }
	.footer_menu a:hover{ text-decoration:underline; }
	.footer_menu ul{ display: flex; align-items: center; }
	.footer_menu ul li:after{ content:'|'; padding:0 5px; }
	.footer_menu ul li:last-child:after{ content:''; padding:0; }

@media only screen and (max-width: 800px) {

	footer{ margin-top:50px; }

		.footer_logo{ position: relative; margin: 5px 10px 10px 10px; }

		.footer_menu{ position: relative;  top: auto;  left: 0;  transform: none; margin:0 0 0 10px; }
}



/* PER FER FUNCIONAR LA MAQUETACIO FLOAT DE CONTENT ------------------------------- */
.alignnone { margin: 5px 20px 20px 0; }
.aligncenter, div.aligncenter { display: block; margin: 5px auto 5px auto; }
.alignright { float:right; margin: 0px 0 7px 7px; }
.alignleft { float: left; margin: 0px 7px 7px 0; }
a img.alignright { float: right; margin: 5px 0 7px 7px; }
a img.alignnone { margin: 5px 7px 7px 0; }
a img.alignleft { float: left; margin: 5px 7px 7px 0; }
a img.aligncenter { display: block; margin-left: auto; margin-right: auto }
.wp-caption { background: #fff; border: 1px solid #f0f0f0; max-width: 96%; padding: 5px 3px 10px; text-align: center; }
.wp-caption.alignnone { margin: 5px 20px 20px 0; }
.wp-caption.alignleft { margin: 5px 20px 20px 0; }
.wp-caption.alignright { margin: 5px 0 20px 20px; }
.wp-caption img { border: 0 none; height: auto; margin: 0; max-width: 98.5%; padding: 0; width: auto; }
.wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; margin: 0; padding: 0 4px 5px; }
/* Text meant only for screen readers. */
.screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; }
.screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto;
	left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ }