JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://redbuds.com/css/hover-min.css">
<a href="#" class="hvr-bob">
float
</a>

CSS

a {
    padding: 100px;
    background-color: #7b9;
    color: #fff;
    text-decoration: none;
    margin: 30px;
}
.hvr-bob {
  -webkit-animation-name: hvr-bob-float, hvr-bob;
  animation-name: hvr-bob-float, hvr-bob;
  -webkit-animation-duration: .3s, 1.5s;
  animation-duration: .3s, 1.5s;
  -webkit-animation-delay: 0s, .3s;
  animation-delay: 0s, .3s;
  -webkit-animation-timing-function: ease-out, ease-in-out;
  animation-timing-function: ease-out, ease-in-out;
  -webkit-animation-iteration-count: 1, infinite;
  animation-iteration-count: 1, infinite;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-direction: normal, alternate;
  animation-direction: normal, alternate;
}