Streaming live at 10am (PST)

Simple hover interaction works fine on larger screens, but not on smaller screens


I’m having issues with a simple hover interaction for my site’s navbar menu items. This hover interaction performs well on larger desktop breakpoints, but not when viewing the site on a MacBook Air (1440px width).

Please see this image for reference.

When viewing on Macbook Air, the navmenu items are not aligned, and only become aligned when in the “hover” or “current” states. On the larger desktop breakpoint, the navmenu items are properly aligned, and don’t move regardless of what stay they are in. I want my navmenu items to stay aligned across all breakpoints, and I don’t want my hover interaction to move them whatsoever. Please help, as I’m unable to identify the problem when reviewing styles across my sites breakpoints.

Here is my public share link: