@font-face {    font-family: 'Medium';    src: url('../fonts/ElmsSans-Medium.eot');    src: url('../fonts/ElmsSans-Medium.eot?#iefix') format('embedded-opentype'),        url('../fonts/ElmsSans-Medium.woff') format('woff'),        url('../fonts/ElmsSans-Medium.ttf') format('truetype'),        url('../fonts/ElmsSans-Medium.svg#ElmsSans-Medium') format('svg');    font-weight: 500;    font-style: normal;    font-display: swap;}
@font-face {    font-family: 'Bold';    src: url('../fonts/ElmsSans-Bold.eot');    src: url('../fonts/ElmsSans-Bold.eot?#iefix') format('embedded-opentype'),        url('../fonts/ElmsSans-Bold.woff') format('woff'),        url('../fonts/ElmsSans-Bold.ttf') format('truetype'),        url('../fonts/ElmsSans-Bold.svg#ElmsSans-Bold') format('svg');    font-weight: bold;    font-style: normal;    font-display: swap;}
@font-face {    font-family: 'Regular';    src: url('../fonts/ElmsSans-Regular.eot');    src: url('../fonts/ElmsSans-Regular.eot?#iefix') format('embedded-opentype'),        url('../fonts/ElmsSans-Regular.woff') format('woff'),        url('../fonts/ElmsSans-Regular.ttf') format('truetype'),        url('../fonts/ElmsSans-Regular.svg#ElmsSans-Regular') format('svg');    font-weight: normal;    font-style: normal;    font-display: swap;}
@font-face {    font-family: 'Light';    src: url('../fonts/ElmsSans-Regular.eot');    src: url('../fonts/ElmsSans-Regular.eot?#iefix') format('embedded-opentype'),        url('../fonts/ElmsSans-Regular.woff') format('woff'),        url('../fonts/ElmsSans-Regular.ttf') format('truetype'),        url('../fonts/ElmsSans-Regular.svg#ElmsSans-Regular') format('svg');    font-weight: normal;    font-style: normal;    font-display: swap;}



body {	font-family: 'Regular' ,Arial, Helvetica, sans-serif;    color: #333;    line-height: 2.7rem;    font-weight: normal;    font-style: normal;    font-size: 1.8rem; background-color: #f9f9f9;}
body.fonsMunicipi{background-repeat: no-repeat;  background-position: center center;  background-size: cover;  background-attachment: fixed;  min-height: 100vh;
  margin: 0; background-image: none !important;}
html{font-size: 10px;}
p{margin:0 }

a {	text-decoration: underline;	text-decoration-color: rgb(0, 0, 0, 0);}
a:link{	text-decoration: none;	color: #000;}
a:visited{	text-decoration: none;	color: #000;}
a:hover{	text-decoration: none;	color: #8D7D0E !important;}
a:active{	text-decoration: none;	color: #848383;}

h1 { font-family: 'Bold' ,Arial, Helvetica, sans-serif;    font-size: 2.7rem;    line-height: 3rem;    color: #323232; margin: 2rem 0;font-weight: normal;    font-style: normal;  text-align:center; }
h2 { font-family: 'Bold', Arial, Helvetica, sans-serif;    font-size: 2.1rem;    line-height: 2.7rem;   color: #323232; font-weight: normal;    font-style: normal;    margin: 1rem 0; }
h3 { font-family: 'Bold' ,Arial, Helvetica, sans-serif;    font-size: 1.8rem;    line-height: 2.4rem;   color: #323232; margin: 0; text-transform: none;}
h4 { font-family: 'Bold', Arial, Helvetica, sans-serif;	   font-size: 1.4rem;	 line-height: 2rem;	    color: #323232;	font-weight: normal;	font-style: normal;		margin: 0; }
h5 { font-family: 'Medium' ,Arial, Helvetica, sans-serif;  font-size: 1.2rem;    line-height: 1.7rem;    color: #212121; margin: 0;font-weight: normal;    font-style: normal; 	}

.slogan { font-family: 'Bold' ,Arial, Helvetica, sans-serif;    font-size: 8rem;    line-height: 8.5rem;    color: #fff; margin: 2rem 0;font-weight: normal;    font-style: normal;  text-align:center; }

.container-fluid {padding: 0 !important; margin: 0 !important;}
.centrat{text-align: center;margin: 0 auto;}


.icoXarxa{margin:0 0rem 0 0; width:3rem;}
.bannerMobile{display: none;}
.mesinfoj{    display: table; color: #fff;    transition: 0.5s;    font-family: 'Bold', Arial, Helvetica, sans-serif;    text-transform: uppercase;    line-height: 2.4rem;    font-size: 1.4rem;    cursor: pointer;    background-color: #f58200;    padding: 15px 25px;}

.ajustVideo {    margin-top: 0;    width: 100%;    height: 91vh;     overflow: hidden;    position: relative;}
.ajustVideo video, 
.ajustVideo img {    width: 100%;    height: 100%;    object-fit: cover;   display: block;}
.socialPeu{width: 25px !important;}
.fcontact{margin-top: 0rem; background-color: #fff; color: #212121; text-align: center; border-top:1px solid #cccccc;}
.mundial{ width:100%; transition: all 1s ease; position: fixed; top:0px; z-index: 9544;}
.menuScroll {  transition: all 0.5s ease;    background-color: #f3f1ee;    box-shadow: rgba(33, 35, 38, 0.5) 0px 1rem 1rem -1rem;}
.margenestop{clear: both;position: relative; margin-top: 4rem!important;}
.taula > tbody > tr > td > .inputcontacto {    border: #cccccc 0.1rem solid;    font-family: 'Regular', Arial, Helvetica, sans-serif;    font-size: 1.4rem;    color: #666666;    padding: 0.7rem;    background-color: #FFFFFF;    margin: 0.3rem 0 0.3rem 0;    width: 92%;}
.textckeditor ul li {margin-left: 2.5rem;}
.dropdown-menu > li > table > tbody > tr > td > h2 > a {  font-family: 'Regular';     margin: 0px 0 0px 0; line-height: 2rem;}
.dropdown-menu > li > table > tbody > tr > td > h2  {  margin: 0px 0 0px 0;}
.dropdown-menu > li > table > tbody > tr > td > h3 > a {  font-family: 'Regular'; font-size: 1.1rem;    line-height: 1.4rem; border-bottom: 0.1rem dotted #ababab;}
.dropdown-menu > li > table > tbody > tr > td > h4 > a {  font-size: 1.5rem;    line-height: 1.6rem; margin:0 0 0 0.5rem !important;}
.dropdown-menu > li > table > tbody > tr > td > h4  {  margin:0;}
.menuhome{    border-right: 0.1rem dotted #cccccc; padding:5px 2.5rem!important;}
.dropdown-menu > li > table > tbody > tr > td > hr {    margin-top: 1rem;    margin-bottom: 1rem;    border: 0;    border-top: 0.1rem solid #ababab; }
.dropdown{	font-family: 'Bold', Arial, Helvetica, sans-serif;	font-size: 2rem; color: #55575a; line-height: 1.5rem; margin-top:1rem;    padding: 0rem 1.8rem 3rem 1.8rem; transition: 0.5s; cursor: pointer;}
.dropdown a{color: #55575a}
.borrar{display: block;}
.logo1 {    width: 100%;  max-width: 12rem;    margin-top: 0;    margin-bottom: 0px; transition: 0.5s; height: 9rem; }
.logo2 {    width: 100%;  max-width: 15rem;  margin-top: 1.5rem; margin-bottom: 1rem; transition:0.5s; }
.logoGlobal {    width: 100%;     max-width: 18rem;  margin-top: 0;    margin-bottom: 0px; transition: 0.5s; }

.color_avis_ie { color:#969696; }
.no_veure{    display: none;  }
.texto {	font-family: 'Regular', Arial, Helvetica, sans-serif;	font-size: 1.8rem;	color: #575757;	font-weight: normal;	font-style: normal;	}
.path{font-family: 'Medium', Arial, Helvetica, sans-serif;	font-size: 1.2rem;	color: #f58200!important; line-height: 1.2rem; }
hr.linea { 	width: 100%;	height: 0px;	margin: 0px;	margin-top: 1.2rem;	margin-bottom:1.2rem;	border: 0;	display: flex;	text-align:left;	border-bottom:0.2rem  solid #efefef;}
.nombre {	font-family: 'Regular', Arial, Helvetica, sans-serif;	font-size: 2.4rem;	line-height: 2.8rem;	color: #232323;	font-weight: normal;	font-style: normal; }
.desc {	font-family: 'Regular', Arial, Helvetica, sans-serif;	font-size: 1.5rem;	line-height: 1.9rem;	color: #000;	font-weight: normal;	font-style: normal; }
.data {	font-family: 'Medium', Arial, Helvetica, sans-serif;  font-size: 1.4rem;  line-height: 2.3rem;  color: #323232; border: 1px solid #8D7E1B; padding: 0.5rem 2rem; border-radius: 1rem; display: inline-block;}
.textckeditor img {	width: 100%;	max-width: 50rem;	display: block;	margin: 1rem 0;}
.ideom { float:right; margin-top:4px; margin-left: 10px;}
.ideom > form > .mm-selected a {color: #f58200!important;padding:0 5px;}
.taula {	width: 			100%;	/* width */ 	margin-left:	auto; 	/* align */	border-spacing: 0px;	/* cellspacing */	border-width: 	0px; 	/* border */}
.taula td {	padding: 		0.2rem;	/* cellpadding */}
.taula tr {}
.textckeditor ol{padding-left: 5%;}
.botoError{border:0.2rem  solid #8D7D0E; padding: 0.5rem  2rem; width: 100%; text-transform: uppercase; font-family: 'Medium', Arial, Helvetica, sans-serif; background-color: #fff; float: right; font-size: 1.4rem; color: #323232;transition: 0.6s; margin-bottom: 0.7rem; border-radius: 2rem;}
.botoError:hover{background: #8D7D0E; color: #fff; transition: 0.6s;  -webkit-transition: 0.6s; /* Safari 3.1 to 6.0 */}
.nota{font-family:  'Regular', Arial, Helvetica, sans-serif;   font-size: 1.4rem;  color: #111; text-align: left; font-style: italic; padding-left: 1rem;}
.nota a{ color: #fff!important;}
.menuPrincipal{padding-top: 33px; -webkit-transition:0.5s;-moz-transition:0.5s;-o-transition:0.5s;transition:0.5s;}
.menuPrincipal1{padding-top: 10px!important;transition:0.5s;}
.inputNew{ margin:1rem 0 1rem 0; width:100%; padding: 1rem  2rem; font-family: 'Bold', Arial, Helvetica, sans-serif; font-size: 1.8rem; color:#333;   border:0.2rem  solid #cbcbcb; background-color: transparent;}
.inputNew::placeholder{font-family:  'Regular', Arial, Helvetica, sans-serif;   font-size: 1.5rem;  color: #555; text-align: left; font-style: italic; }
.textareaNew{ margin: 0.3rem 0; width:100%; padding: 0.5rem  2rem; font-family: 'Bold', Arial, Helvetica, sans-serif; font-size: 1.8rem; color:#333;  border: none;  border-bottom:0.2rem  solid #cbcbcb; background-color: transparent;}
.textareaNew::placeholder{font-family:  'Regular', Arial, Helvetica, sans-serif;   font-size: 1.5rem;  color: #555; text-align: left; font-style: italic; }
.mm-amagat{opacity: 0;}
.mm-selected a{color: #333;}
#menuMobile{z-index: 888;}
.missatgeEnviat{font-family: 'Regular', Arial, Helvetica, sans-serif; font-size: 2rem; line-height: 3rem; text-align: center; padding: 2rem; margin: 2rem; font-style: italic; border: 2px solid #f58200;}



.footer {display: grid;grid-template-columns: 65% 1fr;grid-template-rows: 1fr;grid-column-gap: 0px;grid-row-gap: 0px; padding: 0.5rem  0;}
.footer_div1 { grid-area: 1 / 1 / 2 / 2; display: flex; align-items: center;}
.footer_div2 { grid-area: 1 / 2 / 2 / 3; }
.footer a{color: #fff; font-family: 'Medium', Arial, Helvetica, sans-serif; margin-right:3rem; font-size: 1.5rem; line-height:1.4rem;  transition: 0.5s;}
.footer a:hover{color: #ffffff; transition: 0.5s;}
.icoFooter{margin-bottom: 1.5rem; font-size: 2.4rem; line-height: 3rem; font-family: 'Medium', Arial, Helvetica, sans-serif; transition: 0.8s;}
.icoFooter a:hover{color: #fff; transition: 0.8s;}
.serveis {display: grid;grid-template-columns: 1fr; grid-column-gap: 0; grid-row-gap: 0rem;}
.contacte {display: grid;grid-template-columns: 33% 1fr;grid-template-rows: auto;grid-column-gap: 5%;grid-row-gap: 0px;}
.contacte_div1 { grid-area: 1 / 1 / 2 / 2; }
.contacte_div2 { grid-area: 1 / 2 / 2 / 3; }

.acciones-botones {
    display: flex;
    gap: 10px;          /* Espai entre botons */
    margin-top: 15px;
    flex-wrap: wrap;    /* Si no caben en una línia, baixen a la següent */
}

.btn-como-llegar-verde, .btn-resenas-azul {
    flex: 1;            /* Fa que els dos botons tinguin la mateixa amplada */
    min-width: 140px;   /* Amplada mínima per a mòbils petits */
    padding: 12px 8px;
    text-align: center;
    border-radius: 8px;
    text-decoration: none;
    font-weight: bold;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
}

.btn-como-llegar-verde {
    background-color: #27ae60;
}

.btn-resenas-azul {
    background-color: #4285F4; /* Blau corporatiu de Google */
}

/* Efecte en passar el ratolí */
.btn-como-llegar-verde:hover { background-color: #1e8449; }
.btn-resenas-azul:hover { background-color: #357ae8; }

#modal-router{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999999;

    display: flex;
    align-items: center;
    justify-content: center;
}

#modal-overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.65); 
    z-index: 1;
}
#modal-box{
    position: relative;
    z-index: 2;
    width: 98%;
    max-width: 800px;
    background: #fff;
    background-size: cover;

    height: 98%;
    border-radius: 10px;

    display: flex;
    flex-direction: column;

    overflow: hidden; 
}
body.modal-open{
    overflow: hidden;
}
#modal-content{
    
    flex: 1;
    overflow: auto;
    padding: 2% 5%;
    overscroll-behavior: contain;
}

#modal-close{
     padding: 2%;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 20;
    cursor: pointer;
}

#modal-close{float:right; margin-right: 1rem; margin-top: 1rem;}

.iconMinisite{width: 4rem; margin: 0.5rem 3rem 0.5rem 0;}










               

               
.icoHome{width: 4.2rem; position: fixed; top: 0; right: 1rem; background-color: #8D7D0E; padding:1rem; z-index: 888;}

.menuNew {display: grid;grid-template-columns: 20% 1fr 20%;grid-template-rows: 1fr;grid-column-gap: 0px;grid-row-gap: 0px;height: 10rem;background-color: #8D7D0E;
width: 100%;padding: 0 5%;}
.menuNew_div1 { grid-area: 1 / 1 / 2 / 2; }
.menuNew_div2 { grid-area: 1 / 2 / 2 / 3; text-align: center; display: flex; justify-content:center; grid-gap: 2rem; align-items:center; max-height:10rem; }
.menuNew_div3 { grid-area: 1 / 3 / 2 / 4; text-align: right;}

.mm-menu > .mm-navbar { background-color: #323232;}


ul.languageMenu {     position: relative;    clear: both; margin-top:0.2rem;  background-color: #f7f7f7; padding: 0.2rem 1rem; border-radius: 8px; z-index: 55; min-width: 10rem;}
ul.languageMenu a{text-decoration:none; font-weight:normal;}
ul.languageMenu, ul.languageMenu ul, ul.languageMenu li{list-style-type: none;}
ul.languageMenu li {padding-top:0px; text-align: center;}
ul.languageMenu li a{text-decoration:none;font-size:12px; font-family:'Medium', Arial, Helvetica, sans-serif;  text-align:center;}
ul.languageMenu li a:hover {color: #323232; }
ul.languageMenuSub {display: none; position: relative; z-index: 44}
ul.languageMenuSub li { display:block;}
ul.languageMenuSub li a {padding: 0px;margin: 0px;}
ul.languageMenu li:hover ul.languageMenuSub {display: block;text-transform: uppercase;}
ul.languageMenu li:hover ul.languageMenuSub li a {background:none;display: block;border: none; }
ul.languageMenu li:hover ul.languageMenuSub li a:hover{background:none; color:#fff; font-weight:normal; text-decoration:underline}
.languageMenu li:hover > a {color:#FFF;-khtml-border-bottom-right-radius: 4px; -khtml-border-bottom-left-radius: 4px; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px;}
ul.languageMenu .dropdown {background:url('down.svg') no-repeat right 4px; padding-right:12px;}
.selectorIdioma { cursor: pointer; }
.languageMenu img{width: 3rem;}

.botoIdiomes2{border: 0px solid #ccc; color:#323232; transition: 0.7s; background-color: #f7f7f7; display: flex; width: 8rem; align-items: center; margin: 0.5rem auto;}
.botoIdiomes2:hover{background-color: #ebebeb;border: 0px solid #888; transition: 0.7s;}
.mapa{width: 100%; max-width: 60rem; margin: 0 auto;}


.contenedor {padding:0;max-width: 1200px;margin:0 auto; padding: 0; width: 96%;}
.margin2{margin-top: 2%;}
.margin7{margin-top: 7%;}

.paddingBot{padding-bottom: 7%;}
.boxPatrocinadors{background-color: #fff; border-top: 4px solid #8d7d0e;}
.patrocinadors{width: 100%; padding: 0 2rem;}
.patrocinadors .item{display: flex; align-items: center; justify-content: center;}

.patrocinadorsTipus1 .item img{width: 100%; max-height: 7rem;}
.patrocinadorsTipus2 .item img{width: 100%; max-height: 5rem;}

.itemPatrocinador{background-color: #fff; border-radius: 1rem; padding: 1rem; height: 10rem; width:100%; margin: 2rem 0 }
.itemPatrocinadorImg{object-fit: contain; object-position: center; width: 100%; height: 100%; max-height: 12rem;}

.selMunicipi{text-align: center;}
.selMunicipi select { width: 100%; max-width: 50rem; padding: 1rem; border-radius: 8px; border: 2px solid #8D7D0E; background-color: #f1f1f1;       color: #333; cursor: pointer; outline: none; transition: 0.3s ease; font-size:1.4rem;   }
.selMunicipi select:hover { border-color: #8D7D0E; background-color: #fff;    }
.selMunicipi select:focus { box-shadow: 0 0 8px rgba(52,152,219,0.5);    }
.selMunicipi option { background-color: white; color: #333; font-size: 1.4rem;    }
.selMunicipi button { display: block;margin: 1rem auto 0 auto; padding: 1rem 2rem; border: none; border-radius: 8px; background-color: #8D7D0E; color: white !important; cursor: pointer; transition: 0.3s;    }
.selMunicipi button:hover { background-color: #323232; }

.boto{display: inline-block; margin: 3rem auto; text-align: center; color: #fff; background-color: #8D7D0E; padding: 1rem 3rem; border-radius: 3rem; transition: 0.5s;font-size: 1.5rem}
.botoGran{display: inline-block; margin: 3rem auto; text-align: center; color: #fff; background-color: #8D7D0E; padding: 2rem 4rem; border-radius: 4rem; transition: 0.5s; text-transform: uppercase; font-size: 2.4rem; font-family: 'Medium'; letter-spacing: 0.4rem;}
.bototornar{position: absolute; top:12rem; left: 2rem;}
.bototornar img{width: 4rem;}

.botoMesInfo{display: block; margin: 2rem auto 3rem auto; text-align: center; color: #fff; background-color: #fff; padding: 2rem 3rem; border-radius: 1rem; transition: 0.5s;font-size: 1.5rem; border: 2px solid #8D7D0E; color: #323232;}
.botoMesInfo:hover{background-color: #8D7D0E; color: #fff; transition: 0.5s}
a .botoMesInfo:hover {color:#fff !important;}
/* Poblacio ------------------*/

.generalPoblacio{background-image: cover; background-position: center center;}
audio{width: 100%; max-width: 40rem; margin: 2rem auto;}

.llistatBase {  display: grid;  grid-template-columns: repeat(auto-fill, minmax(45%, 1fr));  grid-column-gap: 2rem;  grid-row-gap: 2rem; width: 100%;}
.llistatBase2 {  display: grid;  grid-template-columns: repeat(auto-fill, minmax(45%, 1fr));  grid-column-gap: 2rem;  grid-row-gap: 2rem; width: 100%;}
.llistatBaseMobil {  display: grid;  grid-template-columns: repeat(auto-fill, minmax(45%, 1fr));  grid-column-gap: 2rem;  grid-row-gap: 2rem; width: 100%;}

.quadreLlistat{border-radius: 1rem; background-size: cover; background-position: center; background-color: #eee; display: flex; align-items: center; justify-content: center; min-height: 14rem; text-transform: uppercase;padding: 2rem;border: 2px solid transparent;text-align: center; transition: 0.5s; position: relative; }
.quadreLlistat h2{font-family: 'Bold';color: #fff; font-size: 1.7rem; line-height: 2.3rem; z-index: 5; padding: 1rem; overflow-wrap: break-word;
  word-wrap: break-word; /* Para compatibilidad antigua */}
.quadreLlistat img{object-fit: cover; object-position: center; mix-blend-mode: multiply; width: 100%; height: 100%; position: absolute; top: 0; left: 0; opacity: 0.2; z-index: 1; transition: 0.5s;}

.quadreLlistat:hover{border: 2px solid #8D7D0E; transition: 0.5s; cursor: pointer;}
.quadreLlistat:hover img{opacity: 0; transition: 0.5s;}


.minisite{border: 2px solid #e4e4e4; background-color: #fff;  height: 9rem; min-height: auto; padding: 1rem;}
.minisite img{object-fit: contain; width: 100%; height: 100%;}


.botoGran:hover,
.boto:hover{background-color: #323232; transition: 0.5s;}
.color1{background-color: rgba(132, 117, 13, 0.8) !important;} /* Ocre base */
.color2{background-color: rgba(121, 125, 12, 0.8) !important;} /* Oliva */
.color3{background-color: rgba(101, 124, 12, 0.8) !important;} /* Verde seco */
.color4{background-color: rgba(108, 162, 16, 0.8) !important;} /* Lima oscuro */
.color5{background-color: rgba(140, 145, 17, 0.8) !important;} /* Musgo claro */
.color6{background-color: rgba(131, 97, 15, 0.8) !important;} /* Bronce */
.color7{background-color: rgba(74, 92, 10, 0.8) !important;}  /* Verde Bosque Profundo */
.color8{background-color: rgba(162, 142, 20, 0.8) !important;} /* Dorado Trigo Intenso */


/* ---  Minisites  -------------------------------  */
.titolMinisite{margin: 0 0 0rem 0; text-align: center;}
.subtitolMinisite{font-size: 1.3rem; margin: 0 0 2rem 0; text-align: center; text-transform: uppercase;}
.imgLogoMinisite{border: 2px solid #e4e4e4; padding: 1rem; object-fit: contain; max-height: 15rem; margin-top: 3rem; border-radius:2rem; }

.separador{height: 2px; background-color: #8D7D0E; width: 15rem; margin: 0 auto 1rem auto;}
/*.imgPrincipal{object-fit: cover; width: 100%; max-height: 80vh; border-radius: 2rem;}*/
.imgPrincipal{object-fit: cover; width: 100%; border-radius: 2rem;}
.titolSeccio{font-size: 2rem; color: #8D7D0E; margin: 2rem 0 1rem 0;}

.llistatBaseFotos{  display: grid;  grid-template-columns: repeat(auto-fill, minmax(45%, 1fr));  grid-column-gap: 2rem;  grid-row-gap: 2rem; width: 100%;}
.imgFitxa{object-fit: cover; width: 100%; max-height: 45rem; border-radius: 1rem; margin-bottom: 1rem;}
.peuFoto{font-style: italic; font-size: 1.1rem; line-height: 1.5rem; margin-top: 0.5rem;}

.llistatContinguts{background-size: cover; background-position: center; mix-blend-mode: multiply;}
.imgContingut{width: 100%; height: 100%; position: absolute; top: 0; left: 0; opacity: 0.3; transition: 0.5s;}
.imgContingut2{object-fit: cover; object-position: center; width: 100%; height: 100%; z-index: 1; mix-blend-mode: multiply;}

.imgContingut:hover{opacity: 0; transition: 0.5s}

.llistatCellers{ border-bottom: 2px solid #8D7D0E;padding-bottom:2rem; margin-top:2rem; }

.llistatCellers a{color: #8D7D0E;}

.llistatCellers h3{text-transform: uppercase; font-size: 1.8rem; line-height: 2.4rem;}
.cami{border-top: 4px solid blue;}
.flagMenu{width: 3rem; margin-right: 1.5rem;}

.especialMenu{background-color: #8D7D0E;}
.especialMenu a{color: #fff !important; font-weight: bold;}
.especialXarxes{display: flex !important; justify-content: center; border: transparent !important}

/* Mapa  */

.map-container {    position: relative;    width: 100%;    max-width: 400px;    margin: 20px auto;    aspect-ratio: 1 / 1;    background: #fff;}
.map-layer {    position: absolute;    top: 0; left: 0;    width: 100%; height: 100%;    object-fit: contain;    transition: opacity 0.3s ease;    pointer-events: none;}
#base-map { z-index: 1; }
.province-overlay { z-index: 2; opacity: 0; }
.province-overlay.selected { opacity: 1 !important; z-index: 3; }

/* --- ESTILO DEL TOOLTIP QUE SIGUE AL CURSOR --- */
#map-tooltip {    position: fixed;    padding: 1rem 2rem;    background: rgba(0, 0, 0, 0.85);    color: #fff;   border-radius: 4px;    font-size: 1.3rem;    font-family: sans-serif;    z-index: 999;    display: none;     pointer-events: none;     white-space: nowrap;    box-shadow: 0 2px 8px rgba(0,0,0,0.3);    transform: translate(15px, 15px);}
.map-svg {    position: absolute;    top: 0; left: 0;    width: 100%; height: 100%;    z-index: 10;}
.region {    fill: transparent;    cursor: pointer;    pointer-events: all;}
.map-container:not(.has-selection):has(#path-lleida:hover) #img-lleida,
.map-container:not(.has-selection):has(#path-girona:hover) #img-girona,
.map-container:not(.has-selection):has(#path-barcelona:hover) #img-barcelona,
.map-container:not(.has-selection):has(#path-tarragona:hover) #img-tarragona {
    opacity: 1;
}

/* Final Mapa */

/* idiomes en 2 columnes al menu mobile */

.idiomas-grid-container {    display: grid;    grid-template-columns: repeat(2, 1fr);     gap: 5px 10px;   list-style: none;    padding: 10px 0;}
.idiomas-grid-container li a {    display: flex;    align-items: center;    text-decoration: none;}
.flagMenu {    margin-right: 8px;    width: 2.5rem;}

/* Final idiomes en 2 columnes al menu mobile */


.icoConta{display: flex; align-items: center; justify-content: center; font-weight: bold;}
.icoConta2{ background-color: #FDFAE8; padding:1rem; border-radius: 50%; margin-right:1.5rem;}
.icoConta img{width: 5rem;  transition: 0.5s}
.icoConta:hover .icoConta2{background-color: #8D7D0E;}
.icoConta:hover img{filter: invert(100%); transform: scale(1.1); transition: 0.5s;}


.iconesContacte {display: grid;grid-template-columns: repeat(2, 1fr);grid-template-rows: 1fr;grid-column-gap: 5%;grid-row-gap: 0px;}
.iconesContacte_div1 { grid-area: 1 / 1 / 2 / 2; }
.iconesContacte_div2 { grid-area: 1 / 2 / 2 / 3; }

.llistat2Int {display: grid;grid-template-columns: 1fr 1fr;grid-template-rows: 1fr;grid-row-gap: 10rem; grid-column-gap: 10rem;}
.llistat2Int_div1 { grid-area: 1 / 1 / 2 / 2; }
.llistat2Int_div2 { grid-area: 1 / 2 / 2 / 3; }

.trTitol{border: 1px solid #d4d4d4; padding: 10px; font-weight: 700;}
table.taulaPrivacitat td{ border: 1px solid #d4d4d4; padding: 10px;}


/* Estilo base para el checkbox */
#conformitat {
  appearance: none;
  -webkit-appearance: none;
  width: 2.5rem;             /* Un poco más grande para el check */
  height: 2.5rem;
  border: 2px solid #8D7D0E;
  background-color: transparent;
  display: inline-block;
  vertical-align: middle;  /* Centrado vertical con el texto */
  cursor: pointer;
  position: relative;
  transition: all 0.2s ease;
  padding: 0;
  box-sizing: border-box;  /* Asegura que el borde no afecte el tamaño */
}

/* Estado cuando está marcado */
#conformitat:checked {
  background-color: #28b761;
  border: 2px solid #28b761;
}

/* El "check" blanco que aparece al marcar */
#conformitat:checked::after {
  content: '✓';         
  position: absolute;
  top: 50%;                /* Centrado verticalmente */
  left: 50%;               /* Centrado horizontalmente */
  transform: translate(-50%, -50%); /* Ajuste fino de centrado */
  color: white;            /* Color del check */
  font-size: 1.6rem;         /* Tamaño del símbolo, ajústalo si es necesario */
  font-weight: bold;       /* Para que se vea más claro */
}

button{border: none;}
button::focus{border: none;}
/* Elimina el borde de enfoque tanto en focus como en focus-visible */
input[type="checkbox"]:focus,
input[type="checkbox"]:focus-visible {
    outline: none !important;
    box-shadow: none !important;
    -webkit-appearance: none; /* En algunos navegadores móviles ayuda a limpiar estilos */
}




/*--  Slogan frases  -----------------------*/

.fade-slider {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 120px; /* Altura mínima para que no salte el botón */
}

.fade-text {
  grid-area: 1 / 1;
  opacity: 0;
  font-size: 2rem;
  text-align: center;
  font-family: 'Helvetica', sans-serif;
  color: white;
  /* Duración total: 48s (12 frases * 4s cada una) */
  animation: fadeInOut 36s linear infinite;
}

/* Tiempos de aparición (Sumamos 4s a cada uno) */
.fade-text:nth-child(1)  { animation-delay: 0s; }
.fade-text:nth-child(2)  { animation-delay: 4s; }
.fade-text:nth-child(3)  { animation-delay: 8s; }
.fade-text:nth-child(4)  { animation-delay: 12s; }
.fade-text:nth-child(5)  { animation-delay: 16s; }
.fade-text:nth-child(6)  { animation-delay: 20s; }
.fade-text:nth-child(7)  { animation-delay: 24s; }
.fade-text:nth-child(8)  { animation-delay: 28s; }
.fade-text:nth-child(9)  { animation-delay: 32s; }


@keyframes fadeInOut {
  0%   { opacity: 0; }
  2%   { opacity: 1; }  /* Aparece en el 2% del tiempo total */
  6%   { opacity: 1; }  /* Se mantiene visible */
  8%   { opacity: 0; }  /* Se desvanece antes de que llegue la siguiente */
  100% { opacity: 0; }
}

/*--  Final Slogan frases  -----------------------*/



.llistat3{display: grid;grid-template-columns: repeat(auto-fill, minmax(30rem, 1fr));grid-column-gap: 8rem;grid-row-gap: 5rem; clear: both; }

.boxAj{border: 2px solid #aaa; border-radius: 2rem; padding: 2rem 4rem; transition: 0.5s; background-color: rgba(255, 255, 255, 0.5);}
.boxAj span{font-size: 1.3rem; font-family: 'Medium'; font-weight: bold;}
.boxAj:hover{border: 2px solid #8D7D0E; transition: 0.5s;}
.boxAj:hover a{color: #8D7D0E !important; cursor: pointer; transition: 0.5s; }

/* patrocinadores */
.boxAj.patrocinador {
    border: 2px solid #f5b400;
    background: #fff8e1;
    box-shadow: 0 0 10px rgba(245,180,0,0.3);
}

/* título más destacado */
.boxAj.patrocinador h2 {
    color: #b8860b;
}

.selectFiltres{border: 2px solid #8D7D0E; padding: 1.5rem 2rem; border-radius: 3rem; width:100%; max-width:35rem; }


.fotoNotiLlistat {width: 100%; height: 25rem;}
.fotoNotiLlistat img{width: 100%; height: 100%; object-fit: cover; object-position: center; border: 1px solid #ddd;}

.dadesContacteMinisite {display: grid;grid-template-columns: repeat(2, 1fr);grid-template-rows: 1fr;grid-column-gap: 5rem;grid-row-gap: 2rem;}
.dadesContacteMinisite_div1 { grid-area: 1 / 1 / 2 / 2; }
.dadesContacteMinisite_div2 { grid-area: 1 / 2 / 2 / 3; }
.dadesContacteMinisite .item{margin-bottom: 2rem; display: flex; align-items: center;}


.dadesContacteMinisite .item img{width: 4rem; margin-right: 1.5rem; }


.notiPag {display: grid;grid-template-columns: 55% 1fr;grid-template-rows: 1fr;grid-column-gap: 10rem;grid-row-gap: 0px;}
.notiPag_div1 { grid-area: 1 / 1 / 2 / 2; }
.notiPag_div2 { grid-area: 1 / 2 / 2 / 3; }
.iconsFitxa{width: 5rem; margin: 1rem 0.5rem; transition: 0.5s;}
.iconsFitxa:hover{transform: scale(1.1); transition: 0.5s;}
.imgNotiPag{width:100%; object-fit: cover;  object-position: center; height: 35rem;}


/* Zoom slider */

.contenedor-zoom {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    background-color: #8D7D0E; 
}

.velo-capa {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background-color: rgba(0, 0, 0, 0.4);
    pointer-events: none; 
}

.zoom-reset {
    width: 100%;
    height: 100vh !important;
    object-fit: cover;
    display: block;
    opacity: 0.2; /* Empieza invisible */
    transform: scale(1);
    transition: opacity 0.4s ease-in-out; /* Transición suave de entrada */
}

/* Cuando el slide está activo, activamos zoom y opacidad */
.owl-item.active .zoom-reset {
    opacity: 1;
    animation: zoomLento 16s linear forwards;
}

@keyframes zoomLento {
    from { transform: scale(1); }
    to { transform: scale(1.15); }
}


/* 1. Definir la animación */
@keyframes zoomEfecto {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(1.15);
    }
}

/* 2. Aplicar a la imagen */
.contenedor-zoom .zoom-reset {
    display: block;
    width: 100%;
    height: auto;
    transition: transform 0.4s ease; /* Suaviza el reset */
    backface-visibility: hidden;    /* Mejora rendimiento */
}

/* 3. Clase que activa el movimiento */
.owl-item.active .zoom-reset {
    animation: zoomEfecto 16s linear forwards !important;
}

.dadesInfo{ border: 2px solid #e4e4e4; padding: 2rem; background-color: rgba(255, 255, 255, 0.7); border-radius: 1rem; }

.icoMenu img{width: 4rem; background-color: #8D7D0E; padding: 1rem; border-radius: 1rem; margin-right: 2rem;}
.dadesInfo a{border: 1px solid #ddd; border-radius: 3rem; margin: 1rem 1rem; padding: 0.5rem 2rem; display: inline-flex; transition: 0.5s; background-color: #8D7D0E; color: #fff; font-size: 1.5rem;}
.dadesInfo a:hover{transition: 0.5s; background-color: #fff; border: 1px solid #8D7D0E; color: #8D7D0E; }
.icoMenuMobil{display: none;}
.icoMenuMobil img{width: 3rem; background-color: #8D7D0E; padding: 0.7rem; border-radius: 1rem;}


/*  guia comercial */

select[data-choices-loading] {    visibility: hidden;}
.choices {    z-index: 11 !important; /* Aún más alto que el formulario */}

/* Lista principal */
ul.categoria-acordeon, ul.subcategoria-lista {    list-style: none;    padding-left: 0;    margin: 0;}

/* Margen para las subcategorías */
ul.subcategoria-lista {    padding-left: 0rem;}

/* Estilo de los enlaces */
.item-categoria a {    display: block;    padding: 1rem;    font-size: 1.4rem;    background: #f8f9fa;    border-bottom: 1px solid #ddd;    color: #333;
text-decoration: none;    font-weight: bold;}

/* Estilo para diferenciar subcategorías */
ul.subcategoria-lista a {    background: #ffffff;    font-weight: normal;    font-size: 1.3rem;}

/* Indicador visual de que se puede desplegar */
.item-categoria > a:not(:only-child)::after {    content: url("../imgs/icon/plus.svg");    float: right;    display: inline-block;     width: 1.6rem;         
height: 1.6rem;        }
.item-categoria.abierto > a::after {     content: url("../imgs/icon/minus.svg");}


/*  final guia comercial */


.agenda {display: grid;grid-template-columns: 1fr minmax(150px, 20%);grid-template-rows: 1fr;grid-column-gap: 0px;grid-row-gap: 0px;border: 1px solid #8D7D0E;border-radius: 2rem;
padding: 1rem 2rem;margin-bottom: 2rem;background-color: #fff;}
.agenda_div1 { grid-area: 1 / 1 / 2 / 2; display: flex; align-items: center; }
.agenda_div2 { grid-area: 1 / 2 / 2 / 3; display: flex; align-items: center; }
.imgAgenda{width: 100%; height: 18rem; object-fit: cover; object-position: center; border: 1px solid #ddd; border-radius: 1.5rem; }
.dataAgenda{border: 1px solid #8D7D0E; padding: 0.5rem 2rem; display: inline-flex; border-radius: 3rem; background-color: #f9f9f9; transition: 0.5s;}
.agenda:hover .dataAgenda{background-color: #8D7D0E; color: #fff; transition: 0.5s;}
.agenda:hover {background-color: #FDFAE8;}









@media only screen and (max-width: 1003px){
    .esconderico{       display: inline-block;  }
    .table, .thead, .tbody, .th, .td, .tr {  display: block;  }
    thead tr {          position: absolute;         top: -9999px;       left: -9999px;      }
    .td {           /* Behave  like a "row" */          border: none;       border-bottom: 0.1rem solid #eee;           position: relative;         padding-left: 35%;          min-height:3.5rem;          }
    .td:before {        /* Now like a table header */       position: absolute;         /* Top/left values mimic padding */         top: 0px;       left: 6px;          padding-right: 1rem;        font-weight: bold;          white-space: nowrap;    }
}  

.divCookie {z-index: 999999 !important; display:block; position:fixed;bottom:0;min-height:100%;width:100%;background:rgba(0,0,0,0.8);color:#fff !important;font-size:1.2rem !important;font-family:sans-serif !important;}
.msencajonado{animation-name: example; animation-duration: 4s; animation-delay: -2s; background-color:#fff;padding:2%; max-width:1200px; justify-content: center; align-items: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}

@keyframes example
{
    0% { top:0%; }
    50% { top:1200px; }
}

.msgcookie {width:100%; height: auto; font-size:1.2rem !important; color:#000 !important; margin:0 auto; padding: 2rem; text-align: center; padding-top: 15%;}
.msgcookie p {margin: 0px; font-size:1.3rem !important; line-height: 2rem;}
.msgcookie a:link, .msgcookie a:active, .msgcookie a:visited,.msgcookie a:hover{color:#000}
.msgcookie a.close{float:right;display:block;width:1.6rem;height:5rem;background:url(<?=$URL?>/js/cookies/cookie.png) 0 -45px no-repeat;overflow:hidden;text-indent:- 8rem;opacity:0.5;margin:0 0 0 40px}
.msgcookie a.close{text-indent:-16rem; }
a.close:hover{opacity:1}
a.linkCookies { background-color: rgba(255,255,255,0.60); font-weight: bold; color: #6c7059!important; border-radius: 0rem; padding: 0.4rem 6px; margin-left: 0.5rem ;}
a.linkCookies:hover { background-color: rgba(255,255,255,0.85); color: #6c7059!important;}
.divConfigCookies { background-color: #ebebeb; border-radius: 0rem; margin: 0 auto; min-width: 400px; padding: 2rem 3rem 0px 3rem; font-weight: normal!important; font-size: 1.4rem; text-align: center;    display: inline-block;  width: 100%; margin-bottom: 2rem;}
.unBlocCookies { display: inline-block; margin: 0px 1rem; }
.encaraNoDefinit { opacity: 0.5;    }
@media (max-width: 798px) {.msgcookie{height:65px;}}
@media (max-width: 679px) {.divConfigCookies{min-width: 200px !important;}}
@media (max-width: 573px) {.msgcookie{height:85px;}}
@media (max-width: 450px) {.msgcookie{height:105px;}}
@media (max-width: 371px) {.msgcookie{height:125px;}}
@media (max-width: 31.2rem) {.msgcookie{height:145px;}}
a.notin, .footer a {text-decoration: underline; text-decoration-color: rgba(0, 0, 0, 0.0);}
.infoCurs { display: inline-block;  padding: 8px 1.2rem;    margin-bottom: 1rem;    border-radius: 0rem;    background-color: #fb853b;}
body.cke_editable{font-size: 16px; line-height: 22px}


input.error, select.error, textarea.error {    border: 1px solid red !important;    background-color: rgba(255, 0, 0, 0.05);}
label.error {    font-family: 'Regular';    color: red;    padding: 0 0 1rem 1rem;    font-size: 1.2rem;    line-height: 1.6rem;    font-weight: 400;    margin: 0px 0px 6px 0px;}
.mm-selected a{ color:#212121 !important;   background-color: rgba(0, 0, 0, 0.01);  background-size: cover;}
#conformitat-error {
    position: absolute;
    top: 24px;
    min-width: 220px;
}



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

}  /* Final 1680px */ 


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

}  /* Final 1440px*/ 


@media (max-width: 1366px) {

}  /*Final 1366px*/


@media (max-width: 1280px) {

}  /* Final 1280px*/


@media (max-width: 1150px) {

}  /* Final 1150px*/


@media (max-width: 1024px) {
	.mundial {    width: 100%;    transition: all 1s ease;    position: fixed;    top: 0px;    z-index: 9544;}
	.contenedor {    max-width: 95%;}
	.contacte {display: grid;grid-template-columns: 35% 1fr;grid-template-rows: repeat(2, auto);grid-column-gap: 4%;grid-row-gap: 4%;}
	.contacte_div1 {    background-position: center 30%;}
	.nav > li > a { padding: 0px 0.3rem!important;}
	.logo2{max-width: 15rem;}
	.inputNew{font-size: 1.2rem; }
	.inputNew::placeholder{font-size: 1rem;   }
	.textareaNew{font-size: 1.2rem; }
	.textareaNew::placeholder{  font-size: 1rem; }
	.logosKit{text-align: left}
	.footer a {    margin-right: 2rem;    font-size: 1.2rem;}

}  /* Final 1024px*/

@media (max-width: 1023px) {

	.footer {display: grid;grid-template-columns: repeat(2, 1fr);grid-template-rows: repeat(2, 1fr);grid-column-gap: 0px;grid-row-gap: 0px; }
	.footer_div1 { grid-area: 1 / 1 / 2 / 3; }
	.footer_div2 { grid-area: 2 / 1 / 3 / 2; }
	.footer_div3 { grid-area: 2 / 2 / 3 / 3; text-align: center;}
	.contenedor {    max-width: 88%;}
	.mundial {  position: relative;    top: 0rem;    }
 	.navbar-nav{display:none!important;}
	.mesinfoj {    position: relative;    bottom: 0;    right: 0;    text-align: left; margin-top:20px; }

}  /* Final 1023px*/


 @media screen and (max-width: 768px) {
    .notiPag {display: grid;grid-template-columns: 1fr;grid-template-rows: repeat(2, auto);grid-column-gap: 0px;grid-row-gap: 0;}
    .notiPag_div2 { grid-area: 1 / 1 / 2 / 2; }
    .notiPag_div1 { grid-area: 2 / 1 / 3 / 2; }


}  /* Final 768px*/


@media (max-width: 767px) {
	.bannerMobile{display: block;}
	.mesinfoj {    color: #396a81;    position: relative;    bottom: 0;    right: 0;    text-align: left;    font-family: 'Bold';    font-size: 15px;}
  .mundial {        position: relative;        top: 0rem;        min-height: 25px;    }
	.contacte {display: grid;grid-template-columns: 1fr;grid-template-rows: repeat(4, auto);grid-column-gap: 0px;grid-row-gap: 0px;}
	.contacte_div1 { grid-area: 1 / 1 / 2 / 2; display:none; }
	.contacte_div2 { grid-area: 2 / 1 / 3 / 2; }
	.contacte_div3 { grid-area: 3 / 1 / 4 / 2; }
	.contacte_div4 { grid-area: 4 / 1 / 5 / 2; }

.llistatBase2 {  display: grid;  grid-template-columns: 100%;  grid-column-gap: 0;  grid-row-gap: 2rem;}
.llistatBaseMobil {  display: grid;  grid-template-columns: repeat(auto-fill, minmax(100%, 1fr));  grid-column-gap: 2rem;  grid-row-gap: 2rem; width: 100%;}

.llistat2Int {display: grid;grid-template-columns: 1fr;grid-template-rows: repeat(2, auto);grid-column-gap: 0px;grid-row-gap: 0px;}
.llistat2Int_div1 { grid-area: 1 / 1 / 2 / 2; }
.llistat2Int_div2 { grid-area: 2 / 1 / 3 / 2; }

.iconesContacte  {display: grid;grid-template-columns: 1fr;grid-template-rows: repeat(2, auto);grid-column-gap: 0px;grid-row-gap: 2rem;}
.iconesContacte_div1 { grid-area: 1 / 1 / 2 / 2; }
.iconesContacte_div2 { grid-area: 2 / 1 / 3 / 2; }
.icoConta {justify-content: left;}
.icoConta img{width: 3rem;}

.dadesContacteMinisite {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: repeat(2, auto);
grid-column-gap: 0px;
grid-row-gap: 0px;
}

.dadesContacteMinisite_div1 { grid-area: 1 / 1 / 2 / 2; }
.dadesContacteMinisite_div2 { grid-area: 2 / 1 / 3 / 2; }
.agenda {display: grid;grid-template-columns: 1fr;grid-template-rows: repeat(2, auto);grid-column-gap: 0px;grid-row-gap: 0px;}
.agenda_div1 { grid-area: 1 / 1 / 2 / 2; }
.agenda_div2 { grid-area: 2 / 1 / 3 / 2; }


}  /* Final 767px*/


@media (max-width: 679px) {
  .margin2{margin-top: 5%;}
  .margin7{margin-top: 20%;}
	.fcontact{margin-top:40px;}	
	.flex-caption {bottom: 5rem; max-width: 70%; right: 1rem; }
  .fora{display: none;}
  .bototornar{position: absolute; top:11rem; left: 2rem; font-size: 1.2rem;}
  .bototornar img{width: 2.5rem;}
  .slogan{font-size: 5rem; line-height: 5.5rem; padding: 0 2rem;}
  .videoMobile{max-width: 100% !important;}
  .quadreLlistat {min-height: 20rem;}
  ul.languageMenu {   min-width: 5rem;}

.icoMenu img{display: none;}
.icoMenuMobil{display: block; position: absolute; top:11rem; right: 2rem; font-size: 1.2rem; margin-left: 1rem;}

.dadesInfo a{display: block; text-align: center;}

}  /* Final 679px*/