Hover State Suddenly Stopped Working

For years, I've used css for a hover state effect that removes the thumbnail and reveals the gif playing behind it. It stopped working recently, and I can't figure out why. My portfolio is www.maxdufrechou.com.

No problem with the gifs I can tell, but the hover state is broken. Nothing happens when the cursor is over the thumbnails.

Here's the Shaq thumbnail for example:

/*Carnival CFO Shaq*/
#block-aa4e504464cfdcdbba23 {
  background-image: url(https://static1.squarespace.com/static/6313ad8515db3003bd319b38/t/635ac308deb2fd44202ff940/1666892556596/GIF_Carnival_Shaq.gif);
  background-size: cover;
  background-position: center;
}
#block-aa4e504464cfdcdbba23:hover img {
  display: none;
}

Any thoughts?

36 minutes ago, mcdufrechou said:

For years, I've used css for a hover state effect that removes the thumbnail and reveals the gif playing behind it. It stopped working recently, and I can't figure out why. My portfolio is www.maxdufrechou.com.

No problem with the gifs I can tell, but the hover state is broken. Nothing happens when the cursor is over the thumbnails.

Here's the Shaq thumbnail for example:

/*Carnival CFO Shaq*/
#block-aa4e504464cfdcdbba23 {
  background-image: url(https://static1.squarespace.com/static/6313ad8515db3003bd319b38/t/635ac308deb2fd44202ff940/1666892556596/GIF_Carnival_Shaq.gif);
  background-size: cover;
  background-position: center;
}
#block-aa4e504464cfdcdbba23:hover img {
  display: none;
}

Any thoughts?

Which image? Can you send me screenshot?

So below is screen grab of the homepage to my portfolio. Each thumbnail takes you to this project's page.

Also attached is the gif 'CFO Shaq' as an example.

It's meant to work so that when you hover over the thumbnail jpeg the jpeg goes away and reveals the gif behind it.

Each thumbnail is coded for a hover state of 'none' and to show its relating gif.

Never been a problem before. Didn't make any changes to the site or css either.

I think I found a solution. Putting it here in case anyone else has this problem (or in case I'm doing something that's gonna cause even more problems later)

I had the hover state as

#[the block id]:hover img {
  display: none;
}

And I changed it to:

#[the block id]:hover img {
  opacity: 0;
}

Don't understand why 'display: none' no longer works, but the zeroed out opacity seems to do it.