Taken from http://s3.amazonaws.com/37assets/svn/461-spinner.html

_spinners.sass

div
  &.spinner
    position: relative
    width: 100px
    height: 100px
    display: inline-block
    div
      width: 12%
      height: 26%
      background: #000
      position: absolute
      left: 44.5%
      top: 37%
      opacity: 0
      -webkit-animation: fade 1s linear infinite
      -webkit-border-radius: 50px
      -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2)
      &.bar1
        -webkit-transform: rotate(0deg) translate(0, -142%)
        -webkit-animation-delay: 0s
      &.bar2
        -webkit-transform: rotate(30deg) translate(0, -142%)
        -webkit-animation-delay: -0.917s
      &.bar3
        -webkit-transform: rotate(60deg) translate(0, -142%)
        -webkit-animation-delay: -0.833s
      &.bar4
        -webkit-transform: rotate(90deg) translate(0, -142%)
        -webkit-animation-delay: -0.75s
      &.bar5
        -webkit-transform: rotate(120deg) translate(0, -142%)
        -webkit-animation-delay: -0.667s
      &.bar6
        -webkit-transform: rotate(150deg) translate(0, -142%)
        -webkit-animation-delay: -0.583s
      &.bar7
        -webkit-transform: rotate(180deg) translate(0, -142%)
        -webkit-animation-delay: -0.5s
      &.bar8
        -webkit-transform: rotate(210deg) translate(0, -142%)
        -webkit-animation-delay: -0.417s
      &.bar9
        -webkit-transform: rotate(240deg) translate(0, -142%)
        -webkit-animation-delay: -0.333s
      &.bar10
        -webkit-transform: rotate(270deg) translate(0, -142%)
        -webkit-animation-delay: -0.25s
      &.bar11
        -webkit-transform: rotate(300deg) translate(0, -142%)
        -webkit-animation-delay: -0.167s
      &.bar12
        -webkit-transform: rotate(330deg) translate(0, -142%)
        -webkit-animation-delay: -0.083s
  &.container
    display: inline-block
    padding: 1.5em 1.5em 1.25em
    background: rgba(0, 0, 0, 0.8)
    -webkit-box-shadow: 1px 1px 1px #fff
    -webkit-border-radius: 1em
    margin: 1em
    &.grey
      background: rgba(0, 0, 0, 0.2)
      &.blue
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #0a2744), color-stop(1, #064483))
    div.spinner
      width: 28px
      height: 28px
    &.grey div.spinner
      width: 60px
      height: 60px
    div.spinner div
      background: #fff
  &.labeled
    font-family: sans-serif
    font-size: 14px
    margin: 0 auto
    background: #fff
    padding: 0.5em 0.75em 0.5em 0.5em
    display: inline-block
    color: #c00
    line-height: 25px
    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.4)
    -webkit-border-radius: 1em
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, white), color-stop(1, #cccccc))
    div.spinner
      float: left
      vertical-align: middle
      width: 25px
      height: 25px
      margin-right: 0.5em
      div
        background: #c00

@-webkit-keyframes fade
  from
    opacity: 1
  to
    opacity: 0.25

spinner.html.haml

.spinner
  .bar1
  .bar2
  .bar3
  .bar4
  .bar5
  .bar6
  .bar7
  .bar8
  .bar9
  .bar10
  .bar11
  .bar12
.spinner{:style => "width: 64px; height: 64px"}
  .bar1
  .bar2
  .bar3
  .bar4
  .bar5
  .bar6
  .bar7
  .bar8
  .bar9
  .bar10
  .bar11
  .bar12
.spinner{:style => "width: 34px; height: 34px"}
  .bar1
  .bar2
  .bar3
  .bar4
  .bar5
  .bar6
  .bar7
  .bar8
  .bar9
  .bar10
  .bar11
  .bar12
.spinner{:style => "width: 19px; height: 19px"}
  .bar1
  .bar2
  .bar3
  .bar4
  .bar5
  .bar6
  .bar7
  .bar8
  .bar9
  .bar10
  .bar11
  .bar12
.labeled
  .spinner
    .bar1
    .bar2
    .bar3
    .bar4
    .bar5
    .bar6
    .bar7
    .bar8
    .bar9
    .bar10
    .bar11
    .bar12
  Please wait…
.container
  .spinner
    .bar1
    .bar2
    .bar3
    .bar4
    .bar5
    .bar6
    .bar7
    .bar8
    .bar9
    .bar10
    .bar11
    .bar12
.container.grey
  .spinner
    .bar1
    .bar2
    .bar3
    .bar4
    .bar5
    .bar6
    .bar7
    .bar8
    .bar9
    .bar10
    .bar11
    .bar12
.container.grey.blue
  .spinner
    .bar1
    .bar2
    .bar3
    .bar4
    .bar5
    .bar6
    .bar7
    .bar8
    .bar9
    .bar10
    .bar11
    .bar12