Streaming live at 10am (PST)

My lottie animation doesn't load by the time the Preloader is done

On my homepage I’ve designed a Lottie animation at the bottom with some images that go into a phone screen. The lottie file is a little big and I understand will take some time to load. For this reason I’ve included a preloader to cover up the load time of the lottie animation.

But on mobile phones especially, the Preloader appears and then fades off and the Lottie animation takes an additional 10 seconds to appear.

My website looks really bizzare without the lottie animation loaded, and so I’m wondering if anyone has a solution to ensure the preloader only fades once the lottie has loaded?

Appreciate any help!


Here is my public share link: LINK
(how to access public share link)