* {box-sizing:border-box}
html,body {height:100%; margin:0; font-family:verdana; background-color:lightsteelblue}
body.config {padding:70px 10px 0; margin:auto; max-width:1350px; overflow:hidden}

#header {position:absolute; top:0; width:100%; max-width:1350px; padding-right:10px}

#menu {margin-top:10px; width:100%; height:40px}
#menu a {display:inline-block; text-decoration:none; padding:2px 5px; cursor:default}
#menu a.selected {font-weight:bold; border:1px solid}
#menu a:hover {background-color:#F7F0E7}
#menu #RNselect {margin-bottom:6px; margin-right:6px}
#menu select#RN {max-width:300px}

#id {float:right; margin:10px 10px 0 0}
#id img {border:1px solid darkslateblue; height:20px; margin-left:5px; margin-right:5px}

iframe.module {background-color:lightsteelblue; border:0; width:100%; height:100%}

#content {position:relative; left:0; top:0; right:0; bottom:0; height:auto}
.work {min-height:500px}
.slim {padding-right:20em}
#display-overlay {position:absolute; top:0; right:0; width:345px; height:500px; visibility:hidden}
#display {width:100%; height:100%}

table,select,iframe {background-color:#F7F0E7; border:1px solid darkslateblue}
table {width:100%}
th {text-align:left; font-size:small; font-style:italic; background-color:#E0E0E0; border-bottom:1px solid darkslateblue}
tr:nth-child(even) {background-color:#E0E0E0}
td {border:none}
td.label {text-indent:1em; padding-right:10px; vertical-align:top; line-height:1.8; white-space:nowrap}
td.invalid {color:red}
.OK {background-color:lightgreen}
.BAD {background-color:red}
.WARN {background-color:gold}
.TEST {background-color:deepskyblue}

input {font-size:120%; right:0}
textarea {font-family:arial; font-size:120%}
textarea.screen {font-family:consolas,courier; font-size:100%; white-space:pre; color:silver; background-color:#1E1E1C} /* TODO: remove after rebuild viewer.html Lines=>listen */
.invalid {border-color:red}
select,button,code {font-size:120%}
.control button {min-width:100px}
em {font-weight:bold}
div.help {font-size:75%; padding-top:3px}
div.progress {background-color:blue; color:#F7F0E7; height:100%; width:0%; float:left}
div.clearfix{float:none; clear:both}
code {font-size:140%; font-weight:bold}
label {display:inline-block}

@media (max-width:1024px) {
    body.config {padding-top:95px}
    #id {float:none; margin-top:6px}
    #id table {width:auto}
    #menu {margin-top:8px}
}