title: .panel-default border color
body: <p>I have a bootstrap default panel:</p>
  
  <pre><code>&lt;div class="panel panel-default"&gt;
      &lt;div class="panel-heading"&gt;Login&lt;/div&gt;
      &lt;div class="panel-body"&gt;
      ...
  </code></pre>
  
  <p>I want remove the border, but don't want to use additional class or id, etc..</p>
  
  <p>Inspecting elements in chrome I see:</p>
  
  <pre><code>.panel-default {
      border-color: #ddd;
  }
  </code></pre>
  
  <p>That's how it got this value assigned.
  As I know I can overwrite css values by applying (at least) new values by same css selectors. My css file is imported after bootstrap file.</p>
  
  <p>I tried:</p>
  
  <pre><code>.panel-default {
      border-color: none;
  }
  </code></pre>
  
  <p>Does not work, but if I use:</p>
  
  <pre><code>.panel-default {
      border: none;
  }
  </code></pre>
  
  <p>this works.</p>
  
  <p>So <code>none</code> is not an acceptable value for <code>border-color</code>? or what a hack it might be? because if I assign none from <code>inspect element</code> feature of chrome it works.</p>