.black {
  background-color: #000000;
}
.dark-blue {
  background-color: #1d2b53;
}
.dark-purple {
  background-color: #7e2553;
}
.dark-green {
  background-color: #008751;
}
.brown {
  background-color: #ab5236;
}
.dark-gray {
  background-color: #5f574f;
}
.light-gray {
  background-color: #c2c3c7;
}
.white {
  background-color: #fff1e8;
}
.red {
  background-color: #ff004d;
}
.orange {
  background-color: #ffa300;
}
.yellow {
  background-color: #ffec27;
}
.green {
  background-color: #00e436;
}
.blue {
  background-color: #29adff;
}
.indigo {
  background-color: #83769c;
}
.pink {
  background-color: #ff77a8;
}
.peach {
  background-color: #ffccaa;
}
@font-face {
  font-family: pico8;
  src: url("pico-8.woff2") format("woff2"), url("pico-8.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
body {
  line-height: 26px;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}
body, h1 {
  font-family: pico8, monospace;
  font-size: 11px;
}
h1 {
  margin-top: 4em;
}
.palette {
  margin: 2em 0;
}
.palette div {
  padding: 1em;
  color: #000000;
  margin: 0 -1em;
}
.palette div.black {
  color: #5f574f;
}