html {
    height: 100%;
}

body {
    height: 100%;
    font-family: "Copperplate Gothic Light", serif !important;
    text-transform: uppercase;
}

#navbar-bar {
    background-color: #a9a9a9;
    /*top: 32px;*/
}

.navbar-item {
    padding: 24px 32px;

    color: black;
    text-decoration: none;
    font-size: 1.5em;

    flex-basis: 200px; /* Arbitrarily large value to ensure centering of links */
}

.navbar-active {
    background-color: #fae232;
}

.navbar-item:hover {
    background-color: #fae232;
    color: black;
}

.navbar-borders-left {
    border-left: 1px solid white;
}

.navbar-borders-right {
    border-right: 1px solid white;
}

#content-container {
    scroll-behavior: smooth;
}

#home {
    min-height: 100%;
    border-bottom: 1px solid black;

    background: url("assets/home.jpg") center no-repeat;
    background-size: cover;
}

#about {
    min-height: 100%;
    border-bottom: 1px solid black;

    color: white;

    background: url("assets/about.jpg") center no-repeat;
    background-size: cover;
}

#projects {
    min-height: 100%;
    border-bottom: 1px solid black;

    color: white;

    background: url("assets/projects.jpg") center no-repeat;
    background-size: cover;
}

#projects-list {
    font-size: 1.6em;
    list-style-type: none;
}

#projects-list > li {
    margin-bottom: 8px;
}

#contact {
    min-height: 100%;

    color: white;

    background: url("assets/contact.jpg") center no-repeat;
    background-size: cover;
}

.contact-mail {
    color: white;
    font-size: 2em;
    text-decoration: none;
}

.contact-mail:hover {
    color: white;
    text-decoration: underline;
}