.spinner {
  width: 8px;
  height: 8px;
  animation: spinner-z355kx 1s infinite linear;
  border-radius: 8px;
  box-shadow: 20px 0px 0 0 #ffc601, 12.4px 15.6px 0 0 #ffc601, -4.4px 19.4px 0 0 #ffc601, -18px 8.6px 0 0 #ffc601, -18px -8.6px 0 0 #ffc601, -4.4px -19.4px 0 0 #ffc601, 12.4px -15.6px 0 0 #ffc601;
}

@keyframes spinner-z355kx {
  to {
    transform: rotate(360deg);
  }
}
.spin-loader {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  margin-left: 24px;
  margin-bottom: 32px;
  animation: flash 0.5s ease-out infinite alternate;
}

@keyframes flash {
  0% {
    box-shadow: 20px 0 #000, -20px 0 #0002;
    background: #000;
  }
  33% {
    box-shadow: 20px 0 #000, -20px 0 #0002;
    background: #0002;
  }
  66% {
    box-shadow: 20px 0 #0002, -20px 0 #000;
    background: #0002;
  }
  100% {
    box-shadow: 20px 0 #0002, -20px 0 #000;
    background: #000;
  }
}