@media (max-width:1600px){
    nav.main-nav {
        flex: 0 1 33%;
      }
}
@media (max-width:1500px){
    html{
        font-size:calc(var(--unit) * 0.7);
    }
    
}

@media (max-height:850px) and (min-width:1200px){
    .tmpl-edition header.active + .banner{
        height:calc(100vh - 40vh - 4rem);
        flex: 1 1 auto;
      }
}

/*MOBILE!*/
@media (max-width:900px){
    html{
        font-size:calc(var(--unit) * 0.8);
    }
    header{

       
        position:fixed;
        z-index:10000;
        top:0;
        padding-bottom:0;
        height:3.5rem;
        
    }
    header.active{
        overflow-y:auto;
    }
    main, .header-content, .header-handler{
        transition: left 0.2s ease-in-out;
    }
    .header.no-tr .header-content, .header.no-tr .header-handler{
        transition:none;
    }


    main{
        left:0px;
        position:relative;
        margin-top:7rem;
        display:block;
    }
    main > section{
        width:100%;
    }
    header, header.no-tr{
        transform:none;
        transition: z-index 0.2s, height 0.1s linear 0.2s;
    }
    header.active{
        z-index:1000;
        height:calc(100% - 3.5rem);
        transition:z-index 0.2s;
    }
    header.active + main{
        
        left:260px;
        
    }
    
    .header-content{
        width:260px;
        height:100%;
        position:relative;
        display:block;
        padding-top:4rem;
        position:relative;
        left:-260px;

    }
    header.active .header-content{
        left:0;
    }
    .header-handler{
        position:absolute;
        top:0;
        width:100%;
        left:0;
    }
    header.active .header-handler{
        left:260px;
    }
    nav.main-nav{
        position:relative;
        z-index:100;
    }
    nav.main-nav ul ul{
        display:block;
        position:relative;
        line-height:var(--size-b);
        font-size:calc(var(--size-b) * var(--flr));
        left:0;
    }
    nav.ui-nav{
        position:absolute;
        top:0.5rem;
        flex-direction:row;
        flex-flow: row-reverse;
        padding-left:0;
        width:calc(100% - 2rem);
        height:100%;
        display:block;
        
    }
    nav.ui-nav ul{
        flex-basis:50%;
    }
    nav.ui-nav ul:last-child{
        justify-content:flex-start;
        
    }

    nav.ui-nav ul.lng{
        text-align:right;
    }
    nav.ui-nav li.socials{
        position:absolute;
        right:0;
        top:7rem;
        z-index:1000;
        margin-top:0;
        width:3rem;
    }
    nav.ui-nav li.dorine{
        position:absolute;
        z-index:1000;
        bottom:2rem;
        margin-top:0;
    }

    nav.years-nav{
        position:fixed;
        bottom:0;
        height:3.5rem;
        line-height:1em;
        padding:0.5rem;
    }

    section.small.banner{
        position:fixed;
        z-index:500;
        font-size: var(--size-c);
        line-height: var(--size-c);
        height:var(--size-c);
    }

    .tmpl-edition header.active + .banner, .tmpl-edition header + .banner{
        height:calc(100vh - 6rem);
        flex:1 0 auto;
        position:absolute;
        top:2.5rem;
    }
    #lightbox img{
        max-width:calc(100vw - 4rem);
    }
    .listing-elems a{
        display:block;
    }
    .listing-elems a > div{
        padding:0;
    }
    main.listing{
        padding-bottom:4rem;
    }
    main.listing ul li{
        display:block;
        
    }
    main.listing ul li a{
        white-space:inherit;
    }

    .main-medias{
        padding:1rem;
    }
    .main-medias div.gallery-item img,   .main-medias div.gallery-item video{
        
        max-height:50vh;
        max-width:calc(100vw - 4rem);
        display:block;
        margin-bottom:0.5rem;
    
      }
}

