:root {
    --azul: #233973;
    --amarillo: #FFDF00;
    --grisoscuro: #343133;
    --gris: #333333;
    --grisclaro: #B9B9B9;
    --naranja: #F4B907;

}

@media (width <992px) {
    .contenido-banner {
        width: 100%;
        padding: 48px 259px 48px 120px;
    }
    .footer-separador{
        display: none;
    }
}

@media (width <767px) {
    body {
        overflow: auto;
    }

    .navbar {
        height: auto;
    }
    .logo-header {
        width: 220px;
    }
    .navbar span {
        display: none;
    }

    .footer-menu {
        flex-direction: column;
    }

    .contenido-banner p {
        font-size: 12px;
    }

    /* BANNER PRINCIPAL */
    .carousel-control-next {}

    .carousel-control-next-icono {
        font-size: 20px;
        width: 27px;
        height: 25px;
    }

    .carousel-control-prev {
        right: 14px;
    }

    .carousel-control-prev-icono {
        font-size: 20px;
        width: 27px;
        height: 25px;
    }

    .fondo-imagen-responsive img {
        width: 100%;
        object-fit: contain;
    }

    .section-contenido .card {
        margin-bottom: 15px;
    }

}

@media (width < 576px) {
    body {
        overflow-x: hidden;
    }

    /* -------------------
BANNER PRINCIPAL INICIO
-------------------- */
    .contenido-banner {
        padding: 0px 53px;
    }

    .img-responsive-principal {}

    /* -------------------
BANNER PRINCIPAL FIN
-------------------- */
    /* -------------------
BANNER INTERNAS INICIO
-------------------- */
    .fondo-imagen-responsive {
        position: relative;
        background-color: #727272;
    }


    .img-banner-internas {
        /* height: 200px;  */
        width: 100%;
        object-fit: cover;
        mix-blend-mode: multiply;
        font-weight: 700;

    }

    .titulo-banner-internas {
        position: absolute;
        top: 55%;
        left: 50%;
        transform: translate(-50%, -50%);
        color: #FFF;
        text-align: center;
        font-weight: 700;
    }

    /* -------------------
BANNER INTERNAS FIN
-------------------- */

    /* -------------------
NOSOTROS INICIO
-------------------- */
    /* -------------------
DESGIN 1 INICIO
-------------------- */

    .design-one {}

    .design-one h2 {}

    .design-one .img-design-one {
        width: 90%;

    }

    .design-one .descripcion {}

    .design-one .descripcion p {
        font-size: 13px;

    }

    /* -------------------
DESGIN 1 FIN
-------------------- */

    /* -------------------
DESGIN 2 INICIO
-------------------- */

    .design-two {}

    .design-two .img-design-two {
        width: 90%;
    }

    .design-two .descripcion {}

    .design-two .descripcion p {
        font-size: 13px;
    }

    /* -------------------
DESGIN 2 FIN
-------------------- */

    /* -------------------
NOSOTROS FIN
-------------------- */



    .contenedor-productos {
        height: auto;

    }

    /* Estilos para la barra de desplazamiento */
    .contenedor-productos::-webkit-scrollbar {
        width: 0px;
        /* Ancho de la barra de desplazamiento en navegadores WebKit (Chrome, Safari, etc.) */
    }

    .card-producto {
        width: 100%;
    }
    .card-producto  .card-body {
        padding: 0.3rem !important;
    }
    .card-producto  .card-body .producto-img {
        height: 200px;
    }
    .card-producto  .card-body h4 {
      
        font-size: 1rem;
      
    }
}