Nav bar has grey dividers and red line on top and change hover color

I want to edit my navbar, but I am not sure how

My current navbar has grey lines dividing the pages (grey lines in between about, contact, free course) and then has a red line on top of each word (when you hover over it).

I wanted to make it to where there are no grey lines in between the pages and no lines on top of the word and when you hover over the word, it turns red.

Any advice? Thanks

Hi there,

Please try this code:

.x-navbar .desktop .x-nav>li>a {
    border: 0 !important;
}

.x-navbar .desktop .x-nav > li > a:hover, 
.x-navbar .desktop .x-nav > .x-active > a, 
.x-navbar .desktop .x-nav > .current-menu-item > a {
    box-shadow: none;
}

Hope this helps.

that worked! thank you!

You’re welcome.