/* circle progress bar start */
.circle-progress-bar {
	position: relative;
}

.circle-progress-bar .progress-content {
	position: relative;
}

.circle-progress-bar .radial {
	position: relative;
	top: 0em;
	left: 0em;
	font-size: 2.0em;
	width: 1.0em;
	height: 1.0em;
	border-radius: 50%;	
	background-color: #2167AE;
}
/* outer circle */
.circle-progress-bar .radial:before {
	position: absolute;
	top: 0em;
	left: 0em;
	display: block;
	content: " ";
	border-radius: 50%;
	background-color: transparent;
	width: 0.86em;
	height: 0.86em;
	box-sizing: content-box !important;
	border: 0.08em solid transparent;
	/* background-color: rgba(60, 65, 80, 0.30) */
}
/* inner circle */
.circle-progress-bar .radial:after {
	position: absolute;
	top: 0.09em;
	left: 0.09em;
	display: block;
	content: " ";
	border-radius: 50%;
	background-color: #2167AE;
	width: 0.80em;
	height: 0.80em;
	box-sizing: content-box !important;
}

.circle-progress-bar .radial-initial-clip {
	position: absolute;
	width: 1em;
	height: 1em;
	clip: rect(0em, 1em, 1em, 0.5em);
	box-sizing: content-box !important;
	left: 0em;
	top:0em;
}

.circle-progress-bar .radial>span {
	position: absolute;
	width: 100%;
	z-index: 1;
	left: 0em;
	top: 0em;	
	font-size: 0.30em;
	color:#fff;
	display: block;
	text-align: center;
	white-space: nowrap;
	display: flex;
	text-align: center;
	white-space: nowrap;
	justify-content: center;
	align-items: center;
	height: 100%;
}

.circle-progress-bar .over-50 {
	position: absolute;
	border: 0.08em solid transparent;
	width: 1em;
	height: 1em;
	clip: rect(auto, auto, auto, 0.5em);
	border-radius: 50%;
}

.circle-progress-bar .radial-bar {
	position: absolute;
	border: 0.08em solid transparent;
	width: 1em;
	height: 1em;
	clip: rect(0em, 0.5em, 1em, 0em);
	border-radius: 50%;
}
/* circle progress bar end */
/* horizontal progress bar start */
	#horizontal-progress-panel{
		position: relative;
		width: 80%;
		margin: 0px auto;
	}
	#horizontal-progress-div {
		position: relative;
		width: 100%;
		height: 21px;
		background-color: #BCDEE8;
		left: 0em;
		z-index: 1;
		border-radius: 20px;
		padding: 7px;
	}
	#horizontal-progress-div .full-strip{
		position: absolute;
		top: 0px;
		left: 0em;
		width: calc(100% - 14px);
		height: 7px;
		margin: 7px;
		background-color: #BCDEE8;
		border-radius: 20px;
		right: 0em;
	}
	#horizontal-progress-div .curr-strip{
		position: relative; 
		left: 0em; 
		bottom: 0em; 
		width: 0%; 
		height: 100%; 
		background-color: #2167AE; 
		transition: all 1s ease-in;
		border-radius: 20px;
	}

	#horizontal-progress-div .highlighter{
		position: absolute;
		left: calc(1% - 1em);	
		bottom: 0em;	
		width: 1em;	
		height: 1em;	
		background-color:#2167AE;
		transition: all 1s ease-in;
		display: none;
	}
/* horizontal progress bar end */

