#progressui, #textui, #notification1 {
	padding: 25px;
	background: rgba(0,0,0,0.5);
	width: 800px;
	position: fixed;
	left: 50%;
	top: 45%;
	transform: translate(-50%, 0);
	text-align: center;
	color: white;
	opacity: 0;
	transition: all 250ms linear;
	font-size: 1.75rem;
	text-shadow: 0px 2px 2px rgba(0,0,0,0.85);
}
#textui {
	top: 35%;
}
#progress-circle {
	width: 130px;
	transform:  rotate(95deg);
}
#progress-percent{
	position: absolute;
	top: 70px;
	left: 50%;
	transform: translate(-50%, 0);
}

#progress-circle-text {
	margin-top: 15px;
}

svg circle { display: block; fill: transparent; stroke-width: 5px; stroke-linecap: round; stroke-dasharray: 278; stroke-dashoffset: 0; transform-origin: 50% 50%; }
svg circle.mask { stroke: rgba(0,0,0,0.35); }
svg circle.speed { stroke: url(#speed-gradient); stroke-dashoffset: 180; }
svg:first-child { z-index: 11; }

svg circle { transition: all 250ms linear; }
svg circle.guage { stroke: #ffffff; stroke-dashoffset: 278; }

#notification1 {
	top: 10px;
	left: 10px;
    text-align: left;
    padding: 10px;
	width: auto;
	transform: translate(0, 0);
}