:root {
  font-family: 'Ruder', sans-serif;
}

body { /* hier braucht es eher keinen Raster */
  background-color: #1D1D1D; 
  text-align: center;
}

h1  { /* hier raster*/
  display: grid;
  grid-row-gap: 5px;
  font-size: 40vh;
  line-height: 0.3; /* Verschiebng Y-Achse */
  letter-spacing: normal;
  animation: anim1 2s linear infinite alternate; 


}
.lettera {
  animation: rainbow-anim1 1s linear infinite alternate; 

}

.letterb {
  animation: rainbow-anim2 1s linear infinite alternate; 

}

.letterc {
  animation: rainbow-anim3 1s linear infinite alternate; 

}

@keyframes anim1 {
  0% {font-variation-settings: "opsz" 95;}
  50% {font-variation-settings: "opsz" 380;}
  100% {font-variation-settings: "opsz" 95;}
}


@keyframes rainbow-anim1 {
  0% {
    color: red;
  }
  20% {
    color: orange;
  }
  40% {
    color: yellow;
  }
  60% {
    color: green;
  }
  80% {
    color: blue;
  }
  100% {
    color: violet;
  }

}

@keyframes rainbow-anim2 {
  0% {
    color: orange;
  }
  20% {
    color: yellow;
  }
  40% {
    color: green;
  }
  60% {
    color: blue;
  }
  80% {
    color: violet;
  }
  100% {
    color: red;
  }

}

@keyframes rainbow-anim3 {
  0% {
    color: yellow;
  }
  20% {
    color: green;
  }
  40% {
    color: blue;
  }
  60% {
    color: violet;
  }
 80% {
    color: red;
  }
  100% {
    color: orange;
  }

}