@font-face {
  font-family: "Wotfard";
  src: url("font/wotfard-regular-webfont.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
}

:root {
  --font-family: "Wotfard", Futura, -apple-system, sans-serif;
  --font-weight-bold: bold;
}

:root {
  --primary-color: #ffdd57;
  --text-color: #333;
  --text-secondary-color: #999;
}

body {
  font-family: var(--font-family);
  color: var(--text-color);
  padding: 1em 2em;
  font-size: 1.3rem;
  max-width: 28em;
}

header {
  margin-bottom: 2.5em;
}

a,
a:hover,
a:visited {
  color: #000;
  text-decoration: none;
  font-weight: var(--font-weight-bold);
  padding-bottom: 0.1em;
}

a {
  box-shadow: inset 0 -3px var(--primary-color);
  margin-right: 0.5em;
}

a:hover {
  background: var(--primary-color);
}

ul {
  padding-left: 0em;
  padding-right: 1em;
}

p {
  margin: 0.5em 0;
  line-height: 1.3em;
}

li {
  list-style: none;
  margin: 1.8em 0;
}

h5 {
  color: var(--text-secondary-color);
}

.logo {
  color: var(--text-color);
  font-weight: bold;
  font-size: 2em;
  box-shadow: inset 0 -5px var(--primary-color);
  user-select: none;
}