@charset "utf-8";/* Sinatar en Core 10 */
:root {
	--modulo:calc(var(--anchomax) / 12 / 12);	
	--radio:calc(var(--modulo) * 2);	
	--calle:calc(var(--modulo) * 2);
	--grilla:calc(var(--anchomax) / 12);
	--gris-50: rgb(248, 248, 248);  
	--gris-100: rgb(234, 234, 234);  
	--gris-200: rgb(216, 216, 216);  
	--gris-300: rgb(186, 186, 186);  
	--gris-400: rgb(170, 170, 170);  
	--gris-500: rgb(155, 155, 155);  
	--gris-600: rgb(102, 102, 102);  
	--gris-700: rgb(59, 59, 59);  
	--gris-800: rgb(41, 41, 41);  
	--gris-900: rgb(27, 27, 27);
}
.esquema {display: flex;align-items: center;gap:3px;padding:5px;}
.esquema > div {width: 32px;height: 32px; border: 1px solid var(--gris-500);}
.esquema > div:last-child {margin-right: 0;}

.fondo-principal {background: var(--fondo-principal);}
.fondo-secundario {background: var(--fondo-secundario);}
.fondo-oscuro {background: var(--fondo-oscuro);}

.paleta-1 {background: var(--paleta-1);}
.paleta-2 {background: var(--paleta-2);}
.paleta-3 {background: var(--paleta-3);}
.paleta-principal {background: var(--paleta-principal);}
.paleta-oscuro {background: var(--paleta-oscuro);}

.gris-50 {background: var(--gris-50);}
.gris-100 {background: var(--gris-100);}
.gris-200 {background: var(--gris-200);}
.gris-300 {background: var(--gris-300);}
.gris-400 {background: var(--gris-400);}
.gris-500 {background: var(--gris-500);}
.gris-600 {background: var(--gris-600);}
.gris-700 {background: var(--gris-700);}
.gris-800 {background: var(--gris-800);}
.gris-900 {background: var(--gris-900);}
.texto-50 {color: var(--gris-50);}
.texto-100 {color: var(--gris-100);}
.texto-200 {color: var(--gris-200);}
.texto-300 {color: var(--gris-300);}
.texto-400 {color: var(--gris-400);}
.texto-500 {color: var(--gris-500);}
.texto-600 {color: var(--gris-600);}
.texto-700 {color: var(--gris-700);}
.texto-800 {color: var(--gris-800);}
.texto-900 {color: var(--gris-900);}

body{overflow-x: hidden; font-family: Roboto, sans-serif;font-size: 16px;line-height: 1.15;}


* {margin:0;padding:0;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
h1 a,h4 a{text-decoration:none;}
h3 {margin: var(--calle) 0;}
h4{width: fit-content;}
h4 a{padding-right:.25rem;width: fit-content;}
main {display: flex;justify-content: center;align-items: center;width: 100vw;}
.columna article{height:100%;width: 100%;position:relative;display: flex; flex-direction:column;overflow: hidden;}
.columna article figure > * {width: 100%;height: 100%;display: flex;}
.columna article figure div, .columna article figure div picture {width: 100%;height: 100%;display: flex;position:relative;}
.columna article figure div picture img {width:100%;height:100%;object-fit:cover;z-index:0;object-position:50% 30%;display: block;}

header > div.container{display:flex; flex-direction:column;}
header > div.container > div{display:flex;gap: 1vw;align-items: center;position: relative;}
header{width:100%; z-index:26559205}
header * {transition:all 0.3s ease;}
header{position:sticky;top:0;}
header.pegado{}

header nav {opacity: 1;height: inherit;}
header ul,header ol {display: flex;justify-content: flex-start;align-items: center;padding: 0 15px;}
header ul li,header ol li {padding: var(--modulo);list-style:none;position: relative;height: 100%;display: flex;align-items: center;}

.Aside1,.Aside2,.Aside3,.Aside4,.Aside5,.Aside0{height:100%;}

.data {display:grid;column-gap: var(--modulo);}
.data .icono {grid-column: 1 / 2;grid-row: 1 / 3;text-align: center;align-self: center;}
.data :first-child{grid-column: 2 / 3 ;grid-row: 1 / 2 ;align-self: end;}
.data :nth-child(3){grid-column: 2 / 3 ;grid-row: 2 / 3 ;align-self: start;}



header a,footer a {display: flex;}
nav svg {cursor:pointer;}
nav {
  z-index: 100 !important;
}
svg path {pointer-events:none;}
.header-search-container {
  position: absolute;
  width: 100%;
  display: flex;
  align-items: center;
  padding: var(--calle);
  gap: var(--calle);
  top: 0;
  left: 0;
  height: 100%;
}
#contenedor_buscar {
  position: relative;
}

.header-search-form {
  display: flex;
  align-items: center;
  position: relative;
  flex:1;
}
.header-search-form ion-icon.md.hydrated{
  position:absolute;
  left:0; 
  pointer-events:none;
}
.search-text {
	box-sizing: border-box;
	height: auto;
	background: none;
	padding: var(--modulo);
	cursor: pointer;
	width: 100%;
}
.search-text:focus {
  border:none;
  border-bottom:1px solid var(--gris-50);
}
.search-text:focus-visible {
  outline: none;
}
.search-submit {
  display: none;
}

footer > div.container{display:flex; flex-direction:column;}
footer > div.container > div{display:flex;gap: 1vw;align-items: center;position: relative;}

/* todos los articles tienen calle en la grilla en el sector por defecto */
.defecto.sector .columna article {
  margin: var(--calle);height: calc(100% - var(--calle) * 2);width: calc(100% - var(--calle) * 2);}

.columna article {
  margin: var(--calle);height: calc(100% - var(--calle) * 2);width: calc(100% - var(--calle) * 2);}

/* normal (titulo abajo)*/
.normal article figure {overflow: hidden;position: relative;}
.normal .contenido {
  display: flex;
  flex-direction: column;
  padding: var(--calle);
  row-gap: .35rem;
}
.normal .contenido p{display:none;}

/* caja (titulo arriba)*/
.caja figure::before {content: '';position: absolute;top: 0;z-index: 10;width: 0;height: 0;}
.caja .contenido {display: flex;order: 0;flex-direction: column;padding: var(--calle);row-gap: .35rem;}
.caja article figure {order:1;overflow: hidden;position: relative;}
.caja .contenido p{display:none;}
.caja article {position: relative;}
.caja .signature {position: absolute;bottom: var(--modulo);  left: var(--modulo);}

/* visual (imagen de fondo)*/
.visual article > * {width: 100%;height: 100%;position: absolute;}
.visual article figure {z-index:1;}
.visual article .contenido {z-index:2;display: flex;padding: var(--calle);row-gap: .35rem;}

/* minimalista (sin imagen)*/
.minimalista .contenido {display: flex;flex-direction: column;padding: var(--calle);row-gap: .35rem;position: absolute;top: 50%;left: 50%;transform: translate(-50% , -50%);width: calc(100% - var(--calle) * 2);}
.minimalista .signature {position: absolute;bottom: 0;left: 0;}

[class^="columna foto-"] article{}

/* foto-izquierda */
.foto-izquierda article {flex-direction: row;}
.foto-izquierda figure {flex:1 0 40%;}
.foto-izquierda .contenido{display: flex;flex-direction: column;margin-top: var(--calle);padding: var(--calle);row-gap: .35rem;}
.foto-izquierda .signature {position: absolute;bottom: 0;left: 0;}

/* foto-derecha */
.foto-derecha article {flex-direction: row-reverse;}
.foto-derecha figure {flex:1 0 60%;}
.foto-derecha .contenido {justify-content: center;display: flex;flex-direction: column;padding: var(--calle);row-gap: .35rem;}
.foto-derecha .signature {position: absolute;bottom: var(--calle);right: var(--calle);}


/* autor */
.signature {display: grid;grid-template-rows: var(--calle);grid-template-columns: var(--calle);column-gap: var(--modulo);z-index: 2;width: fit-content !important;height: fit-content !important;padding: var(--modulo);margin-bottom: var(--calle);}
.signature img {overflow:hidden;border-radius:50%;padding: 1px;border: var(--borde-suave);width: calc(var(--calle) * 2);grid-column: 1/3;grid-row: 1/3;display: block;aspect-ratio: 1;align-self:center;}
.signature .autor {grid-column: 3/4;grid-row: 1/2;align-self: center;font-size: .875rem;}
.signature .creditos{grid-column: 3/4;grid-row: 2/3;font-size: .75rem;line-height: 1rem;font-weight: 400;}
.signature a{text-decoration:none;}

/* listas */
.widget {
  display: flex;
  flex-wrap: wrap;
  gap: var(--modulo);
  margin:var(--calle);
}
.widget li {
  display: grid;
  grid-template-columns: var(--grilla) auto;
  column-gap: var(--calle);
  padding: var(--modulo);
  margin-bottom:var(--calle);
  flex: 1 1 calc(var(--grilla)*3);
}
.widget li h4 {
  grid-column: 2 / 3;
  grid-row: 1 / 2;
  display: flex;
}

.widget li .media {
  grid-column: 1 / 2;
  grid-row: 1 / 3;
}
.widget li .media img {
  object-fit: cover;
  object-position: 50% 50%;
  width: 100%;
  height: 100%;
}
.widget li h1 {
  grid-column: 2 / 2;
  grid-row: 2 / 2;
}
ul.social{display:flex; align-items:center;width: 100%;}
ul.social li {list-style: none;display: flex;justify-content: center;align-items: center;}

/* slider */
.slider article > * {width: 100%;height: 100%;position: absolute;}
.slider article figure {z-index:1;}
.slider article .contenido {z-index:2;display: flex;padding: var(--calle);row-gap: .35rem;}


.media-principal * {
  max-width: 100%;
  width: 100%;
  height: auto;
}

.panel {position:fixed;overflow-y:auto;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;transition:all 0.3s ease;}
.panel-vertical {height: 100%;top: 0;z-index: 27036474;}
.panel-left.open {left:0px;}

/* Otros Devices (Desktop) */
@media (min-width: 768px) {
	/* gridster */
	div.wrap {margin:0 auto;background-color: var(--fondo-sitio);}
	section {margin: calc(var(--modulo) * 2) 0;}
	div.wrap,section {width:100%;}
	.container {margin: 0 auto;	max-width: var(--anchomax);width:100%;}
	section div.container {
		display: grid;	justify-content: center;	
		grid-template-columns: repeat(12, calc(var(--anchomax) / 12)); /* Cada columna es 1/12 de anchomax */
		grid-auto-rows: calc(var(--anchomax) / 12); /* Cada fila es 1/12 de anchomax */
	}
	[size_x="1"]{grid-column-end: span 1;}
	[size_x="2"]{grid-column-end: span 2;}
	[size_x="3"]{grid-column-end: span 3;}
	[size_x="4"]{grid-column-end: span 4;}
	[size_x="5"]{grid-column-end: span 5;}
	[size_x="6"]{grid-column-end: span 6;}
	[size_x="7"]{grid-column-end: span 7;}
	[size_x="8"]{grid-column-end: span 8;}
	[size_x="9"]{grid-column-end: span 9;}
	[size_x="10"]{grid-column-end: span 10;}
	[size_x="11"]{grid-column-end: span 11;}
	[size_x="12"]{grid-column-end: span 12;}
	
	[size_y="1"]{grid-row-end: span 1; height:calc(var(--anchomax) / 12 * 1);}
	[size_y="2"]{grid-row-end: span 2; height:calc(var(--anchomax) / 12 * 2);}
	[size_y="3"]{grid-row-end: span 3; height:calc(var(--anchomax) / 12 * 3);}
	[size_y="4"]{grid-row-end: span 4; height:calc(var(--anchomax) / 12 * 4);}
	[size_y="5"]{grid-row-end: span 5; height:calc(var(--anchomax) / 12 * 5);}
	[size_y="6"]{grid-row-end: span 6; height:calc(var(--anchomax) / 12 * 6);}
	[size_y="7"]{grid-row-end: span 7; height:calc(var(--anchomax) / 12 * 7);}
	[size_y="8"]{grid-row-end: span 8; height:calc(var(--anchomax) / 12 * 8);}
	[size_y="9"]{grid-row-end: span 9; height:calc(var(--anchomax) / 12 * 9);}
	[size_y="10"]{grid-row-end: span 10; height:calc(var(--anchomax) / 12 * 10);}
	[size_y="11"]{grid-row-end: span 11; height:calc(var(--anchomax) / 12 * 11);}
	[size_y="12"]{grid-row-end: span 12; height:calc(var(--anchomax) / 12 * 12);}
	[size_y="13"]{grid-row-end: span 13; height:calc(var(--anchomax) / 12 * 13);}
	[size_y="14"]{grid-row-end: span 14; height:calc(var(--anchomax) / 12 * 14);}
	[size_y="15"]{grid-row-end: span 15; height:calc(var(--anchomax) / 12 * 15);}
	[size_y="16"]{grid-row-end: span 16; height:calc(var(--anchomax) / 12 * 16);}
	
	[row="1"]{grid-row-start: 1;}
	[row="2"]{grid-row-start: 2;}
	[row="3"]{grid-row-start: 3;}
	[row="4"]{grid-row-start: 4;}
	[row="5"]{grid-row-start: 5;}
	[row="6"]{grid-row-start: 6;}
	[row="7"]{grid-row-start: 7;}
	[row="8"]{grid-row-start: 8;}
	[row="9"]{grid-row-start: 9;}
	[row="10"]{grid-row-start: 10;}
	[row="11"]{grid-row-start: 11;}
	[row="12"]{grid-row-start: 12;}
	[col="1"]{grid-column-start: 1;}
	[col="2"]{grid-column-start: 2;}
	[col="3"]{grid-column-start: 3;}
	[col="4"]{grid-column-start: 4;}
	[col="5"]{grid-column-start: 5;}
	[col="6"]{grid-column-start: 6;}
	[col="7"]{grid-column-start: 7;}
	[col="8"]{grid-column-start: 8;}
	[col="9"]{grid-column-start: 9;}
	[col="10"]{grid-column-start: 10;}
	[col="11"]{grid-column-start: 11;}
	[col="12"]{grid-column-start: 12;}
	
	.panel-vertical {width: 40%;max-width: 300px;}
	.panel-left {left: -40%;}

} /* fin desktop */


/* Media Queries */
/* Small Devices (Mobile) */
@media (max-width: 767.98px) {
		:root {
			--anchomax: 100vw !important;
			--altomax: 100vh !important;
			--calle:5vw !important;
		}
		
		*[size_x] {width:100vw;}
		section[size_y]:not(.slider) {height:auto !important; padding-bottom:var(--calle);}
		.container[size_y]:not(.comportamiento-slider) {height:auto !important;}
		.columna[size_y]:not(.slider):not(.visual):not(.otraclase) {
		  height: auto !important;
		}
		[class^="columna foto-"] article{flex-direction: row;}
		[class^="columna foto-"] figure{flex:1 0 50%;}
		[class^="columna foto-"] h4{ position:absolute; top:0; left:0;}
		[class^="columna foto-"] h4 span.volanta{ display:none;}

		.columna article{height:100% !important;min-height: 200px;}

		
		[size_y="1"]{height:calc(var(--altomax) / 9 * 1);}
		[size_y="2"]{height:calc(var(--altomax) / 9 * 2);}
		[size_y="3"]{height:calc(var(--altomax) / 9 * 3);}
		[size_y="4"]{height:calc(var(--altomax) / 9 * 4);}
		[size_y="5"]{height:calc(var(--altomax) / 9 * 5);}
		[size_y="6"]{height:calc(var(--altomax) / 9 * 6);}
		[size_y="7"]{height:calc(var(--altomax) / 9 * 7);}
		[size_y="8"]{height:calc(var(--altomax) / 9 * 8);}
		[size_y="9"]{height:calc(var(--altomax) / 9 * 9);}
		[size_y="10"]{height:calc(var(--altomax) / 9 * 10);}
		[size_y="11"]{height:calc(var(--altomax) / 9 * 11);}
		[size_y="12"]{height:calc(var(--altomax) / 9 * 12);}
		[size_y="13"]{height:calc(var(--altomax) / 9 * 13);}
		[size_y="14"]{height:calc(var(--altomax) / 9 * 14);}
		[size_y="15"]{height:calc(var(--altomax) / 9 * 15);}
		[size_y="16"]{height:calc(var(--altomax) / 9 * 16);}

		.widget li {flex: 0 0 100vw;display: grid;grid-template-columns: 30%;flex: 0 auto;}
		.columna .signature {
		  position:absolute;
		  top: calc(var(--calle) / 2);
		  left: calc(var(--calle) / 2);
		}
		.signature .autor {
		  align-self: end !important;
		  min-width: 150px;
		}
		.signature .creditos {
		  align-self: first baseline !important;
		}
		
		section.paralaje {
		  background-position: top center !important;
		  background-repeat: no-repeat !important;
		}

		.container.comportamiento-slider {display:grid;height:100%;width:100%;}
		.container.comportamiento-mosaico {display: grid;}
		.container.comportamiento-mosaico > * {height:100%;width:100%;}
		
		header nav.mobile {opacity: 1;height: inherit;}
		footer > div.container > div {flex-direction: column;}
		
		.data {display: flex;}
		.data .icono {order: 0;text-align: center;align-self: center;}
		.data :first-child{order: 1;align-self: center;}
		.data :nth-child(3){order: 2;align-self: center;}
		.data.clima .icono {width: 48px;}
		
		section.paralaje:before {content:''; position:absolute; top:0; right:0; bottom:0; left:0; background:var(--visual-gradiente);}
		.panel-vertical {width: 85vw;max-width: 75vw;}
		.panel-left {left: -75vw;}
}



/* High Resolution (Retina) Displays */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    /* Estilos específicos para pantallas de alta resolución */
}

/* comportamiento-paralaje */
section.paralaje {background-size: cover;background-attachment: fixed;background-position: center center; position:relative;}
/* Primer ángel ven para aquí */
.container.comportamiento-paralaje > div:first-child article {background:none; box-shadow:none;}
.container.comportamiento-paralaje > div:first-child figure {display:none;}
.container.comportamiento-paralaje > div:first-child article .contenido{background:none; box-shadow:none;padding-top: 40vh;}
.container.comportamiento-paralaje > div:first-child h4 {position: initial; box-shadow:none;}

/* comportamiento-slider */
section.slider {display: grid;}
.columna.slider img {transition: all 300ms ease-in-out;}
.columna.slider:hover img {transform: scale(1.1, 1.1);}
.container.comportamiento-slider {grid-template-columns: repeat(1, auto) !important;align-items: center;width: 100%;z-index: 2;overflow: hidden;position: relative;}
.columna.slider{display: flex;flex-direction: column;justify-content: center;align-items: center;position: absolute;transition: all 1s;z-index: 0;}
.columna.slider article {width: var(--anchomax); height:100% !important}
.columna.slider article figure{height: 100%;z-index:0;}
.columna.slider article .contenido{position: absolute; top:0; left:0; right:0; bottom:0; z-index:1;}
.slider-nav {position: absolute;display: flex;gap: 4px;z-index: 10;margin: 4px;right: 0;}
.slider-nav > * {transition: all 300ms ease-in-out;display: flex;justify-content: center;align-items: center;}
.slider-nav > *:hover {cursor:pointer;}
.slider-nav > .slider-izquierda,.slider-nav > .slider-derecha {background-repeat: no-repeat;background-position: center;}
.slider-nav > .slider-izquierda {	
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="%23FFF" class="bi bi-chevron-left" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0"/></svg>');
}
.slider-nav > .slider-derecha {	
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="%23FFF" class="bi bi-chevron-right" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708"/></svg>');
}

/* comportamiento-mosaico */
.comportamiento-mosaico {grid-auto-rows: min-content !important;}
.comportamiento-mosaico *[size_x] {grid-column-end: inherit;}
.comportamiento-mosaico *[size_y] {grid-row-end: inherit;height: inherit;}
.comportamiento-mosaico *[col] {grid-column-start: inherit;}
.comportamiento-mosaico *[row] {grid-row-start: inherit;}
.comportamiento-mosaico .columna article {height: 100% !important;width: inherit;}
.comportamiento-mosaico .columna {overflow: hidden;}


ion-icon {
  vertical-align: middle;
  display: inline-block;
  cursor: pointer;
  transition: color 0.2s ease-in-out;
}
ion-icon:hover {
  color: #007bff;
}
.header-icon {
  font-size: 28px;
}

/* Example of coloring a specific icon differently */
ion-icon[name="close"] {
  color: #f44336; /* Red color for close icon */
}

/* Basic styles for SVG icons */
svg {
  width: 100%;
  height: 100%;
  vertical-align: middle;
  display: inline-block;
  overflow: visible;
   cursor: pointer;
  transition: color 0.2s ease-in-out;
}

svg.large-icon {
  width: 32px;
  height: 32px;
}

/* Example of coloring a specific icon differently */
/* If you have a specific SVG for a 'delete' icon, for instance */
svg[aria-label="Delete"] { /* Using aria-label is good for accessibility */
  color: #f44336; /* Red color for a delete icon */
}

/*nav ul {display: flex;flex-wrap: wrap;align-items: center;}*/
nav ul a {text-decoration:none;}
nav ul li {padding: var(--modulo);list-style:none;}
nav > ul {display: flex;justify-content: flex-start;align-items: center;padding: 0 15px;}
nav > ul > li {position: relative;height: 100%;display: flex;align-items: center;}


/* Style the links within the main list items */
nav > ul > li > a {
    text-decoration: none;display: flex;align-items: center;height: 100%;
}

/* Style for the list item with icon and strong text */
.secciones .container > li > span,
.secciones .container > li > strong {display: inline-block;vertical-align: middle;}
.secciones .container ion-icon {
	vertical-align: middle;
    cursor: pointer;
    font-size: 20px;
    color: #212529;
}

.secciones .container ion-icon:hover {
     color: #007bff;
}


/* --- Dropdown (Submenu) Styles --- */

/* Hide the nested ul (submenu) by default */
.secciones .container li ul {display: none;position: absolute;top: 100%;left: 0;z-index: 1000 !important;min-width: 200px;padding: 5px 0;}
.secciones .container li ul li {
    display: block;padding: 0;
}
.secciones .container li ul li a {
	text-decoration: none;display: block;
}
.secciones .container > li.subseccion:hover > ul {
    display: block;
}
/* Example using a pseudo-element for an arrow */

/*.container.comportamiento-slider {
    grid-template-columns: repeat(1, auto) !important;
    align-items: center;
    width: 100%;
    z-index: 2;
    overflow: hidden;
    position: relative;
}

.columna.slider {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: absolute;
    transition: all 1s;
    z-index: 0;
    width: 100%;
}*/

.slider-nav {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 10px;
    transform: translateY(-50%);
    z-index: 10;
}

.slider-nav div {
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.slider-dots {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 8px;
    z-index: 10;
}

.slider-dots .dot {
    color: #bbb;
    font-size: 2em;
    cursor: pointer;
}

.slider-dots .dot.active {
    color: #333;
}