main,
#content {
    max-width: 70ch;
    display: block;
    margin: 0 auto;
}

main > h1:first-child {
    font-size: 4rem;
    animation: 60s infinite changecolours;
    text-shadow: 2px 2px 0 black;
}

@keyframes changecolours {
    0% {
        color: hsl(197deg 94% 67%);
    }
    8% {
        color: hsl(234deg 90% 85%);
    }
    19% {
        color: hsl(324deg 64% 80%);
    }
    31% {
        color: hsl(3deg 100% 83%);
    }
    44% {
        color: hsl(35deg 100% 72%);
    }
    57% {
        color: hsl(58deg 97% 60%);
    }
    69% {
        color: hsl(17deg 100% 68%);
    }
    80% {
        color: hsl(321deg 84% 62%);
    }
    89% {
        color: hsl(243deg 72% 69%);
    }
    96% {
        color: hsl(207deg 99% 63%);
    }
    100% {
        color: hsl(197deg 94% 67%);
    }
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Monaspace Neon", monospace;
    line-height: 1.2;
}

a,
a:visited {
    color: var(--accent);
}
a:hover {
    color: var(--accent-hover);
}

footer {
    display: flex;
    min-width: 100vw;
    flex-direction: row;
    justify-content: center;
    padding: 1rem 0;
}

ul.extra-sep > li {
    margin-bottom: 1rem;
}

pre {
    overflow-y: auto;
}

tag-list {
    display: block;
    list-style-type: none;
    li {
        display: inline;
        padding: 0.2rem;
        background: var(--text);
        color: var(--bg);
    }
}
