Show featured collections 2 wide on mobile

[Amistroudie]

Hi

My store is http://www.countryhouselibrary.co.uk/ running theme Turbo 7.0 from out of the sandbox. 

I want my featured collections not to appear on mobile not one by one, but in a row of 2, so that you can see 6 x items on one screen of mobile.

I currently have this set up for my Collection list - see Photo 1 below, however I can't link to pages using this feature, only collections. I have therefore decided to try to use the featured collection block instead, which will allow me to link to pages, works great on the desktop, BUT appears only one after another in a column on mobile view.  

I have tried the following solutions, but none of these work for me 

https://community.shopify.com/c/shopify-design/how-to-ensure-collection-is-shown-2-columns-in-a-row-...

I have also tried adapting this code to fit my theme, i.e. I don't have an theme.scss.liquid so have instead tried using the same, or variations of this code in styles.css.liquid. 

the code I have been trying to change is 

}
@media only screen and (max-width: 798px) {
.featured_collections.sub-collection .thumbnail {
width: 100%;

}
}

eg changing the width to 50%, but either nothing happens or if I paste in 

.grid__item.one-quarter.large--one-half.medium--one-half.small--one-whole { width: 50%;

then the whole style of the site breaks! 

I have also tired this solution, but I felt instinctively it wasn't going to work for me and it hasn't. 

https://community.shopify.com/c/shopify-design/urgent-theme-motion-featured-collection-on-home-page-...

Basically what I am trying to get to is a grid of 6 x thumbnails that fits on 1 mobile screen that I can link to page.details I have created such as https://countryhouselibrary.co.uk/pages/decorative rather than individual collections or products. 

Any solution that gets me to this very gratefully received. 

Many thanks in advance!

Ami 

[Amistroudie]

Hi

Just following up to see if anyone has any thoughts on this?