/** RESPONSIVE **/


/* NAVEGADORES 1200px O MAYOR */
@media (min-width: 1200px) {
}

/* NAVEGADORES 1200px O MENOR */
@media (max-width: 1200px) {

    .logo_cargando {
        width: 15%;
    }
    

    .contenedor_ancho_sitio {
        max-width: 90%;
    }

}

/* NAVEGADORES 1200px O MAYOR */
@media (max-width: 1000px) {

    
    body {
        width: 100vw;
        overflow-x: hidden;
        position: relative;
    }
    body.hc-nav-open {
        min-height: inherit !important;
        position: initial;
        overflow: hidden !important;
    }
    .hc-nav-open .hc-nav-trigger.hc-nav-1 {
        left: calc(3vw + 280px);
        z-index: 10000;
        transition: left 0.3s ease;
    }
    .logo_cargando {
        width: 25vw;
        height: 20vw;
    }

    .hc-nav-trigger span, 
    .hc-nav-trigger span::before, 
    .hc-nav-trigger span::after {
        background: white !important;
    }
    .hc-offcanvas-nav .nav-wrapper {
        background: var(--color_gris_1);
    }

    .hc-offcanvas-nav li a {
        text-transform: uppercase;
        font-size: 14px;
    }
    .hc-nav-trigger.hc-nav-1 {
        background-color: var(--color_proyecto_1);
        width: 80px !important;
        height: 80px;
        border-radius: 100%;
        position: fixed;
        left: 3vw;
        top: 3vw;
    }

    .hc-nav-trigger.hc-nav-1 span {
        left: 0;
        right: 0;
        margin: auto;
    }

    .hc-offcanvas-nav::after, .hc-offcanvas-nav .nav-wrapper::after {
        background: #000000c7;
    }

    
    .contenedor_seccion .contenedor_ancho_sitio {
    overflow: hidden;
    }
    
    .logo_header {
        float: none;
        margin: 0 auto;
        width: 25%;
        padding-top: 80px;
    }
    
    .contenedor_menu.derecha {
        float: none;
        position: absolute;
        top: 0;
        right: 0;
    }

}

/* NAVEGADORES ENTRE 980px y 1000px */
@media (max-width:990px) { 
}

/* NAVEGADORES ENTRE 768px y 979px */
@media (max-width: 768px) {
    
   .logo_cargando {
        width: 40vw;
        height: 30vw;
    
    }
    .contenedor_ancho_sitio {
        max-width: calc(100% - 30px);
    }

    .hc-nav-trigger.hc-nav-1 {
        width: 60px !important;
        height: 60px !important;
    }
    
}

/* NAVEGADORES 650px */
@media (max-width: 650px) {   
}

/* NAVEGADORES 530px */
@media (max-width: 530px) {
}
 
/* NAVEGADORES 400px */
@media (max-width: 400px) {
}

/* Retina Display */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5) {}