/* 输入错误抖动效果 */

.errStyle {
  -moz-animation: dithering 1s ease both;
  -webkit-animation: dithering 1s ease both;
}

@keyframes dithering {
  10%,
  90% {
      transform: translate3d(-1px, 0, 0);
      -webkit-transform: translate3d(-1px, 0, 0);
  }
  20%,
  80% {
      transform: translate3d(+2px, 0, 0);
      -webkit-transform: translate3d(+2px, 0, 0);
  }
  30%,
  70% {
      transform: translate3d(-3px, 0, 0);
      -webkit-transform: translate3d(-3px, 0, 0);
  }
  40%,
  60% {
      transform: translate3d(+3px, 0, 0);
      -webkit-transform: translate3d(+3px, 0, 0);
  }
  50% {
      transform: translate3d(-3px, 0, 0);
      -webkit-transform: translate3d(-3px, 0, 0);
  }
}

@-webkit-keyframes dithering {
  10%,
  90% {
      transform: translate3d(-1px, 0, 0);
      -webkit-transform: translate3d(-1px, 0, 0);
  }
  20%,
  80% {
      transform: translate3d(+2px, 0, 0);
      -webkit-transform: translate3d(+2px, 0, 0);
  }
  30%,
  70% {
      transform: translate3d(-3px, 0, 0);
      -webkit-transform: translate3d(-3px, 0, 0);
  }
  40%,
  60% {
      transform: translate3d(+3px, 0, 0);
      -webkit-transform: translate3d(+3px, 0, 0);
  }
  50% {
      transform: translate3d(-3px, 0, 0);
      -webkit-transform: translate3d(-3px, 0, 0);
  }
}