/* 
    Animations used in Pocket Island Mobile
*/
@-webkit-keyframes popOverlay {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.3);
  }
  50% {
    opacity: 1;
    -webkit-transform: scale(1.05);
  }
  70% {
    -webkit-transform: scale(0.9);
  }
  100% {
    -webkit-transform: scale(1);
  }
}
@-webkit-keyframes appear {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes bounce {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
  }
  100% {
    -webkit-transform: translate3d(20%, 0, 0);
  }
}
@-webkit-keyframes shake {
  from {
    -webkit-transform: rotate(0);
  }
  25% {
    -webkit-transform: rotate(-6deg);
  }
  75% {
    -webkit-transform: rotate(6deg);
  }
  to {
    -webkit-transform: rotate(0);
  }
}
@-webkit-keyframes blink-in {
  to {
    top: 12px;
    opacity: 1;
  }
}
@-webkit-keyframes blink-out {
  to {
    top: 0px;
    opacity: 0;
  }
}
@-webkit-keyframes revealandslideOutter {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes revealandslideInner {
  0% {
    width: 0;
  }
  10% {
    width: 0;
  }
  90% {
    width: 100%;
  }
  100% {
    width: 100%;
  }
}
@-webkit-keyframes fadePlusSlideUp {
  0% {
    margin-top: -100px;
  }
  10% {
    margin-top: -50px;
  }
  90% {
    margin-top: -50px;
  }
  100% {
    margin-top: -120px;
  }
}
@-webkit-keyframes floatUp {
  0% {
    margin-top: -50px;
  }
  100% {
    margin-top: -120px;
  }
}
@media all and (-webkit-min-device-pixel-ratio: 2) {
  @-webkit-keyframes floatUp {
    0% {
      margin-top: -100px;
    }
    100% {
      margin-top: -240px;
    }
  }
}
@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale(0.95);
  }
  to {
    -webkit-transform: scale(1.05);
  }
}
@-webkit-keyframes fadeout-unlockable {
  from {
    opacity: 1;
  }
  99% {
    display: block;
  }
  to {
    opacity: 0;
    display: none;
  }
}
@-moz-keyframes popOverlay {
  0% {
    opacity: 0;
    -moz-transform: scale(0.3);
  }
  50% {
    opacity: 1;
    -moz-transform: scale(1.05);
  }
  70% {
    -moz-transform: scale(0.9);
  }
  100% {
    -moz-transform: scale(1);
  }
}
@-moz-keyframes appear {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes bounce {
  0% {
    -moz-transform: translate3d(0, 0, 0);
  }
  100% {
    -moz-transform: translate3d(20%, 0, 0);
  }
}
@-moz-keyframes shake {
  from {
    -moz-transform: rotate(0);
  }
  25% {
    -moz-transform: rotate(-6deg);
  }
  75% {
    -moz-transform: rotate(6deg);
  }
  to {
    -moz-transform: rotate(0);
  }
}
@-moz-keyframes blink-in {
  to {
    top: 12px;
    opacity: 1;
  }
}
@-moz-keyframes blink-out {
  to {
    top: 0px;
    opacity: 0;
  }
}
@-moz-keyframes revealandslideOutter {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-moz-keyframes revealandslideInner {
  0% {
    width: 0;
  }
  10% {
    width: 0;
  }
  90% {
    width: 100%;
  }
  100% {
    width: 100%;
  }
}
@-moz-keyframes fadePlusSlideUp {
  0% {
    margin-top: -100px;
  }
  10% {
    margin-top: -50px;
  }
  90% {
    margin-top: -50px;
  }
  100% {
    margin-top: -120px;
  }
}
@-moz-keyframes floatUp {
  0% {
    margin-top: -50px;
  }
  100% {
    margin-top: -120px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 2) {
  @-moz-keyframes floatUp {
    0% {
      margin-top: -100px;
    }
    100% {
      margin-top: -240px;
    }
  }
}
@-moz-keyframes pulse {
  from {
    -moz-transform: scale(0.95);
  }
  to {
    -moz-transform: scale(1.05);
  }
}
@-moz-keyframes fadeout-unlockable {
  from {
    opacity: 1;
  }
  99% {
    display: block;
  }
  to {
    opacity: 0;
    display: none;
  }
}