/* Created with SCSS Preprocessor
 * SCSS source code see https://github.com/radiance/scss-progress-circle-border/
 */
 /* SCSS source code for drawing progress circles
 * see also https://github.com/radiance/scss-progress-circle-border/
 */
 /* SCSS source code for drawing progress circles
  * see also https://github.com/radiance/scss-progress-circle-border/
  */
	/* SCSS source code for drawing progress circles
	 * see also https://github.com/radiance/scss-progress-circle-border/
	 */
	 /* SCSS source code for drawing progress circles
  * see also https://github.com/radiance/scss-progress-circle-border/
  */
	/* SCSS source code for drawing progress circles
	 * see also https://github.com/radiance/scss-progress-circle-border/
	 */
	@import url("https://fonts.googleapis.com/css2?family=Source+Sans+Pro&display=swap");

	html {
		box-sizing: border-box;
	}

	*,
	*:before,
	*:after {
		box-sizing: inherit;
	}

	.progress-circle {
		display: block;
		height: 120px;
		min-height: 120px;
		min-width: 120px;
		width: 120px;
		margin: 2em;
	}

	.progress-circle .progress-circle-border {
		border: 5px solid #ccc;
		border-radius: 100%;
		font-size: 120px;
		height: 120px;
		position: absolute;
		text-align: center;
		width: 120px;
	}

	.progress-circle .progress-circle-border .left-half-circle,
	    .progress-circle .progress-circle-border .right-half-circle {
		border: 5px solid #fff;
		border-radius: 50%;
		clip: rect(0, 0.5em, 1em, 0);
		height: 120px;
		margin-top: -5px;
		margin-left: -5px;
		position: absolute;
		width: 120px;
	}

	.progress-circle .progress-circle-border .left-half-circle {
		clip: rect(0, 0.5em, 1em, 0);
	}

	.progress-circle .progress-circle-content {
		align-items: center;
		background-color: #ffffff29;
		border: 0;
		border-radius: 100%;
		display: flex;
		flex-direction: column;
		font-family: 'Source Sans Pro', sans-serif;
		height: 110px;
		justify-content: center;
		margin: 5px;
		min-height: 110px;
		min-width: 110px;
		padding: 1em;
		position: absolute;
		text-align: center;
		width: 110px;
		z-index: 2;
	}

	.progress-circle.p-1 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-1 .right-half-circle {
		transform: rotate(3.6deg);
	}

	.progress-circle.p-2 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-2 .right-half-circle {
		transform: rotate(7.2deg);
	}

	.progress-circle.p-3 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-3 .right-half-circle {
		transform: rotate(10.8deg);
	}

	.progress-circle.p-4 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-4 .right-half-circle {
		transform: rotate(14.4deg);
	}

	.progress-circle.p-5 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-5 .right-half-circle {
		transform: rotate(18deg);
	}

	.progress-circle.p-6 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-6 .right-half-circle {
		transform: rotate(21.6deg);
	}

	.progress-circle.p-7 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-7 .right-half-circle {
		transform: rotate(25.2deg);
	}

	.progress-circle.p-8 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-8 .right-half-circle {
		transform: rotate(28.8deg);
	}

	.progress-circle.p-9 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-9 .right-half-circle {
		transform: rotate(32.4deg);
	}

	.progress-circle.p-10 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-10 .right-half-circle {
		transform: rotate(36deg);
	}

	.progress-circle.p-11 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-11 .right-half-circle {
		transform: rotate(39.6deg);
	}

	.progress-circle.p-12 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-12 .right-half-circle {
		transform: rotate(43.2deg);
	}

	.progress-circle.p-13 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-13 .right-half-circle {
		transform: rotate(46.8deg);
	}

	.progress-circle.p-14 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-14 .right-half-circle {
		transform: rotate(50.4deg);
	}

	.progress-circle.p-15 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-15 .right-half-circle {
		transform: rotate(54deg);
	}

	.progress-circle.p-16 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-16 .right-half-circle {
		transform: rotate(57.6deg);
	}

	.progress-circle.p-17 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-17 .right-half-circle {
		transform: rotate(61.2deg);
	}

	.progress-circle.p-18 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-18 .right-half-circle {
		transform: rotate(64.8deg);
	}

	.progress-circle.p-19 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-19 .right-half-circle {
		transform: rotate(68.4deg);
	}

	.progress-circle.p-20 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-20 .right-half-circle {
		transform: rotate(72deg);
	}

	.progress-circle.p-21 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-21 .right-half-circle {
		transform: rotate(75.6deg);
	}

	.progress-circle.p-22 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-22 .right-half-circle {
		transform: rotate(79.2deg);
	}

	.progress-circle.p-23 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-23 .right-half-circle {
		transform: rotate(82.8deg);
	}

	.progress-circle.p-24 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-24 .right-half-circle {
		transform: rotate(86.4deg);
	}

	.progress-circle.p-25 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-25 .right-half-circle {
		transform: rotate(90deg);
	}

	.progress-circle.p-26 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-26 .right-half-circle {
		transform: rotate(93.6deg);
	}

	.progress-circle.p-27 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-27 .right-half-circle {
		transform: rotate(97.2deg);
	}

	.progress-circle.p-28 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-28 .right-half-circle {
		transform: rotate(100.8deg);
	}

	.progress-circle.p-29 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-29 .right-half-circle {
		transform: rotate(104.4deg);
	}

	.progress-circle.p-30 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-30 .right-half-circle {
		transform: rotate(108deg);
	}

	.progress-circle.p-31 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-31 .right-half-circle {
		transform: rotate(111.6deg);
	}

	.progress-circle.p-32 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-32 .right-half-circle {
		transform: rotate(115.2deg);
	}

	.progress-circle.p-33 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-33 .right-half-circle {
		transform: rotate(118.8deg);
	}

	.progress-circle.p-34 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-34 .right-half-circle {
		transform: rotate(122.4deg);
	}

	.progress-circle.p-35 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-35 .right-half-circle {
		transform: rotate(126deg);
	}

	.progress-circle.p-36 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-36 .right-half-circle {
		transform: rotate(129.6deg);
	}

	.progress-circle.p-37 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-37 .right-half-circle {
		transform: rotate(133.2deg);
	}

	.progress-circle.p-38 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-38 .right-half-circle {
		transform: rotate(136.8deg);
	}

	.progress-circle.p-39 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-39 .right-half-circle {
		transform: rotate(140.4deg);
	}

	.progress-circle.p-40 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-40 .right-half-circle {
		transform: rotate(144deg);
	}

	.progress-circle.p-41 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-41 .right-half-circle {
		transform: rotate(147.6deg);
	}

	.progress-circle.p-42 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-42 .right-half-circle {
		transform: rotate(151.2deg);
	}

	.progress-circle.p-43 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-43 .right-half-circle {
		transform: rotate(154.8deg);
	}

	.progress-circle.p-44 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-44 .right-half-circle {
		transform: rotate(158.4deg);
	}

	.progress-circle.p-45 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-45 .right-half-circle {
		transform: rotate(162deg);
	}

	.progress-circle.p-46 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-46 .right-half-circle {
		transform: rotate(165.6deg);
	}

	.progress-circle.p-47 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-47 .right-half-circle {
		transform: rotate(169.2deg);
	}

	.progress-circle.p-48 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-48 .right-half-circle {
		transform: rotate(172.8deg);
	}

	.progress-circle.p-49 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-49 .right-half-circle {
		transform: rotate(176.4deg);
	}

	.progress-circle.p-50 .left-half-circle {
		border-color: #ccc !important;
		z-index: 2;
		transform: rotate(0deg);
	}

	.progress-circle.p-50 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-51 .left-half-circle {
		transform: rotate(-176.4deg);
	}

	.progress-circle.p-51 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-52 .left-half-circle {
		transform: rotate(-172.8deg);
	}

	.progress-circle.p-52 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-53 .left-half-circle {
		transform: rotate(-169.2deg);
	}

	.progress-circle.p-53 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-54 .left-half-circle {
		transform: rotate(-165.6deg);
	}

	.progress-circle.p-54 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-55 .left-half-circle {
		transform: rotate(-162deg);
	}

	.progress-circle.p-55 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-56 .left-half-circle {
		transform: rotate(-158.4deg);
	}

	.progress-circle.p-56 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-57 .left-half-circle {
		transform: rotate(-154.8deg);
	}

	.progress-circle.p-57 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-58 .left-half-circle {
		transform: rotate(-151.2deg);
	}

	.progress-circle.p-58 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-59 .left-half-circle {
		transform: rotate(-147.6deg);
	}

	.progress-circle.p-59 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-60 .left-half-circle {
		transform: rotate(-144deg);
	}

	.progress-circle.p-60 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-61 .left-half-circle {
		transform: rotate(-140.4deg);
	}

	.progress-circle.p-61 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-62 .left-half-circle {
		transform: rotate(-136.8deg);
	}

	.progress-circle.p-62 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-63 .left-half-circle {
		transform: rotate(-133.2deg);
	}

	.progress-circle.p-63 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-64 .left-half-circle {
		transform: rotate(-129.6deg);
	}

	.progress-circle.p-64 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-65 .left-half-circle {
		transform: rotate(-126deg);
	}

	.progress-circle.p-65 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-66 .left-half-circle {
		transform: rotate(-122.4deg);
	}

	.progress-circle.p-66 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-67 .left-half-circle {
		transform: rotate(-118.8deg);
	}

	.progress-circle.p-67 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-68 .left-half-circle {
		transform: rotate(-115.2deg);
	}

	.progress-circle.p-68 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-69 .left-half-circle {
		transform: rotate(-111.6deg);
	}

	.progress-circle.p-69 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-70 .left-half-circle {
		transform: rotate(-108deg);
	}

	.progress-circle.p-70 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-71 .left-half-circle {
		transform: rotate(-104.4deg);
	}

	.progress-circle.p-71 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-72 .left-half-circle {
		transform: rotate(-100.8deg);
	}

	.progress-circle.p-72 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-73 .left-half-circle {
		transform: rotate(-97.2deg);
	}

	.progress-circle.p-73 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-74 .left-half-circle {
		transform: rotate(-93.6deg);
	}

	.progress-circle.p-74 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-75 .left-half-circle {
		transform: rotate(-90deg);
	}

	.progress-circle.p-75 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-76 .left-half-circle {
		transform: rotate(-86.4deg);
	}

	.progress-circle.p-76 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-77 .left-half-circle {
		transform: rotate(-82.8deg);
	}

	.progress-circle.p-77 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-78 .left-half-circle {
		transform: rotate(-79.2deg);
	}

	.progress-circle.p-78 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-79 .left-half-circle {
		transform: rotate(-75.6deg);
	}

	.progress-circle.p-79 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-80 .left-half-circle {
		transform: rotate(-72deg);
	}

	.progress-circle.p-80 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-81 .left-half-circle {
		transform: rotate(-68.4deg);
	}

	.progress-circle.p-81 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-82 .left-half-circle {
		transform: rotate(-64.8deg);
	}

	.progress-circle.p-82 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-83 .left-half-circle {
		transform: rotate(-61.2deg);
	}

	.progress-circle.p-83 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-84 .left-half-circle {
		transform: rotate(-57.6deg);
	}

	.progress-circle.p-84 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-85 .left-half-circle {
		transform: rotate(-54deg);
	}

	.progress-circle.p-85 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-86 .left-half-circle {
		transform: rotate(-50.4deg);
	}

	.progress-circle.p-86 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-87 .left-half-circle {
		transform: rotate(-46.8deg);
	}

	.progress-circle.p-87 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-88 .left-half-circle {
		transform: rotate(-43.2deg);
	}

	.progress-circle.p-88 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-89 .left-half-circle {
		transform: rotate(-39.6deg);
	}

	.progress-circle.p-89 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-90 .left-half-circle {
		transform: rotate(-36deg);
	}

	.progress-circle.p-90 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-91 .left-half-circle {
		transform: rotate(-32.4deg);
	}

	.progress-circle.p-91 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-92 .left-half-circle {
		transform: rotate(-28.8deg);
	}

	.progress-circle.p-92 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-93 .left-half-circle {
		transform: rotate(-25.2deg);
	}

	.progress-circle.p-93 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-94 .left-half-circle {
		transform: rotate(-21.6deg);
	}

	.progress-circle.p-94 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-95 .left-half-circle {
		transform: rotate(-18deg);
	}

	.progress-circle.p-95 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-96 .left-half-circle {
		transform: rotate(-14.4deg);
	}

	.progress-circle.p-96 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-97 .left-half-circle {
		transform: rotate(-10.8deg);
	}

	.progress-circle.p-97 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-98 .left-half-circle {
		transform: rotate(-7.2deg);
	}

	.progress-circle.p-98 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-99 .left-half-circle {
		transform: rotate(-3.6deg);
	}

	.progress-circle.p-99 .right-half-circle {
		transform: rotate(180deg);
	}

	.progress-circle.p-100 .left-half-circle {
		transform: rotate(0deg);
	}

	.progress-circle.p-100 .right-half-circle {
		transform: rotate(180deg);
	}
