@media screen and (max-width: 1250px) and (min-width:900px){
    header nav ul li a {
        font-size: .7rem;
    }
    .secciones_nav ul{
        gap: .55rem;
    }
    .secciones_nav ul li a {
        font-size: .65rem;
    }
}

@media screen and (max-width: 1000px) and (orientation: portrait) {
    .container{
        padding: 0 1rem;
    }
    header nav{
        justify-content: end;
    }
    header nav ul{
        position: fixed;
        flex-direction: column;
        top: 0;
        right: -100%;
        height: 100%;
        width: 75vw;
        align-items: center;
        justify-content: center;
        z-index: 10;
        gap: 2rem;        
        background-color: #b60612f6;
        transition: right 0.5s ease;
        box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    }
    header nav ul.active{
         right: -1%;
    }
    header nav ul li{
        height: auto;
        padding: 0;
        margin: 0;
    }
    header nav #btn_nav{
        display: flex;
    }
    #close_nav{
        display: flex;
        font-size: 1.2rem;
        border-radius: 50%;
    }
    main{
        min-height: 55vh;       
    }
    .section_portafolio{
        padding: 3rem 0;
        grid-template-columns: 1fr;
        gap: 1rem;        
    } 
    .section_portafolio a{
        padding: 0 2rem;
    }

    /* seccion productos destacados  */
    .productos_{
        min-height: 55vh;
    }
    .productos_ ._title{
        font-size: 1rem;
    }
    
    /* Footer */
    footer{
        height: 12rem;
        background-color: #000000;
    }

    footer .container{
        flex-direction: column;
        align-items: center;
        padding: 0;
    }

    footer .container .footer_left .logo_footer{
        height: 30%;
    }
    footer .container .footer_left .line{
        height: 30%;
    }
    footer .container .footer_left .logo_footer_simple{
        height: 30%;
    }

    footer .container .footer_right{        
        flex-direction: column;       
        font-size: .8rem;
        gap: 1.5rem;
    }
    
    footer .container .footer_right .social_media_icons{
        display: flex;
        gap: 1rem;
    }

    /* 
    * Grid categorias
    */

    #categorias{
        margin: 3rem 0;
        margin-bottom: 1rem;
        gap: 2rem 0;
    }

    #categorias .items{
        flex-grow: 1;
        width: 100%;
    }

    #categorias .items img{
        height: auto;
        width: 70%;
    }
    /* 
    * Grid Subcategorrias
    */

    #subcategorias{
        min-height: 55vh;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem 1rem;
        margin-top: 2rem;
    }
    #subcategorias img{
        width: 90%;
    }

    /* secciones nav */
    .secciones_nav{
        display: none;
    }   

    /* 
    * Grid subsecciones
    */

    #subsecciones{
        margin: 1rem 0;
        gap: 2rem 0;
    }

    #subsecciones .items{
        flex-grow: 1;
        width: 100%;
    }

    #subsecciones .items img{
        max-height: max-content;
        width: 70%;
    }

    /* grid productos */
    .productos_container{
        width: 100%;
        display: flex;
        justify-content: start;
    }
    .productos{
        height: auto;
        width: 100%;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
    }
    .productos a{
        width: 100%;
    }

    .productos .items{
        background-color: rgba(255, 255, 255, 0.7);
        width: 100%;
        height: 100%;
        padding: 1rem;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: end;
        gap: 1rem;
        border-radius: 1rem;
        box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    }
    .productos .items .img_container{
        flex-grow: 1;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .productos .items img{
        max-height: 6rem;
        max-width: 7rem;
    }
    .productos .items p{
        max-width: auto;
    }
    .productos_title{
        font-size: 1rem;
    }

    /* pop up */
    .pop_up_content{   
        width: 95vw;
        max-width: 95vw; 
        padding: 1rem;  
        gap: 1rem;
        justify-content: space-between;
        
    }
    .pop_up_col{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }
    .pop_up_col img{
        max-height: 38vh;
        max-width: 80vw;
    }

    #render_js_variantes{
        margin-top: 1rem;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 70px;
        width: 90%;
        gap: .5rem;
        flex-wrap: wrap;
    }
    #render_js_variantes .item{
        height: 50%;
        cursor: pointer;
    }
    #render_js_variantes .item img{
        height: 100%;
    }

    /* 
    * css para quienes solos 
    */   
    .quienes_somos{
        background-image: url('../img/about/about_fondo_2_2.png');
    } 
    .quienes_somos::after{
        top: 5%;
        left: 13%;
        background-image: url('../img/about/somos_1.png');
        height: 13rem;
        max-height: 45.5vw;
        width: 20rem;
        max-width: 70vw;
    }
    .quienes_somos_popup{
        width: 80vw;
    }

    .mensaje{
        position: absolute;
        background-image: url('../img/about/Recurso_1_1.png');
        background-position: right;
        background-size: contain;
        background-repeat: no-repeat;
        top: 60%;
        left: 50%;
        height: 110vw;
        max-height: 33rem;
        width: 100vw;
        max-width: 33rem;
        padding: 9% 9%;
        padding-top: 2%;
        padding-right: 10%;
        transform: translate(-50%, -50%);  
        display: flex;
        align-items: center;
        justify-content: center;   
        flex-direction: column;
    }
    .mensaje img{
        height: 12%;
        width: auto;
    }
    .mensaje p{
        margin-top: 6%;
        font-size: 12px;
        color: #005a7e;
    }
    .mensaje p b{
        font-size: 36px;
        line-height: .1;
    }
    
    /*
    * seccion comunidad
    */
    .comuniadad{
        height: 70vh;
        background-image: url('../img/comunidad/fondo_comunidad.jpg');    
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        position: relative;
    }
    .comuniadad::before{
        content: '';
        position: absolute;
        top: 3%;
        left: 0;
        width: 100%;
        height: 15vh;
        background-image: url('../img/comunidad/comunidad.png');
        background-size: auto 100%;
        background-position: center;
        background-repeat: no-repeat;
    }
    .mensaje_comunidad{
        position: absolute;
        top: 25%;
        left: 35%;
        width: 60vw;
        background-color: white;
        border-radius: 1rem;
        box-shadow: -2px 10px 10px rgba(0, 0, 0, 0.3);
        padding: 5.5%;
    }
    .mensaje_comunidad p{    
        text-align: center;
        margin-top: 7%;
        font-size: 1rem;
        color: #005a7e;
    }
    .mensaje_comunidad img{
        width: 45%;
        height: auto;
    }

    .comunidad_footer{
        height: 30vh;
        background-image: url('../img/comunidad/fondo_2_comuniada.png');    
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        position: relative;
        z-index: -3;
    }

    /* seccion contactos */
    .contactos{    
        padding: 1rem 2rem;
        padding-bottom: 2rem;
        height: auto;
    }
    .contactos::before{
        display: none;
    }
    .contactos_main{
        background-image: none;
    }
    .contactos_main iframe{
        width: 100%;
        height: 70vw;
    }
    .contactos_footer{
        margin-top: 3rem;
        height: auto;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 1rem;
        text-align: center;
        flex-direction: column;
    }
    
}

@media screen and (min-width: 750px) and (orientation: portrait) {
    main{        
        min-height: 55vh;       
    }
    /* seccion contactos */
    .contactos{    
        padding: 2rem 3rem;
        padding-bottom: 2rem;
        height: 80vh;
    }
    .contactos::before{
        height: 10rem;
        background-image: url('../img/contactos/fondo1_1.png');
    }
    .contactos_main{
        background-image: none;
    }
    .contactos_main iframe{
        width: 100%;
    }
}

@media screen and (max-width: 450px) and (orientation: portrait) {
    .productos{
        grid-template-columns: repeat(2, 1fr);
        
    }
    .productos a{
        width: 100%;
    }
}

@media screen and (min-width: 1000px) and (min-height:900px){
    .contactos{    
        padding: 1rem 2rem;
        padding-bottom: 2rem;
        height: 88vh;
    }
}

@media screen and (min-width: 1370px){
    .mensaje{
        height: 36rem;
        width: 36rem;        
    }
}