#navbar-wrapper {
    width: 100%;
    background-color: var(--nav-bg);
    color: var(--nav-fg);
    height: var(--nav-height);
    display: flex;
    align-items: center;
    justify-content: center;

    #navbar {
        height: 100%;
        width: 98%;
        display: flex;
        align-items: center;
        justify-content: space-around;

        #nav-logo {
            height: var(--nav-height);

            a {
                height: 100%;
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: center;

                img {
                    max-width: 100%;
                    max-height: 90%;
                }
            }
        }

        nav {
            flex: 1;
            display: flex;
            justify-content: right;
            gap: 0.6rem;

            a {
                color: var(--nav-fg);
            }

            a.active {
                color: var(--link-fg);
            }
        }
    }
}