html {scroll-behavior: smooth;}

body{
background:#fff;
margin:0;
font-family: 'Ubuntu', sans-serif;
color:#555;
font-size:16px;}

body *{
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;}

article, aside, figure, footer, header, hgroup, menu, nav, section {display:block;}

.mit{width:47%;}
.left{float:left;}
.right{float:right;}
.mleft{margin-left:20px;}
.mright{margin-right:20px;}
.spacer{width:100%;margin-bottom:30px;height:0;display:block;}
.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}
a{transition:all .5s;}

.header-w, .footer-w{
width:100%;}

header, footer, section{
width:100%;
padding:0 5%;}

section{padding:30px 5%;}

.header-w{
position:fixed;
top:0;
left:0;
width:100%;
z-index:3;
background: -moz-linear-gradient(top,  rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(top,  rgba(0,0,0,0.5) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(to bottom,  rgba(0,0,0,0.5) 0%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80000000', endColorstr='#00000000',GradientType=0 );
transition: all 1s;}

.header-w.scrolled{background:rgba(14,118,188,.75);}

header{min-height:80px;}

header .logo, header nav, header .social{position:absolute;}

header .logo{
top:7px;
left:5%;
padding:5px;
background:#fff;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
text-align:center;
}

header .logo a{display:inline-block;}

header .social{
top:0;
right:10px;
height:80px;}

header .social a{
display:block;
background:url(../images/redes.png);
width:30px;
height:30px;
margin:5px 0;
overflow:hidden;
color:rgba(0,0,0,0);
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
opacity:.8;}

header .social a:hover{opacity:1}

header .social .fb{background-position:0 0;}
header .social .ws{background-position:-30px 0;}

header nav{
top:20px;
right:5%;
display:block;
margin:0;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 1);}

header nav ul, header nav li{display:inline-block;}

header nav ul, header nav li{
list-style:none;
margin:0;
padding:0;}

header nav li{margin-left:5px;}

header nav li:first-child{margin-left:0;}

header nav li a{
display:block;
color:#fff;
text-decoration:none;
padding:10px;
border-bottom:1px dotted rgba(255,255,255,0);}

header nav li a:hover{border-bottom:1px dotted rgba(255,255,255,1);}

header nav ul{text-align:center;}

header #pull{display:none;}

.clearfix:before,.clearfix:after {
content: " ";
display: table;}

.clearfix:after {
clear: both;}

.clearfix {
*zoom: 1;}

.banner{
position:relative;
min-height:600px;
transition:background .7s;
background:#fff url(../images/slider/slider-01.jpg) center no-repeat;
background-position:cover;
margin-bottom:30px;}

.banner.cambio{
background:#fff url(../images/slider/slider-02.jpg) center no-repeat;}

.banner .info{
padding:10px;
position:absolute;
color:#fff;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 1);
top:50%;
left:10%;
transform:translate(0,-50%);
max-width:60%;
background:rgba(0,0,0,.3);
border-radius:5px;}

.banner .info h1{font-size:2.4em;}
.banner .info p{
line-height:1.8em;
font-size:1.3em;}

.content section{margin-bottom:30px;}

.content section::after{
content: "";
display: block;
clear: both;}

.content img{
max-width:100%;
height:auto;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;}

.content p, .content h2, .content h3, .content h4, .content h5{margin:0 0 1em 0;}

.content h2{font-size:2em}
.content h3{font-size:1.7em}
.content h4{font-size:1.3em}
.content h5{font-size:1.1em}

.content section a, .content section a:visited{color:#25aae1;}

.content p{text-align:justify;}

.content p, .content li{line-height:1.7em;}

.content .check{list-style:url(../images/check.png);}

.content .botones p{
text-align:center;}

.content section:nth-child(odd){
background:#2487c9;
text-shadow: 1px 1px 1px rgba(0, 0, 0, .5);}

.content section:nth-child(odd) *{color:#fff;}
.content section:nth-child(odd) input, .content section:nth-child(odd) textarea{color:#555;}

.content a.anchor {
display: block;
position: relative;
top: -100px;
visibility: hidden;}

.content a.boton, .content button.boton{
color:#fff;
text-shadow: 1px 1px 1px rgba(0, 0, 0, .75);
display:inline-block;
padding:20px;
background:#1CD6BD;
text-decoration:none;
font-size:1.2em;
font-weight:700;
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
border:0;}

.content .botones .mit{
background:#1CD6BD;
color:#fff;
padding:20px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;}

.content .botones .mit a{
color:#fff;
text-decoration:none;
padding-bottom:5px;
border-bottom:2px solid #fff;
font-size:1.2em;
font-weight:700;}

.content .botones .mit a:hover{border-bottom:2px solid rgba(255,255,255,0);}

.content .form{
width:50%;
margin:0 auto 30px auto;}

.content .form label, .content .form input, .content .form textarea{display:block;margin-bottom:10px;width:100%;}

.content .form label{width:100%;}

.content .form input, .content .form textarea{
border:1px solid #ddd;
padding:10px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;}

.content .form textarea{height:120px}

.footer-w{background:#25aae1;}

footer{
text-align:center;
padding:30px;}

footer *{color:#fff;}

footer .box{margin-bottom:20px;line-height:1.7em;}

footer .copy{font-size:.9em;}

footer .copy span{font-weight:700;}

/* responsivo */

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

header .logo{
left:1%;
top:50%;
transform:translate(0,-50%);
max-width:20%;}

header .logo img{
max-width:100%;
height:auto;}

}

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

header nav{
width:50%;
left:50%;
transform:translate(-50%,0);}

header nav ul{
display:none;
width:100%;
background:#0B4F7D;}

header nav li{
width:50%;
float:left;
margin:0;
position:relative;}

header nav li a{
text-align:left;}

header nav a#pull {
display: block;
background-color:#0B4F7D;
width: 100%;
position: relative;
padding:10px 10px 10px 40px;
color:#fff;
text-align:left;
text-decoration:none;
-webkit-border-radius:0 0 5px 5px;
-moz-border-radius:0 0 5px 5px;
border-radius:0 0 5px 5px;
border-top:1px solid #0e76bc;
}

header nav a#pull:after {
content:"";
background: url(../images/nav-icon.png) no-repeat;
width: 20px;
height: 20px;
display: inline-block;
position: absolute;
left: 10px;
top: 9px;}

.content img{max-width:50%;}

.content .form{width:90%;}

}

@media screen and (max-width:700px){
    
body{padding-top:140px;font-size:14px;}
    
header{
background:#0e76bc;
min-height:140px;}

header.scrolled{background:#0e76bc;}

header .logo{
left:50%;
top:10px;
max-width:65%;
width:65%;
transform:translate(-50%,0);}

header nav{
top:85px;
width:90%;}
    
header nav li{
display: block;
float: none;
width: 100%;    
}

.banner{min-height:450px;}

.banner .info{
max-width:90%;
left:5%;}

.mit{
width:100%;
margin-bottom:20px;}

.content img{
display:block;
max-width:100%;
margin-bottom:20px;}

.mleft, .mright{margin-left:auto; margin-right:auto;}
.left, .right{float:none;}

.content a.anchor {
top:-160px;}

}