I'm trying to replace the desktop image with a mobile image on a non-live site that I'm building. I have the desktop image in section 2 and the mobile in section 3. They are set up as gallery blocks, not background images.
On the desktop view, the CSS is doing what it is supposed to, but on the Mobile view, both images/sections are still visible. I'm working in classic 7.1
Does anyone have advice?
<style>
@media only screen and (max-width: 640px) {
section[data-section-id="62d9a16c9437e42a72be6475"] {
display: none !important;
}
}
@media only screen and (min-width: 641px) {
section[data-section-id="62d9a3197940bf165283c52b"] {
display: none !important;
}
</style>