@keyframes buttonloaderanimation {
  0%,
  8.3% {
    transform: rotate(0deg);
  }

  8.4%,
  16.6% {
    transform: rotate(30deg);
  }

  16.7%,
  24.9% {
    transform: rotate(60deg);
  }

  25%,
  33.2% {
    transform: rotate(90deg);
  }

  33.3%,
  41.5% {
    transform: rotate(120deg);
  }

  41.6%,
  49.9% {
    transform: rotate(150deg);
  }

  50%,
  58.3% {
    transform: rotate(180deg);
  }

  58.4%,
  66.7% {
    transform: rotate(210deg);
  }

  66.8%,
  74.9% {
    transform: rotate(240deg);
  }

  75%,
  83.2% {
    transform: rotate(270deg);
  }

  83.3%,
  91.6% {
    transform: rotate(300deg);
  }

  91.7%,
  100% {
    transform: rotate(330deg);
  }
}

.btn-loading-icon {
  display: none;
}

.btn-loading {
  position: relative;

  &:after {
    animation: buttonloaderanimation 1s infinite linear;
    content: '';
    background: transparent image-url('loaders/loader-16x16-buttons.png') no-repeat center;
    background-size: 16px;
    display: block;
    width: 16px;
    height: 16px;
    position: absolute;
    right: $margin-normal;
    top: calc(50% - 8px);
  }
}