.ps-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
  width: 100px;

  &--base {
    animation-name: rotate;
    animation-duration: 0.3s;
    animation-timing-function: linear;
    animation-play-state: paused;
    animation-iteration-count: infinite;

    &:hover {
      animation-play-state: running;
    }
  }

  &:nth-child(2n) &--base { animation-delay: -0.1s; }
  &:nth-child(3n) &--base { animation-delay: -0.3s; }
  &:nth-child(5n) &--base { animation-delay: -0.5s; }
  &:nth-child(7n) &--base { animation-delay: -7s; }
  &:nth-child(11n) &--base { animation-delay: -0.9s; }
  &:nth-child(13n) &--base { animation-delay: -1s; }

  &--base::before {
    position: absolute;
    display: block;
    content: '';
    width: 100%;
    height: 100%;
    border-radius: 50%;
  }
}

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}