Background static images covered by rows in mobile

Hi there,

I’m not entirely sure how to get my background images to show properly on mobile. I’ve set up the page to take advantage of the parallax movement and used static background images as sections with rows with text that would scroll up.

When on mobile, the text stays very large and the colored rows cover up all the other images except for the top one.

LINK: https://test.batavianstudio.com/

SIDE QUESTION: Is there a way to add a social button/icon up onto the navigation area? For the moment I’ve got it at the bottom inside a row because I don’t know how to put it up there.

Coding level: Minimal

Thank you so much for helping!