Tesseract theme CSS questions

Hey there chirokern,

How are you doing today?

Since you already have the plugin installed please try adding the following to Appearance -> Custom CSS:

nav#site-navigation {
    text-align: center;
    vertical-align: middle;
    padding-top: 10px;
}

This should center your navigation both vertically and horizontally. As for the colors please try adding the following:

.main-navigation li a {
    color: #eedb73;
}

#masthead .main-navigation ul ul a {
    color: #eedb73;
    background: #ccc;
}

This will change the color of the links, first one will affect your navigation links color and the second one your drop down navigation links color and dropdown background color.

.main-navigation li a:hover {
    color: #eedb73;
}

.main-navigation ul ul a:hover {
    color: #eedb73;
}

Replace color hex values to display another color. You can use sites similar to this one to get hex value for the color of your choice: https://www.color-hex.com/

Best regards,
Bojan

Thanks for the help, Bojan.

I tried the entering the what you posted and it didn’t change anything. When I put the code in, the “nav#site-navigation” is highlighted in red like it isn’t recognized. Same for “#masthead”, “li a” and “ul ul a”

In your custom CSS plugin, someone forgot the closing bracket for this section

.site-logo img {
    height: 75px;
    max-width: 194px;

which will cause any CSS added after that to be parsed incorrectly. Adding the closing bracket would fix that.

Thank you! It all works now. You both Rock!

Glad I could help ??

Cheers,
Bojan

where do you add custom css for that theme? There isn’t a place for it??

Tesseract isn’t a theme we support, so whether the theme has a custom CSS section is a bit of an unknown. If you cannot find a place then use a plugin