A Pen by Matias Singers.

index.html

<div class="loader"></div>

SassMeister-output.css

.loader {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 1000;
  background-color: white;
  perspective: 400px;
}
.loader:after {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -50px 0 0 -50px;
  width: 100px;
  height: 100px;
  z-index: 1000;
  -webkit-animation: rotation 2s infinite linear;
  -moz-animation: rotation 2s infinite linear;
  animation: rotation 2s infinite linear;
  background-image: url("http://f.cl.ly/items/3R3A1Y1O0I363i2J4047/hp.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 50%;
}

@-webkit-keyframes rotation {
  0%, 10% {
    -webkit-transform: rotateY(0);
  }

  90%, 100% {
    -webkit-transform: rotateY(360deg);
  }
}
@-moz-keyframes rotation {
  0%, 10% {
    -moz-transform: rotateY(0);
  }

  90%, 100% {
    -moz-transform: rotateY(360deg);
  }
}
@keyframes rotation {
  0%, 10% {
    transform: rotateY(0);
  }

  90%, 100% {
    transform: rotateY(360deg);
  }
}

SassMeister-rendered.html

<div class="loader"></div>

style.sass

// ----
// Sass (v3.3.0.rc.1)
// Compass (v0.13.alpha.10)
// ----

@import "bourbon/bourbon"

.loader
    position: absolute
    left: 0
    top: 0
    right: 0
    bottom: 0
    z-index: 1000
    background-color: white
    perspective: 400px
    
    &:after
        content: ''
        display: block
        position: absolute
        left: 50%
        top: 50%
        margin: -50px 0 0 -50px
        width: 100px
        height: 100px
        z-index: 1000
        @include animation(rotation 2s infinite linear)
        background:
            image: url('http://f.cl.ly/items/3R3A1Y1O0I363i2J4047/hp.png') 
            repeat: no-repeat 
            size: contain
            position: 50%

@include keyframes(rotation)
    0%, 10%
        @include transform(rotateY(0))
    90%, 100%
        @include transform(rotateY(360deg))