JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://app.divshot.com/css/bootstrap.css">
<link rel="stylesheet" href="https://app.divshot.com/css/bootstrap-responsive.css">
<div />

CSS

div{
    height: 500px;
    width: 500px;
    position: relative;  
    border: 1px solid #c00;
}

div::before{
     -webkit-animation: spinX 3s ease infinite;
    content: '';
    background: url("http://25.media.tumblr.com/tumblr_lzlxs0SlWe1rpliteo1_500.gif") no-repeat center center;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

@-webkit-keyframes spinX
{  
0%   {-webkit-transform: rotateX(0deg); -webkit-transform-origin: 0% 50% 0;}  
100% {-webkit-transform: rotateX(360deg); -webkit-transform-origin: 0% 50% 0;}  
}

@-webkit-keyframes spinY
{  
0%   {-webkit-transform: rotateY(0deg); -webkit-transform-origin: 0% 0% 5;}  
100% {-webkit-transform: rotateY(360deg); -webkit-transform-origin: 0% 0% 5;}  
}