CSS Customization: mobile navigation menu color

I would like to get help please, there are 2 things
1. In the mobile veiew, When pressing one of the menu items, the background color is changing to “black”
since the font color is black, i can’t see anything, I would like to change it to a different color such as Grey/
Can you please help me with the coding of it?

2. Again in the mobile view, In the other pages (not the homepage) the burger menu is white and the background is white so it’s invisible.

What should be the code in the CSS view in order to change it to black same as the FrontPage in the mobile version

By the way this is the CSS code that I already changed in the website

#page, .site-content-contain, #primary-search-wrapper .search-container, .audioman-mejs-container.mejs-container .mejs-controls .mejs-time-rail .mejs-time-total, .audioman-mejs-container.mejs-container .mejs-controls .mejs-time-rail .mejs-time-loaded, .audioman-mejs-container.mejs-container .mejs-controls .mejs-time-rail .mejs-time-float, .audioman-mejs-container.mejs-container .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total, .woocommerce-account .woocommerce-MyAccount-navigation

 a {
	background-color:#ffffff !important; 
.menu-inside-wrapper {
background: white;
#header-links {
  background: transparent!important;

.storefront-primary-navigation { background-color: transparent;

!important; }
.main-navigation ul.menu ul.sub-menu{
#header .primary-navigation .toggle-mobile-menu{
color: transparent;
 .absolute-header .site-title a, .absolute-header .menu-toggle {
color: #000;
@media screen and (min-width: 75em)
.navigation-classic.absolute-header .main-navigation a {
color: #000;

.hm-nav-container {
	background-color: transparent;
p, h1, h2, h3, h4, h5, h6, .entry-title a, h1.entry-title, .main h1.title a, .main h2.title a, .main h2.posttitle a, .hentry .title, .main-navigation a {
color: #000000;

footer{ background-color: black; }

.tnp-widget {
color: white; !important;

Source link