Magnify on Hover - Gallery Block Photos

Hi 

I am using the Foster Template

Can anybody please give advice or help with this issue. I have a gallery block that's on an index page and I want to be able to magnify the selected photo when hovering over it with the mouse so the photo expands slightly on hover. Can you please tell me how this could be done whilst also allowing the highlighted photo to still link through to its specific page when clicked on.

Thank you in advance

The page in question can be seen at https://ratcliffeandratcliffe.squarespace.com/therapy 

I've managed to find this custom page for index pages.

It will turn the photos from colour to black and white on hover and still allows a click through even in the gallery block

Design > Custom CSS

#collection - find the page id for the page in question = collection followed by numbers

body#collection-.........299 img {

       -webkit-filter: none;

       filter: none;

   }

body#collection- .....299 img:hover {

-webkit-filter: grayscale(100%);

       filter: grayscale(100%);       

}

It's working great on our website