pos/is4c-nf/css/pos.css
html { overflow: hidden; }
body { font-family: arial; margin-top: 20px; }
.mainBGimage {
background-image: url('../graphics/is4c.gif');
background-repeat: no-repeat;
}
.placeholderBGimage {
background-image: url('../graphics/your_logo_here.gif');
background-repeat: no-repeat;
}
div#boundingBox { width: 675px; }
/*********************************************
* COLORS
*********************************************/
.coloredArea { background: #004080; color: #ffffff; }
.colored { background: #004080; color: #ffffff; } /* compat */
.coloredBorder { border: solid 1px #004080 !important; }
.errorColoredArea { background: #800000; color: #ffffff; }
.errorColored { background: #800000; color: #ffffff; } /* compat */
.lightestColorText { color: #808080; }
.coloredText { color: #004080; }
.errorColoredText { color: #800000; }
.lightColorText { color: #408080; }
.lightColorArea { color: #ffffff; background: #408080; }
.totalLine { color: #000000; }
.totalArea { background: #000000; color: #ffffff; }
.fsLine { color: #800080; }
.fsArea { background: #800080; color: #ffffff; }
.rounded { border-radius: 4px 4px 4px 4px; }
/*********************************************
* main display
*********************************************/
div.baseHeight { height: 325px; width: 100%; text-align: center; }
div.training { background-color: #aa0000; }
div.centerOffset { padding-top: 80px; }
div.centeredDisplay { margin-left: auto; margin-right: auto; width: 60%;
padding: 30px 0 10px 0; text-align: center;
top: 70px; position: relative; }
span.larger { font-weight: bold; }
span.smaller { font-size: 80%; }
div.clear { clear: both; width: 100%; }
div#headerb { width: 100%; }
div#headerb .left { float: left; text-align: left; width: 48%; }
div#headerb .right { float: left; text-align: right; width: 48%; }
div#headerb .clear { clear: left; width: 100%; border-top: solid 1px #000000;
margin-bottom: 5px;}
div#headerb .bigger { font-size: 90%; font-weight: bold; }
div#headerb .smaller { font-size: 75%; }
div#plainmsg { text-align: center; font-weight: bold;
margin-left: auto; margin-right: auto;
font-size: 120%; line-height: 1.7em; }
div#footer { width: 100%; }
div#footer table { width: 100%;}
div#footer tr.heading td {border-bottom: solid 1px #000000; font-size: 80%;
font-weight: bold; height: 30px; vertical-align: bottom;}
div#footer tr.heading .first { text-align: center; }
div#footer tr.heading .reg { width: 21%; text-align: center; }
div#footer tr.heading .total { text-align: right; width: 18%; }
div#footer tr.values td { height: 50px; vertical-align: middle; text-align: center;}
div#footer tr.values .first { font-weight: bold; font-size: 150%; }
div#footer tr.values .reg { font-weight: bold; font-size: 110%; }
div#footer tr.values .total { font-weight: bold; font-size: 150%; }
div.item { width: 100%; font-size: 120%; text-align: left; }
div.item div { float: left; }
div.item .desc { width: 58%; }
div.item .comments { width: 20%; text-align: right; }
div.item .total { width: 14%; text-align: right; padding-right: 5px; }
div.item .suffix { width: 4%; text-align: right; }
div#boxMsg {
border: solid 1px black;
padding: 0;
background: #ffffff;
min-height: 150px;
border-radius: 4px 4px 4px 4px;
}
div#boxMsg .boxMsgAlert { font-weight: bold; font-size: 120%;
border-bottom: solid 1px #000000;
text-align: left; padding: 3px; }
div#boxMsg .boxMsgBody { padding: 10px 0 0px 0; text-align: left;}
div#boxMsg .boxMsgBody .msgicon { width: 16%; float: left;}
div#boxMsg .boxMsgBody .msgtext { text-align: left; padding-left: 15px;
float: left; width: 75%; }
div#boxMsg .boxMsgButtons { margin-left: 5px; margin-right: 5px; }
div .listbox {float: left; padding: 10px 10px 0 0; }
div .listboxText {float: left; font-weight: bold; }
div .farewellMsg {text-align: center; font-weight: bold;
font-size: 120%; line-height: 1.4em;}
button.pos-button, input.pos-button {
-moz-user-select: none;
background-image: none;
border: 1px solid transparent;
border-radius: 4px 4px 4px 4px;
cursor: pointer;
display: inline-block;
font-size: 14px;
font-weight: 400;
line-height: 1.42857;
margin-bottom: 0;
padding: 3px 3px;
text-align: center;
vertical-align: middle;
margin-right: 5px;
}
button.wide-button {
width: 125px;
}
/*********************************************
* Initial login page
*********************************************/
div#loginTopBar { width: 100%; margin:0; }
div#loginTopBar .name { width: 16%; font-weight: bold; background: #ffcc00; height: 30px;
font-size: 90%; text-align:center; float: left; padding-top: 10px;
border-bottom: solid 1px #000000; vertical-align: middle;}
div#loginTopBar .version { width: 80%; float: left; border-bottom: solid 1px #000000;
height: 20px; text-align: right; font-size: 70%; padding-top: 20px;}
div#loginTopBar .welcome { clear: left; text-align: center;
width: 16%; font-size: 90%; font-weight: bold; padding-bottom: 2px;}
div#loginCenter { width: 100%; padding-top: 80px; text-align: center; }
div#loginCenter .box { width: 40%; padding: 30px 0px 10px 0px;
font-size: 105%; margin-left: auto; margin-right: auto;}
div#loginExit { width: 90%; text-align:right; padding-top: 90px; font-size: 70%;}
/*********************************************
* Input frame
*********************************************/
div#inputArea { width: 100%; }
div#inputAreaEnd { clear: left; height: 1px;}
div#inputArea .inputform { float: left; width: 25%;}
div#inputArea .notices {float: left; width: 70%; text-align: right; font-size: 80%;}
div#inputArea .notices .time {font-size: 115%; font-weight: bold; padding-left: 10px; color: #000000;}
/*********************************************
* Scale display
*********************************************/
div#scalebox { position: absolute; left: 676px; top: 22px; }
div#scaleClear { clear: right; height: 1px; }
div#scaleTop { width: 118px; font-size: 80%; font-weight: bold; height: 18px;
text-align: center; border-radius: 4px 4px 0 0; }
div#scaleBottom { width: 118px; color: #000000; background: #eeeeee; font-weight: bold;
font-size: 120%; height: 44px; text-align: center; padding-top: 5px;
border-radius: 0 0 4px 4px; }
/*********************************************
* Quick Keys
*********************************************/
div.qkRow { width: 100%; clear: left; text-align: center; }
div.qkBox { width: 23%; float: left; padding: 2px; text-align: center; }
div.qkBox div { width: 100px; padding: 2px 0 2px 0; margin-left:auto; margin-right:auto;}
.quick_button { width: 115px; height: 85px; }
.quick_button_max { width: 155px; height: 105px; }
div.qkArrowBox { width: 20px; float: left; padding-left: 35px;}
div.arrow-Up { padding-top: 45px; }
div.arrow-Down { padding-top: 35px; }
div.arrow-clear { padding-top: 15px; }
button.qkArrow { width: 50px; height: 30px; border: outset 3px #004080;
color: #004080; background-color: #ffffff; }
input.quickButtonImage {
font-size: 0;
background-repeat: no-repeat;
background-position: center;
}
/*********************************************
* NumPad Notifier
*********************************************/
button.numpad-btn {
text-align: center;
width: 45px;
height: 35px;
margin: 8px 0px 0px 8px;
border: solid 1px #000;
}
button.numpad-wide {
text-align: center;
height: 35px;
width: 160px;
margin: 8px 0px 0px 8px;
border: solid 1px #000;
}
/*********************************************
* Number Box
*********************************************/
table#numpad {
position: absolute;
left: 25px;
top: 50px;
font-size: 25pt;
}
table#numpad td {
border: outset 2px #004080;
background-color: #ffffff;
color: #004080;
width: 45px;
text-align: center;
}
/*********************************************
* Keyboard Box
*********************************************/
table#letterpad {
position: absolute;
left: 55px;
top: 210px;
font-size: 25pt;
}
table#letterpad td {
border: solid 1px #004080;
background-color: #ffffff;
color: #004080;
width: 45px;
text-align: center;
}