@import url("https://fonts.googleapis.com/css?family=Bangers&display=swap");
@-webkit-keyframes rotation {
  to {
    -webkit-transform: rotate(360deg) translateX(-50%) translateY(-50%);
            transform: rotate(360deg) translateX(-50%) translateY(-50%);
  }
}
@keyframes rotation {
  to {
    -webkit-transform: rotate(360deg) translateX(-50%) translateY(-50%);
            transform: rotate(360deg) translateX(-50%) translateY(-50%);
  }
}
body {
  width: 100%;
  height: 100vh;
  color: #bfaa40;
  display: flex;
  overflow: hidden;
  font-family: 'Bangers', cursive;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
body:before {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: rotate(0) translateX(-50%) translateY(-50%);
          transform: rotate(0) translateX(-50%) translateY(-50%);
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
  width: 200%;
  height: 200%;
  background: repeating-conic-gradient(#993333, #bf4040 1%);
  content: '';
  -webkit-animation: rotation 20s infinite linear;
          animation: rotation 20s infinite linear;
}

h1 {
  position: relative;
  z-index: 2;
  font-size: 10em;
  letter-spacing: 15px;
  text-transform: uppercase;
  -webkit-transform: rotate(-10deg);
          transform: rotate(-10deg);
  text-shadow: 1px 1px #ac9939, 2px 2px #998833, 3px 3px #86772d, 4px 4px #82742b, 5px 5px #7e702a, 6px 6px #7a6d29, 7px 7px #776928, 8px 8px #736626, 9px 9px #6f6325, 10px 10px #6b5f24, 10px 10px 30px rgba(0, 0, 0, 0.7);
}