7.1 Navigation Custom CSS Query

Site URL: https://sealion-aqua-6cgh.squarespace.com/

Password: PartTwoDesign

Hi SS community,

Another query on 7.1 - for my nav, I have some custom code that creates a nice underline effect on hover - I'd like this same line (position, thickness etc) to remain when you've clicked on a particular page, to indicate which page you're currently on. 

Also, I've added page header injection code to my Case Studies and Contact pages so that the logo and navigation is reversed on the light background. How do I make the underline rollover work for these pages? 

As always, so grateful for any help / advice! 

Thanks,
Anna 

Add to Page Header

(If Personal Plan >> Edit page >> Adda Code Block on top of page)

<style>
  .header-nav-item::after {
    background: black;
}
</style>