.progress-outer{
    background: #fff;
    border-radius: 50px;
    padding: 25px;
    margin: 10px 0;
    box-shadow: 0 0  10px rgba(209, 219, 231,0.7);
}
.progress{
    height: 27px;
	/*width: 30rem;
	max-width: 30rem;
	min-width: 10rem;
	min-height: 100%;*/
    margin: 0;
    overflow: visible;
    border-radius: 50px;
    background: #eaedf3;
    box-shadow: inset 0 10px  10px rgba(245, 170, 50,0.2);
}
.progress-bar{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	-ms-flex-direction:column;
	flex-direction:column;
	-webkit-box-pack:center;
	-ms-flex-pack:center;
	justify-content:center;
	color:#fff;
	text-align:center;
	background-color:#ec4e00;
	transition:width .6s ease;
}
.progress .progress-bar{
    border-radius: 50px;
}
.progress .progress-value{
    display:flex;
	position: absolute;			
	font-size: 14px;
    font-weight: bold;
    color: #000000;
    letter-spacing: 2px;
	padding: 0 50% 0 50%;
	left: -45px;
	
}

.progress-value:hover{
	/*position: relative;
	align-items: center;
    justify-content: center;
	left: -45px;
    top: 4px;*/
	font-size: 16px;
    /*font-weight: bold;
    color: #fff;
    letter-spacing: 2px;
    align-items: center;
    justify-content: center;	*/
}
.progress-bar.active{
    animation: reverse progress-bar-stripes 3.00s linear infinite, animate-positive 2s;
	/*animation: progress-bar-stripes 1s linear infinite;*/
}
@-webkit-keyframes animate-positive{
    0% { width: 0%; }	
}
@keyframes animate-positive {
    0% { width: 0%; }	
}

@keyframes progress-bar-stripes {
    from {
        background-position: 1rem 0
    }

    to {
        background-position: 0 0
    }
}