.btn {
  position: relative;
  border: 0 !important;
  &:focus { outline: 0; }
  &:hover { top: 2px; }
  &:active { top: 6px; }
  cursor: pointer;
  -webkit-font-smoothing: antialiased;
  font-weight: bold !important;
  
  .border-radius(10);
  .transition(all, 50ms, ease);
  .btn(rgb(204, 204, 204), 20%);
  
}

.btn-primary {
  .btn(#428bca);
}

.btn-success {
  .btn(#5cb85c);
}

.btn-info {
  .btn(#5bc0de);
}

.btn-warning {
  .btn(#f0ad4e);
}

.btn-danger {
  .btn(#d9534f);
}

.btn-link {
  text-shadow: none;
  background: none !important;
  .box-shadow(none);
  &:hover { 
    border: 0;
    background: none !important;
    .box-shadow(none);
    top: 0;
  }
  &:active { 
    .box-shadow(none); 
    top: 0;
  }
}

.btn(@color, @percent: 10%)  {
    border: 0;
    text-shadow: 0px 1px 0px darken(@color, @percent);
    background-color: @color;
    .box-shadow(0px, 6px, 0px, darken(@color, @percent));
    &:hover { 
      border: 0;
      background-color: lighten(@color, 5%) !important;
      .box-shadow(0px, 4px, 0px, darken(@color, @percent));
    }
    &:active { 
      .box-shadow(inset, 0px, 3px, 0px, darken(@color, @percent)); 
    }
}