html {
    color: #112D4E;
    background-image: url("data:image/svg+xml,%3Csvg width='100' height='20' viewBox='0 0 100 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.184 20c.357-.13.72-.264 1.088-.402l1.768-.661C33.64 15.347 39.647 14 50 14c10.271 0 15.362 1.222 24.629 4.928.955.383 1.869.74 2.75 1.072h6.225c-2.51-.73-5.139-1.691-8.233-2.928C65.888 13.278 60.562 12 50 12c-10.626 0-16.855 1.397-26.66 5.063l-1.767.662c-2.475.923-4.66 1.674-6.724 2.275h6.335zm0-20C13.258 2.892 8.077 4 0 4V2c5.744 0 9.951-.574 14.85-2h6.334zM77.38 0C85.239 2.966 90.502 4 100 4V2c-6.842 0-11.386-.542-16.396-2h-6.225zM0 14c8.44 0 13.718-1.21 22.272-4.402l1.768-.661C33.64 5.347 39.647 4 50 4c10.271 0 15.362 1.222 24.629 4.928C84.112 12.722 89.438 14 100 14v-2c-10.271 0-15.362-1.222-24.629-4.928C65.888 3.278 60.562 2 50 2 39.374 2 33.145 3.397 23.34 7.063l-1.767.662C13.223 10.84 8.163 12 0 12v2z' fill='%23dbe2ef' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");
    background-color: #F9F7F7;
    font-family: 'Courier New', Courier, monospace;
}

body {
    margin: 30px auto;
    max-width: 84ch; /* padding of 2ch at left and right, 80ch actually used */
    padding-left: 10px;
    padding-right: 10px;
    position: relative;
}

body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: inset 0 0 100px rgba(0,0,0,0.1);
    pointer-events: none;
}

a {
    color: #3F72AF;
    background-color: #F9F7F7;
    text-decoration: none;
}

a:hover {
    background-color: #DBE2EF;
}

h2, h3 {
    border-bottom: 1px solid #112D4E;
}

pre {
	  padding: 1ch;
	  background-color: #F9F7F7;
}

/* Header-related rules. */

header ul {
    list-style-type: none;

    display: flex;

    margin: 0;
    padding: 0;
    justify-content: space-evenly;
}

header li:first-child {
    font-weight: bold;
}

header li:not(:first-child) {
    margin-left: 1ch;
}

/* Page body-related rules. */

main {
    background-color: #F9F7F7;
    border-radius: 3px;
    
    padding: 2ch;
    margin-top: 50px;
    margin-bottom: 50px;
}

main h1:first-child, main h2:first-child {
    margin-top: 0;
}

h1 {
    text-align: center;
}

#content-info {
    text-align: center;

    font-size: small;
    font-style: italic;
}

main article {
    /*! margin-top: 3ch; */
    /*! margin-bottom: 3ch; */
}

main table {
  margin: 10px auto;
  border-top: 1px solid #3a3a3a;
  border-bottom: 1px solid #3a3a3a;
}

main th,td {
  padding: 0.4em;
}

/* Footer-related rules. */

footer p {
    margin: 1ch;

    text-align: center;

    font-size: small;
    font-style: italic;
}