#menu_button_container{
    position: fixed;
    top: 7.5rem;
    right: .5rem;
    font-size: 1.7rem;
    padding: 2px 7px 2px 7px;
    background-color: #efefef;
    color: #555;
    text-align: center;
    border: none;
    border: 2px solid #f56429;
    z-index: 1;
}

#menu_button_container:hover{
    transform: translate(-3px, -3px);
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
}

.menu_hamb_container{
    position: fixed;
    top: 7.5rem;
    right: .5rem;
    background-color: #f56429;
    text-align: end;
}

#close_menu_button{
    font-size: 1.7rem;
    padding: 2px 7px 2px 7px;
    background-color: transparent;
    color: #efefef;
    text-align: center;
    border: none;
    
}

.menu_hamb{
    background-color: #efefef;
    box-shadow: inset 0px 3px 2px rgba(0, 0, 0, 0.5);
    text-align: start;
}

.menu_hamb ul{
    list-style: none;
}

.menu_hamb li{
    padding: 10px;
}

.menu_hamb li:not(:last-child){
    box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.5);
}

.menu_hamb a{
    text-decoration: none;
    color: #777;
    font-size: 1.3rem;
    font-weight: bold;
}

.open{
    display: block;
    animation: openMenuAnimation .5s;
}

.close{
    display: none;
}

@keyframes openMenuAnimation {
    from{
        right: -123px;
    }

    to{
        right: .5rem;
    }
}

@keyframes closeMenuAnimation {
    from{
        right: .5rem;
    }

    to{
        right: -123px;
    }
}