* {padding:0px;margin:0px;}

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;font-size:0.8em;font-size:80%;
}

/* font 11px=0.8em   4px=0.3em      */



p {margin-top:0.9em;}
ul {margin:0.3em;}
li {margin-left:0.6em;}
q {
	border-bottom: 1px #f99 dotted;
	font-style: italic;
}

	
#container {
	position: static;
	width:100%;
}

#container input, #container textarea, #container select {
	font-family: Verdana, Arial, Helvetica, sans-serif;
}


#header, #page, #footer{
	position:relative;
	display:block;
	width:auto;
	border:0px red solid;
}


#header{
	width:100%;
	text-align:right;
	height:2.2em;
}
#page {
	margin-left:16em;
	margin-right:1em;
}
/* css min-height undercore hack for fixing MSIE/Opera bug */
#footer {
	position:relative;
	display:block;
	width:auto;
	clear:both;
}
#footerText {
	position:absolute;
	display:block;
	color:#d5c;
	left:4px;
	bottom:4px;
}
#footerText A {
	color:#fff;
	text-decoration:none;
}
#footerText A:hover {
	text-decoration:underline;
}






.menu {
	position:absolute;
	width:15em;
	left:2px;
	top:0px;
	
	padding:0px;
	margin:0px;
}
.menuItem, .menuItemActive, .menuItemAP, .menuItemAPActive {
	clear:both;
	display:block;
	margin:2px;	
	padding:2px 4px;
	padding:0.1em 0.2em;
	width:90%;
	
	text-align:center;
	
	margin-bottom:0.2em;
}
.menu A {
	text-decoration : none;
}
.menu A:hover {
	text-decoration : underline;
}




.clear {
	clear: both;
}



#page ol, #page ul {margin:10px;padding:10px;border:0px solid red;}
#page li {padding:4px;margin-left:8px;}


H1 {
	position:relative;
	display:block;
	text-align:center;
	font-size:1.5em;
	font-weight:normal;	
	margin-bottom:12px;
}
H2 {
	text-align:left;
	position:relative;
	display:block;
	font-size:1.4em;
	font-weight:normal;
}




#headerLogin, #headerEdit {border-top:1px solid #ccc;display:inline;text-align:right;background-color:#eee;float:right;padding:2px;}
#headerLogin A, #headerEdit A {text-decoration:none;}
#headerLogin A:hover, #headerEdit A:hover {text-decoration:underline;}

#headerSize {margin-right:10px;;color:#666;}
#headerSmall {font-size:11px;}
#headerLarge {font-size:14px}



.submenu {
	margin:0 0 auto;
	border:0px red solid;
}
.submenu ul {
	margin:0px;
	padding:0px;
	display:block;
	text-align:center;
}
.submenu li {
	display:inline;
}
.submenuItem, .submenuItemActive {
	clear:both;
	display:block;
	margin:0px;	
	padding:2px 4px;
	text-align:center;
	display:inline;
}
.submenu A {
	text-decoration : none;
}
.submenu A:hover {
	text-decoration : underline;
}





#page    {color:#000;}
#page em {color:#666;}



.formFeedback {position:relative;width:70%;}


.input, .textarea, .select {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	border:solid #e0e0e0;
	border-width: 1px;
}
fieldset {border:0px;}
legend {color:#999;font-size:16px;display:none;}
/* row for displaying normal data fields */
.formRow {
	position: relative;
	display: block;
	width: 100%;
	text-align: left;
	padding-top: 2px;
	clear:both;
	
	xborder: dashed #30E0E0 1px;
}
.formRow label {
	display:block;
	border: dotted 0px #ec4;
	width:31%;
	text-align:right;
	color:#666;
	float:left;
}

/* set border and tidy spacing, given border width */
.formRow input,.formRow select,.formRow textarea {
	border: solid #ddd 1px;
	width:65%;
	float:right;
}
.formRow input,.formRow select,.formRow textarea,.formRow label {padding:1px;}
.formRow textarea {height:12em;}

.formRow i {color:#bbb;}

.formInfo {
	position: absolute;
	display: block;
	top: 2px;
	right: -18px;
	color: #b9a;
	width:12px;
	text-align:center;
	background-color: #fcdcec;
	border: 1px solid #dbc;
	border-right-color: #cab;
	border-bottom-color: #cab;
	padding:1px;
}

.formSection {
	display: block;
	text-align:left;
	float:right;
	width:66%;
	margin-top:16px;
	margin-bottom:4px;
	color:#999;
	clear:both;
}


.formDateTime {	border: solid #ddd 0px;
	position:relative;
	width:65%;
	float:right;}


.formSetting {
	position: relative;
	display: block;
	float:left;
	width:33%;
	
	xheight:45px;
	xheight:auto;
	
	xborder:1px solid red;
	
	margin-bottom:4px;
}
.formSetting label {
	xposition:absolute;
	xtop:22px;
 	xleft:0px;
	color:#666;
	display:block;
	text-align:right;
	width:95%;
	
	xborder:1px solid blue;
}
.formSetting select,.formSetting input {
	xposition:absolute;
	display:block;
	xtop:0px;
	xleft:0px;
	width:95%;
	
	xborder:1px solid green;
}

.formRowMessage {
	display: block;
	text-align:right;
	margin-bottom:4px;
	color:#c99;
	clear:both;
}

#formSave, #formSend, #formSearchGo, #formLoginLogin, #formSubmit {
	width:60px;
	left:200px;
	float:right;
}
#formCancel, .formFile {
	width:60px;
	left:240px;
	float:right;
	margin-left:8px;
	text-transform: lowercase;
}
/* radio buttons on address edit form - needs work */
#formAdd,#formModify {
	width:20px;
}




.dataMessage p, .slowMessage p {margin-top:4px;}
.dataMessage, .slowMessage {display:block;font-size:0.9em;margin-top:16px;padding:4px;font-style:italic;color:#333;background-color:#ddd;
	font-family: Georgia, Times New Roman, serif;}
.slowMessage {background-color:#ede;}





#next {
	color:#fff;text-decoration:none;
	padding:2px;margin:0px;
	border:1px #ccc solid;
	border-right:1px #c9c solid;
	border-bottom:1px #c9c solid;
	background-color:#969;
}
#next A {text-decoration:none;color:#fff;}
#next A:hover {text-decoration:underline;}




.menuBox {display:block;background-color:#fceffc;color:#666;width:100%;text-align:center;border-top:1px #dcd solid;border-bottom:1px #dcd solid;}
.lights {
	background-image: url(lights.gif);
	padding:4px;padding-right:30px;
	background-position : center;
	background-repeat : no-repeat;
}
.lights ul {
	list-style-type: none;
	padding:0px;
	margin:0px;
	text-align:left;
}
.lights li {
	padding:0px;
	margin:0px;
}
.lightsRed,.lightsAmber,.lightsGreen {display:block;float:right;}
.lightsRedSpan,.lightsAmberSpan,.lightsGreenSpan {}
.lightsRed,.lightsRedSpan {color:#cc0000;}
.lightsAmber,.lightsAmberSpan {color:#999900;}
.lightsGreen,.lightsGreenSpan {color:#009900;}

.trafficLightSmall {position:relative;top:13px;}






/* colours */



/* background colour */
body, .menu {
	background-color:#fff;
}

/* primary colour */
body, H1, H2, .menu, .menuItem, .menuItem A, .submenuItem, .submenuItem A {
	color:#369;
}

/* menus */
.menuItem, .menuItemActive, .submenuItem, .submenuItemActive {
	border:1px #cbc solid;
	border-right:1px #c9c solid;
	border-bottom:1px #c9c solid;
	background-color:#ede;
}

/* active menu item colours */
.menuItemActive, .submenuItemActive {
	background-color:#969;
	color:#fff;
}
.menu A, .submenuItem A {color:#939;}
.menuItemActive A, .submenuItemActive A, .menuItemActiveAP A  {color:#fff;}



/* ApologyPlus menu with distinct colours */
.ApologyPlus {color:#369;}
.menuItemAP, .menuItemAPActive {
	border:1px #bcc solid;
	border-right:1px #69c solid;
	border-bottom:1px #69c solid;
	background-color:#cde;
}
.menuItemAPActive {
	background-color:#69c;
	color:#fff;
}
.menuItemAP A {color:#cef;color:#369;}
