/* import some bits */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;700&display=swap');
@keyframes fadeInFromBottom {
  0% {
    opacity: 0;
    transform: translateY(10%);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
/* main css starts here */
body {
    animation: fadeInFromBottom 0.6s cubic-bezier(0.83, 0, 0.17, 1);
    font-family: 'Space Grotesk', sans-serif;
    margin: 2em 12.5%;
    background-color: #0c0c0c;
    color: #fafafa;
}
a {
    color: #93d4ff;
}
hr {
    border: none;
    height: 1px;
    background-color: #333;
}

@media screen and (min-width: 1100px) {
    body {
      max-width: 800px;
      margin: 5em auto; /* idk how to make this work on mobile, so media query it is */
    }
  }
