Fix Elementor Sticky Header for Desktop & Mobile

I’m rebuilding my organization’s WordPress website using Elementor. I’m on a tight deadline to get the new site launched and need some help getting the sticky header/navbar to look pixel perfect and function properly on all screen sizes. I will probably have some additional jobs once this one is complete, like helping with RankMath settings and other site optimizations.

You can see the new site at https://dev.trinityhabitat.org. For the mobile/tablet off-canvas menu, I’m using: https://ultimateelementor.com/docs/off-canvas-widget.

I also need search functionality added to the the desktop (magnifying glass) and mobile/tablet (search bar).

I like the way the header looks for mobile/table on our current site: https://trinityhabitat.org and was trying to replicate that. I think the new off-canvas panel is pretty close to what I want but am open to any adjustments you think might make it even better (I have not loaded in all of the sub-menus yet).

Thanks! -Mark