@font-face {
	font-family: "Rodondo";
	src: url(Rodondo.otf) format("OpenType");
}
.drop {
	border: 2px solid #a9a4b2;
	border-radius: 9px;
	text-align: center;
}
.droptbl {
	min-width: 20em;
	min-height: 8em;
}
.buttonrow {
	width: 482px;
	text-align: center;
}
.buttonrow form {
	display: inline-block;
}
/* formatting adapted from map viewer */
button.rw-ui {
	background-color: #020204;
	appearance: none;
	position: relative;
	border-radius: 9px;
	border: 2px solid #4a4552;
	padding: 6px;
	margin: 2px;
	color: #a9a4b2;
	transition: color 0.3s;
	font: 600 14px "Segoe UI Semibold", sans-serif;
	width: 6.3em;
}
button.rw-ui[disabled] {
	border-color: #282828;
	color: #606060;
}
button.rw-ui:not([disabled]):hover, button.rw-ui:not([disabled]):focus {
	animation: border-blinker 0.8s linear infinite;
	color: #ffffff;
}
button.rw-ui:not([disabled])::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	margin: -2px;
	border-radius: 9px;
	border: 2px solid #4a4552;
	transition: padding 0.3s, border-color 0.3s, margin 0.3s;
}
button.rw-ui:not([disabled]):hover::before {
	border-color: #ffffff;
	padding: 4px;
	margin: -6px;
}
button.rw-ui:not([disabled]):active::before {
	border-color: #ffffff;
	padding: unset;
	margin: -2px;
}
button.rw-ui:not([disabled]):hover::after {
	margin: -10px;
	padding: 8px;
	border-color: #ffffff;
}
@keyframes border-blinker {
	50% {
		border-color: #ffffff;
	}
}
a:link {
	color: #90a0ff;
}
a:visited {
	color: #ff90e8;
}
body {
	background-color: #020204;
	color: #ffffff;
	font-family: Verdana, Arial, sans-serif;
	font-size: 100%;
	line-height: 130%;
	text-size-adjust: none;
	-webkit-text-size-adjust: none;
}
body div {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
dialog {
	border: 2px solid #a9a4b2;
	background-color: inherit;
	color: inherit;
	font-family: inherit;
	border-radius: 9px;
	text-align: center;
	width: 15em;
	height: 9em;
	padding: 1em;
}
dialog::backdrop {
	opacity: 0.82;
	background-color: #282828;
}
dialog div {
	text-align: inherit;
	margin: 12% auto 11% auto;
}
div {
	margin-top: 0.5em;
}
h1 {
	font-family: "Rodondo";
	font-weight: normal;
	font-size: xxx-large;
	margin-bottom: 0.25em;
	padding-bottom: 8px;
	line-height: 90%;
	text-align: center;
}
h2 {
	font-size: x-large;
	margin-bottom: 0.25em;
	margin-left: 3em;
}
input[type=button] {
	background-color: #020204;
	border: 2px solid #a9a4b2;
	border-radius: 9px;
	color: #a9a4b2;
	font: 600 14px "Segoe UI Semibold", sans-serif;
	padding: 5px 8px;
}
input[type=file] {
	border: 1px solid #c0c0c0;
	padding: 6px;
}
input[type=text] {
	background-color: #020204;
	border: 2px solid #a9a4b2;
	border-radius: 9px;
	color: #ffffff;
	font: 600 14px "Segoe UI Semibold", sans-serif;
	padding: 2px 3px;
	margin-left: 2px;
}
label input {
	vertical-align: 1px;
}
p {
	padding-bottom: 0.5em;
	margin-left: 1em;
	margin-right: 2em;
	max-width: 50em;
}
p.pimg {
	margin-right: 3em;
	max-width: 42em;
	text-align: center;
}
p.pimg img {
	padding: 4px;
	border: 2px solid #4a4552;
}
span.code {
	font-family: Courier New, monospace;
	font-weight: bold;
	font-size: 100%;
	white-space: nowrap;
	background-color: #584800;
	color: #ffffff;
}
table {
	margin: 0 auto 0 auto;
}
body table {
	margin-left: 6px;
}
td div {
	text-align: left;
}
textarea {
	background-color: #404040;
	color: #ffffff;
	line-break: anywhere;
	padding: 0.2em 0.4em;
	height: 20em;
	width: 36em;
}
ul li {
	margin: 0 2em 4px 1.5em;
	max-width: 50em;
}
@media (min-width: 830px) {
	body div {
		text-align: left;
		margin-left: 6px;
		margin-right: initial;
	}
	dialog div {
		text-align: inherit;
		margin-left: auto;
		margin-right: auto;
	}
	h1 {
		margin-left: 0.7em;
		line-height: 90%;
		text-align: left;
	}
	body table {
		margin: 6px auto 0 calc(1em - 2px);
	}
	p.pimg {
		margin: 0.3em auto 0.3em 2.8em;
	}
}
