/* CSS | CONDUFEM */

:root{
    --negro: #000;
    --blanco: #fff;
    --azul0: #99cce9;
    --azul1: #0080c8;
    --azul2: #0056a3;
    --azul3: #213a8e;
    --gris1: #b1b1b1;
    --gris2: #6F6F6E;
}


/* ************
General CSS 
***************/
.btn-blue{
    transition: .5s ease-in-out;
    background-color: var(--azul1);
}
.btn-blue:hover{
    background-color: var(--azul3);
}
.section-padding{
    padding: 70px 0;
}
.theme-btn{
    padding: 8px 20px;
    text-transform: none;
}
.preloader{
    background: #fff;
}
.wpo-section-title h2{
    text-transform: none;
    font-size: 50px;
}
@media screen and (max-width: 767px) {
    .wpo-section-title h2{
        text-transform: none;
        font-size: 30px;
    }
}
.back-to-top{
    border: 2px solid var(--azul2);
    background-color: var(--azul2);
    transition: .5s ease-in-out;
}
.back-to-top:hover{
    background-color: var(--azul1);
    border: 2px solid var(--azul1);
}
.hero-style-1 .hero-social-icon li:hover a i{
    color: var(--azul0);
}
.textMobile{
    display: none;
}
@media screen and (max-width: 991px) {
    .wpo-section-title{
        margin-bottom: 30px;
    }
    .d-none-mobile{
        display: none;
    }
    .textMobile{
        display: block;
    }
}
/* ************
Header 
***************/
#header{
    box-shadow: 0 0 10px rgb(0 0 0 / 50%);
}
.wpo-site-header #navbar > ul > li > a{
    padding: 10px;
    font-weight: 700;
}
.wpo-site-header #navbar > ul > li > a::before{
    display: none;
}
.wpo-site-header #navbar > ul li a:hover, .wpo-site-header #navbar > ul li a:focus{
    background: transparent;
}
.wpo-site-header .navbar-header .navbar-brand img{
    max-width: 270px;
}
@media (max-width: 991px){
    .wpo-site-header .navbar-header .navbar-brand img{
        max-width: 190px;
    }
    .wpo-site-header .navbar-header .navbar-brand{
        margin-right: 0;
    }
    .wpo-site-header .navbar-header{
        text-align: right;
    }
    .wpo-site-header #navbar{
        background: var(--azul3);
    }
}
.navbar-header .navbar-brand img{
    width: 250px;
    height: auto;
}
.wpo-site-header #navbar > ul li a:hover, .wpo-site-header #navbar > ul li a:focus{
    color: var(--azul2);
}
@media (max-width: 991px){
    .wpo-site-header .mobail-menu button{
        background-color: var(--azul2);
    }
}


/* ************
Banner
***************/
.hero-style-1{
    background: url('../archivos/representamos-y-defendemos.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    height: calc(100vh - 80px);
    max-height: 100vh;
}
.hero-style-1 .slide{
    max-height: 100vh;
}
@media screen and (max-width: 991px) {
    .hero-style-1 .slide{
        height: 100vh;
    }
}
.hero-style-1:before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.6);
    width: 100%;
    height: 100%;
}
.hero-style-1 .slide-caption .shape-1{
    top: 25%;
}
.hero-style-1 .slide-caption h2{
    font-size: 70px;
    color: var(--azul0);
    margin-bottom: 40px;
}
@media screen and (max-width: 991px) {
    .hero-style-1 .slide-caption h2{
       font-size: 40px;
       margin-bottom: 30px;
       line-height: 45px;
    }
}
.hero-style-1 .slide-caption .slide-title-sub h5{
    font-size: 20px;
}
@media screen and (max-width: 991px) {
    .hero-style-1 .slide-caption .slide-title-sub h5{
        margin-bottom: 0;
    }
}

/* ************
Nosotros | Home
***************/
#nosotros .about-right-img img{
    box-shadow: 5px 5px 10px rgb(0 126 199 / 35%) ;
}
#nosotros .title{
    color: var(--azul3);
}
#nosotros .text{
    color: var(--gris2);
    font-size: 19px;
    line-height: normal;
}
#nosotros .textList{
    color: var(--gris1);
}
.wpo-about-section .wpo-about-text ul li:before, .wpo-about-section-s2 .wpo-about-text ul li:before{
    color: var(--azul1);
    border: 1px solid var(--azul1);
}
#nosotros .textNumber{
    color: var(--gris1);
    font-size: 12px;
    white-space: pre-line;
    line-height: normal;
}
#nosotros .number span{
    color: var(--azul2);
}
#nosotros .number i{
    color: var(--azul2);
}
#nosotros .iconImg img{
    width: 70px;
    height: 65px;
}
@media screen and (max-width: 767px) {
    #nosotros .wpo-fun-fact-section .wpo-fun-fact-grids, #nosotros .wpo-fun-fact-section-s2 .wpo-fun-fact-grids{
        display: flex;
        flex-wrap: wrap;
    }
    #nosotros .wpo-fun-fact-section .wpo-fun-fact-grids .grid, #nosotros .wpo-fun-fact-section-s2 .wpo-fun-fact-grids .grid{
        width: 50%;
        flex-direction: column;
        margin-top: 20px;
    }
    #nosotros .wpo-fun-fact-section .grid .info h3, #nosotros .wpo-fun-fact-section-s2 .grid .info h3{
        text-align: center;
    }
    #nosotros .textNumber{
        text-align: center;
    }
    #nosotros .wpo-fun-fact-section .grid .info, #nosotros .wpo-fun-fact-section-s2 .grid .info{
        margin-left: 0;
    }
}

/* ************
Nosotros | Interior
***************/
#nosotros-interior .about-right-img img{
    box-shadow: 5px 5px 10px rgb(0 126 199 / 35%) ;
}
#nosotros-interior .title{
    color: var(--azul3);
}
#nosotros-interior .text{
    color: var(--gris2);
    font-size: 19px;
    line-height: normal;
}
#nosotros-interior .textList{
    color: var(--gris1);
}
.wpo-about-section .wpo-about-text ul li:before, .wpo-about-section-s2 .wpo-about-text ul li:before{
    color: var(--azul1);
    border: 1px solid var(--azul1);
}
#nosotros-interior .textNumber{
    color: var(--gris1);
    font-size: 12px;
    white-space: pre-line;
    line-height: normal;
}
#nosotros-interior .number span{
    color: var(--azul2);
}
#nosotros-interior .number i{
    color: var(--azul2);
}
#nosotros-interior .iconImg{
    width: 70px;
    height: auto;
}
/* ************
Box Carousel 
***************/
.wpo-happy-client-slide .owl-item img{
    width: auto;
    margin: 0 auto;
}


/* ************
Numbers
***************/


/* ************
Call to Action 1 
***************/
#callToAction1.wpo-cta-section{
    padding: 70px 0;
}
#callToAction1 .cta-top-box{
    top: 0;
    transform: translate(-50%, 0);
}
#callToAction1.wpo-cta-section .cta-top-box .cta-top-img .cta-top-content::before{
    background-color: var(--azul1);
}
#callToAction1 .title{
    color: var(--azul3);
}
#callToAction1 .subtitle{
    color: var(--gris2);
}
@media screen and (max-width: 767px) {
    #callToAction1 .subtitle{
        line-height: normal;
    }
}
#callToAction1 .titleBox{
    color: #fff;
    font-size: 25px;
}
#callToAction1 .textBox{
    color: #fff;
    line-height: normal;
    font-size: 18px;
    min-height: 50px;
}
#callToAction1.wpo-service-section .service-wrap .service-single h3::before, 
#callToAction1.wpo-service-section-s2 .service-wrap .service-single h3::before, 
#callToAction1.wpo-service-section-s3 .service-wrap .service-single h3::before, 
#callToAction1.wpo-service-section-s4 .service-wrap .service-single h3::before{
    background: #fff;
}
#callToAction1 .service-single{
    padding: 40px 25px;
    background-color: var(--azul1);
    max-width: 290px;
    height: auto;
    margin: 0 auto;
    position: relative;
    border-radius: 5px;
    border-top: 1px solid rgba(255,255,255, .5);
    border-left: 1px solid rgba(255,255,255, .5);
}
@media screen and (max-width: 991px) {
    #callToAction1 .service-single{
        margin-top: 30px;
    }
}
#callToAction1 .service-single:hover{
    background-color: var(--azul2);
    /* transform: scale(1.1); */
}
.wpo-service-section .service-wrap .service-single h3{
    padding-right: 0;
}
#callToAction1 .btn-white{
    background-color: #fff;
    color: var(--azul2);
    font-weight: 600;
    border: 1px solid #fff;
}
#callToAction1 .btn-white:hover{
    background: transparent;
    color: #fff;
}
#callToAction1 .ghostNumber{
    color: rgba(255,255,255,0.1);
    font-size: 90px;
    position: absolute;
    top: 0;
    right: 0;
    line-height: 90px;
}

/***************
Clientes
***************/
#clientes .title{
    color: var(--azul3);
}
@media screen and (max-width: 767px) {
    #clientes{
        padding-top: 0;
    }
    #clientes .title{
        font-size: 30px;
    }
    #clientes.wpo-partners-section .grid img{
        max-width: 120px;
        width: 120px;
        margin: 0 auto;
    }
}

/* ************
Iniciativas
***************/
.wpo-team-section, 
.wpo-team-section-s2{
    margin-top: 150px;
}
/* .wpo-team-section .text-musk .text-musk-title, 
.wpo-team-section-s2 .text-musk .text-musk-title{
    background: url('https://via.placeholder.com/1920x500');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
} */
.team-content{
    padding: 30px;
    background: rgba(0,0,0,0.9)!important;
}
.team-content h3{
    color: #fff;
    font-weight: 400;
}
.team-content p{
    color: #fff;
    margin-bottom: 0;
}
.team-content.team1{
    background: var(--azul1);
}
.team-content.team2{
    background: var(--azul2);
}
.team-content.team3{
    background: var(--azul3);
}
#iniciativas{
    margin-top: 70px;
}
#iniciativas.wpo-team-section .text-musk, .wpo-team-section-s2 .text-musk{
    margin-bottom: 10px;
}
#iniciativas .slick-track{
    margin: 0 auto;
}
#iniciativas .logo-iniciativa{
    width: 150px;
    height: auto;
    margin: 0 auto 20px;
}
#iniciativas .title{
    color: var(--azul3);
}

/* ************
Mision | Vision
***************/
#mision-vision{
    background-color: #ededed;
    padding: 20px 0 0px;
}
@media screen and (max-width: 767px) {
    #mision-vision{
        margin-bottom: 70px;
    }
}
#mision-vision .features-single .number{
    color: var(--azul3);
    -webkit-text-stroke-color: var(--azul0);
}
#mision-vision .features-single .title{
    color: var(--azul2);
}
#mision-vision .features-single .text{
    color: var(--gris2);
    font-size: 18px;
    line-height: normal;
}
#mision-vision .features-single .text b{
    font-weight: 800;
}

/* ************
Paquetes
***************/
#paquetes .wpo-section-title .subtitle{
    color: var(--azul0);
    font-size: 25px;
}
#paquetes .wpo-section-title .title{
    color: var(--azul2);
}
#paquetes .wpo-section-title .text{
    color: var(--gris2);
    margin-top: 20px;
    line-height: normal;
}
#paquetes .wpo-section-title .text b{
    color: var(--azul3);
}
#paquetes.wpo-pricing-section .pricing-grids{
    padding-top: 0;
}
#paquetes.wpo-pricing-section .pricing-grids > .grid:nth-child(2){
    background: transparent;
    margin-top: 0;
}
#paquetes.wpo-pricing-section .pricing-grids > .grid:nth-child(2) .type{
    background: var(--azul2);
    padding: 12px 40px;
}
#paquetes.wpo-pricing-section .grid .type{
    background: var(--azul2);
    margin-bottom: 25px;
    padding: 12px 40px;
}
#paquetes.wpo-pricing-section .pricing-grids > .grid:nth-child(2) .type h5{
    color: #fff;
}
#paquetes.wpo-pricing-section .grid .type h5{
    color: #fff;
    font-weight: 500;
    text-transform: none;
}
#paquetes.wpo-pricing-section .pricing-body .description{
    color: var(--gris2);
    text-align: center;
    margin-bottom: 20px;
    margin-top: 15px;
    font-weight: 600;
    font-size: 20px;
    line-height: 22px;
    min-height: 75px;
}
#paquetes.wpo-pricing-section .pricing-body ul{
    min-height: 970px;
}
@media screen and (min-width: 1919px) {
    #paquetes.wpo-pricing-section .pricing-body ul{
        min-height: 870px;
    }
}
@media screen and (max-width: 991px) {
    .wpo-pricing-section .pricing-grids .grid {
        width: calc(100% - 30px);
        margin: 0 15px 30px;
    }
    #paquetes.wpo-pricing-section .pricing-body .description{
        min-height: auto;
    }
    #paquetes.wpo-pricing-section .pricing-body ul{
        min-height: auto;
    }
    #paquetes.wpo-pricing-section .pricing-body ul li{
        margin-left: 25px;
    }
}
#paquetes.wpo-pricing-section .pricing-body ul li{
    list-style: disc;
    text-align: left;
    color: var(--gris2);
}
#paquetes.wpo-pricing-section .pricing-grids > .grid:nth-child(2) .get-started, 
#paquetes.wpo-pricing-section .grid .get-started{
    background: transparent;
    border: 2px solid var(--azul3);
    color: var(--gris2);
    font-size: 17px;
    font-weight: 600;
    transition: .5s ease-in-out;
}
#paquetes.wpo-pricing-section .grid .get-started:hover, 
#paquetes.wpo-pricing-section .pricing-grids > .grid:nth-child(2) .get-started:hover{
    background: var(--azul3);
    color: #fff;
}
/* ************
Pop | Paquete
***************/
.white-popup-block {
    background: #FFF;
    padding: 20px 30px;
    text-align: left;
    max-width: 650px;
    margin: 40px auto;
    position: relative;
}
@media screen and (max-width: 991px) {
    .white-popup-block{
        padding: 20px 0;
    }
    #formPaquete .title{
        font-size: 30px;
        margin-bottom: 30px;
    }
    .wpo-contact-area .contact-form-area .input-content .fc-contact-text{
        height: auto;
    }
}
button.mfp-arrow, button.mfp-close {
    overflow: visible;
    cursor: pointer;
    background: 0 0;
    border: 0;
    -webkit-appearance: none;
    display: block;
    outline: 0;
    padding: 0;
    z-index: 1046;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.mfp-close {
    width: 44px;
    height: 44px;
    line-height: 44px;
    position: absolute;
    right: 0;
    top: 0;
    text-decoration: none;
    text-align: center;
    opacity: .65;
    filter: alpha(opacity=65);
    padding: 0 0 18px 10px;
    color: #FFF;
    font-style: normal;
    font-size: 28px;
    font-family: Arial,Baskerville,monospace;
}
.mfp-arrow, .mfp-close, .mfp-counter, .mfp-preloader {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}
.mfp-wrap{
    background: rgba(255,255,255,0.1);
}
.wpo-contact-area .contact-form-area .input-content{
    margin-bottom: 40px;
}
.wpo-contact-area .contact-form-area .input-content .fc-contact, .wpo-contact-area .contact-form-area .input-content .form-Select, .wpo-contact-area .contact-form-area .input-content .fc-contact-text{
    color: var(--gris2);
    border-radius: 0;
}
.wpo-contact-area .contact-form-area .input-content .fc-contact:focus, 
.wpo-contact-area .contact-form-area .input-content .form-Select:focus, 
.wpo-contact-area .contact-form-area .input-content .fc-contact-text:focus{
    box-shadow: none;
}
.wpo-contact-area .contact-form-area .input-content .fc-contact:focus-visible, .wpo-contact-area .contact-form-area .input-content .form-Select:focus-visible, .wpo-contact-area .contact-form-area .input-content .fc-contact-text:focus-visible{
    border-bottom: 1px solid var(--azul2);
}
#formPaquete .title{
    color: var(--azul2);
    font-size: 40px;
    margin-bottom: 30px;
    font-family: "DM Serif Display", serif;
    font-weight: 500;
    text-align: center;
}
.wpo-contact-area .contact-form-area .theme-btn, .wpo-contact-area .contact-form-area .view-cart-btn{
    border-radius: 5px;
    letter-spacing: 0;
}

/* ************
Iniciativa | interior
***************/
#iniciativa-interior{
    padding: 50px 0;
}
#iniciativa-interior .case-studies-right .flexRow{
    display: flex;
    justify-content: center;
}
#iniciativa-interior .title{
    color: var(--azul2);
    font-weight: 500;
    font-family: "DM Serif Display", serif;
}
#iniciativa-interior .text{
    color: var(--gris2);
    line-height: normal;
}
#iniciativa-interior.wpo-case-studies-section .case-studies-wrap .case-studies-content{
    background: #ededed;
}
@media screen and (max-width: 991px) {
    #iniciativa-interior.wpo-case-studies-section .case-studies-wrap .case-studies-content{
        padding: 50px 20px;
    }
}
@media screen and (max-width: 645px) {
    #iniciativa-interior .case-studies-simgle-item{
        text-align: center;
    }
    #iniciativa-interior .case-studies-simgle-item img{
        max-width: 250px;
        width: 250px;
    }
}


/* ************
Footer 
***************/
.wpo-site-footer, .wpo-site-footer-s2, .wpo-site-footer-s3{
    background: url('../archivos/CONFEDEM-Banner-Footer.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.wpo-site-footer .wpo-lower-footer .copyright span, .wpo-site-footer-s2 .wpo-lower-footer .copyright span, .wpo-site-footer-s3 .wpo-lower-footer .copyright span{
    color: var(--azul1);
}
.wpo-site-footer .wpo-lower-footer .social-widget ul li a:hover, .wpo-site-footer-s2 .wpo-lower-footer .social-widget ul li a:hover, .wpo-site-footer-s3 .wpo-lower-footer .social-widget ul li a:hover{
    border: 1px solid var(--azul0);
    color: var(--azul0);
}
.wpo-site-footer .wpo-contact-widget .contact-ft, .wpo-site-footer-s2 .wpo-contact-widget .contact-ft, .wpo-site-footer-s3 .wpo-contact-widget .contact-ft{
    padding-right: 0;
}
footer .wpo-lower-footer .contentRight{
    text-align: right;
}
@media screen and (max-width: 767px) {
    footer .wpo-lower-footer .contentRight{
        text-align: center;
        margin-top: 25px;
    }
}
#footer .link{
    color: #fff; 
    display: table; 
    text-decoration: none; 
    margin-bottom: 10px;
    transition: .5s ease-in-out;
}
#footer .link:hover{
    color: var(--azul0);
}
#footer .condefem-footer{
    width: 190px;
    height: auto;
}
@media screen and (max-width: 991px) {
    #footer .condefem-footer{
        width: 120px;
    }
    .wpo-site-footer .wpo-upper-footer .col, .wpo-site-footer-s2 .wpo-upper-footer .col, .wpo-site-footer-s3 .wpo-upper-footer .col{
        margin-bottom: 30px;
    }
}
#footer .logoR{
    width: 135px;
    height: auto;
}
/* ************
Copyright 
***************/