@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@keyframes spin-backward {
  from {
    transform: rotate(360deg);
  }
  to {
    transform: rotate(0deg);
  }
}

.animation {
  &.spin {
  animation-name: spin;
  animation-duration: 5000ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear; 
}
  &.spin-backward {
    @extend .spin;
  animation-name: spin-backward;
}
&.fast {
  animation-duration: 3000ms;
}
&.faster {
  animation-duration: 2000ms;
}
&.fastest {
  animation-duration: 1000ms;
}
  &.central {
    transition: .5s ease;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
    z-index: 10;
  }
}