html {padding: 0; margin: 0; height: 100%;}
body {margin: 0 auto; font-family: "Exo", sans-serif; font-size:14px; color:#424242; overflow-x:hidden; height: 100%; background-color: #fff;}			

* {box-sizing: border-box;}
img {border: 0; }
ul, ol, li, dl, dt, dd {list-style-type: none; margin: 0; padding:0;}
a {text-decoration: none;}
a:hover {text-decoration: none;}
input:focus, textarea:focus, button:focus {outline: none;}
h1,h2,h3,h4,h5,h6 {padding: 0; margin: 0; }
form,fieldset,label,input {padding: 0;margin: 0; }
fieldset {border: 0;}
p {margin: 0 0; }
*:focus {outline: 0 none;}


.cuerpo { display:block; position:relative; overflow:hidden; width:100vw; height:100vh; background-image:url(../img/fondo-prehome.jpg); background-repeat:no-repeat; background-position:center; background-size:cover; }
.cuerpo h1 { display:block; position:relative; overflow:hidden; width:24.5vw; margin:18vh auto 0 auto; transform: translateY(-200px); opacity: 0; transition: all .5s .5s;}
.cuerpo h1 img { display:block; width:100%; height:auto; }
.cuerpo.active h1 { opacity: 1; transform: translateX(0); }

.cuerpo .lineaizq { display:block; position:absolute; top:30vh; left:42.5vw; width:5.7vw;  z-index:1;  -webkit-transition: height 1s .5s; -webkit-transition-timing-function: linear; transition: height 1s .5s; transition-timing-function: linear; height:0; background-image:url(../img/linea-izquierda.png); background-repeat: no-repeat; background-position:center top; background-size:100%;}
.cuerpo.active .lineaizq { height:10vw; }
.cuerpo .lineader { display:block; position:absolute; top:30vh; left:52vw; width:5.7vw; height:auto; z-index:1;  -webkit-transition: height 1s 2.5s; -webkit-transition-timing-function: linear;  transition: height 1s 2.5s; transition-timing-function: linear; height:0; background-image:url(../img/linea-derecha.png); background-repeat: no-repeat; background-position:center top; background-size:100%;}
.cuerpo.active .lineader { height:10vw; }

.cuerpo .lineacen { display:block; position:absolute; top:37vh; left:49.6vw; width:.95vw;  z-index:1;  -webkit-transition: height 1s 3s; -webkit-transition-timing-function: linear; transition: height 1s 3s; transition-timing-function: linear; height:0; background-image:url(../img/linea-centro.png); background-repeat: no-repeat; background-position:center top; background-size:100%;}
.cuerpo.active .lineacen { height:18vw; }


.cuerpo .izq { display:inline-block; float:left; position:relative; overflow:hidden; width:37.60vw; margin:8vw 0 0 6vw; text-align:right; z-index:2;}

.cuerpo .izq h2 { display: inline-block; float:right; margin-bottom:2vw; transform: translateY(50px); opacity: 0; transition: all .5s 1s;}

.cuerpo .izq h2 a { display: block; background:#5a5a5a; border:1px solid #5a5a5a; border-radius: 25px; color:#fff; padding:.5vw 1vw; text-transform: uppercase; font-size:2vw; font-weight: bold; font-family: 'DINCond'; }
.cuerpo.active .izq h2 { opacity: 1; transform: translateX(0);  }

.cuerpo .izq h2 a:hover { background:#55cbf2; border-color:#55cbf2; transition:none !important;}

.cuerpo .izq ul { display:block; position:relative; overflow:hidden; width:100%;  }

.cuerpo .izq ul li { display: block; position:relative; overflow:hidden; width:100%; font-size:1vw; line-height:1.2vw; margin-bottom:.3vw; }
.cuerpo .izq ul li:nth-child(1) { transition: all 1s 1.5s; transform: translateY(100px); opacity: 0;}
.cuerpo .izq ul li:nth-child(2) { transition: all 1s 1.6s; transform: translateY(100px); opacity: 0;}
.cuerpo .izq ul li:nth-child(3) { transition: all 1s 1.7s; transform: translateY(100px); opacity: 0;}
.cuerpo .izq ul li:nth-child(4) { transition: all 1s 1.8s; transform: translateY(100px); opacity: 0;}
.cuerpo .izq ul li:nth-child(5) { transition: all 1s 1.9s; transform: translateY(100px); opacity: 0;}
.cuerpo.active .izq ul li { opacity: 1; transform: translateX(0); }

.cuerpo .izq ul li .fa { margin-left:.5vw; }

.cuerpo .der { display:inline-block; float:right; position:relative; overflow:hidden; width:37.60vw; margin:8vw 6vw 0 0; text-align:left; z-index:2;}
.cuerpo .der h2 { display: inline-block; float:left; transform: translateY(50px); opacity: 0; transition: all .5s 3s; margin-bottom:2vw; }

.cuerpo .der h2 a { display: block;  background:#5a5a5a; border:1px solid #5a5a5a; border-radius: 25px; color:#fff; padding:.5vw 1vw; text-transform: uppercase; font-size:2vw; font-weight: bold; font-family: 'DINCond'; }
.cuerpo.active .der h2 { opacity: 1; transform: translateX(0); }
.cuerpo .der h2 a:hover { background:#55cbf2; border-color:#55cbf2;transition:none !important}

.cuerpo .der ul { display:block; position:relative; overflow:hidden; width:100%; }
.cuerpo .der ul li { display: block; position:relative; overflow:hidden; width:100%; font-size:1vw; line-height:1.2vw; margin-bottom:.3vw; }
.cuerpo .der ul li { display: block; position:relative; overflow:hidden; width:100%; font-size:1vw; line-height:1.2vw; margin-bottom:.3vw; }
.cuerpo .der ul li:nth-child(1) { transition: all 1s 3.5s; transform: translateY(100px); opacity: 0;}
.cuerpo .der ul li:nth-child(2) { transition: all 1s 3.6s; transform: translateY(100px); opacity: 0;}
.cuerpo .der ul li:nth-child(3) { transition: all 1s 3.7s; transform: translateY(100px); opacity: 0;}
.cuerpo .der ul li:nth-child(4) { transition: all 1s 3.8s; transform: translateY(100px); opacity: 0;}
.cuerpo .der ul li:nth-child(5) { transition: all 1s 3.9s; transform: translateY(100px); opacity: 0;}
.cuerpo.active .der ul li { opacity: 1; transform: translateX(0); }

.cuerpo .der ul li .fa { margin-right:.5vw; }

.cuerpo .cen { display:block; position:relative; overflow:hidden; width:100%; margin:2vw auto; text-align:center; z-index:2; top:2vw;}

.cuerpo .cen h2 { display: table; margin:0 auto; margin-bottom:2vw; transform: translateY(50px); opacity: 0; transition: all .5s 3.5s;}

.cuerpo .cen h2 a { display: block; background:#5a5a5a; border:1px solid #5a5a5a; border-radius: 25px; color:#fff; padding:.5vw 1vw; text-transform: uppercase; font-size:2vw; font-weight: bold; font-family: 'DINCond'; }
.cuerpo.active .cen h2 { opacity: 1; transform: translateX(0);  }
.cuerpo .cen h2 a:hover { background:#55cbf2; border-color:#55cbf2;transition:none !important}


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

	.cuerpo h1 { width:52.5vw; }
	.cuerpo .izq h2 a, .cuerpo .der h2 a, .cuerpo .cen h2 a { padding:5px 10px; font-size:22px; }
	.cuerpo .izq ul li, .cuerpo .der ul li { font-size:14px; line-height:16px; margin-bottom:5px;}
	.cuerpo .izq ul li .fa, .cuerpo .der ul li .fa { display:none; }
	.cuerpo .lineaizq, .cuerpo .lineader { top:28.5vh; }
	.cuerpo .lineacen { top:37vw; }
	.cuerpo.active .lineacen { height:35vw; }

}

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

	.cuerpo h1 { width:90%; margin-top:8vw;}
	.cuerpo .lineaizq, .cuerpo .lineader, .cuerpo .lineacen { display:none; }
	.cuerpo .izq, .cuerpo .der, .cuerpo .cen { display:block; width:90%; margin-left:5%; margin-right:5%; text-align:center; margin-top:10px;}
	.cuerpo .der, .cuerpo .cen { margin-top:20px; }
	.cuerpo .izq h2, .cuerpo .der h2, .cuerpo .cen h2 { float:none; margin-bottom:20px;}

	
}

/* --- Font ---- */

@font-face {
    font-family: 'DINCond';
    src: url('../fonts/dincond-bold-webfont.eot');
    src: url('../fonts/dincond-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/dincond-bold-webfont.woff2') format('woff2'),
         url('../fonts/dincond-bold-webfont.woff') format('woff'),
         url('../fonts/dincond-bold-webfont.ttf') format('truetype'),
         url('../fonts/dincond-bold-webfont.svg#dincond-boldregular') format('svg');
    font-weight: normal;
    font-style: normal;

}