r .loading .square:nth-child(1)::before {
  animation-delay: calc(150ms * 1);
}

.loading-container .loading .square:nth-child(2)::before {
  animation-delay: calc(150ms * 2);
}

.loading-container .loading .square:nth-child(3)::before {
  animation-delay: calc(150ms * 3);
}

.loading-container .loading .square:nth-child(4)::before {
  animation-delay: calc(150ms * 4);
}

@keyframes square-to-dot-animation {
  15%,
  25% {
    width: 0;
    height: 0;
    margin: 5px;
    border-width: 5px;
    border-radiu