Image hover effect on image clickthrough links

Site URL: https://www.mfcreativedesigns.com/wedding-portfolio

I am trying to figure out how to apply an image hover effect to our clickthrough blog post gallery image links. On our website URL above -- https://www.mfcreativedesigns.com/wedding-portfolio -- you can see a page full of images that are actually blog post clickable links, that once clicked, are full of expanded galleries. Currently, nothing indicates that these blog post images are clickable/expandable, other than the written note at the top of the page. I would like to apply a hover effect that indicates they can be clicked on to see more. Something like an image fade, when the image is hovered over... anything that will give it the visual clickable effect.

I spoke with squarespace customer service, and they said our template does not allow this modification, so we'd have to add custom code in order to do so. 

Can someone please help? Thank you so, so, so much in advance. So grateful for this community!

(@tuanphan -- any idea on how to do this?)

Add to Design > Custom CSS
 

body#collection-6182f91e5f64db74481ad2ea article:hover img {
    opacity: 0.3;
}

2 hours ago, tuanphan said:

Add to Design > Custom CSS
 

body#collection-6182f91e5f64db74481ad2ea article:hover img {
    opacity: 0.3;
}

 

THANK YOU!!!!!!!!!!!!!! Gosh I really appreciate that more than I can say. Thank you thank you! It worked! <high five> thank you thank you thank you