@font-face {
  font-family: 'JetBrainsMono'; /* A name to be used later */
  src: url('fonts/JetBrainsMono-Bold.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
  font-display: swap; /* Optimizes font loading behavior */
}

body {
  overflow: hidden;
}

h1 {
  font-family: 'JetBrainsMono', serif;
  font-size: 50px;
  color: white;
  text-align: center;
  text-anchor: middle;
  padding-top: 70px;
  padding-bottom: 40px;
}

a {
  font-family: 'JetBrainsMono', serif;
  font-size: 100px;
  color: white;
  text-align: center;
  text-anchor: middle;
  padding-top: 70px;
  padding-bottom: 40px;
}

.fade-in {
  opacity: 0;
  transform: translateY(100px);
  animation: fadeUp 5s ease forwards;
}

@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fade-link {
  animation-delay: 5s;
  display: inline-block;          /* important for transform */
  opacity: 0;
  transform: translateY(200px);
  animation: fadeUp 12s ease forwards;
}