Issues with Squarespace cropping my photos in galleries and product detail pages

Site URL: https://ryancargil.com/

I have landscape and vertical images on my website but they only offer 7 ratio options and it’s killing my photos. How can I work around this? Ps am newb. 

Add to Design > Custom CSS

.ProductList-image {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
    top: 0 !important;
}
.ProductList-innerImageWrapper {
    display: flex;
    align-items: flex-end;
}

@tuanphan looks like it fixed it on the gallery page, but not on the product detail page.

On 7/2/2021 at 9:56 PM, Ryan_C said:

@tuanphan looks like it fixed it on the gallery page, but not on the product detail page.

With individual products, use this code

.ProductItem-gallery-slides-item-image {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
    top: 0 !important;
}