@font-face {
    font-family: "Almendra Display";
    src: local("Almendra Display"),
        url("Almendra Display-Regular.ttf") format("truetype");
}
body {
    min-width: 20em;
    max-width: 50em;
    margin-left: auto;
    margin-right: auto;
    background-color: #666;
    color: #eee;
}
em {
    font-style: italic;
    color: #fff;
}
.title {
    font-family: "Almendra Display", Georgia, serif;
    color: #a9ba9d; /* Laurel Green */
}
h1, h2, h3, h4 {
    font-family: "Almendra Display", Georgia, serif;
    color: antiquewhite;
}
h4 {
    display: inline;
    margin-right: 1em;
    font-size: 1.5em;
}

/* Navigation */
#nav {
    font-family: sans-serif;
}
#nav ul li {
    list-style: none;
    display: inline;
}
#nav li + li::before {
    content: "⸱⸱⸱ ";
}

/* Links */
a:any-link {
    color: #ccc;
    text-decoration: none;
}
a:hover {
    color: goldenrod;
}
/* Style external links differently */
a[href*="//"]:not([href*="aon.ink"]):hover {
    color: cadetblue;
}
a[href^="#"]:not(#nav ul li a) {
    font-size: 0.8em;
    font-family: sans-serif;
}

/* Lists */
li {
    line-height: 1.5;
}
#todo ul li {
    list-style: none;
}
#todo ul li::before {
    content: "☐ ";
}
#todo ul li.done::before {
    content: "☑ ";
}
dt + dd::before, dd + dd::before {
    content: "| ";
}