JSFiddle - React, Tailwind, and code Playground

HTML

<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/css/bootstrap.no-icons.min.css" rel="stylesheet">

<link href="//netdna.bootstrapcdn.com/font-awesome/2.0/css/font-awesome.css" rel="stylesheet">

<i id='iconRepeatMain' class='icon-repeat' style='font-size:36px; color:red'></i>

CSS

i.icon-repeat {
    transform-origin: 50% 38%;
  -o-transform-origin:50% 38%;
  -ms-transform-origin:50% 38%;
  -moz-transform-origin:50% 38%;
  -webkit-transform-origin:50% 38%;
    -webkit-animation: Rotate 500ms infinite linear;
    -moz-animation: Rotate 500ms infinite linear;
    -ms-animation: Rotate 500ms infinite linear;
    -o-animation: Rotate 500ms infinite linear;
    animation: Rotate 500ms infinite linear;
}
@-o-keyframes Rotate {
  from {-o-transform:rotate(0deg);}
  to {-o-transform:rotate(360deg);}
}
@-moz-keyframes Rotate {
  from {-moz-transform:rotate(0deg);}
  to {-moz-transform:rotate(360deg);}
}
@-ms-keyframes Rotate {
  from {-ms-transform:rotate(0deg);}
  to {-ms-transform:rotate(360deg);}
}
@-webkit-keyframes Rotate {
  from {-webkit-transform:rotate(0deg);}
  to {-webkit-transform:rotate(360deg);}
}
@-keyframes Rotate {
  from { transform:rotate(0deg);}
  to { transform:rotate(360deg);}
}
#iconRepeatMain{
    display: inline-block;    
    position: absolute;
    z-index:10007;
    left: 50%;
    top: 50%;
    margin-left: -24px; /* -1 * image width / 2 */
    margin-top: -24px;  /* -1 * image height / 2 */
    font-size:36px;
  
}