:root {
    color-scheme: light dark;
    --light-bg-color1: #9ac0ff;
    --light-bg-color2: #d0e0f0;
    --dark-bg-color1: #333333;
    --dark-bg-color2: #0a0a22;
}

html,
head,
body {
    margin: 0;
    padding: 0;
    height: 100%;
    background-color: var(--light-bg-color1);
    background-image: linear-gradient(135deg, light-dark(var(--light-bg-color1), var(--dark-bg-color1)) 20%, light-dark(var(--light-bg-color2), var(--dark-bg-color2)));
    background-repeat: no-repeat;
    background-attachment: fixed;
}

header {
    background-color: rgba(128, 128, 128, .3);
    padding: .5rem 0;
}

nav {
    padding: 1rem 0;
    text-align: center;
    font-size: 1.25rem;
}
nav a {
    text-decoration: none;
}
nav a:hover {
    text-decoration: underline;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
    font-family: Georgia, 'Times New Roman', Times, serif;
}

nav, p, ol, ul, li {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}

.page-content {
    padding: 1rem 1.5rem;
    margin: 0 auto;
    max-width: 64rem;
}

object {
    display: block;
    width: 100%;
    height: 90vh;
}