body
{
  font-family: trebuchet ms;
  background-color: #e9c2ff;
  text-align: center;
}

h1, h2, h3
{
  font-family: courier new;
}

.intro
{
  background-color: rgba(255, 255, 255, 0.5);
}

hr
{
    border-top: 5px dashed;
}

table, th, td
{
  padding: 5%;
  margin-left: auto;
  margin-right: auto;
  border: 1px solid;
  border-collapse: collapse; /* Makes all the overlapping borders combine into one */
}

th
{
  background-color: rgba(0, 0, 0, 0.2);
}

li
{
  text-align: left;
}

#title
{
  text-decoration: underline;
  text-decoration-style: wavy;
  text-decoration-color: purple;
}

#title:hover, h2:hover, h3:hover
{
  /* from https://cssgradient.io/blog/css-gradient-text/ */
  background: -webkit-linear-gradient(#c582ff, #b058fc, #7618c7, #390169);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.content, .media
{
  padding: 2.5%;
  left: 0;
  display: flex;
  background-color: rgb(0, 0, 0, 0.1);
}

.biography, .funfacts
{
  width: 30%;
  margin: 5%;
}

#frustrated
{
  height: 500px;
  width: auto;
  margin-top: 5%;
}

.media
{
  justify-content: space-around;
}

.media span
{
  width: 25%;
  font-size: 20px;
}
