Menu Size and Color

You can change menu colors from theme Colors settings as shown in this screenshot https://imgur.com/a/K59LR

You can change menu text size by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Additional CSS

#site-navigation .navbar-nav > li > a {
    font-size: 21px;
    font-weight: 500;
}

That wouldn’t work. It said it couldn’t save because of invalid entries. Could there be another code maybe?

It should work. This can be due to plugin conflict on your site so please try temporary deactivating all plugins and see whether everything works fine and then enable the plugins one by one to see which plugin is conflicting if any.

Alternatively you can use below CSS code to change its color.

#site-navigation .navbar-nav li > a {
    color: #fa5eef;
}

#site-navigation .navbar-nav li:hover > a {
    color: #bb32ff;
}

You can change the color value in the above code to whatever you want to use by referring the following pages.

https://www.w3schools.com/html/html_colors.asp
https://www.w3schools.com/html/html_colorvalues.asp
https://www.w3schools.com/tags/ref_colorpicker.asp

Great! Thank you so much!
One last question. Is there a way to make the dropdown main menu centered not to the right?

One last question. Is there a way to make the dropdown main menu centered not to the right?

Could you please share the screenshot of what you are trying to achieve so that I can help you?

For screenshots, you can simply provide a link to an image through Google Drive, Dropbox, screencast.com, https://imgur.com/ or other image service. ??

https://drive.google.com/open?id=1Lwp2jYCplzxNrc5LhKR66jzvU7SSgF9R
We are trying to make the menu centered as well as make the drop-down menus wider so that words are not on 2 lines if possible.

• This reply was modified 6 years, 7 months ago by jennagarvin5.

Please use below CSS code to achieve this.

#site-navigation > .col-sm-2 {
    display: none;
}

#site-navigation > .col-sm-10 {
    margin: 0 auto;
    float: none;
}

.main-navigation ul ul a {
    width: 250px;
}

Thanks for the help!
The menu still isn’t centered unfortunately. Any idea what I can do to tweak it? Also, is there a way to remove the white space (see pic) for mobile so that it looks more condensed?
https://drive.google.com/open?id=0B4eKFJRCWjhrLWpLOEIxSmF4QzAtbnowd1lYUTA0S2VhTWNZ

The menu still isn’t centered unfortunately. Any idea what I can do to tweak it?

I don’t see the above shared CSS code used on your site so please use it and tell me where you have added it so that I can troubleshoot it.

is there a way to remove the white space (see pic) for mobile so that it looks more condensed?

We can remove it developing custom CSS code but to help us keep support thread separates could you please create new thread for each of your other questions instead of asking them in your single thread as it makes the thread messy and hard to read.

If you want to you can also add reference of this thread in your newly created thread.

We would be more than happy to help you on your new thread.