Different Menu Link Colors on Desktop and Mobile

chadmmiles

Hello! 

On my site (found here: www.adventumdigital.com) I have a transparent header on the desktop version and a white header on the mobile version. I want the menu links on the desktop version to be white and the menu links on the mobile version to be dark gray. 

Everything is set how I'd like, but I am not having any luck changing the CSS to make the desktop menu links white. 

I have tried the following: 

#Top_bar .menu > li > a, #Top_bar #menu ul li.submenu .menu-toggle {

    color: #fff;

};

I'd appreciate any help, thank you in advance!

Bryan

Hi,
this css should help:

@media (min-width:767px) {
#Top_bar .menu > li a {
	color:#000 !important;
}}

thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

chadmmiles

Thank you for your response! This gives me the desired effect on the desktop version, however, now the menu is also white on the mobile version. It seems as if the CSS media query is not registering properly. 

Screenshot of mobile with white text on white background: https://ibb.co/cXzMfd

Bryan

I thought you asked about the desktop version only, this css does not work on mobile. Use this

#Top_bar .menu > li a {
	color:#000 !important;
}

Learn more: Video Tutorials | How To | FAQ Vote on what comes next