header{position:absolute; top:15px; width:96%; left:2%; border-radius:80px; padding:10px 5%; z-index:2; display: flex; justify-content: space-between; align-items: center;}
header .logo{height:60px;}
header .steps{padding:3px 10px; display:none !important;}
header .step{width:12px; height:12px; margin:0 5px; border-radius:50%; border:1px solid #fff;}
header .step.active{background:#fff;}
.banner{
    width:100%;
    /*height:100vh;*/
    min-height:600px;
    background-repeat: no-repeat;
    background-size:cover;
    background-position:center center;
    background-color: #fff;
    padding:0;
    background-attachment:fixed;
}
.banner.template1{
    background:url(../img/pattern_bg.png) #4092D3; background-attachment: fixed;
}
.banner .info{
    width:100%;
    padding:20px 5%;    
    border-radius: 0 50px 50px 0;    
    overflow: hidden;
}
.banner .info:before{
    content:'';
    position:absolute;
    mix-blend-mode: multiply;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index:1;
}
.banner .logo {
    width: 16%;    
    margin-left: -20px;
    position: absolute;
    top: 0;
    left: 42%;
    z-index: 1;
}
.banner.template1 .logo{
    left: 15%;
}
.banner.template1 .video{padding:0 !important;}
.banner .data{padding-right:3%; z-index:2; mix-blend-mode: normal; position:relative;}
.banner .beneficio{margin-left:-30px; margin-bottom:30px;}
.banner .titulo{color:#fff !important; position:relative; padding-bottom:1px; margin-bottom:5px;}
.banner .titulo h1{font-size:36px !important; font-weight:bold;}
.banner .subtitulo{position:relative; color:#fff; width:fit-content; margin-bottom:8px;}
.banner .subtitulo:after{
    content:'';
    position:absolute;
    width:100%;
    height:1px;
    background:rgba(255,255,255,0.5);
    left:0;
    bottom:0;
}
.banner .descripcion{
    font-size:16px !important;
    line-height: 20px !important;
    font-weight:300;
    color:#fff !important;
    text-align:left;
}
.banner .ico-movimiento{
    position:absolute;
    bottom:10%;
    left:30%;
    margin-left:-120px;
    width:240px;
    height:140px;
    background:url(../img/ico_movimiento.svg) no-repeat center center;
    background-size:contain;
}
/*.banner .iconos{justify-content: start; align-items: center;}
.banner .icon{font-size:11px; color:#fff; margin-right:14px; display:flex; align-items: center; justify-content:center;}
.banner .icon img{height:16px; margin-right:4px;}*/
.banner.template1 .formulario{
    position:absolute;
    bottom:-190px;
    right:5%;
    z-index:2;
}
.banner .formulario, .banner .video{font-size:12px; color:#fff;}
.banner .formulario .card, .banner .video .card{padding:15px 30px; border-radius:30px; margin-top:10px;}
.banner .cta{
    position: absolute;
    bottom: -40px;
    left: 50%;
    font-size: 11px;
    margin-left: -117px;
    z-index:2;
}
.banner .cta .btn{background:#78C2EF; padding: 10px 80px; height:200px;}
#step_1 .btn{
    height: 150px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding:20px 60px;
    margin-right:20px;
    font-size:20px;
    font-weight:400;
    background:#fff;
}

#step_1, #step_2, #step_3{
    left:-100%; 
    opacity:0; 
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #fff;
    pointer-events: none; 
    transition: opacity 0.6s, left 0.6s; 
    position:absolute; 
    top:0;
}
#step_1{top:50%; flex-direction: row;}
#step_1.active, #step_2.active, #step_3.active{opacity:1; left:0; pointer-events: all; transition: opacity .2s, left 1s; transition-delay: .6;}

.series, .styles{
    width:100vw;
    min-height:90vh;
    padding:90px 20%;
}
.styles{
    padding:90px 5%;
}
.styles a{
    color: #fff !important;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: start;
}
.gallery-btn{margin:10px 15px !important; width:fit-content; background:#fff !important; border-radius:10px; padding: 6px 10px 6px 10px !important;}
.list-plan hr{margin:4px 0;}
.list-plan.card{margin:10px 1%; width:23%; background:#f5f5f5; border-radius:30px; overflow: hidden; cursor:pointer; padding:0; -webkit-transition: 0.5s; transition: 0.5s;}
.list-plan.card:hover{transform: scale(1.05); -webkit-transition: 0.5s; transition: 0.5s;}
.list-plan .number{position:absolute; font-size:12px; text-align:center; line-height:23px; top:15px; right:15px; width:25px; height:25px; border-radius:50%; border:1px solid #4D4D4D; color:#4D4D4D; background:#fff; font-weight:bold;}
.list-plan .data{margin-bottom:0px; text-align:left; color:#252525;}
.list-plan.card h5{font-size:18px; font-weight: bold;}
.list-plan a{text-decoration: none !important; color:inherit !important;}
.list-plan .icon{font-size:12px; padding-left:5px; margin-bottom:5px; display: flex; align-items: start; color:#252525;}
.list-plan .icon img{height:20px; margin-right:10px;}
.list-plan .tools{ border-top:1px solid #999; padding:8px; width:90%; margin:0 5% 15px 5%;}
.list-plan .tools img{height:30px;}

.list-serie{padding:20px; border:1px solid #fff; color:#fff; width:23%; margin:10px 1%; min-height:30vh; border-radius:20px; display:flex; flex-direction: column;  transition: .2s;}
.list-serie b{font-size:20px;}
.list-style{padding:3px 20px; font-size:14px; border:1px solid rgba(255,255,255,0.1); margin:10px;  border-radius:20px; transition: .2s; background:url(../img/btn_icon_light.png)no-repeat 94% center; background-size:auto 50%; cursor:pointer; display:none;}
.list-style b{font-size:16px; margin-right:15px;}
.list-serie a{text-shadow: 1px 1px 3px #000;}
.list-style:hover{transform:scale(1.05); background:url(../img/btn_icon_light.png)no-repeat 96% center rgba(0,0,0,0.2); background-size:auto 50%; border:1px solid rgba(255,255,255,1); transition: .6s;}
.list-serie{cursor:pointer;}
.list-serie:hover, .list-serie.active{transform:scale(1.05); background:rgba(0,0,0,0.2); transition: .6s;}
.list-serie h2{
    font-size:24px; 
    padding: 5px 20px;
    border-radius: 20px;}
.list-serie img{height:15px; margin-top:-3px;}

.back-btn{
    border:0;
    border-radius:30px;
    padding:6px 20px 6px 40px;
    color:#4D4D4D !important;
    background:url(../img/btn_icon_back.png) no-repeat 10px center #fff;
    background-size:auto 100%;
    font-weight:400;
    margin:20px 0;
    transition: 0.6s;
    font-size:20px;
    width:fit-content;
    cursor: pointer;
}

.back-btn:hover{
    transform:scale(1.05);
    transition: 0.6s;
    cursor:pointer;
  }

.footer{padding:15px 5%; color:#252525; background:#fff; font-size:11px; position:relative; z-index:2;}
.footer .row{justify-content: center; align-items: center;}
.footer .row2{justify-content:space-between; align-items: center;}
.footer .row3{padding:20px 25%; font-size:14px; line-height:20px;}
.logo-anac{height:100px;}
.footer .btn{background:#EA7D33; padding: 10px 80px; color:#fff; border-radius:60px; margin-bottom:10px;}
.footer .redes img{height:50px;}
.footer .row3 img{height:20px;}

.form-info{
    padding:30px 10%;
    font-size:14px;
    text-align: center;
}
#formModal h3, .form-info h3{
    font-size:18px;
    font-weight:bold;
    color:#0B4460;
}
.checkboxes{
    font-size:11px;
    line-height:14px;
    margin-bottom:30px;
}
.checkboxes label{margin:0 !important;}
.checkboxes .col-md-4{
    background: #0B4460;
    color:#fff;
    border-radius:20px;
    display:flex;
    justify-content: center;
    align-items: center;
    border:4px solid #fff;
}
.checkboxes input{border:0 !important; box-shadow: none !important; margin-right:10px;}

.legal{font-size:10px; color:#999; padding-top:30px;}

#formModal .modal-content{
    border-radius:30px;
}

.modal-header{
    position: absolute;
    z-index: 2;
    border: 0;
    width:100%;
}
.modal-header .close{
    background:#fff;
    border-radius:0 0 0 30px;
    opacity:1;
}
.modal-header .close:hover{
    opacity:1 !important;
}
@media screen and (max-width:1200px) {
    .list-plan.card{width:47%;}
}

@media screen and (max-width:768px) {
    
    .banner{min-height:650px;}
    .banner.template1{flex-direction: column;}
    .banner.template1 .formulario {
        position: relative;
        bottom: 0;
        right: auto;
    }
    .banner .logo {
        width: 40%;      
        position: absolute;
        top: 0;
        left: 30%;
        z-index: 1;
    }
    .banner .data {
        padding-right: 5%;        
    }
    .banner .iconos{flex-wrap: wrap; }
    .banner .icon{width:100%; align-items: start; justify-content: start; margin:4px 0;}
    .banner.template1 .video{margin-top:50px !important;}
    .template1 .video iframe{height:80vh;}
    .banner .formulario{margin-top:40px; padding:0 !important;}
    .series{overflow-y: auto;}
    .series-content{margin-top:8px !important;}
    .list-serie{min-height:90px; margin:5px;}
    /*.styles-content .col-md-3{display:none;}*/
    /*.styles .list-serie{margin-bottom:60px;}*/
    .list-plan.card{width:100%; }
    .styles{padding-bottom:50px;}
    .styles .pr-5{padding-left: 3rem !important;}
    .styles .pl-5{padding-right: 3rem !important;}
    .styles h3{text-align:left; margin-top:40px; margin-bottom:0px; width:80%; font-size:1rem;}
    .styles-list{flex-direction: column;  padding-right:15px;}
    .footer{text-align:center;}
    .footer .logo{margin-bottom:30px;}
    .footer .social{margin-top:30px;}
    .back-btn{margin:40px auto 0 auto;}
}