Bootstrap Buttons-hover with colors


	<div class="container">
    <div class="row">
      <h3>You can go hover those buttons</h3>
      <a href="javascript:;" class="btn btn-lg btn-hover btn-default">Large</a>
      <a href="javascript:;" class="btn btn-md btn-hover btn-default">Medium</a> 
      <a href="javascript:;" class="btn btn-sm btn-hover btn-default">Small</a> 
      <a href="javascript:;" class="btn btn-xs btn-hover btn-default">Xsmall</a>
      <hr>
      <h3>Oh, it also work with bootstrap colors</h3>
      <a href="javascript:;" class="btn btn-md btn-hover btn-default">Default</a>
      <a href="javascript:;" class="btn btn-md btn-hover btn-primary">Primary</a> 
      <a href="javascript:;" class="btn btn-md btn-hover btn-info">Info</a> 
      <a href="javascript:;" class="btn btn-md btn-hover btn-warning">Warning</a>
      <a href="javascript:;" class="btn btn-md btn-hover btn-danger">Danger</a>
      <a href="javascript:;" class="btn btn-md btn-hover btn-success">Success</a>
      <hr>
      <h3>Eventually, it's nice with icons</h3>
      <a href="javascript:;" class="btn btn-sm btn-hover btn-primary"><span class="glyphicon glyphicon-thumbs-up"></span></a>
      <a href="javascript:;" class="btn btn-sm btn-hover btn-danger"><span class="glyphicon glyphicon-thumbs-down"></span></a>
      <a href="javascript:;" class="btn btn-sm btn-hover btn-success"><span class="glyphicon glyphicon-check"></span></a>
      <a href="javascript:;" class="btn btn-xs btn-hover btn-default">Print <span class="glyphicon glyphicon-print"></span></a>
      
      <hr>
    </div>
  </div>
  <div style="background:#333">        
    <div class="container">
      <div class="row">
      <h3 style="color:#fff">And it works with dark backgrounds : use -alt to display it white</h3>              
        <a href="javascript:;" class="btn btn-lg btn-hover-alt btn-primary">Hey baby</a>
        <a href="javascript:;" class="btn btn-sm btn-hover-alt btn-success"><span class="glyphicon glyphicon-thumbs-up"></span></a>
        <a href="javascript:;" class="btn btn-xs btn-hover-alt btn-default">Print <span class="glyphicon glyphicon-print"></span></a>
        <br><br>
      </div>
    </div>
</div>
	<script type="text/javascript">
	
	</script>

    .btn-hover {
  font-weight: normal;
  color: #333333;
  cursor: pointer;
  background-color: inherit;
  border-color: transparent;
}

.btn-hover-alt {
  font-weight: normal;
  color: #ffffff;
  cursor: pointer;
  background-color: inherit;
  border-color: transparent;
}