/* === GENERAL === */

body {
    background-color: white;
    color: #000000;
    margin: 0;
    padding: 0;
    text-align: center;
    font-style: normal;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 8pt;
    font-variant: normal;
    font-weight: normal;
}

/*
a {
    text-decoration: none;
    color: rgb(0, 111, 92);
    border: 0px;
    font-size: 8pt;
}

a:hover {
    color: #00CC66;
}

th {
	font-size: 8pt;
	font-style: bold;
}

input {
    font-style: normal;
	font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 8pt;
    font-variant: normal;
    font-weight: normal;
}

textarea {
    font-style: normal;
	font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 8pt;
    font-variant: normal;
    font-weight: normal;
}

thead.dataHead {
    background-color: rgb(0, 111, 92);
    color: rgb(227, 245, 249);
}

td {
	font-size: 8pt;
}
*/
img {
    border: 0px;
}

/*
.label {
    font-weight: bold;
    float: left;
    text-align: center;
}
*/

#minHeight {
    position: relative;
    float: left;
    height: 500px;
    width: 1px;
    border:solid red 1px;
}

/* === CONTAINER === */

#container {
    /* dimensions */
    /*width: 960px;*/
    /* display */
    background-color: #FFFFFF;
    text-align: left;
    /* surrounds */
    margin: 10px 0px 0px 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
    border: 0px;
    border-style: solid;
    border-color: #00FF00;
}

/* === HEADER === */

#header {
    /* dimensions */
    height: 87px;
    /* positioning */
    /* text and colours */
    font: 12pt bold;
    background-color: rgb(0, 111, 92);
    color: rgb(227, 245, 249);
    text-align: center;
    vertical-align: middle;
    /* surrounds */
	border-style:solid;
	border-color:black;
	border-width:1px 0px; /* top and bottom borders: 1px; left and right borders: 0px */
	margin:9px 0px 9px 0px;
	padding:0px;
}

/* === SIDEBAR === */

#sidebar {
    /* dimensions */
    width: 290px;
    height:730px;
    /* positioning */
	position:absolute;
	top:99px; /* header height + margins */
	left:0px;
    /* display */
	background-color:#eee;
    font-style: normal;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 8pt;
    font-variant: normal;
    font-weight: normal;
    /* surrounds */
	border:1px solid #999;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left:10px;
    padding-top:10px;
    padding-bottom:10px;
    padding-left:10px;
    padding-right:10px;
    text-align: left;
}

/* === CONTENT === */

#content {
	margin:0px 50px 50px 300px;
	padding:10px;
    text-align:left;
    height:690px; /* minimum height */
}

/* === FOOTER === */

#footer {
    /* dimensions */
    /*width: 960px;*/
    height: 20px;
    /* positioning */
    /* display */
    background-color: rgb(0, 111, 92);
    color: rgb(227, 245, 249);
    text-align: center;
    /* surrounds */
    border: 0px solid aqua;
    margin-top: 0px;
    margin-bottom: 0px;
}

input.listButton {
    width:24px;
    height:24px;
    /*border:0px;*/
    padding:0px;
    margin:0px;
    font:8pt italic;
}

input.wideListButton {
    width:53px;
    height:24px;
    font:8pt italic;
}

.title {
    font-style:italic;
    font-weight:bold;
    font-size: 14pt;
    line-height: 120%;
    color: black;
}

.step {
    clear:both;
    border:0px solid red;
    margin-top:20px;
}

.stepLeft {
    float:left;
    border:0px solid green;
    margin-top:20px;
    width:300px;
}

.stepRight {
    float:left;
    border:0px solid blue;
    margin-top:20px;
    width:100px;
}
.stepRightMost {
    float:left;
    border:0px solid blue;
    margin-top:20px;
    width:260px;
}
.stepFarRightMost {
    border:0px solid blue;
    margin-top:20px;
    width:190px;
}
.stepTitle {
    margin-top: 20px;
    font-style:italic;
    font-weight:bold;
    line-height: 120%;
    color: rgb(0, 111, 92);
}

.stepDetail {
    margin-left:30px;
    font-size:10pt;
    border:0px solid red;
}

.stepDetailVolume {
    margin-left:30px;
    font-size:10pt;
}
.stepDetailMinVolume {
    margin-left:1px;
    font-size:10pt;
}
.stepDetailtime {
    margin-left:90px;
    font-size:10pt;
}
div.sidebarKeypad {
    margin-top:0px;
    margin-left:40px;
    border:0px solid red;
    width:200px;
    text-align:center;
}

div.sidebarSearch {
    margin-top:5px;
    margin-bottom:5px;
    margin-left:40px;
    border:0px solid red;
    text-align: center;
    width:200px;
}

div.logoBlock {
    width:302px;
    float:left;
    margin-left:20px;
}

div.pineappleFrame {
    border:0px solid blue;
    float:left;
    margin-top:5px;
}

div.companyName {
    border:0px solid red;
    float:right;
    font-size:10pt;
}

div.applicationName {
    border:0px solid red;
    padding-right: 230px;
    margin-left: 230px;
    font-weight:bold;
    padding-top:30px;
    font-size:14pt;
}

div.logon {
    width:260px;
    /*height:160px;*/
    border:solid black 1px;
    text-align: left;
    margin-top:20px;
    margin-bottom:30px;
 }

div.logonTitle {
    background-color: rgb(0, 111, 92);
    color: white;
    font-weight:bold;
    padding-top:0px;
    padding-left:10px;
    padding-bottom:5px;
}

div.logonBody {
    padding-right:10px;
    padding-left:10px;
}

div.logonText {
    width:80;
    float:left;
    border:1px solid red;
}

div.logonInput {
    width:120;
    float:right;
    border:1px solid green;
}

.logonTable {
    margin-top:10px;
    margin-bottom:10px;
    font-size:8pt;
    border:0px solid black;
}

.errorText {
    color: red;
}