@keyframes loadDots {
  0% {
    top: 0; }
  100% {
    top: -5px; } }

@-webkit-keyframes loadDots {
  0% {
    top: 0; }
  100% {
    top: -5px; } }

#loading-area {
  background: #ffdc00;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 99999; }
  #loading-area.show {
    display: block; }
  #loading-area .loading-area-inner {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }
    #loading-area .loading-area-inner .dots-area {
      position: absolute;
      bottom: -10px;
      right: 63px; }
    #loading-area .loading-area-inner .load-dots {
      float: left;
      margin-right: 2px; }
      #loading-area .loading-area-inner .load-dots.dots01 {
        position: relative; }
        #loading-area .loading-area-inner .load-dots.dots01.fire {
          animation: loadDots 0.2s infinite ease-in-out;
          -webkit-animation: loadDots 0.2s infinite ease-in-out; }
      #loading-area .loading-area-inner .load-dots.dots02 {
        position: relative; }
        #loading-area .loading-area-inner .load-dots.dots02.fire {
          animation: loadDots 0.2s infinite ease-in-out;
          -webkit-animation: loadDots 0.2s infinite ease-in-out; }
      #loading-area .loading-area-inner .load-dots.dots03 {
        position: relative; }
        #loading-area .loading-area-inner .load-dots.dots03.fire {
          animation: loadDots 0.2s infinite ease-in-out;
          -webkit-animation: loadDots 0.2s infinite ease-in-out; }
