To change the navbar background color or text color you should add custom styles.
Note: The best way to add custom styles – is in child theme style.css. Also, you can add it in options Youplay Options > General > Custom CSS, but in this way, you should add for each value important tag (Example: opacity: 1 !important;).
This is default styles for navbar, customize it as you want:
/* BG color */ .navbar-youplay { background: rgba(8, 3, 37, 0.4); } /* BG color after scroll */ .navbar-youplay.navbar-small { background: rgba(8, 3, 37, 0.94); } /* BG color for dropdown */ .navbar-youplay .dropdown-menu, .navbar-youplay .navbar-nav > li > .dropdown-menu { background: rgba(8, 3, 37, 0.8); } .navbar-youplay .nav > .dropdown > .dropdown-menu:after { border-bottom-color: rgba(8, 3, 37, 0.8); } /* BG color on mobile devices */ @media (max-width: 767px) { .navbar-youplay .navbar-collapse { background: rgb(8, 3, 37); } .navbar-youplay.navbar-small .navbar-header { background: rgba(8, 3, 37, 0.94); } } /* Text color */ .navbar-youplay .navbar-nav > li.open > a, .navbar-youplay .navbar-nav > li > a, .navbar-youplay .navbar-nav > li > a:focus, .navbar-youplay .navbar-nav > li > a:hover { color: #fff; } /* Text label color */ .navbar-youplay .navbar-nav > li > a > .label { color: rgba(255,255,255,.5); } /* Text color for dropdown */ .navbar-youplay .dropdown-menu > ul > li > a, .navbar-youplay .navbar-nav > li > .dropdown-menu > ul > li > a { color: #fff; } /* Item hover bottom line color for dropdown */ .navbar-youplay .dropdown-menu > ul > li > a:after, .navbar-youplay .navbar-nav > li > .dropdown-menu > ul > li > a:after { background: #fff; }