:root {
	/* enable OS/browser based color scheme selection */
	color-scheme: light dark blue;
	
	/* color and gradient definitions */
	--colorBack1: hsl(var(--colorBackH), calc(var(--colorBackS) - 20%), calc(var(--colorBackL) + var(--colorBackLoffset)));
	--colorBack2: hsl(var(--colorBackH), var(--colorBackS), var(--colorBackL));
	--colorPrimary: hsl(var(--colorPrimaryH), var(--colorPrimaryS), var(--colorPrimaryL));
	--colorSecondary: hsl(var(--colorSecondaryH), var(--colorSecondaryS), var(--colorSecondaryL));
	--colorText: hsl(var(--colorTextH), var(--colorTextS), var(--colorTextL));
	--colorLink: hsl(var(--colorTextH), var(--colorTextS), var(--colorTextL));
	--colorLinkActive: hsl(var(--colorTextH), var(--colorTextS), var(--colorTextL));
	--colorLinkVisited: hsl(var(--colorTextH), var(--colorTextS), var(--colorTextL));
	--colorLogo: hsl(var(--colorPrimaryH), var(--colorPrimaryS), calc(var(--colorPrimaryL) + 45%));
	--colorLogoDot: hsl(var(--colorPrimaryH), var(--colorPrimaryS), calc(var(--colorPrimaryL) + 25%));
	
	--gradientBack: linear-gradient(transparent 0, var(--colorBack2) 3cm),
					radial-gradient(closest-side, var(--colorBack2) calc(100% - 3cm), transparent);
	
	/* color and modifier values - BLUE */
	--colorBackH: 220;	/* original: 225 */
	--colorBackS: 75%;	/* original: 70%*/
	--colorBackL: 30%;
	--colorBackLoffset: 69.2%;
	
	--colorPrimaryH: 0;
	--colorPrimaryS: 0%;
	--colorPrimaryL: 5%;
	
	--colorSecondaryH: 220;	/* original: 225 */
	--colorSecondaryS: 40%;
	--colorSecondaryL: 97%;
	
	--colorTextH: 220;	/* original: 225 */
	--colorTextS: 20%;
	--colorTextL: 22%;
}

@media only print, (prefers-reduced-motion) {	/* comma: OR */
	:root {
	}
}

@media (prefers-color-scheme: light) {
	:root {
	}
}

@media (prefers-color-scheme: dark) {
	:root {
	}
}

@media (prefers-color-scheme: blue) {
	:root {
	}
}