How do I get the text inside the menu bar align right & can I change the color?

Try adding these two codes along with the rest I think personally it looks better:

.tc-sticky-header .tc-header {
    background: #000;
}

.sticky-enabled .tc-header {
   background: rgba(0, 0, 0, 0.8);
}

I’m so sorry I have no idea what has happened but the problem has returned. I went away from my computer for a while came back to edit my site now and I see that when you scroll down from the page the menu bar changes itself back from black to white. Any ideas on what could have caused this? It was working fine before I left just a few hours ago.

https://www.smartmoneymobile.com/

Add this code:

.tc-solid-color-on-scroll.sticky-enabled .navbar-inner, .tc-solid-color-on-scroll.sticky-enabled .tc-header {
    background-color: #000;
}

I’m sorry I tried this and it didn’t fix the problem. The code you just gave me did not fix it.

Try just this one then:

.tc-solid-color-on-scroll.sticky-enabled .tc-header {
    background-color: #000;
}

It still does nothing and I removed that last code and replaced it with the new one you just gave me and it did nothing. I even tried with both codes in at the same time and nothing.

Something not right with code then because it worked for me and through Inspect element it still shows you have #FAFAFA as background color for the codes I gave you.

So you might have another code overwriting it.

The background color was changed from the default white background to black so where it says #FAFAFA I changed it to #000 I don’t know if changing the background color of the site would have been a cause since the problem appeared to happen before I changed the background color.

Here’s a copy and paste of all the code I have inside the custom CSS plugin that came with customizr. All the other files within the child theme editor have remained untouched and no coding was messed with beyond the custom CSS. Maybe there is something in this code that could be causing this?

#customizr-slider {
    	display: none;
	}
}

.navbar .navbar-inner {
   box-shadow: none;
}

/* Adjust Menu (red) text color, (Garamond) font-family, (1.5em) font-size  */
.navbar .nav > li > a, .navbar .nav > li > a:first-letter,
.navbar .nav > li.current-menu-item > a,
.navbar .nav > li.current-menu-ancestor > a {
display:        inline;
color:          white;
font-family:    Garamond;
font-size:      1.5em;
padding:        5px 15px;
}

/* Adjust Menu colors - Hover */
.navbar .nav > li > a:hover, .navbar .nav > li > a:hover:first-letter {
color:          white;
text-shadow:    none;
}

/* Adjust (10px) top position  */
.navbar .nav > li > a {
position:     relative;
top:          10px;
}

.navbar .navbar-inner {
max-height:     20px;
} 

.tc-sticky-header .tc-header {
    background: #000;
}

.sticky-enabled .tc-header {
   background: #000;
}

body {
  background: none repeat scroll 0 0 #000000;
  color: #000000;
  padding-bottom: 0;
}

.page .featurette-divider.__before_content {
    display: none;

.tc-solid-color-on-scroll.sticky-enabled .tc-header {
    background-color: #000;

I figured it out

Under Appearance > Customize > Header > Design and Layout > Need to check the box labled Sticky header : semi-transparent on scroll

Thank you this did the trick ?? but now when I scroll the very first word on that menu shrinks it’s size when you scroll the page down. Not sure why it would do that. I tried checking into all my settings to see if there was one I need to check on or off but I could not figure it out.

Try this code for the scroll font issue:

.sticky-enabled .navbar .nav > li > a {
    font-size: 1.8em;
}