/* Sans */

@font-face {
	font-family: "opensans_regular";
	src: url("/librerias/fuentes/Open_Sans/static/OpenSans-Regular.ttf") format("truetype");
	font-weight: normal; font-style: normal;
}

@font-face {
	font-family: "inter_regular";
	src: url("/librerias/fuentes/Inter/static/Inter-Regular.ttf") format("truetype");
	font-weight: normal; font-style: normal;
}

/* Roboto */

@font-face {
	font-family: "roboto_regular";
	src: url("/librerias/fuentes/Roboto/Roboto-Regular.ttf") format("truetype");
	font-weight: normal; font-style: normal;
}

/* Domine */

@font-face {
	font-family: "domine_regular";
	src: url("/librerias/fuentes/Domine/static/Domine-Regular.ttf") format("truetype");
	font-weight: normal; font-style: normal;
}

:root {
	--a-hover: #00f;
	--enlace: #00a;
	--enlace-sobre: #00f;
	--texto: 16px;
	--texto-tamano: 16px;
	--texto-color: #000;
	--surco: 20px;
	--fondo-color: #f7f7f7;
	--borde-color: #ccc;
	--borde-color-ventana: #d7d7d7;
}

* { box-sizing: border-box; }
body { margin: 0px; padding: 0px; background-color: #fff; font-size: var(--texto-tamano); font-family: 'roboto_regular', sans-serif; color: var(--texto-color); line-height: 24px; }
h1, h1 > code { font-size: 26px; }
h2, h2 > code { font-size: 22px; }
h3, h3 > code { font-size: 20px; }
h4, h4 > code { font-size: 16px; }
h5, h5 > code { font-size: 14px; }
h6, h6 > code { font-size: 12px; }
ul { padding-left: 20px; }
a { color: var(--enlace); }
a:hover, 
a:hover code { color: var(--a-hover); }
small { font-size: 15px; }
code { font-size: 16.4px; color: #a00; }
pre { padding: 12px 15px; background-color: #f5f5f5; border: 1px solid #d3d3d3; border-radius: 5px; overflow-x: auto;
font-size: 16px; line-height: 22px; }

.ruta { font-family: "Consolas", monospace; font-size: 15px; }

.botones { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: 6px; }
.boton { min-width: 90px; min-height: 33px; margin: 5px; padding: 4px 10px;
background-color: #f6f6f6; border: 1px solid #cbcbcb; border-radius: 5px; cursor: pointer;
color: #000; font-family: "roboto_regular"; font-size: 14px; font-weight: normal; text-decoration: none; text-align: center; white-space: nowrap; }
.boton:hover { background-color: #77f; border: 1px solid #88e; color: #fff; }

.boton.actual { background-color: #4a4; border-color: #3a3; color: #fff; }

.botones.espaciado-centrado { justify-content: center; }
.botones.espaciado-entre { justify-content: space-between; }
.botones.espaciado-alrededor { justify-content: space-around; }
.botones.espaciado-igualado { justify-content: space-evenly; }
.botones.espaciado-izquierda { justify-content: flex-start; }
.botones.espaciado-derecha { justify-content: flex-end; }

.botones.ajustar-limites {  }
.botones.ajustar-limites > *:first-child { margin-left: 0px }
.botones.ajustar-limites > *:last-child { margin-right: 0px }

@media screen and ( max-width: 500px ){
	.botones.ajustar-limites { padding: 15px 0px; }
	.botones.ajustar-limites > *:first-child { margin-left: 7px }
	.botones.ajustar-limites > *:last-child { margin-right: 7px }
}

/* - - - - - - - - - - Maquetación - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* Anchos */

.ancho-1300 { width: 1300px; margin: 0px auto; }
@media screen and ( max-width: 1340px ){
	.ancho-1300 { width: 100%; }
}

.ancho-1200 { width: 1200px; margin: 0px auto; }
@media screen and ( max-width: 1240px ){
	.ancho-1200 { width: 100%; }
}

.ancho-800 { width: 800px; margin: 0px auto; }
@media screen and ( max-width: 840px ){
	.ancho-800 { width: 100%; }
}

.ancho-600 { width: 600px; margin: 0px auto; }
@media screen and ( max-width: 640px ){
	.ancho-600 { width: 100%; }
}

@media screen and ( max-width: 500px ){
	:root {
		--surco: 10px;
	}
}

/* - - - - - - - - - - Migas - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#migas { padding: 8px; background-color: #f5f5f8; font-family: "roboto_regular"; font-size: 15px; }
#migas a { color: #00f; text-decoration: none; }
#migas a:hover { color: #000; }
#migas ul { display: flex; flex-wrap: wrap; margin: 0px; padding: 0px 2px; }
#migas ul > li { display: grid; grid-template-columns: auto auto; grid-template-rows: 30px; grid-template-rows: 34px; }
#migas ul > li > * { display: flex; align-items: center; }
#migas ul > li svg { height: 20px; margin: 0px 8px; }
#migas ul > li.estas-aqui svg { height: 18px; margin-left: 0px; }

#migas ul > li.anterior, 
#migas ul > li.ultimo { padding: 0px; border-radius: 5px; }

/* - - - - - - - - - - Main - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

body > main { padding: var(--surco) 0px; /* background-color: #fcfcfc; */ }
body > main > article { overflow: hidden; }
body > main > article > * { margin-bottom: var(--surco); }
body > main > article > *:last-child { margin-bottom: 0px; }
body > main > aside { overflow: hidden; }

body > main.izquierda-1,
body > main.derecha-1,
body > main.centro-2,
body > main.izquierda-2,
body > main.derecha-2 { display: grid; grid-gap: var(--surco); }

body > main.izquierda-1 { grid-template-columns: auto 340px; }
body > main.derecha-1 	{ grid-template-columns: 350px auto; }
body > main.centro-2 	{ grid-template-columns: 350px auto 350px; }
body > main.izquierda-2 { grid-template-columns: auto 350px 350px; }
body > main.derecha-2	{ grid-template-columns: 350px 350px auto; }

article .intros-grid-1, 
article .intros-grid-2,
article .intros-grid-3,
article .intros-grid-4 { display: grid; grid-gap: var(--surco); }

article .intros-grid-1 { grid-template-columns: auto; }
article .intros-grid-2 { grid-template-columns: auto auto; }
article .intros-grid-2 > * { width: 100%; }
article .intros-grid-3 { grid-template-columns: auto auto auto; }
article .intros-grid-4 { grid-template-columns: auto auto auto auto; }

article .intros-grid-1:first-child { padding-top: 0px; }

header h2 > a { color: var(--enlace); }
header h2 > a:hover { color: var(--enlace-sobre); }

@media screen and ( max-width: 1340px ){
	body > main.ancho-1300 { padding: var(--surco); }
}

@media screen and ( max-width: 1240px ){
	body > main.ancho-1200 { padding: var(--surco); }
}

@media screen and ( max-width: 1140px ){
	body > main.izquierda-1 { grid-template-columns: auto; }
}

@media screen and ( max-width: 1040px ){
	article .intros-grid-3 { grid-template-columns: auto auto; }
}

@media screen and ( max-width: 840px ){
	article .intros-grid-3 { grid-template-columns: auto; }
}

@media screen and ( max-width: 640px ){
	article .intros-grid-2 { grid-template-columns: auto; }
	
}

/* - - - - - - - - - - Barras - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

body > main > aside { display: grid; grid-template-columns: auto; grid-gap: var(--surco); align-content: start; }

@media screen and ( max-width: 1140px ){
	body > main.izquierda-1 > aside { grid-template-columns: auto auto; }
	body > main.izquierda-1 > aside > * { min-width: 40%; max-width: 100%; }
}

@media screen and ( max-width: 740px ){
	body > main.izquierda-1 > aside { grid-template-columns: auto; }
}

/* - - - - - - - - - - Subir Pantalla - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

div.scrollup { display: none; position: fixed; left: 18px; bottom: 18px; z-index: 4; cursor: pointer; }
div.scrollup > div { display: flex; justify-content: center; align-items: center;
padding: 10px 13px; background-color: #0007; border-radius: 5px; }
div.scrollup > div > svg { height: 22px; }
div.scrollup > div > svg path { fill: #fff; }

div.scrollup:hover svg path { fill: yellow; }
div.scrollup:hover > div { background-color: #000c; }

/* - - - - - - - - - - En Construcción - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#en-construccion { display: grid; grid-template-columns: auto auto; grid-gap: var(--surco); }
#en-construccion > picture { display: flex; justify-content: center; align-items: center; }
#en-construccion > picture > img { max-width: 100%; height: 150px; }

@media screen and ( max-width: 800px ){
	#en-construccion { grid-template-columns: auto; }
}

/* - - - - - - - - - - Listas - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.lista-sitemap {  }
.lista-sitemap ul { list-style-type: none; }
.lista-sitemap li { margin: 10px 0px; }
.lista-sitemap > ul { padding-left: 0px; }
.lista-sitemap details { background-color: #fcfcfc; border: 1px solid #ddd; border-radius: 6px; }
.lista-sitemap details[open=""] summary::marker { color: #283; }
.lista-sitemap summary { padding: 7px 3px; padding-left: 12px; border-radius: 6px 6px 0px 0px; cursor: pointer; }
.lista-sitemap summary:hover { background-color: #f3f3ff; }
.lista-sitemap summary::marker { color: #222; padding: 10px; }
.lista-sitemap details > div { padding: 8px 12px; border-top: 1px solid #ddd; }

/* - - - - - - - - - - Formulario - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

form > div { padding: 10px 5px; }
/* cuando hay una tabla extra en un formulario */
form > div.contenedor { padding: 13px; } 

table.formulario { max-width: 100%; border-spacing: 8px; font-weight: normal; }
table.formulario.ancho { width: 100%; }

	/* Tabla Body */

table.formulario > tbody > tr > td { text-align: left; }
table.formulario > tbody > tr > td.vacio { min-width: 200px; }
table.formulario > tbody > tr > td.arriba { padding-top: 12px; vertical-align: top; }

	/* Entradas */

table.formulario label { font-size: 14px; color: #666; }

table.formulario input[type=submit] { display: none; }

table.formulario input[type="text"], 
table.formulario input[type="email"], 
table.formulario input[type="password"], 
table.formulario input[type="number"], 
table.formulario input[type="date"], 
table.formulario select, 
table.formulario textarea { width: 100%; padding: 9px 8px; border: 1px solid #999; border-radius: 5px;
font-size: 14px; font-family: "roboto_regular",sans-serif; }
table.formulario textarea { resize: vertical; }

table.formulario input[type=checkbox] { background-color: green; margin: 0px 3px; }

table.formulario input[type="date"] { min-width: 150px; }

table.formulario input[readonly], 
table.formulario input[disabled],
table.formulario select[disabled] { color: #666; border-color: #ccc; }

table.formulario select { background-color: #fff; }
table.formulario select option { background-color: #fff; margin: 10px; }

table.formulario input.ruta { font-family: "Consolas", monospace; font-size: 15px; } 
table.formulario small.signo { color: red; }

table.formulario .entradas-ip { display: flex; flex-wrap: wrap; }
table.formulario .entradas-ip > * { margin-right: 10px; }
table.formulario .entradas-ip > *:last-child { margin-right: 0px; }
table.formulario .entradas-ip > input { width: 68px; }

@media screen and ( max-width: 850px ){
	
	/* Formulario */
	
	form > div { padding: 10px 2px; }
	form > div.contenedor { padding: 10px; }
	
	table.formulario { width: 100%; }
	
	/* Tabla Body */
	
	table.formulario > tbody > tr > td { display: flex; }
	table.formulario > tbody > tr > td > label { margin: 5px 0px; }
	
	/* Entradas */

	table.formulario .entradas-ip > * { margin-top: 5px; margin-bottom: 5px; }
	
}

@media screen and ( max-width: 850px ){
	/* form table { width: 100%; } */
	
	form table tbody td.boton_td { padding: 16px 0px; }
	form table tbody td.boton_td > * { margin: 0px 1px; }
}

form table tfoot tr {  }
form table tfoot tr td { padding: 10px 0px; }
form table tfoot tr td.botones > * { background-color: #ddd; border: 1px solid #ccc; border-radius: 5px; padding: 7px 11px; font-size: 16px; cursor: pointer; }

form table tfoot tr td.botones > *:hover { background-color: #ccc; }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Tablas */

div.tabla { overflow-x: auto; margin-bottom: 20px; }

/* Tabla Cebra */

table.cebra { border-collapse: collapse; }
table.cebra caption, table.cebra td, table.cebra th { border: 1px solid #ccc; padding: 10px; }
table.cebra caption { border-bottom: none; }

table.cebra th { background-color: #fbfbfb; }

table.cebra tbody > tr:nth-child(even) { background-color: #fbfbfb; }
table.cebra tbody td h2 { display: inline-block; margin: 0px; }
table.cebra tbody td h2 code { font-size: 20px; }
@media screen and ( max-width: 850px ){
	table.cebra td, table.cebra th { display: block; border-bottom: none; }
	table.cebra tbody tr:last-child td:last-child { border-bottom: 1px solid #ccc; }
}

/* Tablas Registros */

table.registros { border-collapse: collapse; }
table.registros.defecto { min-width: 440px; }

table.registros .boton { }

table.registros > caption { }
table.registros > caption > div { display: grid; grid-template-columns: auto auto; justify-content: space-between;
min-height: 48px; border: 1px solid #ccc; border-bottom: none; border-radius: 5px 5px 0px 0px; }
table.registros > caption > div > div { display: flex; flex-wrap: wrap; align-items: center; padding: 5px; }
table.registros > caption > div > div:first-child { justify-content: flex-start;
padding-left: 8px; padding-right: 0px; }
table.registros > caption > div > div:last-child { justify-content: flex-end; }
table.registros > caption > div > div > strong { white-space: nowrap; font-size: 18px; }
table.registros > caption > div > div > span { white-space: nowrap; font-size: 15px; }
table.registros > caption > div > div > * { margin: 4px; }

table.registros > thead { background-color: var(--fondo-color); }
table.registros > thead > tr {  }
table.registros > thead > tr > th { border: 1px solid #ccc; padding: 3px 7px; 
font-family: "roboto_regular"; font-size: 14px; font-weight: bold; }
table.registros > thead > tr > th.acciones {}
table.registros > thead > tr > th.vacio {}
table.registros > thead > tr > th > div { display: flex; justify-content: center; }
table.registros > thead > tr > th > div > * { margin: 6px; }
table.registros > thead > tr > th > div > a { display: flex; align-items: center;
color: #00b; text-decoration: none; }
table.registros > thead > tr > th > div > a:hover { text-decoration: underline; }
table.registros > thead > tr > th > div > a > svg { height: 9px; margin-right: 7px; }
table.registros > thead > tr > th > div > a > span {  }

table.registros > thead > tr > th > div > a.actual { color: #080; }
table.registros > thead > tr > th > div > a.actual svg path { fill: #080; }

table.registros > thead > tr > th > div > picture { display: flex; justify-content: center; align-items: center; cursor: pointer; }
table.registros > thead > tr > th > div > picture > svg { height: 14px; }

table.registros > tbody { font-size: 14px; }
table.registros > tbody > tr { }
table.registros > tbody > tr:hover { background-color: #f9f9ff; }
table.registros > tbody > tr > td { border: 1px solid #ccc; padding: 9px 10px; }
table.registros > tbody > tr > td.cantidad { text-align: right; }
table.registros > tbody > tr > td.acciones {  }
table.registros > tbody > tr > td.acciones > * { margin: 0px 3px; }
table.registros > tbody > tr > td > div.etiqueta { display: none; padding-bottom: 6px; font-size: 12px; letter-spacing: .3px; }
table.registros > tbody > tr > td > span.grande { font-size: 16px; }

table.registros > tbody > tr > td a { color: #33a; text-decoration: none; }
table.registros > tbody > tr > td a:hover { text-decoration: underline; }

table.registros > tfoot { background-color: var(--fondo-color); }
table.registros > tfoot > tr { }
table.registros > tfoot > tr > td { padding: 10px 10px; border: 1px solid var(--borde-color); }
table.registros > tfoot > tr > td.paginacion { padding: 4px; }
table.registros > tfoot > tr > td.cantidad { text-align: right; }
table.registros > tfoot > tr > td .boton { min-width: 32px; }

table.registros > tfoot > tr > td > div { display: flex; flex-wrap: wrap; }

table.registros > tfoot div.botones { }
table.registros > tfoot div.botones a.boton { background-color: #fff; border-color: var(--borde-color) }
table.registros > tfoot div.botones a.boton:hover { background-color: #77f; border-color: #77e; color: #fff; }
table.registros > tfoot div.botones span.boton { cursor: default; }
table.registros > tfoot div.botones span.boton.inactivo { background-color: var(--fondo-color); border: 1px solid var(--borde-color); color: #bfbfbf; }

@media screen and ( max-width: 850px ){
	
	table.registros.defecto { min-width: auto; width: 100%; }
	
	table.registros.defecto > thead > tr > th,
	table.registros.defecto > tbody > tr > td,
	table.registros.defecto > tfoot > tr > td { display: block; font-size: 16px; }
	
	table.registros.defecto > thead > tr > th { border-bottom: none; }
	table.registros.defecto > thead > tr > th.acciones { display: none; }
	table.registros.defecto > thead > tr > th.vacio { display: none; }
	
	table.registros.defecto > tbody > tr > td { padding: 9px 10px; border-bottom-style: dashed; }
	table.registros.defecto > tbody > tr > td:last-child { border-bottom: none; }
	table.registros.defecto > tbody > tr > td.acciones { }
	table.registros.defecto > tbody > tr > td.acciones > * { }
	
	table.registros.defecto > tbody > tr > td { border-top: none; }
	table.registros.defecto > tbody > tr > td:first-child { border-top: 1px solid #ccc; }
	
	table.registros.defecto > tbody > tr > td > div.etiqueta { display: block; }
	
}

@media screen and ( max-width: 500px ){
	table.registros > caption > div { grid-template-columns: 100%; }
	table.registros > caption > div > div:first-child { padding-left: 6px; }
	table.registros > caption > div > div:last-child { justify-content: space-between; }
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Mensajes */

#msg { display: none; position: fixed; width: 100%; z-index: 2; }
.msg { font-family: "roboto_regular"; }
.msg > div { display: grid; grid-template-columns: 48px auto 40px; 
margin: 7px; background-color: #dfdfdf; border: 1px solid #ccc; border-radius: 5px; }
.msg > div > * { display: flex; justify-content: center; align-items: center;  }
.msg > div > picture { padding: 12px 0px; }
.msg > div > picture > img { max-height: 24px; }
.msg > div > div { justify-content: flex-start; padding: 5px 0px; font-size: 16px; }
.msg > div > div > p { margin: 8px 0px; line-height: 21px; }
.msg > div > section {  }
.msg > div > section > button { background-color: transparent; border: none; border-radius: 5px; 
font-size: 20px; font-weight: bold; cursor: pointer; }
.msg > div > section > button:hover {  background-color: #ccc; }

.msg .ok { background-color: #daffda; border-color: #beb; }
.msg .ok > section > button:hover { background-color: #beb; }
.msg .error { background-color: #ffdfdf; border-color: #ecc; }
.msg .error > section > button:hover { background-color: #ebb; }
.msg .defecto { background-color: #e0e0ff; border-color: #cce; }
.msg .defecto > section > button:hover { background-color: #bbe; }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Modal */

.modal { display: none; justify-content: center; align-items: center;
position: fixed; z-index: 1000; top: 0; right: 0; left: 0; bottom: 0;
background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.8); }

.modal > button.cerrar { position: absolute; top: 0px; right: 0px; z-index: 10;
padding: 0px 6px;
background: none; border: none;
color: #ccc; font-size: 42px; font-weight: bold; 
transition: 0.3s; cursor: pointer; }
.modal > button.cerrar:hover { color: #fff; text-decoration: none; cursor: pointer; }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Caja */

.caja { background-color: #fff; border: 1px solid var(--borde-color-ventana); border-radius: 5px; }
.caja > * { border-bottom: 1px solid var(--borde-color-ventana); }
.caja > *:last-child { border-bottom: none; }

.caja h1, .caja h2, .caja h3, .caja h4, .caja h5, .caja h6 { color: #222; }

.caja > .grid-1, 
.caja > .grid-2 { min-height: 52px; display: grid; padding: 0px; }
.caja > .grid-1 > div, 
.caja > .grid-2 > div { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; padding: 12px; }
.caja > .grid-2 > div:first-child { padding-right: 0px; }
.caja > .grid-1 > div > *,
.caja > .grid-2 > div > * { margin: 4px; }
.caja > .grid-1 > div > span,
.caja > .grid-2 > div > span { font-size: 15px; }

.caja > header > div:first-child { padding-left: 15px; }

.caja > .grid-1 { grid-template-columns: auto; }

.caja > .grid-2 { grid-template-columns: auto auto; }
.caja > .grid-2 > div:last-child { justify-content: flex-end; }

.caja > .grid-3 { display: grid; grid-template-columns: auto auto auto; justify-content: space-between; }
.caja > .grid-3 > div:first-child { justify-content: flex-start; }
.caja > .grid-3 > div { justify-content: center; }
.caja > .grid-3 > div:last-child { justify-content: flex-end; }

.caja > .grid-3.iguales { grid-template-columns: 33.33% 33.33% 33.33%; }

.caja > nav {  }
.caja > nav > div { padding: 14px 11px; border-bottom: 1px solid var(--borde-color-ventana); }
.caja > nav > div:last-child { border-bottom: none; }
.caja > nav div.nivel-2 { padding-left: 16px; }
.caja > nav div.nivel-3 { padding-left: 21px; }

.caja > nav ul { margin: 7px 0px; padding: 0px 10px 0px 27px; }
.caja > nav ul > li { padding: 7px 0px; }
.caja > nav ul ul { padding-top: 7px; }

/* .caja > form > div { padding: 5px; } */

.caja > div {  }
.caja > div.instrucciones { padding: 4px 14px; font-size: 14px; }
.caja > div.instrucciones p { margin: 12px 0px; }

.caja > div.introduccion { padding: 0px 15px; }

div.contenido { padding: 0px var(--surco); }
div.contenido > * { margin-top: 22px; margin-bottom: 22px; }
div.contenido.mini > * { margin-top: 12px; margin-bottom: 12px; }
div.contenido.lectura {  }
div.contenido.lectura p { font-family: domine_regular; font-size: 15.6px; }

div.publicidad { padding: 0px; overflow: hidden; }


/* Caja Ventana */

.caja.ventana > header { grid-template-columns: auto 44px; }
.caja.ventana > header > div { }
.caja.ventana > header > div > svg { max-width: 17px; height: 20px; }
.caja.ventana > header > div:last-child { display: flex; justify-content: center; align-items: center;
padding: 0px; border: none; border-radius: 5px;
background-color: #fff;
font-size: 22px; font-weight: bold; cursor: pointer; }
.caja.ventana > header > div:last-child:hover { background-color: #f6f6f6; color: red; }

/* .caja.ventana > form { padding: 0px; } */
.caja.ventana > form > table { width: 100%; }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Parallax */

.parallax { min-height: 500px; 
background-attachment: fixed; 
background-position: center;
background-repeat: no-repeat;
background-size: 100% auto;
}

@media screen and ( max-width: 900px ){
	.parallax { min-height: 400px; }
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* SlideImages */

.transicion1ease { transition: all 1s ease; }

.modal.images { justify-content: start; justify-content: stretch; }

.slideimages { position: absolute; top: 0; bottom: 0; right: 0; left: 0;
display: flex; overflow: hidden; }
.slideimages > .slider { display: flex; justify-content: flex-start; width: auto; }
.slideimages > .slider > .slide { display: flex; justify-content: center; align-items: center; width: 100%; }
.slideimages > .slider > .slide > img { width: auto; max-width: 100%; height: auto; max-height: 100%; }

.slideimages > aside { position: absolute; top: 0; bottom: 0;
display: flex; justify-content: center; align-items: center; }
.slideimages > aside.izquierda { left: 0; }
.slideimages > aside.derecha { right: 0; }

.slideimages > aside > button { display: flex; justify-content: center: align-items: center;
padding: 5px 13px; background: none; border: none; color: #ccc; text-shadow: 1px 1px #000; font-size: 66px; font-weight: normal;
cursor: pointer; }
.slideimages > aside > button:hover { color: #fff; }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* SlideShow */

.slideshow {  display: none; position: relative; overflow: hidden; }
.slideshow > .slider { display: flex; width: auto; transition: all 1s ease; }
.slideshow > .slider > .slide { width: 100%; 
background-size: 100% 100%; background-repeat: no-repeat; }

.slideshow > .izquierda, 
.slideshow > .derecha { display: flex; align-items: center;
position: absolute; top: 0; bottom: 0; width: 0px; }

.slideshow > .izquierda > *, 
.slideshow > .derecha > * { position: absolute;
padding: 18px 11px 22px; border: none; border-radius: 5px; 
background-color: #0003; color: #eee; font-size: 32px; line-height: 0px; 
cursor: pointer; }
.slideshow > .izquierda > * { left: 0; }
.slideshow > .derecha > * { right: 0; }

.slideshow > .izquierda > *:hover, 
.slideshow > .derecha > *:hover { background-color: #000a; }

.slideshow > .izquierda { left: 0; margin-left: 5px; }
.slideshow > .derecha { right: 0; margin-right: 5px; }

.slideshow > .botones { position: absolute; bottom: 0px; left: 0px; right: 0;
display: flex; justify-content: center; padding: 2px; }
.slideshow > .botones > * { display: flex; justify-content: center; align-items: center;
width: 14px; min-width: 14px; height: 14px; margin: 6px; padding: 0px; border: none; border-radius: 50%; 
background-color: #ccc; cursor: pointer; }
.slideshow > .botones > *.actual { background-color: green; }

/* SlideShow Productos */

.slideshow-productos { display: grid; grid-template-columns: 30px auto 30px; }
.slideshow-productos > aside { display: flex; justify-content: center; align-items: center;}
.slideshow-productos > aside svg { cursor: pointer; }
.slideshow-productos > aside svg > path { fill: #aaa; }
.slideshow-productos > aside svg:hover path { fill: #000; }

.slideshow-productos > div { position: relative; overflow: hidden; }
.slideshow-productos > div .slider { display: flex; flex-wrap: nowrap; }
.slideshow-productos > div .slider > * { border: 1px dotted #ccc; }

.muestra { border: 1px solid #ccc; background-color: #fff; }

div.contenido .muestra.initial p { font-family: initial; font-size: initial; color: initial;
display: block; margin-top: 1em; margin-bottom: 1em; margin-left: 0; margin-right: 0; }
div.contenido .muestra.initial h1 { font-family: initial; color: initial;
display: block; font-size: 2em; margin-top: 0.67em; margin-bottom: 0.67em; margin-left: 0; margin-right: 0; font-weight: bold; }
div.contenido .muestra.initial h2 { font-family: initial; color: initial;
display: block; font-size: 1.5em; margin-top: 0.83em; margin-bottom: 0.83em; margin-left: 0; margin-right: 0; font-weight: bold; }
div.contenido .muestra.initial h3 { font-family: initial; color: initial;
display: block; font-size: 1.17em; margin-top: 1em; margin-bottom: 1em; margin-left: 0; margin-right: 0; font-weight: bold; }
div.contenido .muestra.initial h4 { font-family: initial; color: initial;
display: block; font-size: 1em; margin-top: 1.33em; margin-bottom: 1.33em; margin-left: 0; margin-right: 0; font-weight: bold; }
div.contenido .muestra.initial h5 { font-family: initial; color: initial;
display: block; font-size: .83em; margin-top: 1.67em; margin-bottom: 1.67em; margin-left: 0; margin-right: 0; font-weight: bold; }
div.contenido .muestra.initial h6 { font-family: initial; color: initial;
display: block; font-size: .67em; margin-top: 2.33em; margin-bottom: 2.33em; margin-left: 0; margin-right: 0; font-weight: bold; }