* {
  box-sizing: border-box;
}

body {
  position: relative;
  background: #202125;
  height: 100vh;
  font-family: 'Open Sans';
}

.wall {
  position: absolute;
  top: 0;
  height: 80vh;
  width: 100%;
  background-color: #bd8578;
  border-bottom: 10px solid #a7412a;
  background-image: url("data:image/svg+xml,%3Csvg width='42' height='44' viewBox='0 0 42 44' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='Page-1' fill='none' fill-rule='evenodd'%3E%3Cg id='brick-wall' fill='%23000000' fill-opacity='0.4'%3E%3Cpath d='M0 0h42v44H0V0zm1 1h40v20H1V1zM0 23h20v20H0V23zm22 0h20v20H22V23z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.wall .board {
  border: 10px solid #15A8CC;
  height: 150px;
  width: 250px;
  position: absolute;
  top: 20%;
  background: #e0d7d7;
  right: 20%;
  box-sizing: border-box;
  font-family: Lato, cursive;
  padding: 10px 20px;
}
.wall .board:after {
  content: "";
  background: #f8e13b;
  width: 40px;
  height: 34px;
  -webkit-transform: rotate(8deg);
  transform: rotate(8deg);
  border-bottom: 3px solid #e9d01b;
  display: inline-block;
  position: absolute;
  bottom: -26px;
  left: 14px;
}
.wall .board:before {
  content: "";
  background: #f8e13b;
  width: 40px;
  height: 34px;
  -webkit-transform: rotate(-5deg);
  transform: rotate(-5deg);
  border-bottom: 3px solid #e9d01b;
  display: inline-block;
  position: absolute;
  bottom: -26px;
  left: 80px;
}
.wall h3 {
  margin: 0;
}
.wall ul {
  margin-top: 10px;
  padding-left: 3px;
}
.wall ul li {
  list-style: none;
}
.wall ul li:before {
  content: "-";
  margin-right: 5px;
}

.floor {
  position: absolute;
  bottom: 0;
  height: 20vh;
  width: 100%;
  background-color: #DFDBE5;
  background-image: linear-gradient(to bottom left, #6C7D73 20%, #759a4a 100%);
}

.wrapper {
  position: absolute;
  bottom: 10vh;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.bubble {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: -50%;
  margin: .5em auto;
  padding: 1em;
  width: 320px;
  height: 100px;
  border-radius: .25em;
  background: #629bdd;
  z-index: 5;
  -webkit-animation: pop-out 3s ease-in-out infinite;
          animation: pop-out 3s ease-in-out infinite;
}
.bubble:before {
  position: absolute;
  content: '';
  background: #629bdd;
  border: solid 0 transparent;
  border-right: solid 3.5em #629bdd;
  border-bottom: solid .25em #629bdd;
  bottom: 5px;
  right: 20px;
  width: 0;
  height: 1em;
  -webkit-transform: rotate(45deg) skewX(75deg);
          transform: rotate(45deg) skewX(75deg);
  z-index: -1;
}
.bubble .words {
  text-align: center;
  color: #fff;
  font-family: Bangers, cursive;
  letter-spacing: 1.5px;
  padding: 3px;
  font-size: 40px;
}

.washer {
  -webkit-perspective: 2700px;
          perspective: 2700px;
  position: relative;
  display: flex;
  align-items: center;
  margin: auto;
  width: 400px;
  height: 400px;
  border: 10px solid #B0B7C1;
  border-radius: 15%;
  background: #d8dde3;
  background: linear-gradient(to bottom, #d8dde3 0%, #f4f5f7 51%, #d8dde3 100%);
  box-shadow: inset 0px 3px 0px 0px #C8CFD8;
}
.washer:before, .washer:after {
  content: '';
  position: absolute;
  bottom: -20px;
  width: 25px;
  height: 10px;
  background: #666869;
  border-radius: 20%;
}
.washer:before {
  right: 20%;
}
.washer:after {
  left: 20%;
  background: #666869;
  border-radius: 20%;
}
.washer .top {
  display: flex;
  position: absolute;
  top: 0;
  height: 85px;
  width: 100%;
  border-bottom: 3px solid #9096A5;
  box-shadow: inset 0px -1px 0px 0px #C3C7CF, 0px 1px 0px 0px #C3C7CF;
}
.washer .top .lside, .washer .top .rside {
  display: inline-block;
  height: 100%;
}
.washer .top .lside {
  width: 36%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-right: 3px solid #A3A9BC;
}
.washer .top .lside .tray {
  width: 85px;
  height: 25px;
  border-radius: 5px;
  border: 3px solid #848C96;
  background: #9da5ae;
  background: linear-gradient(to bottom, #9da5ae 0%, #d4d7db 100%);
  box-shadow: 0px 2px 3px white, 0px -2px 0px #D4D8DD;
}
.washer .top .rside {
  width: 62.95%;
  display: flex;
  align-items: center;
}
.washer .top .rside .display {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 82px;
  height: 57px;
  background: #494949;
  border-radius: 10%;
  margin-left: 13px;
}
.washer .top .rside .display h1 {
  font-family: Orbitron;
  font-size: 1.5em;
  text-transform: uppercase;
  color: #ff578f;
  text-shadow: 0 0 10px rgba(255, 69, 131, 0.5);
}
.washer .top .rside .display .on {
  color: #32ff32;
  text-shadow: 0 0 10px rgba(26, 255, 179, 0.5);
}
.washer .top .rside .knobs {
  margin-left: 4px;
}
.washer .top .rside .knob {
  margin: 7px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  border: 1px solid #5A5E69;
  box-shadow: 0px 0px 1px 2px #C1C9D3, 0px 1px 1px 2px #F9FAFB, 0px -0.5px 1px 2px #97A2AD;
  background-image: radial-gradient(circle at top center, white, #969FA8);
}
.washer .top .rside .kn-one {
  background-image: radial-gradient(circle at top center, white, #90ce47);
}
.washer .top .rside .kn-two {
  background-image: radial-gradient(circle at top center, white, #ff8c57);
}
.washer .top .rside .kn-three {
  background-image: radial-gradient(circle at top center, white, #57e2ff);
}
.washer .bottom {
  display: flex;
  position: absolute;
  bottom: 0;
  height: 50px;
  width: 100%;
  border-top: 3px solid #9096A5;
  box-shadow: inset 0px 1px 0px 0px #C3C7CF, 0px -1px 0px 0px #C3C7CF;
}
.washer .bottom .lside, .washer .bottom .rside {
  display: inline-block;
  height: 100%;
}
.washer .bottom .lside:before, .washer .bottom .rside:before {
  content: '';
  position: absolute;
  top: 0;
  height: 3px;
  background: rgba(252, 252, 252, 0);
  background: linear-gradient(to right, rgba(252, 252, 252, 0) 0%, rgba(247, 248, 249, 0.46) 25%, #f2f4f5 50%, rgba(248, 247, 246, 0.38) 82%, rgba(252, 248, 247, 0) 100%);
}
.washer .bottom .lside {
  width: 67%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-right: 3px solid #A3A9BC;
}
.washer .bottom .lside:before {
  left: 0;
  width: 67%;
}
.washer .bottom .rside {
  width: 33%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.washer .bottom .rside:before {
  right: 0;
  width: 33%;
}
.washer .middle {
  height: 245px;
  width: 100%;
  position: absolute;
  top: 85px;
  left: 0;
}
.washer .middle .backside {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  border-radius: 50%;
  width: 245px;
  height: 245px;
  background: #494949;
  z-index: 1;
  box-shadow: inset 0 0 1px 7px #B0B7C1;
}
.washer .middle .backside:after {
  content: '';
  position: absolute;
  width: 15px;
  height: 50px;
  background-image: repeating-linear-gradient(to left, #aaa59f 0%, #54514c 50%, #54514c 60%, #f7f6f2 70%, #f7f6f2 79%, #54514c 100%);
  border: 2px solid #4E4F54;
  left: 0px;
  top: 50%;
  border-radius: 20%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.washer .middle .door {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 245px;
  height: 245px;
  z-index: 3;
  -webkit-transform: translate(-50%, -50%) perspective(3000px) rotateY(0deg);
          transform: translate(-50%, -50%) perspective(3000px) rotateY(0deg);
  -webkit-transform-origin: 1% 100%;
          transform-origin: 1% 100%;
  transition: all 2s;
  cursor: pointer;
}
.washer .middle .door .st0 {
  fill: none;
  stroke: url(#inner_1_);
  stroke-width: 10;
  stroke-miterlimit: 10;
}
.washer .middle .door .st1 {
  fill: none;
  stroke: url(#door_1_);
  stroke-width: 20;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-miterlimit: 10;
}
.washer .middle .door .st2 {
  fill: #FFFFFF;
}
.washer .middle .door .st3 {
  fill: none;
  stroke: #636571;
  stroke-width: 2;
  stroke-miterlimit: 10;
}
.washer .middle .door:before {
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  content: '';
  position: absolute;
  background: #d8e7e6;
  width: 195px;
  height: 195px;
  border-radius: 50%;
  z-index: -1;
  opacity: 0.7;
}
.washer .middle .door .mount {
  content: '';
  position: absolute;
  width: 15px;
  height: 50px;
  background: #a1a2ab;
  border: 2px solid #4E4F54;
  left: 0px;
  top: 50%;
  border-radius: 20%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.washer .middle .door .mount:before {
  content: '';
  position: absolute;
  bottom: 15%;
  left: 35%;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: white;
}
.washer .middle .door .mount:after {
  content: '';
  position: absolute;
  top: 15%;
  left: 35%;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: white;
}
.washer .middle .door .dropflare {
  box-shadow: inset 20px 0px 5px white;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  position: absolute;
  width: 195px;
  height: 195px;
  border-radius: 50%;
  opacity: 0.5;
}
.washer .middle .open {
  -webkit-transform: translate(-50%, -50%) perspective(3000px) rotateY(180deg);
          transform: translate(-50%, -50%) perspective(3000px) rotateY(180deg);
}
.washer .middle .owl {
  position: absolute;
  height: 200px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 225px;
  z-index: 2;
}

.shaking {
  -webkit-animation: shake ease-in-out 2s  infinite;
          animation: shake ease-in-out 2s  infinite;
}

.active .dial i {
  color: #0095ff;
}

.outer {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 34px;
  width: 65px;
  height: 65px;
  border-radius: 50%;
  box-shadow: 0px 3px 2px -2px #F9FAFB, inset 0px 1px 4px 1px #97A2AD;
  background: #BAC2CD;
  position: relative;
}
.outer.active:before {
  -webkit-animation: 0.7s linear infinite circle-spin;
          animation: 0.7s linear infinite circle-spin;
  -webkit-animation-fill-mode: forwards;
}
.outer:before {
  top: 0;
  left: 0;
  border-width: 3.33333px;
  content: " ";
  width: 45px;
  height: 45px;
  display: block;
  border-radius: 50%;
  border: 10px solid white;
  position: absolute;
  border-color: #0095ff #fcd000 #AE63E4 #47CF73;
  pointer-events: none;
}
.outer .dial {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 45px;
  height: 45px;
  border: 3px solid #555763;
  border-radius: 50%;
  cursor: pointer;
  background: linear-gradient(to bottom, #e8e9eb 0%, #a8adb5 100%);
}
.outer .dial:active {
  -webkit-transform: translateY(2px);
          transform: translateY(2px);
}
.outer .dial i {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  text-shadow: 0px 1px 2px white;
}
.outer span {
  position: absolute;
  font-size: 7px;
  font-family: Lato;
  font-weight: bold;
}
.outer span:after {
  content: '';
  width: 3px;
  height: 3px;
  background: black;
  border-radius: 50%;
  position: absolute;
  right: -5px;
  top: 35%;
}
.outer span:nth-of-type(1) {
  left: -37px;
  top: 9px;
}
.outer span:nth-of-type(2) {
  left: -34px;
  top: 26px;
}
.outer span:nth-of-type(3) {
  left: -27px;
  top: 44px;
}
.outer span:nth-of-type(4) {
  left: -12px;
  top: 59px;
}

@-webkit-keyframes circle-spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes circle-spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
.veins {
  transition: all 3s;
}

.lwing {
  -webkit-animation: shake-left-wing 4s infinite;
          animation: shake-left-wing 4s infinite;
  -webkit-transform-origin: 68% 11%;
          transform-origin: 68% 11%;
}

.rwing {
  -webkit-animation: shake-right-wing 4s infinite;
          animation: shake-right-wing 4s infinite;
  -webkit-transform-origin: 34% 9%;
          transform-origin: 34% 9%;
}

.rleg {
  -webkit-animation: angry-foot 4s infinite;
          animation: angry-foot 4s infinite;
}

.lleg {
  -webkit-animation: angry-foot 4s infinite;
          animation: angry-foot 4s infinite;
  -webkit-animation-delay: 3s;
          animation-delay: 3s;
}

.rear {
  -webkit-animation: right-ear 4s infinite;
          animation: right-ear 4s infinite;
  -webkit-transform-origin: 0% 100%;
          transform-origin: 0% 100%;
}

.lear {
  -webkit-animation: left-ear 4s infinite;
          animation: left-ear 4s infinite;
  -webkit-transform-origin: 100% 100%;
          transform-origin: 100% 100%;
}

.leye, .reye {
  -webkit-animation: blink 5s infinite;
          animation: blink 5s infinite;
  -webkit-transform-origin: center center;
          transform-origin: center center;
  transition: all 2s;
}

.pupil {
  -webkit-animation: look-aside 10s infinite alternate;
          animation: look-aside 10s infinite alternate;
  -webkit-transform-origin: center center;
          transform-origin: center center;
}

.free {
  -webkit-animation: free 7s;
          animation: free 7s;
  -webkit-animation-iteration-count: 1;
          animation-iteration-count: 1;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}

.lflitter {
  -webkit-animation: lflitter 0.5s infinite;
          animation: lflitter 0.5s infinite;
  -webkit-transform-origin: 68% 11%;
          transform-origin: 68% 11%;
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}

.rflitter {
  -webkit-animation: rflitter 0.5s infinite;
          animation: rflitter 0.5s infinite;
  -webkit-transform-origin: 34% 9%;
          transform-origin: 34% 9%;
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}

.rotate {
  -webkit-animation: rotate 6s infinite;
          animation: rotate 6s infinite;
  -webkit-animation-iteration-count: 1;
          animation-iteration-count: 1;
  -webkit-animation-timing-function: cubic-bezier(0.72, 0.08, 0.36, 0.98);
          animation-timing-function: cubic-bezier(0.72, 0.08, 0.36, 0.98);
}

.googley {
  -webkit-transform: scale(1.3);
          transform: scale(1.3);
  -webkit-animation-iteration-count: 1;
          animation-iteration-count: 1;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

.lwing, .rwing, .rleg, .lleg, .rear, .lear, .leye, .reye, .pupil, .lflitter, .rflitter {
  transform-box: fill-box;
}

@-webkit-keyframes shake-left-wing {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  10% {
    -webkit-transform: rotate(120deg);
            transform: rotate(120deg);
  }
  15% {
    -webkit-transform: rotate(100deg);
            transform: rotate(100deg);
  }
  20% {
    -webkit-transform: rotate(120deg);
            transform: rotate(120deg);
  }
  25% {
    -webkit-transform: rotate(100deg);
            transform: rotate(100deg);
  }
  30% {
    -webkit-transform: rotate(120deg);
            transform: rotate(120deg);
  }
  35% {
    -webkit-transform: rotate(100deg);
            transform: rotate(100deg);
  }
  45% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}

@keyframes shake-left-wing {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  10% {
    -webkit-transform: rotate(120deg);
            transform: rotate(120deg);
  }
  15% {
    -webkit-transform: rotate(100deg);
            transform: rotate(100deg);
  }
  20% {
    -webkit-transform: rotate(120deg);
            transform: rotate(120deg);
  }
  25% {
    -webkit-transform: rotate(100deg);
            transform: rotate(100deg);
  }
  30% {
    -webkit-transform: rotate(120deg);
            transform: rotate(120deg);
  }
  35% {
    -webkit-transform: rotate(100deg);
            transform: rotate(100deg);
  }
  45% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}
@-webkit-keyframes shake-right-wing {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  50% {
    -webkit-transform: rotate(-5deg);
            transform: rotate(-5deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}
@keyframes shake-right-wing {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  50% {
    -webkit-transform: rotate(-5deg);
            transform: rotate(-5deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}
@-webkit-keyframes angry-foot {
  0% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  5% {
    -webkit-transform: translateY(-5px);
            transform: translateY(-5px);
  }
  10% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  15% {
    -webkit-transform: translateY(-5px);
            transform: translateY(-5px);
  }
  20% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  100% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}
@keyframes angry-foot {
  0% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  5% {
    -webkit-transform: translateY(-5px);
            transform: translateY(-5px);
  }
  10% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  15% {
    -webkit-transform: translateY(-5px);
            transform: translateY(-5px);
  }
  20% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  100% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}
@-webkit-keyframes right-ear {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  30% {
    -webkit-transform: rotate(30deg);
            transform: rotate(30deg);
  }
  100% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}
@keyframes right-ear {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  30% {
    -webkit-transform: rotate(30deg);
            transform: rotate(30deg);
  }
  100% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}
@-webkit-keyframes left-ear {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  30% {
    -webkit-transform: rotate(-30deg);
            transform: rotate(-30deg);
  }
  100% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}
@keyframes left-ear {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  30% {
    -webkit-transform: rotate(-30deg);
            transform: rotate(-30deg);
  }
  100% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}
@-webkit-keyframes blink {
  40% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
  }
  45% {
    -webkit-transform: scaleY(0.1);
            transform: scaleY(0.1);
  }
  50% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
  }
}
@keyframes blink {
  40% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
  }
  45% {
    -webkit-transform: scaleY(0.1);
            transform: scaleY(0.1);
  }
  50% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
  }
}
@-webkit-keyframes look-aside {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  10% {
    -webkit-transform: rotate(50deg);
            transform: rotate(50deg);
  }
  40% {
    -webkit-transform: rotate(50deg);
            transform: rotate(50deg);
  }
  50% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}
@keyframes look-aside {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  10% {
    -webkit-transform: rotate(50deg);
            transform: rotate(50deg);
  }
  40% {
    -webkit-transform: rotate(50deg);
            transform: rotate(50deg);
  }
  50% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}
@-webkit-keyframes pop-out {
  0% {
    -webkit-transform: rotate(-4deg) rotateY(35deg) scale3d(0, 0, 1);
            transform: rotate(-4deg) rotateY(35deg) scale3d(0, 0, 1);
    opacity: 1;
  }
  25% {
    -webkit-transform: rotate(-4deg) rotateY(35deg) scale3d(1, 1, 1);
            transform: rotate(-4deg) rotateY(35deg) scale3d(1, 1, 1);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-4deg) rotateY(35deg) scale3d(1.5, 1.5, 1);
            transform: rotate(-4deg) rotateY(35deg) scale3d(1.5, 1.5, 1);
    opacity: 0;
  }
}
@keyframes pop-out {
  0% {
    -webkit-transform: rotate(-4deg) rotateY(35deg) scale3d(0, 0, 1);
            transform: rotate(-4deg) rotateY(35deg) scale3d(0, 0, 1);
    opacity: 1;
  }
  25% {
    -webkit-transform: rotate(-4deg) rotateY(35deg) scale3d(1, 1, 1);
            transform: rotate(-4deg) rotateY(35deg) scale3d(1, 1, 1);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-4deg) rotateY(35deg) scale3d(1.5, 1.5, 1);
            transform: rotate(-4deg) rotateY(35deg) scale3d(1.5, 1.5, 1);
    opacity: 0;
  }
}
@-webkit-keyframes free {
  0% {
    -webkit-transform: translate(-50%, -50%) translateY(0px);
            transform: translate(-50%, -50%) translateY(0px);
  }
  20% {
    -webkit-transform: translate(-50%, -50%) translateY(-50px);
            transform: translate(-50%, -50%) translateY(-50px);
  }
  25% {
    -webkit-transform: translate(-50%, -50%) translateY(-45px);
            transform: translate(-50%, -50%) translateY(-45px);
  }
  100% {
    -webkit-transform: translate(-50%, -50%) translateY(-1000px);
            transform: translate(-50%, -50%) translateY(-1000px);
  }
}
@keyframes free {
  0% {
    -webkit-transform: translate(-50%, -50%) translateY(0px);
            transform: translate(-50%, -50%) translateY(0px);
  }
  20% {
    -webkit-transform: translate(-50%, -50%) translateY(-50px);
            transform: translate(-50%, -50%) translateY(-50px);
  }
  25% {
    -webkit-transform: translate(-50%, -50%) translateY(-45px);
            transform: translate(-50%, -50%) translateY(-45px);
  }
  100% {
    -webkit-transform: translate(-50%, -50%) translateY(-1000px);
            transform: translate(-50%, -50%) translateY(-1000px);
  }
}
@-webkit-keyframes lflitter {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  50% {
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}
@keyframes lflitter {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  50% {
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}
@-webkit-keyframes rflitter {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  50% {
    -webkit-transform: rotate(-100deg);
            transform: rotate(-100deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}
@keyframes rflitter {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  50% {
    -webkit-transform: rotate(-100deg);
            transform: rotate(-100deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}
@-webkit-keyframes rotate {
  0% {
    -webkit-transform: translate(-50%, -50%) rotate(0deg);
            transform: translate(-50%, -50%) rotate(0deg);
  }
  100% {
    -webkit-transform: translate(-50%, -50%) rotate(3600deg);
            transform: translate(-50%, -50%) rotate(3600deg);
  }
}
@keyframes rotate {
  0% {
    -webkit-transform: translate(-50%, -50%) rotate(0deg);
            transform: translate(-50%, -50%) rotate(0deg);
  }
  100% {
    -webkit-transform: translate(-50%, -50%) rotate(3600deg);
            transform: translate(-50%, -50%) rotate(3600deg);
  }
}
@-webkit-keyframes shake {
  2% {
    -webkit-transform: translate(0px, 0px) rotate(0.5deg);
            transform: translate(0px, 0px) rotate(0.5deg);
  }
  4% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  6% {
    -webkit-transform: translate(0px, 0px) rotate(0.5deg);
            transform: translate(0px, 0px) rotate(0.5deg);
  }
  8% {
    -webkit-transform: translate(0px, 0px) rotate(0.5deg);
            transform: translate(0px, 0px) rotate(0.5deg);
  }
  10% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  12% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  14% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  16% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  18% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  20% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  22% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  24% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  26% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  28% {
    -webkit-transform: translate(0px, 0px) rotate(0.5deg);
            transform: translate(0px, 0px) rotate(0.5deg);
  }
  30% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  32% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  34% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  36% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  38% {
    -webkit-transform: translate(0px, 0px) rotate(0.5deg);
            transform: translate(0px, 0px) rotate(0.5deg);
  }
  40% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  42% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  44% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  46% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  48% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  50% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  52% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  54% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  56% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  58% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  60% {
    -webkit-transform: translate(0px, 0px) rotate(0.5deg);
            transform: translate(0px, 0px) rotate(0.5deg);
  }
  62% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  64% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  66% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  68% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  70% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  72% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  74% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  76% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  78% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  80% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  82% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  84% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  86% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  88% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  90% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  92% {
    -webkit-transform: translate(0px, 0px) rotate(0.5deg);
            transform: translate(0px, 0px) rotate(0.5deg);
  }
  94% {
    -webkit-transform: translate(0px, 0px) rotate(0.5deg);
            transform: translate(0px, 0px) rotate(0.5deg);
  }
  96% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  98% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  0%,100% {
    -webkit-transform: translate(0, 0) rotate(0);
            transform: translate(0, 0) rotate(0);
  }
}
@keyframes shake {
  2% {
    -webkit-transform: translate(0px, 0px) rotate(0.5deg);
            transform: translate(0px, 0px) rotate(0.5deg);
  }
  4% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  6% {
    -webkit-transform: translate(0px, 0px) rotate(0.5deg);
            transform: translate(0px, 0px) rotate(0.5deg);
  }
  8% {
    -webkit-transform: translate(0px, 0px) rotate(0.5deg);
            transform: translate(0px, 0px) rotate(0.5deg);
  }
  10% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  12% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  14% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  16% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  18% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  20% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  22% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  24% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  26% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  28% {
    -webkit-transform: translate(0px, 0px) rotate(0.5deg);
            transform: translate(0px, 0px) rotate(0.5deg);
  }
  30% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  32% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  34% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  36% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  38% {
    -webkit-transform: translate(0px, 0px) rotate(0.5deg);
            transform: translate(0px, 0px) rotate(0.5deg);
  }
  40% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  42% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  44% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  46% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  48% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  50% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  52% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  54% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  56% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  58% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  60% {
    -webkit-transform: translate(0px, 0px) rotate(0.5deg);
            transform: translate(0px, 0px) rotate(0.5deg);
  }
  62% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  64% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  66% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  68% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  70% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  72% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  74% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  76% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  78% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  80% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  82% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  84% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  86% {
    -webkit-transform: translate(0px, 1px) rotate(0.5deg);
            transform: translate(0px, 1px) rotate(0.5deg);
  }
  88% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  90% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  92% {
    -webkit-transform: translate(0px, 0px) rotate(0.5deg);
            transform: translate(0px, 0px) rotate(0.5deg);
  }
  94% {
    -webkit-transform: translate(0px, 0px) rotate(0.5deg);
            transform: translate(0px, 0px) rotate(0.5deg);
  }
  96% {
    -webkit-transform: translate(1px, 1px) rotate(0.5deg);
            transform: translate(1px, 1px) rotate(0.5deg);
  }
  98% {
    -webkit-transform: translate(1px, 0px) rotate(0.5deg);
            transform: translate(1px, 0px) rotate(0.5deg);
  }
  0%,100% {
    -webkit-transform: translate(0, 0) rotate(0);
            transform: translate(0, 0) rotate(0);
  }
}