title: Overriding Bootstrap 3 Media Queries
body: <p>How do you override a media query on Bootstrap 3?</p>
  
  <p>For example, I have my custom style sheet and I want to override a media query that is min-width: 768px to a min-width: 1200px.</p>
  
  <p>Every time I do that it doesn't apply the settings.  However if I change that media query on Bootstrap's own css file, then it works!</p>
  
  <p>For more clarification:</p>
  
  <p><code>bootstrap.css</code>:</p>
  
  <pre><code>@media (min-width: 768px) {
    .navbar-header {
      float: left;
    }
  }
  </code></pre>
  
  <p>My <code>custom.css</code>:</p>
  
  <pre><code>@media (min-width: 1200px) {
   .navbar-header {
   float: left;
   }
  }
  </code></pre>
  
  <p>Please help me out.</p>