.button-variant(@color, @background, @hover: darken(@background, 10%)) {

    color: @color;
    background-color: @background;

    &:hover,
    &:active {
        color: @color;
        background-color: @hover;
    }
}

.button-outline-variant(@color, @background) {

    box-shadow: inset 0 0 0 2px @background;
    color: @background;

    &:hover,
    &:active {
        color: @color;
        background-color: @background;
    }
}

.button-circle(@width) {
    display: block;
    text-align:     center;
    width:          @width;
    height:         @width;
    line-height:    @width;
    border-radius:  50%;
}