Changing the Hover Colour in Footer only

Hello. I have a yellow hover in my nav bar and in my footer I want a grey hover. This is the code and it doesn't seem to work. I am getting a hover in the footer but it appears to be a pale yellow. Any help is greatly appreciated.

Here's the code that I am using for the nav and the footer

/* Remove 'Featured' Heading from Summary Block Carousel */
.sqs-block-summary-v2 .summary-block-setting-design-carousel .summary-heading {
  display: none;}

/* remove underline on nav */
.header-nav-item--active a {
  background-image: none !important;
}

/* Nav item hover color */
.header-nav-item a:hover {
    color:  #ffd54f !important;
}

/* Nav item active color */
.header-nav-item--active a {
  color: #ffd54f !important;
}

/* Footer Link - Normal */
.footer a {
    color: white;
}
/* Footer link - Hover */
.footer a:hover {
    color: #424147 !important;
}
/* Footer Link - Active */
.footer a:active {
    color: #424147;
}

p a {  background-image: none !important;  }

28 minutes ago, BrownKatUK said:

Hello. I have a yellow hover in my nav bar and in my footer I want a grey hover. This is the code and it doesn't seem to work. I am getting a hover in the footer but it appears to be a pale yellow. Any help is greatly appreciated.

Here's the code that I am using for the nav and the footer

/* Remove 'Featured' Heading from Summary Block Carousel */
.sqs-block-summary-v2 .summary-block-setting-design-carousel .summary-heading {
  display: none;}

/* remove underline on nav */
.header-nav-item--active a {
  background-image: none !important;
}

/* Nav item hover color */
.header-nav-item a:hover {
    color:  #ffd54f !important;
}

/* Nav item active color */
.header-nav-item--active a {
  color: #ffd54f !important;
}

/* Footer Link - Normal */
.footer a {
    color: white;
}
/* Footer link - Hover */
.footer a:hover {
    color: #424147 !important;
}
/* Footer Link - Active */
.footer a:active {
    color: #424147;
}

p a {  background-image: none !important;  }

Please share your site url we can have a look

Hi @bangank36 or @tuanphan

I used this code to remove the underline from my footer navigation:

/* remove underlines from footer links */
footer a {
text-decoration: none !important;
  font-size: 18px !important;
}

But what code do I add next to apply a colour change on hover for the navigation items?

25 minutes ago, Iwan said:

Hi @bangank36 or @tuanphan

I used this code to remove the underline from my footer navigation:

/* remove underlines from footer links */
footer a {
text-decoration: none !important;
  font-size: 18px !important;
}

But what code do I add next to apply a colour change on hover for the navigation items?

Kindly share your site with the site-wide password so we can take a look

Thank you! https://beige-oleander-mp66.squarespace.com/ 

password : tuansqsp

31 minutes ago, Iwan said:

Hi @bangank36 or @tuanphan

I used this code to remove the underline from my footer navigation:

/* remove underlines from footer links */
footer a {
text-decoration: none !important;
  font-size: 18px !important;
}

But what code do I add next to apply a colour change on hover for the navigation items?

You can try adding to Home > Design > Custom Css

#block-f1ef39b8fb9899ecadc0 a:hover {
  color :#f45ec6;
}

Let me know how it works on your site

My testing

It works!! Thank you so much!!

@bangank36 one more thing, please, is there a way with my header navigation to underline the specific drop down item (page) when the drop down menu is active? 

1 minute ago, Iwan said:

@bangank36 one more thing, please, is there a way with my header navigation to underline the specific drop down item (page) when the drop down menu is active? 

@bangank36 ... when that page is selected? So for example when SPEAKING is selected, and you're on that page, the navigation header item is underlined...

Hi @bangank36 Hope you're well, I'm trying various codes to change colour-on-hover footer navigation items...can you help please?

https://deep-learning-cafe.squarespace.com/ password: password123

7 hours ago, IwanJ said:

Hi @bangank36 Hope you're well, I'm trying various codes to change colour-on-hover footer navigation items...can you help please?

https://deep-learning-cafe.squarespace.com/ password: password123

You can try adding to Home > Design > Custom Css

#block-c8b8e06bb4251545263a a:hover .sqsrte-text-color--custom {
  color: red !important;
}

Change the color as you wish

Thank you so much!! @bangank36