#menu-bar * {
    height: var(--menu-height);
    font-size: large;
    z-index: 100;
}

#menu-bar ul {
    display: flex;
    justify-content: flex-end;
}

#menu-bar li {
    height: max-content;
    margin: auto 0;
    padding: 0 15px;
    color: lightgray;
    cursor: pointer;
    user-select: none;
}

#menu-bar li a {
    color: inherit;
    text-decoration: inherit;
}

#menu-bar li:hover {
    color: black;
}

#menu-bar .menu-bar-container {
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    justify-content: space-between;
    background-color: white;
}

#menu-bar .active {
    color: black;
}

#menu-bar #menu-logo {
    box-sizing: border-box;
    padding: calc(var(--menu-height) / 10);
    cursor: pointer;
}