Need to reduce image size and gap between bottom of image and product name - store page

Site URL: https://sprout-flatworm-jw59.squarespace.com/config/

Hi,

On the store page (and when you click on seating) of my website the images are massive and there is a large gap between the bottom of the image and the product name.

I have the below code in my Custom CSS:

img {
    font-size: 0px;
    left: 0 !important;
    top: 0px;
    width: 100% !important;
    height: auto !important;
    position: relative;
  display: block;
}

If I change the width to 75% it changes the product image to a much better size but the gap between the image and product gets even bigger.

Can anyone suggest something that will reduce the whole frame and close the gap between the image and text?

Thanks

Andy

Hi. Which page are you referring to?