#HamburgerMenu{
    transition-duration: 0.5s;
    width: 60px;
    height: 60px;
    top:3rem;
    right: 2rem;
    position: absolute;
    display: none;
}
#HamburgerMenu .burgericon{
    transition-duration: 0.5s;
    position: absolute;
    height: 8px;
    width: 60px;
    top: 50%;
    background-color: var(--zfzand);
}
#HamburgerMenu .burgericon:before{
    transition-duration: 0.5s;
    position: absolute;
    height: 8px;
    width: 60px;
    top: -20px;
    content: "";
    background-color: var(--zfzand);
}
#HamburgerMenu .burgericon:after{
    transition-duration: 0.5s;
    position: absolute;
    height: 8px;
    width: 60px;
    top: 20px;
    content: "";
    background-color: var(--zfzand);
}

#HamburgerMenu.open .burgericon{
    transition: 0.5s;
}
#HamburgerMenu.open .burgericon:before{
    transform: rotateZ(45deg) scaleX(0.75) translate(20px, -6px);
}
#HamburgerMenu.open .burgericon:after{
    transform: rotateZ(-45deg) scaleX(0.75) translate(20px, 6px);
}
#HamburgerMenu:hover{
    cursor: pointer;
}

#BurgerBlock{
    background-color: var(--zfzand);
    position: absolute;
    right: -300px;
    top: 8rem;
    width: 300px;
    font-size: x-large;
    transition: right 1s ease-in-out;
    overflow: hidden;
    display: none;
}
#BurgerBlock a{
    all: unset;
    cursor: pointer;
    color: var(--zfmagenta)
}
#BurgerBlock.opened{
    right: 0;
}