body {
  background: linear-gradient(135deg, rgb(204, 0, 153), rgb(102, 0, 255), rgba(102, 0, 255, 0.05));
  background-repeat: no-repeat;
  background-size: contain;
  height: 100vh;
}

@keyframes a1 {
  position: relative;
  0% {top: 0%; transform: rotate(0deg);}
  25% {top: 10.9995%; transform: rotate(0deg);}
  50% {top: 10.9995%; transform: rotate(-90deg);}
  75% {top: 10.9995%; transform: rotate(0deg);}
  100% {top: 21.99%; transform: rotate(0deg);}
}


.T {
  position: relative;
  top: 0%;
  background: url("../Bilder/T.png");
  width: 15vw;
  height: 45vh;
  background-size: contain;
  background-repeat: no-repeat;
  margin-left: 33%;
  margin-right: 52%;

  position: relative;
  animation-name: a1;
  animation-duration: 4s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

.etris {
  position: relative;
  bottom: 15.55%;
  width: 20vw;
  font-family: Staatliches;
  font-size: 3cm;
  margin-left: 47%;
  margin-right: 36%;
  background: linear-gradient(to right, rgb(204, 0, 153), rgb(102, 0, 255), rgba(102, 0, 255, 0.05));
  color: rgb(204, 102, 255);
  border: solid rgb(204, 255, 255));
  border-width: thin;
  cursor: default;
}

.Spielen {
  position: relative;
  width: 10%;
  height: 5%;
  margin-left: 45%;
  margin-right: 45%
  font-family: Rowdies;
  font-size: 1.25cm;
  transition: font-size 1s, margin-right 1s, margin-left 1s, border 1s, color 1s, background-color 2s;
  text-decoration: none;
  color:rgb(255, 153, 255);
  border-radius: 25%;
}

.Spielen:hover {
  font-size: 2cm;
  width: 15%;
  height: 7.5%;
  margin-left:  42.5%;
  margin-right: 42.5%;
  background: rgba(102, 255, 102, 0.25);
  border-radius: 25%;
  color: rgb(204, 0, 153);
  border-width: thick;
}
