.chat-frame-tips {
  width: 255px;
  height: 162px;
  display: inline-block;
  overflow: hidden;
  background-size: 771px;
  background-position: -258px -1px;
  animation: chat-frame-tips 1s steps(1, start) infinite;
  background-repeat: no-repeat;
}

.sushi-frame {
  width: 66px;
  height: 126px;
  display: inline-block;
  overflow: hidden;
  animation: sushi-frame 3s steps(1, start) infinite;
  background-repeat: no-repeat;
}

.sushi2-frame {
  width: 442px;
  height: 773px;
  display: inline-block;
  overflow: hidden;
  animation: sushi2-frame 3s steps(1, start) infinite;
  background-repeat: no-repeat;
}

@keyframes chat-frame-tips {
  0% {
    background-position: -258px -1px;
  }

  25% {
    background-position: -1px -1px;
  }

  50% {
    background-position: -515px -1px;
  }

  75% {
    background-position: -1px -1px;
  }

  100% {
    background-position: -258px -1px;
  }
}

@keyframes sushi-frame {
  0% {
    background-position: -1px -1px;
  }
  12.5% {
    background-position: -69px -1px;
  }
  25% {
    background-position: -137px -1px;
  }
  37.5% {
    background-position: -205px -1px;
  }
  50% {
    background-position: -273px -1px;
  }
  62.5% {
    background-position: -341px -1px;
  }
  75% {
    background-position: -409px -1px;
  }
  87.5% {
    background-position: -477px -1px;
  }
  100% {
    background-position: -1px -1px;
  }
}

@keyframes sushi2-frame {
  0% {
    background-position: -477px -1px;
  }
  12.5% {
    background-position: -1px -1px;
  }
  25% {
    background-position: -445px -777px;
  }
  37.5% {
    background-position: -445px -1px;
  }
  50% {
    background-position: -889px -777px;
  }
  62.5% {
    background-position: -889px -1px;
  }
  75% {
    background-position: -1333px -1px;
  }
  87.5% {
    background-position: -1333px -777px;
  }
  100% {
    background-position: -477px -1px;
  }
}
