header {
    text-align: center;
    height: 5rem;
    background-color: rgba(255, 255, 255, 0.286);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-radius: 0 0 1.5rem 1.5rem;
    position: fixed;
    top: 0;
    width: 24rem;
    border: solid rgba(255, 255, 255, 0.564) 0.1rem;
    border-top: 0;
    box-shadow: 0 0 1rem rgb(255, 255, 255);
    z-index: 50;
    left: 50%;
    transform: translateX(-50%);
}

.logo {
    position: fixed;
    top: 1.3rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 30;
}
.logo img {
    width: 10rem;
    height: auto;
}

.navbar-button {
    width: 3rem;
    height: 3rem;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(64, 81, 230, 0.2);
    border: solid rgb(64, 81, 230);
    border-width: 0.1rem;
    border-radius: 25%;
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    box-shadow: 0 0 0.5rem rgb(64, 81, 230);
    z-index: 30;
}
.navbar-button-img {
    box-sizing: border-box;
    height: 2rem;
    fill: rgb(64, 81, 230);
    stroke: rgb(64, 81, 230);
    width: 100%;
}

#menu-button {
    position: fixed;
    left: 1rem;
    top: 1rem;
}

#account-button {
    position: fixed;
    right: 1rem;
    top: 1rem;
}