.progress {
    width: 97%;
}

#course_progressbar .progress {
    width: 100%;
    margin-bottom: 2.4em;
}

    #course_progressbar .progress .hbar {
        height: 1.3em;
        border-bottom: 3px solid #D1D3D4;
        text-indent: 2.2em;
        padding-left: 0.8em;
    }

    #course_progressbar .progress .point {
        border: 3px solid;
        border-radius: 50%;
    }

.progress .steps-container {
    display: flex;
    margin-bottom: -30px;
    flex-wrap: nowrap;
    justify-content: space-between;
}

.progress .area {
    float: left;
    position: relative;
    height: 2.2em;
    width: 100%;
}


.progress .last .hbar {
    display: none;
}



.progress .hbar {
    height: 1em;
    border-bottom: 0.2em solid #D1D3D4;
    text-indent: 2.2em;
    padding-left: 0.8em;
}

.progress.four_steps .hbar.three {
    text-indent: 0.1em;
}

.progress.four_steps .hbar span {
    text-transform: uppercase;
    font-size: 0.8em;
    color: #D1D3D4;
    font-weight: bold;
    /*display: none;*/
}

.progress .point {
    position: absolute;
    top: 5px;
    border: none;
    display: block;
    height: 1.8em;
    line-height: 1.8em;
    width: 1.8em;
    text-align: center;
    border-radius: 2em;
    background: inherit;
}

    .progress .point span {
        font-size: 1.1em;
        font-weight: bold;
        color: #D1D3D4;
        /*display: none;*/
    }

.progress.active_1 .hbar.one span, .progress.active_2 .hbar.two span, .progress.active_3 .hbar.three span, .progress.active_4 .hbar.four span, .progress.active_5 .hbar.five span, .progress.active_6 .hbar.six span {
    display: block;
}


.progress.active_1 .point.one span, .progress.active_2 .point.two span, .progress.active_3 .point.three span, .progress.active_4 .point.four span, .progress.active_5 .point.five span, .progress.active_6 .point.six span {
    display: block;
}

.progress.four_steps.active_2 .hbar.one span, .progress.four_steps.active_3 .hbar.one span, .progress.four_steps.active_4 .hbar.one span, .progress.four_steps.active_2 .point.one span, .progress.four_steps.active_3 .point.one span, .progress.four_steps.active_4 .point.one span, .progress.four_steps.active_3 .hbar.two span, .progress.four_steps.active_4 .hbar.two span, .progress.four_steps.active_3 .point.two span, .progress.four_steps.active_4 .point.two span, .progress.four_steps.active_4 .hbar.three span, .progress.four_steps.active_4 .point.three span {
    display: block;
}

.progress.five_steps.active_2 .point.one span, .progress.five_steps.active_3 .point.one span, .progress.five_steps.active_4 .point.one span, .progress.five_steps.active_2 .point.one span, .progress.five_steps.active_3 .point.one span, .progress.five_steps.active_4 .point.one span, .progress.five_steps.active_3 .point.two span, .progress.five_steps.active_4 .point.two span, .progress.five_steps.active_3 .point.two span, .progress.five_steps.active_4 .point.two span, .progress.five_steps.active_4 .point.three span, .progress.five_steps.active_4 .point.three span {
    display: block;
}


.progress.six_steps.active_2 .point.one span, .progress.six_steps.active_3 .point.one span, .progress.six_steps.active_4 .point.one span, .progress.six_steps.active_2 .point.one span, .progress.six_steps.active_3 .point.one span, .progress.six_steps.active_4 .point.one span, .progress.six_steps.active_3 .point.two span, .progress.six_steps.active_4 .point.two span, .progress.six_steps.active_3 .point.two span, .progress.six_steps.active_4 .point.two span, .progress.six_steps.active_4 .point.three span, .progress.six_steps.active_5 .point.one span, .progress.six_steps.active_5 .point.two span, .progress.six_steps.active_5 .point.three span, .progress.six_steps.active_5 .point.four span, .progress.six_steps.active_6 .point.one span, .progress.six_steps.active_6 .point.two span, .progress.six_steps.active_6 .point.three span, .progress.six_steps.active_6 .point.four span, .progress.six_steps.active_6 .point.five span {
    display: block;
}

.progress.six_steps .point, .progress.seven_steps .point, .progress.five_steps .point {
    left: -1em;
}

    .progress.six_steps .point.one, .progress.seven_steps .point.one, .progress.five_steps .point.one {
        left: 0;
    }

    .progress.six_steps .point.six, .progress.seven_steps .point.seven, .progress.five_steps .point.five {
        left: -2em;
    }

.progress.six_steps .area.last, .progress.seven_steps .area.last, .progress.five_steps .area.last, .progress.s7_steps .area.last {
    width: 0;
}

#course_progressbar .progress.four_steps .point {
    left: -1em;
}

    #course_progressbar .progress.four_steps .point.one {
        left: 0;
    }

    #course_progressbar .progress.four_steps .point.four {
        left: -2em;
    }

#course_progressbar .progress.four_steps .area.last {
    width: 0;
}

.progress.three_steps .point {
    left: -1em;
}

    .progress.three_steps .point.one {
        left: 0;
    }

    .progress.three_steps .point.three {
        left: -2em;
    }

.progress.three_steps .area.last {
    width: 0;
}

.progress.two_steps .point {
    left: -1em;
}

    .progress.two_steps .point.one {
        left: 0;
    }

    .progress.two_steps .point.three {
        left: -2em;
    }

.progress.two_steps .area.last {
    width: 0;
}


.pbtextconteiner, .pbtextconteineract {
    /*margin: 1.5em 0 2em 0;*/
    line-height: 1.5em;
    font-size: 14px;
    /*padding-top: 1em;*/
}

.pbtextconteinerm, .pbtextconteineramct {
    margin: 1.5em 0 2em -5em;
    width: 10em;
    line-height: 1.5em;
    font-weight: 700;
    text-align: center;
}

.pbtextconteinerl, .pbtextconteinerlmct {
    margin: 1.5em 0 2em -8em;
    width: 10em;
    line-height: 1.5em;
    font-weight: 700;
    text-align: right;
}

.pbtextconteinerlmct {
    margin-top: 2.7em;
}

.nothingleft {
    left: 0 !important;
}

.progress.four_steps .point.one, .progress.four_steps .point.two {
    left: 0;
}

.progress.four_steps .point.three, .progress.four_steps .point.four {
    right: 0;
}

.progress.divicons {
    height: 4em;
}