How can I hide sections of a page on desktop but keep them visible on mobile?

Hello all,

I am wanting to hide certain sections of a page on desktop but have them visible on mobile, i have figured out how to do the reverse and it works fine but will not work with being hidden on desktop and visible on mobile, if anyone can help me out with the custom code required to make it work please help me out. The following is what i have already tried but does not work –

@media (min-width: 800px) {
#shopify-section-template–15707351220421__1659440693d6c97fee {
display: none;
}

@media (min-width: 800px) {
.image-with-text.no-section-heading {
margin-top: 1.75rem;
display: none;
}
@media (min-width: 740px ) {
div#shopify-section-template–15707351220421__1659440693d6c97fee {
display: none;
}
}
@media screen and (min-width: 860px)
.image-with-text.no-section-heading {
margin-top: 1.75rem;
display: none;
}

Many Thanks in advance

@Ethanp213
Hello,
Can You Please Share Your Store URL…
I Will Check and Provide Proper Solution