* {
box-sizing:border-box;
}
body {
font-family:'Roboto', sans-serif;
overflow-x:hidden;
font-weight:400;
padding:0px;
margin:0px;
color:#444;
}
body p {
font-family:'Roboto', sans-serif;
padding:0px;
margin:0px;
}
body ul {
list-style-type:none;
padding:0px;
margin:0px;
}
a, a:hover {
-webkit-transition:all 0.2s linear; transition:all 0.2s linear; 
}
h1, h2, h3, h4, h5, h6 {
font-weight:400;
padding:0px;
margin:0px;
}
.container {
max-width:1214px;
margin:0 auto;
width:100%;
}

/*---  TOP LANDING  --------------------------------------------------------------------------*/


#top {
justify-content:center; flex-direction:column;
background:#000; background-size:cover;
position:relative;
min-height:855px;
overflow:hidden;
display:flex;
width:100%;
}
#myVideo {
position:absolute;
right:0px; bottom:0px;
min-height:100%;
min-width:100%;
opacity:0.5;
}
.top__titulo {
text-transform:uppercase;
position:relative;
text-align:center;
width:fit-content;
margin:0 auto;
color:#FFF;
}
.top__titulo:before {
background:url(images/im-top-izq.png);
width:45px; height:45px;
top:-50px; left:-20px;
position:absolute;
display:block;
content:'';
}
.top__titulo:after {
background:url(images/im-top-der.png);
width:45px; height:45px;
top:-50px; right:-20px;
position:absolute;
display:block;
content:'';
}
.top__titulo h1 {
font-family:'FUENTE01';
letter-spacing:-0.02em;
position:relative;
line-height:85px;
font-size:85px;
}
.top__titulo h1:before {
background:url(images/im-inf-izq.png);
bottom:-52px; left:-20px;
width:45px; height:45px;
position:absolute;
display:block;
content:'';
}
.top__titulo h1:after {
background:url(images/im-inf-der.png);
bottom:-52px; right:-20px;
width:45px; height:45px;
position:absolute;
display:block;
content:'';
}
.top__titulo h2 {
font-family:'FUENTE02';
padding:14px 48px 0 127px;
letter-spacing:0.02em;
position:relative;
width:fit-content;
line-height:24px;
font-size:24px;
float:right;
}
.top__titulo h2:before {
background:url(images/log-dow.png);
position:absolute;
top:8px; left:0px;
display:block;
width:114px;
height:38px;
content:'';
}
#top h4 {
font-family:'FUENTE03';
letter-spacing:0.2em;
line-height:36px;
text-align:right;
font-size:30px;
color:#43C0EE;
}
#top .container {
transform:translateX(-50%);
position:absolute;
text-align:right;
bottom:180px;
left:50%;
}
#top h4 span {
border-bottom:1px solid #43C0EE;
}


/*---  HEADER  --------------------------------------------------------------------------*/


header {
position:absolute;
padding:0 60px;
width:100%;
color:#FFF;

top:0px;
}
.header__izq {
padding-top:40px;
width:346px;
float:left;
}
.header__der {
width:calc(100% - 346px);
text-align:right;
padding-top:53px;
float:right;
}
.header__der-phone, .header__der-whats {
letter-spacing:-0.01em;
font-family:'FUENTE02';
display:inline-block;
line-height:30px;
font-size:30px;
}
.header__der-phone {
margin-right:18px;
}
.header__der-phone i {
vertical-align:bottom;
padding-bottom:4px;
margin-right:10px;
font-size:20px;
}
.header__der-whats i {
vertical-align:bottom;
margin-right:10px;
font-size:28px;
color:#36BB22;
}
header a {
text-decoration:none;
color:#FFF;
}
header a:hover, header a:hover {
opacity:0.7;
}
header ul {
border-left:1px solid #b7b7b7;
display:inline-block;
margin-left:16px;
padding-left:2px;
overflow:hidden;
height:21px;
}
header ul li {
display:inline-block;
margin-left:16px;
}
header ul li i {
font-size:22px;
}


/*---  CUERPO  --------------------------------------------------------------------------*/


#landing {
margin:-170px auto -150px;
position:relative;
z-index:99;
}
.cuerpo {
clip-path:polygon(0% 16%, 100% 0, 100% 100%, 0% 88%);
grid-template-columns:50% 50%;
display:grid;
}
.cuerpo .row {
max-width:690px;
} 
.cuerpo__izq {
background:url(images/fond-info.jpg) no-repeat center center;
background-size:cover;
position:relative;
padding:60px;
color:#FFF;
}
.cuerpo .cuerpo__izq .row {
float:right;
} 
.cuerpo__izq h3 {
font-family:'FUENTE01';
letter-spacing:-0.01em;
margin-bottom:41px;
padding-top:140px;
line-height:48px;
font-size:40px;
}
ul.cuerpo__izq-lista {
padding-left:42px;
}
ul.cuerpo__izq-lista li {
margin-bottom:28px;
padding-left:56px;
position:relative;
line-height:26px;
font-size:16px;
}
ul.cuerpo__izq-lista li:before {
width:31px; height:27px;
top:-2px; left:0px;
position:absolute;
display:block;
content:'';
}
ul.cuerpo__izq-lista li:nth-child(odd):before {
background:url(images/im-flech01.png);
}
ul.cuerpo__izq-lista li:nth-child(even):before {
background:url(images/im-flech02.png);
}
.cuerpo__izq li h2 {
font-family:'FUENTE03';
letter-spacing:0.2em;
padding-bottom:6px;
line-height:26px;
font-size:24px;
color:#43C0EE;
}
.cuerpo__der {
background:#FFF;
padding:170px 75px 140px;
}
.cuerpo__der-head {
line-height:24px;
font-size:15px;
}
.cuerpo__der-head h3 {
font-family:'FUENTE04';
letter-spacing:-0.02em;
padding-bottom:13px;
line-height:48px;
font-size:48px;
color:#444;
}
.cuerpo__der-head h2 {
letter-spacing:-0.02em;
padding-bottom:7px;
line-height:26px;
font-weight:700;
font-size:20px;
color:#095587;
}


/*---  FORMULARIO  --------------------------------------------------------------------------*/


.cuerpo__der-form {
margin-top:36px;
}
.col-6-izq {
padding-right:25px;
position:relative;
float:left;
width:50%;
}
.col-6-der {
padding-left:25px;
position:relative;
float:left;
width:50%;
}
.col-12 {
position:relative;
clear:both;
width:100%;
}
.col-captcha {
margin-bottom:30px;
}
.cuerpo__der-form span {
-webkit-transition:all 0.2s linear; transition:all 0.2s linear; 
height:2px; width:0px;
visibility:hidden;
position:absolute;
background:#095587;
display:block;
bottom:30px;
}
.cuerpo__der-form .txar span {
bottom:39px;
}
.col-6-izq.activo span, .col-6-der.activo span, .col-12.activo span {
-webkit-transition:all 0.4s linear; transition:all 0.4s linear; 
width:calc(100% - 25px);
visibility:visible;
}
.col-12.activo span {
width:100%;
}
.cuerpo__der-form label {
line-height:24px;
font-size:15px;
display:block;
color:#555;
}
.cuerpo__der-form .form-control {
font-family:'Roboto', sans-serif;
color:#212121;
width:100%;
}
.cuerpo__der-form input {
border:none; border-bottom:1px solid #858585;
padding:13px 0 12px; box-sizing:border-box;
margin-bottom:31px;
border-radius:0px;
background:none;
font-size:15px;
}
.cuerpo__der-form textarea {
border:none; border-bottom:1px solid #858585;
font-size:15px; line-height:20px;
padding:9px 0; margin-bottom:36px;
border-radius:0px;
background:none;
height:113px;
}
.cuerpo__der-form input:focus, .cuerpo__der-form textarea:focus {
outline:0px;
}
.cuerpo__der-form .btn-primary {
background:rgb(12,91,141); background: linear-gradient(125deg, #0A5688 0%, #3CB3E2 100%);
-webkit-transition:all 0.5s linear; transition:all 0.5s linear; 
padding:15px 65px 16px!important;
border-radius:49px!important;
font-family:'Roboto';
display:inline-block;
line-height:18px;
font-weight:700;
font-size:18px;
cursor:pointer;
color:#FFF;
border:0px;
}
.cuerpo__der-form .btn-primary:hover {
-webkit-transition:all 0.5s linear; transition:all 0.5s linear; 
background-position:0 100px; 
}


/*---  PREFOOTER  --------------------------------------------------------------------------*/


#prefooter {
background:url(images/fond-final.jpg) no-repeat center center;
background-size:cover;
padding:255px 0 145px;
position:relative;
text-align:center;
width:100%;
color:#FFF;
}
.obras { 
position:absolute; left:50%;
transform:translateX(-50%);
text-align:left;
width:1500px;
z-index:999;
top:-10px;
}
.obras img {
display: inline-block;
margin-right:25px;
}
.final {
width:fit-content;
margin:0 auto;
}
#prefooter h3 {
background:url(images/fond-ray.png) repeat-x bottom;
text-transform:uppercase;
font-family:'FUENTE01';
letter-spacing:-0.01em;
padding-bottom:30px;
line-height:60px;
font-size:60px;
}
#prefooter h3 img {
vertical-align:text-bottom;
margin-left:7px;
}
#prefooter p {
line-height:26px;
padding-top:35px;
font-size:20px;
}

/*---  FOOTER  --------------------------------------------------------------------------*/


footer {
background:#43C0EE;
padding:0 60px;
display:table;
width:100%;
color:#FFF;
}
.foot__izq {
padding:24px 0 22px;
width:173px;
float:left;
}
.foot__izq img {
max-width:173px;
display:block;
}
.foot__der {
width:calc(100% - 175px);
text-align:right;
float:right;
}
footer a {
text-decoration:none;
color:#FFF;
}
footer a:hover, footer a:hover {
opacity:0.7;
}
footer ul {
vertical-align:bottom;
display:inline-block;
margin:25px 0 0 5px;
overflow:hidden;
height:21px;
}
footer ul li {
display:inline-block;
margin-left:16px;
}
footer ul li i {
font-size:22px;
}
.foot__der-links {
display:inline-block;
margin-left:24px;
line-height:20px;
font-size:16px;
}
.foot__der-links i {
vertical-align:baseline;
margin-right:10px;
}
.foot__der-links i.fa-envelope {
vertical-align:text-top;
font-size:18px;
}
.foot__der-bloq {
border-top:8px solid #095587;
width:fit-content;
margin-top:-4px;
float:right;
}


/*---  FUENTES  --------------------------------------------------------------------------*/


@font-face {
font-family:'FUENTE01';
src: url('fonts/Condensed.eot');
src: url('fonts/Condensed.eot?iefix') format('eot'),
url('fonts/Condensed.woff') format('woff'),
url('fonts/Condensed.ttf') format('truetype'),
url('fonts/Condensed.svg#webfont4Bjy2lJe') format('svg');
font-weight:normal;
}
@font-face {
font-family:'FUENTE02';
src: url('fonts/Medium.eot');
src: url('fonts/Medium.eot?iefix') format('eot'),
url('fonts/Medium.woff') format('woff'),
url('fonts/Medium.ttf') format('truetype'),
url('fonts/Medium.svg#webfont4Bjy2lJe') format('svg');
font-weight:normal;
}
@font-face {
font-family:'FUENTE03';
src: url('fonts/Bebas.eot');
src: url('fonts/Bebas.eot?iefix') format('eot'),
url('fonts/Bebas.woff') format('woff'),
url('fonts/Bebas.ttf') format('truetype'),
url('fonts/Bebas.svg#webfont4Bjy2lJe') format('svg');
font-weight:normal;
}
@font-face {
font-family:'FUENTE04';
src: url('fonts/Bold.eot');
src: url('fonts/Bold.eot?iefix') format('eot'),
url('fonts/Bold.woff') format('woff'),
url('fonts/Bold.ttf') format('truetype'),
url('fonts/Bold.svg#webfont4Bjy2lJe') format('svg');
font-weight:normal;
}


/*---  PRELOADER  --------------------------------------------------------------------------*/


.preloader {
position:absolute; top:50%; left:50%; width:60px; height:60px;
-webkit-animation:spin .7s linear infinite;
-moz-animation:spin .7s linear infinite;
animation:spin .7s linear infinite;
margin:-30px 0 0 -30px;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } } @-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
.preloader img {
width:100%;
}


/*---  FORMULARIO  --------------------------------------------------------------------------*/


#topGracias {
background:url(images/fond-final.jpg) no-repeat center center;
background-size:cover;
padding-top:200px;
text-align:center;
position:relative;
min-height:450px;
overflow:hidden;
width:100%;
}
#gracias {
text-align:center;
line-height:28px;
padding:120px 0;
background:#FFF;
font-size:16px;
width:100%;
}
#gracias strong {
font-size:18px;
}
#gracias h2 {
text-transform:uppercase;
font-family:'FUENTE01';
letter-spacing:-0.01em;
margin-bottom:22px;
line-height:48px;
font-size:40px;
color:#095587;
}
#gracias a {
background:rgb(12,91,141); background: linear-gradient(125deg, #0A5688 0%, #3CB3E2 100%);
-webkit-transition:all 0.5s linear; transition:all 0.5s linear; 
padding:15px 65px 16px!important;
border-radius:49px!important;
text-decoration:none;
font-family:'Roboto';
display:inline-block;
line-height:18px;
margin-top:28px;
font-weight:700;
font-size:18px;
cursor:pointer;
color:#FFF;
border:0px;
}
#gracias a:hover, #gracias a:focus {
-webkit-transition:all 0.5s linear; transition:all 0.5s linear; 
background-position:0 100px; 
}

/*---  ANIMACIONES  --------------------------------------------------------------------------*/


#top {animation:1s top-anim01 ease-in-out;}
@keyframes top-anim01 {0% {opacity:0} 100% {opacity:1}
}
header {opacity:0; animation:0.5s top-anim02 ease-in-out; animation-delay:1s; animation-fill-mode:forwards;}
@keyframes top-anim02 {0% {transform: translateY(30px); opacity:0;}
100% {transform: translateY(0px); opacity:1;}
}
.top__titulo {opacity:0; animation:0.5s top-anim03 ease-in-out; animation-delay:1.5s; animation-fill-mode:forwards;}
@keyframes top-anim03 {0% {transform: translateY(100px); opacity:0;}
100% {transform: translateY(0px); opacity:1;}
}
.top__titulo h2 {opacity:0; animation:0.5s top-anim04 ease-in-out; animation-delay:1.7s; animation-fill-mode:forwards;}
@keyframes top-anim04 {0% {transform: translateX(-120px); opacity:0;}
100% {transform: translateX(0px); opacity:1;}
}
#top h4 {opacity:0; animation:0.5s top-anim05 ease-in-out; animation-delay:2s; animation-fill-mode:forwards;}
@keyframes top-anim05 {0% {transform: translateX(-120px); opacity:0;}
100% {transform: translateX(0px); opacity:1;}
}


/*---  RESPONSIVE  -------------------------------------------------------------*/


@media (max-width:1549px) {  
.cuerpo__der {padding:170px 30px 140px 60px;}
.cuerpo .row {max-width:inherit; width:100%;}
.cuerpo__izq {padding:60px 60px 60px 30px;}
.obras {padding:0 30px; width:100%;}
header {padding:0 30px;}
footer {padding:0 30px;}
}

@media (max-width:1449px) {  
.cuerpo__izq h3 br {display:none;}
}

@media (max-width:1279px) {  
.container {max-width:inherit; padding:0 30px;}
.top__titulo {width:100%; padding:0 30px;}
.top__titulo h1:before {left:0px;}
.top__titulo h1:after {right:0px;}
.top__titulo:before {left:30px;}
.top__titulo:after {right:30px;}
}

@media (max-width:991px) {  
.cuerpo {grid-template-columns:100%; grid-template-rows:auto auto; clip-path:polygon(0% 5%, 100% 0, 100% 100%, 0% 95%);}
.cuerpo__der {padding:70px 30px 180px 30px;}
.cuerpo__izq {padding:60px 60px 30px 30px;}
.final {width:100%; padding:0 30px;}
#prefooter {padding:220px 0 120px;}
.cuerpo__izq h3 {padding-top:60px;}
#prefooter h3 br {display:none;}
}

@media (max-width:939px) {  
.header__izq {padding-top:25px; text-align:center; width:100%;}
.header__der {width:100%; text-align:center; padding-top:25px;}
}

@media (max-width:859px) {  
.top__titulo h2 {padding:14px 15px 0; width:100%; text-align:center; float:none;}
.top__titulo h2:before {top:50px; left:50%; transform:translateX(-50%);}
.top__titulo h1 {line-height:72px; font-size:72px;}
}

@media (max-width:767px) {
#topGracias .top__titulo h1 {line-height:52px; font-size:48px;}
#topGracias .top__titulo {margin-top:20px;}
.top__titulo h1 {padding:0 15px;}
.top__titulo:before {top:-25px;}
.top__titulo {margin-top:-20px;}
.top__titulo:after {top:-25px;}
}

@media (max-width:699px) {  
.obras img:last-child {margin-right:0px;}
.obras img {max-width:150px;}
.obras {top:10px;}
}

@media (max-width:689px) {  
.foot__der-bloq {border-top:0px; width:100%; margin-top:0px; margin-bottom:30px;}
.foot__der-links i.fa-envelope {margin-left:20px;}
.foot__der {width:100%; text-align:center;}
.foot__der-links {margin-left:0px;}
.foot__izq img {margin:0 auto;}
footer ul {margin:0 0 0 5px;}
.foot__izq {width:100%;}
}

@media (max-width:569px) {  
header ul {vertical-align:text-bottom; margin-bottom:2px;}
.header__der-phone, .header__der-whats {font-size:24px;}
.header__izq img {max-width: 100%; height:auto;}
.cuerpo__der {padding:70px 30px 150px 30px;}
.header__der {padding-top:18px;}
.obras img {max-width:120px;}
.obras {top:30px;}
}

@media (max-width:539px) {  
#topGracias .top__titulo h1 {line-height:42px; font-size:36px;}
}

@media (max-width:489px) {  
footer ul {margin:20px 0 0; overflow:inherit; width:100%;}
.header__der-phone, .header__der-whats {font-size:21px;}
header ul {margin-left:12px; margin-bottom:1px;}
.obras img {max-width:100px; margin-right:15px;}
#top h4 {letter-spacing:0.15em;}
header ul li {margin-left:12px;}
.obras {top:40px;}
}

@media (max-width:439px) {  
header ul {margin-left:0px; margin-bottom:0px; border-left:0px; margin-top:10px; width:100%;}
header ul li {margin-left:7px;margin-right:7px;} 
.header__der {padding-top:12px;}
#top h4 {letter-spacing:0.1em;}
}

@media (max-width:427px) {  
#topGracias .top__titulo:before {top:-10px;}
#topGracias .top__titulo:after {top:-10px;}
#topGracias .top__titulo {margin-top:0px;}
}

@media (max-width:409px) {  
.top__titulo h1 {line-height:48px; font-size:50px;}
.foot__der-links i.fa-envelope {margin-left:0px;}
.foot__der-links {margin-top:15px; width:100%;}
.foot__izq {padding:24px 0 10px;}
.top__titulo {margin-top:-70px;}
}

@media (max-width:399px) {  
#prefooter h3 {line-height:50px; font-size:48px;}
.obras img:nth-child(2) {display:none;}
#top h4 {letter-spacing:0.03em;}
.obras img {max-width:130px;}
}

@media (max-width:369px) {  
.header__der-phone, .header__der-whats {letter-spacing:-0.03em;}
.header__der-phone i {display:none;}
#top h4 {font-size:27px;}
}

@media (max-width:339px) {  
.obras img {max-width:110px;}
.obras {text-align:center;}
}

