Mobile meny still pushes content down even with transparent header

HI! I followed the article on how to make a header transparent with CSS, but do to the CSS and z index it will no longer push the page content down when the menu is opened. Is there a way with java or CSS to have the mobile menu push down the content or even better push down just the div with the text in it? Been trying to think of a way to solve this issue on mobile short of increasing opacity on the mobile menu. If this isn’t possible is there a way to make the mobile menu more opaque but just when opened.

If it helps the site is

Thanks in advance for any help