/*
Theme Name: Fullmix
Template Theme URI: https://cannvastudio.com
Author: Vanessa Guzmán (Cannvas Studio)
Description: Plantilla desarrollada para empresa Fullmix.
Version: 1.0
*/

@font-face {
    font-family: 'Neue Haas Grotesk Text Pro';
    font-style: normal;
    font-weight: 400; /*400*/
    src: url(fonts/Neue-Haas-Grotesk-Text-Pro-55.eot);
    src: url(fonts/Neue-Haas-Grotesk-Text-Pro-55.eot) format('embedded-opentype'),
    local('Neue Haas Grotesk Text Pro'), local('Neue-Haas-Grotesk-Text-Pro-55'), url(fonts/Neue-Haas-Grotesk-Text-Pro-55.ttf) format('truetype');
}

@font-face {
    font-family: 'Neue Haas Grotesk Text Pro';
    font-style: normal;
    font-weight: 600; /*Heavy*/
    src: url(fonts/Neue-Haas-Grotesk-Text-Pro-65.eot);
    src: url(fonts/Neue-Haas-Grotesk-Text-Pro-65.eot) format('embedded-opentype'),
    local('Neue Haas Grotesk Text Pro'), local('Neue-Haas-Grotesk-Text-Pro-65'), url(fonts/Neue-Haas-Grotesk-Text-Pro-65.ttf) format('truetype');
}

@font-face {
    font-family: 'Neue Haas Grotesk Text Pro';
    font-style: normal;
    font-weight: 800; /*700*/
    src: url(fonts/Neue-Haas-Grotesk-Text-Pro-75.eot);
    src: url(fonts/Neue-Haas-Grotesk-Text-Pro-75.eot) format('embedded-opentype'),
    local('Neue Haas Grotesk Text Pro'), local('Neue-Haas-Grotesk-Text-Pro-75'), url(fonts/Neue-Haas-Grotesk-Text-Pro-75.ttf) format('truetype');
}

html, body {
    height: 100%;
    width: 100%;
    font-family: 'Neue Haas Grotesk Text Pro';
}
@keyframes pulso {
    0% {
        opacity: 1;
        -ms-filter: none;
        -webkit-filter: none;
        filter: none;
    }
    20% {
        opacity: 0.2;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
        filter: alpha(opacity=20);
    }
    40% {
        opacity: 0.4;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
        filter: alpha(opacity=40);
    }
    60% {
        opacity: 0.6;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
        filter: alpha(opacity=60);
    }
    80% {
        opacity: 0.8;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
        filter: alpha(opacity=80);
    }
    100% {
        opacity: 1;
        -ms-filter: none;
        -webkit-filter: none;
        filter: none;
    }
}

.bg-celeste {
    background-color: #0079C4;
}
.bg-yellow {
    background-color: #FFE800;
}
.bg-grey{
    background-color: #F7F7F7;
}
.text-black {
    color: #000000;
}
.text-celeste {
    color: #0079C4;
}

.text-yellow {
    color: #FFE800;
}

.bg-black {
    background-color: #000000;
}

a,
a:hover,
a:focus {
    color: inherit;
    text-decoration: unset;
}

.btn-celeste,
.btn-celeste:hover,
.btn-celeste:focus,
.btn-amarillo,
.btn-amarillo:hover,
.btn-amarillo:focus {
    background-color: #0079c4;
    color: #fff;
    border: none;
    outline: none;
    min-width: 120px;
    font-size: 18px;
    line-height: 18px;
    padding: 12px 20px;
    font-weight: 600;
}
.btn-celeste,
.btn-amarillo:hover,
.btn-celeste:focus {
    background-color: #0079c4;
    color: #fff;
}
.btn-amarillo,
.btn-celeste:hover,
.btn-amarillo:focus {
    background-color: #FFE800;
    color: #000;
}

.py-60 {
    padding: 60px 0;
}
.pt-60 {
    padding-top: 60px;
}
.pt-100{
    padding-top: 100px;
}
.py-100 {
    padding: 100px 0;
}

/*header*/
.redes {

}
.logo_header {
    max-width: 300px;
}
#navbarNav .navbar-nav .nav-link,
#navbarNav .navbar-nav .nav-link:focus,
#navbarNav .navbar-nav .nav-link:hover{
    color: #ffffff;
}

#navbarNav .navbar-nav .current-menu-item .nav-link,
#navbarNav .navbar-nav .nav-link:focus,
#navbarNav .navbar-nav .nav-link:hover{
    font-weight: 800;
}
#menuPrincipal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 3;
}
.telf,
.correo{
    padding: 8px;
}
.custom-toggler .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0,121,196, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}
.custom-toggler.navbar-toggler {
    border-color: transparent;
    outline: none;
}

.sombra {
    background-color: transparent;
    opacity: 0.7;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1;
    top: 0;
}
 /*home*/
.bannerText {
    position: absolute;
    top: 50%;
    color: #ffffff;
    left: 50%;
    z-index: 1;
    transform: translate(-50%, -50%);
    font-size: 54px;
    line-height: 58px;
    text-align: center;
    font-weight: bold;
}

.bannerText span,
.titBlue{
    background-color: #0079C4;
    color: #FFE800;
    width: fit-content;
    padding: 5px 8px;
    line-height: 45px;
    font-weight: bold;
    margin-bottom: 25px;
}
.bannerText span{
    margin: 0 auto;
    line-height: 78px;
    display: block;
}
.positionBanner{
    position: absolute;
    top: 60%;
    transform: translateY(-50%);
}
#bannerPrincipal .slick-list,
#bannerPrincipal .slick-track,
#bannerPrincipal .slick-slide,
#bannerPrincipalMobile .slick-list,
#bannerPrincipalMobile .slick-track,
#bannerPrincipalMobile .slick-slide{
    height: 100%;
}
.slick-dots {
    /*position: absolute;
    bottom: 30px;*/
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
    z-index: 2;
}

.slick-dots li {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer;
}

.slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: inline-block;
    width: 20px;
    height: 20px;
    padding: 5px;
    cursor: pointer;
    border: 0;
    outline: none;
    background: #0079c4;
    border-radius: 20px;
}

.slick-dots li.slick-active button {
    background-color: #ffe800;
}
.parallax {
    /* The image used */
    /*background-image: url("img_parallax.jpg");*/

    /* Set a specific height */
    height: 100%;

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

#banner_experiencia {
    background-image: url('./images/banner_experiencia.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    color: #ffffff;
    font-size: 40px;
    line-height: 40px;
}

.sombra {
    opacity: 0.85;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 0;
    top: 0;
}

.insignia {
    position: absolute;
    top: 20px;
    left: 35px;
}

.div_servicios {
    position: absolute;
    width: 100%;
    padding: 0 15px;
    bottom: 30px;
    color: #ffffff;
    font-size: 22px;
}

#banner_clientes {
    background-image: url('./images/banner_experiencia.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
}

#banner_clientes .slick-arrow {
    background-color: transparent;
    position: absolute;
    border: none;
    outline: none;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 44px;
    height: 35px;
}

#banner_clientes .slick-prev {
    left: -60px;
}

#banner_clientes .slick-next {
    right: -60px;
}

.center_center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#video_obras .title {
    color: #ffffff;
    font-size: 24px;
    margin-top: 5px;
}

.info-bottom {
    color: #ffffff;
    padding: 7px 0;
    font-weight: 600;
    position: relative;
    width: 100%;
}
#video_obras{
    min-width: 200px;
    min-height: 300px;
    margin: 10px 0;
}

.obras_realizadas {
    width: fit-content!important;
    width: -moz-fit-content!important;
    position: relative;
    float: right;
    padding: 10px 20px;
}
.obras_realizadas.manito{
    padding: 0;
}
/*
.obras_realizadas:not(:last-of-type) {
    margin-bottom: 25px;
}*/

/*footer*/
.footer {
    color: #ffffff;
}

.logo_footer {
    max-width: 250px;
}

.lista_paginas {
    list-style: none;
    color: #ffffff;
    margin-bottom: 0;
    line-height: 2em;
}
.pulso {
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    top: 50%;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    right: -4px;
    z-index: -1;
    background-color: #25d366;
    -webkit-animation: pulso 1s infinite ease;
    -moz-animation: pulso 1s infinite ease;
    -o-animation: pulso 1s infinite ease;
    -ms-animation: pulso 1s infinite ease;
    animation: pulso 1s infinite ease;
}

/*contacto*/
.banner {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#formContacto .form-control {
    padding: 12px 12px;
    height: auto;
    background-color: transparent;
    color: #000000;
    border-color: #9B9B9B;
    border-radius: 10px;
}
#formContacto .form-control:focus {
    box-shadow: none;

}

#formContacto .form-control::placeholder,
#formContacto .form-control:-ms-input-placeholder,
#formContacto .form-control::-ms-input-placeholder {
    color: #000000;
    color: purple!important;
}

.form-control::-webkit-input-placeholder,
.form-control::-moz-placeholder,
.form-control:-ms-input-placeholder ,
.form-control::-ms-input-placeholder,
.form-control::placeholder,
.form-control::-moz-placeholder {
    color: red!important;
    opacity: 1;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input[type=number] {
    -moz-appearance: textfield;
}
.custom-checkbox{
    font-size: 14px;
}
.custom-checkbox .custom-control-label::before {
    background-color: #0079c4;
}
.custom-control-input:checked~.custom-control-label::before,
.custom-control-input:not(:disabled):active~.custom-control-label::before{
    color: #fff;
    border-color: #0079c4;
    background-color: #0079c4;
}
.custom-control-input:focus:not(:checked)~.custom-control-label::before{
    border-color: transparent;
}
.custom-control-input:focus~.custom-control-label::before {
    box-shadow: none;
}
#banner_contacto{
    padding-top: 165px;
}

.botones_contacto{
    display: inline-block;
    float: right;
    margin-top: 20px;
    font-size: 14px;
}
.botones_contacto a{
    margin-right: 40px;
}
.botones_contacto a img{
    width: 60px;
}
.botones_contacto a:last-of-type{
    margin-right: 0;
}
.datos{
    margin: 0;
    margin-bottom: 15px;
    min-height: 36px;
    position: relative;
    font-size: 18px;
}
.datos:last-of-type{
    margin-bottom: 0;
}
.datos img{
    position: absolute;
    width: 36px;
    top: 50%;
    transform: translateY(-50%);
}
.datos div{
    padding-left: 85px;
}
.image-box {
     position: relative;
     margin: auto;
     overflow: hidden;
 }
.image-box img {
    max-width: 100%;
    transition: all 0.3s;
    display: block;
    width: 100%;
    height: auto;
    transform: scale(1);
}
.image-box:hover img {
    transform: scale(1.1);
}

/*servicios*/
.fit-content{
    width: fit-content;
}
.caja{
    width: 280px;
    height: 280px;
    border: 1px solid #707070;
    border-radius: 50px;
    padding: 70px 40px;
    position: relative;
}
.caja2{
    width: 370px;
    height: 370px;
    margin: 0 25px;
    padding: 30px;
}
.caja .mix{
    position: absolute;
    width: 100%;
    padding: 0 15px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.caja2 .mix{
    padding: 0 25px;
}
.caja img{
    max-width: 100px;
    height: auto;
}
.caja .text{
    font-size: 18px;
}
.banner_usos{
    border-radius: 50px;
    background-color: #FFE800;
    z-index: 1;
}
.banner_usos .img_usos {
    position: absolute;
    top: -15%;
    left: -13%;
    width: 220px;
}
.p-m-100{
    margin-top: -100px;
    padding-top: 160px;
}
.tabla {
    background-color: #7DB8DC;
    color: #ffffff;
    border-radius: 50px;
    padding: 30px;
    font-size: 22px;
}
.tabla h3{
    font-size: 24px;
}
#banner_calidad{
    font-size: 20px;
    line-height: 35px;
    padding: 100px 0;
}
.quat_ventajas{
    padding: 50px;
    background-color: #ffffffc7;
    border-radius: 30px;
    font-size: 20px;
    width: 80%;
    height: 80%;
}

#banner_ventajas .slick-slide {
    margin: 0 50px;
}
#banner_ventajas .slick-arrow,
#banner_ventajas .slick-arrow:hover,
#banner_ventajas .slick-arrow:focus{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    background-color: transparent;
    outline: none;
    z-index: 1;
}
#banner_ventajas .slick-prev{
    left: 0;
}
#banner_ventajas .slick-next{
    right: 0;
}
#banner_ventajas .slick-arrow svg{
    width: 40px;
    height: 40px;
    background-color: yellow;
    padding: 10px;
    border-radius: 50px;
}


/*Obras Realizadas*/
.bg-celeste{
    background-color: #0079c4;
    color: #ffffff;
}
#carrusel_obras_img .slick-list .slick-track .slick-slide,
#car_videos .slick-list .slick-track .slick-slide{
    padding: 0 15px;
}
#car_videos .slick-list .slick-track .slick-slide div,
#car_videos .slick-list .slick-track .slick-slide iframe{
    max-width: 100%;
}
.botones .slick-prev,
.botones .slick-next,
.botones2 .slick-prev,
.botones2 .slick-next,
.mfp-content .mfp-arrow-left,
.mfp-content .mfp-arrow-right{
    border: none;
    border-radius: 25px;
    padding: 7px 15px;
    cursor: pointer;
    width: 52px;
    height: 32px;
    min-width: max-content;
    font-size: 0;
    box-shadow: none;
}
.margin-menu{
    margin-top: 165px;
}
.botones .slick-prev:hover,
.botones .slick-next:hover,
.botones2 .slick-prev:hover,
.botones2 .slick-next:hover{
    font-size: 0;
    padding: 7px 15px;
    min-width: max-content;
}
.botones .slick-prev,
.botones2 .slick-prev{
    margin-right: 10px;
}
.botones button img,
.botones2 button img{
    position: relative;
    top: -2px;
    width: 21px;
    height: 16px;
}
.botones .slick-prev:before,
.botones2 .slick-prev:before,
.mfp-content .mfp-arrow-left:before{
    content: url(./images/flecha-leftw.svg);
}
.botones .slick-prev:hover:before,
.botones2 .slick-prev:hover:before,
.mfp-content .mfp-arrow-left:hover:before{
    content: url(./images/flecha-leftb.svg);
}
.botones .slick-next:before,
.botones2 .slick-next:before,
.mfp-content .mfp-arrow-right:before{
    content: url(./images/flecha-rightw.svg);
}
.botones .slick-next:hover:before,
.botones2 .slick-next:hover:before,
.mfp-content .mfp-arrow-right:hover:before{
    content: url(./images/flecha-rightb.svg);
}
/*#car_videos */.mpop{
                    cursor: pointer;
                    position: relative;
                }
/*#car_videos */.mpop iframe{
                    border: none;
                }
/*#car_videos */.mpop .play-blue{
                    border-radius: 50%;
                    z-index: 1;
                    position: absolute;
                    pointer-events: none;
                    margin: 0;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%,-50%);
                    width: 85%;
                }
/*#car_videos */.mpop .play-blue .play {
                    width: 65px;
                    margin: 0 auto;
                }
.mfp-iframe-scaler iframe{
    padding: 56px 56px 15px;
    background-color: #ffffff;
}
.mfp-gallery .mfp-content{
    padding: 0;
}
.mfp-iframe-holder .mfp-close {
    top: -22px;
    right: -22px;
    width: 45px;
    text-align: center;
    padding: 0;
    height: 45px;
    background-color: #0079c4;
    opacity: 1;
    border-radius: 25px;
    font-size: 32px;
}
.mfp-content .mfp-arrow-left{
    top: 12px;
    right: 115px;
    left: auto;
}
.mfp-content .mfp-arrow-right {
    top: 12px;
    right: 55px;
}
.mfp-content .mfp-arrow-left,
.mfp-content .mfp-arrow-right {
    background-color: #0079c4;
    margin: 0;
    opacity: 1;
}
.mfp-content .mfp-arrow-left:hover,
.mfp-content .mfp-arrow-right:hover {
    background-color: #FFE800;
}
.mfp-content .mfp-arrow-left:before,
.mfp-content .mfp-arrow-right:before {
    border: none;
    margin: 0;
    width: auto;
    height: 32px;
    position: relative;
    opacity: 1;
}
.mfp-content .mfp-arrow-left:after,
.mfp-content .mfp-arrow-right:after {
    content: unset;
}

.manito {
    cursor: pointer;
    overflow: hidden;
    position: relative;
}
.mfp-gallery .mfp-content{
    background-color: #ffffff;
    padding: 60px;
}
.mfp-content .mfp-figure:after{
    background: #ffffff;
    box-shadow: none;
}
.mfp-figure .mfp-bottom-bar {
    margin: -60px 60px;
    padding: 10px;
    background-color: #0079c4;
    width: -webkit-fill-available;
}
.mfp-counter{
    display: none;
}
.mfp-figure img.mfp-img{
    padding: 0;
}
.mfp-zoom-out-cur .mfp-gallery .mfp-image-holder .mfp-close,
.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close{
    top: -22px;
    right: -22px;
    width: 45px;
    text-align: center;
    padding: 0;
    height: 45px;
    background-color: #0079c4;
    opacity: 1;
    border-radius: 25px;
    font-size: 32px;
}
.mfp-content.zooming:hover {
    transform: scale(1.5);
}

.mfp-content,
.mfp-content.zooming {
    cursor: zoom-in;
    transform: scale(1);
}

/*responsivo*/
@media (max-width: 1600px) {
    .bannerText {
        font-size: 45px;
        line-height: 50px;
    }
    .div_servicios {
        font-size: 18px;
    }
    .bannerText span{
        line-height: 67px;
    }
}
@media (max-width: 1440px) {
    .btn-celeste, .btn-celeste:hover, .btn-celeste:focus, .btn-amarillo, .btn-amarillo:hover, .btn-amarillo:focus {
        font-size: 16px;
    }
    .botones .slick-prev, .botones .slick-next{
        font-size: 0;
    }
    .logo_header {
        max-width: 250px;
    }
    .logo_footer {
        max-width: 200px;
    }
    .bannerText {
        font-size: 35px;
        line-height: 45px;
    }
    #banner_experiencia {
        font-size: 32px;
        line-height: 32px;
    }
    .redes a img{
        width: 40px;
    }
    .caja{
        width: 250px;
        height: 250px;
        padding: 55px 30px;
    }
    .caja2 {
        width: 420px;
        height: 420px;
    }
    .quat_ventajas{
        font-size: 18px;
    }
    .tabla {
        font-size: 18px;
    }
    #banner_ventajas .slick-slide {
        margin: 0 30px;
    }
    #banner_contacto {
        padding-top: 155px;
    }
    footer {
        font-size: 16px;
    }
    .lista_paginas{
        padding-left: 20px;
    }
    .bannerText span{
        line-height: 53px;
    }
}
@media(max-width: 1200px) {
    .caja{
        width: 210px;
        height: 210px;
        padding: 35px 20px;
    }
    .caja2 {
        width: 340px;
        height: 340px;
    }
    .caja .text{
        font-size: 16px;
    }
    #navbarNav .navbar-nav .nav-link,
    .telf,
    .correo{
        font-size: 14px;
        padding: 6px;
    }
    .telf img,
    .correo img{
        width: 20px;
        height: auto;
    }
    .redes a img {
        width: 32px;
    }
    .logo_footer {
        max-width: 165px;
    }
    #banner_ventajas .slick-slide {
        margin: 0 20px;
    }
    .caja img {
        max-width: 85px;
    }
    .datos{
        font-size: 15px;
    }
    #banner_contacto {
        padding-top: 148px;
    }
    #banner_calidad{
        padding: 60px 0;
    }
    .lista_paginas{
        padding-left: 0;
    }
    .footer{
        font-size: 14px;
    }
    #formContacto .form-control{
        padding: 10px 12px;
    }
}
@media(max-width: 991px){
    .insignia {
        width: 45px;
        left: 20px;
    }
    .menu-item.active .nav-link{
         position: relative;
         width: -moz-fit-content;
         width: fit-content;
     }
    .menu-item.active .nav-link:before{
        content: "";
        width: 100%;
        height: 2px;
        background-color: #0079c4;
        position: absolute;
        bottom: 6px;
    }
    #banner_contacto {
        padding-top: 35px;
    }
    .caja2{
        margin: 0 15px;
    }
    .caja2:not(:last-of-type){
        margin-bottom: 15px;

    }
    .telf{
        font-size: 18px;
        font-weight: 600;
    }
    footer {
        font-size: 14px;
    }
    .redes a img {
        width: 40px;
    }
    .banner_usos{
        margin: 100px 20px 0;
        border-radius: 50px 50px 0 0;
    }
    .banner_usos .img_usos{
        left: 50%;
        transform: translateX(-50%);
        top: -100px;
        width: 170px;
    }
    .banner_usos .texto h2{
        margin-top: 50px;
        text-align: center;
    }
    .banner_usos .texto h4{
        font-size: 16px;
        text-align: center;
    }
    .p-m-100{
        margin-top: 0;
        padding-top: 60px;
    }
    .tabla {
        font-size: 16px;
        padding: 10px 0;
        border-radius: 40px;
    }
    .tabla h3 {
        font-size: 18px;
    }
    .quat_ventajas {
        font-size: 15px;
    }
    .bannerText{
        left: 0;
        transform: translate(0, -50%);
        font-size: 28px;
        line-height: 36px;
        padding: 0 15px;
    }
    .obras_realizadas {
        width: 100% !important;
        /*padding: 15px 0;*/
    }
    .obras_realizadas img{
        width: 100%;
    }
    .mfp-content .mfp-arrow-left {
        right: 90px;
    }
    #carrusel_obras{
        height: fit-content!important;
    }
    #banner_clientes .slick-arrow{
        width: 35px;
    }
    #banner_clientes .slick-prev {
        left: -38px;
    }
    #banner_clientes .slick-next {
        right: -38px;
    }
    .play img{
        width: 50px;
    }
    #video_obras{
        margin-top: 25px;
        margin-bottom: 0;
    }
    #video_obras .title {
        font-size: 18px;
    }
    .caja img {
        max-width: 75px;
    }
    #banner_ventajas .slick-slide {
        margin: 0;
    }
    .py-100{
        padding: 60px 0;
    }
    .margin-menu {
        margin-top: 50px;
    }
    .menu-item a{
        color: #8A8787;
        font-weight: bold;
    }
    .menu-item.active a{
        color: #4A4848;
    }
    .pb-0-resp{
        padding-bottom: 0;
    }
    .slick-dots li,
    .slick-dots li button{
        width: 12px;
        height: 12px;
    }
    #formContacto .form-control{
        padding: 8px 12px;
    }
    #banner_experiencia {
        font-size: 28px;
        line-height: 32px;
    }
    .bg-small-celeste{
        background-color: #0079c4;
        color: #FFE800;
        padding: 10px 0;
    }
    .botones{
        display: none;
	}
	.titBlue{
		width: 100%;
	}
}
@media(max-width: 768px) {
    h2{
        font-size: 26px;
    }
    .btn-celeste, .btn-celeste:hover, .btn-celeste:focus, .btn-amarillo, .btn-amarillo:hover, .btn-amarillo:focus{
        min-width: 100px;
        font-size: 14px;
        padding: 10px 12px;
    }
    .botones .slick-prev, .botones .slick-next{
        font-size: 0;
    }
    .bannerText span {
        margin: 0;
    }
    #formContacto,
    #formContacto .form-control{
        font-size: 14px;
    }
    #carrusel_obras_img .slick-list .slick-track .slick-slide,
    #car_videos .slick-list .slick-track .slick-slide{
        padding: 0;
    }
    .py-60 {
        padding: 50px 0;
    }
    .caja {
        width: 195px;
        height: 145px;
        padding: 20px 10px;
        border-radius: 30px;
    }
    .caja img {
        max-width: 60px;
    }
    .caja .text {
        font-size: 14px;
    }
    .caja2 .text {
        font-size: 15px;
        line-height: 18px;
    }
    .banner_usos {
        margin: 75px 20px 0;
        border-radius: 50px 50px 0 0;
    }
    .banner_usos .img_usos {
        top: -75px;
        width: 130px;
    }
    .banner_usos .texto h2 {
        margin-top: 35px;
    }
    .banner_usos .texto h4 {
        font-size: 14px;
    }
}
@media (max-width: 600px){
    h5{
        font-size: 1.15em;
    }
    .datos{
        font-size: 14px;
    }
    .datos div{
        padding-left: 50px;
    }
    .mfp-gallery .mfp-content,
    .mfp-iframe-scaler iframe{
        padding: 35px 0 0;
    }
    .mfp-figure .mfp-bottom-bar {
        margin: 0;
    }
    .mfp-content .mfp-arrow-left {
        top: 2px;
        right: 80px;
    }
    .mfp-content .mfp-arrow-right {
        top: 2px;
        right: 45px;
    }
    .mfp-zoom-out-cur .mfp-gallery .mfp-image-holder .mfp-close,
    .mfp-image-holder .mfp-close,
    .mfp-iframe-holder .mfp-close {
        right: 0px;
        width: 35px;
        height: 35px;
        line-height: 32px;
    }
}
@media(max-width: 480px) {
    h2{
        font-size: 22px;
    }
    #banner_calidad,
    .py-60{
        padding: 35px 0;
    }
    .caja2 {
        width: auto;
        height: auto;
        padding: 20px;
        margin: 0;
    }

    .caja2:not(:last-of-type) {
        margin: 0 0 15px;
    }

    .caja2 .mix {
        position: unset;
        transform: translate(0, 0);
        padding: 0;
    }

    footer {
        font-size: 10px;
    }

    #video_obras .title {
        font-size: 15px;
    }

    .div_servicios {
        font-size: 16px;
    }

    .bannerText span {
        width: min-content;
    }
    #formContacto,
    #formContacto .form-control{
        font-size: 12px;
    }
    #subfooter {
        font-size: 14px;
    }
}

@media(max-width: 380px) {
    .datos{
        font-size: 12px;
    }
}
@media(max-width: 350px) {
    .tabla {
        font-size: 14px;
    }
}
@media(max-width: 300px){
    .big {
        font-size: 20px;
    }
}