javascript - Animate.CSS Transition not working in Mozila Firefox -

trying slide h3 (not whole slider) bounceinleft using animate.css it's working chrome,opera but not working on firefox browser.

see fiddle > on chrome, firefox.

css:

/****************** * bounce in left * *******************/ @keyframes bounceinleft {     0% {         opacity: 0;         transform: translatex(-1000px);     }      80% {         transform: translatex(-10px);     }      100% {         transform: translatex(0);     } }  @-webkit-keyframes bounceinleft {     0% {         opacity: 0;         -webkit-transform: translatex(-1000px);     }      80% {         -webkit-transform: translatex(-10px);     }      100% {         -webkit-transform: translatex(0);     } }  @-moz-keyframes bounceinleft {     0% {         opacity: 0;         -moz-transform: translatex(-1000px);     }      80% {         -moz-transform: translatex(-10px);     }      100% {         -moz-transform: translatex(0);     } }  @-o-keyframes bounceinleft {     0% {         opacity: 0;         -o-transform: translatex(-1000px);     }      80% {         -o-transform: translatex(-10px);     }      100% {         -o-transform: translatex(0);     } }  .animated.bounceinleft {     -webkit-animation-name: bounceinleft;     -moz-animation-name: bounceinleft;     -o-animation-name: bounceinleft;     animation-name: bounceinleft; }  /**************** * bounceinright * ****************/ @keyframes bounceinright {     0% {         opacity: 0;         transform: translatex(1000px);     }      80% {         transform: translatex(10px);     }      100% {         transform: translatex(0);     } }  @-webkit-keyframes bounceinright {     0% {         opacity: 0;         -webkit-transform: translatex(1000px);     }      80% {         -webkit-transform: translatex(10px);     }      100% {         -webkit-transform: translatex(0);     } }  @-moz-keyframes bounceinright {     0% {         opacity: 0;         -moz-transform: translatex(1000px);     }      80% {         -moz-transform: translatex(10px);     }      100% {         -moz-transform: translatex(0);     } }  @-o-keyframes bounceinright {     0% {         opacity: 0;         -o-transform: translatex(1000px);     }      80% {         -o-transform: translatex(10px);     }      100% {         -o-transform: translatex(0);     } }  .animated.bounceinright {     -webkit-animation-name: bounceinright;     -moz-animation-name: bounceinright;     -o-animation-name: bounceinright;     animation-name: bounceinright; }  /* description */ #headslide p { -webkit-animation-name:bounceinright; -moz-animation-name:bounceinright; -o-animation-name:bounceinright; animation-name:bounceinright; -webkit-animation-duration:1s; -moz-animation-duration:1s; animation-duration:1s; -moz-animation-fill-mode:both; animation-fill-mode:both;  box-shadow:0 1px 4px rgba(0,0,0,0.1); -webkit-box-shadow:0 1px 4px rgba(0,0,0,0.1); -moz-box-shadow:0 1px 4px rgba(0,0,0,0.1); -o-box-shadow:0 1px 4px rgba(0,0,0,0.1); -ms-box-shadow:0 1px 4px rgba(0,0,0,0.1);  margin:0; }  /* title */ #headslide h3 { -webkit-animation-name:bounceinleft; -moz-animation-name:bounceinleft; -o-animation-name:bounceinleft; animation-name:bounceinleft; -webkit-animation-duration:1s; -moz-animation-duration:1s; animation-duration:1s; -moz-animation-fill-mode:both; animation-fill-mode:both;  background: #fff; font-size: 110%; line-height: 1.4; padding: 1% 2%; margin: 0; font-weight:normal; text-transform:uppercase; } 

this slider has fade transition default, shows fade transitions on firefox , bounceinleft/bounceinright keyframes work on chrome , opera.
i'm trying slide h3, , not entire slider.

why animate.css not work on firefox? how can fix this?
possible fix using jquery? thanks.