Hover effect issue, and trouble with a link inside navigation

I have 2 issues here if you don’t mind lending some assistance, thank you in advance.

1.) My nav-hamburger. I have it set to when you hover over the nav-hamburger it softly animates a few pixels up and down ( the top bar moves up slightly and the bottom bar moves down slightly. ) and when you mouse away they float back. It works great. The issue is whenever you CLICK the nav-hamburger, a separate animation happens where the three lines rotate into an ‘X’ symbol to show how to close the nav, and the hover animation still happens here. Meaning when the nav-hamburger is in its ‘X’ shape (i.e Nav is open) the ‘X’ gets all distorted when you hover over it.

Is there a way to disable the hover animation for when the Nav is open? I only want it to occur when the nav is closed. I tried playing with adding a separate ‘open’ class to each nav-hamburger bar, but I don’t know how to tell the class to apply only when the nav is actually open.

2.) found a solution to my 2nd issue :slight_smile:

Thank you

PUBLISHED link: https://alexanders-first-project-eadf69.webflow.io/

READ ONLY link: https://preview.webflow.com/preview/alexanders-first-project-eadf69?utm_source=alexanders-first-project-eadf69&preview=63a453e904dfac855e1b352651025206&mode=preview

I think that in order to achieve this you’re going to need to use some custom code, I’m not a coder myself but I can’t recall seeing any animations affecting ‘opened nav bar’

I see, I might have to just nix the whole idea I suppose. Thanks for your response