/* app.public.nav.css */
:root {
    --border-default:1px solid #ddd;
    --nav-bg: #fff;
    --nav-fg: #888;
    --topbar-title-bg: #c70000;
    --topbar-title-fg: #fff;
}

.topbar {
    background-color: var(--topbar-bg);
    border-bottom: var(--border-default);
    color: var(--topbar-fg);
    font-size: 20px;
    font-weight: 500;
    justify-content: space-between;
    left:0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 1030;
}

.topbar-title {
    background-color: var(--topbar-title-bg);
    color: var(--topbar-title-fg);
    padding: 6px 24px;
}

.topbar-title a {
    color: var(--topbar-fg);
    letter-spacing: 2px;
    text-decoration: none;
}

.navbar {
    padding:0.125rem 1rem;
}

.navbar .nav-link {
    color: var(--nav-fg);
    font-size: 1.25rem;
    font-variant: all-small-caps;
    letter-spacing: 2px;
    padding: 0;
    margin-right: 18px;
    text-decoration: none;
}

.navbar-toggler {
    border-radius: 4px;
    border-width: 2px;
    padding: 0 6px;
}

.navbar-toggler:focus {
    box-shadow: none;
    background-color: #f3f3f3;
}

.navbar-toggler span {
    color: var(--nav-fg);
    font-size: 32px;
}