button {
    > * {
        pointer-events: none;
    }
}

.btn {
    text-transform: uppercase;
    line-height: 1.063;

    &:hover {
        background: $icenight;
        color: #ffffff!important;
    }

    &.loading {
        position: relative;
        color: transparent;
        opacity: 0.5;
        cursor: not-allowed;

        &:before {
            content: '';
            position: absolute;
            display: inline-block;
            width: 1.3rem;
            height: 1.3rem;
            vertical-align: text-bottom;
            border: 0.25em solid currentColor;
            border-right-color: transparent;
            border-radius: 50%;
            -webkit-animation: 0.75s linear infinite spinner-border;
            animation: 0.75s linear infinite spinner-border;
            left: 50%;
            top: 50%;
            margin-left: -0.65rem;
            margin-top: -0.65rem;
            color: #ffffff;
        }

        &:hover {
            background-color:#000000 !important;
        }
    }
}

.btn-lg {
    font-size: 1.125rem;
    line-height: 1.1115;

    &.loading {
        &:before {
            width: 1.8rem;
            height: 1.8rem;
            margin-left: -0.9rem;
            margin-top: -0.9rem;
        }
    }
}

.btn-sm {
    line-height: 1;
}

.btn-xs {
    padding: 0.75rem;
    padding-bottom: 0.75rem;
    line-height: 1;

    &.loading {
        &:before {
            width: 1.0rem;
            height: 1.0rem;
            margin-left: -0.5rem;
            margin-top: -0.5rem;
        }
    }
}

.btn-outline-light:hover {
    background-color: #ffffff;
    color: $icenight !important;
}

.btn-primary:hover {
    background-color: #fff !important;
    border: 2px solid black;
    border-color: #000000 !important;
    color: #000!important;
}

.btn-secondary, .btn-outline-secondary {
    color: $icenight;
}