/* RESPONSIVE */



/*---------------------------------------------------*/
/*     > 1366 = LARGE                                */
/*---------------------------------------------------*/

@media screen and (min-width: 1367px) {
    
    #logo { width:250px;background-color:#fff; }
    #logo div { background-color:#fff; }
    .case, .case-unit { width:31.33%;border:solid 0px blue;margin:20px 1% 10px 1%; }
    .case.accueil, .case-unit.accueil { width:15%;margin:10px 5%;border:solid 0px red; }
    .case.stricter, .case-unit.stricter { width:23%;margin:20px 1%; }
}


/*---------------------------------------------------*/
/*     ENTRE 1025 et 1366 = LAPTOPS                  */
/*---------------------------------------------------*/
@media screen and (min-width: 1025px) and (max-width: 1366px) {
    #logo { width:230px;background-color:#fff; }
    #logo div { background-color:#fff; }
    #colonne_gauche { width:230px; }
    #grille, #pied, #contenu { left:290px;width:calc(100% - 310px); }
    #menu-hamburger, #menu-close { display:none; }

    #contenu-texte-resp { display:none; }
    #contenu-texte { display:block; }
    #contenu-image { width:60%; }

     .projet-galerie { height: 620px; }
    .projet-galerie-resp { display:none; }

    .case, .case-unit { width:42%;margin:30px 4%;border:solid 0px red; }
    .case img { width:100%;height:auto; }
    .case.accueil, .case-unit.accueil { width:19.33%;margin:10px 7%;border:solid 0px red; }

    .case.stricter, .case-unit.stricter { width:31.33%;margin:20px 1%; }
    .masonrySmall { width:29.33%;margin:20px 2%; }
}


/*---------------------------------------------------*/
/*     IPAD                                          */
/*---------------------------------------------------*/
@media screen and (min-width: 761px) and (max-width: 1024px) {
    
    #colonne_gauche { 
      /*   top:0;left:0;width:100%;height:100px;  */
        display:none;
    }

    

    #menu { display:none; } */

    #logo { width:200px;height:100px;background-color:transparent; }
    #logo div { background-color:transparent; }

    #grille, #contenu { margin-top:170px; }
    #grille, #pied, #contenu { left:40px;width:calc(100% - 70px); }
    #menu-hamburger { display:block; }
    .case, .case-unit { width:46%;margin:10px 2%;border:solid 0px red; }
    .case img { width:100%;height:auto; }
    .case.accueil, .case-unit.accueil { width:21.33%;margin:10px 6%;border:solid 0px red; }

    .case.stricter, .case-unit.stricter { width:48%;margin:20px 1%; }
    .masonrySmall { width:48%;margin:10px 1%; }

    #contenu-texte-resp { display:block; }
    #contenu-texte { display:none; }
    #contenu-image { width:100%;margin-right:0; }

    .projet-galerie { height: 550px; }
    .projet-galerie-resp { display:none; }

}


/*---------------------------------------------------*/
/*     < 760 = SMALL                                 */
/*---------------------------------------------------*/

@media screen and (max-width: 760px) {
    #colonne_gauche { 
        top:0;left:0;width:100%;height:150px; 
         display:none;
    }
    #logo { width:50%;background-position:center center;background-color:transparent; }
    #logo div { background-color:transparent; }
    #menu { display:none; }
    #grille { left:2%;width:96%;margin-top:170px; }
    #contenu { left:2%;width:96%;margin-top:170px; }
    #pied { left:2%;width:96%; }
    #menu-hamburger { display:block; }
    #menu-hamburger, #menu-close { right:5%; }
    .case, .case-unit { width:48%;border:solid 0px blue;margin:20px 1% 10px 1%; }
    .case img, .case-unit img { width:100%;max-width:640px;height:auto; }
    .case.accueil, .case-unit.accueil { width:46%;margin:10px 2%;border:solid 0px red; }
    .case.stricter, .case-unit.stricter { width:98%;margin:20px 1%; }



    #contenu-texte-resp { display:block; }
    #contenu-texte { display:none; }
    #contenu-image { width:100%;margin-right:0; }

    .projet-galerie { display:none; }
    .projet-galerie-resp { display:block; }
    #owl-legend { font-size: 12px; }
    
}