body {
  font-family: sans-serif;
}

h1, h2, h3, th { /* th is already centred */
  text-align: center;
}

h1 {
  color: red;
  border: 1px; /* setting border must come before style or doesn't show up */
  border-color: black; /* without this, border is red */
  border-style: solid;
  width: 30%;
  padding: 10px;
  margin-left: auto; /* a cheat to centre the element */
  margin-right: auto;
  background: #eee;
}

hr {
  clear: both; /* clears out the floats, starting things on a new line */
}

td {
  padding: .5em;
  background-color: rgba(200, 200, 180, .25);
  border: 1px solid rgb(200, 200, 180);
}

#map-canvas {
  width: 600px;
  height: 400px;
  border: 1px;
  border-style: solid;
  margin: auto;
  margin-bottom: 10px;
  border-radius: 10px;
}

#about, #key {
  background: #eee;
  border: 1px;
  border-radius: 10px;
  border-style: solid;
  margin: auto;
  margin-bottom: 10px;
  padding: 10px;
}

#about {
  width: 50%;
}

#key {
  width: 20%;
  float: right;
}

#about h2, #key h2 {
  color: green;
}

#about h2, #key h2, #key h3 {
  margin-top: 0px;
  margin-bottom: 0px;
}

footer {
  display: block;
  text-align: center;
  color: blue;
