@import url(https://fonts.googleapis.com/css?family=Source+Code+Pro:300,700);


.nyancat .body,
.nyancat .poptart,
.nyancat .head,
.nyancat .eyes,
.nyancat .foot,
.nyancat .tail {
  width: 4px;
  height: 4px;
  display: block;
  position: absolute;
}
.nyancat .body {
  z-index: 1;
  animation: poptart 0.4s steps(1) infinite;
}
.nyancat .poptart {
  background: transparent;
  z-index: 5;
  box-shadow: 0px 4px 0 transparent, 4px 4px 0 transparent, 8px 4px 0 black, 12px 4px 0 black, 16px 4px 0 black, 20px 4px 0 black, 24px 4px 0 black, 28px 4px 0 black, 32px 4px 0 black, 36px 4px 0 black, 40px 4px 0 black, 44px 4px 0 black, 48px 4px 0 black, 52px 4px 0 black, 56px 4px 0 black, 60px 4px 0 black, 64px 4px 0 black, 68px 4px 0 black, 72px 4px 0 black, 76px 4px 0 black, 80px 4px 0 black, 84px 4px 0 transparent, 88px 4px 0 transparent, 0px 8px 0 transparent, 4px 8px 0 black, 8px 8px 0 #ffcc99, 12px 8px 0 #ffcc99, 16px 8px 0 #ffcc99, 20px 8px 0 #ffcc99, 24px 8px 0 #ffcc99, 28px 8px 0 #ffcc99, 32px 8px 0 #ffcc99, 36px 8px 0 #ffcc99, 40px 8px 0 #ffcc99, 44px 8px 0 #ffcc99, 48px 8px 0 #ffcc99, 52px 8px 0 #ffcc99, 56px 8px 0 #ffcc99, 60px 8px 0 #ffcc99, 64px 8px 0 #ffcc99, 68px 8px 0 #ffcc99, 72px 8px 0 #ffcc99, 76px 8px 0 #ffcc99, 80px 8px 0 #ffcc99, 84px 8px 0 black, 88px 8px 0 transparent, 0px 12px 0 black, 4px 12px 0 #ffcc99, 8px 12px 0 #ffcc99, 12px 12px 0 #ffcc99, 16px 12px 0 #ff99ff, 20px 12px 0 #ff99ff, 24px 12px 0 #ff99ff, 28px 12px 0 #ff99ff, 32px 12px 0 #ff99ff, 36px 12px 0 #ff99ff, 40px 12px 0 #ff99ff, 44px 12px 0 #ff99ff, 48px 12px 0 #ff99ff, 52px 12px 0 #ff99ff, 56px 12px 0 #ff99ff, 60px 12px 0 #ff99ff, 64px 12px 0 #ff99ff, 68px 12px 0 #ff99ff, 72px 12px 0 #ffcc99, 76px 12px 0 #ffcc99, 80px 12px 0 #ffcc99, 84px 12px 0 #ffcc99, 88px 12px 0 black, 0px 16px 0 black, 4px 16px 0 #ffcc99, 8px 16px 0 #ffcc99, 12px 16px 0 #ff99ff, 16px 16px 0 #ff99ff, 20px 16px 0 #ff99ff, 24px 16px 0 #ff99ff, 28px 16px 0 fuchsia, 32px 16px 0 #ff99ff, 36px 16px 0 #ff99ff, 40px 16px 0 #ff99ff, 44px 16px 0 #ff99ff, 48px 16px 0 #ff99ff, 52px 16px 0 #ff99ff, 56px 16px 0 fuchsia, 60px 16px 0 #ff99ff, 64px 16px 0 #ff99ff, 68px 16px 0 #ff99ff, 72px 16px 0 #ff99ff, 76px 16px 0 #ff99ff, 80px 16px 0 #ffcc99, 84px 16px 0 #ffcc99, 88px 16px 0 black, 0px 20px 0 black, 4px 20px 0 #ffcc99, 8px 20px 0 #ffcc99, 12px 20px 0 #ff99ff, 16px 20px 0 fuchsia, 20px 20px 0 #ff99ff, 24px 20px 0 #ff99ff, 28px 20px 0 #ff99ff, 32px 20px 0 #ff99ff, 36px 20px 0 #ff99ff, 40px 20px 0 #ff99ff, 44px 20px 0 #ff99ff, 48px 20px 0 #ff99ff, 52px 20px 0 #ff99ff, 56px 20px 0 #ff99ff, 60px 20px 0 #ff99ff, 64px 20px 0 #ff99ff, 68px 20px 0 #ff99ff, 72px 20px 0 #ff99ff, 76px 20px 0 #ff99ff, 80px 20px 0 #ff99ff, 84px 20px 0 #ffcc99, 88px 20px 0 black, 0px 24px 0 black, 4px 24px 0 #ffcc99, 8px 24px 0 #ff99ff, 12px 24px 0 #ff99ff, 16px 24px 0 #ff99ff, 20px 24px 0 #ff99ff, 24px 24px 0 #ff99ff, 28px 24px 0 #ff99ff, 32px 24px 0 #ff99ff, 36px 24px 0 #ff99ff, 40px 24px 0 #ff99ff, 44px 24px 0 #ff99ff, 48px 24px 0 #ff99ff, 52px 24px 0 #ff99ff, 56px 24px 0 #ff99ff, 60px 24px 0 #ff99ff, 64px 24px 0 #ff99ff, 68px 24px 0 #ff99ff, 72px 24px 0 fuchsia, 76px 24px 0 #ff99ff, 80px 24px 0 #ff99ff, 84px 24px 0 #ffcc99, 88px 24px 0 black, 0px 28px 0 black, 4px 28px 0 #ffcc99, 8px 28px 0 #ff99ff, 12px 28px 0 #ff99ff, 16px 28px 0 #ff99ff, 20px 28px 0 #ff99ff, 24px 28px 0 #ff99ff, 28px 28px 0 #ff99ff, 32px 28px 0 #ff99ff, 36px 28px 0 #ff99ff, 40px 28px 0 #ff99ff, 44px 28px 0 #ff99ff, 48px 28px 0 #ff99ff, 52px 28px 0 #ff99ff, 56px 28px 0 #ff99ff, 60px 28px 0 #ff99ff, 64px 28px 0 #ff99ff, 68px 28px 0 #ff99ff, 72px 28px 0 #ff99ff, 76px 28px 0 #ff99ff, 80px 28px 0 #ff99ff, 84px 28px 0 #ffcc99, 88px 28px 0 black, 0px 32px 0 black, 4px 32px 0 #ffcc99, 8px 32px 0 #ff99ff, 12px 32px 0 #ff99ff, 16px 32px 0 #ff99ff, 20px 32px 0 #ff99ff, 24px 32px 0 #ff99ff, 28px 32px 0 #ff99ff, 32px 32px 0 fuchsia, 36px 32px 0 #ff99ff, 40px 32px 0 #ff99ff, 44px 32px 0 #ff99ff, 48px 32px 0 #ff99ff, 52px 32px 0 #ff99ff, 56px 32px 0 #ff99ff, 60px 32px 0 #ff99ff, 64px 32px 0 #ff99ff, 68px 32px 0 fuchsia, 72px 32px 0 #ff99ff, 76px 32px 0 #ff99ff, 80px 32px 0 #ff99ff, 84px 32px 0 #ffcc99, 88px 32px 0 black, 0px 36px 0 black, 4px 36px 0 #ffcc99, 8px 36px 0 #ff99ff, 12px 36px 0 #ff99ff, 16px 36px 0 #ff99ff, 20px 36px 0 #ff99ff, 24px 36px 0 #ff99ff, 28px 36px 0 #ff99ff, 32px 36px 0 #ff99ff, 36px 36px 0 #ff99ff, 40px 36px 0 #ff99ff, 44px 36px 0 #ff99ff, 48px 36px 0 #ff99ff, 52px 36px 0 fuchsia, 56px 36px 0 #ff99ff, 60px 36px 0 #ff99ff, 64px 36px 0 #ff99ff, 68px 36px 0 #ff99ff, 72px 36px 0 #ff99ff, 76px 36px 0 #ff99ff, 80px 36px 0 #ff99ff, 84px 36px 0 #ffcc99, 88px 36px 0 black, 0px 40px 0 black, 4px 40px 0 #ffcc99, 8px 40px 0 #ff99ff, 12px 40px 0 fuchsia, 16px 40px 0 #ff99ff, 20px 40px 0 #ff99ff, 24px 40px 0 #ff99ff, 28px 40px 0 #ff99ff, 32px 40px 0 #ff99ff, 36px 40px 0 #ff99ff, 40px 40px 0 #ff99ff, 44px 40px 0 #ff99ff, 48px 40px 0 #ff99ff, 52px 40px 0 #ff99ff, 56px 40px 0 #ff99ff, 60px 40px 0 #ff99ff, 64px 40px 0 #ff99ff, 68px 40px 0 #ff99ff, 72px 40px 0 #ff99ff, 76px 40px 0 #ff99ff, 80px 40px 0 #ff99ff, 84px 40px 0 #ffcc99, 88px 40px 0 black, 0px 44px 0 black, 4px 44px 0 #ffcc99, 8px 44px 0 #ff99ff, 12px 44px 0 #ff99ff, 16px 44px 0 #ff99ff, 20px 44px 0 #ff99ff, 24px 44px 0 #ff99ff, 28px 44px 0 #ff99ff, 32px 44px 0 #ff99ff, 36px 44px 0 #ff99ff, 40px 44px 0 fuchsia, 44px 44px 0 #ff99ff, 48px 44px 0 #ff99ff, 52px 44px 0 #ff99ff, 56px 44px 0 #ff99ff, 60px 44px 0 #ff99ff, 64px 44px 0 #ff99ff, 68px 44px 0 #ff99ff, 72px 44px 0 #ff99ff, 76px 44px 0 #ff99ff, 80px 44px 0 #ff99ff, 84px 44px 0 #ffcc99, 88px 44px 0 black, 0px 48px 0 black, 4px 48px 0 #ffcc99, 8px 48px 0 #ff99ff, 12px 48px 0 #ff99ff, 16px 48px 0 #ff99ff, 20px 48px 0 fuchsia, 24px 48px 0 #ff99ff, 28px 48px 0 #ff99ff, 32px 48px 0 #ff99ff, 36px 48px 0 #ff99ff, 40px 48px 0 #ff99ff, 44px 48px 0 #ff99ff, 48px 48px 0 #ff99ff, 52px 48px 0 #ff99ff, 56px 48px 0 #ff99ff, 60px 48px 0 #ff99ff, 64px 48px 0 #ff99ff, 68px 48px 0 fuchsia, 72px 48px 0 #ff99ff, 76px 48px 0 #ff99ff, 80px 48px 0 #ff99ff, 84px 48px 0 #ffcc99, 88px 48px 0 black, 0px 52px 0 black, 4px 52px 0 #ffcc99, 8px 52px 0 #ff99ff, 12px 52px 0 #ff99ff, 16px 52px 0 #ff99ff, 20px 52px 0 #ff99ff, 24px 52px 0 #ff99ff, 28px 52px 0 #ff99ff, 32px 52px 0 #ff99ff, 36px 52px 0 #ff99ff, 40px 52px 0 #ff99ff, 44px 52px 0 #ff99ff, 48px 52px 0 #ff99ff, 52px 52px 0 #ff99ff, 56px 52px 0 #ff99ff, 60px 52px 0 #ff99ff, 64px 52px 0 #ff99ff, 68px 52px 0 #ff99ff, 72px 52px 0 #ff99ff, 76px 52px 0 #ff99ff, 80px 52px 0 #ff99ff, 84px 52px 0 #ffcc99, 88px 52px 0 black, 0px 56px 0 black, 4px 56px 0 #ffcc99, 8px 56px 0 #ff99ff, 12px 56px 0 #ff99ff, 16px 56px 0 #ff99ff, 20px 56px 0 #ff99ff, 24px 56px 0 #ff99ff, 28px 56px 0 #ff99ff, 32px 56px 0 fuchsia, 36px 56px 0 #ff99ff, 40px 56px 0 #ff99ff, 44px 56px 0 #ff99ff, 48px 56px 0 #ff99ff, 52px 56px 0 #ff99ff, 56px 56px 0 #ff99ff, 60px 56px 0 #ff99ff, 64px 56px 0 #ff99ff, 68px 56px 0 #ff99ff, 72px 56px 0 #ff99ff, 76px 56px 0 #ff99ff, 80px 56px 0 #ffcc99, 84px 56px 0 #ffcc99, 88px 56px 0 black, 0px 60px 0 black, 4px 60px 0 #ffcc99, 8px 60px 0 #ffcc99, 12px 60px 0 #ff99ff, 16px 60px 0 fuchsia, 20px 60px 0 #ff99ff, 24px 60px 0 #ff99ff, 28px 60px 0 #ff99ff, 32px 60px 0 #ff99ff, 36px 60px 0 #ff99ff, 40px 60px 0 #ff99ff, 44px 60px 0 #ff99ff, 48px 60px 0 #ff99ff, 52px 60px 0 #ff99ff, 56px 60px 0 #ff99ff, 60px 60px 0 #ff99ff, 64px 60px 0 #ff99ff, 68px 60px 0 #ff99ff, 72px 60px 0 #ff99ff, 76px 60px 0 #ff99ff, 80px 60px 0 #ffcc99, 84px 60px 0 #ffcc99, 88px 60px 0 black, 0px 64px 0 black, 4px 64px 0 #ffcc99, 8px 64px 0 #ffcc99, 12px 64px 0 #ffcc99, 16px 64px 0 #ffcc99, 20px 64px 0 #ff99ff, 24px 64px 0 #ff99ff, 28px 64px 0 #ff99ff, 32px 64px 0 #ff99ff, 36px 64px 0 #ff99ff, 40px 64px 0 #ff99ff, 44px 64px 0 #ff99ff, 48px 64px 0 #ff99ff, 52px 64px 0 #ff99ff, 56px 64px 0 #ff99ff, 60px 64px 0 #ff99ff, 64px 64px 0 #ff99ff, 68px 64px 0 #ff99ff, 72px 64px 0 #ff99ff, 76px 64px 0 #ffcc99, 80px 64px 0 #ffcc99, 84px 64px 0 #ffcc99, 88px 64px 0 black, 0px 68px 0 transparent, 4px 68px 0 black, 8px 68px 0 #ffcc99, 12px 68px 0 #ffcc99, 16px 68px 0 #ffcc99, 20px 68px 0 #ffcc99, 24px 68px 0 #ffcc99, 28px 68px 0 #ffcc99, 32px 68px 0 #ffcc99, 36px 68px 0 #ffcc99, 40px 68px 0 #ffcc99, 44px 68px 0 #ffcc99, 48px 68px 0 #ffcc99, 52px 68px 0 #ffcc99, 56px 68px 0 #ffcc99, 60px 68px 0 #ffcc99, 64px 68px 0 #ffcc99, 68px 68px 0 #ffcc99, 72px 68px 0 #ffcc99, 76px 68px 0 #ffcc99, 80px 68px 0 #ffcc99, 84px 68px 0 black, 88px 68px 0 transparent, 0px 72px 0 transparent, 4px 72px 0 transparent, 8px 72px 0 black, 12px 72px 0 black, 16px 72px 0 black, 20px 72px 0 black, 24px 72px 0 black, 28px 72px 0 black, 32px 72px 0 black, 36px 72px 0 black, 40px 72px 0 black, 44px 72px 0 black, 48px 72px 0 black, 52px 72px 0 black, 56px 72px 0 black, 60px 72px 0 black, 64px 72px 0 black, 68px 72px 0 black, 72px 72px 0 black, 76px 72px 0 black, 80px 72px 0 black, 84px 72px 0 transparent, 88px 72px 0 transparent;
}
.nyancat .head {
  --boxShadow: 0px 4px 0 transparent, 4px 4px 0 transparent, 8px 4px 0 black, 12px 4px 0 black, 16px 4px 0 transparent, 20px 4px 0 transparent, 24px 4px 0 transparent, 28px 4px 0 transparent, 32px 4px 0 transparent, 36px 4px 0 transparent, 40px 4px 0 transparent, 44px 4px 0 transparent, 48px 4px 0 black, 52px 4px 0 black, 56px 4px 0 transparent, 60px 4px 0 transparent, 0px 8px 0 transparent, 4px 8px 0 black, 8px 8px 0 #999999, 12px 8px 0 #999999, 16px 8px 0 black, 20px 8px 0 transparent, 24px 8px 0 transparent, 28px 8px 0 transparent, 32px 8px 0 transparent, 36px 8px 0 transparent, 40px 8px 0 transparent, 44px 8px 0 black, 48px 8px 0 #999999, 52px 8px 0 #999999, 56px 8px 0 black, 60px 8px 0 transparent, 0px 12px 0 transparent, 4px 12px 0 black, 8px 12px 0 #999999, 12px 12px 0 #999999, 16px 12px 0 #999999, 20px 12px 0 black, 24px 12px 0 transparent, 28px 12px 0 transparent, 32px 12px 0 transparent, 36px 12px 0 transparent, 40px 12px 0 black, 44px 12px 0 #999999, 48px 12px 0 #999999, 52px 12px 0 #999999, 56px 12px 0 black, 60px 12px 0 transparent, 0px 16px 0 transparent, 4px 16px 0 black, 8px 16px 0 #999999, 12px 16px 0 #999999, 16px 16px 0 #999999, 20px 16px 0 #999999, 24px 16px 0 black, 28px 16px 0 black, 32px 16px 0 black, 36px 16px 0 black, 40px 16px 0 #999999, 44px 16px 0 #999999, 48px 16px 0 #999999, 52px 16px 0 #999999, 56px 16px 0 black, 60px 16px 0 transparent, 0px 20px 0 transparent, 4px 20px 0 black, 8px 20px 0 #999999, 12px 20px 0 #999999, 16px 20px 0 #999999, 20px 20px 0 #999999, 24px 20px 0 #999999, 28px 20px 0 #999999, 32px 20px 0 #999999, 36px 20px 0 #999999, 40px 20px 0 #999999, 44px 20px 0 #999999, 48px 20px 0 #999999, 52px 20px 0 #999999, 56px 20px 0 black, 60px 20px 0 transparent, 0px 24px 0 black, 4px 24px 0 #999999, 8px 24px 0 #999999, 12px 24px 0 #999999, 16px 24px 0 #999999, 20px 24px 0 #999999, 24px 24px 0 #999999, 28px 24px 0 #999999, 32px 24px 0 #999999, 36px 24px 0 #999999, 40px 24px 0 #999999, 44px 24px 0 #999999, 48px 24px 0 #999999, 52px 24px 0 #999999, 56px 24px 0 #999999, 60px 24px 0 black, 0px 28px 0 black, 4px 28px 0 #999999, 8px 28px 0 #999999, 12px 28px 0 #999999, 16px 28px 0 #999999, 20px 28px 0 #999999, 24px 28px 0 #999999, 28px 28px 0 #999999, 32px 28px 0 #999999, 36px 28px 0 #999999, 40px 28px 0 #999999, 44px 28px 0 #999999, 48px 28px 0 #999999, 52px 28px 0 #999999, 56px 28px 0 #999999, 60px 28px 0 black, 0px 32px 0 black, 4px 32px 0 #999999, 8px 32px 0 #999999, 12px 32px 0 #999999, 16px 32px 0 #999999, 20px 32px 0 #999999, 24px 32px 0 #999999, 28px 32px 0 #999999, 32px 32px 0 #999999, 36px 32px 0 black, 40px 32px 0 #999999, 44px 32px 0 #999999, 48px 32px 0 #999999, 52px 32px 0 #999999, 56px 32px 0 #999999, 60px 32px 0 black, 0px 36px 0 black, 4px 36px 0 #999999, 8px 36px 0 #ff9999, 12px 36px 0 #ff9999, 16px 36px 0 #999999, 20px 36px 0 #999999, 24px 36px 0 #999999, 28px 36px 0 #999999, 32px 36px 0 #999999, 36px 36px 0 #999999, 40px 36px 0 #999999, 44px 36px 0 #999999, 48px 36px 0 #999999, 52px 36px 0 #ff9999, 56px 36px 0 #ff9999, 60px 36px 0 black, 0px 40px 0 black, 4px 40px 0 #999999, 8px 40px 0 #ff9999, 12px 40px 0 #ff9999, 16px 40px 0 #999999, 20px 40px 0 black, 24px 40px 0 #999999, 28px 40px 0 #999999, 32px 40px 0 black, 36px 40px 0 #999999, 40px 40px 0 #999999, 44px 40px 0 black, 48px 40px 0 #999999, 52px 40px 0 #ff9999, 56px 40px 0 #ff9999, 60px 40px 0 black, 0px 44px 0 transparent, 4px 44px 0 black, 8px 44px 0 #999999, 12px 44px 0 #999999, 16px 44px 0 #999999, 20px 44px 0 black, 24px 44px 0 black, 28px 44px 0 black, 32px 44px 0 black, 36px 44px 0 black, 40px 44px 0 black, 44px 44px 0 black, 48px 44px 0 #999999, 52px 44px 0 #999999, 56px 44px 0 black, 60px 44px 0 transparent, 0px 48px 0 transparent, 4px 48px 0 transparent, 8px 48px 0 black, 12px 48px 0 #999999, 16px 48px 0 #999999, 20px 48px 0 #999999, 24px 48px 0 #999999, 28px 48px 0 #999999, 32px 48px 0 #999999, 36px 48px 0 #999999, 40px 48px 0 #999999, 44px 48px 0 #999999, 48px 48px 0 #999999, 52px 48px 0 black, 56px 48px 0 transparent, 60px 48px 0 transparent, 0px 52px 0 transparent, 4px 52px 0 transparent, 8px 52px 0 transparent, 12px 52px 0 black, 16px 52px 0 black, 20px 52px 0 black, 24px 52px 0 black, 28px 52px 0 black, 32px 52px 0 black, 36px 52px 0 black, 40px 52px 0 black, 44px 52px 0 black, 48px 52px 0 black, 52px 52px 0 transparent, 56px 52px 0 transparent, 60px 52px 0 transparent;
  z-index: 10;
  left: 52px;
  top: 20px;
  animation: head 0.4s steps(1) infinite;
  box-shadow: var(--boxShadow);
}
.nyancat .eyes {
  left: 16px;
  top: 24px;
  animation: eyes 10s steps(1) infinite;
}
.nyancat .feet {
  z-index: -1;
  animation: feet 0.4s steps(1) infinite reverse 0.2s;
}
.nyancat .foot.one {
  z-index: 3;
  left: 80px;
  top: 60px;
  animation: foot1 0.4s steps(1) infinite;
}
.nyancat .foot.two {
  z-index: 3;
  left: 56px;
  top: 60px;
  animation: foot2 0.4s steps(1) infinite;
}
.nyancat .foot.three {
  z-index: 3;
  left: 28px;
  top: 60px;
  animation: foot3 0.4s steps(1) infinite;
}
.nyancat .foot.four {
  z-index: 3;
  left: 4px;
  top: 60px;
  animation: foot4 0.4s steps(1) infinite;
}

@keyframes poptart {
  0% {
    transform: translateY(-4px);
  }
  28% {
    transform: translateY(0);
  }
}
@keyframes head {
  0% {
    transform: translate(-4px, -4px);
  }
  20% {
    transform: translate(0, -4px);
  }
  40% {
    transform: translate(0, 0);
  }
  60% {
    transform: translate(-4px, 0);
  }
}
@keyframes eyes {
  0%, 90% {
    box-shadow: 0px 4px 0 white, 4px 4px 0 black, 28px 4px 0 white, 32px 4px 0 black, 0px 8px 0 black, 4px 8px 0 black, 28px 8px 0 black, 32px 8px 0 black;
  }
  80% {
    box-shadow: 0px 4px 0 transparent, 4px 4px 0 transparent, 28px 4px 0 white, 32px 4px 0 black, 0px 8px 0 black, 4px 8px 0 black, 28px 8px 0 black, 32px 8px 0 black;
  }
}
@keyframes feet {
  16.7% {
    transform: translateX(-8px);
  }
  33.3% {
    transform: translateX(-12px);
  }
  50% {
    transform: translateX(-12px);
  }
  66.6% {
    transform: translateX(-8px);
  }
  83.7% {
    transform: translateX(-4px);
  }
}
@keyframes foot1 {
  0%, 16.7% {
    box-shadow: 0px 4px 0 black, 4px 4px 0 #999999, 8px 4px 0 #999999, 12px 4px 0 #999999, 16px 4px 0 black, 0px 8px 0 black, 4px 8px 0 #999999, 8px 8px 0 #999999, 12px 8px 0 #999999, 16px 8px 0 black, 0px 12px 0 black, 4px 12px 0 #999999, 8px 12px 0 #999999, 12px 12px 0 #999999, 16px 12px 0 black, 0px 16px 0 black, 4px 16px 0 #999999, 8px 16px 0 #999999, 12px 16px 0 #999999, 16px 16px 0 black, 0px 20px 0 transparent, 4px 20px 0 black, 8px 20px 0 black, 12px 20px 0 black, 16px 20px 0 black;
  }
  33.3% {
    box-shadow: 0px 4px 0 black, 4px 4px 0 #999999, 8px 4px 0 #999999, 12px 4px 0 black, 16px 4px 0 transparent, 0px 8px 0 black, 4px 8px 0 #999999, 8px 8px 0 #999999, 12px 8px 0 black, 16px 8px 0 transparent, 0px 12px 0 black, 4px 12px 0 #999999, 8px 12px 0 #999999, 12px 12px 0 black, 16px 12px 0 transparent, 0px 16px 0 black, 4px 16px 0 #999999, 8px 16px 0 #999999, 12px 16px 0 black, 16px 16px 0 transparent, 0px 20px 0 transparent, 4px 20px 0 black, 8px 20px 0 black, 12px 20px 0 black, 16px 20px 0 transparent;
  }
  66.6% {
    box-shadow: 0px 4px 0 black, 4px 4px 0 #999999, 8px 4px 0 #999999, 12px 4px 0 #999999, 16px 4px 0 black, 0px 8px 0 black, 4px 8px 0 #999999, 8px 8px 0 #999999, 12px 8px 0 #999999, 16px 8px 0 black, 0px 12px 0 black, 4px 12px 0 #999999, 8px 12px 0 #999999, 12px 12px 0 #999999, 16px 12px 0 black, 0px 16px 0 black, 4px 16px 0 #999999, 8px 16px 0 #999999, 12px 16px 0 #999999, 16px 16px 0 black, 0px 20px 0 transparent, 4px 20px 0 black, 8px 20px 0 black, 12px 20px 0 black, 16px 20px 0 black;
  }
  83.7% {
    box-shadow: 0px 4px 0 black, 4px 4px 0 #999999, 8px 4px 0 #999999, 12px 4px 0 #999999, 16px 4px 0 black, 0px 8px 0 black, 4px 8px 0 #999999, 8px 8px 0 #999999, 12px 8px 0 #999999, 16px 8px 0 black, 0px 12px 0 black, 4px 12px 0 #999999, 8px 12px 0 #999999, 12px 12px 0 #999999, 16px 12px 0 black, 0px 16px 0 black, 4px 16px 0 #999999, 8px 16px 0 #999999, 12px 16px 0 #999999, 16px 16px 0 black, 0px 20px 0 transparent, 4px 20px 0 black, 8px 20px 0 black, 12px 20px 0 black, 16px 20px 0 transparent;
  }
}
@keyframes foot2 {
  0% {
    box-shadow: 0px 4px 0 black, 4px 4px 0 #999999, 8px 4px 0 #999999, 12px 4px 0 #999999, 16px 4px 0 black, 0px 8px 0 black, 4px 8px 0 #999999, 8px 8px 0 #999999, 12px 8px 0 black, 16px 8px 0 transparent, 0px 12px 0 black, 4px 12px 0 #999999, 8px 12px 0 #999999, 12px 12px 0 black, 16px 12px 0 transparent, 0px 16px 0 black, 4px 16px 0 #999999, 8px 16px 0 #999999, 12px 16px 0 black, 16px 16px 0 transparent, 0px 20px 0 transparent, 4px 20px 0 black, 8px 20px 0 black, 12px 20px 0 black, 16px 20px 0 transparent;
  }
  16.7% {
    box-shadow: 0px 4px 0 black, 4px 4px 0 #999999, 8px 4px 0 #999999, 12px 4px 0 #999999, 16px 4px 0 black, 0px 8px 0 black, 4px 8px 0 #999999, 8px 8px 0 #999999, 12px 8px 0 #999999, 16px 8px 0 black, 0px 12px 0 black, 4px 12px 0 #999999, 8px 12px 0 #999999, 12px 12px 0 black, 16px 12px 0 black, 0px 16px 0 black, 4px 16px 0 #999999, 8px 16px 0 #999999, 12px 16px 0 black, 16px 16px 0 transparent, 0px 20px 0 transparent, 4px 20px 0 black, 8px 20px 0 black, 12px 20px 0 black, 16px 20px 0 transparent;
  }
  33.3% {
    box-shadow: 0px 4px 0 black, 4px 4px 0 #999999, 8px 4px 0 #999999, 12px 4px 0 #999999, 16px 4px 0 black, 0px 8px 0 black, 4px 8px 0 #999999, 8px 8px 0 #999999, 12px 8px 0 #999999, 16px 8px 0 black, 0px 12px 0 black, 4px 12px 0 #999999, 8px 12px 0 #999999, 12px 12px 0 #999999, 16px 12px 0 black, 0px 16px 0 black, 4px 16px 0 #999999, 8px 16px 0 #999999, 12px 16px 0 #999999, 16px 16px 0 black, 0px 20px 0 black, 4px 20px 0 black, 8px 20px 0 black, 12px 20px 0 black, 16px 20px 0 transparent;
  }
  50% {
    box-shadow: 0px 4px 0 black, 4px 4px 0 #999999, 8px 4px 0 #999999, 12px 4px 0 #999999, 16px 4px 0 black, 0px 8px 0 black, 4px 8px 0 #999999, 8px 8px 0 #999999, 12px 8px 0 #999999, 16px 8px 0 black, 0px 12px 0 black, 4px 12px 0 #999999, 8px 12px 0 #999999, 12px 12px 0 #999999, 16px 12px 0 black, 0px 16px 0 black, 4px 16px 0 #999999, 8px 16px 0 #999999, 12px 16px 0 #999999, 16px 16px 0 black, 0px 20px 0 black, 4px 20px 0 black, 8px 20px 0 black, 12px 20px 0 black, 16px 20px 0 transparent;
  }
  66.6% {
    box-shadow: 0px 4px 0 black, 4px 4px 0 #999999, 8px 4px 0 #999999, 12px 4px 0 #999999, 16px 4px 0 black, 0px 8px 0 black, 4px 8px 0 #999999, 8px 8px 0 #999999, 12px 8px 0 #999999, 16px 8px 0 black, 0px 12px 0 black, 4px 12px 0 #999999, 8px 12px 0 #999999, 12px 12px 0 #999999, 16px 12px 0 black, 0px 16px 0 black, 4px 16px 0 #999999, 8px 16px 0 #999999, 12px 16px 0 #999999, 16px 16px 0 black, 0px 20px 0 black, 4px 20px 0 black, 8px 20px 0 black, 12px 20px 0 black, 16px 20px 0 transparent;
  }
  83.7% {
    box-shadow: 0px 4px 0 black, 4px 4px 0 #999999, 8px 4px 0 #999999, 12px 4px 0 #999999, 16px 4px 0 black, 0px 8px 0 black, 4px 8px 0 #999999, 8px 8px 0 #999999, 12px 8px 0 #999999, 16px 8px 0 black, 0px 12px 0 black, 4px 12px 0 #999999, 8px 12px 0 #999999, 12px 12px 0 #999999, 16px 12px 0 black, 0px 16px 0 black, 4px 16px 0 #999999, 8px 16px 0 #999999, 12px 16px 0 #999999, 16px 16px 0 black, 0px 20px 0 transparent, 4px 20px 0 black, 8px 20px 0 black, 12px 20px 0 black, 16px 20px 0 transparent;
  }
}
@keyframes foot3 {
  0% {
    box-shadow: 0px 4px 0 black, 4px 4px 0 #999999, 8px 4px 0 #999999, 12px 4px 0 #999999, 16px 4px 0 black, 0px 8px 0 black, 4px 8px 0 #999999, 8px 8px 0 #999999, 12px 8px 0 #999999, 16px 8px 0 black, 0px 12px 0 black, 4px 12px 0 #999999, 8px 12px 0 #999999, 12px 12px 0 #999999, 16px 12px 0 black, 0px 16px 0 black, 4px 16px 0 #999999, 8px 16px 0 #999999, 12px 16px 0 #999999, 16px 16px 0 black, 0px 20px 0 transparent, 4px 20px 0 black, 8px 20px 0 black, 12px 20px 0 black, 16px 20px 0 transparent;
  }
  16.7% {
    box-shadow: 0px 4px 0 black, 4px 4px 0 #999999, 8px 4px 0 #999999, 12px 4px 0 #999999, 16px 4px 0 black, 0px 8px 0 black, 4px 8px 0 #999999, 8px 8px 0 #999999, 12px 8px 0 #999999, 16px 8px 0 black, 0px 12px 0 black, 4px 12px 0 #999999, 8px 12px 0 #999999, 12px 12px 0 #999999, 16px 12px 0 black, 0px 16px 0 black, 4px 16px 0 #999999, 8px 16px 0 #999999, 12px 16px 0 #999999, 16px 16px 0 black, 0px 20px 0 black, 4px 20px 0 black, 8px 20px 0 black, 12px 20px 0 black, 16px 20px 0 transparent;
  }
  50% {
    box-shadow: 0px 4px 0 black, 4px 4px 0 #999999, 8px 4px 0 #999999, 12px 4px 0 #999999, 16px 4px 0 black, 0px 8px 0 black, 4px 8px 0 #999999, 8px 8px 0 #999999, 12px 8px 0 #999999, 16px 8px 0 black, 0px 12px 0 black, 4px 12px 0 #999999, 8px 12px 0 #999999, 12px 12px 0 #999999, 16px 12px 0 black, 0px 16px 0 black, 4px 16px 0 #999999, 8px 16px 0 #999999, 12px 16px 0 #999999, 16px 16px 0 black, 0px 20px 0 transparent, 4px 20px 0 black, 8px 20px 0 black, 12px 20px 0 black, 16px 20px 0 black;
  }
  83.7% {
    box-shadow: 0px 4px 0 black, 4px 4px 0 #999999, 8px 4px 0 #999999, 12px 4px 0 #999999, 16px 4px 0 black, 0px 8px 0 black, 4px 8px 0 #999999, 8px 8px 0 #999999, 12px 8px 0 #999999, 16px 8px 0 black, 0px 12px 0 black, 4px 12px 0 #999999, 8px 12px 0 #999999, 12px 12px 0 #999999, 16px 12px 0 black, 0px 16px 0 black, 4px 16px 0 #999999, 8px 16px 0 #999999, 12px 16px 0 #999999, 16px 16px 0 black, 0px 20px 0 transparent, 4px 20px 0 black, 8px 20px 0 black, 12px 20px 0 black, 16px 20px 0 transparent;
  }
}
@keyframes foot4 {
  0% {
    box-shadow: 0px 4px 0 transparent, 4px 4px 0 transparent, 8px 4px 0 black, 12px 4px 0 black, 16px 4px 0 black, 0px 8px 0 transparent, 4px 8px 0 black, 8px 8px 0 black, 12px 8px 0 #999999, 16px 8px 0 black, 0px 12px 0 black, 4px 12px 0 #999999, 8px 12px 0 #999999, 12px 12px 0 #999999, 16px 12px 0 black, 0px 16px 0 black, 4px 16px 0 #999999, 8px 16px 0 #999999, 12px 16px 0 #999999, 16px 16px 0 black, 0px 20px 0 transparent, 4px 20px 0 black, 8px 20px 0 black, 12px 20px 0 black, 16px 20px 0 transparent;
  }
  16.7% {
    box-shadow: 0px 4px 0 transparent, 4px 4px 0 transparent, 8px 4px 0 black, 12px 4px 0 black, 16px 4px 0 black, 0px 8px 0 transparent, 4px 8px 0 black, 8px 8px 0 black, 12px 8px 0 #999999, 16px 8px 0 black, 0px 12px 0 black, 4px 12px 0 #999999, 8px 12px 0 #999999, 12px 12px 0 #999999, 16px 12px 0 black, 0px 16px 0 black, 4px 16px 0 #999999, 8px 16px 0 #999999, 12px 16px 0 #999999, 16px 16px 0 black, 0px 20px 0 black, 4px 20px 0 black, 8px 20px 0 black, 12px 20px 0 black, 16px 20px 0 transparent;
  }
}

#draw-container {
  margin-top: 20px;
}

.draw-navbar, .draw-board {
  background-color: rgb(28, 28, 29);
  width: 800px;
  border-radius: 3px;
}
.draw-navbar{
  padding: 1em;
  margin-bottom: 1em;
  display: flex;
  justify-content: start;
  align-items: center;
}

.draw-board {
  --sizeWidth: 20;
  --sizeHeight: 20;
  height: 800px;
  display: grid;
  grid-template-columns: repeat(var(--sizeWidth), 1fr);
  grid-template-rows: repeat(var(--sizeHeight), 1fr);
  gap: 3px;
  padding: 3px;
}

.draw-btn, input{
  height: 35px;
  padding: 0 1em;
}
.draw-color{
  padding: 0 .25em;
  width: 100px;
  margin: 0 1em;
}

.draw-pixel{
  background-color: rgb(61, 61, 61);
  border-radius: 2px;
  border: 1px;
}