html,
body {
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

body {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
}

#pad1Status,
#pad2Status {
  display: none !important;
}

#pad2 {
  width: 600px;
  height: 481px;
  position: relative;
  background: url("pad2-sheet.png") left center;
  background-position: -2px;
  -khtml-user-select: none;
  -o-user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none; }
  #pad2.scratch-outline-visible:before {
    content: "";
    position: absolute;
    width: 45%;
    height: 90%;
    left: 27.5%;
    top: 2.5%;
    border: 5.25px solid #0966a7;
    border-radius: 8px;
    box-sizing: border-box;
    clip-path: polygon(6% 0%, 96% 0%, 100% 88%, 87% 100%, 0% 100%, 0% 10%);
    transform: rotate(34deg);
    transform-origin: 50% 50%;
    pointer-events: none;
    z-index: 4; }
  #pad2.paused {
    -webkit-animation-play-state: paused !important;
    animation-play-state: paused !important;
    -moz-animation-play-state: paused !important;
    -o-animation-play-state: paused !important; }
  #pad2.animated {
    -webkit-animation: play 0.8s steps(54) infinite;
    animation: play 0.8s steps(54) infinite; }

@-webkit-keyframes play {
  100% {
    background-position: -32400px; } }
@keyframes play {
  100% {
    background-position: -32400px; } }

/*# sourceMappingURL=pad2.css.map */