JSFiddle - React, Tailwind, and code Playground

HTML

<div id="logo">
    <p id="spinner"></p>
</div>

CSS

@-webkit-keyframes spinner {
     from {
         -webkit-transform: rotateY(0deg);
     }
     to {
         -webkit-transform: rotateY(-360deg);
     }
 }
 @-moz-keyframes spinner {
     from {
         -moz-transform: rotateY(0deg);
     }
     to {
         -moz-transform: rotateY(-360deg);
     }
 }
 @-o-keyframes spinner {
     from {
         -o-transform: rotateY(0deg);
     }
     to {
         -o-transform: rotateY(-360deg);
     }
 }
 #logo {
     margin: 1em auto;
     -webkit-perspective: 200px;
     -moz-perspective: 200px;
     -ms-perspective: 200px;
 }
 #spinner {
     -webkit-animation-name: spinner;
     -webkit-animation-timing-function: linear;
     -webkit-animation-iteration-count: infinite;
     -webkit-animation-duration: 6s;
     -webkit-transform-style: preserve-3d;
     -moz-animation-name: spinner;
     -moz-animation-timing-function: linear;
     -moz-animation-iteration-count: infinite;
     -moz-animation-duration: 6s;
     -moz-transform-style: preserve-3d;
     animation-name: spinner;
     animation-timing-function:linear;
     animation-iteration-count: infinite;
     animation-duration: 6s;
     transform-style: preserve-3d;
     height: 135px;
     width: 120px;
     background-image: url('http://www.betvictor.com/offers/vip/images/logo-velocity.jpg');
     margin-left: 110px;
 }
 #spinner:hover {
     -webkit-animation-play-state: paused;
     -moz-animation-play-state: paused;
     animation-play-state:paused;
 }