.bp-element-button {
    img {
        max-width: unset;
        height: initial;
    }
    .btn {
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;
        border: 0;
        display: inline-block;
        font-size: 16px;
        font-weight: 300;
    }
    .btn-lg {
        height: 85px;
        line-height: 85px;
        padding: 0 46px;
    }
    .btn-normal {
        height: 49px;
        line-height: 49px;
        padding: 0 37px;
        &.btn-outline {
            line-height: 47px;
        }
    }
    &.shape-round .btn {
        border-radius: 30px;
    }
    .border-gradient {
        overflow: hidden;
        position: relative;
        z-index: 1;
        &:before {
            content: '';
            display: block;
            width: 300%;
            height: 100%;
            border-radius: inherit;
            position: absolute;
            z-index: -1;
            top: 0px;
            right: -1px;
            transition: all 0.3s;
            background: #4c71b3;
            background: -webkit-linear-gradient(left, #4c71b3, #df4658, #4c71b3, #df4658);
            background: -o-linear-gradient(left, #4c71b3, #df4658, #4c71b3, #df4658);
            background: -moz-linear-gradient(left, #4c71b3, #df4658, #4c71b3, #df4658);
            background: linear-gradient(left, #4c71b3, #df4658, #4c71b3, #df4658);
        }
        &:after {
            position: absolute;
            left: 1px;
            right: 1px;
            top: 1px;
            border-radius: 30px;
            bottom: 1px;
            content: "";
            background-color: #FFFFFF;
            z-index: -1;
        }
        &:hover {
            background: linear-gradient(to left, #4c71b3, #df4658);
            color: #FFFFFF!important;
            &:before, &:after {
                display: none;
            }
        }
    }
    .style-gradient {
        overflow: hidden;
        position: relative;
        z-index: 1;
        &:before {
            content: '';
            display: block;
            width: 300%;
            height: 100%;
            border-radius: inherit;
            position: absolute;
            z-index: -1;
            top: 0px;
            right: -1px;
            transition: all 0.3s;
            background: #4c71b3;
            background: -webkit-linear-gradient(left, #4c71b3, #df4658, #4c71b3, #df4658);
            background: -o-linear-gradient(left, #4c71b3, #df4658, #4c71b3, #df4658);
            background: -moz-linear-gradient(left, #4c71b3, #df4658, #4c71b3, #df4658);
            background: linear-gradient(left, #4c71b3, #df4658, #4c71b3, #df4658);
        }
        &:hover {
            background: transparent;

            &:before {
                right: -100%;
            }
        }
    }

    // style show line
    &.line-through {
        position: relative;
        z-index: 0;

        &::before {
            content: '';
            display: block;
            width: 100%;
            height: 5px;
            background-image: url(../images/wave-line-bg-01.png);
            background-repeat: repeat-x;
            position: absolute;
            z-index: -1;
            top: calc(50% - 2px);
            left: 0;
        }
    }
}