.btn
  display: inline-block
  padding: 6px 12px
  margin-bottom: 0
  font-size: $font-size-base
  font-weight: $font-weight-bold
  line-height: $line-height-base
  text-align: center
  white-space: nowrap
  vertical-align: middle
  -ms-touch-action: manipulation
  touch-action: manipulation
  cursor: pointer
  -webkit-user-select: none
  -moz-user-select: none
  -ms-user-select: none
  user-select: none
  background-image: none
  border: 1px solid transparent
  border-radius: 4px
  text-decoration: none
  +background(linear-gradient(to bottom,  #c2c5c6 12%, #c2c5c6 50%, #babdc0 51%, #babdc0 100%))


  color: $white

  img
    position: relative
    height: $font-size-base
    vertical-align: baseline
    top: 2px

.btn.btn-success-glow
  +background(linear-gradient(to bottom,  #59db81 12%, #59db81 50%, #5bd282 51%, #5bd282 100%))

.btn.btn-warning-glow
  +background(linear-gradient(to bottom,  #fd9825 12%, #fd9825 50%, #fa7a27 51%, #fa7a27 100%))

.btn.btn-brand-glow
  +background(linear-gradient(to bottom,  #3289ff 12%, #3289ff 50%, #2a7eec 51%, #2a7eec 100%))

.btn.btn-error-glow
  +background(linear-gradient(to bottom,  #f2303f 12%, #f2303f 50%, #da2e3d 51%, #da2e3d 100%))

.btn.btn-danger
  background: $brand-danger

.btn-save
  width: 160px
  font-weight: bold
  text-transform: uppercase

.btn.btn-trash
  width: 44px
  height: 44px
  background-image: url('../img/#{$resourceRoutePre}structure/icon_trash.svg')
  background-repeat: no-repeat
  background-position: 50% 50%
  background-size: 16px 16px