body {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 90vh;
  margin: 0;
  padding: 0;

  background-color: #f9ea37;
  font-family: "Roboto", sans-serif;
}

header {
  display: flex;
  align-items: normal;
  justify-content: space-between;
  margin: 0em 0.5em 0em 2em;
}

main {
  text-align: center;
  margin-top: -2em;
  font-size: 4em;
}

footer {
  text-align: center;
}

footer img {
  margin: 0 0.25em;
}

a {
  color: black;
  text-decoration: none;
  font-weight: 500;
}

.logo {
  display: flex;
  align-items: center;
  font-size: 4em;
  font-weight: 500;
}

.logo img {
  max-height: 2.25em;
  margin-bottom: -0.25em;
}

.logo-txt {
  margin-left: -0.5em;
}

.links {
  margin-top: 1em;
  font-size: 1.5em;
}

.links a {
  padding: 0.25em;
  margin: 0em 0.25em;
}

.links a:hover {
  border-bottom: 1px solid black;
}

footer p {
  margin: 0.5em;
}

.copyright {
  font-size: 0.8em;
}

@media only screen and (max-width: 1024px) {
  header {
    margin-left: 2em;
  }

  main {
    margin-top: -1em;
    font-size: 2.5em;
  }

  .logo {
    font-size: 2.5em;
  }

  footer p {
    margin: 0.25em;
  }

  .copyright {
    font-size: 0.7em;
  }
}

@media only screen and (max-width: 560px) {
  header {
    margin-left: 1em;
  }

  main {
    font-size: 2em;
  }

  .logo {
    font-size: 2em;
  }

  .links {
    font-size: 1.25em;
  }
}

@media only screen and (max-width: 375px) {
  header {
    margin-left: 1em;
  }

  main {
    font-size: 2em;
  }

  .logo {
    font-size: 1.75em;
  }

  .links {
    font-size: 1em;
  }
}
