Problems with responsiveness for Safari Browser/iOS

Hey Community,

It appears I’m having some responsive design related issues regarding my site. I have a scroll-animation (a that is set for 100% is the parent of two divs which take up 50% of this parent

respectively such as, & . Both these interior
's have a horizontal flex-box and a width of 2000vw to allow for overflow inside.
There are several in which I have inserted various images with the same dimensions width=300px height=500px) for some reason the is not visible for certain mobile devices (mainly those that use safari browser)



Mobile device (Iphone 11, 12, 13) using safari browser

Expected Experience:

Actual Experience:

CSS Properties of Outter Wrapper:

CSS Properties of Interior Wrapper:

Any suggestions about how I can fix this?

Here is my site Read-Only: LINK
(how to share your site Read-Only link)