Bounce Effect in css3

<a id="scrollUp" href="#top" style="position: fixed; z-index: 2147483647;">Top</a>
<style>
a#scrollUp {bottom: 0px;right: 10px;padding: 5px 10px;background: #FE980F;color: #FFF;-webkit-animation: bounce 2s ease infinite;animation: bounce 2s ease infinite;}
a#scrollUp a { font-size: 30px;}
@-webkit-keyframes bounce {
 0%, 20%, 50%, 80%, 100% {
-webkit-transform: translateY(0);
}
 40% {
-webkit-transform: translateY(-30px);
}
 60% {
-webkit-transform: translateY(-15px);
}
}
 @-moz-keyframes bounce {
 0%, 20%, 50%, 80%, 100% {
-moz-transform: translateY(0);
}
 40% {
-moz-transform: translateY(-30px);
}
 60% {
-moz-transform: translateY(-15px);
}
}
 @-o-keyframes bounce {
 0%, 20%, 50%, 80%, 100% {
-o-transform: translateY(0);
}
 40% {
-o-transform: translateY(-30px);
}
 60% {
-o-transform: translateY(-15px);
}
}
@keyframes bounce {
 0%, 20%, 50%, 80%, 100% {
transform: translateY(0);
}
 40% {
transform: translateY(-30px);
}
 60% {
transform: translateY(-15px);
}
}
.animated.bounce {
    -webkit-animation-name: bounce;
    -moz-animation-name: bounce;
    -o-animation-name: bounce;
    animation-name: bounce;
}
</style>