Changing product number rows per page

Hi there,

My website is http://www.muditametta.com

The majority of my website it set up with 4 products per row and I like this set up, but for a few specific pages I only have 3 products in the category. When I set it up as 3 products for the category the image quality gets very distorted (too big, doesn’t match my theme setup), when I keep it at four the image quality is good but it looks funny having the blank space on the right. The specific page I’m looking to do this for is the “21 Day Transformation, Body” page.

I contacted my theme support and they gave me this css code

li.product-small.grid1.grid-normal {
margin-left: 2.5em;
margin-right: 2.5em;
}

This worked and it looked good without image distortion, but it applied to my whole website and everything else doesn’t look good with this setup. How can I apply this to only the specific pages I need it for?

Would love any help!!

Thanks in advance,

Megan