@charset "utf-8";

/* Medios fluidos sencillos
   Nota: Los medios fluidos exigen la eliminación de los atributos de altura y anchura de los medios del código HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/


img, object, embed, video {
	max-width: 100%;
}
/* IE 6 no admite max-width (anchura máxima), por lo que usa de manera predeterminada una anchura del 100% */
.ie6 img {
	width:100%;
}

/* Diseño móvil: 480 px e inferior. */

/* Algunos de estos valores modifican el css de w3 */

/*.w3-xlarge{font-size:18px!important}
.w3-xxlarge{font-size:24px!important}
.w3-xxxlarge{font-size:28px!important}*/

/* FIN de Algunos de estos valores modifican el css de w3 */

/* COLORES hexadecimales */
/*pirineos: #578899
cols: #E7B13C
Pyrineist: #366560
Castillos: #D51953
Fuentes del Vino: #7A203E
B&W: #64328A */

/* FIN de COLORES hexadecimales */
html {
  scroll-behavior: smooth;
}
#present {
  scroll-margin-top: 60px;
}
#datos {
  scroll-margin-top: 60px;
}
#pictures {
  scroll-margin-top: 60px;
}
#hoteles {
  scroll-margin-top: 60px;
}
#faqs {
  scroll-margin-top: 60px;
}
#tarifas {
  scroll-margin-top: 60px;
}
#hx2 {
  scroll-margin-top: 60px;
}
#enogastro {
  scroll-margin-top: 60px;
}
#mapa {
  scroll-margin-top: 60px;
}
#aboutus {
  scroll-margin-top: 60px;
}

.cols {font-family: Arial, Helvetica, sans-serif; font-size: 1.1em; color:black; }
.and {font-family: Arial, Helvetica, sans-serif; font-size: 0.8em; color:black; }
.sol {font-family: Arial, Helvetica, sans-serif; font-size: 1.1em; color:rgb(231,177,60); }

.fv { font-family:"Eras Medium ITC"; font-size:1.2em; color: rgba(122,32,62,1); text-decoration: none; }
.bs { font-family:"Eras Medium ITC"; font-size:1.2em; color: rgba(87,136,153,1); }
.bsw3 { font-family:"Eras Medium ITC"; font-size:1.0em; color: rgba(87,136,153,1); }
.bsfort  { font-family:"Eras Medium ITC"; 
          font-size:1.15em; 
		      color: rgba(54,101,96,1);
		      font-weight:bold;
		    }
.bsfortbl  { font-family:"Eras Medium ITC"; 
          font-size:1.15em; 
		      color: white;
		      font-weight:bold;
		    }        
.fvcolor { font-family:"Eras Medium ITC"; font-size:1.2em; color: rgba(122,32,62,1); }
.bscolor { font-family:"Eras Medium ITC"; font-size:1.2em; color: rgba(87,136,153,1); }
.bswhite { font-family:"Eras Medium ITC"; font-size:1.3em; color: rgba(255,255,255,0.9); }
.bsneg { font-family:"Eras Medium ITC"; font-size:1.2em; color: black; }

.bsp { font-family:"Eras Medium ITC"; font-size:0.85em; color: rgba(87,136,153,1);
       font-style:italic; }
.teuro { font-family:"Eras Medium ITC"; font-size:1em; color: rgba(80,50,137,1);   }
.mn { font-family:"MISTRAL";
               font-size:1.1em;
			   letter-spacing: 2px; 
			   color: rgba(156,20,95,1);
			      }
.mnb { font-family:"MISTRAL";
               font-size:1.1em;
			   letter-spacing: 2px; 
			   color: rgba(255,255,255,1);
			      }	
.mnbp { font-family:"MISTRAL";
               font-size:1.0em;
			   letter-spacing: 2px; 
			   color: rgba(255,255,255,1);
			      }					  			  
.colorgirls { color: rgba(148,27,128,1);   }
.colorgirlsb { color:#FCF;  }

.pftext {text-decoration:none; color: white;  }	
.pftext a {text-decoration:none; color: white;  }
.prepunto  { font-family: 'Conv_Helvetica-BlackOblique';
             color: rgba(87,136,153,1);
             font-size:0.8em;
              }
.prepuntost  { font-family: 'Conv_Helvetica-BlackOblique';
             color: rgba(87,136,153,1);
             font-size:1.0em;
			  }
.prepuntopy  { font-family: 'Conv_Helvetica-BlackOblique';
             color: rgba(54,101,96,1);
             font-size:0.9em;
}
.prepyg  { font-family: 'Conv_Helvetica-BlackOblique';
             color: rgba(54,101,96,1);
             font-size:1.05em;
}
.pirig  { font-family: 'Conv_Helvetica-BlackOblique';
             color: rgba(40,75,124,1);
             font-size:1.05em;
}
.prepuntobl  { font-family: 'Conv_Helvetica-BlackOblique';
             color: white;
             font-size:1em;
}
.punto2menu  {font-family: 'Conv_neuropolitical_rg';
          color: rgba(122,32,62,1);
		  font-size:1.1em; }
.punto3menu  {font-family: 'Conv_neuropolitical_rg';
          color: rgb(240, 70, 126);
		  font-size:1.1em; } 
.punto4menu  {font-family: 'Conv_neuropolitical_rg';
          color: rgb(73, 1, 25);
		  font-size:1.1em; }            
.puntoblanco  {font-family: 'Conv_neuropolitical_rg';
          color: rgba(255,255,255,1);
		  font-size:1.1em; }
.punto2  {font-family: 'Conv_neuropolitical_rg';
          color: rgba(122,32,62,1);
		  font-size:0.8em; }
.punto2st  {font-family: 'Conv_neuropolitical_rg';
          color: rgba(122,32,62,1);
		  font-size:1.0em; }		  

.cifra1  {color:green;  }
.cifra2  {color:green;  }
.cifra3  {color:blue;   }
.cifra3n  {color:blue; font-weight:bold;   }
.cifra4  {color:red;  }
.cifra4s  { color:rgba(153,0,51,1);  }
.cifra5  { color:yellow;  }
.cifra6  { color:#906;  }
.cifra7  { color:rgba(80,80,80,1);  }
.cifrapyre  { color: rgba(54,101,96,1);  }
.cifra8  { color:black;  }
.cifraitours  { color: rgba(54,101,96,1); font-size:1.1em; font-weight:bold;  }
.cifracry  {color:rgba(213,25,83,1);   }

/* PASAFOTOS MODIFICADO PARA ESQUELETO */
.fluid_container {
    margin: 0 auto;
    max-width: 1670px;
    width: 98%;
    
    /* DEFINICIÓN DEL HUECO (Esqueleto) */
    aspect-ratio: 140 / 84; /* Indica la proporción exacta */
    background-color: #4f7a89; /* El color verde d1 de tu esqueleto */
    
    /* Por si el navegador es muy antiguo, usamos este truco: */
    min-height: 200px; 
    height: auto;
    
    overflow: hidden;
    border-radius: 4px;
}

.pasafotow3 { 
    text-align: center;
    font-family: "Arial", sans-serif;
    font-size: 1.02em;
    /* Añadimos un margen para que no pegue con lo siguiente mientras carga */
    /* min-height: 100px;  */
}
#camera_wrap_1 {
    height: 100% !important;
    min-height: 300px; /* Un mínimo razonable para móviles */
}
@keyframes pulsoEsqueleto {
    0% { background-color: #4f7a89; }
    50% { background-color: #34525b }
    100% { background-color: #4f7a89; }
}

.fluid_container:empty { /* Solo pulsa si está vacío de imágenes */
    animation: pulsoEsqueleto 1.5s infinite;
}
/* FIN PASAFOTOS */

.linea00 {  border-top:0px	solid gray;  clear:both; margin:0px; }
.linea0 {  border-top:1px	solid gray;  clear:both; margin:0px; }
.linea3bs {  border-top:5px	solid rgba(87,136,153,1);  clear:both; margin: 4em 0px 2em 0px; }
.linea1pbs {  border-top:1px	solid rgba(87,136,153,1);  clear:both; margin: 1em 5% 0em 5%; }
@keyframes girandocolor {
			from {transform: rotateY(0deg);    }
			to   {transform: rotateY(-360deg); }
			0% {background: gray; }
	        10% {background: rgba(54,101,96,1); }
	        50% {background: white; }
	       100% {background: gray; }
		}
#girandocolor {
				margin: 20px auto;
				width: 90%;
				padding: 10px;
				height: 40px;
				background-color: rgba(0,0,0,0);
				border: 0px solid #666;
				color: #fff;
				animation-name: girandocolor;
				animation-timing-function: linear;
				animation-iteration-count: infinite;
				animation-duration: 16s;
				transform-style: preserve-3d;
			  }

 /* Popup container PARA POPUP*/
.popup {
  position: relative;
  display: inline-block;
  padding: 5px 2px;
  cursor: pointer;
}

/* The actual popup (appears on top) */
.popup .popuptext {
  visibility: hidden;
  width: 300%;
  background-color: rgba(87,136,153,1);
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 8px 3px;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 0%;
  margin-left: -80px;
}

/* Popup arrow */
.popup .popuptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

/* Toggle this class when clicking on the popup container (hide and show the popup) */
.popup .show {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s
}
/* Add animation (fade in the popup) */
@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
} 
/* FIN PARA POPUP */

/* DESPLEGABLE */
li a, .dropbtn {
    display: inline-block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

li a:hover, .dropdown:hover .dropbtn {
    background-color: rgba(87,136,153,1);
}

li.dropdown {
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: rgba(87,136,153,0.9);
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}

dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
    display: block;
}
li.dropdown2 {
    display: inline-block;
}
.dropdown2:hover .dropdown2-content {
    display: block;
}

li a, .dropbtn2 {
    display: inline-block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}
.dropdown2-content {
    display: none;
    position: absolute;
    background-color: rgba(87,136,153,0.9);
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.dropdown2-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}

dropdown2-content a:hover {background-color: #f1f1f1}

.dropdown2:hover .dropdown2-content {
    display: block;
}
.mega1  {width:400px;max-width:100%;  }
.mega2  {padding:5px 12px;  }

/* FIN DESPLEGABLE */
			 
#indexcabezal { clear: both;
             float: none;
             margin: 2.6em auto 3em auto;
             width: 96%;
             display: block;
             text-align:center;
 /*font-family:"Eras Medium ITC";*/
 font-size:1.0em;
 }	
#indexcabezal h1 { font-family:"Eras Medium ITC"; font-size:1.3em; font-weight:800; text-align:center;  } 
#indexcabezal h2 { font-family:"Eras Medium ITC"; font-size:1.0em; font-weight:600; line-height:1.4em; } 
#indexcabezal h3 { font-family:"Eras Medium ITC"; font-size:1.2em; font-weight:700; line-height:1.5em;   }
#indexcabezal h5 { font-family:"Eras Medium ITC";font-family:Verdana, Geneva, sans-serif;
                   font-size:0.6em; 
				   font-style:italic;  }			   
#indexcabezal img {
	margin: 0.4em auto;
	border: 1px solid black; 
              border-radius: 10px;}
#contenido { clear: both;
 float: none;
 margin: 0.6em auto 3em auto;
 width: 96%;
 display: block;
 text-align:center;
 font-family:"Eras Medium ITC";
 font-size:1.0em;
 }
#contenido h1 {	font-size:1.8em; } 
#contenido h2 {	font-size:1.5em; } 
#contenido h3 { font-size:1.3em; line-height:1.5em;   }
#contenido h5 { font-family:Verdana, Geneva, sans-serif;
                   font-size:0.6em; 
				   font-style:italic;  } 
					  					   			   
.lineasprecios  {font-family: "Eras Medium ITC";
              font-size:0.85em; 
			  line-height:1.2em;
			    }						
.simbolos  {color:white;  }
#phone  {color:white;  }
#instaboo  {color:white;  }



.finacord  { width:100%; display:block; clear: both; float:none; color:rgba(153,0,255,0)  }	
.py { font-family:"Eras Medium ITC"; font-size:0.6em; color: rgba(53,101,96,1); }	

.preciob  {font-family: 'Conv_Helvetica-BlackOblique'; font-size:1em; color: white; display:inline-block;  }	
.precio  {font-family: 'Conv_Helvetica-BlackOblique'; 
          font-size:1em; 
		  color: rgba(122,32,62,1); 
		  display:inline-block;
		  }
.precio2  {font-family: 'Conv_Helvetica-BlackOblique'; 
          font-size:1em; 
		  color: rgba(122,32,62,1); 
		  }		  
.lugares  {font-family: 'Conv_Helvetica-BlackOblique'; font-size:1em; 
           color: rgba(122,32,62,1); 
		   display:inline-block;
		     }
.modalidad  {font-family:"Segoe Print", "Segoe Script";  color: white; font-weight:300; }
.modalidad2  {font-family:"Segoe Print", "Segoe Script";
            font-size:0.9em;
            color:rgba(122,32,62,1);
			      font-weight:700;
			      }
.opcbarraw3 {font-family:"Eras Medium ITC"; font-size:0.9em; color: white;    }
.conf  {font-family:"Eras Medium ITC"; font-size:1.2em; color: blue;  }
.lux  {font-family:"Eras Medium ITC"; font-size:1.2em; color:yellow;   }
.luxscolor  {color:yellow;   }
.lux2  {font-family:"Eras Medium ITC"; font-size:1.2em; color:#ef680e;    }
.luxnegra  {font-family:"Eras Medium ITC"; font-size:1.2em; color:black;   }
.alma  { font-size:1.1em; font-weight:bold; color: rgba(213,25,83,1);  }
.pamplona  { font-family:"Eras Light ITC"; font-size:1.5em; 
              color: white;
              display:inline-block;
              padding: 0.1em 0.4em; background-color:rgba(213,25,83,1); margin: 0.2em auto;
	          border: 1px solid rgba(122,32,62,1); 
              border-radius: 8px;}	
.etapasnoches  { font-family:"Segoe Print", "Segoe Script"; font-size:1.0em; 
              color: white;
              display:inline-block;
              padding: 0.1em 0.4em; background-color:rgba(213,25,83,1); margin: 0.2em auto;
	          border: 1px solid rgba(122,32,62,1); 
              border-radius: 8px;}	
.etapasnoches a  { font-family:"Eras Light ITC"; font-size:1.1em; 
              color: white; text-decoration:none;			  
               }	
.etapasbw  { font-family:"Segoe Print", "Segoe Script"; font-size:1em; 
              color: white;
              display:inline-block; 
              padding: 0.1em 0.4em; background-color:rgba(100,50,138,1); margin: 0.2em auto;
	          border: 1px solid rgba(122,32,62,1); 
              border-radius: 8px;}					 			   			
.perderte  { font-family:"Segoe Print", "Segoe Script"; font-size:0.80em; 
              color: white;
              display:inline-block;
              padding: 0.1em 0.4em; background-color:rgba(213,25,83,1); margin: 0.1em auto;
	          border: 1px solid rgba(122,32,62,1); 
              border-radius: 8px;}	
.tipopamplona  { font-family:"Eras Demi ITC"; color:rgba(213,25,83,1); font-size:1.1em; } 
.irati  { font-family:"Eras Light ITC"; font-size:1.5em; 
              color: white;
              display:inline-block;
              padding: 0.1em 0.4em; background-color:rgba(54,101,96,1); margin: 0.2em auto;
	          border: 1px solid rgba(122,32,62,1); 
              border-radius: 8px;}
.basoakigual  { font-family:"Eras Medium ITC"; font-size:1.1em; 
              color: white;
              display:inline-block;
              padding: 0.1em 0.4em; background-color:rgba(1,1,1,0.8); margin: 0.6em auto;
	          border: 1px solid rgba(1,1,1,1); 
              border-radius: 1px;}			 
.tipoirati  { font-family:"Eras Demi ITC"; color:rgba(54,101,96,1); font-size:1.1em; } 
.tipoirati2  { font-family:"Eras Light ITC"; color:rgba(54,101,96,1); font-size:1.1em; } 
.tipobardenas1  { font-family:"Eras Light ITC"; color:#F30; font-size:1.1em;  } 
.tipobardenas2  { font-family:"Eras Light ITC"; color:rgba(213,25,83,1); font-size:1.1em; } 
.tipobardenas1  { font-family:"Eras Light ITC"; color:#F30; font-size:1.1em;  } 
.tipooasis2  { font-family:"Eras Light ITC"; color:rgba(213,25,83,1); font-size:1.2em; } 
.tipooasis3  { font-family:"Eras Light ITC"; color:rgba(255,160,60,1); font-size:1.2em; } 
.tipooasisblanco  { font-family:"Eras Light ITC"; color:rgba(255,255,255,1); font-size:1.3em; } 
.tipooasisbg  { font-family:"Eras Light ITC"; color:rgba(255,255,255,1); font-size:1.6em; } 
.tipocry  { font-family:"Eras Medium ITC"; color:black; font-size:1.1em; } 			 

/* Acordeon */
.rlAccordion > h3 {
  background-color: rgba(87,136,153,0.9);
  border: 1px solid black;
  border-radius: 3px;
  /*box-shadow: 0 2px 5px rgba(0, 0, 0, 0.55);*/
  color: white;
  font-family: sans-serif;
  font-size: 1.0em;
  font-weight: normal;
  margin: 0 auto;
  padding: 0.5em 1.0em;
  text-decoration: none;
  /*text-shadow: 1px 1px 0 #004E68;*/
}
.rlAccordion > h3 > span {  float: right;  font-family: sans-serif; }/* afecta al + y al - */
.rlAccordion > h3 + div {  display: none;  padding: 2% 5%; }/* afecta al interior de los acordeones */

.itinerarioli {list-style-image: url("icos/arrow-verde.png");
               list-style-position:inside;
               margin: 0;
			         margin-left:0.3em;			   
               padding: 0;
               }
.itinerarioli li { line-height:1.35em; margin-bottom:1.5em; text-align:left;  }
/* fin de acordeon */
		
/* insertado de index.css  */ 		
.notali { margin: 0em 0.5em;  
        font-size:0.90em; 
        font-family:Arial, Helvetica, sans-serif;
		font-style:italic;
		font-weight:bold;
		color: rgba(122,32,62,1);
		line-height:1.1em;
		}
.notaliw3 { margin: 0em 1em;  
        font-size:0.85em; 
        font-family:Arial, Helvetica, sans-serif;
		font-style:italic;
		font-weight:bold;
		color: rgba(122,32,62,1);
		line-height:1.4em!important;
		}		
.notalimin { margin: 0em 0.1em;  
        font-size:0.70em; 
        font-family:Arial, Helvetica, sans-serif;
		font-style:italic;
		font-weight:bold;
		color: rgba(122,32,62,1);
		line-height:1.1em;
		}	
.notaliminbw3 { margin: 0em 1em;  
        font-size:0.70em; 
        /*font-family:Arial, Helvetica, sans-serif;
		font-style:italic;
		color: rgba(122,32,62,1);*/
		}			
.notaliokw3 { margin: 0em 0.6em;  
        font-size:0.85em; 
        font-family:Arial, Helvetica, sans-serif;
		font-style:italic;
		font-weight:bold;
		color: rgba(54,101,96,1);
		line-height:1.4em!important;
		}		
.interespack  { display:block;	    }

.interespack li  { font-family: sans-serif;
                   list-style-image: url("icos/arrow-verde.png");
                   text-align:left;
	               font-size: 0.75em;
		           line-height: 1.3em;
				   margin-left:-1.5em; 
		           margin-bottom:0.8em;   }	
.interespack li a  { padding: 1px; font-style:oblique; font-weight:bold; color:blue;  }
.interespack li	img {display:inline; width: 24px;  }
.resr { color: rgba(122,32,62,1); font-size:1.2em; }
.resr2 { color: rgba(122,32,62,1); font-size:1.1em; text-transform:uppercase; }
.resr3 { color: rgba(122,32,62,1); font-size:1.1em; }
.resr3bl { color: rgb(255, 255, 255); font-size:1.1em; font-weight: 600; }
.resr4 { font-family:Arial, sans-serif; color: rgba(122,32,62,1); font-size:1.1em; font-weight: 400; }
.resaltelilistas  {color: rgba(122,32,62,1); font-size:1.1em; text-transform:uppercase;  }
.lineainterdias { margin:0em 5em 2em 5em;  border-top:1px	solid rgba(122,32,62,1);  clear:both; }	
.cuadrada  {margin: 2em auto;  }			   
.cuadrada img {width:70%;
              height: auto;
              text-align:center;
			  border: 1px solid rgba(3, 0, 1, 1); 
              border-radius: 10px;}
.cuadradaeuro  {margin: 2em auto;  }			   
			 
@keyframes skeleton-pulse {
    0% { background-color: #0a5153; }   /* Color púrpura base */
    50% { background-color: #079264; }  /* Un tono un poco más claro */
    100% { background-color: #0ec6df; }
}			 
.fotoacordeoncentro {text-align:center;
              margin: 1em auto;
              border: 1px solid rgba(0,0,0,1);
              border-radius: 4px;
		          margin-bottom:2em;
              }
.fotoacordeoncentro img  {
	            width: 100%;
              height: auto;
              display: block;
  
  /* Mantenemos tu transform y añadimos opacity y filter */
  transition: transform 0.3s, opacity 0.8s ease-in, filter 0.8s ease-in;
  
  background-color: #1ab3e2; 
  animation: skeleton-pulse 1.5s infinite ease-in-out;
    /* Estado inicial: Invisible y desenfocado */
    opacity: 0; 
    filter: blur(8px); 
    
    /* Añadimos 'filter' a la transición para que el desenfoque desaparezca suavemente */
    transition: opacity 0.8s ease-in, filter 0.8s ease-in, transform 0.5s ease;
	            border: 0px solid black; 
              border-radius: 4px;
			   }
.fotoacordeoncentro img:hover {
  transform: scale(1.05); /* Tu efecto hover sutil */
  opacity: 1;
  filter: blur(0);
}
.fotoacordeoncentro img.loaded {
    opacity: 1;
    filter: blur(0); /* Se vuelve nítida */
    }
		 				 			 		  						  	 				
.puerto  { font-family:"Segoe Print", "Segoe Script";
           text-transform:uppercase;
           font-size:1.1em; 
		      color: rgba(54,101,96,1);
		    	}
.puerton  { font-family:"Segoe Print", "Segoe Script";
           text-transform:uppercase;
           font-size:1.0em; 
		       color: rgba(213,25,83,1);
			}	
.puertonblanco  { font-family:"Segoe Print", "Segoe Script";
           text-transform:uppercase;
           font-size:1.0em; 
		       color: white;
			}		      		 
  /* LIMPIADO CSS HASTA AQUI LIMPIADO CSS HASTA AQUI LIMPIADO CSS HASTA AQUI LIMPIADO CSS HASTA AQUI LIMPIADO CSS HASTA AQUI LIMPIADO CSS HASTA AQUI */
#central {	width: 90%;
	margin: 0 auto 2em auto;
	text-align:justify;
	font-size:1.20em;
}
.contenid { clear: both;
    float: none;
    margin: 0.6em auto 3em auto;
    width: 100%;
    display: block;
    text-align:center;
    font-family:"Eras Medium ITC";    
 } 							
.fotopan  { width: 94%;
          height: auto;
          margin: 1 auto; 
	        border: 4px black; 
          border-radius: 4px;}
.lineab2 {  border-top:5px	solid rgba(87,136,153,1);  clear:both; margin: 0em 0px 2em 0px; }
.lineaf2 {  border-top:5px	solid rgba(122,32,62,1);  clear:both; margin: 0em 0px 2em 0px; }
.lineanav {  border-top:5px	solid rgba(213,25,83,1);  clear:both; margin: 0em 0px 2em 0px; }
.prepuntob  {font-family: 'Conv_Helvetica-BlackOblique';
             color: rgba(87,136,153,1);
			 font-size:1em;
             }
.prepuntof  {font-family: 'Conv_Helvetica-BlackOblique';
             color: rgba(122,32,62,1);
			 font-size:1em;
              }

.titulo  {margin: 1em auto;  }
.titulo h1  {font-family:"Eras Medium ITC"; font-size:2.2em; color: black;  }
.titulo h2  {font-family:"Eras Medium ITC"; font-size:1.5em; color: black;  }
.tiporuta  { font-family:"Segoe Print", "Segoe Script";
	        font-size: 0.9em;
		    margin-left: 10px;
	     	margin-right: 10px;	 }
 
.tuno  { font-family:"Eras Medium ITC"; font-size:1.1em; color: black;  } 
.tdos  { font-family: 'Conv_Helvetica-BlackOblique'; 
         font-size:1.0em; 
		 color: rgba(87,136,153,1);
		 }
.ttres  { font-family: 'Conv_Helvetica-BlackOblique'; 
          font-size:1.2em; 
		  color: rgba(122,32,62,1);  
		  }
.t4  { font-family:"Segoe Print", "Segoe Script"; font-size:1.05em; color: black;  } 		  		 
.testr  { font-family: 'Conv_Helvetica-BlackOblique'; font-size:1.4em; color: #ef680e;  }
.testrp  { font-family: 'Conv_Helvetica-BlackOblique'; font-size:1.2em; color: #ef680e;  }
.tdias  { font-family:"Eras Medium ITC"; font-size:1.1em; color: black;  } 
.h2small  {font-size: 0.8em;  }
.cabhotel  {width: 100%; margin:2em auto;  }
.cabhotel img  {border: 1px solid #333;
			  border-radius: 8px;}
.cabhoteleuro  {width: 100%; margin:2em auto;  }
.cabhoteleuro img  {border: 1px solid rgba(30,50,137,0.9);
			  border-radius: 8px;}
.cabhotelcry  {width: 100%; margin:2em auto;  }
.cabhotelcry img  {border: 1px solid rgba(213,25,83,0.9);
			  border-radius: 8px;}	
.cabhotelis  {width: 100%; margin:2em auto;  }
.cabhotelis img  {border: 1px solid rgba(54,101,96,1);
			  border-radius: 8px;}				 			 			 
.mapsacord  {width: 100%; margin:1.5em auto 0em auto;  }
.mapsacord img  {border: 2px solid #333;
			  border-radius: 8px;}			 
.culinary {  width: 84%;
	margin: 2em auto;
	border-bottom:solid 0px #CCC;
	padding: 1em 1em 2em 1em;
	text-align:center;	
	background-color: rgba(240,215,50,0.2);
	border: 1px solid black; 
  border-radius: 0px 0px 20px 0px;
						  }	
.culinary h2 { font-size: 1.1em;   }
.culinary h3 { font-family:"Segoe Print", "Segoe Script";
	          font-size: 1.0em;
			  color: rgba(122,32,62,1);
			  }				  
.human  { display:block; 
          font-family:"Segoe Print", "Segoe Script";
	      font-size: 1em;
		  line-height:1.4em;  }	
.tariffs { width: 80%;
	margin: 3em auto;
	padding: 4px 4px 8px 4px;
	text-align:center;	 
	background-color: rgba(0,0,0,0.10);
	border: 1px solid black; 
              border-radius: 2px;}
.tariffs h1 { font-family:"Segoe Print", "Segoe Script";
	          font-size: 1.2em;
			  color: rgba(122,32,62,1);   }	
.tariffs h2 { font-size: 1.1em;
              line-height:1.5em;   }
.tariffs h2	a {text-decoration:none;  }	

.tarifasg { width: 80%;
	margin: 3em auto;
	padding: 4px 4px 8px 4px;
	text-align:center;	 
	background-color: rgba(148,27,128,0.1);
	border: 1px solid black; 
              border-radius: 2px;}
.tarifasg h2 { font-size: 1.1em;
              line-height:1.5em;   }
.tarifasg h2	a {text-decoration:none;  }	
.tarifasg h3 {width: 70%; margin: 0.3em auto; font-size: 0.9em;  }	

.resumen {
  padding: 0.4em 0.8em;
  margin-top: 0.5em;
  font-family: sans-serif;
  text-align: center;
  font-size: 1.2em;
  color: black;
  line-height: 1.5em;
}
.cabezalesacordeones {
  padding: 0.4em 0.8em;
  margin-top: 0.5em;
  font-family: sans-serif;
  text-align: center;
  font-size: 1.2em;
  color: black;
  line-height: 1.5em;
}
.logos3 img {width: 30%;  }
   						 	 
.parrafofoto  {	font-family:Verdana, Geneva, sans-serif; font-size:1.2em;   }
.parrafofoto2  { font-family:Verdana, Geneva, sans-serif; font-size:1.4em;   }
.bstfindep  { font-family:"Eras Light ITC"; font-size:1.2em; color: white; 
             display:inline-block;
             padding: 0.1em 0.4em; background-color:#ef680e; margin: 0.2em auto;
	       	border: 2px solid rgba(122,32,62,1); 
              border-radius: 8px;}	
.interps {clear: both;
	float: none;
	margin:0.7em auto;
	width: 85%;
	display: block;
	text-align:center;
	padding: -1.5em 0.6em;	
	border: 1px solid #333;
			  border-radius: 8px;background-color: rgba(87,136,153,0.2);	  }
	
.parrafodeli  {	font-family: sans-serif;
		  text-align:center;
  		  font-size:1.3em;
		  color: black;	  }


.interps p {margin:inherit; font-family:"Segoe Script"; font-size:1.0em; color:black; font-weight:bold; }
.interpseuro {clear: both;
	float: none;
	margin:0.7em auto;
	width: 85%;
	display: block;
	text-align:center;
	padding: -1.5em 0.6em;	
	border: 1px solid #333;
			  border-radius: 8px;background-color: rgba(30,50,137,0.2);	
}
.interpseuro p {margin:inherit; font-family:"Segoe Script"; font-size:1.0em; color:black; font-weight:bold; }
.interpsfdv {clear: both;
	float: none;
	margin:0.7em auto;
	width: 85%;
	display: block;
	text-align:center;
	padding: -1.5em 0.6em;	
	border: 1px solid #333;
			  border-radius: 8px;background-color: rgba(122,32,62,0.2);	
}
.interpsfdv p {margin:inherit; font-family:"Segoe Script"; font-size:1.0em; color:black; font-weight:bold; }
.cifrasetapas {margin:inherit; font-family:"Segoe Script"; font-size:1.0em; color:black; font-weight:bold; }

.etapas  {font-family:'Eras Medium ITC';
	font-size:1.05em;
	font-weight:900;
	border-bottom:solid 0px #CCC;
	margin: 0.5em;
	padding: 2px;
	text-align:center;	
}
.reco  {font-size:0.75em;  }
.reco2  {font-family:"Segoe Script"; font-size:0.85em;  }
.diadia  { text-align:left;   } 
.dia h2 { font-family:"Eras Medium ITC";
              text-align:center;
              font-size: 1.1em;
              line-height:1.5em;   }	   			
.dia img  {  width: 80%;
             margin:1em auto;
			 /*margin: 1em 20% 1em 5%;*/
			  border: 1px solid rgba(0,0,0,1);
			  border-radius: 8px;}	
.dia2  {  text-align:center;   margin: 2em auto;    }	
.dia2 h2 { font-family:"Eras Medium ITC";
              text-align:center;
              font-size: 1.1em;
              line-height:1.5em;   }	   			
.dia2 img  {  width: 80%;
              border: 1px solid rgba(0,0,0,1);
			  border-radius: 8px;}
.resaltedias2 { font-family:"Segoe Print", "Segoe Script";
	            color: rgba(122,32,62,1);    }
.resaltedias2 { font-family:"Segoe Print", "Segoe Script";
	            color: rgba(122,32,62,1);    }									  				  
.resaltedias  {font-size:1.2em; font-weight:900; color: rgba(122,32,62,1); }
.resaltediasplus  {font-size:1.2em; font-weight:900; color: blue;   }
.sub  {font-size:0.9em; font-weight:700; }
.sub2  {font-size:0.9em; font-weight:700; }
.sub3  {font-size:1em;  }
.resalteesp { font-family:"Segoe Print", "Segoe Script";
	            color: rgba(122,32,62,1);
				font-size: 1.7em;    }	
.lugar  { font-family: 'Conv_Helvetica-BlackOblique';
             color: rgba(87,136,153,1);
             font-size:1.1em;
             }
.lugar2  { font-family: 'Conv_Helvetica-BlackOblique';
             color: rgba(87,136,153,1);
             font-size:1em;
             }					 
.resalteli  {font-family:"Eras Medium ITC";
             text-transform:uppercase;
			 font-size:1.0em;
			 font-weight:800;
			 }	

.publicidad  { background-color: rgba(0,0,0,0.1);  }
.publicidadhome  { background-color: rgba(0,0,0,0.1);  }
.publihead  {display:block;  
            float:left; margin: 1em 0em 0.5em 2%;
			font-size: 1.4em;
			}
.publiheadb  {display:block; color:white;  
            float:left; margin: 1em 0em 0.5em 2%;
			font-size: 1.4em;
			}			
.publicidadsippb  { background-color: rgba(87,136,153,0);  }
.publicidadsirpb  { background-color: rgba(122,32,62,0.3);  }			
.colaboradoresppb  { background-color: rgba(87,136,153,0.55);  }
.colaboradoresrpb  { background-color: rgba(122,32,62,0.55);  }
.huecoredesppb  { background-color: rgba(87,136,153,0.75);  }
.huecoredesrpb  { background-color: rgba(122,32,62,0.75);  }
.cromitocentro  { text-align:center; background-color: rgba(213,25,83,0.1);  }
.cromitocentro img  { width: 20%;
                      background-color: white;
                      border: 1px solid black ; 
              border-radius: 10px;}
#resalton {background-color: rgba(125,139,200,0.90);  }
#resalton h3 {color: rgba(255,255,255,1);  }				
#rojosuave {background-color: rgba(122,32,62,0.9);  }
#rojosuave h3 {color: rgba(255,255,255,1);  }
#verdebasoak {background-color: rgba(0,128,64,0.15);  }
.verdebasoakcolor { color: rgba(0,128,64,1); }
 
#vip1 {background-color: rgba(213,25,83,0);
       border: 1px solid black ; 
              border-radius: 10px;}
#vip1 h3 {color: rgba(213,25,83,1);  }
#vipdos {background-color: rgba(213,25,83,0);
       border: 1px solid black ; 
              border-radius: 10px;}	
.vip2   { margin: 0.58em; 
           font-family:"Eras Medium ITC";
           font-size:160%;
		   font-weight:bold; 
		   color: rgba(213,25,83,1);
           text-decoration:none;
		     }
.cabezalcromo  { margin: 0.7em 0.1em; 
           font-family:"Eras Medium ITC";
           font-size:140%;
		   color: rgba(0,0,0,1);
            }
.cabezalcromo2  { margin: 0.7em 0.1em; 
           font-family:"Eras Medium ITC";
           font-size:140%;
		   color: rgba(255,255,255,1);
            }								 
.vipcromo   { margin: 0.58em; 
           font-family:"Eras Light ITC";
           font-size:1.8em;
		   color: yellow;
           }			 
.eurocromo   { margin: 0.3em; 
           font-family:"Eras Light ITC";
           font-size:180%;
		   color: rgba(30,50,137,1);
           text-decoration:none;
		     }	
.eurotipo   { margin: 0.3em; 
           font-family:"Eras Light ITC";
           font-size:1.1em;
		   color: rgba(30,50,137,1);
           text-decoration:none;
		     }				 		 
.eurotipom   { margin: 0.3em; 
           font-family:"Eras Light ITC";
           font-size:1.2em;
		   color: rgba(30,50,137,1);
		   text-transform:uppercase;
            }				 
.cuadrohome {  width: 46%;
	       margin: 2% 1% 2% 2%;
	       padding: 0px;
	       float:left; 
           clear:none;
	       text-align:center;		 
	/*background-color: rgba(122,32,62,0.6);*/
	border: 0px solid black; 
              border-radius: 10px;
            }
.cuadrohome img {  width: 100%;
  height: auto; 
	margin: 0 auto;	
	border-bottom:solid 1px #CCC;
	border: 1px solid black; 
              border-radius: 10px;}
.cuadrohome2 {  width: 46%;
	       margin: 2% 1% 2% 2%;
	       padding: 0px;
	       float:left; 
           clear:none;
	       text-align:center;		 
	background-color: white;
	border: 1px solid black; 
              border-radius: 10px;}
.cuadrohome2 img {  width: 100%; 
	margin: 0 auto;	
	border-bottom:solid 1px #CCC;
	border: 1px solid black; 
              border-radius: 10px;}			  			 			  
.cuadro {  width: 46%;
	       margin: 2% 1% 2% 2%;
	       padding: 3px 3px 3px 3px;
	       float:left; 
           clear:none;
	       text-align:center;		 
	/*background-color: rgba(122,32,62,0.6);*/
	border: 1px solid black; 
              border-radius: 10px;}
.cuadro img {  width: 90%; 
	margin: 0.2em auto;	
	border-bottom:solid 1px #CCC;
	border: 1px solid black; 
              border-radius: 10px;}	
.cuadro h3{	font-family:'Eras Medium ITC'; 
                    font-size:0.9em ;
                    color:rgba(0,0,0,1);  
					}
.publistext	 { display:block; padding: 0 1em; font-size: 1.4em;  }		
.btinfopubli  { display:inline-block;
            font-family:"Eras Light ITC";
		    font-size:1.25em; 
		    color: black;             
		    margin: 0.1em auto 0.1em auto;
            padding: 0.1em 0.4em; 
			background-color: white;
	        border: 1px solid rgba(0,0,0,1); 
              border-radius: 8px;}
.btinfoppb  { display:inline-block;
            font-family:"Eras Light ITC";
		    font-size:1.1em; 
		    color: black;             
		    margin: 0.1em auto 0.4em auto;
            padding: 0.1em 0.4em; 
			background-color: rgba(87,136,153,0.4);
	        border: 1px solid rgba(0,0,0,1); 
              border-radius: 8px;}
.btinforpb  { display:inline-block;
            font-family:"Eras Light ITC";
		    font-size:1.1em; 
		    color: black;             
		    margin: 0.1em auto 0.4em auto;
            padding: 0.1em 0.4em; 
			background-color: rgba(122,32,62,0.6);
	        border: 1px solid rgba(0,0,0,1); 
              border-radius: 8px;}
.up  { display:block;           
		  background-image:url(graficos/cd-top-arrow-verde.svg);
		  background-repeat: no-repeat;
	      background-position: 50% 50%;
	      background-size: contain;		 
		 }	
.uptexto  {	font-family:"Segoe Print", "Segoe Script";  font-size: 1.1em;  }
			   			   
#interesa  {  font-family: sans-serif;
		  text-align:center;
  		  font-size:1.05em;
		  color: black;
		  line-height:1.4em;  }
            		   			
#interesa img  { width: 45%; 
             float: left; 
             margin: 2%;
		     clear:none; 
             /*margin:1em auto;*/
			  border: 1px solid rgba(0,0,0,1);
			  border-radius: 8px;}	
		  
.linkd { display:block; font-size:2em; text-decoration:none;       
		  background-image:url(icos/linkedin-tr-1.png);
		  background-repeat: no-repeat;
	      background-position: 50% 50%;
	      background-size: contain;		 
		 }	   
.linkd a { text-decoration:none;  }	
.h3gordo  {font-size:1.8em; margin:1em 1em;  }
			  
.red1 { clear: none; float: left; margin-top: 1em;  margin-left: 10%;  margin-bottom: 0.9em; width: 40%;         display: block; }
.red2 { clear: none; float: left; margin-top: 1em; margin-left: 5%;  margin-bottom: 0.9em;   width: 40%;         display: block; }
.red3 { clear: both; float: left;  margin-left: 10%;  margin-bottom: 0.9em; width: 40%; display: block; }
.red4 { clear: none; float: left;  margin-left: 5%; margin-bottom: 0.9em; width: 40%;  display: block;  }
.red5 { clear: none; float: left;  margin-left: 10%;  margin-bottom: 0.9em; width: 40%; display: block;  } 

#direcion {	font-size:0.5em; 
            font-family: Verdana, Geneva, sans-serif;
            margin: 0 auto;
            padding-bottom: 0.4em;
            text-align:center;
			/*background-color: rgba(87,136,153,1);*/
			color:white;
}

.barracookies  {font-size:0.8em; background-color: black;
                text-align:center;
				padding: 0.06em;
                color: rgba(231,177,60);
				 }
/* Barra de abajo */
.barrad ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: rgba(87,136,153,1);
}
.barrad li {
    float: left;
}

.barrad li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

/* Change the link color to #111 (black) on hover */
.barrad li a:hover {
    background-color: #111;
}

.icowasap {display:inline-block; width:30px; height:30px; 
            border: 1px solid rgba(255,255,255,1);
			  border-radius: 2px;} 
.miniwasap {display:inline-block; width:16px; height:16px; }

.icotelegram {display:inline-block; 
              font-size:30px; color:blue;
              border: 1px solid rgba(255,255,255,1);
			  border-radius: 2px;} 
.importantcol  { font-family:"Segoe Print", "Segoe Script";
           text-transform:uppercase;
           font-size:1.0em; 
		   color: rgba(231,177,60,1);
			}
.importantcol a { font-family:"Segoe Print", "Segoe Script";
           text-transform:uppercase;
           font-size:1.0em; 
		   color: rgba(231,177,60,1);
		   text-decoration:none;
			}					 
.tjourneyb  { font-family:"OratorStd_0"; font-size:1.0em; color: white;  }
.lineapiri {  border-top:3px	solid rgba(87,136,153,1);  clear:both; margin: 1em 0% 1em 0%; }			   	
.lineacol {  border-top:3px	solid rgba(231,177,60,1);  clear:both; margin: 1em 0% 1em 0%; }
.lineacolplana {  border-top:3px	solid rgba(231,177,60,1);  clear:both; margin: 0%; }
.lineacolcorta {  border-top:3px	solid rgba(231,177,60,1);  clear:both; margin: 1em 5% 1em 5%; }
.lineacol1px {  border-top:1px	solid rgba(231,177,60,1);  clear:both; margin: 1em 5% 0em 5%; }	
.resalteslow  { font-family:"Segoe Print", "Segoe Script";
           text-transform:uppercase;
           font-size:1.1em; 
		   color: rgba(231,177,60,1);
			}

.liexpg  {  font-size: 1.0em; font-weight:bold; color: rgba(122,32,62,1); }	

.eldesierto  {font-family:"Segoe UI Symbol";
             color: rgba(60,60,60,1);
			 font-weight:600;
		     font-size:1.1em; }
.eldesiertog  {font-family:"Segoe UI Symbol";
             color: rgba(60,60,60,1);
			 font-weight:600;
		     font-size:2.2em; }			 
.eldesierto2  {font-family:"Eras Light ITC";
             color: rgba(228,70,46,1);
			 font-weight:400;
		     font-size:1.2em; }	
.eldesierto3  {font-family:"Segoe UI Symbol";
             color: white;
			   font-weight:600;
		     font-size:1.1em; }         		 
		  			   													   			  
/* FIN Barra de abajo */

.w3bloquecentral  {width:100%;
              margin: 0 auto;
              text-align:center;
		      	  font-family:"Eras Medium ITC";
               }
.w3bloqueanchofull  {width:100%; margin: 0 auto;
              text-align:center;
              /*background-color: rgba(122,32,62,0.1);*/              
                }
.w3bloqueanchofull2  {width:100%; margin: 0 auto;
              text-align:center;
              background-color: rgba(0,0,0,0.5);              
                }	

.compimapas { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, 
                 Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
              font-size:1.0em; 
			        font-weight:600; 
			        line-height:1.4em;
             }
.luxbarraw3  {font-family:"Eras Medium ITC"; font-size:1.05em; color:yellow;   }
.colsbarraw3  {font-family:"Eras Demi ITC"; font-size:1em; color:rgb(231,177,60);   }
.tipopamplonaw3  { font-family:"Eras Demi ITC"; color:rgba(213,25,83,1); font-size:1.3em; }	
.lugaresbarraw3  {font-family: 'Conv_Helvetica-BlackOblique'; 
            font-size:0.90em; 
            color: rgb(231,177,60);
		    } 
.lugaresbarraw4  {font-family: 'Conv_Helvetica-BlackOblique'; 
            font-size:0.90em; 
            color: rgb(199, 199, 198);
		    }               
.modalidadw3  {font-family:"Segoe Print", "Segoe Script"; font-size:0.9em;  color: white; font-weight:300; }					
.w3-sidebar .w3-bar-item:hover{ background-color: green; /* Un verde claro */  }

.w3-cell a { text-decoration:none;  }

/* Forzamos que la barra superior esté siempre por encima de fotos y textos */
#myTop {
    z-index: 100 !important; /* Un valor lo bastante alto para tapar a los pies de foto */
}
.botones-esquina-superior-derecha {
  position: fixed!important;
  top: 6px; /* Ajusta este valor para la distancia desde la parte superior */
  right: 20px; /* Ajusta este valor para la distancia desde la derecha */
  z-index: 1000; /* Asegura que los botones estén por encima de otros elementos */
}

.botones-esquina-superior-derecha .w3-bar button {
  margin-left: 0px; /* Espacio entre los botones */
  padding: 4px 10px!important;;
}
.publiheadbw3  {font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, 
                 Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
            font-weight:600; color:white;  
            float:left; 
            margin: 0.5em 1.0em;
		       	font-size: 1.2em;
	      		}
.subpaisajes  { font-family: 'Conv_Helvetica-BlackOblique';
             color: white;
             font-size:0.9em;
}						   
.barradw3 ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: rgba(87,136,153,1);
}

.barradw3 li { float: left; font-family:"Arial"; font-size: 0.8em; }

.barradw3 li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

/* Change the link color to #111 (black) on hover */
.barradw3 li a:hover {
    background-color: #111;
}
.wine {font-family: Arial, Helvetica, sans-serif; font-size: 1.2em; color:rgb(148,30,129); font-weight:900; }
.bike1  {font-family: 'Conv_neuropolitical_rg';  font-size:1.3em; color: rgba(122,32,62,1); font-weight:900; }
.wine2 {font-family: Arial, Helvetica, sans-serif; font-size: 1.0em; color:rgb(148,30,129); font-weight:700; }
.bike2  {font-family: 'Conv_neuropolitical_rg';  font-size:1.0em; color: rgba(122,32,62,1); font-weight:700; }


		 				
/* .piefotow3 {font-family: Helvetica, sans-serif;
              color: rgba(0,0,0,1);
              font-size:0.95em; 
			  font-weight:500;              
			  text-align:center;
			  margin-top:0.5em;
			  padding:0em 1em;
			  line-height:1.2em;
			   }  */
       
.lineaetapasw3 	{font-family: Verdana, sans-serif;
              color: rgba(0,0,0,1);
              font-size:0.9em; 
			  font-weight:500;              
			  text-align:center;
			  margin-top:0.5em;
			  padding:0em 1em;
			  line-height:1.3em;
			   } 
.txentradasacordw3 	{font-family: Verdana, sans-serif;
              color: rgba(0,0,0,1);
              font-size:0.9em; 
			  font-weight:500;              
			  text-align:center;
			  margin-top:0.5em;
			  padding:0em 1em;
			  line-height:1.3em;
			   }
.bloquesleermas {font-family: Verdana, sans-serif;
              color: rgba(0,0,0,1);
              font-size:1.1em; 
			  text-align:center;
			    }
.barratrans {color: rgba(0,0,0,0.1); }	
.tariffs { width: 70%;  }

.titulosenpanelesw3  {  font-size:1.35em !important; 
              color: white;
              display:inline-block;
              padding: 0.3em 0.8em; 
			        margin: 0.2em auto;
	            border: 1px solid rgba(0,0,0,1); 
              border-radius: 4px;transition: all 0.3s;  }	
.titulosenpanelesw3:hover  { 
              transform: scale(1.1);
              box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
              opacity: 0.9;
              cursor: pointer;
               }
.mas-info {
    font-size: 0.7em;
    display: block;
    margin-top: 2px;
    opacity: 0.8;
    font-weight: normal;
    letter-spacing: 0.5px;
}               				 
.notasenzonasw3 {
  font-size: 0.9em;
  font-style: italic;
  width: 80%;
  margin-left: 2em;
  border: 1px solid rgba(0, 0, 0, 1);
  border-radius: 0px 4px 4px 0px;
}
.notasenzonasw3 .notaliw3 {
  font-size: 1.02em;
  }
.contact-options a {
    text-decoration: none !important;
  }	
.w3-cell {
  margin-right: 10px!important;
  margin-bottom: 10px; /* Si también quieres espacio vertical */
}

.w3-cell:last-child {
  margin-right: 0;
}     
.w3-border-flat-midnight-blue {
  border-color: #2c3e50 !important;
  border-left-width: 8px !important;  /* Grosor personalizado (4px es el default) */
  border-left-style: solid !important;
}

/* ===== ESTILOS BASE (MOBILE FIRST) PARA LOS TITLES Y BADGES EN FOTOS ===== */
.custom-title {
  /* Tipografía y caja */
  font-size: clamp(0.9rem, 2.5vw, 1.5rem); /*texto: nunca menor a 0.9rem, ideal 2.5vw, máximo 1.5rem*/
  display: inline-block;
  max-width: 90%;
  padding: clamp(0.5rem, 1.5vw, 1rem) clamp(1rem, 3vw, 1.5rem);
  border-radius: 4px;
  
  /* Color y efectos */
  background-color: inherit;
  color: inherit;
  opacity: 0.85;
  transition: all 0.3s;
}

.custom-badge {
  /* Dimensiones y disposición */
  width: clamp(3rem, 5vw, 3.625rem);
  height: clamp(3rem, 5vw, 3.625rem);
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  
  /* Tipografía */
  font-size: clamp(0.9rem, 4.5vw, 1.5rem);
  
  /* Estilos visuales */
  background-color: inherit;
  border-radius: 50%;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
  opacity: 0.75;
  transition: all 0.3s;
}

/* ===== INTERACCIONES (MOBILE) ===== */
.custom-title:hover {
  transform: scale(1.05);
  opacity: 0.9;
  cursor: default;
}

.custom-badge:hover {
  transform: scale(1.1);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  opacity: 0.9;
  cursor: default;
}
/* Container holding image and text */
/* Estilos base - Mobile First */
.contenedorfotohoteles {
  position: relative;
  overflow: hidden; /* Para contener el efecto zoom */
}

.contenedorfotohoteles img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 0.5s ease; /* Para efecto hover */
}
/* Efectos hover */
.contenedorfotohoteles:hover img {
  transform: scale(1.05); /* Ligero zoom en la imagen */
}

.contenedorfotohoteles:hover .text-block-center {
  opacity: 0.9;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3); /* Sombra para destacar */
}

/* Bottom en bloque y centrado */
.text-block-center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 0.5rem;
  text-align: center;
  color: white;
  width: 46%;
  max-width: 500px;
  transition: all 0.3s ease;
  border-radius: 4px; /* Bordes ligeramente redondeados */
}

.text-block-center h4 {
  font-size: 1.0rem;
  margin: 0 0 0.5rem 0;
  }

.text-block-center p {
  font-size: 0.9rem;
  margin: 0;
}

/* Bottom right text */
.text-block-bottom-right {
  position: absolute;
  bottom: 20px;
  right: 20px;
  padding-left: 20px;
  padding-right: 20px;
  opacity: 0.8;
}
/* Up right text */
.text-block-up-right {
  position: absolute;
  top: 20px;
  right: 20px;
  padding-left: 20px;
  padding-right: 20px;
  opacity: 0.8;
  }



/* HRs con color w3 - en el HTML se pone por ej : <hr class="w3-theme custom-hr4">  */

hr.custom-hr0 {  margin-bottom: 50px!important; height: 0px; /* Grosor personalizado */  border: none;  }
hr.custom-hr1 {  margin: 1em 0!important; height: 1px; /* Grosor personalizado */  border: none;  }
hr.custom-hr2 {  margin: 1em 0!important; height: 2px; /* Grosor personalizado */  border: none;  }
hr.custom-hr3 {  margin: 1em 0!important; height: 3px; /* Grosor personalizado */  border: none;  }
hr.custom-hr4 {  margin: 1em 0!important; height: 4px; /* Grosor personalizado */  border: none;  }
hr.custom-hr5 {  margin: 1em 0!important; height: 5px; /* Grosor personalizado */  border: none;  }

hr.custom-hr0m0 {  margin: 0px!important; height: 0px; /* Grosor personalizado */  border: none;  }
hr.custom-hr1m0 {  margin: 0px!important; height: 1px; /* Grosor personalizado */  border: none;  }
hr.custom-hr2m0 {  margin: 0px!important; height: 2px; /* Grosor personalizado */  border: none;  }
hr.custom-hr3m0 {  margin: 0px!important; height: 3px; /* Grosor personalizado */  border: none;  }
hr.custom-hr4m0 {  margin: 0px!important; height: 4px; /* Grosor personalizado */  border: none;  }
hr.custom-hr5m0 {  margin: 0px!important; height: 5px; /* Grosor personalizado */  border: none;  }
hr.custom-hr9m0 {  margin: 0px!important; height: 9px; /* Grosor personalizado */  border: none;  }

/* MODALS SOBRESCRIBIENDO LOS DE w3 */
.w3-modal {
  display: none;
  opacity: 0;
  transition: opacity 0.3s ease-out;
  z-index:20;
}

.w3-modal-content {
  transform: scale(0.95);
  transition: transform 0.3s ease-out;
}

.w3-modal.w3-show {
  opacity: 1;
}

.w3-modal.w3-show .w3-modal-content {
  transform: scale(1);
}
/* FIN de MODALS SOBRESCRIBIENDO LOS DE w3 */


/* ICONOS CONTACTO Mobile First (default) */
/* Estilos para los botones de contacto con iconos */
.bloquecontactolu { width: 90%; margin: 0 auto; }
.contacto-icono-boton {
  display: inline-block; /* Para que los botones estén en línea horizontalmente */
  /*margin: 4px;*/ /* Espacio entre botones */
}

.contacto-icono-imagen {
  width: 30px;
  margin: 0 6px;
  display: inline-block;
  border: 1px solid rgba(255, 255, 255, 1); /* Borde blanco */
  vertical-align: middle; /* Alinea verticalmente el icono con el texto si lo hubiera */
}

/* fin ICONOS CONTACTO Mobile First (default) */
/* Modal Footer */
.modal-header {
  padding: 2px 16px;
  text-align:center;
}
.micardpie p {
  padding: 8px;  
  text-align:center;
 }
.micardpie a {   text-decoration:none;  }
.textosolo {  font-family: Verdana, Geneva, sans-serif;
              font-size:0.9em; 
			  line-height:1.5em;
			  margin:1em;
			   }
.hotelesw3  {text-transform:uppercase;
        	font-family:"Eras Medium ITC"; 
	        font-size:1.0em;
		    font-weight:800;
		  	 }	
.h1encogido  {  font-size:1.6em; margin: 1em 1em;   }
.h2encogido  {  font-size:1.45em; margin: 0.5em 1em;    }
.h3encogido  {  font-size:1.25em; margin: 0.5em 1em;    }
.w3-border-bottomlupirineos {border-bottom:1px solid rgba(255,255,255,0.4)!important;   }
.cuadradatxiki  { text-align:center;  }			   
.cuadradatxiki img {width:60%;
              height: auto;
              margin: 2em auto!important;
			        border: 1px solid rgba(0,0,0,1); 
              border-radius: 10px;}	
@keyframes pirineos1-pulse {
    0% { background-color: #6193a0; }   
    50% { background-color: #053f57; }  
    100% { background-color: #1cb4f0; }
}

.fotoacordw3 {text-align:center;
          max-width: 1700px;           /* Límite máximo absoluto */
          width: calc(100% - 40px);    /* Margen lateral en móviles/tablets */
          margin: 1em auto 2em;        /* Vertical y centrado */
          border: 1px solid #053f57;  
          border-radius: 4px;
		      box-sizing: border-box;      /* El borde cuenta dentro del ancho */
          overflow: hidden;            /* Opcional: contiene bordes redondeados */
		}
          
.fotoacordw3 img {
  width: 100%;
  height: auto;
  display: block;
    
  /* Mantenemos tu transform y añadimos opacity y filter */
  transition: transform 0.3s, opacity 0.8s ease-in, filter 0.8s ease-in;
  
  background-color: #6318aa; 
  animation: skeleton-pulse 1.5s infinite ease-in-out;
    /* Estado inicial: Invisible y desenfocado */
    opacity: 0; 
    filter: blur(8px); 
    
    /* Añadimos 'filter' a la transición para que el desenfoque desaparezca suavemente */
    transition: opacity 0.8s ease-in, filter 0.8s ease-in, transform 0.5s ease;
}
.fotoacordw3 img:hover {
  transform: scale(1.05); /* Tu efecto hover sutil */
  opacity: 1;
  filter: blur(0);
}
.fotoacordw3 img.loaded {
    opacity: 1;
    filter: blur(0); /* Se vuelve nítida */
}			  
.fcentro {
  width: 100%;
  max-width: 1600px;
  /* El ancho máximo de tu mapa de escritorio */
  margin: 0 auto;
  /* Centrado horizontal */
  overflow: hidden;
}

.fcentro img {
  width: 100%;
  /* En móvil se estira al 100% del ancho */
  height: auto;
  /* Mantiene la proporción */
  display: block;
  margin: 0.5em auto 0.9em auto;
  border: 1px solid black;
}
	 
 .logo-contenedor {
    width: 100%;
    overflow: hidden;
}

.logo-contenedor img {
    width: 100%;
    height: auto;
    display: block;
} 
.mapasmagic {
    border: 1px solid #000 !important;
    border-radius: 4px !important;
    width: 100% !important;
    height: auto !important;
    max-width: 1670px !important; /* mantiene tamaño máximo */
    display: block !important;
    margin: 0 auto !important;
}  
/* ============================================================
   NUEVO SISTEMA DE CARGA Y TARJETAS (Sustituir anteriores)
   ============================================================ */

/* 1. EL MARCO (Contenedor morado) */
.fotoconpietexto, .fotowine {
    text-align: center;
    max-width: 1700px;
    width: calc(100% - 30px);
    margin: 1em auto 2em;
    border: 1px solid #3d5f6b;
    border-radius: 4px;
    overflow: hidden;
    display: flex; 
    flex-direction: column; /* Apila foto arriba y texto abajo */
    background-color: #3d5f6b !important; /* Esqueleto pirineos w3-theme-d3*/
    transition: transform 0.35s ease;
}
.fotoconpietexto .resbw {
    color: #f1e579; /* Un color dorado/amarillo para resaltar sobre el púrpura */
    font-weight: bold;
}



/* 2. EL TEXTO (Con fondo sólido para tapar el morado del marco) */
.piefotow3, .text-block-wine {
    /*background-color: #333 !important; */ /* Fondo gris oscuro SE PODRIA USAR PARA CAMBIAR EL COLOR DEL BLOQUE DE TEXTO */
    color: white !important;
    padding: 15px !important;
    margin: 0 !important;
    z-index: 2; /* Asegura que tape el fondo del padre */
    font-size: 0.85em;
}

/* 3. El pie de foto (Recuperamos su tamaño normal) */
.piefotow3 {
    font-size:0.95em; 
    display: block; /* Aseguramos que sea un bloque independiente */
    margin-top: 0 !important; /* Pegado a la foto */
    line-height: 1.5; /* Devolvemos una altura de línea normal para leer */
}


/* 2. El contenedor (Sin el font-size: 0) */
.conefect {
    display: block;
    width: 100%;
}

.conefect img, .fotowine img {
    /* ESTRUCTURA (Para que pegue con el texto) */
    display: block;
    width: 100%;
    height: auto;
    margin-bottom: 0 !important;
    /* ESTÉTICA (Tu efecto de carga) */
    opacity: 0 !important;
    filter: blur(15px) !important;
    transition: opacity 0.8s ease-out, filter 0.8s ease-out !important;
    will-change: opacity, filter;
}

/* 4. LA IMAGEN CARGADA */
.conefect img.loaded, .fotowine img.loaded {
    opacity: 1 !important;
    filter: blur(0) !important;
}

/* 5. EFECTOS EXTRA (Zoom y Premium) */
.fotoconpietexto:hover, .fotowine:hover {
    transform: scale(1.03);
}

.fotoconpietexto.premium {
    background-color: #1a1a1a !important; /* Esqueleto negro */
    border-color: #d4af37;
}

.fotoconpietexto.premium .piefotow3 {
    background-color: #000 !important;
    color: #d4af37 !important;
}
/* BOTÓN DESCARGAR PIRENEOS.BIKE */
a.descargarficha {
  display: inline-block !important; /* Para que respete márgenes y padding */
  margin: 10px auto;
  padding: 3px 12px !important; /* Un poco más de aire */
  cursor: pointer;
  background-color: #2c3e50 !important; 
  font-size: 0.9em; 
  color: #ffffff !important; /* Fuerza el blanco de la letra */
  border: 1px solid black;
  border-radius: 4px;
  text-decoration: none !important; /* Quita el subrayado azul */
  text-align: center;
  transition: all 0.3s ease;
}

/* Estado Hover (Pasar el ratón) */
a.descargarficha:hover {
  background-color: #554a4e !important;
  color: #ffffff !important;
  text-decoration: none !important;
  box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

/* Limpieza de posibles estilos de W3.CSS o genéricos */
a.descargarficha:active, 
a.descargarficha:focus {
  outline: none !important;
  background-color: #332d2f !important;
}
/* ABOUTs */

.rowabout  { margin-top: 3em;   }
.columnabout {
    width: 100%;
    display: block;
  }
.cardabout {  margin: 2em auto;    }
.cardabout img { margin-top: 1.5em;  width: 86%; height: auto; }

/* Some left and right padding inside the container */
.containerabout {   padding: 0 16px;
}
/* Clear floats */
.containerabout::after, .rowabout::after {
  content: "";
  clear: both;
  display: table;
}

.titleabout {
  color: grey;
}

.buttonabout {
  border: none;
  outline: 0;
  display: inline-block;
  padding: 8px;
  color: white;
 /* background-color: #000;*/
  text-align: center;
  cursor: pointer;
  width: 60%;
}

.buttonabout:hover {
  background-color: #555;
}
.fotocard { width: 75%;    }

/*FIN de ABOUTs*/
/* Botón de LinkedIn profesional */
.linkedin-button {
  background-color: #0077B5 !important; /* Azul oficial de LinkedIn */
  text-decoration: none !important;
  border-radius: 4px;
  transition: all 0.3s ease;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-weight: 600;
  margin-bottom: 1em;
}
.linkedin-button:hover {
  background-color: #005983 !important;
  /* Azul más oscuro al hover */
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 119, 181, 0.3);
}

.linkedin-button i {
  font-size: 1.2em;
}
.varisyweek  { font-family:"Eras Medium ITC"; font-size:1.5em; color: black; 
             display:block;
			 width: 90%;
             padding: 0.2em 0.4em; margin: 1em auto 1em auto;
			 background-color: rgba(122,32,62,0);
	         border: 2px solid rgba(213,25,83,1); 
                }
.entrafotosydatos { font-family:"Segoe Print", "Segoe Script"; 
              font-size:0.9em; 
              color: white;
              display:inline-block;
              margin: 0.8en auto;
              padding: 0.3em 0.8em; 
              background-color:#2c3e50;
              border: 1px solid rgb(2, 2, 2); 
              border-radius: 8px;
		      	 }
.entrafotosydatos .sub { font-family:"Eras Light ITC"; 
              font-size:0.95em;
              color: #e4a622;               
		      	 }	 
.titulo2xh {  font-size: 1.1em; 
              font-weight:600;
              }
.no-hover-no-click {
    pointer-events: none;
    cursor: default;
}              
/* Anula específicamente los estilos hover de w3-button */
.no-hover-no-click:hover {
    background-color: inherit !important;
    color: inherit !important;
}		
.publiheadw3  {font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, 
                 Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
               font-size:1.2em; 
               font-weight:600;  
               float:left; 
               margin: 1em 1.0em 0.4em 1.0em;
			}
.publiheadbw3  {font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, 
                 Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
                 font-weight:600; 
                 color:white;  
                 float:left; 
                 margin: 1em 1.0em 0.4em 1.0em;
		             font-size: 1.2em;
		         	}
.luxlightmarco  {  display:inline-block;
	         padding: 0.0em 0.4em;
	         font-family:"Eras Light ITC"; font-size:1.0em; color:rgba(231,177,60,1);
		       background-color:rgb(39, 37, 37);
			     border: 1px solid black; 
           border-radius: 4px;
			   } 

/* ANIMACION SELO BASOAK */
.sello-container {
    perspective: 1000px;
    display: inline-block;
    margin: 15px 0 30px 0;
}

.sello-basoak {
    background-color: rgb(0, 0, 0);
    color: #ffffff;
    padding: 4px 8px;
    border-radius: 2px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, 
                 Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
    font-weight: 600;
    font-size: 0.85em;
    letter-spacing: 2px;
    text-transform: uppercase;
    border: 1px solid rgba(255, 255, 255, 0.2);
    
    /* CAMBIO CLAVE: "linear" en lugar de cubic-bezier y 8s */
    animation: giroConstante 10s linear infinite;
    
    transform-style: preserve-3d;
    backface-visibility: visible;
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
    position: relative;
    overflow: hidden;
}

@keyframes giroConstante {
    from {
        transform: rotateY(0deg);
    }
    to {
        transform: rotateY(360deg);
    }
}

/* El brillo lo mantenemos, pero también linear para que vaya al compás */
.sello-basoak::after {
    content: "";
    position: absolute;
    top: 0; left: -100%;
    width: 50%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    animation: brilloSello 8s linear infinite;
}

@keyframes brilloSello {
    0% { left: -150%; }
    100% { left: 150%; }
}
/* FIN ANIMACION SELLO BASOAK */
.tjourneymarcop  { font-family:"OratorStd_0"; font-size:0.8em; color: black;
             display:inline-block;
             padding: 0.5em 0.5em 0.1em 0.5em; background-color:rgba(231,177,60,0.4); margin: 0.5em auto;
	          	border: 1px solid rgba(0,0,0,1); 
              border-radius: 8px;
						   }
#mySidebar 	{ z-index: 102!important; }
/* TODO TABLET */

/* Diseño tableta: de 660 px a 992 px. Hereda estilos de: Diseño móvil. */

@media only screen and (min-width: 660px) {
	
.titulosenpanelesw3  {  font-size:1.5em !important; 
                        padding: 0.4em 1.1em; }
.notasenzonasw3  {  font-size:0.95em; width:78%; margin-left:3em; }
.notasenzonasw3 .notaliw3 { font-size:1.1em;  }  
.lineaetapasw3 	{ font-size:1.0em; font-weight:500;    }	
.txentradasacordw3 	{ font-size:1.1em; font-weight:500;    }
.bloquesleermas 	{ font-size:1.0em;    }
#indexcabezal {
	clear: both;
	float: none;
    margin: 3em auto 3em auto;
	width: 92%;
	display: block;
	font-size:1.2em;
}

#indexcabezal h1 {	font-size:1.2em;  }
#indexcabezal h2 {	font-size:1.05em;  }
.teuro {  font-size:1.1em;  }

.prepunto  {  font-size:0.95em;  }
.prepuntost  {  font-size:1.15em;  }
.punto2  {	  font-size:0.95em; }
.punto2st  { font-size:1.05em; }
.lugar  {font-size:1.2em;   }
.lugar2  {font-size:1em;   }

#contenido {
	clear: both;
	float: none;
    margin: 0 auto 3em auto;
	width: 92%;
	display: block;
	font-size:1.2em;
}

.lineasprecios  {font-size:0.95em; line-height:1.2em;    }	
.etapas  {	font-size:1.1em;  }
			 
.eurocromo   {  font-size:150%;    }
.cabezalcromo  {  font-size:120%;  }
.cabezalcromo2  {  font-size:120%;  }

.botongpx {	margin:0em 1em 3em 2.5em;	width: 38%;  }
.py { font-size:0.95em;  }
.buttond  {width:45%;    }
.btmasinfo  {width:20%;  }
.notali { font-size:0.85em; }
.notalimin { font-size:0.65em; }
.lineainterdias {margin:1.5em 5em 2em 5em; }
.cuadrada  {margin: 2em auto;  }			   
.cuadrada img {width:60%;   }

/* texto expandible*/					
.mastexto { font-size:1.2em; font-weight:500; line-height:1.4em;  }	
/* fin de texto expandible*/
	
#central {width: 100%; margin:0em 0em 2em 2em; float:none;  }
#central img {width: 80%; margin-bottom:2em;   }
.contenid {	 margin: 0em auto 3em auto;	width: 100%;  }
.contenid h1 {	font-size:2.3em; }
.prepuntob  {  font-size:1.45em;  }
.prepuntof  {  font-size:1.45em;  }

.fotocentropeq { width: 50%; margin: 2em auto;  }

.titulo  {margin: 2em auto;  }

.tuno  { font-size:1.3em;  }
.tdos  { font-size:1.2em;  }
.ttres  { font-size:1.5em;  }
.testr  { font-size:1.6em;  }
.testrp  { font-size:1.3em;  }
.t4  { font-size:1.15em;  }
.tdias  { font-size:1.4em;  } 

 
.pamplona  { font-size:1.4em;              
             padding: 0.3em 0.4em;  margin: 0.2em auto;
	         }
.etapasnoches  { font-size:1.0em;              
             padding: 0.3em 0.6em;  margin: 0.2em auto;
	         }
 
			 			 
.irati  { font-size:1.4em;              
             padding: 0.3em 0.4em;  margin: 0.2em auto;
	         }
 			 	
.cabhotel  {margin:2.4em auto;  }
.cabhoteleuro  {margin:2.4em auto;  }
.mapsacord  {margin:2em auto 0em auto;   }
.tariffs h2 { font-weight:500;  }
.resumen  {margin-top:1em;
          font-size:1.1em;		  
		  line-height:1.7em;
		    }
.interps {	width: 75%;  }
.interps p  {font-size:1.0em;  }
.etapas  {	font-size:1.05em;  }
.reco  {font-size:0.9em;  }
.reco2  {font-size:0.9em;  }
.dia h2 { font-size: 1.0em; font-weight:300;  }
.dia img  { width: 45%; 
            float: left; 
            margin: 2%;
		    clear:none; 
			}
.dia2 h2 { font-size: 1.0em; font-weight:300;  }
.dia2 img  { width: 90%; 
            float: none; 
            margin: 2%;
		    clear:none; 
			}			
.visitas img  { width: 45%; float:none; clear:both;	text-align:center;  }			
			
.lineainterdias {margin:1.5em 5em 2em 5em; }
.interespack  { font-size:0.95em;    }			
.interespack li  { font-size: 0.95em; line-height: 1.3em; margin-bottom: 0.7em; }
.resalteli  {font-size:1.1em; font-weight:800;  }
.parrafofoto  {	font-size:0.95em;   }
.parrafodeli  {	font-size:1.15em;   }
.parrafofoto2  { font-size:1.15em;   } 
.resalteesp { 	font-size: 1.4em;   }
.fotopan img { width: 94%;  margin: 0 auto;   }


.cuadrohome {  width: 21.5%;
           margin: 2% 0.5% 2% 2.5%;
           float:left; 
           clear:none;
           }
.cuadrohome2 {  width: 21.5%;
           margin: 2% 0.5% 2% 2.5%; 
           float:left; 
           clear:none;
           }
.cuadro {  width: 28.5%;  
           margin: 2% 1% 2% 3%; 
           float:left; 
           clear:none;
           }
.cuadro h3{	  font-size:1.0em ; }

.cuadrow {  width: 46%;
	       margin: 2% 1% 2% 2%;
	       padding: 3px 3px 3px 3px;
	       float:left; 
           clear:none;
		   font-size:1em;	
	       }

.cuadrow h3{   font-size:0.9em ; }           
					
.logos3 img {width: 20%;  }
		   
#interesa  { margin-top:4em;  font-size:1.1em;   }
#interesa img  {   width: 31%; margin: 1%;  }			
.linea1pbs {  border-top:1px	solid rgba(87,136,153,1);  clear:both; margin: 1em 1% 1.5em 1%; }								   

.red1 {clear: none;  float: left;  margin-left: 5%;  width: 20%;  display: block;  }
.red2 {clear: none;  float: left;  margin-left: 5%;  width: 20%;  display: block;  }
.red3 {clear: none;  float: left;  margin-top: 1em; margin-left: 5%;  width: 20%;  display: block;  }
.red4 {clear: none;  float: left;  margin-top: 1em; margin-left: 0%;  width: 20%;  display: block;  }
.red5 {clear: none;  float: left;  margin-left: 5%;  width: 20%;  display: block;  }	
						  
#pie { margin-top: 3em; 	}

/*footer p { font-size:0.7em;	  }	*/	
				 									 			 											
.w3bloquecentral  {width:98%;
              margin: 0 auto;
              text-align:center;
			  }
			   
.w3bloqueanchofull  {width:100%;  	  }	
.w3bloqueanchofull2  {width:100%;  	  }			  
.compimapas { font-size:1.0em; }
.publiheadw3  {	font-size: 1.4em;
			}
.publiheadbw3  {font-size: 1.6em; 	}					  																											
.tjourneyb  { font-size:0.9em;  } 
.cromitocentro img  { width: 12%;
                      background-color: white;
                      border: 1px solid black ; 
              border-radius: 10px;}
.piefotow3 { font-size:0.9em; 
             line-height:1.5em;
              } 
.bloquecontactolu { width: 70%;  }

#direcion {	font-size:0.7em; 
            padding-bottom: 0.4em;
            }
.text-block-center {
    padding: 1.0rem 0.3rem;
    width: 36%;
    }
  
.text-block-center h4 {font-size: 1.6rem;  }
.text-block-center p {font-size: 1.1rem;  }
.textosolo { font-size:1.02em;
             line-height:1.8em;   }
.hotelesw3  { font-size:1.1em; margin-bottom: 1.5em;  	 } 
.h1encogido  {  font-size:2.05em;    }	
.h2encogido  {  font-size:1.75em;    }
.h3encogido  {  font-size:1.45em;    }	
.cuadradatxiki  { text-align:center;  }			   
.cuadradatxiki img {width:40%;
              margin: 2em auto!important;
			  border: 1px solid rgba(0,0,0,1); 
              border-radius: 10px;}		
.varisyweek  { margin: 1em auto; font-size:2.2em;  }	
.entrafotosydatos {font-size:1.2em;   
              margin: 1.28en auto;
		      	 }
.entrafotosydatos .sub { font-size:1.25em;  }	   		              	


 .read-more-text  { font-size:1.10em;  }	
 .etp {font-size:0.8em;  }   
 .perderte {
   font-size: 0.85em;
   }
/* .tjourneymarcop  { font-size:0.95em; } */
 }

 /* TODO ESCRITORIO */
/* Diseño escritorio: de 992 px hasta un máximo de 1920 px.  Hereda estilos de: Diseño móvil y Diseño tableta. */

@media only screen and (min-width: 992px) {

#indexcabezal {
    clear: both;
    float: none;
    margin: 0 auto 3em auto;
    width: 79.5918%;
    display: block;
  }
#indexcabezal h1 {	font-size:1.4em;  }
#indexcabezal h2 {	font-size:1.05em;  }

#contenido { clear: both;   
             float: none;
             margin: 0 auto 3em auto;   
			 width: 79.5918%;   
			 display: block;
}

#contenidop {  clear: both;   
               float: none;
               margin: 0 auto 3em auto;   
			   width: 84%;   
			   display: block;
}
	 
.botongpx {	width: 38%;  }
.buttond  {width:22%; margin:1em 1%;  }


.notali { font-size:0.8em; }
.notalimin { font-size:0.7em; }
.interespack li  { font-size: 1.0em; line-height: 1.5em; margin-bottom: 1em; }

.vip2   {  font-size:180%;  }
.vip3   {  font-size:180%;  }
.eurocromo   {  font-size:180%;    }
.vipcromo   {  font-size:1.6em;    }
.cabezalcromo  {  font-size:135%;  }
.cabezalcromo2  {  font-size:135%;  }	
.btmasinfo  {width:15%;  }
.logoByFSer { display:none;  }
.logoByFgSer  {display: block; width: 90%; margin: 5em auto 0em auto; text-align:center;  }
.contenid { width: 100%;   }
.contenid h1 {	font-size:2.55em;  }
.prepuntob  {  font-size:1.6em;  }.prepunto2  {  font-size:1.6em;  }
.prepuntof  {  font-size:1.6em;  } 

.titulo  {margin: 2.5em auto;  }
.tuno  { font-size:1.5em;  }
.tdos  { font-size:1.5em;  }
.ttres  { font-size:1.9em;  } 
.t4  { font-size:1.5em;  }
.testr  { font-size:1.85em;  }
.testrp  { font-size:1.45em;  }
.tdias  { font-size:1.5em;  }

.pamplona  { font-size:1.7em;              
             padding: 0.35em 0.4em;  margin: 0.2em auto;
	         }
.etapasnoches  { font-size:1.05em;              
             padding: 0.35em 0.6em;  margin: 0.2em auto;
	         }	
		 		 
.perderte  { font-size:0.95em;      }
		 			 			 
.irati  { font-size:2.0em;              
             padding: 0.35em 0.4em;  
			 margin: 0.2em auto;
	         }
		 				 	
.resalteli  {font-size:1.25em; font-weight:800;  }				 
.culinary  {width: 90%;  }
.tariffs  {width: 80%;  }
.tarifasg  {width: 70%;  }

.dia img  {   width: 31%; margin: 1%;  }
.dia2 img  {   width: 85%; margin: 1%;  }
.fotopan img { width: 94%;  margin: 0 auto;   }
.cuadrohome {  width: 21.5%;
           margin: 2% 0.5% 2% 2.5%;
            }
.cuadrohome2 {  width: 21.5%;
           margin: 2% 0.5% 2% 2.5%;
            }		   	
.cuadro {  width: 21.5%;
           margin: 2% 0.5% 2% 2.5%;
           float:left;
           clear:none;
           }
.cuadrow {  width: 28.5%;  
           margin: 2% 1% 2% 3%; 
           float:left; 
           clear:none;
           }
.publistext	 {	font-size: 1.75em;  }
.cromitocentro img  { width: 12%;    }	
#interesa  { font-size:1.0em;  }
#interesa img  {   width: 31%; margin: 1%;  }
.sub2  {font-size:1.1em; font-weight:700; }
			 
#direcion {	font-size:0.75em;  }
.tjourneyb  { font-size:0.95em;  }
.bstfindep  { font-size:1.4em;              
             padding: 0.1em 0.4em;  
			 margin: 0.2em auto;
	         }
/*footer p { font-size:0.85em;	  }	*/

.w3bloquecentral  {width:96%;       
			  }
.compimapas { font-size:1.1em; }		  	 
.lugaresbarraw3  { font-size:0.90em;   }
.publiheadw3  {	font-size: 1.6em;
			}
.publiheadbw3  {font-size: 1.8em; 	}	
.tariffs { width: 60%;  }
.titulosenpanelesw3  {  font-size:1.35em; padding: 0.6em 1.3em; }	

.custom-title:hover {
    transform: scale(1.08); /* Efecto más pronunciado en pantallas grandes */
  }
  
.custom-badge:hover {transform: scale(1.15);  }	
.bloquecontactolu { width: 76%;  }
 .text-block-center {
    padding: 1.1rem;
    width: 35%;
  }
.text-block-center h4 {font-size: 1.7rem;  }
.text-block-center p {font-size: 1.1rem;  }	  	 
.hotelesw3  {font-size:1.25em;  	 }	

/* ===== EFECTO FADE+BLUR COMPLETO ===== */
/* Solo para contenedores con: class="con-efecto-fade" */

.con-efecto-fade {
    /* Contenedor preparado */
    position: relative;
    display: block;
    overflow: hidden;
}

/* ESTADO INICIAL - Imágenes dentro de .con-efecto-fade */
.con-efecto-fade img.fade-pendiente {
    /* 1. FONDO VISIBLE */
    background-color: #086374 !important;
    box-shadow: inset 0 0 0 100vw #086374 !important;
    
    /* 2. EFECTOS VISUALES */
    opacity: 0 !important;
    filter: blur(10px) !important;
    
    /* 3. TRANSICIÓN (ajustable) */
    transition: opacity 1.8s ease-out, filter 2.2s ease-out, box-shadow 1.8s ease-out !important;
    transition-delay: 0.1s !important;
    
    /* 4. ASEGURAR DISPLAY */
    display: block !important;
    max-width: 100% !important;
    height: auto !important;
    
    /* 5. PREVENIR CONFLICTOS */
    background-image: none !important;
    border: none !important;
    outline: none !important;
}

/* ESTADO FINAL */
.con-efecto-fade img.fade-completado {
    opacity: 1 !important;
    filter: blur(0) !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

/* VARIANTES DE VELOCIDAD (opcional) */
.con-efecto-fade.efecto-rapido img.fade-pendiente {
    transition-duration: 0.4s, 0.6s, 0.4s !important;
}

.con-efecto-fade.efecto-lento img.fade-pendiente {
    transition-duration: 1.2s, 1.8s, 1.2s !important;
}
.entrafotosydatos  { font-size:1.10em;       
                     margin: 1.5em auto;
	                 }	
 .entrafotosydatos .sub { font-size:1.10em;  }	
 .read-more-text  { font-size:1.10em;  }	
}

/* TODO FIN */