<div class="mrloader">
  <div class="inner-loader">
    <div class="side"></div>
  </div>
</div>

body{
  background-color:#111;
}

.mrloader .inner-loader {
        position: absolute;
        left: 50%;
        top: 50%;
        z-index: 1;
        -webkit-transform: translateX(-50%) translateY(-50%);
        transform: translateX(-50%) translateY(-50%);
        -webkit-perspective: 100px;
        perspective: 100px;
    }

    .mrloader .inner-text {
        top: 50%;
    }

    .mrloader .side {
        background: url("https://dl.dropboxusercontent.com/u/88633080/icon-android.png");
        height: 100px;
        width: 100px;
        background-size: cover;
        -webkit-animation: rotate-side 3s infinite ease-in-out;
        animation: rotate-side 3s infinite ease-in-out;
    }

@-webkit-keyframes rotate-side {
    0% {
        -webkit-transform: rotateX(0deg) rotateY(0deg);
    }

    40% {
        -webkit-transform: rotateX(735deg) rotateY(0deg);
    }

    47%,50% {
        -webkit-transform: rotateX(720deg) rotateY(0deg);
    }

    90% {
        -webkit-transform: rotateX(720deg) rotateY(735deg);
    }

    97%,100% {
        -webkit-transform: rotateX(720deg) rotateY(720deg);
    }
}

@keyframes rotate-side {
    0% {
        transform: rotateX(0deg) rotateY(0deg);
    }

    40% {
        transform: rotateX(735deg) rotateY(0deg);
    }

    47%,50% {
        transform: rotateX(720deg) rotateY(0deg);
    }

    90% {
        transform: rotateX(720deg) rotateY(735deg);
    }

    97%,100% {
        transform: rotateX(720deg) rotateY(720deg);
    }
}