btn($height, $padding = $height / 2 $height)
  clearfix()
  size(auto)
  cursor: pointer
  display: inline-block
  margin: 6px 4px
  padding: $padding
  text-decoration: none !important
  &:focus
    outline: none
  span + [class^="znicon-"],
  span + [class*=" znicon-"],
  span + .icon,
  [class^="znicon-"] + span,
  [class*=" znicon-"] + span,
  .icon + span
    padding: 0 0 0 8px

btn-varient($background-color, $border-color = darken($background-color, 9%), $background-hover-color = darken($background-color, 3%), $background-active-color = darken($background-color, 6%))
  border(1px, solid, $border-color)
  box-shadow(0 1px 3px $background-hover-color)
  background-color: $background-color
  &:hover
    background: $background-hover-color !important
  &:active
    box-shadow(none)
    background: $background-active-color !important

btn-gradient($start-color, $end-color = darken($start-color, 4%))
  background: $start-color
  background: linear-gradient(top, $start-color, $end-color)
  background: -moz-linear-gradient(top, $start-color, $end-color)
  background: -webkit-gradient(linear, left top, left bottom, from($start-color), to($end-color))

btn-resize($height, $font-size, $padding = $height / 2 $height)
  font-size: $font-size
  line-height: $height
  padding: $padding