how to make bounce animateion effect using pure css

Question

Code below working fine, problem is I don want to use entire package since I only need few class of it, so I chekced source code and copy the class scopes on my page but its not working as expected..

import 'react-toastify/dist/ReactToastify.css'
import 'animate.css/animate.min.css'

const bounce = cssTransition({
  enter: 'animate__animated animate__bounceIn',//this should be source code
  exit: 'animate__animated animate__bounceOut',
})
const App = () => {
  return (
    <>
        <ToastContainer
          position="top-center"
          autoClose={4000}
          transition={bounce}
          hideProgressBar
          newestOnTop={false}
          closeOnClick
          rtl={false}
          pauseOnHover
        />

Tried css below but didnt work(copied .animate__animated class from souce code);

    const bounce = cssTransition({
      enter: '-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-duration:var(--animate-duration);animation-duration:var(--animate-duration);-webkit-animation-fill-mode:both;animation-fill-mode:both',      
exit: 'animate__animated animate__bounceOut',
    })