.menu .title {
    // Need to force inheritence, otherwise <a> would require
    // overrides for all color states from base styling for element.
    color: inherit;
    text-decoration: inherit;

    font-family: var(--font-family-generic);
    font-weight: bold;
    white-space: nowrap;
    margin: inherit;
    // padding: 0 var(--spacing-small);
    transition: var(--transition-fade);
    display: block;
}

@media (max-width: 600px) {
    .nav_title {
        padding: var(--padding-mobile);
    }
}

@media (min-width: 1024px) {
    .menu .title:hover {
        color: var(--highlight-hover);
        transition: var(--transition-cut);
    }
}