How to ignore Positioning relative z-index:9 by positioning absolute Z-index:5

Hi, I add div (overlay) layer which position: Absolute full screen with z-index=5. But, I add text which position: Relative with z-index:9. Means, the text always will be top on overlay layer.

Now, the problem is, when I hover my cursor on overlay or at the same time top of the text (the cursor is still on top of the overlay), the overlay suddenly disappear. I don’t want to overlay disappear. How I can ignore the text?

I’m aiming for like this:

My project link:…

Thanks a lot.