body { margin: auto; font-family: sans-serif; font-size: 10pt; color: #555; }
#command { background-color: #555; color: #eee; border-radius: 9pt; padding: 6pt; font-family: monospace; margin-top: 1em 0 0 0; border: none; }
h1 { margin-bottom: 1em; font-size: 166%; margin: 0; padding: 6pt; }
h1 a { text-decoration: none; color: inherit; }
label { font-weight: 600; }
textarea { height: auto; font-family: monospace; font-size: 10pt; margin-top: 15px; min-height: 45vh; width: 44vw; }
div.alert { margin: 1em; }
pre#results { width: 100%; margin-top: 0; min-height: 65vh; width: 44vw; }
footer { color: #555; text-align: center; margin: 1em; }
p.version { color: #555; }
.container { margin: 12pt; }
.row { display: flex; flex-wrap: nowrap; justify-content: space-between; margin: 0; padding: 0; }
.controls {  display: flex; flex-wrap: wrap; justify-content: space-between; column-gap: 6pt; }
#frompane { flex: 1; padding: 3pt; }
#topane { flex: 1; padding: 3pt; }
#text {margin-top: 0; padding-top: 0;}
button#convert { vertical-align: bottom; background-color: red; font-weight: bold; color: white; border: none; border-radius: 4px; }
.disabled { color: #aaa; }
#examples { margin-left: 0; }
div.file div.title { margin: 0; padding: 0; }
span.filename { }
#convert { margin-left: 0; }
div.file textarea { margin-top: 0; }
#customtemplate { display: none; }
div.links { margin-top: 3pt; margin-bottom: 3pt; }
div.links a { padding: 4pt; }
#errors .error { width: 100%; color: white; background-color: red; font-weight: 600; padding: 2pt; }
#messages .message { margin-bottom: 6pt; }
#messages .message.INFO { background-color: green; color: white; font-weight: 600; padding: 2pt; }
#messages .message.WARNING { background-color: red; color: white; font-weight: 600; padding: 2pt; }