@-webkit-keyframes shuffle {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
  100% {
    -webkit-transform: translate3d(0, -70rem, 0);
            transform: translate3d(0, -70rem, 0);
  }
}
@keyframes shuffle {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
  100% {
    -webkit-transform: translate3d(0, -70rem, 0);
            transform: translate3d(0, -70rem, 0);
  }
}
.Container .innerContainer .container {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -6rem;
  margin-left: -10rem;
  padding: 2.5rem;
  border-radius: 10px;
  background: -webkit-gradient(linear, left top, left bottom, from(#666), to(#444));
  background: linear-gradient(to bottom, #666, #444);
  -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.4);
          box-shadow: 0 2px 10px rgba(0, 0, 0, 0.4);
}
.Container .innerContainer .container:before {
  content: "";
  position: absolute;
  top: 14%;
  left: 6%;
  height: 73%;
  width: 89%;
  border-radius: 10px;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1), 0 -1px 0 1px rgba(255, 255, 255, 0.1);
          box-shadow: 0 0 5px rgba(0, 0, 0, 0.1), 0 -1px 0 1px rgba(255, 255, 255, 0.1);
  background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#666));
  background: linear-gradient(to bottom, #444, #666);
}
.Container .innerContainer .container-1 {
  left: 49%;
  width: 10rem;
}
.Container .innerContainer .container-1:before {
  top: 14%;
  left: 14%;
  height: 73%;
  width: 74%;
}
.Container .innerContainer .container-2 {
  left: 46%;
  width: 15rem;
}
.Container .innerContainer .container-2:before {
  top: 14%;
  left: 10%;
  height: 73%;
  width: 81%;
}
.Container .innerContainer .container-3 {
  left: 43%;
  width: 20rem;
}
.Container .innerContainer .container-3:before {
  top: 14%;
  left: 7%;
  height: 73%;
  width: 86%;
}
.Container .innerContainer .container-4 {
  left: 39%;
  width: 25rem;
}
.Container .innerContainer .container-4:before {
  top: 14%;
  left: 6%;
  height: 73%;
  width: 89%;
}
.Container .innerContainer .container-5 {
  left: 38%;
  width: 27rem;
}
.Container .innerContainer .container-5:before {
  top: 14%;
  left: 6%;
  height: 73%;
  width: 89%;
}
.Container .innerContainer .container-6 {
  left: 35%;
  width: 29.8rem;
}
.Container .innerContainer .container-6:before {
  top: 14%;
  left: 5%;
  height: 73%;
  width: 91%;
}
.Container .innerContainer .wrapper {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 22rem;
  height: 7rem;
  overflow: hidden;
  background: #333;
  -webkit-box-shadow: inset 0 0px 8px #000, 0 1px 0px 1px rgba(255, 255, 255, 0.4);
          box-shadow: inset 0 0px 8px #000, 0 1px 0px 1px rgba(255, 255, 255, 0.4);
  border-radius: 10px;
  text-align: center;
  color: var(--bs-background-light);
  text-shadow: -2px -2px 0 #aaa;
  font: 5rem/1.4 monaco, monospace;
}
.Container .innerContainer .wrapper-1 {
  width: 5rem;
}
.Container .innerContainer .wrapper-2 {
  width: 10rem;
}
.Container .innerContainer .wrapper-3 {
  width: 15rem;
}
.Container .innerContainer .wrapper-4 {
  width: 20rem;
}
.Container .innerContainer .wrapper-5 {
  width: 22rem;
}
.Container .innerContainer .wrapper-6 {
  width: 25rem;
}
.Container .innerContainer .board {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}
.Container .innerContainer .checkbox {
  display: none;
}
.Container .innerContainer .checkbox ~ .wrapper > .board {
  -webkit-animation-play-state: paused !important;
          animation-play-state: paused !important;
}
.Container .innerContainer .checkbox ~ .wrapper > .board.item1 {
  -webkit-animation: shuffle 1.3s steps(10) infinite;
          animation: shuffle 1.3s steps(10) infinite;
}
.Container .innerContainer .checkbox ~ .wrapper > .board.item2 {
  -webkit-animation: shuffle 1.1s steps(10) infinite;
          animation: shuffle 1.1s steps(10) infinite;
}
.Container .innerContainer .checkbox ~ .wrapper > .board.item3 {
  -webkit-animation: shuffle 0.9s steps(10) infinite;
          animation: shuffle 0.9s steps(10) infinite;
}
.Container .innerContainer .checkbox ~ .wrapper > .board.item4 {
  -webkit-animation: shuffle 1s steps(10) infinite;
          animation: shuffle 1s steps(10) infinite;
}
.Container .innerContainer .checkbox ~ .wrapper > .board.item5 {
  -webkit-animation: shuffle 0.8s steps(10) infinite;
          animation: shuffle 0.8s steps(10) infinite;
}
.Container .innerContainer .checkbox ~ .wrapper > .board.item6 {
  -webkit-animation: shuffle 1.15s steps(10) infinite;
          animation: shuffle 1.15s steps(10) infinite;
}
.Container .innerContainer .checkbox:checked ~ .handle:before {
  -webkit-transform: rotateX(180deg);
          transform: rotateX(180deg);
}
.Container .innerContainer .checkbox:checked ~ .handle:after {
  -webkit-transform: translateY(140px);
          transform: translateY(140px);
}
.Container .innerContainer .checkbox:checked ~ .wrapper > .board {
  -webkit-animation-play-state: running !important;
          animation-play-state: running !important;
}
.Container .innerContainer .handle {
  position: absolute;
  right: 0;
  top: 50%;
  cursor: pointer;
}
.Container .innerContainer .handle:before {
  content: "";
  position: absolute;
  bottom: 0;
  width: 20px;
  height: 60px;
  background: -webkit-gradient(linear, left top, right top, from(#bbb), color-stop(30%, #eee), to(#bbb));
  background: linear-gradient(to right, #bbb 0%, #eee 30%, #bbb 100%);
  border-radius: 0 0 10px 0;
  -webkit-transform-origin: bottom center;
          transform-origin: bottom center;
  -webkit-transition: -webkit-transform 0.2s ease;
  transition: -webkit-transform 0.2s ease;
  transition: transform 0.2s ease;
  transition: transform 0.2s ease, -webkit-transform 0.2s ease;
}
.Container .innerContainer .handle:after {
  content: "";
  position: absolute;
  bottom: 55px;
  left: -5px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-image: -webkit-gradient(linear, left bottom, right top, from(#ff7854), to(#ff5079));
  background-image: linear-gradient(to top right, #ff7854 0%, #ff5079 100%);
  -webkit-transform-origin: bottom center;
          transform-origin: bottom center;
  -webkit-transition: -webkit-transform 0.2s ease;
  transition: -webkit-transform 0.2s ease;
  transition: transform 0.2s ease;
  transition: transform 0.2s ease, -webkit-transform 0.2s ease;
}
.Container .innerContainer .randomNumberContainer {
  position: relative;
  min-height: calc(100vh - 0rem);
}

[data-theme=website] .Container .innerContainer .Container {
  max-width: 740px;
  margin: 0 auto;
  padding: 100px 0px;
  width: 100%;
  min-height: 100vh;
  background-color: var(--bs-background-light);
  position: relative;
}
[data-theme=website] .Container .innerContainer .Container .scrollDown {
  margin-top: -115px;
}
[data-theme=website] .Container .innerContainer .Container .innerContainer .container {
  width: -webkit-fit-content !important;
  width: -moz-fit-content !important;
  width: fit-content !important;
}
[data-theme=website] .Container .innerContainer .Container .innerContainer .infoContainer p input {
  background-color: var(--bs-background-light);
}
[data-theme=website] .Container .innerContainer .page-banner {
  padding-bottom: 150px;
  overflow: hidden;
}

.Container .innerContainer .wrapper {
  color: #fff;
}

.Container .innerContainer .randomNumberContainer {
  padding-top: 5rem;
}
.Container .innerContainer .randomNumberContainer .alert {
  max-width: 45rem;
  margin: 0 auto;
}
.Container .innerContainer .randomNumberContainer .alert input {
  margin: 0;
}