How can I hide a collection banner on desktop view?

[bthorne1]

Hi, I would like to hide the collection banner from the desktop view as it is too large and cannot be cropped down. I would still like for it to be shown on the mobile version of the site. I found this code and tried to edit it to be used for the collection banner but didn't have any luck. Any advice would be appreciated. Thanks

 

 

div#shopify-section-1591368324386 {
    display: none;
}
@media only screen and (max-width: 749px) {
div#shopify-section-1591368324386 {
    display: block;
}
div#shopify-section-slideshow {
    display: none;
}
}

[KetanKumar]

@bthorne1 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

[bthorne1]

@KetanKumar  Thanks for the reply. Here is the url https://brandonthorne.com/

[ExpertRookie]

Hi @bthorne1 
You can try to replace with this code

#shopify-section-template--16771936682198__banner{
display: none;
}
@media(max-width: 749px){
#shopify-section-template--16771936682198__banner{
display: block!important;
}
}

[bthorne1]

@ExpertRookie  Thank you, do you know the correct section this would be placed?

[ExpertRookie]

Hi @bthorne1 
You can try to add the code into the bottom of the file theme.min.css