.button,
.small_button {
    border: none;
    display: inline-block;
    vertical-align: baseline;
    font-weight: 700;
    padding: 10px 15px;
    outline: none;
}

.small_button {
    padding: 5px 10px;
}

.button:last-child {
    margin-right: 0;
}

/* Disabled button */
.d_state {
    color: rgba(255,255,255,0.5);

    /* 50% White */
    border: solid 1px rgba(255,255,255,0.5);

    /* 50% White */
    cursor: default;
}

/* active button */
.a_state {
    color: rgba(255,255,255,1);

    /* White */
    background: none;
    border: solid 1px rgba(255,255,255,1);

    /* White */
    cursor: pointer;
    transition: all 0.35s;
}

.a_state:hover,
.a_state:active {
    color: rgba(255,255,255,1);
    background-color: rgb(56,65,72);

    /* Charcoal */
    transition: none;
}

.a_state:active {
    padding-top: 11px;
    padding-bottom: 9px;
}

.small_button.a_state:active {
    padding-top: 6px !important;
    padding-bottom: 4px !important;
}

.button_group {
    display: block;
    margin: 0;
    text-align: justify;
    vertical-align: top;
}

.inline_button_group {
    display: inline-block;
    margin: 0;
    text-align: justify;
    vertical-align: top;
}

.button_group .button,
.button_group .small_button,
.inline_button_group .button,
.inline_button_group .small_button {
    vertical-align: top;
}

.selected {
    color: rgba(255,255,255,1);
    border: solid 1px rgba(0,0,0,1);

    /* Green */
    background: rgba(0,0,0,1);

    /* Green */
}