@font-face {
    font-family: playlistscript;
    src: url('fonts/playlist_script-webfont.woff2') format('woff2'),
         url('fonts/playlist_script-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'lucida sans unicode';
    src: url('fonts/lucida_sans_unicode_regular-webfont.woff2') format('woff2'),
    url('fonts/lucida_sans_unicode_regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'open sans';
    src: url('fonts/opensans-variablefont_wdthwght-webfont.woff2') format('woff2'),
    url('fonts/opensans-variablefont_wdthwght-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: sailregular;
    src: url('fonts/sail-regular-webfont.woff2') format('woff2'),
    url('fonts/sail-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

.dm-header {
    font-family: playlistscript, serif;
    font-size: 4rem;
    text-align: center;
    color: #5A8491;
    padding-bottom: 1rem;
}

.dm-nav {
    font-size: 1rem;
}

.dm-nav ul {
    width: 100%;
    text-align: center;
    padding: 0;
    margin: 0;
}

.dm-nav li {
    display: inline-block;
}

.dm-nav li a {
    color: rgb(194 55 21) /*rgb(242 136 136) (insufficient contrast) */;
    font-family: 'lucida sans unicode', 'lucida grande', sans-serif;
    display: inline-block;
    padding: 0.3rem 1rem;
    text-decoration: none;
    font-weight: bold;
}

.dm-main {
    font-family: 'open sans', sans-serif;
    color: rgb(65 65 65);
    text-align: center;
}

.dm-main h1 {
    font-weight: normal;
}

.dm-content {
    display: inline-block;
    max-width: 700px;
    text-align: left;
}

.dm-content h1 {
    font-family: sailregular, sans-serif;
    font-size: 4rem;
    text-align: center;
    font-weight: normal;
    margin-top: 0;
}

.dm-main img {
    width: 100%;
    max-width: 954px;
    height: auto;
}

@media (width >= 482px) {
    .dm-gallery img {
        width: 482px;
        height: 482px;
        object-fit: contain;
    }
}

.dm-footer {
    font-family: 'open sans', sans-serif;
    color: rgb(65 65 65);
    font-size: 1rem;
    text-align: center;
    padding: 1rem;
    font-weight: lighter;
}