.base-timer {
	position: relative;
}

.base-timer__svg {
	-webkit-transform: scaleX(-1);
					transform: scaleX(-1);
}

.base-timer__circle {
	fill: none;
	stroke: none;
}

.base-timer__path-elapsed {
	stroke-width: 10px;
	stroke: grey;
}

.base-timer__path-remaining {
	stroke-width: 10px;
	stroke-linecap: round;
	-webkit-transform: rotate(90deg);
					transform: rotate(90deg);
	-webkit-transform-origin: center;
					transform-origin: center;
	-webkit-transition: 1s linear all;
	transition: 1s linear all;
	fill-rule: nonzero;
	stroke: currentColor;
}

.base-timer__path-remaining.green {
	color: #609161;
}

.base-timer__path-remaining.orange {
	color: #d1b77d;
}

.base-timer__path-remaining.red {
	color: #ab5959;
}

.base-timer__label {
	position: absolute;
	width: 100%;
	height: 100%;
	top: -.1vh;
	display: -webkit-box;
	display: flex;
	-webkit-box-align: center;
					align-items: center;
	-webkit-box-pack: center;
					justify-content: center;
	opacity: .7;
}