/*
	Evitar usar nombres de colores porque hay funciones que trabajan con rgb o hexa.
*/


div { margin:0; box-sizing: border-box; font:inherit; 
	color: inherit;
/*overflow:hidden;*/}
button,input,select,textarea,optgroup{font:inherit;margin:0}
html{overflow-x:hidden}
ul { list-style-position: outside; margin: 8px; padding: 0;}
.relativo {position: relative;}
.absoluto {position: absolute;}

/* input */
.campo {display:block;max-width:100%;margin:4px 0;padding:8px 8px 4px;border:none;border-bottom:solid 1px LightGray;width:100% !important;}


#titulos { display: block; position: relative; vertical-align: bottom;
	text-align: center; padding: 0px; 
}
#titulos > div:nth-child(2) {display: inline-block; width: 33%; 
	border:dotted 0px red;
	text-align: right; }
#titulos > div:nth-child(3) {display: inline-block; width: 33%; 
	border:dotted 0px green;
	text-align: center; }
#titulos > div:nth-child(4) {display: inline-block; width: 33%; 
	border:dotted 0px blue;
	text-align: center; }

#titulos > div:nth-child(2) > div {display: inline-block; width: 328px;
	position: relative; 
	padding: 24px 32px; 
	text-align: left; font-size: 24px; line-height: 1.2;
	border:dashed 0px cyan;
}
#titulos > div:nth-child(3) > div {display: inline-block; width: 328px;
	position: relative; 
	padding: 24px 16px; 
	text-align: right;  font-size: 24px;
	border:dashed 0px pink;
}
#titulos > div:nth-child(4) > div {display: inline-block; width: 160px;
	position: relative; 
	padding: 16px; 
	text-align: center;  font-size: 16px;
	border:dashed 0px red;
}


#barra_top {display: block; position: relative; vertical-align: middle;
	text-align: center; padding: 0px; margin-bottom: 16px;
	box-shadow:4px 4px 4px 0 rgba(0,0,0,0.4)
}
#barra_top > div { padding: 16px 32px 12px; vertical-align: middle; }

#barra_top > div:nth-child(1) {display: inline-block; width: 33%; 
	text-align: left; font-size: 24px; }
#barra_top > div:nth-child(2) {display: inline-block; width: 33%; 
	text-align: center; font-size: 24px; font-weight: 400; }
#barra_top > div:nth-child(3) {display: inline-block; width: 33%; 
	text-align: center; font-size: 16px; padding: 0px !important; }


.mitad { display: inline-block; width: 50%; min-width: 360px; }
.tercio { display: inline-block; width: 33.3%; /*min-width: 240px;*/ }
.cuarto { display: inline-block; width: 25%; min-width: 180px; }
.quinto { display: inline-block; width: 20%; min-width: 144px; }

.dostercios { display: inline-block; width: 66.6%; }
.trescuartos { display: inline-block; width: 75%; }
.cuatroquintos { display: inline-block; width: 80%; }

.mitad_margen_1 { display: inline-block; width: 46vw; margin: 2vw; min-width: 360px; }


.barra_botones {display: block; position: relative; padding:0px;}
.barra_botones > div {display:inline-block; padding:16px 24px; 
	text-align:center; cursor: pointer;}


.SECCION {display: block; position: relative; vertical-align: top;}
.FILTRO_FONDO { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.CUADRO {display: inline-block; position: relative; vertical-align: top;}


.bloque_2 {display: block; position: relative; padding: 0;}
.bloque_2 > div { display: inline-block; 
	width: 50%; min-width: 360px;
	padding: 24px 32px !important;
	vertical-align:top; padding: 0px;
}

.bloque_3 {display: block; position: relative; padding: 0;}
.bloque_3 > div { display: inline-block; 
	width: 33.3%; min-width: 240px;
	padding: 24px 32px !important;
	vertical-align:top; padding: 0px;
}

.bloque_4 {display: block; position: relative; padding: 0;}
.bloque_4 > div { display: inline-block; 
	width: 25%; min-width: 180px;
	padding: 24px 32px !important;
	vertical-align:top; padding: 0px;
}


.seccion_0 {display: block; position: relative;}
.seccion_0 div { display: inline-block; }

.seccion_1 {display: block; position: relative;}
/* primer div: filtro del fondo */
.seccion_1 > div:nth-child(1) { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0;}
/* segundo div: panel */
.seccion_1 > div:nth-child(2) { display: inline-block; width: 100%; padding: 24px 32px }
.seccion_1 > div:nth-child(2) > div {display: inline-block; padding: 24px 32px;}


.seccion_2 {display: block; position: relative;}
.seccion_2 > div {display: inline-block; vertical-align:top; padding: 0px;}
.seccion_2 > div > div {padding: 24px 32px;}	/* cuadros interiores */

/* primer div: filtro del fondo */
.seccion_2 > div:nth-child(1) { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0;}

/* paneles */
.seccion_2 > div:nth-child(2) { width: 50%; min-width: 360px; padding: 24px 16px 24px 32px;}
.seccion_2 > div:nth-child(3) { width: 50%; min-width: 360px; padding: 24px 32px 24px 16px;}


.seccion_3 {display: block; position: relative;}
.seccion_3 > div {display: inline-block; vertical-align:top; padding: 0px;}
.seccion_3 > div > div {
padding: 24px 32px;}	/* cuadros interiores */

/* paneles */
.seccion_3 > div:nth-child(2) { width: 33.3%; min-width: 240px; padding: 24px 16px 24px 32px;}
.seccion_3 > div:nth-child(3) { width: 33.3%; min-width: 240px; padding: 24px 16px;}
.seccion_3 > div:nth-child(4) { width: 33.3%; min-width: 240px; padding: 24px 32px 24px 16px;}


.seccion_4 {display: block; position: relative;}
.seccion_4 > div {display: inline-block; vertical-align:top; padding: 0px;}
.seccion_4 > div > div {padding: 24px 32px;}	/* cuadros interiores */

/* primer div: filtro del fondo */
.seccion_4 > div:nth-child(1) { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0;}

/* paneles */
.seccion_4 > div:nth-child(2) { width: 25%; min-width: 180px; padding: 24px 16px 24px 32px;}
.seccion_4 > div:nth-child(3) { width: 25%; min-width: 180px; padding: 24px 16px;}
.seccion_4 > div:nth-child(4) { width: 25%; min-width: 180px; padding: 24px 16px;}
.seccion_4 > div:nth-child(5) { width: 25%; min-width: 180px; padding: 24px 32px 24px 16px;}


.seccion_5 {display: block; position: relative;}
.seccion_5 > div {display: inline-block; vertical-align:top; padding: 0px;}
.seccion_5 > div > div {padding: 24px 32px;}	/* cuadros interiores */

/* primer div: filtro del fondo */
.seccion_5 > div:nth-child(1) { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0;}

/* paneles */
.seccion_5 > div:nth-child(2) { width: 20%; min-width: 144px; padding: 24px 16px 24px 32px;}
.seccion_5 > div:nth-child(3) { width: 20%; min-width: 144px; padding: 24px 16px;}
.seccion_5 > div:nth-child(4) { width: 20%; min-width: 144px; padding: 24px 16px;}
.seccion_5 > div:nth-child(5) { width: 20%; min-width: 144px; padding: 24px 16px;}
.seccion_5 > div:nth-child(6) { width: 20%; min-width: 144px; padding: 24px 32px 24px 16px;}


.margen_chico { margin: 4px !important; }
.margen_medio { margin: 24px 32px !important; }
.margen_sup,.margen_1 {margin-top:24px !important;}
.margen_inf,.margen_3 {margin-bottom:24px !important;}
.margen_izq,.margen_4 {margin-left:24px !important;}
.margen_der,.margen_2 {margin-right:24px !important;}
.sinmargen { margin: none !important; }

.relleno_1 { padding: 8px 12px 6px !important; }
.relleno_2,.relleno { padding: 16px 24px !important; }
.relleno_3 { padding: 24px 32px !important; }
.relleno_4 { padding: 40px 48px !important; }
.relleno_5 { padding: 48px 60px !important; }
.relleno_16 { padding: 16px !important; }
.sinrelleno { padding: 0px !important; }

.bloque { display: block !important; position: relative; }
.enlinea, .inline { display: inline-block; }
.oculto{display:none;}
.visible{display:initial;}

.bordes { border:solid 1px LightGray; }
.borde_sup { border-top:solid 1px LightGray; }
.borde_der { border-right:solid 1px LightGray; }
.borde_inf { border-bottom:solid 1px LightGray; }
.borde_izq { border-left:solid 1px LightGray; }
.borde_blanco{border-color:white !important;}
.borde_negro{border-color:black !important;}
.borde_rojo{border-color:red !important;}

.borde_2 {border-width:2px !important;}
.borde_3 {border-width:3px !important;}
.borde_4 {border-width:4px !important;}
.borde_6 {border-width:6px !important;}
.borde_dash { border: dashed 2px Red !important; }

.sinbordes { border:none; }

/*.sombra,.sombra1 { box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12) }*/
.sombra { box-shadow:4px 4px 4px 0 rgba(0,0,0,0.4) }
.sombra_1 { box-shadow:3px 3px 8px 0 rgba(0,0,0,0.4) }
.sombra_2 { box-shadow:4px 4px 10px 0 rgba(0,0,0,0.4) }
.sombra_3 { box-shadow:2px 2px 32px 8px rgba(0,0,0,0.3) }
.sombra_h { box-shadow:0 4px 8px 0 rgba(0,0,0,0.3); margin-bottom: 16px; }

.letra_chiquita { font-size: 14px !important; }
.letra_chica { font-size: 18px !important; }
.letra_media { font-size: 20px !important; }
.letra_mediamas { font-size: 24px !important; }
.letra_grande { font-size: 28px !important; }
.letra_grandemas { font-size: 36px !important; }
.letra_muygrande { font-size: 48px !important; }

.izquierda { text-align: left !important; }
.centro { text-align: center !important; }
.derecha { text-align: right !important; }
.justificado { text-align: justify !important; }

.nowrap { white-space: nowrap; }

.transparente { background: transparent; }
.transparencia_1 { opacity: 0.8; }
.transparencia_2 { opacity: 0.6; }
.transparencia_3 { opacity: 0.4; }
.transparencia_4 { opacity: 0.2; }

.botones_menu { width: 160px; box-shadow:4px 4px 4px 0 rgba(0,0,0,0.4) }
.botones_menu > div { display: inline-block; width: 160px; cursor:pointer; 
	text-align: center;  padding: 16px !important; 
	background-color: #dbd8d1 !important; color:#000; 
	border-bottom: solid 1px White;
}
.botones_menu > div:first-child { border-top: solid 1px White; }
.botones_menu > div:last-child { border-bottom: none; }
.botones_menu > div:hover { background-color: #c2beb2 !important; color:#FFF; }

.boton_base { display: inline-block; cursor:pointer; 
	text-align: center; /*overflow:hidden; text-decoration:none;*/
}

.boton { display: inline-block; cursor:pointer; line-height:1;
	margin: 0px; padding: 16px 32px; 
	text-align: center; vertical-align:top;
	overflow:hidden; text-decoration:none;
	background-color: #DCDCDC; color: Black;
}
.boton:hover {background-color: #B0B0B0; color: White;}

.boton_ico { display: inline-block; cursor:pointer; line-height:1;
	margin: 0px; padding: 4px; font-size: 44px;
	text-align: center; vertical-align:top;
	overflow:hidden; text-decoration:none;
	background-color: #404040; color: #A0A0A0;
}
.boton_ico:hover {background-color: #A0A0A0; color: #404040;}


.hover_oscuro:hover {background-color:rgba(0,0,0,0.15)}
.hover_claro:hover {background-color:rgba(255,255,255,0.15)}
.hover_texto_claro:hover {color:rgba(255,255,255,0.8)}

.anima_izq{position:relative;animation:animateleft 0.4s}@keyframes animateleft{from{left:-300px;opacity:0} to{left:0;opacity:1}}

.parallax {
  /* The image used */
	/*background-image: url("img_parallax.jpg");*/

  /* Full height */
  height: 100%;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;	/* contain cover */
  
/*  perspective: 1px;*/
}

/* COLORES DE FONDO GENÉRICOS EXTRA A PALETA */
.blanco { background-color: #FFFFFF; color: #333333 !important; }
.gris_1 { background-color: #F5F5F5; color: #222222; }/*WhiteSmoke*/
.gris_2 { background-color: #DCDCDC; color: #111111; }/*Gainsboro*/
.gris_3 { background-color: #D3D3D3; color: Black; }/*LightGray*/
.gris_4 { background-color: #C0C0C0; color: Black; }/*Silver*/
.gris_5 { background-color: #B0B0B0; color: White; }
.gris_6 { background-color: #A0A0A0; color: White; }
.gris_7 { background-color: #808080; color: White !important; }/*Gray*/
.gris_8 { background-color: #606060; color: White !important; }
.gris_9 { background-color: #404040; color: #FAFAFA !important; }
.negro { background-color: #000000; color: #F5F5F5 !important; }
.texto_blanco {color: #FFF !important;}
.texto_gris_1 { color: #F5F5F5;}/*WhiteSmoke*/
.texto_gris_2 { color: #DCDCDC !important; }/*Gainsboro*/
.texto_gris_3 { color: #D3D3D3 !important; }/*LightGray*/
.texto_gris_4 { color: #C0C0C0 !important; }/*Silver*/
.texto_gris_5 { color: #B0B0B0 !important; }
.texto_gris_6 { color: #A0A0A0 !important; }
.texto_gris_7 { color: #808080 !important; }/*Gray*/
.texto_gris_8 { color: #606060 !important; }
.texto_gris_9 { color: #404040 !important; }
.texto_negro { color: #000000; }
.texto_tan {color:Tan !important;}

@media screen and (max-width: 800px)
{
	.mitad { display:block; width: auto; min-height: 16px !important; }
}

@media screen and (max-width: 660px)
{
	#titulos > div:nth-child(2) {width: 100%; text-align: center; }
	#titulos > div:nth-child(3) {width: 100%;}
	#titulos > div:nth-child(4) {width: 100%;}
	
	#barra_top > div:nth-child(1) {width: 100%; text-align: center; font-size: 22px; }
	#barra_top > div:nth-child(2) {width: 50%; }
	#barra_top > div:nth-child(3) {width: 50%; }
}

@media screen and (orientation: portrait)
{
	#titulos > div:nth-child(2) {width: 100%; text-align: center; }
	#titulos > div:nth-child(3) {width: 100%;}
	#titulos > div:nth-child(4) {width: 100%;}

	#barra_top > div:nth-child(1) {width: 100%; text-align: center; font-size: 22px; }
	#barra_top > div:nth-child(2) {width: 50%; }
	#barra_top > div:nth-child(3) {width: 50%; }
}

@media screen and (max-width: 720px)
{
	#titulos > div:nth-child(2) {width: 100%;}
	#titulos > div:nth-child(3) {width: 100%;}
	#titulos > div:nth-child(4) {width: 100%;}
	#titulos > div:nth-child(2) > div {width: 100%;}
	#titulos > div:nth-child(3) > div {width: 100%; 
		padding:0px 24px 24px; font-size: 26px; }
	
	#barra_top > div:nth-child(1) {width: 100%; text-align: center; font-size: 22px; }
	#barra_top > div:nth-child(2) {width: 50%; }
	#barra_top > div:nth-child(3) {width: 50%; }

	.mitad { display:block; width: auto; min-height: 16px !important; }
	.tercio { display:block; width: 95%; }
	.cuarto { display:block; width: auto; }
	.quinto { display:block; width: auto; }
	
	/*.seccion_2 > div { display: block; width: 100%; padding: 16px 24px;}*/
	.seccion_2 > div:nth-child(2) { width: 100%; padding: 16px 16px 8px;}
	.seccion_2 > div:nth-child(3) { width: 100%; padding: 8px 16px 16px;}
	
	.seccion_3 > div:nth-child(2) { display: block; width: 100%; padding: 16px 16px 8px;}
	.seccion_3 > div:nth-child(3) { display: block; width: 100%; padding: 16px 16px 8px;}
	.seccion_3 > div:nth-child(4) { display: block; width: 100%; padding: 8px 16px 16px;}
}