title: Change color of divider/text in dropdown menu/collapsed, How do i change them independently of each other in CSS
body: <p><a href="http://i59.tinypic.com/357k4u1.png" rel="nofollow">MY picture</a></p>
  
  <p>in my picture on the left side with the collapsed dropdown menu, i have a white divider line, but now i also have a white divider line in my dropdown menu, and i want the divider in the dropdown menu to be a black divider line, and still keep my white divider line in the collapsed dropdown menu. How do i change them  independently of each other in CSS?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.navbar-header {
   padding-bottom: 45px;
  }
  
  .navbar-inverse .navbar-nav&gt;.active&gt;a, .navbar-inverse .navbar-nav&gt;.active&gt;a:hover, .navbar-inverse .navbar-nav&gt;.active&gt;a:focus {
    color: #fff;
    background-color:transparent;
  }
  
  .nav&gt;li {
    position: relative;
    display: block;
    box-sizing: border-box;
    color: rgb(51, 51, 51);
    font-family: oswald, 'open sans', sans-serif;
    font-size: 14px;
    list-style-image: none;
    list-style-position: outside;
    list-style-type: none;
    text-align: left;
    text-transform: uppercase;
  }
  
  .dropdown-header  {
    list-style: none;
    font-size: 14px;  
  }
  
  .navbar-inverse .navbar-collapse  {
    max-height: none;
  }
  
  .navbar-inverse .navbar-nav&gt;li&gt;a   {
    color: #fff;
    font-weight: 500;
    text-transform: uppercase;
    font-family: oswald, "MS Serif", "New York", serif;
    font-size: 14px;
  }
  
  .navbar-nav&gt;li&gt;a {
    padding-top: 2px;
    padding-bottom: 2px;
    line-height: 20px;
  }
  
  .nav&gt;li&gt;a {
    position: relative;
    display: block;
    padding: 10px 10px;
  }
  
  .navbar-inverse .navbar-nav&gt;.active&gt;a, .navbar-inverse { 
    color: #82C332;
    font-weight: 500;
  }
  
  .navbar-inverse .navbar-nav .dropdown-menu .divider {
    background-color: #000;
  }
  
  .navbar-inverse .navbar-nav .open .dropdown-menu .divider {
    background-color: #fff;
  }
  
  .open .dropdown-menu&gt;li&gt;a {
    color: #000;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code> &lt;div class="navbar navbar-inverse navbar-fixed-top" role="navigation"&gt;
        &lt;div class="container"&gt;
          &lt;div class="navbar-header"&gt;
            &lt;button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"&gt;  
      &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
        &lt;span class="icon-bar"&gt;&lt;/span&gt;
       &lt;span class="icon-bar"&gt;&lt;/span&gt;
                   &lt;span class="icon-bar"&gt;&lt;/span&gt;
       &lt;/button&gt;
       &lt;a class="navbar-brand" href="#"&gt;&lt;img src="img/logo/servicepc-logo1.png"&gt;&lt;/a&gt;
     &lt;/div&gt;
     
     &lt;div class="navbar-collapse collapse"&gt;
            &lt;ul class="nav navbar-nav navbar-right"&gt;
       &lt;li class="active"&gt;&lt;a href="#"&gt;FORSIDE&lt;/a&gt;&lt;/li&gt;       
            &lt;li class="dropdown"&gt;
            &lt;a href="#" class="dropdown-toggle" data-toggle="dropdown"&gt;SERVICE &lt;b class="caret"&gt;&lt;/b&gt;&lt;/a&gt;
           &lt;ul class="dropdown-menu"&gt;
        &lt;li class="dropdown-header"&gt;&lt;a href="#"&gt;Alle reparationer&lt;/a&gt;&lt;/li&gt;
                 &lt;li class="divider"&gt;&lt;/li&gt;
                 &lt;li&gt;&lt;a href="#"&gt;Computer Reparationer&lt;/a&gt;&lt;/li&gt;
                 &lt;li&gt;&lt;a href="#"&gt;Backup&lt;/a&gt;&lt;/li&gt;
                 &lt;li&gt;&lt;a href="#"&gt;Virus fjernelse&lt;/a&gt;&lt;/li&gt;
                 &lt;li&gt;&lt;a href="#"&gt;Backup&lt;/a&gt;&lt;/li&gt;
                 &lt;li&gt;&lt;a href="#"&gt;Data Recovery&lt;/a&gt;&lt;/li&gt;
                 &lt;li&gt;&lt;a href="#"&gt;Rensning PC (Støv)&lt;/a&gt;&lt;/li&gt;
                 &lt;li&gt;&lt;a href="#"&gt;Geninstallering af system&lt;/a&gt;&lt;/li&gt;
                 &lt;li class="divider"&gt;&lt;/li&gt;
                 &lt;li class="dropdown-header"&gt;&lt;a href="#"&gt;Info&lt;/a&gt;&lt;/li&gt; 
                 &lt;li&gt;&lt;a href="#"&gt;Portfolio 1&lt;/a&gt;&lt;/li&gt;
                 &lt;li&gt;&lt;a href="#"&gt;Portfolio 2&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
      &lt;/li&gt;
              &lt;li&gt;&lt;a href="#priser"&gt;Priser&lt;/a&gt;&lt;/li&gt;
               &lt;li&gt;&lt;a href="#about"&gt;OM OS&lt;/a&gt;&lt;/li&gt;
     &lt;li&gt;&lt;a href="#"&gt;KONTAKT&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt; 
   &lt;/div&gt; 
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I hope you understand what i mean.</p>
  
  <p>Kind Regards </p>
  
  <p>Thomas</p>