.loading-wave-dots {
  position: relative;
}
.loading-wave-dots .wave-item {
  position: absolute;
  top: 50%;
  left: 50%;
  display: inline-block;
  margin-top: -4px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  animation: loading-wave-dots linear 2.8s infinite;
}
.loading-wave-dots .wave-item:first-child {
  margin-left: -36px;
}
.loading-wave-dots .wave-item:nth-child(2) {
  margin-left: -20px;
  animation-delay: 0.14s;
}
.loading-wave-dots .wave-item:nth-child(3) {
  margin-left: -4px;
  animation-delay: 0.28s;
}
.loading-wave-dots .wave-item:nth-child(4) {
  margin-left: 12px;
  animation-delay: 0.42s;
}
.loading-wave-dots .wave-item:last-child {
  margin-left: 28px;
  animation-delay: 0.56s;
}
@keyframes loading-wave-dots {
  0% {
    transform: translateY(0);
    background: #bbb;
  }
  10% {
    transform: translateY(-6px);
    background: #999;
  }
  20% {
    transform: translateY(0);
    background: #bbb;
  }
  100% {
    transform: translateY(0);
    background: #bbb;
  }
}
.loading-circles .circle-item {
  width: 5px;
  height: 5px;
  animation: loading-circles linear 0.75s infinite;
}
.loading-circles .circle-item:first-child {
  margin-top: -14.5px;
  margin-left: -2.5px;
}
.loading-circles .circle-item:nth-child(2) {
  margin-top: -11.26px;
  margin-left: 6.26px;
}
.loading-circles .circle-item:nth-child(3) {
  margin-top: -2.5px;
  margin-left: 9.5px;
}
.loading-circles .circle-item:nth-child(4) {
  margin-top: 6.26px;
  margin-left: 6.26px;
}
.loading-circles .circle-item:nth-child(5) {
  margin-top: 9.5px;
  margin-left: -2.5px;
}
.loading-circles .circle-item:nth-child(6) {
  margin-top: 6.26px;
  margin-left: -11.26px;
}
.loading-circles .circle-item:nth-child(7) {
  margin-top: -2.5px;
  margin-left: -14.5px;
}
.loading-circles .circle-item:last-child {
  margin-top: -11.26px;
  margin-left: -11.26px;
}
@keyframes loading-circles {
  0% {
    background: #dfdfdf;
  }
  90% {
    background: #505050;
  }
  100% {
    background: #dfdfdf;
  }
}
.loading-bubbles .bubble-item {
  background: #666;
  animation: loading-bubbles linear 0.75s infinite;
}
.loading-bubbles .bubble-item:first-child {
  margin-top: -12.5px;
  margin-left: -0.5px;
}
.loading-bubbles .bubble-item:nth-child(2) {
  margin-top: -9.26px;
  margin-left: 8.26px;
}
.loading-bubbles .bubble-item:nth-child(3) {
  margin-top: -0.5px;
  margin-left: 11.5px;
}
.loading-bubbles .bubble-item:nth-child(4) {
  margin-top: 8.26px;
  margin-left: 8.26px;
}
.loading-bubbles .bubble-item:nth-child(5) {
  margin-top: 11.5px;
  margin-left: -0.5px;
}
.loading-bubbles .bubble-item:nth-child(6) {
  margin-top: 8.26px;
  margin-left: -9.26px;
}
.loading-bubbles .bubble-item:nth-child(7) {
  margin-top: -0.5px;
  margin-left: -12.5px;
}
.loading-bubbles .bubble-item:last-child {
  margin-top: -9.26px;
  margin-left: -9.26px;
}
@keyframes loading-bubbles {
  0% {
    width: 1px;
    height: 1px;
    box-shadow: 0 0 0 3px #666;
  }
  90% {
    width: 1px;
    height: 1px;
    box-shadow: 0 0 0 0 #666;
  }
  100% {
    width: 1px;
    height: 1px;
    box-shadow: 0 0 0 3px #666;
  }
}
.loading-default {
  position: relative;
  border: 1px solid #999;
  animation: loading-rotating ease 1.5s infinite;
}
.loading-default:before {
  content: '';
  position: absolute;
  display: block;
  top: 0;
  left: 50%;
  margin-top: -3px;
  margin-left: -3px;
  width: 6px;
  height: 6px;
  background-color: #999;
  border-radius: 50%;
}
.loading-spiral {
  border: 2px solid #777;
  border-right-color: transparent;
  animation: loading-rotating linear 0.85s infinite;
}
@keyframes loading-rotating {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
.loading-bubbles,
.loading-circles {
  position: relative;
}
.loading-circles .circle-item,
.loading-bubbles .bubble-item {
  position: absolute;
  top: 50%;
  left: 50%;
  display: inline-block;
  border-radius: 50%;
}
.loading-circles .circle-item:nth-child(2),
.loading-bubbles .bubble-item:nth-child(2) {
  animation-delay: 0.093s;
}
.loading-circles .circle-item:nth-child(3),
.loading-bubbles .bubble-item:nth-child(3) {
  animation-delay: 0.186s;
}
.loading-circles .circle-item:nth-child(4),
.loading-bubbles .bubble-item:nth-child(4) {
  animation-delay: 0.279s;
}
.loading-circles .circle-item:nth-child(5),
.loading-bubbles .bubble-item:nth-child(5) {
  animation-delay: 0.372s;
}
.loading-circles .circle-item:nth-child(6),
.loading-bubbles .bubble-item:nth-child(6) {
  animation-delay: 0.465s;
}
.loading-circles .circle-item:nth-child(7),
.loading-bubbles .bubble-item:nth-child(7) {
  animation-delay: 0.558s;
}
.loading-circles .circle-item:last-child,
.loading-bubbles .bubble-item:last-child {
  animation-delay: 0.651s;
}
