More columns in shop page

Site URL: https://sunfish-azalea-4lx5.squarespace.com/config/pages/5e82767d5293af2e2623e780

I would like my products to show in 6 colums instead of 4 like this:

This is my code:

This is the result:

From what i can tell it's something to do with size of the display but I have no idea how to fix. Password to access site is "Pass1234".

Add to Home > Design > Custom CSS

@media screen and (min-width:768px) {
.products.collection-content-wrapper .list-grid {
    grid-template-columns: repeat(6,minmax(0,1fr)) !important;
}
}

Thanks for responding but my result is still the same:

If i hover over the warning it tells me "invalid property value". I have a feeling that the problem is something to do the "site.css?&F..." thing on the right of ".products.collection"?? 

Have you inserted my code yet? and where did you insert?

Ah it is now working. I'm not sure why as i just left it for an hour but thats it. Thanks for the assistance 🙂

Seemed to start working when i went to pages>shop>settings>advanced>page header code injection typed nothing and hit save