.#{$sliderm-class} {
  &--initialized {
    .#{$sliderm-class} {
      &__spinner {
        display: none;
      }
    }
  }

  &__spinner {
    position: absolute;
    top: calc(50% - 1.25em);
    left: calc(50% - 1.25em);
    width: 2.5em;
    height: 2.5em;
    border-radius: 50%;
    color: $spinner-color;
    font-size: 10px;
    text-indent: -9999em;
    opacity: 1 !important;
    transform: translateZ(0);
    animation: sliderm-load 1.8s infinite ease-in-out;
    animation-delay: -0.16s;
    animation-fill-mode: both;

    &::before,
    &::after {
      content: "";
      position: absolute;
      top: 0;
      width: 2.5em;
      height: 2.5em;
      border-radius: 50%;
      animation: sliderm-load 1.8s infinite ease-in-out;
      animation-fill-mode: both;
    }

    &::before {
      left: -3.5em;
      animation-delay: -0.32s;
    }

    &::after {
      left: 3.5em;
    }
  }
}

@keyframes sliderm-load {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }

  40% {
    box-shadow: 0 2.5em 0 0;
  }
}

@keyframes sliderm-load {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }

  40% {
    box-shadow: 0 2.5em 0 0;
  }
}
