/*=============================================================================================
* Customer		Van Rossem Timeware
* Project		Monitor
* File			html.css
* Description	General CSS formatting styles that are used throughout the web-site and that are not related to the primeFaces components.
*				Theme related styles (that are invoked by the primefaces generated elements) are not provided here but in 
*				primefaces-modest/theme.css instead. Styles that override the Primefaces component structural css are provided in
*				components.css.
* Author		P.H. van Rossem, Van Rossem Timeware.
* Copyright		©2021 Van Rossem Timeware, 's-Hertogenbosch. All rights reserved.
* Version		0.1
=================================================================================================
* History:		0.1 - PvR (26-05-2021): New project.
===============================================================================================*/

/* @todo 1: check for unused style classes */

body {font-family: Arial, Helvetica, sans-serif; font-size: 9pt}
b {color: #247}
img {border: 0}
h2 {font-size: 12pt; font-weight: bold; color: #246; margin: 10px 0px}
h3 {font-size: 10pt; font-weight: bold; color: #246; margin: 10px 0px}
ul {list-style-image: url(/resources/images/bullet1.gif); margin-left: 1em; padding-left: 1em; padding-top: 3px}
ol {margin-left: 1em; padding-left: 1em; padding-top: 3px}
ul li ul, ol li ul {list-style-image: url(/resources/images/bullet2.gif)}
ul li ul li ul, ul li ol li ul, ol li ul li ul, ol li ol li ul {list-style-image: url(/resources/images/bullet3.gif)}
li {margin-left: 0em; margin-bottom: 0.3em}
p {margin: 6px 0px}
p a:link {font-weight: bold; text-decoration: none; color: #e85}
p a:visited {font-weight: bold; text-decoration: none; color: #e85}
p a:hover {font-weight: bold; text-decoration: underline; color: #e85}
p a:active {font-weight: bold; text-decoration: none; color: #e85}
a {outline: none}
label {font-style: italic}
table {empty-cells: show}
iframe {border: none}
input, textarea, select {font-family: inherit; font-size: inherit}

/* @todo 2: add iOS scrolling: .scroller {padding: 15px; height: 98.5%; overflow: auto; -webkit-overflow-scrolling: touch} */
/* @todo 2: use justify style on all relevant pages */
.open {font-size: 10pt}
.open p {margin: 12px 0px; line-height: 120%; text-align: justify}
.open h2 {font-size: 13pt}
.open h3 {font-size: 11pt}
.one-column {max-width: 600px; margin: auto}
.help-column {max-width: 800px; margin: auto}
.justify p {text-align: justify}
.txt-info {color: green}
.txt-warn {color: brown}
.txt-error {color: red}
.txt-fatal {color: #900}
.rounded {border-radius: 10px}
.zoomed {zoom: 0.5}
.short-tabs {tab-size: 4}
.tree-icon {padding: 3px 0px 3px 20px}
.tree-icon-disabled {padding: 3px 0px 3px 20px; color: #888}
.link a:link {font-weight: bold; text-decoration: none; color: #e85}
.link a:visited {font-weight: bold; text-decoration: none; color: #e85}
.link a:hover {font-weight: bold; text-decoration: underline; color: #e85}
.link a:active {font-weight: bold; text-decoration: none; color: #e85}
.nolink a:link {font-weight: inherit; text-decoration: none; color: inherit}
.nolink a:visited {font-weight: inherit; text-decoration: none; color: inherit}
.nolink a:hover {font-weight: inherit; text-decoration: underline; color: inherit}
.nolink a:active {font-weight: inherit; text-decoration: none; color: inherit}
.smaller {font-size: 8pt; margin: 0px 0px}
.banner {font-family: Verdana, Helvetica, Arial; font-size: 7pt; font-weight: bold;}
.sidebar-left {height: 100%; width: 100%; border-right: 2px ridge white; background-color: #eef; padding: 3px}
.main {font-size: 10pt; background: white url(/resources/images/bglogo.gif) no-repeat top center; padding: 12px}
.menu {margin-left: 3px; line-height: 1.2em; font-size: 12px}
.menu a:link {text-decoration: none; color: inherit}
.menu a:visited {text-decoration: none; color: inherit}
.menu a:hover {text-decoration: underline; color: inherit}
.menu a:active {text-decoration: none; color: inherit}

.right {float: right; margin-left: 12px}
.left {float: left; margin-right: 12px}
.topaligned {vertical-align: top}
.centeraligned {vertical-align: center}
.rightaligned {text-align: right}
.important {border: 2px solid black; padding: 5px; background-color: #fcc}
.scroller {overflow: auto; border: 1px solid gray; margin: 5px; padding: 5px; background-color: white}
.table-input {padding: 0; border: none; background-color: transparent}
.multi {border: 2px solid #060; }
.program {border: 2px solid #a50; }
.name {font-weight: bold; color: #44f}
.mark {font-weight: bold; color: #f44}
.home-text {text-align: left; font-size: 11pt; font-weight: bold}
.home-small {text-align: left; font-size: 8pt; font-weight: normal; color: black}
.home-text-zh {text-align: left; font-size: 12pt; font-weight: bold}
.home-small-zh {text-align: left; font-size: 9pt; font-weight: normal; color: black}
.tipped {position: relative; z-index: 24}
.tipped:hover {z-index: 25}
.tipped .tip {display: none}
.tipped:hover .tip {display: block; position: absolute; top: 1em; left: 1em; width: 30em; border: 4px ridge #888; padding: 4px; font-size: 9pt; text-align: left; background-color: #ffd; z-index: 26; color: #630}
.confirm {color: #24a}