.normal-blue-button {
    width: auto;
    border: 0;
    background-color: var(--dark-blue);
    color: var(--white);
    font-size: 18px;
    line-height: 24px;
    font-weight: 400;
    min-height: 47px;
    cursor: pointer;
}

.small-blue-button {
    width: auto;
    border: 0;
    cursor: pointer;
}

.small-blue-button,
.normal-blue-button,
.big-blue-button {
    background: var(--dark-blue);
    color: var(--white);
}

.small-blue-button:hover,
.small-blue-button:active,
.small-blue-button:focus,
.normal-blue-button:hover,
.normal-blue-button:active,
.normal-blue-button:focus,
.big-blue-button:hover,
.big-blue-button:active,
.big-blue-button:focus {
    background: var(--lighter-blue);
    color: var(--dark-blue);
}

.small-blue-button:hover svg,
.small-blue-button:active svg,
.small-blue-button:focus svg,
.normal-blue-button:hover svg,
.normal-blue-button:active svg,
.normal-blue-button:focus svg,
.big-blue-button:hover svg,
.big-blue-button:active svg,
.big-blue-button:focus svg {
    fill: var(--dark-blue);
}

.small-blue-button.is-secondary,
.normal-blue-button.is-secondary,
.big-blue-button.is-secondary {
    box-shadow: inset 0 0 0 2px var(--dark-blue);
    background: var(--white);
    color: var(--dark-blue);
}

.small-blue-button.is-secondary:hover,
.small-blue-button.is-secondary:active,
.small-blue-button.is-secondary:focus,
.normal-blue-button.is-secondary:hover,
.normal-blue-button.is-secondary:active,
.normal-blue-button.is-secondary:focus,
.big-blue-button.is-secondary:hover,
.big-blue-button.is-secondary:active,
.big-blue-button.is-secondary:focus {
    background: var(--lighter-blue);
    color: var(--dark-blue);
}

.small-blue-button.is-disabled,
.normal-blue-button.is-disabled,
.big-blue-button.is-disabled {
    background: var(--grey);
    color: var(--grey-04);
    cursor: not-allowed;
}

.small-blue-button.is-secondary.is-disabled,
.normal-blue-button.is-secondary.is-disabled,
.big-blue-button.is-secondary.is-disabled {
    box-shadow: inset 0 0 0 2px var(--grey-04);
    background: var(--grey);
    color: var(--grey-04);
    cursor: not-allowed;
}

.small-blue-button.is-right-aligned,
.normal-blue-button.is-right-aligned,
.big-blue-button.is-right-aligned {
    margin-top: 0;
}

@media (min-width: 767px) {
    .small-blue-button.is-right-aligned,
    .normal-blue-button.is-right-aligned,
    .big-blue-button.is-right-aligned {
        display: flex;
        margin-top: 15px;
        margin-left: auto;
        margin-right: 0;
    }
}