.progress-iq {
    border-right: 1px solid #888;
    border-left: 1px solid #888;
    position: relative;
    height: 50px;
    padding-top: 15px;
    margin: 0 50px 30px 50px;
}
.progress-bar{
    overflow: unset;
}
.progress-iq::after {
    content: attr(data-end);
    position: absolute;
    left: -30px;
    top: 12px;
}
.progress-iq::before {
    content: attr(data-start);
    position: absolute;
    right: -20px;
    top: 12px;
}
.progress-iq .progress-bar {
    background: #f5f5f5;
}
.progress-iq .grid {
    position: absolute;
    bottom: -30px;
    width: 100%;
    color: #666;
}
.progress-iq .grid > div{
    width: 20%;
    text-align: center;
    font-size: 18px;
}
.progress-iq .grid-line {
    position: absolute;
    bottom: 0;
    width: 100%;
    color: #666;
}
.progress-iq .progress-bar .progress{
    background: #389DE7;
    position: relative;
    border-radius: 0;
    overflow: inherit;
}

.progress-iq .grid-line > div {
    border-right: 1px solid #888;
    height: 50px;
    overflow: inherit;
}

.progress-iq .progress-bar .progress::after {
    content: attr(data-value);
    z-index: 99999999;
    color: white;
    background: #389de7;
    position: absolute;
    left: 0px;
    padding: 5px 12px 2px;
    top: -6px;
    border-radius: 5px;
    box-shadow: 0 0 8px 0px #727272;
}