/* este ancho va a tener un maximo de 600px hasta que se desactive */
/* version mobile */


@media screen and (min-width: 645px ) {

    .images-pomelo-header-big{
    
        background-image: url("./imagesALLPAGE/imageHeader.jpg");
        height: 81vh;
        background-repeat: no-repeat;
        background-size: 85rem;
        background-position: bottom;

    } 
    .peaple-resp-desing{

        grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    }
    .hamburger{
         display: none !important;
     }
     .article-header-Tran-your-brand{
         display: grid;
         grid-template-columns: repeat(2, 50%) ;
         grid-template-rows: 100%;
         width: 100%;
     }
     .article-header-Tran-your-brand .images{
         order: 2;
     }
     .article-header-Tran-your-brand > article{
         order: 1;
     }
    
     .article-header-Tran-your-brand2{
         display: grid;
         grid-template-columns:  repeat(2, 50%) ;
     }
     .fotter-img-article{
         width: 100%;
         height: auto;
         grid-template-columns: repeat(4, 25%);
         grid-template-rows: 30%;
         
        }
        .grid-responsive-grapgicAndPhoto{
            display: grid;
            grid-template-columns: repeat(2, 50%) ;
            width: 100%;
            
        }
        
        .article-fotter:last-child div {
            display: flex;
            text-align: center;
            justify-content: space-evenly;
        }
        .apps-menu__style svg{
            display: flex;
            flex-direction: column;
            justify-content: space-evenly;
        
        }
        
        .client-tes-desk{
            text-align: center;
            background-color: var(--background-colorwhite);
        }
        .client-tes-mobile{
            display: none;
        }
        .peaple-resp-desing{
            grid-template-columns: repeat(3, 33%);
            grid-template-rows: 100%;
        }
        .graphic-des{
            background-image: url("./imagesALLPAGE/image-graphic-design.jpg");
            background-size: cover;
            background-repeat: no-repeat;
            background-position:top ;
            height: 73vh;
        }
        .graphic-des-2{
            background-image: url("./imagesALLPAGE/image-photography.jpg");
            background-size: cover;
            background-repeat: no-repeat;
            background-position:top ;
            height: 73vh;
        }
        
    }
    /* si se achica mas de este ancho, se desactivan estos valores */
    
    
    
    
    
    
    
    @media screen and (max-width:645px ) {
        
       
        
        .graphic-des-2{
        background-image: url("./imagesALLPAGE/image-photography.jpg");
        background-size: cover;
        background-repeat: no-repeat;
        background-position:top ;
        height: 73vh;
    }

    .graphic-des{
        background-image: url("./imagesALLPAGE/image-graphic-design.jpg");
        background-size: cover;
        background-repeat: no-repeat;
        background-position:top ;
        height: 73vh;
    }
    

    .images-pomelo-header-big{
    
        background-image: url("./imagesALLPAGE/imageHeader.jpg");
        height: 49vh;
        background-repeat: no-repeat;
        background-size: 180%;
        background-position: bottom;

    } 
    .nav-styles{
        display: none;
    }
    .nav-styles-mobile{
        display: flex ;
        width: 100%;
        margin: 2rem auto;
        
    }
    .title-header-desk{
        display: none;
    }
    .title-header-mobile{
        margin: 5rem auto ;
        font-size: 8vw;
        font-family: 'Fraunces', serif;
        display: flex;
        justify-content: center;
        text-align: center;
        font-weight: 700;
        color:var(--general-colorTextwhite);
        letter-spacing: .3rem;
    }
    
    .client-tes-desk{
        display: none;
    }
    
    
    
    
    .fotter-img-article{
        grid-template-columns: repeat(2, 50%);
        grid-template-rows: repeat(2, 50%);
        
    }
   
    .title-transfor__style{
        font-size: 2rem;
    }
    .title-sunnyside-style{
    font-size: 1.4rem !important;
    
}
    .group-options .item{
        display: none;
    }

   
    .images2{
        display: none !important;
        
    } 
    .images2{
        display:inline-flex !important;
        object-fit:cover;
        
        background-size:cover ;
        background-position: top;
        background-repeat: no-repeat;
        height:36rem;
        
    } 
    
  
    
    
   
}