.prgoress_indicator::after, .prgoress_indicator::before {
    position: absolute;
    content: "\f106";
    font-family: "Font Awesome 5 Free";
    text-align: center;
    line-height: 46px;
    font-size: 18px;
    font-weight: 900;
    left: 0;
    top: 0
}

.prgoress_indicator, .prgoress_indicator::after, .prgoress_indicator::before {
    height: 46px;
    width: 46px;
    cursor: pointer;
    display: block;
    transition: .2s linear !important
}

.prgoress_indicator {
    position: fixed;
    right: 26px;
    bottom: 35px;
    border-radius: 50px;
    box-shadow: inset 0 0 0 2px rgba(22,93,245,.2);
    z-index: 9999999999;
    opacity: 0;
    visibility: hidden;
    transform: translateY(15px) !important
}

    .prgoress_indicator.active-progress {
        opacity: 1;
        visibility: visible;
        transform: translateY(0) !important
    }

    .prgoress_indicator::after {
        color: #283e7a;
        z-index: 1
    }

    .prgoress_indicator::before {
        opacity: 0;
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        z-index: 2
    }

    .prgoress_indicator:hover ::after {
        color: #366b2a
    }

    .prgoress_indicator:hover ::before {
        opacity: 1
    }

    .prgoress_indicator svg path {
        fill: none
    }

    .prgoress_indicator svg.progress-circle path {
        stroke: #283e7a;
        stroke-width: 4;
        box-sizing: border-box;
        transition: .2s linear !important
    }