title: Customizing the color of bootstrap's navbar?
body: <p>I haven't touched the core bootstrap files - in my own CSS I have the following: </p>
  
  <pre><code>#menu-bar div {
      border-color: #0072A6;
      background-color: #0072A6;
      margin: 0;
  }
  
  #menu-bar .navbar {
      border-color: #0072A6;
      background-color: #0072A6;
      margin: 0;
  }
  
  #menu-bar .navbar-inner {
      border-color: #0072A6;
      background-color: #0072A6;
      margin: 0;
      height: 200px;
  }
  
  #menu-bar p, #menu-bar a {
      color: white;
  }
  
  #menu-bar .active a {
      color: white;
      background-color: #0072A6;
  }
  </code></pre>
  
  <p>This has gotten me where I want for screens > 1024px wide, however something in the responsive bootstrap css is causing this black border to wrap the menu for smaller screens: </p>
  
  <p><img src="https://i.stack.imgur.com/th2Vs.png" alt="rogue border"></p>
  
  <p>Does anyone know how I can remove this?  I've made a fiddle of it here including bootstrap to make it easier to play with: </p>
  
  <p><a href="http://jsfiddle.net/AmZ5L/" rel="nofollow noreferrer">http://jsfiddle.net/AmZ5L/</a></p>
  
  <p>I'm also trying to figure out how to customize that button color in case anyone's feeling super generous with their time.  </p>