:root {
  font-size: 100%;
  font-family: 'seismic';
  /* Dieser Name korrespondiert mit den Einstellungen in fonts.css */
}

body {
  background-color: rgb(0, 0, 0);
  color: white;
  font-size: 38vw;
  font-variation-settings: "wght" 200, "SEIS" 0;
  display: flex;
  justify-content: center;
  overflow: hidden;

}

#a1 {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* animation: name duration timing-function delay iteration-count direction fill-mode; */

}

.aa1 {
  clip-path: inset(0% 50% 52% 0%);
  animation: test 4s infinite;
}

.aa2 {
  clip-path: inset(0% 0% 52% 50%);
  animation: test 6s 1s infinite;
}

.aa3 {
  clip-path: inset(48% 50% 0% 0%);
  animation: test 8s 2s infinite;
}

.aa4 {
  clip-path: inset(48% 0% 0% 50%);
  animation: test 12s 3s infinite;
}

@keyframes test {
  0% {
    font-variation-settings: "wght" 200, "SEIS" 0;
  }

  25% {
    font-variation-settings: "wght" 200, "SEIS" 100;
  }
  50% {
    font-variation-settings: "wght" 700, "SEIS" 0;
  }
  75% {
    font-variation-settings: "wght" 700, "SEIS" 100;
  }
  100% {
    font-variation-settings: "wght" 200, "SEIS" 0;
  }




}