Thank you so much once again. I did leave the body styling to hype and focussed on .loading selector styling alone.
Here is the updated html:
I was able to get the animation on screen but it has several issues:
It still jumps from being on the left to jumping in the center - on desktop/laptop
I cant increase the width in .loading style to more than 300 because if i do that the left gets truncated
It has some fixed arbitrary max width because of which I have to reduce my font size to 18 at the most. 18 is too small for desktop and laptop and other high resolution screens. So the only place it looks ok now is the phone device. FYI My first scene has a mobile layout of 320px width and a larger layout of 1920px.
If we are able to resolve the small width issue mentioned in 3 above then we will need to have two font sizes based on the device - 18px for smaller screens and 40px for larger screens.
When we use 18px font as in the html file right now, the animation plays very differently on smaller screens and differently on the larger screens. We would like the animation to play out the way it is doing on larger screens.