/* pitagon-sans-mono-latin-400-normal */
@font-face {
  font-family: 'Pitagon Sans Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(https://cdn.jsdelivr.net/fontsource/fonts/pitagon-sans-mono@latest/latin-400-normal.woff2) format('woff2'), url(https://cdn.jsdelivr.net/fontsource/fonts/pitagon-sans-mono@latest/latin-400-normal.woff) format('woff');
}

/* pitagon-sans-mono-latin-700-normal */
@font-face {
  font-family: 'Pitagon Sans Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(https://cdn.jsdelivr.net/fontsource/fonts/pitagon-sans-mono@latest/latin-700-normal.woff2) format('woff2'), url(https://cdn.jsdelivr.net/fontsource/fonts/pitagon-sans-mono@latest/latin-700-normal.woff) format('woff');
}

/* pitagon-sans-mono-latin-400-italic */
@font-face {
  font-family: 'Pitagon Sans Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 400;
  src: url(https://cdn.jsdelivr.net/fontsource/fonts/pitagon-sans-mono@latest/latin-400-italic.woff2) format('woff2'), url(https://cdn.jsdelivr.net/fontsource/fonts/pitagon-sans-mono@latest/latin-400-italic.woff) format('woff');
}

/* pitagon-sans-mono-latin-700-italic */
@font-face {
  font-family: 'Pitagon Sans Mono';
  font-style: italic;
  font-display: swap;
  font-weight: 700;
  src: url(https://cdn.jsdelivr.net/fontsource/fonts/pitagon-sans-mono@latest/latin-700-italic.woff2) format('woff2'), url(https://cdn.jsdelivr.net/fontsource/fonts/pitagon-sans-mono@latest/latin-700-italic.woff) format('woff');
}

:root { 
  --offwhite: #fbfbe8;
  --darkgreen: #373a38;
  --lightgreen: #b8e4af;
  --green: #126322;
}

html, 
body {
  width: 100%;
  margin: 0;
  padding: 0;
  background: var(--offwhite);
  font-family: 'Pitagon Sans Mono', monospace;
  color: var(--darkgreen);
}


a {
  text-decoration: none;
  color: var(--green);
}

a:hover {
  text-decoration: none;
  text-shadow: 0px 0px 1px #c0d3e5;
  color: var(--lightgreen);
}

.container {
  margin: 50px auto;
  padding: 5px;
  max-width: 400px;
}

.blurb  {
  margin: 50px auto;
  padding: 5px;
  max-width: 650px;
}

.links {
  display: block;
  text-align: center;
  margin: 50px 0;
  padding: 0 0 10px 0;
  border-bottom: 1px solid gray;
}

.footer {
  margin: 10px auto;
  bottom: 10%;
  padding:  5px;
  max-width: 400px;
  text-align: center;
  border-top: 1px solid gray;
}

.footer span:not(:last-child), a:not(:last-child) {
  padding:  0 16px 0 0;
}

.links span:not(:last-child), a:not(:last-child) {
  padding:  0 16px 0 0;
}

.container-404 {
  margin: 50px auto;
  padding: 5px;
  max-width: 400px;
  text-align: center;
}

span#blog { 
  text-decoration: line-through;
}