.wrapper {
  height: 400%;
  width: 100%;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  background: linear-gradient(
    124deg,
    #1f0400,
    #3b2500,
    #3d3c00,
    #023500,
    #002e35,
    #001036,
    #25003d,
    #3b0028,
    #350020
  );
  background-size: 100% 1800%;

  -webkit-animation: rainbow 60s ease infinite;
  -z-animation: rainbow 60s ease infinite;
  -o-animation: rainbow 60s ease infinite;
  animation: rainbow 60s ease infinite;
}

@-webkit-keyframes rainbow {
  0% {
    background-position: 0% 82%;
  }
  50% {
    background-position: 100% 19%;
  }
  100% {
    background-position: 0% 82%;
  }
}
@-moz-keyframes rainbow {
  0% {
    background-position: 0% 82%;
  }
  50% {
    background-position: 100% 19%;
  }
  100% {
    background-position: 0% 82%;
  }
}
@-o-keyframes rainbow {
  0% {
    background-position: 0% 82%;
  }
  50% {
    background-position: 100% 19%;
  }
  100% {
    background-position: 0% 82%;
  }
}
@keyframes rainbow {
  0% {
    background-position: 0% 82%;
  }
  50% {
    background-position: 100% 19%;
  }
  100% {
    background-position: 0% 82%;
  }
}

.wrapper2 {
  height: 400%;
  width: 100%;
  position: absolute;
  background-size: 100% 1800%;
  background: linear-gradient(to bottom right, #232326 0%, #110f13 100%);
}