%overlay{
    width: 100%;
    height: 100%;
    display: block;
    position: fixed;
    background: rgba(255, 255, 255, 0.5);
    z-index: -9;
    opacity: 0;
    animation-name: display-none-out-transition;
    animation-duration: 0.2s;
    animation-timing-function: ease-in;
    animation-delay: 0.4s;
    animation-fill-mode: backwards;

    &.open{
        //z-index: 9;
        //opacity: 1;
        animation-name: display-none-in-transition;
        animation-duration: 0.2s;
        animation-timing-function: ease-out;
        animation-delay: 0s;
        animation-fill-mode: forwards;
    }
}
