Different colour of just one item in Folder Navigation

Site URL: https://ovsc.squarespace.com

Hello, 

I would like to change the boxed in page (seen in screenshot) to a different colour to make it stand out more. Just that page. The other items in the navigation are meant to stay the same colour. Any help would be appreciated! Password to page is 1234

Hi! Try adding this css code to Custom CSS. Replace red with whatever color hex value you wish to use.

.Header-nav .Header-nav-folder-item[href="/healthandfitness"] {
  color: red;
} 

Note, with this solution it will break if you change the URL.

14 hours ago, NickScola said:

Hi! Try adding this css code to Custom CSS. Replace red with whatever color hex value you wish to use.

.Header-nav .Header-nav-folder-item[href="/healthandfitness"] {
  color: red;
} 

Note, with this solution it will break if you change the URL.

Thanks so much, worked a treat!!

14 hours ago, NickScola said:

Hi! Try adding this css code to Custom CSS. Replace red with whatever color hex value you wish to use.

.Header-nav .Header-nav-folder-item[href="/healthandfitness"] {
  color: red;
} 

Note, with this solution it will break if you change the URL.

One more question, just noticed it only works on desktop, any chance to also make it work on mobile?

7 hours ago, Steffen said:

One more question, just noticed it only works on desktop, any chance to also make it work on mobile?

Ah, so it looks like Mobile Navigation has a totally different class. Here's an updated code:

.Header-nav .Header-nav-folder-item[href="/healthandfitness"], 
.Mobile-overlay-folder-item[href="/healthandfitness"] {
  color: red;
} 

1 hour ago, NickScola said:

Ah, so it looks like Mobile Navigation has a totally different class. Here's an updated code:

.Header-nav .Header-nav-folder-item[href="/healthandfitness"], 
.Mobile-overlay-folder-item[href="/healthandfitness"] {
  color: red;
} 

 

Brilliant. worked. Thanks for the help, really appreciated!