* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Manrope", sans-serif;
}

/* --------------- GUIA DE ESTILO --------------------- */
h1 {
    font-size: 2.5rem;
    font-weight: bold;
}

h2 {
    font-size: 2.25rem;
    font-weight: 600;
}

h3 {
    font-size: 2rem;
    font-weight: 500;
}

h4 {
    font-size: 1.75rem;
    font-weight: 400;
}

span {
    font-size: 1.5rem;
    font-weight: 300;
}

p {
    font-size: 1.25rem;
    font-weight: 300;
}


/* --------------- HEADER --------------------- */
.navbar {
    background: rgb(33,47,81);
    background: linear-gradient(90deg, rgba(33,47,81,1) 0%, rgba(0,37,133,1) 100%);
    padding: 20px 100px!important;
    -webkit-box-shadow: 10px 10px 22px 0px rgba(110,110,110,0.19);
    -moz-box-shadow: 10px 10px 22px 0px rgba(110,110,110,0.19);
    box-shadow: 10px 10px 22px 0px rgba(110,110,110,0.19);
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 999;
}

.nav-link {
    color: white;
    font-weight: 700;
    font-size: 1.20rem;
    margin-right: 55px;
    line-height: 2;
    position: relative;
    transition: all 0.4s ease 0s;

}

.nav-link::before {
    content: '';
    width: 0;
    height: 2px;
    border-radius: 2px;
    background-color: #fff;
    position: absolute;
    bottom: -.25rem;
    right: 0;
    transition: right .4s, width .4s, left .4s;
  }
  
  .nav-link:hover::before {
    width: 100%;
    left: 0;
  }

.nav-item:hover{
    color: #8b8b8b !important;

}
.nav-link:hover{
    color: #8b8b8b !important;
}

  .nav-link:active{
    background-color: white;
    color: rgb(50, 94, 189) !important;

  }

.navbar-nav .nav-link.active{
    transition: all 0.4s ease 0s;
    color: rgb(81, 118, 197) !important;

}
.container-fluid{
    padding-right: 0rem;
    padding-left: 0rem;
}

.attachment-medium{
    border-radius: 15px;
    width: 100%;
    height: 100px;
}
/* -------------------------------------------------------------- INDEX -------------------------------------------------------------------------------- */


.caf-post-title h2{
    text-align: center;
}


.destacado .row{
        --bs-gutter-x: 0rem;
    --bs-gutter-y: 0;
        margin-right: 0;
    margin-left: 0;

}

.fotos-galeria .row{
    --bs-gutter-x: 0rem;
    --bs-gutter-y: 0;
    margin-right: 0;
    margin-left: 0;
}

.margin-vip .row{
    --bs-gutter-x: 0rem;
    --bs-gutter-y: 0;
    margin-right: 0;
    margin-left: 0;
}

.section-garantias .row{
        --bs-gutter-x: 0rem;
    --bs-gutter-y: 0;
    margin-right: 0;
    margin-left: 0;
}


.banner-home {
    position: relative;
    background: url(../img/banner-home.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    padding: 70px 0px;
    width: 100%;
    height: 627px;
    margin: 0;
}

.banner-nosotros{
    position: relative;
    background: url(../img/banner-nosotros.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    padding: 70px 0px;
    width: 100%;
    height: 315px;
    margin: 0;
    margin-bottom: 4rem;
}
.banner-proyectos{
    position: relative;
    background: url(../img/banner-proyectos.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    padding: 70px 0px;
    width: 100%;
    height: 315px;
    margin: 0;
    margin-bottom: 4rem;
}

.banner-contacto{
    position: relative;
    background: url(../img/banner-contacto.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    padding: 70px 0px;
    width: 100%;
    height: 315px;
    margin: 0;
    margin-bottom: 4rem;
}

.banner-productos{
    position: relative;
    background: url(../img/banner-productos.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    padding: 70px 0px;
    width: 100%;
    height: 315px;
    margin: 0;
    margin-bottom: 4rem;
}

.border-bottom{
    margin-bottom: 50px;
}
:root{
    --bs-border-width: 3px!important;
}


/* ------------- HOME PARTE SUPERIOR ------------ */
.boton-banner{
    display: inline-flexbox;
    font-style: none;
    color: white;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 24px;
    text-decoration: none;
    width: 696px!important;
    height: 60px!important;
    background-color: #4175FC;
    border-radius: 20px;
    padding: 10px 50px;
    -webkit-box-shadow: 10px 10px 22px 0px rgba(0,0,0,0.27);
    -moz-box-shadow: 10px 10px 22px 0px rgba(0,0,0,0.27);
    box-shadow: 10px 10px 22px 0px rgba(0,0,0,0.27);
    transition: all 0.4s ease 0s;
}

.boton-banner:hover{

    letter-spacing: 3px;
    background-color: #193272;
    color: hsl(0, 0%, 100%);
    box-shadow: #092e8a 0px 7px 29px 0px;
    transition: all 0.4s ease 0s;
}

.boton-banner:active {
    letter-spacing: 3px;
    background-color: #193272;
    color: hsl(0, 0%, 100%);
    box-shadow: #092e8a 0px 0px 0px 0px;
    transform: translateY(10px);
    transition: 100ms;
  }

/* ------------- SECCION PRODUCTO Y DESTACADOS ------------- */

.tarjeta-producto hr{
    border: 1px solid rgb(85, 85, 85);
}

.tarjeta-producto{
    padding: 30px 20px;
    background-color: #FFFFFF;
    position: relative;
    height: 880px;
    width: 458px;
    border: 1px solid #9C9C9C;
    border-radius: 20px;
    -webkit-box-shadow: 10px 10px 33px 4px rgba(0,0,0,0.17);
    -moz-box-shadow: 10px 10px 33px 4px rgba(0,0,0,0.17);
    box-shadow: 10px 10px 33px 4px rgba(0,0,0,0.17);
    transition: 200ms;
}

.tarjeta-producto a{
    font-size: 20px;
    text-transform: uppercase;
    text-decoration: none;
    padding: 0.8em 2.5em;
    display: inline-block;
    cursor: pointer;
    border-radius: 6em;
    transition: all 0.5s;
    border: none;
    font-family: inherit;
    font-weight: 700;
    color: white;
    background-color: #4175FC;
    position: absolute;
    bottom: 60px;
    right: 105px;
}

.tarjeta-producto a:hover{
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(27, 27, 27, 0.2);
}

.tarjeta-producto a::after{
    content: "";
    display: inline-block;
    height: 100%;
    width: 100%;
    border-radius: 100px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: all 0.4s;
}

.tarjeta-producto a::after{
    background-color: #4175FC;

}

.tarjeta-producto a:hover::after{
    transform: scaleX(1.4) scaleY(1.6);
    opacity: 0;

}

.tarjeta-producto:hover{
    transform: translateY(-15px);
    border-top: 3px solid #001aff;
    border-bottom: 3px solid #001aff;

}

.tarjeta-producto h5{
    font-size: 1.8rem;
    font-weight: 600;
    text-align: center;
}

.tarjeta-producto h3{
    font-weight: 700;
}

.tarjeta-producto h4{
    font-weight: 500;
    color: #4175FC;
}

.tarjeta-producto span{
    font-weight: 400;
    color: black;
}


/* ------------- GALERIA ------------- */

.bg-galeria{
    position: relative;
    background: url(../img/bg-galeria.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    padding: 70px;
    width: 100%;
    height: 440px;
    margin: 0;
    margin-top: 6rem;
    margin-bottom: 6rem;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    text-align: center;
}

.galeria-containers {
    width: 100%;
    height: 237px;
    object-fit: cover;
    border-radius: 10px;
    transition: ease 0.5s;
    -webkit-transition: ease 0.5s;
    -moz-transition: ease 0.5s;
}

.galeria-containers:hover {
    transform: scale(1.1)
}

.garantias{
    position: relative;
    background: url(../img/garantias-bg.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    width: 100%;
    height: 978px;
    border-radius: 50px;
    padding: 60px;

}
.garantias h2{
    font-weight: 700;
}

.tarjeta-garantia{
    border-radius: 20px;
    color: #4175FC;
    padding: 25px;
    background-color: white;
    -webkit-box-shadow: 10px 10px 40px 1px rgba(0,0,0,0.09);
    -moz-box-shadow: 10px 10px 40px 1px rgba(0,0,0,0.09);
    box-shadow: 10px 10px 40px 1px rgba(0,0,0,0.09);
    position: relative;
    transition: 200ms;

}

.tarjeta-garantia::after, .tarjeta-garantia::before {
    position: absolute;
    content: "";
    width: 0;
    height: 0;
    transition: .5s;
  }
  
  .tarjeta-garantia::after {
    top: -3px;
    left: -3px;
    border-top: 3px solid transparent;
    border-left: 3px solid transparent;
  }
  
  .tarjeta-garantia::before {
    bottom: -3px;
    right: -3px;
    border-bottom: 3px solid transparent;
    border-right: 3px solid transparent;
  }
  
  .tarjeta-garantia:hover {
    border-radius: 0px;
    transform: scale(1.1);
    color: #001aff;
    cursor: pointer;
  }
  
  .tarjeta-garantia:hover::after,
  .tarjeta-garantia:hover::before {
    width: calc(50% + 10px);
    height: calc(50% + 10px);
    border-color: #ff0055;
  }




.tarjeta-garantia h4{
    font-weight: 600;
    color: #4175FC;
}

/* ------- MISION ------ */
.mision h2{
    color: #001958;
}

.mision img{
    border-radius: 10px;
    -webkit-box-shadow: 10px 10px 36px 3px rgba(0,0,0,0.08);
-moz-box-shadow: 10px 10px 36px 3px rgba(0,0,0,0.08);
box-shadow: 10px 10px 36px 3px rgba(0,0,0,0.08);
}

/* ------- NUESTRA EMPRESA ------ */

.nuestra-empresa{
    position: relative;
    background: url(../img/nuestra-empresa.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    width: 100%;
    height: 1602px;
    padding: 50px;
    
}

.nuestra-empresa img{
    border-radius: 10px;
    -webkit-box-shadow: 10px 10px 42px 1px rgba(0,0,0,0.11);
    -moz-box-shadow: 10px 10px 42px 1px rgba(0,0,0,0.11);
    box-shadow: 10px 10px 42px 1px rgba(0,0,0,0.11);
}

.nuestra-empresa p, .nuestra-empresa span, .nuestra-empresa h2{
    color: white;
}
.nuestra-empresa span{
    font-weight: 600;

}
.fa-circle-check{

    padding-right: 10px;
}

.margin-vip{
    margin: 130px 0px!important;
}

.garantias-nosotros{
    position: relative;
    background: url(../img/garantias-bg.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    width: 100%;
    height: 602px;
    border-radius: 50px;
    padding: 60px;
}
/* -------- SECCION COTIZAR --------- */

.bg-cotizar{
    background: rgb(59,55,113);
    background: linear-gradient(90deg, rgba(59,55,113,1) 0%, rgba(31,2,129,1) 100%);
    padding: 70px 0px;
    position: relative;
}
.bg-cotizar h1, .bg-cotizar span{
    margin-bottom: 40px;
    color: white;

}

.bg-cotizar img{
    position: absolute;
    bottom: 0px;
    right: 0px;
}

.bg-cotizar a{
    margin-top: 70px;
    font-size: 20px;
    text-transform: uppercase;
    text-decoration: none;
    padding: 0.8em 2.5em;
    display: inline-block;
    cursor: pointer;
    border-radius: 6em;
    transition: all 0.5s;
    border: none;
    font-family: inherit;
    font-weight: 700;
    color: #4175FC;
    background-color: white;
}

.bg-cotizar a:hover{
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(27, 27, 27, 0.2);
}

.bg-cotizar a::after{
    content: "";
    display: inline-block;
    height: 100%;
    width: 100%;
    border-radius: 100px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: all 0.4s;
}

.bg-cotizar a::after{
    background-color: white;

}

.bg-cotizar a:hover::after{
    transform: scaleX(1.4) scaleY(1.6);
    opacity: 0;

}



/* ---------------------------------- PROYECTOS --------------------------------------- */

.sombra{
    box-shadow: 5px 5px 7px rgba(0, 0, 0, 0.408);
    border-radius: 5px;
}

.proyectos i{
    margin-right: 15px;
}
.proyectos h1{
    color: #001958;
}

.ubicacion i{
    font-size: 36px!important;
}

.ubicacion{
    display: flex;
    align-items: center;
font-weight: 600;
margin-bottom: 50px;
}

.proyectos p{
    margin-bottom: 35px;

}



/*-------------------- PLUGIN OWL CAROUSEL -------------------*/

.owl-container{
    max-width: 900px;
    margin: 0 auto;
}

.item{
    color: white;
    display: flex;
    justify-content: center;
    height: 10rem;
}

.item img{

    padding: 10px;

}

.owl-carousel .owl-item img {
    -webkit-box-shadow: 10px 10px 49px 3px rgba(0,0,0,0.14);
    -moz-box-shadow: 10px 10px 49px 3px rgba(0,0,0,0.14);
    box-shadow: 10px 10px 49px 3px rgba(0,0,0,0.14);
}

/* ---------------------- CONTACTO ------------------------- */

.bg-contacto{
    background-color: #F2F2F2;
    padding: 15px;
}






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

.container-fluid footer{
    width: 100%;
}
footer{
    background: rgb(38,38,38);
    background: linear-gradient(90deg, rgba(38,38,38,1) 0%, rgb(66, 66, 66) 100%);
    padding: 80px 0px;
    color: white;
}

footer img{
    padding: 0px 20px;
    border-radius: 15%;
}
footer h1{
    font-size: 28px;
    font-weight: 600;
}
.fa-angle-double-right{
    color: #ffffff!important;
}
.fa-regular{
    color: #ffffff!important;

}
.fa-brands{
    color: #ffffff!important;

}
.listas a{
    text-decoration: none;
    color: white;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    transition: all 0.4s ease 0s;

}

.listas a:hover{
    letter-spacing: 2px;
    -webkit-box-shadow: 0px 5px 40px -10px rgba(0,0,0,0.57);
    -moz-box-shadow: 0px 5px 40px -10px rgba(0,0,0,0.57);
    box-shadow: 10px 40px -10px rgba(0,0,0,0.57);
    transition: all 0.4s ease 0s;
}
.listas span{
    margin-left: 10px;
    margin-bottom: 15px;
}
.listas li{
    list-style: none;

}

.creditos{
    background-color: black;
    color: white;
    text-align: center;
    font-weight: 400;
    padding: 10px;
}

.creditos a{
    color:white;
}

.creditos p{
    padding-top: 10px;
}

footer .row{
    --bs-gutter-x: 0rem!important;
}

.row.creditos{
    --bs-gutter-x: 0rem!important;
}

.contacto h2{
    color: #154284;
}
.contacto p{
    color: #154284;
}
.contacto i{
    color: white!important;
    font-size: 24px;
    padding: 10px;
    background-color: #154284;
    border-radius: 20px;
    margin-right: 15px;
    transition: .5s ease-in-out;

}
.contacto i:hover{
    background-color: #67C5EF!important;

}

.formulario-contacto{
    padding: 20px 40px;
    background-color: white;
    border-radius: 20px;
    -webkit-box-shadow: 10px 10px 44px 1px rgba(0,0,0,0.15);
    -moz-box-shadow: 10px 10px 44px 1px rgba(0,0,0,0.15);
    box-shadow: 10px 10px 44px 1px rgba(0,0,0,0.15);
}

.formulario-contacto h2{
    color: #154284;

}

.btn-primary{
    padding-bottom:15px;
}
  

/* ------------------------------------- PAGINA PRODUCTOS ------------------------------------- */

.producto{
    padding: 20px;
    background-color: #FFFFFF;
    position: relative;
    height: auto;
    width: 458px;
    border: 1px solid #dfdfdf;
    border-radius: 20px;
    -webkit-box-shadow: 10px 10px 33px 4px rgba(0,0,0,0.17);
    -moz-box-shadow: 10px 10px 33px 4px rgba(0,0,0,0.17);
    box-shadow: 10px 10px 33px 4px rgba(0,0,0,0.17);
    transition: 200ms;
}

.producto:hover{
    transform: translateY(-15px);
    border-top: 3px solid #001aff;
    border-bottom: 3px solid #001aff;

}

.producto .caf-read-more{
    font-size: 20px!important;
    text-transform: uppercase;
    text-decoration: none;
    padding: 0.8em 2.5em;
    display: inline-block;
    border-radius: 6em;
    transition: all 0.5s;
    border: none!important;
    font-family: inherit;
    font-weight: 700;
    color: white!important;
    background-color: #4175FC;
    width: 100%!important;
    text-align: center;
}

.producto .caf-read-more:hover{
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(27, 27, 27, 0.2);
}

.producto .caf-read-more::after{
    content: "";
    display: inline-block;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: all 0.4s;
}



.producto .caf-read-more:hover::after{
    transform: scaleX(1.4) scaleY(1.6);
    opacity: 0;

}

.data-target-div1 .caf-post-layout1 .caf-post-title h2 a {
    font-size: 26px!important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif!important;
}

.caf-meta-content{
    display: none!important;
}

.data-target-div1 .caf-post-layout1 .caf-post-title {
    background-color: #ffffff00!important;
}

.caf-post-layout1 .manage-layout1 {
    box-shadow: 0 0 8px -5px #ffffff!important;
}

.caf-filter-container li:first-child{
    display: none!important;
}

.page-numbers{
    color: white!important;
    transition: all 0.5s;

}

.page-numbers a{
    font-size: 20px!important;
    
}

.page-numbers:hover{
    background-color:#799fff!important ;
}

.navbar-toggler {
    background-color: white!important;
}


/* -------------------- SINGLE PAGE ------------------ */
.single-producto span{
    padding-bottom: 2rem!important;
}


.boton-cotizar{
    margin-top: 20px;
    font-size: 24px;
    text-decoration: none;
    padding: 0.5em 3.5em;
    display: inline-block;
    cursor: pointer;
    border-radius: 6em;
    transition: all 0.5s;
    border: none;
    font-weight: 700;
    color: white;
    position: relative;
}
.boton-cotizar:hover{
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(27, 27, 27, 0.2);
    color: #001958;
}

.boton-cotizar::after{
    content: "";
    display: inline-block;
    height: 100%;
    width: 100%;
    border-radius: 100px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: all 0.4s;
}

.boton-cotizar::after{
    background-color: #4175FC;

}

.boton-cotizar:hover::after{
    transform: scaleX(1.4) scaleY(1.6);
    opacity: 0;

}


/* -------------------------------------------------------------- RESPONSIVE -------------------------------------------------------------------------------- */
@media screen and (max-width: 1669px) {
    
    .testimonios{
        margin-top: 100px;
        height: 960px;
        padding: 80px 0px;
    }
    
    footer .contactar li a i {
        font-size: 16px;

    }

    footer .contactar li a span {
        font-size: 16px;
    }


}

@media screen and (max-width: 1590px) {
    .contacto-cuadradro1{
        width: 604px;
        height: 378px;
    }
    .fondo-azul{
        width: 604px;
        height: 378px;
    }
    .contacto-cuadradro2{
        width: 604px;
        height: 378px;
    }
    .tarjeta-solucion{
        margin-top: 35px;
        width: 600px;
    }

}

@media screen and (max-width: 1490px) {
    .contacto-cuadradro1{
        width: 564px;
        height: 348px;
    }
    .fondo-azul{
        width: 564px;
        height: 348px;
    }
    .contacto-cuadradro2{
        width: 564px;
        height: 348px;
    }
    .tarjeta-solucion{
        margin-top: 35px;
        width: 570px;

    }
    .boton-contacto{
        width: 326px!important;
        height: 60px!important;
        font-size: 20px;

    }

}

@media screen and (max-width: 1410px) {
    .nav-link {
        font-size: 1.10rem;
        margin-right: 30px;
    
    }

    .tarjeta-solucion{
        margin-top: 30px;
        padding: 15px;
        width: 530px;

    }

}

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

    .contacto-cuadradro1{
        width: 504px;
        height: 318px;
    }
    .fondo-azul{
        width: 504px;
        height: 318px;
    }
    .contacto-cuadradro2{
        width: 504px;
        height: 318px;
    }
    .boton-contacto{
        width: 286px!important;
        height: 60px!important;
        padding: 10px 30px;

    }
    .tarjeta-solucion{
        margin-top: 30px;
        width: 500px;

    }

    .tarjeta-testimonio{
        padding: 25px 15px;
        height: 530px;
        width: 348px;
    }

}

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

    .boton-banner{
        font-size: 20px;
        padding: 10px 40px;
        width: 396px!important;
        height: 60px!important;
    }
    .nav-link {
        font-size: 0.9rem;
        margin-right: 20px;
    
    }
    .navbar {
        padding: 10px 40px!important;
    
    }

    .tarjeta-testimonio{
        padding: 25px 15px;
        height: 500px;
        width: 318px;
    }

    .tarjeta-testimonio a{
        margin-top: 15px;
        font-size: 20px;

    }
    
    
    .tarjeta-testimonio p{
        font-size: 0.85rem!important;
        margin-bottom: 0.2rem!important;

    }
    

}

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

    .contacto-cuadradro1{
        width: 464px;
        height: 288px;
    }
    .fondo-azul{
        width: 464px;
        height: 288px;

    }
    .contacto-cuadradro2{
        width: 464px;
        height: 288px;
    }
    .boton-contacto{
        height: 60px!important;
        padding: 7px 10px;

    }
    .tarjeta-solucion{
        margin-top: 25px;
        width: 470px;

    }
}
@media screen and (max-width: 1199px) {
    p {
        font-size: 0.9rem;
    }

    h1{
        font-size: 1.9rem;

    }
    h2{
        font-size: 1.5rem;

    }
    h3{
        font-size: 1.3rem;
    }
    h4{
        font-size: 1.2rem;

    }

    footer {
        padding: 120px 0 40px 0;
    }
    footer h1 {
        font-size: 18px;
    }
    footer .contactar li a span{
        font-size: 12px;
    }

    .personas{
        width: 600px ;
        height: 404px;
        bottom: 60px;
    }
     
}

@media screen and (max-width: 1170px) {
    
    .contactar ul{
        padding-left: 0rem!important;

    }

    .contacto-cuadradro1{
        width: 404px;
        height: 248px;
    }
    .fondo-azul{
        width: 404px;
        height: 248px;

    }
    .contacto-cuadradro2{
        width: 404px;
        height: 248px;
    }
    .boton-contacto{
        font-size: 18px;
        width: 226px!important;
        height: 60px!important;
    }
    .tarjeta-solucion{
        margin-top: 25px;
        width: 420px;

    }

    .boton-banner{
        font-size: 18px;
        padding: 10px 25px;
        width: 396px!important;
        height: 50px!important;
    }

    .nav-link {
        font-size: 0.9rem!important;
        margin-right: 10px;
    
    }
    .navbar {
        padding: 6px 10px!important;
    
    }
    .tarjeta-testimonio{
        padding: 20px 10px;
        height: 460px;
        width: 268px;
    }

}
@media screen and (max-width: 1092px) {
    .destacado-responsivo{
        justify-content: center!important;
    }

    .garantias h4{
        font-size: 1rem;
    }
    .tarjeta-garantia{
        padding: 15px;
    }

}
@media screen and (max-width: 1045px) {
    .nuestra-empresa span{
        font-size: 1rem;
    }
    

    .contacto-cuadradro1{
        width: 364px;
        height: 208px;
    }
    .fondo-azul{
        width: 364px;
        height: 208px;

    }
    .contacto-cuadradro2{
        width: 364px;
        height: 208px;
    }
    .boton-contacto{
        font-size: 18px;
        width: 226px!important;
        height: 60px!important;
    }
    .tarjeta-solucion{
        margin-top: 20px;
        width: 370px;

    }

    .personas{
        width: 500px ;
        height: 324px;
        bottom: 90px;
    }
}

@media screen and (max-width: 920px) {
    .bg-cotizar img{
        display: none;
    }

    .testimonios {
        margin-top: 100px;
        height: 1410px;
        padding: 70px 0px;
    }
    
    .tarjeta-testimonio{
        padding: 30px 20px;
        height: 500px;
        width: 298px;
    }

    .contacto-cuadradro1{
        width: 304px;
        height: 168px;
    }
    .fondo-azul{
        width: 304px;
        height: 168px;
    }
    .contacto-cuadradro2{
        width: 304px;
        height: 168px;
    }
    .boton-contacto{
        font-size: 16px;
        width: 226px!important;
        height: 50px!important;
    }
    .tarjeta-solucion{
        width: 300px;
        padding: 10px;

    }
    .tarjeta-solucion .mt-3{
        margin-top: 0rem!important;
    }

    .boton-banner{
        font-size: 15px;
        padding: 7px 15px;
        width: 356px!important;
        height: 30px!important;
    }

    .nav-link {
        font-size: 0.8rem!important;
        margin-right: 0px!important;
    
    }
    .navbar {
        padding: 6px 0px!important;
    
    }
    .nuestra-empresa span{
        font-size: 0.8rem;
    }

}

@media screen and (max-width: 767px) {
    .bg-contacto{
        display: flex;
        justify-content: center;
        flex-direction: column;
        text-align: center;
    }



    .single-producto h5{
        margin-top: 20px;
    }
    .single-producto h1{
        margin-bottom: 20px;
    }
    .single-producto h3{
        text-align: center;
    }
    .single-producto .row{
        padding: 20px;
    }
    .proyectos{
        padding: 25px;
        text-align: center;
    }
    .ubicacion{
        display: flex;
        justify-content: center;
    }
    .proyectos h1{
        margin-top: 35px;
    }

    .nuestra-empresa{
        height: 2132px;
        padding: 30px;
        text-align: center;
    }

    .nuestra-empresa h2{
        margin-top: 20px;
    }
    .img-vip{
        width: 100%!important;
    }
    .nuestra-empresa span{
        font-size: 1.15rem;
    }
    .nuestra-empresa img{
        margin-top: 30px;
    }
    .garantias-nosotros{

        height: 952px;
        padding: 40px;
    }
    .bg-cotizar{
        text-align: center;
    }

    .mision, .nuestra-empresa{
        display: flex;
        justify-content: center;
    }
    .mision{
        text-align: center;
    }
    .mision .col-md-7{
        padding: 15px;

    }
    .calidad h2, .calidad a, .calidad p{
        text-align: center;
    }
    .calidad .col-md-4{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .calidad .col-md-7{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .garantias{
        height: 1678px;

    
    }

    .tarjeta-garantia{
        padding: 25px;
        margin: 20px 0px;

    
    }
    .tarjeta-garantia h4{
        font-size: 1.4rem;
        font-weight: 600;
    }



    .boton-banner{
        text-transform: none;
        padding: 10px 20px!important;
    }


    .navbar-collapse {
        display: flex;
        justify-content: end;
        text-align: end;
    }
    .nav-link {
        font-size: 1rem!important;
        font-weight: 600;
    
    }
    .navbar {
        padding: 6px 10px!important;
    
    }
    .banner-home .col-md-5{
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
        text-align: center;
        width: 80%!important;
        max-width: 80%!important;
        margin: 0 auto!important;
    }
    .boton-banner{
        font-size: 18px;
        padding: 1px 25px;
        width: 376px!important;
        height: 40px!important;
    }
    .personas{
        display: none;
    }


}

@media screen and (max-width: 675px) {
    .tarjeta-testimonio{
        padding: 30px 20px;
        height: 540px;
        width: 338px;
    }
    .testimonios {
        height: 2010px;
    }

}

@media screen and (max-width: 615px) {
    .calidad{
        margin: 10px;
    }
    
    .contacto-cuadradro1{
        width: 364px;
        height: 188px;
        margin-bottom: 1rem;
    }
    .fondo-azul{
        width: 364px;
        height: 188px;
    }
    .contacto-cuadradro2{
        width: 364px;
        height: 188px;
        margin-bottom: 1rem;

    }
    .boton-contacto{
        font-size: 16px;
        width: 226px!important;
        height: 50px!important;
    }
    .tarjeta-solucion{
        width: 340px;
        padding: 10px;

    }
    .tarjeta-solucion .mt-3{
        margin-top: 0rem!important;
    }

}

@media screen and (max-width: 500px) {
    .contacto h1{
        font-size: 1.8rem;
        }



    .single-producto h5{
        font-size: 1.15rem;
    }
    .single-producto h1{
        font-size: 1.8rem;
    }
    .single-producto span{
        font-size: 1rem;
    }
    .single-producto h3{
        font-size: 1.2rem;
    }



    .boton-banner{
        font-size: 16px;
        padding: 1px 20px;
        width: 286px!important;
        height: 30px!important;
    }
    .saber-mas{
        padding: 0px 10px;
    }
    .altura-responsive-quienes{
        margin-bottom: 200px;
    }

    .tarjeta-producto{
        height: 850px;
        width: 408px;
    }

    .tarjeta-producto a{
        right: 85px;
    }
    .calidad a{
        height: 50px!important;

    }
    .nuestra-empresa{
        height: 1932px;
        padding: 15px;

    }
    .proyectos h1{
        font-size: 26px;
    }

}

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

    footer img {
        padding: 0px 20px;
    }
    
    .contacto-cuadradro1{
        width: 304px;
        height: 168px;
        margin-bottom: 1rem;
    }
    .fondo-azul{
        width: 304px;
        height: 168px;
    }
    .contacto-cuadradro2{
        width: 304px;
        height: 168px;
        margin-bottom: 1rem;

    }
    .boton-contacto{
        font-size: 16px;
        width: 226px!important;
        height: 50px!important;
    }
    .tarjeta-solucion{
        width: 300px;
        padding: 10px;

    }
    .tarjeta-solucion .mt-3{
        margin-top: 0rem!important;
    }

    .tarjeta-testimonio{
        padding: 30px 20px;
        height: 500px;
        width: 298px;
    }
    .altura-responsive-quienes{
        margin-bottom: 100px;
    }

    .tarjeta-producto{
        height: 780px;
        width: 328px;
    }

    .tarjeta-producto a{
        right: 45px;
    }

}


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

    /* --------------- INDEX ------------------- */

    .nav-link{
        font-size: 1rem;
    }
    h1{
        font-size: 2.2rem;

    }
    h2{
        font-size: 1.9rem;

    }
    h3{
        font-size: 1.5rem;
    }
    h4{
        font-size: 1.25rem;

    }
    p{
        font-size: 1rem;
    }

    span{
        font-size: 1.2rem;

    }
    footer h1{
        font-size: 22px;

    }
    .altura-responsive-quienes{
        margin-bottom: 300px;
    }

}

@media screen and (max-width: 1254px) {
    footer .contactar li a i{
        font-size: 14px;
    }
    footer .contactar li a span{
        font-size: 14px;
    }
    footer h1 {
        font-size: 20px;
    }
}



@media screen and (max-width: 991px) {
    .contacto h1{
        margin-top: 20px!important;
    }

    p{
        font-size: 0.8rem;
    }

}
@media screen and (max-width: 913px) {
    footer .contactar li a span {
        font-size: 10px;
    }
    .altura-responsive-quienes{
        margin-bottom: 250px;
    }

    .garantias h4{
        font-size: 0.9rem;
    }
    .tarjeta-garantia{
        padding: 7px;
    }


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

    footer {
        text-align: center;
    }

    footer .rapidos {
        margin-bottom: 50px;
    }

    footer ul {
        padding-left: 0rem !important;
    }

    footer .img-fluid{
        margin-bottom: 50px;
    }

    footer .contactar{
        margin-top: 40px;
    }

    footer .contactar li a span {
        font-size: 12px;
    }
}



@media screen and (max-width: 400px) {
    .banner-home .col-md-6{
        padding: 10px;
    }



    .attachment-medium, .logo a{
        width: 80%!important;

    }

    /* --------------- FOOTER ------------------- */
    footer {
        text-align: center;
    }

    footer .col-md-3 li a i {
        display: none
    }



    footer .rapidos {
        margin-bottom: 50px;
    }

    footer ul span {
        padding-left: 0rem !important;
        font-size: 15px;
    }

    footer .col-md-3 h1 {
        font-size: 20px;
        color: #ffffff;
        padding: 60px 0;
    }

    footer h1.mb-4{
        margin-bottom: 0rem!important;
    }

    .row {
        --bs-gutter-x: 0rem !important;
    }

}