.rainbow {
  position: relative;
  display: block;
  overflow: hidden;
  z-index: 1; }
  .rainbow::before {
    content: '';
    display: block;
    width: 100vw;
    height: 100vw;
    position: absolute;
    z-index: -1;
    transition: 300ms all ease-in-out;
    background: conic-gradient(yellow 0%, orange 14.285%, red 28.571%, magenta 42.857%, blue 57.142%, cyan 71.428%, lime 85.714%, yellow 100%);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); }
  .rainbow::after {
    content: '';
    display: block;
    background: #000;
    position: absolute;
    width: calc( 100% - 10px);
    height: calc( 100% - 10px);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); }
  .rainbow.rainbow-hover:hover::before {
    transform: translate(-50%, -50%) rotate(360deg); }

HTML {
  font-size: 16px; }

BODY {
  background: #000;
  color: var(--bs-light);
  width: 100vw;
  font-family: Orbitron;
  overflow-x: hidden; }

HEADER {
  position: fixed;
  width: 100%;
  background: #000; }
  HEADER H1 {
    font-size: 3rem; }
  HEADER HR {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: auto !important; }
  HEADER #site-description {
    position: absolute; }
  HEADER .rainbow::after {
    display: none; }
  BODY.home HEADER {
    height: 100vh; }
    BODY.home HEADER HR {
      bottom: 18px; }
    BODY.home HEADER .rainbow {
      height: 100%;
      width: 100%; }
    BODY.home HEADER IMG {
      height: 100%; }
    BODY.home HEADER #site-logo {
      position: absolute;
      height: 50vh;
      width: 50vh;
      left: calc( 50vw - 25vh);
      top: 15vh; }
    BODY.home HEADER #site-title {
      position: absolute;
      top: 80vh;
      left: 50%;
      z-index: 100;
      transform: translate(-50%); }
    BODY.home HEADER #site-description {
      position: absolute;
      top: calc( 80vh + 75px);
      left: 50%;
      z-index: 100;
      transform: translate(-50%); }

MAIN {
  height: 200vh; }

HR {
  background: linear-gradient(90deg, red 0%, orange 14.285%, yellow 28.571%, lime 42.857%, cyan 57.142%, blue 71.428%, magenta 85.714%, red 100%);
  opacity: 1;
  margin: 0; }