#menuDrawer {
    position:fixed;
    color: #fff;
    background: var(--color-green);
    top: var(--header-height);
    left: var(--space-out);
    right: var(--space-out);
    bottom: 2rem;
}
#menuDrawerScroll {
    padding: calc(var(--space-out) / 2) var(--space-out);
    overflow-y:auto;
    height:100%;
    display:flex;
    align-items:center;
}

.mod-menu {
    font-size: calc(var(--font-size) * 1.2);
    display:grid;
    grid: repeat(20, auto) / 1fr 1fr;
}
.mod-menu .small {
    font-size:inherit;
}


.mod-menu .parent,
.mod-menu .item-117 {
    margin:0 0 2rem;
}
.mod-menu__heading,
.mod-menu .parent > a,
.mod-menu .parent > span,
.mod-menu .item-117 > a {
    line-height: calc(1.6rem * 1.2);
    font-family: var(--font2);
    text-transform: uppercase;
    margin-bottom:1.5rem;
}
.mod-menu__sub a {
    max-width: 18em;
}
.mod-menu li > a,
.mod-menu li > span {
    display:inline-flex;
    padding: .3rem 0;
    margin: 0 0 .3rem;
    line-height:1.5em;
    flex-wrap: wrap;
}

.mod-menu .item-109 {
    grid-column: 1;
    grid-row: 1 / 18;
}
.mod-menu .item-115 {
    grid-column: 1;
    grid-row: 19;
}
.mod-menu .item-115 > a::after {
    content: ' - ' attr(title);
    font-family: var(--font1);
    text-transform: none;
    margin-left:.5em;
    display:inline-block;
}
.mod-menu .item-117 {
    grid-column: 1;
    grid-row: 20;
}

.mod-menu .item-118 > a {
    position:relative;
    font-size: 1.6rem;
    line-height:1.2em;
    margin-bottom: 1.5rem;
}
.mod-menu .item-118 > a::before {
    content:'';
    position:absolute;
    right: 100%;
    top:.2em;
    width:1.5em;
    height:1em;
    background: url(../images/bullet.svg);
    background-size: contain;
    background-repeat: no-repeat;
}
.mod-menu .item-107 > a {
    font-size: 1.6rem;
    line-height:1.2em;
}

/*************** TOP MENU OVERRIDES **********************/
#menuDrawer .mod-menu  {width: 100%;font-size:1rem;}

#menuDrawer .mod-menu .parent > a, 
#menuDrawer .mod-menu .parent > span, 
#menuDrawer .mod-menu .item-117 > a {margin-bottom:0;}
#menuDrawer .mod-menu li > a, 
#menuDrawer .mod-menu li > span {margin-bottom:0;}

#menuDrawer .menuEsperluette {position:absolute;bottom:-4%;right:-11%;width:60%;pointer-events: none;
    fill: #446461;filter: drop-shadow(0 0 1.5rem rgba(0,0,0,.3));}




@media screen and (max-width: 1200px) {
    .mod-menu {grid: repeat(20, auto) / 2fr 1fr;}
    #menuDrawer .menuEsperluette {right:-19%;}
}
@media screen and (max-width: 900px) {
    .mod-menu .item-115 > a::after {
        content: attr(title);
        margin-left: 0;
        display: block;
        width: 100%;
        line-height: 1em;
        font-style: italic;
    }
}

@media screen and (max-width: 770px) {
    .mod-menu {display: block;}
    .mod-menu .item-118 > a {margin-left:1.5em;}
    #menuDrawer {bottom: 0;}
    #menuDrawer .menuEsperluette {display:none;}
}

@media screen and (max-height: 850px) {
    #menuDrawerScroll {align-items:flex-start;}
    
}