@media only screen and (max-width: 767px) {
    #menu-calque-body {
        visibility: hidden;
        width: 100%;
        height: calc(100% - 64px);
        background-color: #ECECEC;
        position: fixed;
        z-index: 1000;
        padding: 0.30em !important;
        overflow: auto;
        -webkit-transform: translateX(-580px);
        transform: translateX(-580px);
        -webkit-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
    }
    #menu-calque-body ul {
        margin-top: 0;
    }
    #menu-calque-body ul li {
        display: block;
        height: 60px;
        padding: 20px 0.5em 23px;
        border-bottom: 1px solid white;
    }
    /*#menu-calque-background {*/
        /*width: 100vw;*/
        /*position: fixed;*/
        /*background-color: #000000;*/
        /*opacity: 0.7;*/
    /*}*/
    .menu-calque-element {
        font-family: 'LatoBold', Arial, Helvetica, sans-serif;
        font-size: 13px;
        letter-spacing: 0.25px;
        text-transform: uppercase;
    }
    #menu-calque-body a:focus, a.active,
    #menu-calque-body .menuDeconnexion a {
        color: #0C2B77;
    }
    #menu-calque-body a {
        text-decoration: none;
    }
    #menu-calque-body .menuDeconnexion {
        padding: 20px 0.5em 23px;
    }
    #menu-calque-body .menuDeconnexion a {
        display: flex;
        align-items: center;
    }
    #menu-calque-body .menuDeconnexion a [class^='icon-'] {
        margin-right: 1rem;
    }
    #menu-calque-body .menuDeconnexion a span {
        text-decoration: underline;
        font-weight: bold;
    }
    #menu-calque-background {
        position: absolute;
        height: 100vh;
        background-color: rgba(0,0,0,.6);
        -webkit-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
    }
}