gistfile1.less

/* Loader */

$loader-size = 2.1334em

@keyframes rotate
  0%
    transform: rotate(0deg)
  100%
    transform: rotate(360deg)

.icon-g-loader
  background-position: top center
  background-repeat: no-repeat
  image: "/images/g-loader.gif" $loader-size $loader-size
  display: block
  font-family: 'gIcon'
  font-size: 30px
  font-style: normal
  font-variant: normal
  font-weight: normal
  height: $loader-size
  width:  $loader-size
  line-height: 1
  position: relative
  speak: none
  text-transform: none
  -webkit-font-smoothing: antialiased

  &:before,
  &:after
    display: none
    text-align: center
    position: absolute
    line-height: 1em
    width:       1em
    height:      1em
    top:  50%
    left: 50%
    margin-left: -.5em
    margin-top:  -.5em

  &:before
    content: "\e029"
    font-size: 1em
    
  &:after
    content: "\e02c"
    font-size: 2em    
    animation-duration: 1s
    animation-iteration-count: infinite
    animation-name: 'rotate'
    animation-timing-function: linear

.csspseudoanimations
  .icon-g-loader
    background-image: none

    &:before, &:after
      display: block