body {
  font-family: sans-serif;
}

#landing {
  margin: 0;
}

#back-to-main {
  margin: 5px;
  font-family: "League Spartan", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  color: #999;
  font-size: 16px;
}

/* Google Fonts */
.display-title {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 1cap;

  height: calc(100vh - 19px);
  text-align: center;

  font-family: "League Spartan", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 400%;
}

/* Animated Display Text */
.display-title b {
  background: radial-gradient(
      circle at left,
      #526cff 5%,
      #b2a8fd,
      #8678f9,
      #fe5f92 50%,
      transparent 51%
    ),
    radial-gradient(
        circle at right,
        #526cff 5%,
        #c7d2fe,
        #9a8dfd,
        #fe5f92 50%,
        transparent 51%
      )
      /* Fallback colour: */ /* #fe5f92 */;
  font-weight: 750;
  background-size: 200% auto;
  color: #000;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: animatedTextGradient 4s linear infinite;
}

/* Old style (too dark -- removed) */
/* .display-title i {
  font-style: normal;

  background:
    radial-gradient(ellipse at top, #526cff, #fe5f92, transparent),
    radial-gradient(ellipse at bottom , #2d3ffb, #526cff),
    radial-gradient(ellipse at top right, #fe5f92, transparent, #2d3fee),
    radial-gradient(ellipse at right, #9a8dfd, #2d3ffb),
    radial-gradient(ellipse at top left, #fe5f92, transparent, #2d3fee),
    radial-gradient(ellipse at left, #9a8dfd, #2d3ffb);
  font-weight: 750;
  background-size: 200% auto;
  color: #000;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: animatedTextGradient 5s linear infinite;
  background-position: 0%;
} */

@keyframes animatedTextGradient {
  to {
    background-position: 200%;
  }
}
