body {
  height: 100vh;
  background: #59f;/*#ff70a4;*/
  overflow: hidden;
  -webkit-perspective: 600px;
          perspective: 600px;
}

#checkerboard {
  position: absolute;
  bottom: -30%;
  right: -60%;
  height: 150%;
  width: 200%;
  -webkit-transform: rotateX(75deg);
          transform: rotateX(75deg);
  -webkit-transform-origin: center center;
          transform-origin: center center;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  background-color:#76c;/* #ff70a4;*/
  background-size: 100px 100px;
  background-position: 0 0, 50px 50px;
  background-image: linear-gradient(45deg, #0c020e 25%, transparent 25%, transparent 75%, #0c020e 75%, #0c020e), linear-gradient(45deg, #0c020e 25%, transparent 25%, transparent 75%, #0c020e 75%, #0c020e);
  -webkit-animation: move-background 3s linear infinite;
          animation: move-background 3s linear infinite;
}
#checkerboard:after {
  content: "";
  display: block;
  height: 100%;
  width: 100%;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#59f), to(transparent));
  background-image: linear-gradient(#59f, transparent);
}

@-webkit-keyframes move-background {
  to {
    background-position: 0 100px, 50px 150px;
  }
}

@keyframes move-background {
  to {
    background-position: 0 100px, 50px 150px;
  }
}
