@font-face {
  font-family: "gill-sans-nova";
  src: url("assets/gil-sans-nova-ultrabold.woff2") format("woff2");
  font-display: auto;
  font-style: normal;
  font-weight: 900;
  font-stretch: normal;
}
@font-face {
  font-family:"base-mono-wide";
  src: url("assets/base-wide-mono-normal.woff2") format("woff2");
  font-display: auto;
  font-style: normal;
  font-weight: 400;
  font-stretch: normal;
}
:root {
  font-family: "base-mono-wide", monospace;
  font-weight: 400;
  font-style: normal;
  font-size: 2rem;
  color: hsl(0 0% 90%);
  background-color: hsl(0 0% 0%);
}
body {
  margin: 0;
}
#container {
  width: 9rem;
  overflow: hidden;
  margin: 2rem auto;
}
h1, h2, h3 {
  margin: 0;
  cursor: default;
  font-family: "gill-sans-nova", sans-serif;
  font-weight: 900;
  font-style: normal;
}
h1 {
  font-size: 1.4rem;
}
pre {
  font-family: inherit;
  margin: 0;
}
a {
  color: rgb(255 159 10);
  text-decoration: none;
}
hr {
  background-color: hsl(0 0% 40%);
  height: 2px;
  border: 0;
}
img {
  width: 100%;
}
a:hover,
a:active {
  color: hsl(0 0% 100%);
  text-decoration: underline;
}
#info,
#course,
#bbq,
#cta,
#ascii-skateboarder {
  margin: 4rem auto;
}
#info {
  margin-top: 0;
}
#course .ascii-wheels {
  color: rgb(255 159 10);
}
#course .lake {
  color: rgb(10 132 255);
  color: rgb(48 176 199);
  background-color: hsl(210 100% 10%);
}
#guide {
  color: hsl(0 0% 60%);
}
#bbq h3 {
  font-size: inherit;
}
#cta {
  font-size: 0.8rem;
  color: rgb(255 159 10);
}
#ascii-skateboarder {
  font-size: 0.4rem;
  font-weight: bold;
  color: hsl(0 0% 60%);
}
#disclaimer,
#colophon {
  color: hsl(0 0% 40%);
}

#colophon {
  margin-top: 5rem;
}
