@font-face {
    font-family: 'CMU Serif Roman';
    font-style: normal;
    font-weight: normal;
    src: local('CMU Serif Roman'), url('cmunrm.woff2') format('woff2');
}

@font-face {
    font-family: 'CMU Serif Italic';
    font-style: normal;
    font-weight: normal;
    src: local('CMU Serif Italic'), url('cmunti.woff2') format('woff2');
}

@font-face {
    font-family: 'CMU Serif Bold';
    font-style: normal;
    font-weight: normal;
    src: local('CMU Serif Bold'), url('cmunbx.woff2') format('woff2');
}
    
@font-face {
    font-family: 'CMU Serif BoldItalic';
    font-style: normal;
    font-weight: normal;
    src: local('CMU Serif BoldItalic'), url('cmunbi.woff2') format('woff2');
}

body {
    font-family: 'CMU Serif', 'Times New Roman', Times, serif;
    background-color: white;
}

#header a {
    color: #00f;
}

hr {
    border-top: 1px solid black;
    border-bottom: 1px solid white;
}

#content, #footer {
    padding: 0 20px;
}

#header {
    padding: 0 20px;
}

#header h1 a {
    color: transparent;
    text-align: center;
    text-decoration: underline;
    font-size: 32px;
    letter-spacing: -2px;
}

.rainbow {
    background: linear-gradient(to right, #6666ff, #0099ff , #00ff00, #ff3399, #6666ff);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: rainbow_animation 6s ease-in-out infinite;
    background-size: 400% 100%;
}

img {
    float: inline-end;
    max-width: 35%;
    padding-inline-start: 10px;
    max-height: 350px;
}

@keyframes rainbow_animation {
    0%,100% {
        background-position: 0 0;
    }

    50% {
        background-position: 100% 0;
    }
}