Logo shoudnt overflow

Hi there, can you please help me with the folllwing?

The white logo shoudnt overflow the green section in this projekt: https://frejm.net/
I already enabled the button “hidden” in the overflow settings, but it did not work. I tried to implement some additional code, but that did not work either.

First of all the logo is displayed in different sizes depending on the browser. (Safari and Firefox)

Second: As you can see in the screen recording, firefox does not get the z-index right. In Safari you can see how the Logo transition should look like.

Support answered: As the image is a fixed image, try moving it out of the section and you’ll see it will respect the different z-index the section and the image have.

This won’t fix the Problem, since I already have a fixed logo in the body.

The green logo should be above everything, except for this one green section, where the other white logo is displayed.
It works fine in Safari but not in Firefox.

Here is a video of the problem: https://drive.google.com/file/d/1GU13G0rSdzw6Ld7YUmv0TFpc-MotRdWE/view?usp=sharing

Please help. A quick answer would be much appreciated.


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