Reset gif on hover

Site URL: https://agicreative.com/info/team

Site Password: password

I have some CSS code that is allowing me to do a hover effect on a stacked gallery. Right now when you hover the jpg transitions into an animated gif. Problem is that once you mouse out and then mouse over again, the gif keeps animating and doesn't reset to the beginning. Any way to adjust this code to when you hover, it starts the gif from the beginning again?

Here is the code I am using from this source: https://www.ghostplugins.com/steps/110fne84

// Rollover Image Effect //

.sqs-gallery-block-stacked .sqs-gallery {
  position: relative;
}

.sqs-gallery-block-stacked .sqs-gallery .image-wrapper:hover ~ .image-wrapper {
  opacity: 1;
}

.sqs-gallery-block-stacked .sqs-gallery .image-wrapper ~ .image-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease-in;
}