Customized css issue with mobile menu

I am trying to customize my css in the customize additional css area. On my mobile menu by text is not readable on mobile and tablet. I would like all black text for mobile and tablet since the background is white. My menu and header appear fine on the desktop.

This is what I’ve tried.

@media screen and (min-width:769px)
{.ast-header-break-point .main-header-menu ul
{background-color: #000000;}
}

Any thoughts?

The page I need help with: [log in to see the link]