title: Bootstrap. Removing the border around the thumbnail images
body: <p>I used bootstrap thumbnail class to create a grid of clickable images. For some reason, they have a border and its annoying me. </p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class = "the-grid"&gt;
  &lt;div class = "container"&gt;        
  &lt;div class = "row"&gt;
                &lt;div class = "col-md-4"&gt;
                  &lt;div class = "thumbnail"&gt;
                      &lt;image src = "Images/data.png"/&gt;
                  &lt;/div&gt;
                   &lt;div class = "thumbnail"&gt;
                      &lt;image src = "Images/cloud.png"/&gt;
                  &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS:    </p>
  
  <pre><code>&lt;style&gt;
  .the-grid{
  background-color: #efefef;    
  border-bottom: 1px solid #DBDBDB;
  min-height: 100%;
  }
  .the-grid .row .thumbnail{
  border: 0px;
  box-shadow: none;
  border-radius:0px;
  background-color: #000;
  }
  
  .the-grid .row .thumbnail  img:hover {
   background-color: #000 !importantl        
  &lt;/style&gt;
  </code></pre>