Related Products Smaller on Mobile

[Mg71]

I recently added the code below to make collection images full width on mobile.

It changed the related products on mobile so I can't change the size/number of products on mobile. It will only allow one product to show. 

I've attached two images, one of how it is currently and another how I'd like it to look. If possible, I'd like to use the original settings on the theme for the related products and have a new code to center collection images to full width on mobile.

I'm using the pipeline theme.

Thanks!

@media only screen and (max-width: 767px) { [data-grid]:not([data-grid-no-gutters]), [data-grid][data-grid-no-gutters], [data-grid] { width: 100%; } .list__collections [data-grid], [data-grid][data-grid-small] [data-item] { width: 100%; } .wrapper.section-padding.title-center { padding-right: 0px; } }