How can I apply CSS style on a specific gallery only?

Hi all!

I need help with my website: I'm correctly seeing a hover effect on gallery images, but it applies on all the gallery. How can I apply this CSS just on a specific gallery? I cannot deal with div o #block.. I don't know.

This is the code that is applied to all my galleries:

.sqs-block-summary-v2 .summary-thumbnail-outer-container
{
   img
       {
           filter: grayscale(100%) !important;
           transition: filter 0.5s !important;
       }
}

.sqs-block-summary-v2 .summary-thumbnail-outer-container
{
  img:hover
  {
   filter: none !important;
  }
}

You can reach my website at enricocolacillo.squarespace.com using psw: chiladura.

Thank you so much!Enrico

Which gallery? @enricocolacillo

Sorry, I want to apply only to the gallery on the Gratitude page. Let me know if you can find it.

Thank you so much.Enrico

Sorry, I want to apply only to the gallery on the Gratitude page. Let me know if you can find it.

Thank you so much.Enrico

If that's the only gallery on that page, you can add the CSS in

If that's the only gallery on that page, you can add the CSS in

I don't know how to do it on a single specific page..

I don't know how to do it on a single specific page..

Ok I think I solved like this ;) Thank you so much!

/* Grayscale for images on Gratitude Page */
#collection-5d66d275556a30000114ff54
.sqs-block-summary-v2 .summary-thumbnail-outer-container
{
   img
       {
           filter: grayscale(100%) !important;
           transition: filter 0.5s !important;
       }
}

#collection-5d66d275556a30000114ff54
.sqs-block-summary-v2 .summary-thumbnail-outer-container
{
  img:hover
  {
   filter: none !important;
  }
}