.navbar {
    text-align: center;
    background-color: var(--secondary-color);
    border-bottom: solid 2px var(--accent-color);
    font-size: var(--navigation-font-size);
}

.nav-item:hover {
    transition: background-color 0.2s ease-in;
    background-color: var(--accent-color);
}

[class*="nav-item"] {
    min-height: var(--navigation-height);
    max-height: var(--navigation-height);
    height: var(--navigation-height);
    line-height: var(--navigation-height);
}

a:has([class*="nav-item"]) {
    color: var(--text-color)
}