#sidebar #open-sidebar {
    position: absolute;
    left: 100%;
    background-color: var(--black-dark);
    cursor: pointer;
    top: 0;
    display: none;
    z-index: var(--z-index-sidebar);
    visibility: visible;
    border: var(--border-global);
    border-top: none;
    border-left: none;
    transition: var(--transition-2);
    width: var(--size-button-open-sidebar);
    height: var(--size-button-open-sidebar);
}

#sidebar #open-sidebar:hover {
    background-color: var(--black);
}

#sidebar #open-sidebar .hamburger {
    display: flex;
    justify-content: center;
    align-items: center;
}

#sidebar #open-sidebar .hamburger {
    position: relative;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
}

#sidebar #open-sidebar .hamburger div {
    transition: var(--transition-4);
    position: absolute;
    width: 24px;
    height: 2px;
    background-color: var(--white);
    border-radius: 2px;
}

#sidebar #open-sidebar .hamburger .top-salad {
    top: 25%;
}
#sidebar #open-sidebar .hamburger .low-salad {
    bottom: 25%;
}

#sidebar.open #open-sidebar .hamburger .mid-salad {
    opacity: 0;
}
#sidebar.open #open-sidebar .hamburger .top-salad {
    transform: rotate(-45deg);
    top: calc(50% - 1px);
}
#sidebar.open #open-sidebar .hamburger .low-salad {
    transform: rotate(45deg);
    bottom: calc(50% - 1px);
}


@media screen and (max-width: 767px) {
    #sidebar #open-sidebar {
        display: block;
    }
}