@charset "UTF-8";
* {
  margin: 0;
  padding: 0;
  border: none; }

html, body {
  width: 100%;
  height: 100%;
  background-color: #f5e559;
  position: relative; }

.hello {
  position: absolute;
  left: 50%;
  width: 35%;
  z-index: 99999;
  font-size: 20px;
  line-height: 26px;
  letter-spacing: 2px;
  color: #fff;
  font-family: '微軟正黑體', 'Microsoft Jhenghei';
  background-color: #222;
  margin: 0;
  padding: 10px 20px;
  border-radius: 10px; }

.hello_1 {
  top: 35%;
  -webkit-animation: hello 1s 2s both;
  animation: hello 1s 2s both; }
  .hello_1:before {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 20px 0 0;
    border-color: #222 transparent transparent transparent;
    position: absolute;
    top: 80%;
    left: 0;
    -webkit-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    transform: rotate(15deg); }

.hello_2 {
  top: 45%;
  -webkit-animation: hello 1s 3s both;
  animation: hello 1s 3s both; }
  .hello_2:before {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 20px 20px 0;
    border-color: transparent #222 transparent transparent;
    position: absolute;
    top: 80%;
    right: 0;
    -webkit-transform: rotate(-15deg);
    -ms-transform: rotate(-15deg);
    transform: rotate(-15deg); }

.hello_3 {
  top: 55%;
  -webkit-animation: hello 1s 4s both;
  animation: hello 1s 4s both; }
  .hello_3:before {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 20px 0 0;
    border-color: #222 transparent transparent transparent;
    position: absolute;
    top: 90%;
    left: 0;
    -webkit-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    transform: rotate(15deg); }

@-webkit-keyframes hello {
  0% {
    -webkit-transform: translate(-50%, 100%);
    transform: translate(-50%, 100%);
    opacity: 0; }
  100% {
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    opacity: 0.9; } }

@keyframes hello {
  0% {
    -webkit-transform: translate(-50%, 100%);
    transform: translate(-50%, 100%);
    opacity: 0; }
  100% {
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    opacity: 0.9; } }

.content {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative; }
  .content img.background {
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 0; }
  .content img.top {
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 40%;
    -webkit-animation: top_in 1.2s;
    animation: top_in 1.2s; }
  .content img.left {
    position: absolute;
    left: 0;
    height: 100%;
    -webkit-animation: left_in 1.5s;
    animation: left_in 1.5s; }
  .content img.right {
    position: absolute;
    right: 0;
    height: 100%;
    -webkit-animation: right_in 1.5s;
    animation: right_in 1.5s; }
  .content .cloud {
    position: absolute;
    z-index: 999; }
  .content .L1 {
    left: 5%;
    top: 30%;
    -webkit-animation: LtoR 4s infinite linear;
    animation: LtoR 4s infinite linear; }
  .content .L2 {
    left: -5%;
    bottom: 15%;
    -webkit-animation: LtoR 6s infinite linear;
    animation: LtoR 6s infinite linear; }
  .content .R1 {
    right: 10%;
    top: 15%;
    -webkit-animation: RtoL 4s infinite linear;
    animation: RtoL 4s infinite linear; }
  .content .R2 {
    right: -10%;
    bottom: 0;
    -webkit-animation: RtoL 6s infinite linear;
    animation: RtoL 6s infinite linear; }

img.light {
  display: none;
  position: absolute;
  left: 50%;
  top: 60%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 999;
  -webkit-animation: rotate 4s 2s linear both;
  animation: rotate 4s 2s linear both; }

.boxer {
  width: 80%;
  height: 80%;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }
  .boxer .main_stick {
    width: 5%;
    position: absolute;
    left: 50%;
    top: 60%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 99999;
    display: none; }
    .boxer .main_stick img {
      width: 100%; }
  .boxer .Dbox {
    width: 20%;
    position: absolute;
    left: 50%;
    top: 60%;
    -webkit-transform: translate(-50%, -10%);
    -ms-transform: translate(-50%, -10%);
    transform: translate(-50%, -10%);
    cursor: pointer;
    -webkit-transition: 1s;
    -o-transition: 1s;
    transition: 1s;
    z-index: 222; }
    .boxer .Dbox img.bunch {
      width: 100%;
      position: absolute;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%);
      top: -50%;
      z-index: -1; }
    .boxer .Dbox img.stick {
      width: 20%;
      position: absolute;
      left: 50%;
      top: 50%;
      -webkit-transform: translate(-50%, -80%);
      -ms-transform: translate(-50%, -80%);
      transform: translate(-50%, -80%);
      z-index: -1; }
    .boxer .Dbox img.box {
      width: 100%; }
    .boxer .Dbox:hover > .bunch {
      -webkit-animation: bunch_shake_setting 1.2s linear infinite;
      animation: bunch_shake_setting 1.2s linear infinite; }
    .boxer .Dbox:hover > .stick {
      -webkit-animation: stick_shake_setting 1.2s linear infinite;
      animation: stick_shake_setting 1.2s linear infinite; }
    .boxer .Dbox:hover > .box {
      -webkit-animation: box_shake_setting 1.2s linear infinite;
      animation: box_shake_setting 1.2s linear infinite; }
    .boxer .Dbox:hover > .shadow {
      -webkit-animation: shadow_shake 1.2s linear infinite;
      animation: shadow_shake 1.2s linear infinite; }
    .boxer .Dbox .shadow {
      width: 95%;
      height: 20px;
      border-radius: 50%;
      background-color: #eab13f;
      position: absolute;
      bottom: -5px;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%);
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s;
      z-index: -1;
      opacity: 0.7; }
    .boxer .Dbox .notice {
      width: 100px;
      height: 100px;
      border-radius: 50%;
      background-color: red;
      position: absolute;
      left: 50%;
      top: 50%;
      z-index: 999; }
  .boxer .lang {
    display: none;
    width: 50%;
    position: absolute;
    right: 25%;
    bottom: 0; }
    .boxer .lang img {
      width: 100%; }
    .boxer .lang p {
      display: inline-block;
      margin-top: 10px;
      margin-right: 20px;
      font-size: 18px;
      color: #347;
      font-family: '微軟正黑體', 'Microsoft Jhenghei';
      font-weight: 600;
      cursor: pointer; }
      .boxer .lang p:hover {
        color: #e83c1a; }
      .boxer .lang p a {
        text-decoration: none;
        color: #347; }
        .boxer .lang p a:hover {
          color: #e83c1a; }
    .boxer .lang p.note {
      font-size: 14px;
      opacity: 0.9; }

@media screen and (max-width: 1024px) {
  .content img.top {
    width: 50%; }
  .boxer {
    height: 100%; }
    .boxer .Dbox {
      width: 30%; }
    .boxer .main_stick {
      width: 10%; }
    .boxer .lang {
      width: 60%;
      right: 15%; } }

@media screen and (max-width: 480px) {
  .content img.top {
    width: 80%; }
  .content img.left, .content img.right {
    display: none; }
  img.light {
    top: 40%; }
  .boxer {
    height: 100%; }
    .boxer .Dbox {
      width: 60%; }
    .boxer .main_stick {
      width: 15%;
      top: 40%; }
    .boxer .lang {
      width: 100%;
      right: 0; } }

@media screen and (max-width: 320px) {
  img.light {
    top: 40%; }
  .boxer .main_stick {
    width: 10%;
    top: 40%; } }

@-webkit-keyframes top_in {
  0% {
    top: -30%; }
  100% {
    top: 0; } }

@keyframes top_in {
  0% {
    top: -30%; }
  100% {
    top: 0; } }

@-webkit-keyframes left_in {
  0% {
    left: -30%; }
  100% {
    left: 0; } }

@keyframes left_in {
  0% {
    left: -30%; }
  100% {
    left: 0; } }

@-webkit-keyframes right_in {
  0% {
    right: -30%; }
  100% {
    right: 0; } }

@keyframes right_in {
  0% {
    right: -30%; }
  100% {
    right: 0; } }

@-webkit-keyframes rotate {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -50%) rotate(0deg);
    transform: translate(-50%, -50%) rotate(0deg); }
  25% {
    opacity: 0.8;
    -webkit-transform: translate(-50%, -50%) rotate(90deg);
    transform: translate(-50%, -50%) rotate(90deg); }
  100% {
    -webkit-transform: translate(-50%, -50%) rotate(360deg);
    transform: translate(-50%, -50%) rotate(360deg); } }

@keyframes rotate {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -50%) rotate(0deg);
    transform: translate(-50%, -50%) rotate(0deg); }
  25% {
    opacity: 0.8;
    -webkit-transform: translate(-50%, -50%) rotate(90deg);
    transform: translate(-50%, -50%) rotate(90deg); }
  100% {
    -webkit-transform: translate(-50%, -50%) rotate(360deg);
    transform: translate(-50%, -50%) rotate(360deg); } }

@-webkit-keyframes slide {
  0% {
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }
  100% {
    -webkit-transform: translate(0%, -50%);
    transform: translate(0%, -50%); } }

@keyframes slide {
  0% {
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }
  100% {
    -webkit-transform: translate(0%, -50%);
    transform: translate(0%, -50%); } }

@-webkit-keyframes LtoR {
  0% {
    -webkit-transform: translateX(0) scale(0.6);
    transform: translateX(0) scale(0.6);
    opacity: 0; }
  20% {
    -webkit-transform: translateX(20%) scale(0.6);
    transform: translateX(20%) scale(0.6);
    opacity: 0.8; }
  60% {
    -webkit-transform: translateX(60%) scale(0.6);
    transform: translateX(60%) scale(0.6);
    opacity: 0.8; }
  100% {
    -webkit-transform: translateX(100%) scale(0.6);
    transform: translateX(100%) scale(0.6);
    opacity: 0; } }

@keyframes LtoR {
  0% {
    -webkit-transform: translateX(0) scale(0.6);
    transform: translateX(0) scale(0.6);
    opacity: 0; }
  20% {
    -webkit-transform: translateX(20%) scale(0.6);
    transform: translateX(20%) scale(0.6);
    opacity: 0.8; }
  60% {
    -webkit-transform: translateX(60%) scale(0.6);
    transform: translateX(60%) scale(0.6);
    opacity: 0.8; }
  100% {
    -webkit-transform: translateX(100%) scale(0.6);
    transform: translateX(100%) scale(0.6);
    opacity: 0; } }

@-webkit-keyframes RtoL {
  0% {
    -webkit-transform: translateX(0) scale(0.6);
    transform: translateX(0) scale(0.6);
    opacity: 0; }
  20% {
    -webkit-transform: translateX(-20%) scale(0.6);
    transform: translateX(-20%) scale(0.6);
    opacity: 0.8; }
  60% {
    -webkit-transform: translateX(-60%) scale(0.6);
    transform: translateX(-60%) scale(0.6);
    opacity: 0.8; }
  100% {
    -webkit-transform: translateX(-100%) scale(0.6);
    transform: translateX(-100%) scale(0.6);
    opacity: 0; } }

@keyframes RtoL {
  0% {
    -webkit-transform: translateX(0) scale(0.6);
    transform: translateX(0) scale(0.6);
    opacity: 0; }
  20% {
    -webkit-transform: translateX(-20%) scale(0.6);
    transform: translateX(-20%) scale(0.6);
    opacity: 0.8; }
  60% {
    -webkit-transform: translateX(-60%) scale(0.6);
    transform: translateX(-60%) scale(0.6);
    opacity: 0.8; }
  100% {
    -webkit-transform: translateX(-100%) scale(0.6);
    transform: translateX(-100%) scale(0.6);
    opacity: 0; } }

@-webkit-keyframes stick_shake_setting {
  0% {
    -webkit-transform: translate(-50%, -80%) rotate(0deg);
    transform: translate(-50%, -80%) rotate(0deg); }
  20% {
    -webkit-transform: translate(-52%, -84%) rotate(-3deg);
    transform: translate(-52%, -84%) rotate(-3deg); }
  40% {
    -webkit-transform: translate(-55%, -86%) rotate(-4deg);
    transform: translate(-55%, -86%) rotate(-4deg); }
  60% {
    -webkit-transform: translate(-44%, -84%) rotate(6deg);
    transform: translate(-44%, -84%) rotate(6deg); }
  80% {
    -webkit-transform: translate(-46%, -82%) rotate(4deg);
    transform: translate(-46%, -82%) rotate(4deg); }
  100% {
    -webkit-transform: translate(-50%, -80%) rotate(0deg);
    transform: translate(-50%, -80%) rotate(0deg); } }

@keyframes stick_shake_setting {
  0% {
    -webkit-transform: translate(-50%, -80%) rotate(0deg);
    transform: translate(-50%, -80%) rotate(0deg); }
  20% {
    -webkit-transform: translate(-52%, -84%) rotate(-3deg);
    transform: translate(-52%, -84%) rotate(-3deg); }
  40% {
    -webkit-transform: translate(-55%, -86%) rotate(-4deg);
    transform: translate(-55%, -86%) rotate(-4deg); }
  60% {
    -webkit-transform: translate(-44%, -84%) rotate(6deg);
    transform: translate(-44%, -84%) rotate(6deg); }
  80% {
    -webkit-transform: translate(-46%, -82%) rotate(4deg);
    transform: translate(-46%, -82%) rotate(4deg); }
  100% {
    -webkit-transform: translate(-50%, -80%) rotate(0deg);
    transform: translate(-50%, -80%) rotate(0deg); } }

@-webkit-keyframes bunch_shake_setting {
  0% {
    -webkit-transform: translate(-50%, 0) rotate(0deg);
    transform: translate(-50%, 0) rotate(0deg); }
  25% {
    -webkit-transform: translate(-54%, -2%) rotate(-5deg);
    transform: translate(-54%, -2%) rotate(-5deg); }
  40% {
    -webkit-transform: translate(-57%, -5%) rotate(-6deg);
    transform: translate(-57%, -5%) rotate(-6deg); }
  45% {
    -webkit-transform: translate(-57%, -5%) rotate(-6deg);
    transform: translate(-57%, -5%) rotate(-6deg); }
  70% {
    -webkit-transform: translate(-42%, -3%) rotate(6deg);
    transform: translate(-42%, -3%) rotate(6deg); }
  75% {
    -webkit-transform: translate(-42%, -3%) rotate(6deg);
    transform: translate(-42%, -3%) rotate(6deg); }
  90% {
    -webkit-transform: translate(-46%, -1%) rotate(4deg);
    transform: translate(-46%, -1%) rotate(4deg); }
  100% {
    -webkit-transform: translate(-50%, 0) rotate(0deg);
    transform: translate(-50%, 0) rotate(0deg); } }

@keyframes bunch_shake_setting {
  0% {
    -webkit-transform: translate(-50%, 0) rotate(0deg);
    transform: translate(-50%, 0) rotate(0deg); }
  25% {
    -webkit-transform: translate(-54%, -2%) rotate(-5deg);
    transform: translate(-54%, -2%) rotate(-5deg); }
  40% {
    -webkit-transform: translate(-57%, -5%) rotate(-6deg);
    transform: translate(-57%, -5%) rotate(-6deg); }
  45% {
    -webkit-transform: translate(-57%, -5%) rotate(-6deg);
    transform: translate(-57%, -5%) rotate(-6deg); }
  70% {
    -webkit-transform: translate(-42%, -3%) rotate(6deg);
    transform: translate(-42%, -3%) rotate(6deg); }
  75% {
    -webkit-transform: translate(-42%, -3%) rotate(6deg);
    transform: translate(-42%, -3%) rotate(6deg); }
  90% {
    -webkit-transform: translate(-46%, -1%) rotate(4deg);
    transform: translate(-46%, -1%) rotate(4deg); }
  100% {
    -webkit-transform: translate(-50%, 0) rotate(0deg);
    transform: translate(-50%, 0) rotate(0deg); } }

@-webkit-keyframes box_shake_setting {
  0% {
    -webkit-transform: translateY(0%) rotate(0deg);
    transform: translateY(0%) rotate(0deg); }
  20% {
    -webkit-transform: translateY(-1%) rotate(-1deg);
    transform: translateY(-1%) rotate(-1deg); }
  35% {
    -webkit-transform: translateY(-2%) rotate(-2deg);
    transform: translateY(-2%) rotate(-2deg); }
  52% {
    -webkit-transform: translateY(-1%) rotate(2deg);
    transform: translateY(-1%) rotate(2deg); }
  70% {
    -webkit-transform: translateY(0%) rotate(2deg);
    transform: translateY(0%) rotate(2deg); }
  100% {
    -webkit-transform: translateY(0%) rotate(0deg);
    transform: translateY(0%) rotate(0deg); } }

@keyframes box_shake_setting {
  0% {
    -webkit-transform: translateY(0%) rotate(0deg);
    transform: translateY(0%) rotate(0deg); }
  20% {
    -webkit-transform: translateY(-1%) rotate(-1deg);
    transform: translateY(-1%) rotate(-1deg); }
  35% {
    -webkit-transform: translateY(-2%) rotate(-2deg);
    transform: translateY(-2%) rotate(-2deg); }
  52% {
    -webkit-transform: translateY(-1%) rotate(2deg);
    transform: translateY(-1%) rotate(2deg); }
  70% {
    -webkit-transform: translateY(0%) rotate(2deg);
    transform: translateY(0%) rotate(2deg); }
  100% {
    -webkit-transform: translateY(0%) rotate(0deg);
    transform: translateY(0%) rotate(0deg); } }

@-webkit-keyframes shadow_shake {
  0% {
    width: 95%;
    height: 18px; }
  20% {
    width: 80%;
    height: 16px; }
  40% {
    width: 80%;
    height: 16px; }
  60% {
    width: 90%;
    height: 18px; }
  80% {
    width: 95%;
    height: 18px; }
  100% {
    width: 95%;
    height: 18px; } }

@keyframes shadow_shake {
  0% {
    width: 95%;
    height: 18px; }
  20% {
    width: 80%;
    height: 16px; }
  40% {
    width: 80%;
    height: 16px; }
  60% {
    width: 90%;
    height: 18px; }
  80% {
    width: 95%;
    height: 18px; }
  100% {
    width: 95%;
    height: 18px; } }

.box_shake {
  -webkit-animation: box_shake 0.8s 0.3s linear;
  animation: box_shake 0.8s 0.3s linear; }

@-webkit-keyframes box_shake {
  0% {
    -webkit-transform: translate(-50%, -10%) rotate(0deg);
    transform: translate(-50%, -10%) rotate(0deg); }
  20% {
    -webkit-transform: translate(-52%, -14%) rotate(-3deg);
    transform: translate(-52%, -14%) rotate(-3deg); }
  40% {
    -webkit-transform: translate(-50%, -10%) rotate(6deg);
    transform: translate(-50%, -10%) rotate(6deg); }
  60% {
    -webkit-transform: translate(-52%, -14%) rotate(-3deg);
    transform: translate(-52%, -14%) rotate(-3deg); }
  80% {
    -webkit-transform: translate(-50%, -10%) rotate(6deg);
    transform: translate(-50%, -10%) rotate(6deg); }
  100% {
    -webkit-transform: translate(-50%, -10%) rotate(0deg);
    transform: translate(-50%, -10%) rotate(0deg); } }

@keyframes box_shake {
  0% {
    -webkit-transform: translate(-50%, -10%) rotate(0deg);
    transform: translate(-50%, -10%) rotate(0deg); }
  20% {
    -webkit-transform: translate(-52%, -14%) rotate(-3deg);
    transform: translate(-52%, -14%) rotate(-3deg); }
  40% {
    -webkit-transform: translate(-50%, -10%) rotate(6deg);
    transform: translate(-50%, -10%) rotate(6deg); }
  60% {
    -webkit-transform: translate(-52%, -14%) rotate(-3deg);
    transform: translate(-52%, -14%) rotate(-3deg); }
  80% {
    -webkit-transform: translate(-50%, -10%) rotate(6deg);
    transform: translate(-50%, -10%) rotate(6deg); }
  100% {
    -webkit-transform: translate(-50%, -10%) rotate(0deg);
    transform: translate(-50%, -10%) rotate(0deg); } }

.stick_shake {
  -webkit-animation: stick_shake 1s 0.1s linear both;
  animation: stick_shake 1s 0.1s linear both; }

@-webkit-keyframes stick_shake {
  0% {
    -webkit-transform: translate(-50%, -80%) rotate(0deg);
    transform: translate(-50%, -80%) rotate(0deg); }
  25% {
    -webkit-transform: translate(-60%, -84%) rotate(-4deg);
    transform: translate(-60%, -84%) rotate(-4deg); }
  45% {
    -webkit-transform: translate(-40%, -88%) rotate(6deg);
    transform: translate(-40%, -88%) rotate(6deg); }
  60% {
    -webkit-transform: translate(-60%, -92%) rotate(-8deg);
    transform: translate(-60%, -92%) rotate(-8deg); }
  80% {
    -webkit-transform: translate(-40%, -96%) rotate(8deg);
    transform: translate(-40%, -96%) rotate(8deg); }
  100% {
    -webkit-transform: translate(-50%, -100%) rotate(2deg);
    transform: translate(-50%, -100%) rotate(2deg); } }

@keyframes stick_shake {
  0% {
    -webkit-transform: translate(-50%, -80%) rotate(0deg);
    transform: translate(-50%, -80%) rotate(0deg); }
  25% {
    -webkit-transform: translate(-60%, -84%) rotate(-4deg);
    transform: translate(-60%, -84%) rotate(-4deg); }
  45% {
    -webkit-transform: translate(-40%, -88%) rotate(6deg);
    transform: translate(-40%, -88%) rotate(6deg); }
  60% {
    -webkit-transform: translate(-60%, -92%) rotate(-8deg);
    transform: translate(-60%, -92%) rotate(-8deg); }
  80% {
    -webkit-transform: translate(-40%, -96%) rotate(8deg);
    transform: translate(-40%, -96%) rotate(8deg); }
  100% {
    -webkit-transform: translate(-50%, -100%) rotate(2deg);
    transform: translate(-50%, -100%) rotate(2deg); } }

.bunch_shake {
  -webkit-animation: bunch_shake 0.9s 0.3s linear both;
  animation: bunch_shake 0.9s 0.3s linear both; }

@-webkit-keyframes bunch_shake {
  0% {
    -webkit-transform: translate(-50%, 0) rotate(0deg);
    transform: translate(-50%, 0) rotate(0deg); }
  20% {
    -webkit-transform: translate(-50%, -2%) rotate(4deg);
    transform: translate(-50%, -2%) rotate(4deg); }
  40% {
    -webkit-transform: translate(-50%, 0%) rotate(-2deg);
    transform: translate(-50%, 0%) rotate(-2deg); }
  60% {
    -webkit-transform: translate(-50%, -6%) rotate(4deg);
    transform: translate(-50%, -6%) rotate(4deg); }
  80% {
    -webkit-transform: translate(-50%, 0%) rotate(-2deg);
    transform: translate(-50%, 0%) rotate(-2deg); }
  100% {
    -webkit-transform: translate(-50%, -4%) rotate(0deg);
    transform: translate(-50%, -4%) rotate(0deg); } }

@keyframes bunch_shake {
  0% {
    -webkit-transform: translate(-50%, 0) rotate(0deg);
    transform: translate(-50%, 0) rotate(0deg); }
  20% {
    -webkit-transform: translate(-50%, -2%) rotate(4deg);
    transform: translate(-50%, -2%) rotate(4deg); }
  40% {
    -webkit-transform: translate(-50%, 0%) rotate(-2deg);
    transform: translate(-50%, 0%) rotate(-2deg); }
  60% {
    -webkit-transform: translate(-50%, -6%) rotate(4deg);
    transform: translate(-50%, -6%) rotate(4deg); }
  80% {
    -webkit-transform: translate(-50%, 0%) rotate(-2deg);
    transform: translate(-50%, 0%) rotate(-2deg); }
  100% {
    -webkit-transform: translate(-50%, -4%) rotate(0deg);
    transform: translate(-50%, -4%) rotate(0deg); } }