HTML { font: normal 17px sans-serif; line-height:1.3; }
	HTML , BODY { height:100%; margin:0; padding:0; overflow: overlay; }
	A { color:mediumblue; text-decoration:none; }
	A:hover { text-decoration:underline; }
	A[disabled] { cursor:default; color:#DDD; }
	A[target="_blank"]::after { content:'\A0\A0\A0\A0\A0';
			background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABmJLR0QA/wD/AP+gvaeTAAAAvElEQVRIieWUSQ7CMAxFn1jACYg4C8P1GHqt7BAruuAELceATSqVEg8t7aZ8yYoU2/85iRT4Z0XgJURsihYTwfdjG66BO5+n+NIKKIAax9FbCkCZ8iUKoFCMJUDXPGiAZvJtLumYPKR9ESAmMmrf+QPYeHy8AGnyRpH8W7kA2uSmLMBP5hZg8LV4AVfF3Op1FUXgJpiPAhjcO9VnN1PAM627nh6HtNZW4Rn7N9XiaAGWwAWoehpXwCn1z1Bvs4t7JZUPqtIAAAAASUVORK5CYII=);
			background-size: contain;
    		background-repeat: no-repeat;
			background-position: center top;
		}
	H1 { display: block; margin: 24px auto; padding: 0; text-align: center; color: #41807c; font-size: 36px; }
	H2 { margin:12px 0; padding:0; font-size:18px; font-weight:bold; }

	HEADER { height:110px; margin:0; padding:0; overflow:hidden; }
	HEADER LABEL.main-menu { position:fixed;  width:42px; height:42px; margin:0; padding:12px; font-size:42px; line-height:42px; text-align:center; color:#000; background-color:rgba(255, 255, 255, 0.5); z-index:1; cursor:pointer; }
	HEADER LABEL.main-menu:hover { background-color:yellow; text-decoration:none; }
	HEADER LABEL.main-menu::after { content: '\2630'; }
	HEADER LABEL.main-menu:has(INPUT:checked)::after { content: '\2715'; }
	HEADER LABEL.main-menu INPUT { position:absolute; width:42px; height:42px; padding:0; margin:0; border:0; appearance:none; -webkit-appearance:none; }
	HEADER DIV.main-menu { position:fixed; width:0; height:100%; margin:0; padding:0; overflow:hidden; white-space:nowrap; z-index:1; background: linear-gradient( to right, #022 0 250px, #022A ); transition: width 1s; }
	HEADER DIV.main-menu:has(+ LABEL.main-menu INPUT:checked) { width:100%; }
	HEADER DIV.main-menu > DIV { padding:8px 8px 8px 56px; width:fit-content; text-align:left; }
	HEADER DIV.main-menu > DIV A { display:block; width:fit-content; padding:12px 16px; font-size:24px; color:#EEE; }
	HEADER DIV.main-menu > DIV > DIV { width:300px; }
	HEADER DIV.main-menu > DIV > DIV A { display:block; float:left; }
	HEADER DIV.main-logo { display:block; position:relative; width:fit-content; margin:0 auto; padding: 20px 0; text-align:center; }

	@media (max-width:480px)  {
		HEADER DIV.main-logo IMG { width: 90%; }
	}

	MAIN { min-height: calc( 100% - 220px ); margin:0; padding:0; }
	MAIN > DIV { margin:0 auto; padding:12px; }

	FOOTER { height:110px; margin:0; padding:0; overflow:hidden; background-color:#456; }
	FOOTER * { color:#FFF; }
	FOOTER > DIV { padding:12px; }

	A.skip-link { position:relative; float:left; display:block; width:fit-content; margin:0; padding:0; white-space:nowrap; line-height:0px; overflow:hidden; }
	A.skip-link:has(+#main-menu) { position:absolute; float:none; margin-top:16px; }
	A.skip-link:focus { overflow:visible; }

	.messages,
	.errors { display: block; min-width: 300px; max-width: 720px; margin: 0 auto; padding: 24px; }
	.messages { background-color: #CFC; }
	.errors {
			background:
				radial-gradient(  20% 100% at   0% 50%, transparent 50%, coral 100%, transparent ),
				radial-gradient(  20% 100% at 100% 50%, transparent 50%, coral 100%, transparent ),
				radial-gradient( 100% 500% at   0% 50%, transparent 20%, coral  20%, coral 80%, transparent 80% ),
				radial-gradient( 100% 500% at 100% 50%, transparent 20%, coral  20%, coral 80%, transparent 80% )
				;
			text-shadow: 1px 1px 2px #FFC;
		}