How to get black letters in the Cassiopea menù and implement arrow in article

Good day, I followed the step reported in the video but the menù's letters are note visible. Moving the mourse it is possible to see that there is something below that redirect to the correct page. I set a white/thiny grey header. Have you any suggestion about how I can edit the user.css file in order to achive this goal? Moreover, how can I do in oder to implement the back and forward arrow between articles? Many thanks.

You can try this in user.css

.container-nav a, .mm-collapsed {
color: black !important;
}

Hi Bjørn Ove,
thanks, it works.

I would like to allign the menu text at the same line. I would mantein the logo at the same line of the menù.

Here the currect css file content:

.container-nav a, .mm-collapsed {
color: black !important;
}.header.container-header.full-width {
display: grid;
grid-template-columns: minmax(0,1fr) repeat(4,minmax(0,19.875rem)) minmax(0,1fr);
grid-gap: 0 1em;
align-items: center;
}
.container-header .grid-child:first-child {
grid-column: 2/2;
}
.container-header .container-nav {
grid-column: 3/5;

}
/* Banner Image */
.mybanner {
min-width: 100%;
}

/* Menu */

/* Override the lila background with white */
.container-header {
background-color: white;
background-image: none;
}

/* Text should now be grey */
.container-header .mod-menu {
color: #6c757d;
}

/* We add padding and radius so that on hover there is a nice background */
.container-header .mod-menu a {
-webkit-border-radius: 0 0 6px 6px;
-moz-border-radius: 0 0 6px 6px;
border-radius: 0 0 6px 6px;
padding: 3px 15px;
color: #0088cc;
}

/* On hover there should be a gray background*/
.container-header .mod-menu a:hover {
background-color: #eee;
}

/* We need to change the color of the Hamburger Menu because white on white is not good */
.container-header .navbar-toggler {
color:#6c757d;
border: 1px solid #0088cc;
}
--cassiopeia-font-family-body: "Helvetica", sans-serif;}

Moreover, how can I implement the arrow in order to navigate between articles?

My font settings seems not working as well.

Many thanks
Marco

For the alignment of logo and menu, you may use

.container-header {
display: flex;
justify-content: space-between;
align-items: center;
position: relative;
}
.container-header .grid-child {
max-width: fit-content;
margin-left: 0;
margin-right: 0;
padding-inline: 2rem;
}
.container-nav {
width: fit-content;
}

It's looks perfect, thanks.
What about allign the menù like cybersalt site?

Thanks a lot
Marco