@mixin button($colour)
  display: inline-block
  position: relative
  font-family: "Helvetica Neue", "Arial", sans-serif
  font-size: 1em
  text-decoration: none
  padding: 0.3em 1em
  @include linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.2))
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25), inset -1px -1px 0 rgba(255, 255, 255, 0.5), inset 1px 1px 0 rgba(255, 255, 255, 0.6), inset 0 0 6px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.3)
  border-width: 1px
  border-style: solid
  background-color: $colour
  border-color: darken($colour, 20%)
  color: white
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5)
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25), inset -1px -1px 0 rgba(255, 255, 255, 0.2), inset 1px 1px 0 rgba(255, 255, 255, 0.3), inset 0 0 6px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.3)
  font-weight: bold
  cursor: pointer
  @include transition(background 0.15s 0s ease)
  border-radius: 3px
  &:hover, &:focus
    background-color: lighten($colour, 10%)
  &:active
    top: 1px