* {
  font-family: sans-serif;
  background-color: hsl(20 23% 92%);
}

mark,
mark > span {
  background-color: hsl(300deg 100% 65% / 50%);
}

caption {
  font-style: italic;
}

nav li {
  list-style: none;
  display: inline-block;
  margin-left: 2em;
}

main {
  margin: 1em;
}

h1 {
  text-align: center;
  color: chartreuse;
  text-shadow:
    0 0 7px hsl(315deg 100% 10%),
    0 0 11px hsl(313deg 100% 30%),
    0 0 15px hsl(311deg 100% 50%),
    0 0 19px hsl(309deg 100% 70%);
}

.cute {
  text-shadow:
    0 0 7px hsl(340deg 100% 30%),
    0 0 11px hsl(338deg 100% 40%),
    0 0 15px hsl(336deg 100% 60%),
    0 0 19px hsl(334deg 100% 70%);
}

header,
footer {
  border-radius: 0.3em;
  border: solid black 1px;
  padding: 0.5em;
}

thead td {
  font-weight: bolder;
}

table td {
  text-align: center;
  background: hsl(30deg 50% 50% / 25%);
  padding: 0.4em 0.8em;
}

footer,
footer div {
  background: black;
}

.footer-date {
  font-family: cursive;
  color: white;
  margin-left: 1.5em;
  text-shadow:
    0 0 7px hsl(315deg 100% 90%),
    0 0 11px hsl(313deg 100% 70%),
    0 0 15px hsl(311deg 100% 50%),
    0 0 19px hsl(309deg 100% 30%);
}

#message {
  resize: none;
}

tr p {
  padding: 1em;
}

tr:nth-child(odd) p {
  background-color: hsl(225deg 50% 90%);
}

tr:nth-child(even) p {
  background-color: hsl(225deg 70% 70%);
  font-family: cursive;
}
