/*************/
/* VARIABLES */
/*************/

/* Avenir */
@font-face {
    font-family: 'Avenir';
    font-display: auto;
    src: url('fonts/AvenirLTStd-Light.woff') format('woff');
    font-weight: 100;
}

@font-face {
    font-family: 'Avenir';
    font-display: auto;
    src: url('fonts/AvenirLTStd-Book.woff') format('woff');
    font-weight: 200;
}

@font-face {
    font-family: 'Avenir';
    font-display: auto;
    src: url('fonts/AvenirLTStd-Medium.woff') format('woff');
    font-weight: 300;
}

:root{
	
	/* PRINCIPALES */	
	--color_principal: rgba(255, 255, 255, 1);	
	--color_contraste: rgba(205, 23, 25, 1);
	--color_contraste2: rgba(0, 125, 57, 1);
	--color_gris: rgba(128, 128, 128, 1);
	--color_fondo: rgba(0, 0, 0, 1);	
	
	--color_contraste75: rgba(205, 23, 25, 0.75);
	--color_contraste275: rgba(0, 125, 57, 0.75);
	--color_negro25: rgba(0, 0, 0, 0.25);		
	--color_negro75: rgba(0, 0, 0, 0.75);	
	
}

/* AJUSTES SOBRE ESTILOS GENERALES */

body {
	font-family: 'Avenir';
	font-weight: 100;
	font-style: normal;
	font-size: 1em;
	color: var(--color_principal);
	background-color: var(--color_fondo);
	}
	
input, textarea{
	font-family: 'Avenir' !important;
}

::selection{
	background-color: var(--color_contraste);
	color: var(--color_blanco);
}

.pantalla_inicial.fixedHeight{
	height: 100%;
}

.contenidos{	
	padding-left: 4em;
	padding-right: 4em;   
}

/* FIN AJUSTES SOBRE ESTILOS GENERALES */


/* BANNERS */

#home_banners_cont{
	 min-height: 0;
}

.slider_banners .slick-arrow{
	position: absolute;
	top: 50%;
	transform: translateY(-50%); 
	background-image: url(../img/flecha.svg);
	width: 2em;
	height: 4em;  
	z-index: 10;
	filter: brightness(0%) invert(0.5);
}

.slider_banners .slick-arrow:hover{
	filter: none;
}

.slider_banners .slick-arrow.slick-prev{
	left: 0;
	margin-left: 3em;
}

.slider_banners .slick-arrow.slick-next{
	right: 0;
	margin-right: 3em;
	transform: translateY(-50%) rotate(180deg);
}


.slider_banners .slick-dots{	
	bottom: 1em;
	left: 50%;
	transform: translateX(-50%);   
	/*display: none !important;*/
}

.slider_banners .slick-dots li{	
	width: 1em;
	height: 1em;	
	margin: 0.25em;
	background: var(--color_gris);
	border-radius: 50%;
}

.slider_banners .slick-dots li:hover, .slider_banners .slick-dots li.slick-active{
	background-color: var(--color_contraste);
}

/* FIN BANNERS */



/* CONTACTO */

#contacto{
	position: absolute;
	width: 100%;
	height: 100%;
	padding: 5em;
	background: rgba(0,0,0,0.75);
	z-index: 101;	
	display: none;
}

#contacto > .flex.column{
	position: relative;
	width: 100%;
	height: 100%;
	justify-content: center;
}

#contacto #contacto_contenido{
	position:relative;
	width: 100%;
	max-height: 100%;
	background: var(--color_principal);
	color: var(--color_fondo);
	overflow: auto;
}

#contacto #contacto_cerrar{
	position: absolute;
	top: 1em;
	right: 2em;
	width: 2em;
	height: 2em;
}

#contacto #contacto_cerrar img{
	filter: brightness(0%);
}

#contacto #contacto_cerrar:hover img{
	filter: none;
}

#contacto #datos{
	padding: 2em;
}

#contacto #datos #contacto_datos{
	margin-top: 1em;
}

#contacto #datos #contacto_logo img{
	/*display: inline-flex;*/
	height: 5em;
}

#contacto #formulario{
	justify-content: center;
	align-items: stretch;
	font-size: 1em;
	margin-top: 1.5em;
}

.contacto_bloque{
	position: relative;
	width: 50%;
	padding: 1.5em;
	padding-bottom: 0;
	padding-top: 0;
	justify-content: flex-start;
	align-items: flex-start;
}

#contacto #formulario .titulo_campo, #contacto #formulario input, #contacto #formulario textarea{
	position: relative;
	float: left;
	clear: both;
}

#contacto #formulario .titulo_campo{
	display: inline-block;
	font-size: 1.1em;
	font-weight: 200;		
}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
   -webkit-animation: autofill_general 0s forwards;
	animation: autofill_general 0s forwards;
}

@keyframes autofill_general {
    100% {
        background: transparent;        
    }
}

@-webkit-keyframes autofill_general {
    100% {
        background: transparent;        
    }
}

#contacto #formulario input, #contacto #formulario textarea{
	width: calc(100% - 1em);	
	margin-left: 1em;
	background: transparent;
	border: none;
	border-right: 1px solid;
	border-bottom: 1px solid;
	/*border-right: 1px dashed;*/
	/*border-color: var(--color_contraste);*/
	border-color: var(--color_negro25);	
	font-size: 0.9em;
	font-weight: 100;	
	margin-top: 0.5em;
	margin-bottom: 1.5em;	
	padding: 0.25em;
	}

#contacto #formulario textarea{	
	line-height: 150%;
	resize: none;
	min-height: 7.5em;
	flex-grow: 1;
}

#contacto #formulario input:focus, #contacto #formulario textarea:focus{
	outline: none;
}

#contacto ::-webkit-input-placeholder { 
	/*color: var(--color_contraste275);*/
	color: var(--color_gris);
}

#contacto ::-moz-placeholder { 
	/*color: var(--color_contraste275);*/
	color: var(--color_gris);
}

#contacto :-ms-input-placeholder { 
	/*color: var(--color_contraste275);*/
	color: var(--color_gris);
}

#contacto :-moz-placeholder { 
	/*color: var(--color_contraste275);*/
	color: var(--color_gris);
}

#contacto_contenido input[type=checkbox].css-checkbox {
	display:none;
}

#contacto_contenido input[type=checkbox].css-checkbox + label.css-label {
	/*padding-left: 1.5em;*/
	width: 1.75em; 
	display:inline-block;
	vertical-align: top;
	background-repeat:no-repeat;
	background-size: 100% auto;
	background-position: left top;
	cursor:pointer;
	color: var(--color_principal);
}

#contacto_contenido input[type=checkbox].css-checkbox:checked + label.css-label {
	background-position: left 116.5%;
	}
	
#contacto_contenido label.css-label {
	background-image:url(../img/checkbox.svg);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	}
	
	
#contacto_contenido #confirmacion{
	width: 100%;
	font-weight: 100;
	text-align: right;
	padding: 1.75em;
	padding-top: 0;
}
	
#contacto_contenido #confirmacion a{
	font-weight: 200;	
	font-style: italic;
	color: var(--color_fondo);
}

#contacto_contenido #contacto_texto_aceptar{
	line-height: 150%;
}

#contacto #contacto_contenido #enviar{
	background-color: transparent;
   background-image: url(../img/enviar.svg);
   background-repeat: no-repeat;
   background-size: auto 100%;
   background-position: center;   
   filter: grayscale(100%);
   filter: brightness(0%);
   padding-left: 5em;	
}

#contacto #contacto_contenido #enviar:hover{
	 filter: none;
}

#contacto #contacto_contenido #respuesta_envio{
	width: 100%;
	margin-top: 1.5em;
	text-align: right;
	font-weight: 100;
	/*font-size: 0.9em;*/
	display: none;
}

#contacto #mapa_contenedor{
	width: 100%;
	min-height: 15em;
	flex-grow: 1;
}

#contacto #mapa_contenedor #mapa{
	width: 100%;
	height: 100%;
}

#contacto #datos_empresa{
	position: relative;
	clear: both;
	width: 100%;
	justify-content: space-between;
	align-items: flex-start;
	margin-top: 1em;
	font-weight: 100;
}

#contacto #datos_empresa .contacto_bloque{	
	justify-content: flex-start;
	align-items: baseline;
	padding: 0.5em;
	padding-top: 1em;
	padding-bottom: 0;
	width: auto;
	/*min-width: 50%;*/
}

#contacto #datos_empresa > div.flex > div.flex *{
	padding: 0.1em;
	padding-left: 0.25em;
	padding-right: 0.25em;
}

#contacto #datos_empresa .fa{
	color: var(--color_contraste);	
}

#contacto #datos_empresa .fa.fa-map-marker{
	font-size: 1.25em;
}

#contacto #datos_empresa .texto{
	line-height: 110%;
}

#contacto .enviando_mensaje{
	color: var(--color_fondo);
}

/* FIN CONTACTO */



/* TEXTOS LEGALES */ 

#legal #legal_contenidos{
	margin-top: 0;
}

#legal #legal_texto{
	line-height: 150%;
	/*font-size: 0.9em;*/
}

#legal #legal_texto strong, #legal #legal_texto b{
	font-weight: 200;
}

#legal #legal_texto h2{
	font-size: 1.4em;
	font-weight: 200;
	text-transform: uppercase;
	text-decoration: underline;
	margin-top: 2em;
	margin-bottom: 0.75em;
}

#legal #legal_texto h3{
	font-size: 1.35em;
	font-weight: 200;
	margin-top: 1em;
	margin-bottom: 0.5em;
}

#legal #legal_texto ul, #legal #legal_texto ol{
	margin-left: 4em;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

#legal #legal_texto p{
	margin-top: 0.75em;
}

#legal #legal_texto a{
	opacity: 0.9;
	text-decoration: underline;
	-webkit-transition: all 0.3s ease-in-out !important;
	-moz-transition: all 0.3s ease-in-out !important;
	-ms-transition: all 0.3s ease-in-out !important;
	-o-transition: all 0.3s ease-in-out !important;
	transition: all 0.3s ease-in-out !important;
}

#legal #legal_texto table, #legal #legal_texto .tabla{
	width: 100%;
	border-collapse: collapse; 
	border-spacing: 0;
	/*border: 1px solid var(--color_contraste);*/
	margin-top: 2em;
}

#legal #legal_texto table td, #legal #legal_texto .celda{
	/*width: 33%;*/
	/*border-top: 1px solid var(--color_contraste4);*/
	padding: 1em;
	border: 1px solid var(--color_principal);
}

/* TEXTOS LEGALES */

   

/* INICIO DE LEY DE COOKIES */

#barra_cookies {
	position: fixed;
	display: none;	
	bottom: 0;
	width: 100%;	
	background-color: var(--color_negro);	
	color: var(--color_blanco);	
	z-index:1000;
	font-size: 1em;
	font-weight: 100;	
}

#barra_cookies .cookies_contenido{
	justify-content: space-between;	
	align-items: center;
	padding: 1em;	
}

.cookies_contenido .texto_cookies, .cookies_contenido .botones_cookies{
	padding: 1em;	
	padding-top: 0.5em;
}

.cookies_contenido .texto_cookies{
	flex-grow: 1;
}

.cookies_contenido .botones_cookies{
	/*white-space: nowrap;*/
	justify-content: center;
	align-items: center;	
}

.cookies_contenido a{	
	padding: 0.5em;	
	background-color: var(--color_negro);
	color: var(--color_blanco);
	border: 1px solid var(--color_blanco);
	font-weight: 400;
	font-size: 1em;
	margin: 0.5em;	
	text-align: center;
}

.cookies_contenido a:hover{
	padding: 0.5em;	
	background-color: var(--color_contraste) ;
}

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

	#barra_cookies{
		font-size: 0.9em;	
	}
	
	#barra_cookies .cookies_contenido{
		flex-wrap: wrap;
		justify-content: center;
	}		

}

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

	#barra_cookies .cookies_contenido{
		padding: 0;
	}
	
}

/* FIN DE LEY DE COOKIES */



/* RESPONSIVE */

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

	.contenidos{	
		padding-left: 3em;
		padding-right: 3em;   
	}

	.slider_banners .slick-arrow.slick-prev{
		margin-left: 2em;
	}
	
	.slider_banners .slick-arrow.slick-next{
		margin-right: 2em;
	}	
	
}

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

	.pantalla_inicial.fixedHeight{
		/*height: 40em;*/
	}

}

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

	.contenidos{
		padding-left: 2em;
		padding-right: 2em;
	}
	
	.contacto_bloque{
		width: 100%;
	}
	
}

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

@media screen and (max-width: 640px) {
	
	.slider_banners .slick-arrow{
		height: 3em;
	}
	
	.slider_banners .slick-arrow.slick-prev{
		margin-left: 1em;
	}
	
	.slider_banners .slick-arrow.slick-next{
		margin-right: 1em;
	}

	#contacto{
		padding: 2em;
	}
	
	#contacto #contacto_cerrar{
		right: 1em;
	}
	
	#contacto #datos #contacto_logo img{
		height: 3.5em;
	}
	
	#barra_cookies{
		font-size: 0.8em;	
	}
	
	#barra_cookies .cookies_contenido{
		flex-wrap: wrap;
		justify-content: center;
	}		
		
}

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

	#legal #legal_texto table, #legal #legal_texto .tabla{
		font-size: 0.6em;
	}
	
	#legal #legal_texto table td, #legal #legal_texto .celda{
		padding: 0.25em;
	}		

}

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

	#contacto #contacto_cerrar{
		width: 1.5em;
		height: 1.5em;
	}

	#contacto #datos #contacto_logo img{
		height: 2.5em;
	}
		
}

@media screen and (max-height: 600px) {

	
	
}