@import "compass/css3";

$refreshing-loader-color: #9ac !default;

@include keyframes(refreshing-loader) {
  0%   { @include rotateZ(0deg); }
  100% { @include rotateZ(360deg); }
}

/* :not(:required) hides this rule from IE9 and below */
.refreshing-loader:not(:required) {
  @include animation(refreshing-loader 1000ms infinite linear);
  @include border-radius(2.4em);
  border: 0.4em solid $refreshing-loader-color;
  border-left-color: transparent;
  color: transparent;
  display: inline-block;
  font-size: 10px;
  line-height: 1.2;
  width: 3em;
  height: 3em;
  text-indent: 100%;
  
  &:after {
    display: block;
    border: 0.5em solid transparent;
    border-top-color: $refreshing-loader-color;
    border-left-color: $refreshing-loader-color;
    content: '';
    width: 0;
    height: 0;
    overflow: hidden;
    margin-left: -0.2em;
    margin-top: 1em;
  }
}
