Page Banner height on Collections pages.

[cielle-studio]

I'm using the Release theme. I'd like to make the height of the Collection banners smaller. It looks fine on mobile, but not on desktop. Please help! 

Store is: laughinggullhill.com, PW: kaitlin

[Dan-From-Ryviu]

You can solve it by adding this code to Custom CSS in Sales channels > Online store > Themes > Customize > Theme settings. 

@media (min-width: 750px) {
    html #shopify-section-template--17328702652494__banner > div {
        --section-height: auto;
    }
}

[cielle-studio]

Hmm this works within the Customizer, but won't allow me to save/pubish it...

 

[Dan-From-Ryviu · Accepted solution]

Please put it at the bottom of your base.css file instead 

[suyash1]

@cielle-studio - please add this css to the very end of your base.css file and check,
Shopify Admin -> Online Store ->Theme -> Edit code -> base.css

@media screen and (min-width: 750px){
.section-page-banner__group{--section-height: 20svh !important;}
}