title: How to change text color in button hover property
body: <p>I used this guide to customize buttons in a web page I've made with bootstrap:</p>
  
  <p><a href="https://stackoverflow.com/questions/25923623/change-hover-color-on-a-button-with-bootstrap-customization">Change hover color on a button with Bootstrap customization</a></p>
  
  <p>The problem is that I can't manage to keep the same font-color in hover and I can't explain why it always changes to dark grey.
  Here's the code: <a href="http://codepen.io/anon/pen/ByKZZK" rel="nofollow noreferrer">http://codepen.io/anon/pen/ByKZZK</a></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;head&gt;
     &lt;link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"&gt;
  &lt;/head&gt;
  
  &lt;button href="mailto:abc@def.ghi" class="btn btn-custom btn-lg btn-block"&gt;info@mail.org&amp;nbsp; &lt;span class="glyphicon glyphicon-envelope"&gt;&lt;/span&gt;&lt;/button&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>.btn-custom {
      color: #FFD180;;
      background-color: #483737;
      border-color: #357ebd; /*set the color you want here*/
  }
  .btn-custom:hover, .btn-custom:focus, .btn-custom:active, .btn-custom.active, .open&gt;.dropdown-toggle.btn-custom {
      color: #FFD180;
      background-color: #837171;
      border-color: #837171; /*set the color you want here*/
  }
  </code></pre>
  
  <p>Any ideas?</p>