Okay
  Print

Change navbar background color

To change 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 Drop Down */
.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 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);
}

/* Drop Down text color */
.navbar-youplay .dropdown-menu > ul > li > a,
.navbar-youplay .navbar-nav > li > .dropdown-menu > ul > li > a {
   color: #fff;
}

/* Drop Down item hover bottom line color */
.navbar-youplay .dropdown-menu > ul > li > a:after,
.navbar-youplay .navbar-nav > li > .dropdown-menu > ul > li > a:after {
   background: #fff;
}