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

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


.container {
  position: relative; 
  width: 100vw; 
  height: 100vh;
  overflow: hidden;
  margin: 0px ;
  transform-origin: center; 
  animation: my-super-slant 0s infinite  ease-in-out;
}



.corner {
  position: absolute;
  padding: 10px ;
  background-color: #e000ff;
  
}

.top-left {
  top: 0;
  left: 0;
  font-size: 430px;
  padding-left: 40px;
  padding-top: 20px;
  animation: my-super-slant 1s infinite  ease-in-out;
  background-color:  #ff0606;
}

.top-right {
  top: 0;
  right: 0;
  font-size: 280px;
  padding-top: 30px;
  padding-bottom: 30px;
  padding-left: 40px;
  background-color:  #e000ff;
  transform: rotate(90deg) translate(100%, 0);
  transform-origin: top right; 
  animation: my-super-slant2 1s infinite  ease-in-out;
}

.bottom-left {
  bottom: 0;
  left: 0;
  font-size: 110px;
  padding-left: 30px;
  padding-top: 40px;
  background-color:   #e000ff;
  transform: rotate(-90deg) translate(0, 100%);
  transform-origin: bottom left; 
  animation: my-super-slant3 1s infinite  ease-in-out;
}

.bottom-right {
  bottom: 0;
  font-size: 350px;
  padding-left: 80px;
  transform: rotate(-180deg) translate(0, 0%);
  right: 360px;
  animation: my-super-slant4 1s infinite  ease-in-out;
  background-color:  #980033;
}



@keyframes my-super-slant{
  0% {font-variation-settings: "slnt" 15;  width: 0vw; height: 54vh;}
  80% { font-variation-settings: "slnt" -15; width: 80vw; height: 54vh;}
  100% { font-variation-settings: "slnt" -15; width: 80vw; height: 54vh;}
}

@keyframes my-super-slant2{
  0% {font-variation-settings: "slnt" 15;  width: 0vw; height: 33vh;}
  80% { font-variation-settings: "slnt" -15; width:100vw; height: 33vh;}
  100% { font-variation-settings: "slnt" -15; width:100vw; height: 33vh;}
}

@keyframes my-super-slant3{
  0% {font-variation-settings: "slnt" 15;  width: 0vw; height: 17vh;}
  80% { font-variation-settings: "slnt" -15; width:20.5vw; height: 17vh;}
  100% { font-variation-settings: "slnt" -15; width:20.5vw; height: 17vh;}
}

@keyframes my-super-slant4{
  0% {font-variation-settings: "slnt" 15;  width: 20vw; height: 41vh;}
  80% { font-variation-settings: "slnt" -15; width: 62.2vw; height: 41vh;}
  100% { font-variation-settings: "slnt" -15; width: 62.2vw; height: 41vh;}
}