:root {
  --bg: #fafafa;
  --text: #525252;
  --text-muted: #a3a3a3;
  --text-strong: #171717;
  --link: #0ea5e9;
  --link-hover: #1d4ed8;
  --link-underline: #a3a3a3;
}

body {
  text-align: center;
  font-family: Sans-Serif;
  color: var(--text);
  background-color: var(--bg);
  width: 100vw;
  height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

header {
  font-size: 2em;
  color: var(--text-muted);
}

h1 {
  text-transform: uppercase;
  font-size: 7em;
  padding: 20px;
  color: var(--text-strong);
}

ul li {
  display: inline;
  margin: 0;
  padding: 0 0.5em;
}

a:link,
a:active,
a:visited {
  text-decoration: none;
  border-bottom: 1px solid var(--link-underline);
  color: var(--link);
}

a:hover {
  text-decoration: none;
  border-bottom: none;
  color: var(--link-hover);
}