/*
 * MUTESOUVENIR.COM
 * 
 *
 * /lib/css/layout.css  
 * 2020-09-06
 * 
 * web@rtnet.dev
 *
 */


body {
    background              : #000; 
    touch-action            : pan-x pan-y;
    -webkit-touch-callout   : none;
    -webkit-user-select     : none; 
    
}


#pleaserotate-graphic{ fill: #fff; }
#pleaserotate-backdrop { color: #fff; background-color: #000; }

#preload {
    display                 : none;
    visibility              : hidden;
}

#header figure { float: left; }
#header figure img {
    width               : 100%;
    height              : 100%;
}
#header .act { display: block; }
#header .inact { display: none; }


#content { z-index: 0;}
#content .swiper-container { width: calc(var(--vw, 1vw) * 100); }
#content .swiper-slide img { width: calc(var(--vw, 1vw) * 100); } 

#nav {
    z-index                 : 2;
    display                 : none;
    background              : #000;
}




    #header {
        height              : calc(var(--vw, 1vw) * 23.2);
        margin              : 0 calc(var(--vw, 1vw) * 6.8);
        padding             : calc(var(--vw, 1vw) * 3.4) 0;
    }
    #header .menu { width: calc(var(--vw, 1vw) * 15.5); }
    #header .angle {
        width               : calc(var(--vw, 1vw) * 13.3);
        margin-left         : calc(var(--vw, 1vw) * 1.8);
    }    
    #header .title {
        float               : left;
        transform           : translateX(calc(var(--vw, 1vw) * -0.1));
        width               : calc(var(--vw, 1vw) * 55.8);
        height              : calc(var(--vw, 1vw) * 9.9);
        border-bottom       : calc(var(--vw, 1vw) * 2) solid #303030;
    }
    
    #nav {
        height              : calc((var(--vh, 1vh) * 100) - (var(--vw, 1vw) * 30));
        margin              : 0 calc(var(--vw, 1vw) * 6.8);
        text-align          : center;
    }
    #nav ul {
        position            : absolute;
        top                 : 50%;
        width               : calc((var(--vw, 1vw) * 100) - (var(--vw, 1vw) * 13.6));
        transform           : translateY(-50%);
    }
    #nav .logo {
        position            : absolute;
        bottom              : calc(var(--vw, 1vw) * 3.4);
        width               : calc((var(--vw, 1vw) * 100) - (var(--vw, 1vw) * 13.6));
        
    }   
    #nav .logo img {
        width               : calc(var(--vw, 1vw) * 36);
    }   
    






    #content .text { 
        margin              :  0 6.8vw;
    }