.loader {
  @extend .grid-x,
  .align-center,
  .align-middle;
  height: 100%;
  &--circular {
    @include box(100px, 100px, true);
    border: 10px solid $gray;
    border-top: 10px solid $primary-color;
    animation: spin 1s linear infinite;
  }
  &--circular-wrapped {
    padding: 8px;
    border-radius: 100%;
    border: 5px solid $gray;
    border-top: 5px solid $primary-color;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
  }
}