.loading-animation-loading {
  animation: loading-animation-loading 1000ms infinite cubic-bezier(1, 0, 0, 1);
}
.loading-animation-dots {
  animation: loading-animation-dots 4000ms infinite cubic-bezier(1, 0, 0, 1);
}

.loading-dots-1 {
  animation-delay: -2000ms;
}

@keyframes loading-animation-loading {
  0%,100%{
    opacity: 1;
    transform: scale(1);
    color: #d9376e;
  }
  50%{
    transform: scale(1.25);
    color: #ff8e3c;
  }
}

@keyframes loading-animation-dots {
  0%,
  100% {
    bottom: auto;
    right: auto;
    left: 0;
    top: 0;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 9999px;
  }
  12.5% {
    width: 100%;
    height: 0.5rem;
    border-radius: 0.3rem;
  }
  25% {
    left: auto;
    top: 0;
    right: 0;
    height: 0.5rem;
    width: 0.5rem;
    border-radius: 9999px;
  }
  37.5% {
    height: 100%;
    width: 0.5rem;
    border-radius: 0.3rem;
  }
  50% {
    top: auto;
    left: auto;
    bottom: 0;
    right: 0;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 9999px;
  }
  62.5% {
    width: 100%;
    height: 0.5rem;
    border-radius: 0.3rem;
  }
  75% {
    top: auto;
    right: auto;
    left: 0;
    bottom: 0;
    height: 0.5rem;
    width: 0.5rem;
    border-radius: 9999px;
  }
  87.5% {
    height: 100%;
    width: 0.5rem;
    border-radius: 0.3rem;
  }
}