почему не работает animation?

почему не работает animation? стили подключены нормально

const PokemonItem = (props) =>{
    return(
        <div className={s.inner}>

            <div>
                <img className={s.jump} src={props.pic} alt=""/>
            </div>
            <div>{props.name}</div>
        </div>
    )
}



.jump:hover {
    -webkit-animation-name: jump;
    -webkit-transition-duration: 3s;
    -webkit-animation-timing-function: linear;
}

@keyframes jump {
    0% {
        margin-top: 0px;
    }
    50% {
        margin-top: -10px;
    }
    100% {
        margin-top: 0px;
    }
}