title: Bootstrap Panel Headings
body: <p>I am trying to remove the border that creates the panels Body but having some issues finding it.</p>
  
  <p>Here is the code for my panel:</p>
  
  <pre><code>&lt;div class="panel"&gt;
          &lt;div class="panel-heading"&gt; &lt;span class="panel-title"&gt;&lt;i class="icon-user"&gt;&lt;/i&gt;&amp;nbsp;&amp;nbsp;Training Team&lt;/span&gt;&lt;button type="button" name="addProjectMember" class="btn btn-mini pull-right"&gt;&lt;i class="icon-plus"&gt;&lt;/i&gt;&amp;nbsp;&amp;nbsp;Add Project Member&lt;/button&gt;&lt;/div&gt;
          &lt;div name="trainingTeamBody" style="display:none;" class="panel-body"&gt;
          &lt;span name="teamError"&gt;&lt;br&gt;&lt;div class="alert alert-warning"&gt;&lt;center&gt;No Project Members Assigned&lt;/center&gt;&lt;/div&gt;&lt;/span&gt;
             &lt;table name="teamTable" class="table table-hover" style="display: none;"&gt;
                &lt;thead&gt;
                   &lt;tr&gt;
                      &lt;th&gt;&lt;small&gt;Member&lt;/small&gt;&lt;/th&gt;
                      &lt;th&gt;&lt;small&gt;Role&lt;/small&gt;&lt;/th&gt;
                      &lt;th&gt;&lt;small&gt;Supervisor&lt;/small&gt;&lt;/th&gt;
                      &lt;th&gt;&lt;small&gt;Date Assigned&lt;/small&gt;&lt;/th&gt;
                      &lt;th&gt;&lt;small&gt;Who Assigned&lt;/small&gt;&lt;/th&gt;
                      &lt;th&gt;&lt;small&gt;Action&lt;/small&gt;&lt;/th&gt;
                   &lt;/tr&gt;
                &lt;/thead&gt;
                &lt;tbody name="teamTableResults"&gt;&lt;/tbody&gt;
             &lt;/table&gt;
          &lt;/div&gt;
       &lt;/div&gt;
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/ZpNuH.png" alt="enter image description here"></p>
  
  <p>In the image above, All I would like its the gray bar which would be what I'd consider to be the heading. If there are no results to show, I simply want the bar to appear without the outline of the body. </p>
  
  <p>As a test, I removed the body completely from the code but the border was still there.</p>
  
  <p>Is there a part of the panels CSS that is causing this that I can overwrite?</p>
  
  <p>This is for Panels in Bootstrap 2 which I did by using the following CSS:</p>
  
  <pre><code> panel {
    padding: 15px;
    margin-bottom: 20px;
    background-color: #ffffff;
    border: 1px solid #dddddd;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  }
  
  .panel-heading {
    padding: 10px 15px;
    margin: -15px -15px 15px;
    font-size: 17.5px;
    font-weight: 500;      
    background-color: #f5f5f5;
    border-bottom: 1px solid #dddddd;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
  }
  
  .panel-footer {
    padding: 10px 15px;
    margin: 15px -15px -15px;
    background-color: #f5f5f5;
    border-top: 1px solid #dddddd;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
  } 
  
  .panel-primary {
    border-color: #428bca;
  }
  
  .panel-primary .panel-heading {
    color: #ffffff;
    background-color: #428bca;
    border-color: #428bca;
  }
  </code></pre>