body
{
  background-image: linear-gradient(
    23deg,
    hsl(49deg 100% 69%) 0%,
    hsl(16deg 80% 61%) 20%,
    hsl(330deg 81% 34%) 42%,
    hsl(259deg 100% 15%) 60%,
    hsl(212deg 100% 25%) 75%,
    hsl(197deg 100% 30%) 90%,
    hsl(183deg 79% 36%) 100%
  );
  height: 100vh;
}

a
{
  color: orange;
}
 /* unvisited link */
a:link {
  color: orange;
}

/* visited link */
a:visited {
  color: orange;
}

/* mouse over link */
a:hover {
  color: blue;
}

/* selected link */
a:active {
  color: blue;
} 
.button
{
  border: none;
  padding: 0.625em;
  border-radius: 0.5em;
  cursor: pointer;
  font-weight: bold;
  margin: 0.15em;
}

.button:hover
{
  filter: brightness(0.8);
}

.button:active
{
  transform: translateY(2px);
}

/* top right bottom left */
.container-main
{
  color: #FFF;
  background-color: #15202b;
  font-family: 'Roboto', sans-serif;
  border-radius: 0.5em;
  padding: 0.5em 1em;
  margin: auto;
  max-width: 37.5em;
  height: 40em;
  box-shadow: 0 0 1em 0.5em #c3c3c333;
}

.empathy-about
{
  height: 35em;
  overflow-y: scroll;
  padding: 0.5em 1em;
  margin: 0.5em 0.5em 1em 0.5em;
  border-radius: 0.5em;
  box-shadow: 0 0 0.25em 0.25em #CCCCCC10;
}

.empathy-about::-webkit-scrollbar
{
  display: none;
}

.menu-selector
{
  display: flex;
  justify-content: center;
  margin: 0.4em 0 0.2em 0;
  max-width: 37.5em;
}

.menu-button
{
  width: 100%;
  background-color: #000000;
  color: orange;
  font-size: 1.1em;
  padding: 0.5em;
  display: block;
}