/*
	WCAG 2.1 AA					normal text			large text > 24px, > 18,67px + bold

	blue on white				ok					ok
	orange on white				x					ok
	white on blue				ok					ok
	white on orange				x					ok
	black on blue				x					ok
	orange on blue				x					x
	black on orange				ok					ok
	blue on orange				x					x

*/

:root {
	color-scheme: light dark;
	--dark-mode: no;

	/*
		color(s)
	*/
	--background-color: #fff;
--nav-background-color: #fff;
	--font-color: #000;
	--btn-font-color: #000;
	--link-color: #fefefe;
--sms-bg-color: #000;

	--btn-outline-color: black;
	--navitem-outline-color: black;

	--kmdw-blue: #006a8d;
	--kmdw-orange: #ec6036; /* rgb(236,96,54)
/* rgb(244, 67, 54); */

	--light-mode-notice-bg: rgba(255,5,5,.86);
	--dark-mode-notice-bg: rgba(255,5,25,.90);

	/*
		geometrix
	*/
	--banner-max-height: none;
	--sms_nav-max-height: 60px;

	--main-nav-width: 300px;
	--main-nav-padding: 16px;
	--main-margin-h: 40px;
}
@media (prefers-color-scheme: dark) {
	:root {
		--dark-mode: yes;
		--background-color: #000;
		--font-color: #fff;
		--link-color: var(--kmdw-orange);
	}
}
html.light {
	--dark-mode: no;
	--background-color: #fff;
	--font-color: #000;
	--link-color: #fefefe;
}
html.dark {
	--dark-mode: yes;
	--background-color: #000;
	--font-color: #fff;
	--link-color: #fefefe;
}
@media (max-width: 600px) {
	:root {
		--main-nav-width: 100%;
	}
}

body {
	hyphens: auto;
	hyphenate-limit-chars: auto auto 3;
	font-family: 'roboto_slabregular';

	/* WCAG 2.1 Requirement */
	font-size: 16px;
	line-height: 1.5;
	letter-spacing: .12em;
	word-spacing: .16em;

	background: none;
	background-color: var(--background-color);
	color: var(--font-color);
}

body * {
	box-sizing: border-box;
}

.fr_center {
	text-align: center !important;
}
.displ_std_inline {
	display: inline !important;
}
.displ_std_block {
	display: block !important;
}

a[disabled], a:link[disabled] {
	opacity: .33;
}
[aria-current="page"],
a[disabled], a:link[disabled] {
	pointer-events: none;
	cursor: default;
	text-decoration: none;
	color: currentcolor;
	color: var(--current-color);
	color: var(--sms-bg-color);
}

#tocnt {
	display: block;
	position: absolute;
	top: 1rem;
	left: -100%;
	width: 0;
}
#tocnt:focus, #tocnt:focus-visible {
	left: 1rem;
	width: auto;

background-color: var(--nav-background-color);
border-color: var(--navitem-outline-color);
color: var(--btn-font-color);
}

#banner {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;

	margin-right: var(--main-margin-h);
	margin-right: 0;
	margin-left: calc(var(--main-nav-width) + var(--main-margin-h));
	margin-left: var(--main-nav-width);
	height: 385px;
	max-height: var(--banner-max-height);
}
#banner > img {
	flex: 1;
	height: auto;
max-width: 100%;
}
@media ((orientation: portrait) and (max-aspect-ratio: 1/1.1)) or 
	(max-height: 500px) {
	#banner > img {
		width: auto;
		height: 100%;
	}
}
@media (orientation: portrait) and (min-height: 500px) {
	#banner {
		height: auto;
	}
	#banner > img {
		max-height: 50vh;
	}
}
#banner > div:first-of-type {
	position: absolute;
	padding: 12px 24px !important;
	border: 1px solid rgb(204, 204, 204) !important;
	color: rgb(241, 241, 241);
	text-align: center;
}
#banner > div:last-of-type {
	position: absolute;
	bottom: auto;
	top: calc(100% - 120px);
}
@media ((max-width:600px) and (min-height:501px)) or
	(min-aspect-ratio: 1.5/1) {
	#banner > div:last-of-type {
		top: calc(100% - 3em);
	}
}
#banner > div:last-of-type.hide {
	visibility: hidden;
}

/*

*/
#sms_nav {
	position: sticky;
	top: 0px;
	display: flex;
	align-items: center;
	max-height: var(--sms_nav-max-height);

	width: 100%;
	z-index: 1;

color: rgb(255, 255, 255) !important;
background-color: var(--sms-bg-color) !important;

	font-size: 25px !important;
	padding: 8px 16px !important;
}

/*
 main navigation
*/
nav ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	--item_margin: .33rem;
}
nav ul li {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
nav ul li ul {
	padding: var(--item_margin) 0;
}
nav ul li ul li {
	padding: var(--item_margin);
}

#logo_nav {
	background-size: auto 100%;
	background-position: center;
	background-repeat: no-repeat;
	margin: 3rem auto;
	display: flex;
	align-items: center;
	justify-content: center;
-	background-image: url(../img/logo-l-1024.png);
}
@media (prefers-color-scheme: dark) {
	#logo_nav {
-		background-image: url(../img/logo-d-1024.png);
	}
}

#logo_nav img {
	mix-blend-mode: multiply;
}
html:not(.light) 
#logo_nav img {
	mix-blend-mode: normal;
}

#main_nav {
	position: fixed !important;
	width: 300px;
	width: var(--main-nav-width);
	height: 100%;
	overflow: hidden;
	overflow-y: auto;
	top: 0;
	left: 0;

	display: flex;
	flex-direction: column;

	font-size: 18px;
	padding: 8px 16px !important;
	padding: 8px var(--main-nav-padding) !important;
	font-weight: bold;
	z-index: 5;

background-color: var(--nav-background-color);
}
@media (max-width:992px){
	#main_nav {
		--small_screen: yes;
		display: none;
	}
}
#main_nav:target, #main_nav.open {
	display: flex;
}
#main_nav > ul#main_menu {
	order: 3;
}

#main_nav {

}
#main_nav::after {
	content: '';
	background-image: url(../img/pinselstrich.png);
	background-repeat: no-repeat;
	background-size: auto 100%;
	background-position: 100% 0;
	background-attachment: scroll;
	position: absolute;
	height: 100%;
	width: 3rem;
	right: -13px;
	z-index: 5;
	top: -15px;

height: 90vh;
width: 20%;
right: -13px;
z-index: 5;
top: 123px;
}

#main_menu {
	--btn-arrow-up: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0NDggNTEyIj48IS0tISBGb250IEF3ZXNvbWUgUHJvIDYuNC4yIGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlIChDb21tZXJjaWFsIExpY2Vuc2UpIENvcHlyaWdodCAyMDIzIEZvbnRpY29ucywgSW5jLiAtLT48cGF0aCBkPSJNNDMyIDI1NmMwIDE3LjctMTQuMyAzMi0zMiAzMkw0OCAyODhjLTE3LjcgMC0zMi0xNC4zLTMyLTMyczE0LjMtMzIgMzItMzJsMzUyIDBjMTcuNyAwIDMyIDE0LjMgMzIgMzJ6Ii8+PC9zdmc+");
	--btn-arrow-down: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0NDggNTEyIj48IS0tISBGb250IEF3ZXNvbWUgUHJvIDYuNC4yIGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlIChDb21tZXJjaWFsIExpY2Vuc2UpIENvcHlyaWdodCAyMDIzIEZvbnRpY29ucywgSW5jLiAtLT48cGF0aCBkPSJNMjU2IDgwYzAtMTcuNy0xNC4zLTMyLTMyLTMycy0zMiAxNC4zLTMyIDMyVjIyNEg0OGMtMTcuNyAwLTMyIDE0LjMtMzIgMzJzMTQuMyAzMiAzMiAzMkgxOTJWNDMyYzAgMTcuNyAxNC4zIDMyIDMyIDMyczMyLTE0LjMgMzItMzJWMjg4SDQwMGMxNy43IDAgMzItMTQuMyAzMi0zMnMtMTQuMy0zMi0zMi0zMkgyNTZWODB6Ii8+PC9zdmc+");
}
#main_menu li > button {
	background: var(--btn-bg-color);
	position: relative;
	margin: .25em auto;
	padding: 0.5rem 3rem 0.5rem 1rem;
	font-size: 100%;
	color: var(--btn-font-color);
}

body:not(.nojs) #main_menu li > button {
	display: flex;
	align-items: center;
	padding: 14px 14px;
}

@media (min-width: 601px) {
	#main_menu li > button {
		font-size: calc((var(--main-nav-width) - (2 * var(--main-nav-padding))) / 22);
	}
}
#main_menu li > button:focus {
	outline: white solid 2px;
	outline-offset: -4px;
	z-index: 1;
	outline-color: var(--btn-outline-color);
	color: var(--sms-bg-color);
}
#main_menu li > button.nojs {
	appearance: none !important;
	background: none transparent;
	border: none;
	width: 100%;
	border-color: currentcolor;
	border-style: none none dotted;
	border-width: medium medium 1px;
	border-image: none 100% / 1 / 0 stretch;
	font-size: 73%;
	text-decoration: none;
	margin-top: 1rem;
	padding: 0;
}
#main_menu li > button.jsed:after {
	display: block;
	position: absolute;
	height: 1em;
	width: 1em;
	top: 50%;
	right: 1em;
	transform: translateY(-50%);
	mask-size: contain;
	mask-position: center center;
	mask-repeat: no-repeat;
	mask-image: var(--btn-arrow-down);
	background-color: currentcolor;
-	content: '';
}

#main_menu li > button > span {
	line-height: 1;
user-select: none;
}

#main_menu li > button > span[aria-hidden] {
	padding: 0 0 0 1em;
}
#main_menu li > button[disabled] > span:last-child {
	display: none;
}
#main_menu li > button:not([disabled]) > span[hidden] {
	display: inline;
padding-bottom: 2px;
/*
	if 'block' - js fails!
*/
}
#main_menu li > button[aria-expanded=true].jsed:after {
	mask-image: var(--btn-arrow-up);
}

#main_menu .sub-nav.closed {
	display: none;
}
#main_menu .sub-nav.opened {
	display: block;
}
#main_menu .sub-nav li {
}
#main_menu .sub-nav li > a:focus-visible {
	outline: 2px solid;
	outline-offset: 5px;
	outline-color: var(--navitem-outline-color);
}

#main,
main {
	margin-left: 340px;
	margin-right: 40px;
	margin-left: calc(var(--main-nav-width) + var(--main-margin-h));
	margin-right: var(--main-margin-h);

	padding: 0.005em 1rem;

	transition: margin-left .4s;
}
#main > section,
main > section,
#main > div,
main > div {
	margin: 1rem 0;
}

footer {
	padding-top: 32px;
	padding-bottom: 0;
	margin-top: 75px;
	margin-left: var(--main-nav-width);
	overflow: hidden;
}
footer > div:nth-of-type(3) {
	margin: 1rem auto;
}
footer > div:last-child {
	padding-bottom: 1rem;
}
footer > div:last-child > img {
}

footer > div:last-child > span {
	display: block;
	padding: 0 7em;
	text-align: center;
}

@media (max-width: 992px) {
	#banner,
	#main,
	main,
	footer {
		margin-left: 0px !important;
		margin-right: 0px !important;
	}
}

footer #botm_nav {
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}
footer #botm_nav > li {
	font-size: 16px;
	padding: 1em;
}

#m_n_close {
	position: absolute;
	right: 0;
	top: 0;
	font-size: 2.33rem;
	user-select: none;
z-index: 6;
}
@media (min-width:993px){
	#m_n_close {
		display: none !important
	}
}
#m_n_open {
	background-color: var(--sms-bg-color) !important;
}
#mm_pg_ovrl {
	cursor: pointer;
	display: none;
}
#mm_pg_ovrl.show {
	display: block;
}


/*

*/
#page_hndl {
	position: absolute;
	left: auto;
	right: 0;
	top: 0;
	background: none transparent;
	z-index: 4;
}
#page_hndl > ul {
	display: flex;
	align-items: center;
	list-style-type: none;
	padding: 0;
	margin: 0;
	min-width: 10vmax;
}
#page_hndl ul > li {
	flex: 1;
	padding: 0;
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 5vmax;
	width: 5vmax;
}
#page_hndl ul > li > button,
#page_hndl ul > li > i {
	margin: 0;
	padding: 8px;
	border: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: auto;
	background: none;
}
#page_hndl ul > li > button {
	cursor: pointer;
}
#page_hndl ul > li svg {
	width: 73%;
	height: auto;
}
#page_hndl svg {
	fill: var(--current-color);
	opacity: .33;
}
#page_hndl svg:hover {
	opacity: 1;
}
#page_hndl #adj_fontsize {
	width: 73%;
	padding: .5rem;
	pointer-events: none;
}
@media only print {
	header > div, #page_hndl, #sms_nav {
		display: none;
	}
	#tease .box {
		border: 1px solid;
	}
}
/*

*/
#gfx {
	display: none;
}
[hidden=until-found] {
	display: block;
}
[hidden=hidden].tillJS {
	display: block;
}

