:root {
  --dot1: #637AFE;
  --dot2: #DAE4ED;
}

body{
  background-color: #15171A;
  color: #fff;
  font-size: 4vh;
  animation: bg 3s linear;
  margin: 0;
}

@keyframes bg {
  0%{background-color: #000;}
  60%{background-color: #000;}
  100%{background-color: #15171A;}
}

.center{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  justify-content: center;
  align-items: center;
}


img{
  width: 125px;
  background-color: #000;
  border-radius: 25px;
  opacity: 1;
  animation: show 1.5s linear;
  transform: rotateY(-90deg);
}
@keyframes show {
0% {transform: rotateY(0deg);}
30% {transform: rotateY(0deg);}
70% {transform: rotateY(0deg);}
100% {transform: rotateY(-90deg);}

}

@keyframes load {

}

/* Geklauter code von https://cssloaders.github.io/ */

.load-wrapper{
  animation: rotate 1s linear infinite;
  height: 50px;
  width: 50px;
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
  transform-origin: top left;
}
.wrapper{
  width: 100vw;
  height: 100vh;
}

.loader::before,
.loader::after {
  border-radius: 50%;
  content: "";
  display: block;
  height: 20px;
  width: 20px;
}
.loader::before {
  animation: ball1 1s infinite;
  background-color: var(--dot2);
  margin-bottom: 10px;
}
.loader::after {
  animation: ball2 1s infinite;
  background-color: var(--dot1);
}

@keyframes rotate {
  0% { transform: rotate(0deg) scale(1.5) translate(-50%, -50%);}
  50% { transform: rotate(360deg) scale(1) translate(-50%, -50%); }
  100% { transform: rotate(720deg) scale(1.5) translate(-50%, -50%); }
}

@keyframes ball1 {
  0% {
    box-shadow: 30px 0 0 var(--dot1);
  }
  50% {
    box-shadow: 0 0 0 var(--dot1);
    margin-bottom: 0;
    transform: translate(15px, 15px);
  }
  100% {
    box-shadow: 30px 0 0 var(--dot1);
    margin-bottom: 10px;
  }
}

@keyframes ball2 {
  0% {
    box-shadow: 30px 0 0 var(--dot2);
  }
  50% {
    box-shadow: 0 0 0 var(--dot2);
    margin-top: -20px;
    transform: translate(15px, 15px);
  }
  100% {
    box-shadow: 30px 0 0 var(--dot2);
    margin-top: 0;
  }
}