/*------------------------------------*\ #BUTTONS \*------------------------------------*/ .button { font-size: inherit; border: none; border-radius: $radius-default; color: $button-color; padding: 2px 13px; cursor: pointer; min-width: 75px; font-family: $font-regular; &:hover { border-color: $button-color; } &:focus, &:active { border-color: transparent; } &:disabled { opacity: .5; cursor: default; pointer-events: none; border: 1px solid transparent; } } .button--default { background-color: $button-default; box-shadow: 0px 0px 0px 1px $button-default; border: 1px solid $button-default; &:focus, &:active { box-shadow: 0px 0px 0px 1px $button-default-active; } } .button--primary { background-color: $button-primary; box-shadow: 0px 0px 0px 1px $button-primary; border: 1px solid $button-primary; &:focus, &:active { box-shadow: 0px 0px 0px 1px $button-primary-active; } }