Unusual delay with animation loading in the header of my website on mobile devices

On a desktop, and tablet, it loads exactly as I want it to, nice and smooth, with no initial delay.

But if you check it out on a mobile (in my case an android device) you will see this:

Even when the page s loaded and cached, it still has that long delay before the text animates in.

Any help is very much appreciated.

The devs of the theme, got me to add this code:

@media (max-width: 767px){
   [data-x-effect] {
    animation-duration: 0 !important;
    animation-delay: 0 !important;
   }
}

But it doesn’t seam to do anything?