* { margin: 0 ; padding: 0 }
html { height: 100% ; }
body { height: 100% ; overflow: hidden ; }

h2 { margin-top: 1em ; clear: both ; color: #666 ; }
h3 { margin-top: 0.5em ; clear: both ; color: #666 ; }
h4 { margin-top: 0.5em ; clear: both ; color: #666 ; }
p { margin-top: 0.5em ; }

li { margin: 0.2em 0 0 1em ; }
.code { white-space: pre ; font-family: monospace ; margin: 0 1em 1em 2em ; }

/* -------------------------------------------------------------------- */

#app-name { position: fixed ; top: 2px ; left: 10px ; font-size: 1.8em ; color: #444 ; }
#app-version { font-size: 50% ; }

#helptabs { width: 100% ; height: calc(100% - 50px) ; background: none ; border: none ; }
#helptabs-content { height: 100% ; margin-top: 10px ; overflow: auto ; }

#helptabs .ui-tabs-nav { font-size: 75% ; text-align: right ; padding-right: 15px ; }
#helptabs .ui-tabs-nav { background: none ; border-width: 0 0 1px 0 ; }
#helptabs .ui-tabs-nav li { float: none ; display: inline-block ; margin-bottom: -4px ; }
#helptabs .ui-tabs-nav a { color: #888 ; }

#helptabs .ui-tabs-active { background: #ddd ; border-color: #ccc ; }
#helptabs .ui-tabs-active a { color: #444 ; }

#helptabs .ui-tabs-panel { padding: 0.5em 1em 0.5em 1em ; }

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#helptabs-license .content { white-space: pre ; font-family: monospace ; }

/* -------------------------------------------------------------------- */

table.settings { margin: 0.5em 0 1em 1em ; }
table.settings td { padding: 0 0.5em ; }
table.settings td.key { font-weight: bold ; }
table.settings td.val { font-family: monospace ; }

/* -------------------------------------------------------------------- */

div.info {
    display: inline-block ; min-height: 18px ;
    border: 1px dotted #444 ; border-radius: 5px ;
    padding: 0.5em 0.5em 0.5em 35px ;
    background: url(images/info.png) 6px 6px no-repeat ;
    background-size: 20px 20px ;
    font-size: 80% ; font-style: italic ;
}
div.hint {
    display: inline-block ; min-height: 22px ;
    border: 1px dotted #444 ; border-radius: 5px ;
    padding: 0.5em 0.5em 0.5em 30px ;
    background: url(images/hint.png) 4px 4px no-repeat ;
    background-size: 20px 20px ;
    font-size: 80% ; font-style: italic ;
}
div.warning {
    display: inline-block ; min-height: 18px ;
    border: 1px dotted #444 ; border-radius: 5px ;
    padding: 0.5em 0.5em 0.5em 35px ;
    background: url(images/warning.png) 6px 6px no-repeat ;
    background-size: 20px 20px ;
    font-size: 80% ; font-style: italic ;
}

ul { list-style-image: url("images/bullet.png") ; }
ul ul { list-style-image: url("images/bullet2.png") ; }
ul ul ul { list-style-image: url("images/bullet3.png") ; }
li .note { font-size: 80% ; font-style: italic ; }