@charset "UTF-8";

#hamburger-menu input {
    display: block;
    width: 40px;
    height: 32px;
    position: absolute;
    top: -3px;
    cursor: pointer;
    opacity: 0;
    z-index: 140;
    -webkit-touch-callout: none;
}

@media (max-width: 1000px) {

    header a:link,
    header a:visited {
        color: #FFFFFF;
    }

    header a:focus,
    header a:hover,
    header a:active {
        color: #362E3F;
    }

    #hamburger-menu {
        display: block;
        position: absolute;
        z-index: 120;
        top: 20px;
        right: 25px;
        -webkit-user-select: none;
        user-select: none;
    }

    #hamburger-menu #menu {
        position: fixed;
        z-index: 120;
        height: 100vh;
        width: 15em;
        right: 0;
        top: 0;
        padding-top: 60px;
        text-align: right;
        background: #998CA6;
        list-style-type: none;
        transform-origin: 0 0;
        transform: translate(100%, 0);
        transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
    }

    header nav ul {
        right: 0;
    }

    #hamburger-menu .nav li {
        margin: 0;
        padding-top: 20px;
        padding-right: 25px;
        float: none;
        font-size: 1em;
    }

    #hamburger-menu input:checked ~ #menu {
        transform: none;
    }

    #hamburger-menu .burger-icon-1:after {
        content: '';
        height: 2px;
        width: 40px;
        display: block;
        background: #DA2125;
        position: relative;
        top: 0;
        left: 0;
        transition: 0.3s ease-in-out;
        z-index: 110;
    }

    #hamburger-menu .burger-icon-2:after {
        content: '';
        height: 2px;
        width: 40px;
        display: block;
        background: #DA2125;
        position: relative;
        top: 10px;
        left: 0;
        transition: 0.3s ease-in-out;
        z-index: 110;
    }

    #hamburger-menu .burger-icon-3:after {
        content: '';
        height: 2px;
        width: 40px;
        display: block;
        background: #DA2125;
        position: relative;
        top: 20px;
        left: 0;
        transition: 0.3s ease-in-out;
        z-index: 110;
    }

    #hamburger-menu input:hover ~ .burger-icon-1:after,
    #hamburger-menu input:hover ~ .burger-icon-2:after,
    #hamburger-menu input:hover ~ .burger-icon-3:after {
        background: #362E3F;
    }

    #hamburger-menu .burger-icon-close-1:after {
        content: '';
        height: 3px;
        width: 40px;
        display: block;
        background: #FFFFFF;
        position: relative;
        top: -27px;
        left: 175px;
        transform: rotate(-45deg);
        transition: 0.3s ease-in-out;
        z-index: 130;
    }

    #hamburger-menu .burger-icon-close-2:after {
        content: '';
        height: 3px;
        width: 40px;
        display: block;
        background: #FFFFFF;
        position: relative;
        top: -30px;
        left: 175px;
        transform: rotate(45deg);
        transition: 0.3s ease-in-out;
        z-index: 130;
    }

    #hamburger-menu input:hover ~ #menu .burger-icon-close-1:after,
    #hamburger-menu input:hover ~ #menu .burger-icon-close-2:after {
        background: #362E3F;
    }

}
