#navbar {
    background-color: #050505e9;
    box-shadow: 0px 1px 8px 1px #000000;
    color: white;
    font-size: clamp(24px, 2vw, 32px);
    display: flex;
    height: 60px;
    padding: 12px;
    padding-left: 8px;
    position: fixed;
    width: 100%;
    z-index: 100;
}

#nav-left {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: clamp(8px, 4vw, 16px);
}
#nav-left #logo-icon {
    color: rgb(219, 219, 219);
    font-size: clamp(36px, 8vw, 48px);
    padding-bottom: 0px;
}
#nav-left #logo-icon:hover {
    color: rgb(83, 87, 111);
    cursor: pointer;
}

#nav-middle {
    margin: auto;
}

#nav-right {
    padding-right: clamp(16px, 4vw, 36px);
    padding-bottom: 6px;
}
#nav-right ul {
    list-style-type: none;
}
#nav-right ul li {
    float: left;
    margin: 12px;
}
#nav-right ul li a {
    color: rgb(214, 214, 214);
    font-size: clamp(32px, 2vw, 36px);
}
#nav-right ul li a:hover {
    color: rgb(89, 91, 120);
    cursor: pointer;
    transition: 120ms;
}