@font-face {
  font-family: "IBM-DOS";
  src: url("https://files.pressingz.net/fonts/oldskool/woff%20-%20Web%20(webfonts)/Web437_IBM_DOS_ISO9.woff")
  format("woff");
}

@font-face {
  font-family: "04B_03B";
  src: url("https://files.pressingz.net/fonts/dsg4/04b_03b/04B_03B_.TTF") format("truetype");
}

:root {
  --base-colour: #3B5441;
  --text-colour: #83E85A;
  --accent: #2CB978;
  --header: #1f2d22;
  --block: #151e17;

  --border: 1px solid var(--accent);

  --font-family: "IBM-DOS", monospace;
  --font-size: 13pt;

  --header-font: "04B_03B", monospace;
  --header-font-size: 15pt;

  --list-style-type: "> ";

  --wrapper-width: 60%;
}

body {
  background-color: var(--base-colour);
  color: var(--text-colour);
  font-family: var(--font-family);
  font-size: var(--font-size);
}

a {
  color: var(--accent);
}

h1, h2, h3, h4 {
  background-color: var(--header);
  font-family: var(--header-font);
  padding: .5em;
  margin: none;
}

.bodycenter {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  min-height: 100vh;
}

#wrapper {
  width: var(--wrapper-width);
}

.block {
  background-color: var(--block);
  border: var(--border);
  padding: 1em;
}

section {
  margin-bottom: 1em;
}

ul, li {
  list-style-type: var(--list-style-type);
}

