body {
  font-family: "Source Serif Pro", serif;
  padding: 1em;
  margin: auto;
  text-rendering: optimizelegibility;
}

a {
  color: #119;
  text-decoration: none;
}

main {
  line-height: 1.5;
  font-size: 120%;
  hyphens: auto;
  text-align: center;
}

#topnav {
  display: block;
  margin: 1em auto;
  font-size: 150%;
  text-align: center;
}

#topnav a {
  display: block;
  text-decoration: none;
  color: #222;
}

footer {
  text-align: center;
  font-size: 80%;
}

hr {
  border-style: solid;
  color: #222;
}

/* project list */

.projects {
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-weight: 700;
  font-size: 300%;
}

.projects a {
  color: inherit;
}

.projects div {
  justify-content: center;
}

/* gallery layout */

.images {
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 1000px;
}

.pic {
  margin: 0.5em;
}

.pic img {
  display: block;
  max-width: 360px;
  max-height: 240px;
  padding: 0;
  margin: 0;
}