@font-face {
	font-family: 'Raleway';
	src: url('./Raleway-VariableFont_wght.ttf') format('truetype');
}
body { font-size:14pt; font-family: 'Raleway',sans-serif; }
a { color:black; }
i { color:black; }
p { color:black; }
#logo { padding:20px;text-align:right; font-weight:bold;}
#menu { margin:0; padding:0; width:100%; height:37px; color:#1a486b; background-color:rgba(255,255,255,0.5); font-weight:normal; text-decoration:none; clear: right; border-bottom:2px solid #777777; }
#menu ul{ list-style:none; margin:0; padding:0; border:0; }
#menu ul li { display: block; position: relative; float: left; cursor:pointer; }
#menu li ul { z-index:1999; display: none; }
#menu ul li a { display: block; text-align: left; height:24px; text-decoration: none; color: #777777; font-size:15pt; font-weight: normal; padding: 6px 10px 7px 10px; white-space: nowrap; }
#menu .more::after { content: "..."; }
#menu li.current a { color:#fff; background-color:#777777; }
#menu li:hover li.current a { color:#fff; background-color:#777777; }
#menu li a:hover{ color:#fff; background-color:#777777; }
#menu li a:hover{ color:#fff; background-color:#777777; }
#menu ul li a:hover {	color: #fff; background-color: #777777; }
#menu li:hover ul { z-index:1999; display: block; position: absolute; border: 2px solid #777777; border-top:0; margin:0; padding:0; }
#menu li:hover li { float: none; }
#menu li:hover a { color: #777777; background-color: #fff; }
#menu li:hover li a:hover { color: #fff; background-color: #777777; }
h1 { font-size:1.5em; text-align:left; font-weight:normal; color:#555; }
h2 { font-size:1.2em; }
h3 { font-size:0.8em; text-align:left; margin-block-start: -1em; margin-block-end: 0; color:#555; font-weight:normal; }
#body li { font-size:0.9em; }
#body ol, #body ul { padding-left:20px; margin:5px; overflow: hidden; }
.small { font-size:0.8em; }
#onTop{ margin:0; position:fixed; height: 100%; z-index:999; padding:0px; width:100%; left:0px; top:0px; clear:none; cursor:progress; background-color:rgba(0,0,0,0.7); display:none;  background-position: center; background-repeat: no-repeat; background-size: contain; }
picture {cursor:pointer;}
@media screen {
	body {text-align:left;background-color:#fff;}
	#page { width:1000px; margin: auto; padding-bottom:30px; }
	img { width: 33%; }
	#logo { font-size:2em; }
	.button { width:25px; height:20px; margin:0; padding:0; border-width:2px; }
	span#edit { cursor:pointer; visibility:hidden; }
	span.button { position:fixed; bottom:5px; left:5px; }
}
@media screen and (max-width: 1010px) {
	#page { width: 100%; margin:0; }
	#menu { height:35px; font-weight: normal;  }
	#menu ul li a { font-size:14pt; font-weight: normal; height:22px;}
	#menu ul li.current a { font-size:14pt; }
	img { width: 33%; }
}
@media screen and (max-width: 600px) {
	.button {display:none;}
	body {margin:0;}
	#page { width: 100%; margin:0; }
	#logo img { width:100%;}
	#logo h1 { font-size:1em; }
	#logo h3 { font-size:0.6em; }
	#body { margin: 0; padding:5px; clear:both; clear:both; }
	#menu { height:33px; font-weight: normal;  }
	#menu ul li a { font-size:13pt; font-weight: normal; height:21px;}
	#menu ul li.current a { font-size:13pt; }
	#menu ul li { max-width:33%; }
	#menu li ul li { max-width:100%; }
	img { width: 49%; }
}
@media screen and (max-width: 400px) {
	#logo { font-size:1.5em; }
	#logo h1 { font-size:0.9em; }
	#logo h3 { font-size:0.6em; }
	#menu { height:28px; font-weight: normal;  }
	#menu ul li a { font-size:11pt; font-weight: normal; height:18px;}
	#menu ul li.current a { font-size:11pt; }
	#menu ul li { max-width:33%;  }
	#menu li ul li { max-width:100%; }
	img { width: 100%; }
}
@media print {
	.button {display:none;}
	body{text-align:left;background-color:#fff;margin:1.5cm;}
	#body { margin:0; padding:0; }
	#logo { margin:0; padding:0; text-align:right; }
	#menu { display:none; }
	img { width:33%;}
	#logo {font-size:2em;}
}