wonderwebber

Hi tuanphan - Thanks for checking in. When I hover-over the hamburger menu or the "X" (when the mobile menu is showing), I would like the color of each of these to be updated from red to green.

Hi bangank36 - Thanks for your offer to help. I have a site that I'm able to share. It is at: https://crimson-armadillo-4gj9.squarespace.com/ with password: secret On this site, the hamburger menu is red when you're at the top of the page and white when you scroll down the page. I'd like to know how to update the color of the hamburger menu when you hover over it - let's say - update its color to green. When the mobile menu is showing, I'd also like to know how to up the color of the "X" on hover over Thanks in advance for your help with this!

I asked this question as part of another query that I submitted and I received the following response that I wanted to share on this thread: After using the dev tool in this site https://lightsandtracks.squarespace.com/, i think this is the configuration to set hover effect. .header-menu-nav-item a:hover { color: #ff524a !important; } a:hover { color: #ff524a !important; opacity: 1 !important; text-decoration: none !important; } .header-menu-nav-item a:hover::after { content: '→' !important; font-size: 3.2rem; color: #ff524a; font-family: 'FunktionalGrotesk-Book'; -o-transition: all .5s; -ms-transition: all .5s; -moz-transition: all .5s; -webkit-transition: all .5s; transition: all .5s; opacity: 1 !important; }

Site URL: https://lightsandtracks.squarespace.com/ I'm trying to update the color of my hamburger menu on hover over similar to the behavior seen on the site at: https://lightsandtracks.squarespace.com/. I'm not skilled enough to extract the hover over CSS from this site. Maybe someone can help me with that? I can't reveal our site's URL but I have figured out the CSS to update the color of the hamburger menu, either (1) or (2) below: (1) .burger-inner .top-bun, .burger-inner .patty, .burger-inner .bottom-bun { background-color: white!important; } (2) .burger-inner>div { background-color: white !important; } Then I tried the following to update the color to red on hover over, but it only updates the color of each of the horizontal lines of the hamburger menu but not all three at once: .burger-inner>div:hover { background-color: red !important; } If someone can suggest what CSS I can use to update the color all 3 sections of the hamburger menu on hover over I'd love to know.