:root {
  font-family: 'asfalt';
}

.hand {
  position: fixed;
  z-index: 1;
}

.container {
  display: grid;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.ottos1 {
  grid-column: 1;
  grid-row: 1;
  margin-top: -100px;
  font-variation-settings: "wdth" 50;
  color:black;
  -webkit-text-stroke: 2px #e000ff;
  animation: my-super-slant-1 0.5s infinite  ease-in-out;
}

.ottos2 {
  grid-column: 1;
  grid-row: 1;
  margin-top: -100px;
  font-variation-settings: "wdth" 50;
  color:black;
    -webkit-text-stroke: 2px #e000ff;
  animation: my-super-slant-2 0.5s infinite  ease-in-out;
}

.ottos3 {
  grid-column: 1;
  grid-row: 1;
  margin-top: -100px;
  font-variation-settings: "wdth" 50;
  color:black;
    -webkit-text-stroke: 2px #e000ff;
  animation: my-super-slant-3 0.5s infinite  ease-in-out;

}

.ottos4 {
  grid-column: 1;
  grid-row: 1;
  margin-top: -100px;
  font-variation-settings: "wdth" 50;
  color:black;
    -webkit-text-stroke: 2px #e000ff;
  animation: my-super-slant-4 0.5s infinite  ease-in-out;
}


@keyframes my-super-slant-1{
  0% { font-variation-settings: "wght" 300, "wdth" 50; font-size: 300px;}
  100% { font-variation-settings: "wght" 700, "wdth" 50; font-size: 1000px; }
}

@keyframes my-super-slant-2{
  0% { font-variation-settings: "wght" 300, "wdth" 50; font-size: 500px; }
  100% { font-variation-settings: "wght" 700, "wdth" 60; font-size: 1000px;}
}

@keyframes my-super-slant-3{
  0% { font-variation-settings: "wght" 300, "wdth" 50; font-size: 1000px; }
  100% { font-variation-settings: "wght" 700, "wdth" 70; font-size: 1000px;}
}

@keyframes my-super-slant-4{
  0% { font-variation-settings: "wght" 300, "wdth" 50; font-size: 1000px; }
  100% { font-variation-settings: "wght" 700, "wdth" 80; font-size: 1000px; }
}

