Stop interaction on hover

Hey guys,

I’m trying to build a tweets grid section that has an infinite scroll interaction on it. But I want the interaction/animation to stop when I hover over a tweet and resume when I hover out.

I have tried using the custom CSS below, and many such CSS variations. Nothing worked. Would love some help on this.

CSS code:

.tweet-section:hover .card {
 -webkit-animation-play-state: paused;
    -moz-animation-play-state: paused;
    -o-animation-play-state: paused;
     animation-play-state: paused;
}

This is the read-only link to my site: Webflow - Plum-Playground

@PixelGeek Big fan. Can you please help me here?