JSFiddle - React, Tailwind, and code Playground

HTML

<body>
    <div class="container">
        <div class="rect"></div>
        <div class="circ"></div>
    </div>
</body>

CSS

/*normal*/
@-webkit-keyframes ANIM{
    0%{-webkit-transform: rotate(360deg) translateX(50px) rotate(90deg)}
    50%{-webkit-transform: rotate(0deg) translateX(50px) rotate(90deg)}
    100%{-webkit-transform: rotate(360deg) translateX(50px) rotate(90deg)} 
}
@-moz-keyframes ANIM{
    0%{-moz-transform: rotate(360deg) translateX(50px) rotate(90deg)}
    50%{-moz-transform: rotate(0deg) translateX(50px) rotate(90deg)}
    100%{-moz-transform: rotate(360deg) translateX(50px) rotate(90deg)}
}
@-o-keyframes ANIM{
    0%{-o-transform: rotate(360deg) translateX(50px) rotate(90deg)}
    50%{-o-transform: rotate(0deg) translateX(50px) rotate(90deg)}
    100%{-o-transform: rotate(360deg) translateX(50px) rotate(90deg)}
}
@-ms-keyframes ANIM{
    0%{-ms-transform: rotate(360deg) translateX(50px) rotate(90deg)}
    50%{-ms-transform: rotate(0deg) translateX(50px) rotate(90deg)}
    100%{-ms-transform: rotate(360deg) translateX(50px) rotate(90deg)}
}
@keyframes ANIM{
    0%{transform: rotate(360deg) translateX(50px) rotate(90deg)}
    50%{transform: rotate(0deg) translateX(50px) rotate(90deg)}
    100%{transform: rotate(360deg) translateX(50px) rotate(90deg)}
}
/*invert*/
@-webkit-keyframes ANIM2{
    0%{-webkit-transform: rotate(0deg) translateX(60px) rotate(90deg)}
    50%{-webkit-transform: rotate(360deg) translateX(60px) rotate(90deg)}
    100%{-webkit-transform: rotate(0deg) translateX(60px) rotate(90deg)} 
}
@-moz-keyframes ANIM2{
    0%{-moz-transform: rotate(0deg) translateX(60px) rotate(90deg)}
    50%{-moz-transform: rotate(360deg) translateX(60px) rotate(90deg)}
    100%{-moz-transform: rotate(0deg) translateX(60px) rotate(90deg)}
}
@-o-keyframes ANIM2{
    0%{-o-transform: rotate(0deg) translateX(60px) rotate(90deg)}
    50%{-o-transform: rotate(360deg) translateX(60px) rotate(90deg)}
    100%{-o-transform: rotate(0deg) translateX(60px) rotate(90deg)}
}
@-ms-keyframes ANIM2{
    0%{-ms-transform: rotate(0deg) translateX(60px) rotate(90deg)}
    50%{-ms-transform:...