.loading-mask {
  position: relative;
}
.loading-mask .gd-spinner {
  position: absolute;
  top: 50%;
  left: 50%;
}
.loading-mask .gd-spinner.small {
  margin-top: -8px;
  margin-left: -8px;
}
.loading-mask .gd-spinner.large {
  margin-top: -16px;
  margin-left: -16px;
}

.gd-spinner {
  display: inline-block;
  background-image: url("@gooddata/sdk-ui-kit/esm/assets/loading.svg");
  background-repeat: no-repeat;
  background-position: top left;
  background-size: contain;
  animation: loadingSpinner 1s infinite linear;
}
.gd-spinner.small {
  width: 16px;
  height: 16px;
}
.gd-spinner.middle {
  width: 24px;
  height: 24px;
}
.gd-spinner.large {
  width: 32px;
  height: 32px;
}

@keyframes loadingSpinner {
  0% {
    transform: rotate(0deg) translateZ(-0.1px);
  }
  7.8333333333% {
    transform: rotate(0deg) translateZ(0.1px);
  }
  8.3333333333% {
    transform: rotate(30deg) translateZ(0);
  }
  16.1666666667% {
    transform: rotate(30deg) translateZ(0.1px);
  }
  16.6666666667% {
    transform: rotate(60deg) translateZ(0);
  }
  24.5% {
    transform: rotate(60deg) translateZ(0.1px);
  }
  25% {
    transform: rotate(90deg) translateZ(0);
  }
  32.8333333333% {
    transform: rotate(90deg) translateZ(0.1px);
  }
  33.3333333333% {
    transform: rotate(120deg) translateZ(0);
  }
  41.1666666667% {
    transform: rotate(120deg) translateZ(0.1px);
  }
  41.6666666667% {
    transform: rotate(150deg) translateZ(0);
  }
  49.5% {
    transform: rotate(150deg) translateZ(0.1px);
  }
  50% {
    transform: rotate(180deg) translateZ(0);
  }
  57.8333333333% {
    transform: rotate(180deg) translateZ(0.1px);
  }
  58.3333333333% {
    transform: rotate(210deg) translateZ(0);
  }
  66.1666666667% {
    transform: rotate(210deg) translateZ(0.1px);
  }
  66.6666666667% {
    transform: rotate(240deg) translateZ(0);
  }
  74.5% {
    transform: rotate(240deg) translateZ(0.1px);
  }
  75% {
    transform: rotate(270deg) translateZ(0);
  }
  82.8333333333% {
    transform: rotate(270deg) translateZ(0.1px);
  }
  83.3333333333% {
    transform: rotate(300deg) translateZ(0);
  }
  91.1666666667% {
    transform: rotate(300deg) translateZ(0.1px);
  }
  91.6666666667% {
    transform: rotate(330deg) translateZ(0);
  }
  99.5% {
    transform: rotate(330deg) translateZ(0.1px);
  }
  100% {
    transform: rotate(360deg) translateZ(0);
  }
}

/*# sourceMappingURL=loadingMask.css.map */
