// animating icons
// --------------------------

.#{$fa-css-prefix}-spin {
  animation-name: fa-spin;
  animation-direction: var(--#{$fa-css-prefix}-spin-direction, normal);
  animation-duration: var(--#{$fa-css-prefix}-spin-duration, 2s);
  animation-iteration-count: var(--#{$fa-css-prefix}-spin-iteration-count, infinite);
  animation-timing-function: var(--#{$fa-css-prefix}-spin-timing, linear);
}

.#{$fa-css-prefix}-spin-reverse {
  --#{$fa-css-prefix}-spin-direction: reverse;
}

.#{$fa-css-prefix}-pulse,
.#{$fa-css-prefix}-spin-pulse {
  animation-name: fa-spin;
  animation-direction: var(--#{$fa-css-prefix}-spin-direction, normal);
  animation-duration: var(--#{$fa-css-prefix}-spin-duration, 1s);
  animation-iteration-count: var(--#{$fa-css-prefix}-spin-iteration-count, infinite);
  animation-timing-function: var(--#{$fa-css-prefix}-spin-timing, steps(8));
}

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