.nav-top {
    border-bottom: 1px solid lighten($color-border, 10%);
    padding: .5em;

    h1 {
        margin-top: 3px;

        span {
            padding: 0;
        }
    }

    .dark {
        color: $color-text;
    }

    .small {
        font-size: .655555em;
        font-weight: 500;
    }

    .buttons {
        float: right;
        margin-top: -2.2em;

        button {
            transition: background-color .3s;
        }

        .flat {
            background-color: lighten($color-background, 3%);
            color: $color-primary;

            &:hover {
                background-color: lighten($color-background, 9%);
            }
        }
    }
}


.nav-top {
    border-bottom: 1px solid lighten($color-border, 10%);
    padding: .5em;

    h1 {
        margin-top: 3px;

        span {
            padding: 0;
        }
    }

    .dark {
        color: $color-text;
    }

    .small {
        font-size: .655555em;
        font-weight: 500;
    }

    .buttons {
        float: right;
        margin-top: -2.2em;

        button {
            transition: background-color .3s;
        }

        .flat {
            background-color: lighten($color-background, 10%);
            color: $color-primary;
        }
    }
}


Increase top nav button contrast for a11y
Increase top nav button contrast for a11y

Using https://github.com/Khan/tota11y for a11y recommendations for this
and all future style work.
