#container .circle {
	border-radius: 50%;
}

/*******************************************************************/
@property --counter {
	syntax: "<number>";
	inherits: false;
	initial-value: 0;
}

@keyframes counter {
	0% {
		--counter: 0;
	}
	100% {
		--counter: 1;
	}
}

#container .activePage .pie-23-27 {
	animation-name: counter;
	animation-duration: 500ms;
	animation-delay: 500ms;
	animation-iteration-count: 1;
	animation-timing-function: ease-in-out;
	animation-fill-mode: forwards;
}

#container .activePage .pie-23-27 {
	background-image: conic-gradient(#006a75 .5%, #00bcd1 .5% calc(var(--counter)*20%), #00a3b7 calc(var(--counter)*20%) calc(var(--counter)*30.5%), #006a75 calc(var(--counter)*30.5%));
}


/*******************************************************************/

@keyframes blinkfromhidden {
	0% {opacity:0}
	30% {opacity:0}
	35% {opacity:1}
	100% {opacity:1}
}


#container .activePage .blink-delay1000-3x {
	animation-name: blinkfromhidden;
	animation-duration: 500ms;
	animation-delay: 1500ms;
	animation-iteration-count: 3;
	animation-timing-function: ease-out;
	animation-fill-mode: forwards;
}


#container .activePage .blink_delay500-3x {
	animation-name: blinkfromhidden;
	animation-duration: 500ms;
	animation-delay: 500ms;
	animation-iteration-count: infinite;
	animation-timing-function: ease-out;
	animation-fill-mode: forwards;
}


/*******************************************************************/
#container .gradient_turkiz {
	background: linear-gradient(#00a3b7, #006a75);
}

#container .gradient_nav {
	background: linear-gradient(#b6b7b7, #d6d6d6 25%, #fff);
}

#container .gradient_nav_active {
	background: linear-gradient(#00a3b7, #4ab8c9 75%, #a0cdd8);
}

#container .gradient_nav_active p {
	color: white;
}

#container .shadow_box_gray {
	box-shadow: 0 0 6px #5555557d;
}

#container .transparentOnStart:not(.activePage .transparentOnStart) {
	opacity:0;
}

body.loaded #downloading {
	display: none;
}

#downloading {
	position: fixed;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1030;
	padding: 0.5rem;
	background: orange;
	color: black;
	text-align: center;
}