Why isn't my animated background displaying on mobile?

On the Theme Editor platform, the mobile & desktop layout looks perfect. But when I pull up the site on my actual mobile device, the gif background (code added at the very bottom of assets>base.css) is not there. Here is the code I used:

.gradient {
background-image: url(https://i.gifer.com/NTHO.gif) !important;
background-size: cover; !important;
background-repeat: no-repeat;
background-position: center;
background-attachment: fixed;
}

This is the only additional code I added and am using the “Dawn” theme. Any help would be appreciated!

Thanks in advance!

@ayert32

Please share your store URL and share the screenshot of what you want!

Thanks!

Store URL: https://evidentthelabel.com/

*note: if you view the link on a desktop you will notice a dynamic background, but on a phone, the dynamic background does not appear and it is instead a black background. I am trying to figure out how to have the dynamic background appear for both desktop and mobile. Here is what I would like mobile to look like. Thanks!

@dmwwebartisan apologies, forgot to add your tag on this!

Hi,

saw ur website looks beautiful may I ask how u fixed this I’m having the same issue

@ayert32