/* fonts
------------------------------------------------------------------------------------------------------  */
@font-face {
	font-family: 'Roboto-Bold';
	src: url('fonts/Roboto-Bold.ttf') format('truetype');
}
@font-face {
	font-family: 'Roboto-Medium';
	src: url('fonts/Roboto-Medium.ttf') format('truetype');
}
@font-face {
	font-family: 'Roboto-Regular';
	src: url('fonts/Roboto2-Regular.ttf') format('truetype');
}
@font-face {
	font-family: 'Roboto-Light';
	src: url('fonts/Roboto-Light.ttf') format('truetype');
}


/* root
------------------------------------------------------------------------------------------------------  */
:root {
	
	/* fuentes */
	--font-bold: 'Roboto-Bold';    
	--font-medium: 'Roboto-Medium';    
	--font-regular: 'Roboto-Regular';    
	--font-light: 'Roboto-Light';    
	
	/* colores */
	--color-primary: #ffffff;
	--color-secondary: #969695; 
	--color-white: #ffffff;
	--color-azul-inicial: #477bdb; 
	--color-azul-final: #0c51d0; 
	--color-gris-inicial: #1e2128; 
	--color-gris-final: #0b0d11; 
	--color-background: #111;

	/* size fonts*/
	--font-size: 14px;

	/* weight fonts*/
	--font-weight-bold: 700;
	--font-weight-normal: 400;
	--font-weight-light: 300;

	/* border radius */
	--border-radius-big: 50px;
	--border-radius-small: 6px;

}


	/* h
	------------------------------------------------------------------------------------------------------  */
	h1{
		font-family: var(--font-medium);
		font-size: 62px;
		line-height: 65px;
		color: var(--color-primary);
	}
	h2{
		font-family: var(--font-medium);
		font-size: 22px;
		line-height: 26px;
		color: var(--color-primary);
	}
	h3{
		font-family: var(--font-medium);
		font-size: 20px;
		line-height: 22px;
		color: var(--color-primary);
	}



	/* body
	------------------------------------------------------------------------------------------------------  */
	body {
		margin: 0 auto;
		width: 100%;
		padding: 0px;
		font-size: var(--font-size);
		font-family: var(--font-regular);
		font-weight: 400;
		background-color: var(--color-background);
	}


	/* row
	------------------------------------------------------------------------------------------------------  */
	.row{
		width: 100%;
		margin: 0 auto;
		padding: 0px;
	}

	/* cols
	------------------------------------------------------------------------------------------------------  */
	.col_100    { float: left; margin: 0px; padding: 0px; width: 100%; }
	.col_90     { float: left; margin: 0px; padding: 0px; width: 90%; }
	.col_85     { float: left; margin: 0px; padding: 0px; width: 85%; }
	.col_80     { float: left; margin: 0px; padding: 0px; width: 80%; }
	.col_75     { float: left; margin: 0px; padding: 0px; width: 75%; }
	.col_70     { float: left; margin: 0px; padding: 0px; width: 70%; }
	.col_66     { float: left; margin: 0px; padding: 0px; width: 66.66%; }
	.col_65     { float: left; margin: 0px; padding: 0px; width: 65%; }
	.col_60     { float: left; margin: 0px; padding: 0px; width: 60%; }
	.col_55     { float: left; margin: 0px; padding: 0px; width: 55%; }
	.col_50     { float: left; margin: 0px; padding: 0px; width: 50%; }
	.col_45     { float: left; margin: 0px; padding: 0px; width: 45%; }
	.col_40     { float: left; margin: 0px; padding: 0px; width: 40%; }
	.col_35     { float: left; margin: 0px; padding: 0px; width: 35%; }
	.col_33     { float: left; margin: 0px; padding: 0px; width: 33.33%; }
	.col_30     { float: left; margin: 0px; padding: 0px; width: 30%; }
	.col_25     { float: left; margin: 0px; padding: 0px; width: 25%; }
	.col_20     { float: left; margin: 0px; padding: 0px; width: 20%; }
	.col_15     { float: left; margin: 0px; padding: 0px; width: 15%; }
	.col_10     { float: left; margin: 0px; padding: 0px; width: 10%; }


	/* contents
	------------------------------------------------------------------------------------------------------  */
	.content-full{
		margin: 0 auto;
		width: 100%;
	    max-width: 1440px;
	}
	.content{
		margin: 0 auto;
		width: 95%;
	    max-width: 1200px;
	}


	/* tools
	------------------------------------------------------------------------------------------------------  */
	a {
		cursor:pointer;
		transition: all 0.3s ease;
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;		
	}
	.text-center{
		text-align: center;
	}
	.text-white{
		color: #fff;
	}
	.btn{
		font-family: var(--font-medium);
		background: rgba(71,123,219,1);
		background: -moz-linear-gradient(left, rgba(71,123,219,1) 0%, rgba(12,81,208,1) 100%);
		background: -webkit-gradient(left top, right top, color-stop(0%, rgba(71,123,219,1)), color-stop(100%, rgba(12,81,208,1)));
		background: -webkit-linear-gradient(left, rgba(71,123,219,1) 0%, rgba(12,81,208,1) 100%);
		background: -o-linear-gradient(left, rgba(71,123,219,1) 0%, rgba(12,81,208,1) 100%);
		background: -ms-linear-gradient(left, rgba(71,123,219,1) 0%, rgba(12,81,208,1) 100%);
		background: linear-gradient(to right, rgba(71,123,219,1) 0%, rgba(12,81,208,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#477bdb', endColorstr='#0c51d0', GradientType=1 );
		color: var(--color-white);
		box-shadow: 0px 10px 10px #000;
		text-align: center;		
		text-decoration: none;
		cursor:pointer;
		box-sizing: border-box;
	}
	.btn:hover{
		background: none;
		color: var(--color-secondary);
		box-shadow: none;
		border: 1px solid var(--color-secondary);
	}
	.btn-selected{
		background: none;
		color: var(--color-secondary);
		box-shadow: none;
		border: 1px solid var(--color-secondary);
	}
	.border-radius-big{
		border-radius: var(--border-radius-big);
		padding: 18px 70px;
	}
	.border-radius-small{
		border-radius: var(--border-radius-small);
		padding: 15px 70px;
	}
        
        .warning {
            border: 1px solid #c66e6e !important;
        }
        .alerta {
            color: #c66e6e;
            width: 100%;
            text-align: center;
            padding-top: 30px;
            float: left;
        }
        
        .embed-container {
                position: relative;
                padding-bottom: 56.25%;
                height: 0;
                overflow: hidden;
                width: 100%;
                max-width: 100%;           
        }
        .embed-container .video-container {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;                  
        }
        .embed-container .video-container iframe {
                width: 100%;
                height: 100%;
        }



	/* pull
	------------------------------------------------------------------------------------------------------  */
	#pull{
		display: none;
		float: right;
		margin-right: 40px;
		margin-left: 30px;
		margin-top: 10px;
	}
	#pull img{
		width:20px;
	}
	#pull img:hover{
		opacity: 0.8;
	}



	/* header
	------------------------------------------------------------------------------------------------------  */
	#header{
		position: absolute;
		display: inline-block;
		width: 94%;
		margin: 0px 3%;
		padding: 8px 30px;
		padding-top: 15px;
		border-bottom: 1px solid var(--color-secondary);
		z-index: 9;
		box-sizing: border-box;
	}
	#header #logo img{
		width: 90px;
	}
	#header #menu-desktop{
		float: right;
		list-style: none;
		margin-top: 4px;
	}
	#header #menu-desktop li{
		float: left;
		margin-left: 10px;
		margin-top: 7px;
	}
	#header #menu-desktop li a{
		color: var(--color-secondary);
		text-decoration: none;
		padding: 21px 18px;
	}
	#header #menu-desktop li a:hover{
		color: var(--color-primary);
		border-bottom: 2px solid var(--color-white);
	}
	#header #menu-desktop li a.padding-contacto{
		padding: 21px 40px;
		margin-right: 30px;
	}
	#header .idiomas{
		position: absolute;
		right: 0px;
		margin-top: 6px;
		background-image: url('../img/ico-arrow-down.svg');
		background-position: 70% 10px;
		background-repeat: no-repeat;
		background-size: 5px;
		border: 1px solid var(--color-secondary);
		border-radius: 6px;
		color: var(--color-primary);
		text-decoration: none;
		font-size: 10px;
		cursor: pointer;
	}
	#header .idiomas:hover{
		border: 1px solid var(--color-primary);
	}

	#header .idiomas span{
		display: inline-block;
		padding: 7px 17px;
		padding-right: 24px;
	}
	#header .idiomas .otro-idioma{
		display: none;
		position: absolute;
		font-weight: 800;
		padding: 7px 17px;
		padding-right: 23px;
		color: #000;
		text-decoration: none;
		background-color: var(--color-white);
		-webkit-border-bottom-right-radius: 5px;
		-webkit-border-bottom-left-radius: 5px;
		-moz-border-radius-bottomright: 5px;
		-moz-border-radius-bottomleft: 5px;
		border-bottom-right-radius: 5px;
		border-bottom-left-radius: 5px;
	}


	/* menu-responsive
	------------------------------------------------------------------------------------------------------  */
	#menu-responsive{
		display: none;	
	}
	#menu-responsive ul{
		float: left;
		width: 100%;
		text-align: center;
		list-style: none;
		margin-top: 10px;
		background-color: #0b0d11;
		box-sizing: border-box;
		border-radius: 8px;
		padding: 30px 0px;
		
	}
	#menu-responsive ul li{
		float: left;
		width: 100%;
	}
	#menu-responsive ul li a{
		display: inline-block;
		color: var(--color-secondary);
		width:100%;
		padding: 15px 0px;
		font-size: 16px;
		text-decoration: none;
	}
	#menu-responsive ul li a:hover{
		color: var(--color-primary);
	}



	/* home
	------------------------------------------------------------------------------------------------------  */
	#home{
		position: relative;
		top: 0px;
		width: 100%;
	}
	#home .caps{
		display: table;
		width: 100%;
		background: center center;
		background-repeat: no-repeat;
		background-size: cover;
		height: 700px;
		transition: all 0.3s ease;
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;		
	}
	#home #cap1-textos, #home #cap2-textos, #home #cap3-textos, #home #cap4-textos{
		display: none;
	}
	#home .cap1{
		background-image: url('../img/cap1.jpg');
	}
	#home .cap1:hover{
		background-image: url('../img/cap1_roll.jpg');
	}
	#home .cap1:hover #cap1-textos{
		display: table-cell
	}
	#home .cap2{
		background-image: url('../img/cap2.jpg');
	}
	#home .cap2:hover{
		background-image: url('../img/cap2_roll.jpg');
	}
	#home .cap2:hover #cap2-textos{
		display: table-cell
	}
	#home .cap3{
		background-image: url('../img/cap3.jpg');
	}
	#home .cap3:hover{
		background-image: url('../img/cap3_roll.jpg');
	}
	#home .cap3:hover #cap3-textos{
		display: table-cell
	}
	#home .cap4{
		background-image: url('../img/cap4.jpg');
	}
	#home .cap4:hover{
		background-image: url('../img/cap4_roll.jpg');
	}
	#home .cap4:hover #cap4-textos{
		display: table-cell
	}
	#home .caps .contenido{
		display: table-cell;
		width: 100%;
		vertical-align: middle;
		text-align: center;
		text-decoration: none;
	}
	#home .caps .contenido .txt{
		color: var(--color-secondary);
		font-size: 10px;
		padding: 15px 0px;
		letter-spacing: 3px;
	}
	#home .caps .contenido .linea{
		display: inline-block;
		width: 1px;
		height: 80px;
		border-right: 1px solid var(--color-secondary);
	}
	#home .caps .contenido .tit{
		color: var(--color-primary);
		font-family: var(--font-medium);
		padding: 20px 0px;
		font-size: 16px;
		line-height: 27px;
		letter-spacing: 4px;
                text-transform: uppercase;
	}
	#flecha-down{
		display: inline-block;
		position: relative;
		z-index: 10;
		width: 100%;
		text-align: center;
		margin-top: -40px;
	}
	#flecha-down img{
		width: 80px;
	}
	#flecha-down img:hover{
		opacity: 0.8;
	}







	/* somos internacionales
	------------------------------------------------------------------------------------------------------  */
	#somos{
		float: left;
		width: 100%;
		position: relative;
		z-index: 9;
		padding-top: 60px;
		margin-top: -72px;
		text-align: center;

		/*background: rgba(58,61,67,1);
		background: -moz-linear-gradient(-45deg, rgba(58,61,67,1) 0%, rgba(19,22,31,1) 46%, rgba(19,22,31,1) 100%);
		background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(58,61,67,1)), color-stop(46%, rgba(19,22,31,1)), color-stop(100%, rgba(19,22,31,1)));
		background: -webkit-linear-gradient(-45deg, rgba(58,61,67,1) 0%, rgba(19,22,31,1) 46%, rgba(19,22,31,1) 100%);
		background: -o-linear-gradient(-45deg, rgba(58,61,67,1) 0%, rgba(19,22,31,1) 46%, rgba(19,22,31,1) 100%);
		background: -ms-linear-gradient(-45deg, rgba(58,61,67,1) 0%, rgba(19,22,31,1) 46%, rgba(19,22,31,1) 100%);
		background: linear-gradient(135deg, rgba(58,61,67,1) 0%, rgba(19,22,31,1) 46%, rgba(19,22,31,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3a3d43', endColorstr='#13161f', GradientType=1 );	*/
                
                background-color: #1c212b;

	}
	#somos h2{
		float: left;
		width: 100%;
		text-align: center;
		color: var(--color-primary);
		margin-bottom: 0px;
	}
	#somos .linea{
		display: inline-block;
		width: 100px;
		border-bottom: 1px solid var(--color-secondary);
		margin-top: 25px;
	}
	#somos .mapa{
		display: inline-block;
		width: 100%;
		margin-top: 80px;
	}
	#somos .mapa img{
		width: 85%;
	}
	#somos .info{
		display: inline-block;
		width: 100%;
		text-align: center;
                margin-bottom: 70px;
	}
	#somos .info .etiqueta{
		display: inline-block;
		width: 100%;
		text-align: center;
		color: var(--color-secondary);
		font-size: 11px;
		letter-spacing: 2px;
	}
	#somos .info .content-btn{
		display: inline-block;
		width: 100%;
		text-align: center;
		margin: 30px 0px;
	}
	#somos .info .titulo{
		display: inline-block;
		width: 100%;
		text-align: center;
		color: var(--color-primary);
		font-size: 22px;
		font-family: var(--font-light);
		margin-top: 70px;
		margin-bottom: 10px;
	}
	#somos .info .titulo span{
		font-family: var(--font-medium);
	}
	#somos .info .linea{
		margin-bottom: 20px;
	}
	#somos .info .descripcion{
		display: inline-block;
		width: 80%;
		max-width: 650px;
		text-align: center;
		line-height: 22px;
		color: var(--color-primary);
	}


	/* piscinas
	------------------------------------------------------------------------------------------------------  */
	#piscinas{
		float: left;
		width: 100%;
		background-image: url('../img/bg_seccions.jpg');
		background-position: center top;
		background-repeat: no-repeat;
		background-size: 100%;
		background-color: #13161f;
		padding-bottom: 170px;
	}
	#piscinas .box-botones{	
		display: inline-block;
		height: 90px;
		width: 96%;
		margin: 25px 2%; 
		margin-top: 160px;
	}
	#piscinas .box-botones a{		
		float: left;
		width: 31%;
		font-size: 16px;
		margin: 0px 1%;
		padding: 15px 0px;
	}
	#piscinas .catalogo{	
		display: inline-block;
		width: 98%;	
		margin: 0px 1%;
	}
	#piscinas .catalogo .num{	
		display: inline-block;
		width: 96%;
		margin: 0px 2%; 
		color: var(--color-primary);
		font-family: var(--font-bold);
		letter-spacing: 1px;

	}	
	#piscinas .catalogo .linea-compuesta{	
		display: inline-block;
		width: 96%;
		margin: 10px 2%; 
	}	
	#piscinas .catalogo .linea-compuesta .linea-sup{	
		float: left;
		height: 1px;
		border-bottom: 1px solid var(--color-primary);
		width: 135px;
		clear: both;
	}	
	#piscinas .catalogo .linea-compuesta .linea-cen{	
		float: left;
		height: 1px;
		margin-top: -1px;
		border-bottom: 1px solid var(--color-primary);
		width: 190px;
		clear: both;
	}	
	#piscinas .catalogo .linea-compuesta .linea-inf{	
		float: left;
		height: 1px;
		border-top: 1px solid var(--color-primary);
		width: 135px;
		clear: both;
	}	
	#piscinas .catalogo h2{	
		display: inline-block;
		width: 96%;
		margin: 25px 2%; 
		font-size: 55px;
		line-height: 60px;
		letter-spacing: 1px;
                max-width: 500px;
	}	
	#piscinas .catalogo .desc{	
		display: inline-block;
		width: 100%;
		margin: 5px 2%; 
		font-size: 15px;
		line-height: 20px;
		color: var(--color-secondary);
	}	
	#piscinas .catalogo .items{	
		display: inline-block;
		width: 100%;
		margin-top: 80px;
	}	
	#piscinas .catalogo .items .item{	
		display: inline-block;
		vertical-align: top;
		width: 28.8%;
		margin: 20px 2%; 
		box-sizing: border-box;
		-webkit-border-bottom-right-radius: 20px;
		-webkit-border-bottom-left-radius: 20px;
		-moz-border-radius-bottomright: 20px;
		-moz-border-radius-bottomleft: 20px;
		border-bottom-right-radius: 20px;
		border-bottom-left-radius: 20px;	
		box-shadow: 0px 8px 12px #000;
	}	
	#piscinas .catalogo .items .item .foto{	
		display: inline-block;
		position: relative;
		z-index: 8;
		width: 100%;
		height: 310px;
		background-position: center center;
		background-repeat: no-repeat;
		background-size: cover;
		-webkit-border-top-left-radius: 20px;
		-webkit-border-top-right-radius: 20px;
		-moz-border-radius-topleft: 20px;
		-moz-border-radius-topright: 20px;
		border-top-left-radius: 20px;
		border-top-right-radius: 20px;
	}	
	#piscinas #div-piscina3 .items .item .foto{	
		height: 210px;
		text-align: center;
	}
	#piscinas #div-piscina3 .items .item .foto img{
		width: 80px;
		margin-top: 63px;
		opacity: 0.8;
	} 	
	#piscinas #div-piscina3 .items .item .foto img:hover{
		opacity: 1;
	}
	#piscinas .catalogo .items .item  .boton{	
		display: inline-block;
		position: relative;
		z-index: 9;
		margin-top: -26px;
		width: 100%;
		text-align: right;
		margin-bottom: -16px;
		top: -10px;
		margin-left: 15px;
		height: 49px;
	}	
	#piscinas .catalogo .items .item  .boton a{	
		display: inline-block;
		padding: 15px 30px;
		letter-spacing: 2px;
		font-size: 16px;
	}	
	#piscinas .catalogo .items .item  .boton a:hover{	
		background-color: #0b0d11;
	}
	#piscinas .catalogo .items .item .datos{
		display:inline-block;
		position: relative;
		z-index: 8;
		width: 100%;
		padding: 22px 30px;
		margin-top: -19px;
		box-sizing: border-box;
		-webkit-border-bottom-right-radius: 20px;
		-webkit-border-bottom-left-radius: 20px;
		-moz-border-radius-bottomright: 20px;
		-moz-border-radius-bottomleft: 20px;
		border-bottom-right-radius: 20px;
		border-bottom-left-radius: 20px;	
		color: var(--color-primary);	
		background: rgba(11,13,17,1);
		background: -moz-linear-gradient(top, rgba(11,13,17,1) 0%, rgba(51,55,66,1) 100%);
		background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(11,13,17,1)), color-stop(100%, rgba(51,55,66,1)));
		background: -webkit-linear-gradient(top, rgba(11,13,17,1) 0%, rgba(51,55,66,1) 100%);
		background: -o-linear-gradient(top, rgba(11,13,17,1) 0%, rgba(51,55,66,1) 100%);
		background: -ms-linear-gradient(top, rgba(11,13,17,1) 0%, rgba(51,55,66,1) 100%);
		background: linear-gradient(to bottom, rgba(11,13,17,1) 0%, rgba(51,55,66,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0b0d11', endColorstr='#333742', GradientType=0 );

	}	
        #piscinas .catalogo .items .item .datos.pisc{
                padding: 35px 30px 30px 30px;
                min-height: 110px;
        }
	#piscinas .catalogo .items .item .datos h3{	
		display: inline-block;
		width: 100%;
		margin: 0px;
		font-size: 17px;
	}	
	#piscinas .catalogo .items .item .datos .tipo{
		display: inline-block;
		width: 100%;
		margin: 5px 0px	;
		font-size: 13px;	
		color: var(--color-secondary);	
	}	
	#piscinas .catalogo .items .item .datos .sistema{
		display: inline-block;
		width: 100%;
		margin: 0px;
		font-size: 13px;	
		color: var(--color-secondary);	
	}	


	
	/* contacto
	------------------------------------------------------------------------------------------------------  */
	#contacto{
		float: left;
		width: 100%;
		background-color: #191e26;
		padding: 50px 0px;
		text-align: center;
	}	
	#contacto h2{
		float: left;
		width: 100%;
		text-align: center;
		color: var(--color-primary);
		margin-bottom: 0px;
	}
	#contacto .linea{
		display: inline-block;
		width: 100px;
		border-bottom: 1px solid var(--color-secondary);
		margin-top: 25px;
	}



	/* mapas
	------------------------------------------------------------------------------------------------------  */
	#mapas{
		float: left;
		width: 100%;
		background-color: #13161f;
	}
	#mapas .direcciones{
		float: right;
		width: 100%;
		margin-top: 15px;
	}
	#mapas .direcciones .direccion{
		float: right;
		width: 80%;
		margin-top: 40px;
		border-radius: 15px;
		padding: 25px 40px;
		box-sizing: border-box;
		font-size: 20px;
		line-height: 32px;
		font-family: var(--font-light);
		color: var(--color-primary);
		background-color: #232933;
		text-align: left;
		color: var(--color-secondary);

	}
	#mapas .direcciones .direccion_selected{
		background-color: #394351;
		box-shadow: 0px 8px 12px #000;
		color: var(--color-primary);
	}
	#mapas .direcciones span{
		font-family: var(--font-weight-bold);
	}
	#mapas .mapa_ubicacion{
		float: left;
		width: 100%;
		height: 530px;
		background-color: #111;
		/*-webkit-border-top-right-radius: 40px;
		-webkit-border-bottom-right-radius: 40px;
		-moz-border-radius-topright: 40px;
		-moz-border-radius-bottomright: 40px;
		border-top-right-radius: 40px;
		border-bottom-right-radius: 40px;*/		
	}
	#mapas #mapa1{
		display: inline-block;
		width: 100%;
		height: 530px;
		/*background-image: url('../img/mapa1.png');
		background-position: center center;
		background-repeat: no-repeat;
		background-size: cover;*/
	}
	#mapas #mapa2{
		display: inline-block;
		width: 100%;
		height: 530px;
		/*background-image: url('../img/mapa2.png');
		background-position: center center;
		background-repeat: no-repeat;
		background-size: cover;*/
	}




	/* form
	------------------------------------------------------------------------------------------------------  */
	form{
		margin: 0 auto;
		width: 90%;
		max-width: 650px;
		text-align: left;
		margin-top: 30px;
	}
	form .box-input{
		float: left;
		width: 100%;
		
	}
	form .box-input-50-left{
		float: left;
		width: 49%;
	}
	form .box-input-50-right{
		float: right;
		width: 49%;
	}
	form label{
		float: left;
		width: 100%;
		padding: 0px 25px;
		margin-top: 10px;
		color: var(--color-secondary);
	}
	form input,textarea{
		float: left;
		width: 100%;
		padding: 18px 30px;
		margin-top: 10px;
		font-size: 15px;
		color: var(--color-white);
		background-color: #232933;
		border: 0px;
		border-radius: 50px;
		outline: none;
		box-sizing: border-box;
		margin-bottom: 10px;
	}
	form input:focus{
		background-color: #394351;
		box-shadow: 0px 4px 12px #000;
	}
	form .loschecks{
		float: left;
		width: 100%;
		font-size: 12px;
		line-height: 18px;
		padding: 20px 0px;
		color: var(--color-secondary);
	}
	form .loschecks .elcheck{
		float: left;
		width: 26px;
	}
	form .loschecks .textos{
		float: left;
		width: auto;
	}
        form .loschecks .textos a {
		color: #fff;
                text-decoration: none;
                color: #e0e0e0;
	} 
        form .loschecks .textos a:hover {
		color: #969695;                
	} 
	input[type='checkbox'] {
		margin-top: -30px;
	}
	input[type='checkbox'] {
		-webkit-font-smoothing: antialiased;
		text-rendering: optimizeSpeed;
		width: 13px;
		height: 13px;
		margin: 0;
		margin-right: 1px;
		display: block;
		float: left;
		position: relative;
		cursor: pointer;
	}	
	input[type='checkbox']:after {
		content: "";
		vertical-align: middle;
		text-align: center;
		line-height: 13px;
		position: absolute;
		cursor: pointer;
		height: 13px;
		width: 13px;
		left: 0;
		top: 0;
		font-size: 13px;
		background: #191e26;
		border: 1px solid var(--color-secondary);
		margin-left: 2px !important;
	}	
	input[type='checkbox']:hover:after, input[type='checkbox']:checked:hover:after {
		background-color: #394351;
		box-shadow: 0px 4px 12px #000;
		content: '\2714';
		color: #fff;
		margin-left: 2px !important;
	}	
	input[type='checkbox']:checked:after {
		background-color: #394351;
		box-shadow: 0px 4px 12px #000;
		content: '\2714';
		color: #fff;
		margin-left: 2px !important;
	}
	form .box-btn{
		float: left;
		width: 100%;
		text-align: center;
		margin-top: 25px;
		margin-bottom: 10px;
	}
	form .box-btn .btn{
		display: inline-block;
		padding: 16px 60px;
		border-radius: 6px;
		letter-spacing: 2px;
		font-size: 16px;
	}	
	form .box-btn .btn img{
		width: 15px;
	}
	.msgs_form{
		float:left; 
		clear:both; 
		display: none; 
		text-align:left; 
		margin-top:5px; 
		color:#fff; 
		padding:5px 10px; 
		background-color:#c00;
		font-size: 13px;
		font-weight: 300;
	}		  
	.msgs_send{
		float:left; 
		clear: left; 
		width: auto; 
		display: none; 
		margin-top: 5px;
		font-size:15px;
		background-color: #5cac20;
		color: #fff;
		padding: 10px 10px;
		text-transform: uppercase;
		font-weight: 700;
	}
		  



        /* jiSlider
	------------------------------------------------------------------------------------------------------  */
        
        .jislide {
            cursor: pointer;
        }
        #jxSlider {
            width: 100%;
            height: 100%;
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            z-index: 99999;
	}    
        #jiSlideFrame {
            width: 100%;
            height: 100%;   
            position: absolute;
            top: 0;
            left: 0;
            z-index: 99999;
        }        
        
	

	/* footer
	------------------------------------------------------------------------------------------------------  */
	#footer{
		float: left;
		width: 100%;
		text-align: center;
		background-color: #232933;
		padding: 20px 0px;
		color: var(--color-secondary);
		font-size: 12px;
	}
	#footer #logos{
		display: table;
		width: 100%;
		text-align: center;
		height: 100px;
	}
	#footer .content-logos{
		text-align: center;
		height: 100px;
		display: table-cell;
		vertical-align: middle;
	}
	#footer img{
		display: inline-block;
		margin: 0 20px;		
		vertical-align: middle;
	}
	#social{
		float: left;
		width: 100%;
		padding: 30px 0px; 
		text-align: right;
		background-color: #13161f;
		color: var(--color-white);
		letter-spacing: 1px;
		box-sizing: border-box;
		font-size: 12px;
		letter-spacing: 1px;
	}
	#social .cont1{
		display: inline-block;
		width: 98%;	
		margin: 0px 1%;
		}
	#social .cont1 .cont2{
		display: inline-block;
		width: 94%;
		margin: 0px 3%; 
		}
	#social img{
		height: 18px;
		margin-left: 20px;
		margin-top: 16px;
	}
	#social a{
		text-decoration: none;
	}




	/* copy
	------------------------------------------------------------------------------------------------------  */
	#copy{
		float: left;
		width: 100%;
		text-align: center;
		background-color: #232933;
		padding: 20px 0px;
		color: var(--color-secondary);
		font-size: 12px;
	}	

        
        
        /* aviso legal
	------------------------------------------------------------------------------------------------------  */
	#aviso-legal h1{
		color: #000;
                font-size: 30px;
                text-align: center;
	}
        #aviso-legal h2{
		color: #000;
                font-size: 24px;
                text-align: center;
	}
        #aviso-legal h3{
		color: #000;
                font-size: 18px;               
	}






	/* responsive
	------------------------------------------------------------------------------------------------------  */

	@media only screen and (max-width: 1120px) {
	
		#menu-desktop{
			display: none;
		}
		#pull{
			display: inline-block;
		}
	
	}


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

		#mapas .col_50, #mapas .col_45{
			width: 100%;
		}
		#mapas #mapa1{
			height: 330px;
		}
		#mapas #mapa2{
			height: 330px;
		}
		#mapas .direcciones{
			float: left;
			width: 100%;
			margin-top: 0px;
			margin-bottom: 0px;
		}
		#mapas .direcciones .direccion{
			float: left;
			width: 48%;
			margin: 45px 1%;
			font-size: 20px;
			font-size: 16px;
			line-height: 22px;
			min-height: 170px;
		}

	}


	@media only screen and (max-width: 830px) {
	
		#home .col_25{			
			width: 50%;
		}
		#piscinas .box-botones{	
			height: 210px;
		}
		#piscinas .box-botones a{		
			width: 98%;
			margin: 0px 1%;
			margin-bottom: 15px;
		}
		#piscinas .catalogo h2{	
			font-size: 35px;
			line-height: 40px;
		}	
		#piscinas .catalogo .items .item{	
			width: 92%;
			margin: 20px 4%; 
		}	
		form .box-input-50-left{
			width: 100%;
		}
		form .box-input-50-right{
			float: left;
			width: 100%;
		}
	
	}


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

		form{
			width: 70%;
		}
		
	}



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

		#mapas .direcciones{
			margin-top: 40px;
			margin-bottom: 40px;
		}
		#mapas .direcciones .direccion{
			float: left;
			width: 98%;
			margin: 10px 1%;
			font-size: 16px;
			line-height: 20px;
			min-height: auto;
		}

	}


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

		#footer img{
			margin: 10px 20px;
		}

	}


	@media only screen and (max-width: 510px) {
	
		#home .col_25{			
			width: 100%;
		}

	}
