.logo {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

.nav {
    width: 80vw;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    margin-bottom: 20px;
    height: 10vh;
    line-height: 10vh;
    border-bottom: 1px #da6252 solid;
}

.nav ul {
    list-style: none;
    margin: 0;
}

.nav ul li {
    width: 20%;
    text-align: center;
    float: left;
    text-transform: uppercase;
    letter-spacing: 5px;
}

.nav a:link {
    color: #afafaf;
}

.nav a:active {
    color: #afafaf;
}

.nav a:visited {
    color: #afafaf;
}

.nav a:hover {
    color: black;
    opacity: 0.8;
    text-decoration: none;
}

.active a:link {
    color: #da6252;
    font-weight: 700;
}

.active a:active {
    color: #da6252;
}

.active a:visited {
    color: #da6252;
}

.active a:hover {
    color: #da6252;
    opacity: 0.8;
    text-decoration: none;
}

/* schedule page */
.schedule a:link {
    color: black;
    text-decoration: none;
}

.schedule a:visited {
    color: black;
}

.schedule a:active {
    color: black;
}

.schedule a:hover {
    color: black;
    text-decoration: none;
}

.description-content {
    width: 90vw;
    margin-left: auto;
    margin-right: auto;
}

/* archive page */
.archive-item {
    width: 20vw;
    height: 24vw;
    float: left;
    border: 1px white solid;
}

.archive-item:hover {
    opacity: 0.85;
    cursor: pointer;
}

.archive-item-inner {
    width: 14vw;
    height: 20vw;
    margin-top: 2vw;
    margin-left: auto;
    margin-right: auto;
    color: white !important;
}

/* media page */
.media-div {
    text-align: center;
    padding: 30px;
    opacity: 0.75;
}

.media-div:hover {
    opacity: 1;
    cursor: pointer;
}

.media-icon-container {
    width: 60%;
    height: 30vh;
    margin-left: auto;
    margin-right: auto;
}

.media-icon {
    height: 25vh;
    width: 25vw;
    object-fit: contain;
}

.media-link:link {
    color: black;
    text-decoration: none;
}

.media-link:active {
    color: black;
    text-decoration: none;
}

.media-link:visited {
    color: black;
    text-decoration: none;
}

.media-link:hover {
    color: black;
    text-decoration: none;
}