button.components-button, a.components-button { &.is-primary, &.is-secondary { &:not(:disabled) { background-color: $color-black; } &:disabled { color: $color-white; } border-radius: 2px; padding: 14px 17px; height: auto; } &.is-primary { @include font(13, 20, 400); &:not(:disabled) { background-color: $color-blueberry; } } &.is-secondary:not(:disabled) { border-color: $color-blueberry; background-color: $color-white; color: $color-blueberry; &:hover { background-color: $color-white; background: none; } } &.is-tertiary { color: $color-blueberry; &:hover { color: $color-gradient-dark; } &:focus:not(:disabled) { border: none; box-shadow: none; } } }