Content fades on scroll

Hi everyone, so all the content inside “content-track2” div block (under “content-bars” grid) needs to fade before it reaches my navbar’s bottom border, but I can’t seem to find a way to properly do this, it seems somewhat complicated after trying different methods, even though I feel like it msut be really simple? Neither whilescrollinginview nor scrollintoview animations have worked for me so far, so I need to ask for help since I need my content to fade out properly before touching the navbar’s bottom border and then fade back in when they’re on view. Maybe it’s because of all my elements’ positioning or somethin like that. Please let me know if you can find a way to solve this!

Here is my public share link:
(how to access public share link)