styles.css

body {
	/* font-family: "Times New Roman"; */
    font-family: 'IBM Plex Mono', monospace;
    /* font-family: 'Space Mono', "Times New Roman"; */
	font-size: 32px;
	font-weight: 400;
	color: black;
	line-height: 145%;
    padding: 31px;
    padding-top: 0px;
}
a.content:link {
	color: MediumBlue;
	text-decoration: none;
}
a.content:visited {
	color: MediumBlue;
	text-decoration: none;
}
a.content:hover {
  	color: DarkBlue;
	border-bottom: 1px solid DarkBlue;
}
a.content:active {
  	color: black;
	text-decoration: none;
}
a::selection {
  background-color: chartreuse;
}
p::selection {
  background-color: chartreuse;
}
img::selection {
  background-color: violet;
}
#back-to-start:hover {
  font-family: 'Press Start 2P', cursive;
  font-size: 24px;
}
/* To change text on hover: */
      /* #back-to-start:hover span {
        display: none;
      }
      #back-to-start:hover:before {
        content: "to start"
      } */
#content {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, -50%)
}
figcaption {
  font-family: "Times New Roman";
	font-size: 20px;
	font-weight: normal;
	color: black;
	line-height: 150%;
}

/* ordered lists */
ol {
  word-break: break-all;
  margin: 0;
  padding: 0;
}
ol ol {
    margin-left: 2em;
}
li {
  list-style-position: inside;
  padding: 0;
}
li::before {
  content: "";
  width: 20px;
  display: inline-block;
}


/* Three image containers (use 25% for four, and 50% for two, etc) */
.column {
  float: left;
  width: 50%;
  padding: 5px;
}

/* Clear floats after image containers */
.row::after {
  content: "";
  clear: both;
  display: table;
}

.row {
  display: flex;
}

.column {
  flex: 50%;
  padding: 5px;
}

#coming-soon {
  cursor: default;
  color: grey;
  text-decoration: none;
}

a#coming-soon:hover {
  text-decoration: none;
    /* color: grey; */
}