html { font: 19px/1 Inter; background: snow; color: black; }
body { position: relative; max-width: 44rem; margin: 0 auto; padding: 1rem; }
h1 { margin: 1rem 0 1.5rem; font: bold 2rem/1.2 "PT Serif"; }
h2 { margin: 2rem 0 1rem; font: normal 1.7rem/1.2 "PT Serif"; }
p { margin: 1rem 0; line-height: 1.4; }
a { color: blue; }
a[target=_blank]:after { content: "⇗"; display: inline-block; margin-left: 0.25rem; }
label { cursor: pointer; }
nav#site { margin-bottom: 4rem; padding-bottom: 0.5rem; border-bottom: solid 0.3rem linen; text-align: right; }
nav#site a { font-weight: bold; color: black; text-decoration: none; }
nav#site a#logo { float: left; font-family: Acme; font-size: 2rem; }
nav#site a#logo span { display: inline-block; position: relative; top: -0.4rem; }
nav#site a.tab { display: inline-block; position: relative; top: -0.8rem; margin-left: 0.2rem; margin-top: 1rem; padding: 0.4rem; font-size: 0.75rem; background: cornsilk; border: solid 2px wheat; border-radius: 0.2rem; }
main > nav { margin: 2rem 0 0.5rem; line-height: 1.2; }
main > nav a { font-weight: bold; }
footer { display: flex; margin: 4rem 0; }
footer address { flex: 1; font: italic 0.85rem/1.3 Inter; }
footer ul { flex: 1; columns: 2; margin: 0; padding: 0; list-style: none; font: 1rem/1 Inter; }

main#main h1 { margin-top: 2rem; font-size: 3.5rem; text-align: center; font-family: "PT Serif"; }
main#main h2 { text-align: center; font-family: "PT Serif"; }
main#main h2 strong { font-family: Acme; }
main#main p.action { margin: 2rem 0; text-align: center; }
main#main p.action a { display: inline-block; margin-bottom: 1rem; padding: 0.7rem; background: lavender; border: solid 0.15rem blue; border-radius: 0.2rem; font: bold 1.2rem Inter; text-decoration: none; }
main#main p.action small { display: block; margin: 0.4rem 0; font-style: italic; line-height: 1; }
main#main h3, main#platform h2 { margin: 0.75rem 0; font: normal 1.25rem/1.2 Inter; }
main#main h3 a, main#platform h2 a { display: block; padding: 0.5rem; background: cornsilk; border: solid 2px wheat; border-radius: 0.2rem; color: black; text-decoration: none;  }
main#main h3 a:after, main#platform h2 a:after { content: "»"; margin-left: 0.5rem; }

main#platform h1 { margin-bottom: 2rem; }
p.divider { margin: 3rem 0; text-align: center; font-size: 0.8rem; }
p.button { margin: 2rem 0; text-align: right; }
p.button a { display: inline-block; padding: 0.4rem; background: lavender; border: solid 0.15rem blue; border-radius: 0.2rem; font: bold 1rem Inter; text-decoration: none; }

p.timestamp { margin: 0.5rem 0 2rem; font-size: 0.9rem; }
p.pending { margin: 0.5rem 0; padding: 0.5rem; background: linen; border: solid 2px wheat; border-radius: 0.2rem; font-size: 0.85rem; font-style: italic; }
p.pending small { display: inline-block; margin: 0.5rem 0 0; font-size: 0.85rem; }
form#candidates { margin: 2rem 0; padding: 0.5rem 1rem; background: white; border: solid 0.1rem linen; border-radius: 0.2rem; box-shadow: 0.1rem 0.1rem 0.5rem rgba(0,0,0,0.05); }
form#candidates p { margin: 0.3rem 0; font-size: 0.9rem; }
form#candidates input[type=text] { width: 100%; display: block; padding: 0.2rem; margin-bottom: 1rem; box-sizing: border-box; border: solid 1px gray; border-radius: 0.2rem; font: inherit; }
form#candidates select { font: inherit; }
form#candidates button[type=submit] { margin: 2rem 0 0.5rem; font: inherit; cursor: pointer; }

div.table { display: inline-block; max-width: 100%; overflow-x: auto; margin: 2rem auto; border: solid 2px black; border-radius: 0.2rem; }
table { max-width: 100%; margin: 0; }
table thead th { background: linen; border-bottom: solid 2px black; }
table thead th:nth-child(1) { width: 8rem; }
table thead th:nth-child(2) { width: 3rem; }
table thead th:nth-child(2), table tbody td:nth-child(2) { border-right: solid 1px black; }
table thead th:nth-child(3), table tbody td:nth-child(3) { padding-left: 1rem; }
table thead th:not(:nth-child(1)):not(:nth-child(2)) { width: 1.75rem; }
table tbody tr:nth-of-type(even) td, table tbody tr:nth-of-type(even) th { background: whitesmoke; }
table th { padding: 0.3rem; text-align: left; }
table tbody th, table td:nth-child(2) { font-weight: normal; }
table td { padding: 0.3rem; font-weight: bold; }

@media screen and (width <= 29rem) {
  nav#site { text-align: left; }
  nav#site a#logo { float: none; display: block; }
  nav#site a.tab { font-size: 0.7rem; }
  body > nav a { margin: 0; padding: 0.5rem 0.2rem; font-size: 0.7rem; }
  main > nav { margin-top: 0; }
  main#main h1 { margin-top: 1rem; font-size: 2rem; }
  main#main h2 { margin: 1rem 0; font-size: 1.4rem; }
  main#main p.action a { font-size: 1rem; }
  main#main h3, main#platform h2 { font-size: 1.2rem; }
  footer { margin-bottom: 0; }
}
