/******************************************************************************/
/*                                                                            */
/* Standard tag definitions                                                   */
/*                                                                            */
/******************************************************************************/

body {
  margin: 0px;
  color: #000;
  background-color: #fff;
  font-family: "Trebuchet MS", Verdana, Arial, Sans, sans-serif;
  font-size: 11px;
  background-image: url("../images/3snow.gif");
}


h1 {
  font-size: 23px;
  font-weight: bold;
  color: #000;
  background: transparent;
  letter-spacing: -1px;
  clear: both;
  margin-bottom: 0px;
}

h2 {
  margin-top: 0px;
  font-size: 17px;
  font-weight: normal;
  color: #00776a;
  background: transparent;
  clear: both;
  letter-spacing: -1px;
}

h3 {
  font-size: 13px;
  text-align: left;
  clear: both;
}

h4 {
  font-size: 11px;
  text-align: left;
  clear: both;
}

a { 
  color: #0a82c1; 
  background: transparent;
}

a:hover {
  color: #1DABF3; 
  background: transparent;
}

a:visited {
  color: #075881;  
  background: transparent;
}

a:visited:hover { 
  color: #0a82c1;  
  background: transparent;
}

blockquote {
  margin-left: 1em;
  margin-right: 1em;
  color: #434f5e;
  background: #fff;
}

/* CSS2 */
blockquote:before {
  content: open-quote;
}

blockquote:after {
  content: close-quote;
}

cite {
  color: #434f5e;
  background: #fff;
  font-style: normal;
}

code {
  background: #eeedf0;
  color: #434f5e;
  font-family: "Lucida Console", "Courier New";
}

pre {
  background: #eeeed0;
  color: #434f5e;
  font-family: "Lucida Console", "Courier New";
  padding: 1em;
  border: #434f5e 1px solid;
}

hr {
  color: #434f5e;
  height: 1px;  
}

table {
  clear: both;
  border-collapse: collapse;
  font-size: 11px;
}

fieldset {
  border: 0;
}

form {
  margin: 0px;
}

/* Oh, this is the exception for Mozilla etc.*/

html>body table {
  border-collapse: separate;
}

/******************************************************************************/
/*                                                                            */
/* Basic screen elements                                                      */
/*                                                                            */
/******************************************************************************/

div#outer {
  width: 980px;
  padding: 0px;
  margin: 0px;
}

div#body-content {
  margin-left: 200px;
  width: 560px;
  font-size: 11px;
}

div#header {  
  width: 760px;
  height: 20px;
  padding-top: 4px;

  margin-top: 23px;
  margin-left: 200px;
  margin-bottom: 25px;

  border-top: #434f5e 1px solid;
  display: block;
  text-align: right;
}

div#header span.selected {
  padding: 4px;
  background: #eeedf0 !important;
  font-weight: bold;
  color: #434f5e;
}

div#header.inFrame {
  margin-left: 0px;
  width: 367px !important;
}

div#header img {
  border: 0px;
  vertical-align: middle;
}

div#header a {
  font-weight: bold;
  text-decoration: none;
  color: #000;
  background: #fff;
  font-size: 11px;
}

div.shadow {
  clear: both;
  background-image:url("../images/bg_shader.png");
  background-repeat: repeat-x;
  width: 966px;
  height: 20px;
  border: #fff 1px solid;
  margin: 0px;
  margin-left: 0;
  text-align: left;
}

/* The footer with links to privacy etc. */

div#footer {
  width: 766px;
  clear: both;
  padding-top: 10px;
  margin-top: 30px;
  margin-left: 10px;
  background-color: transparent;
  color: #434f5e;
}

div#footer div#copyright {
  width: 190px;
  font-size: 10px;
  float: left;
  margin-top: auto;
  margin-left: 0;
}

div#footer div#morelinks {
  width: 550px;
  font-size: 11px;
  float: left;
  text-align: right;
}

div#footer div#morelinks a {
  text-transform: lowercase;
  text-decoration: none;
  color: #434f5e;
  background: #fff;
}

div#footer div#morelinks a:hover {
  text-decoration: underline;
}

/******************************************************************************/
/*                                                                            */
/* Tabular navigation system                                                  */
/*                                                                            */
/******************************************************************************/

ul.tab-menu {
  padding: 5px 0px 0px 5px;
  margin: 0px 0px 0px 0px; 
  border: #b4b0bd 1px solid;
  background-color: #eeedf0;
  height: 18px;
  list-style-type: none;
}

ul.tab-menu li {
  position: relative;
  float: left;
}

ul.tab-menu a { 
  position: relative;
	color: #434f5e !important;
  border-left: #b4b0bd 1px solid;
	text-decoration: none;
	background-image: url("../images/tabBackground.png") !important;
  background-repeat: no-repeat;
  background-position: top right !important;
	padding: 2px 12px 0px 10px;
  margin-right: 5px;
  font-weight: bold;
  border-bottom: #b4b0bd 1px solid;
  voice-family: "\"}\""; 
  voice-family:inherit; 
  padding: 2px 12px 2px 10px;  
  } 

ul.tab-menu li a.here {
  background-image: url("../images/tabForeground.png") !important;;
  padding: 2px 12px 0px 10px;  
  color: #000 !important;
  border-bottom: #fff 1px solid;
  z-index: 32;
  voice-family: "\"}\""; 
  voice-family:inherit; 
  padding: 2px 12px 2px 10px;  
}

ul.tab-menu a:hover {
  color: #600 !important;
}

ul.tab-menu a.here:hover {
  color: #000 !important;
}

/******************************************************************************/
/*                                                                            */
/* Site navigation                                                            */
/*                                                                            */
/******************************************************************************/


div#branding-and-navigation {
  position: fixed;
  float: left;
  width: 150px;
  margin: 0px 40px 200px 0px;
  font: bold 11px "Trebuchet MS", Verdana, Arial, Sans, sans-serif;
}

html>body div#branding-and-navigation {
  margin: 0px 40px -200px 0px;
}

div#branding-and-navigation #three-logo {
  margin-top: 23px;
  margin-left: 55px;  
  margin-bottom: 33px;
}

div#site-navigation {
  margin-left: 10px;  
}

div#site-navigation ul {
  font-family: "Trebuchet MS";
  font-weight: bold;
  list-style-type: none;
  width: 160px; /* (width) */
  border-top: #ccc 1px solid;
  border-bottom: #eee 1px solid;
  padding-left: 0px;
  padding-right: 0px;
  margin: 0px 0px 0px 0px;
  background-color: #fff;
  color: #000;
}

div#site-navigation ul li {
  margin-top: 0px;
  margin-bottom: 0px;
  padding-left: 0px;
  margin-left: -15px; /* IE5 */
  voice-family: "\"}\""; 
  voice-family: inherit;
  margin-left: 0px; 
}

div#site-navigation ul li h3 {
  font-size: 11px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 0px 4px 0px 4px;
  color: #000;
  border-top: #eee 1px solid;
  border-bottom: #ccc 1px solid;
  background-color: #eeedf0;
  background-repeat: no-repeat;
  background-position: 140px 4px; /* (width - 20px) */
  line-height: 24px;
  height: 24px;
  width: 162px; /* IE5 (width + 2px) */
  voice-family: "\"}\""; 
  voice-family:inherit;
  width: 152px; /* (width - 8px) */
}

div#site-navigation ul li h3#menu-register {
  background-image: url("../images/iconMenuRegister.png");
}

div#site-navigation ul li h3#menu-queue {
  background-image: url("../images/iconQueue.png");
}

div#site-navigation ul li h3#menu-view-reports {
  background-image: url("../images/iconMenuReport.png");
}

div#site-navigation ul li h3#menu-find {
  background-image: url("../images/iconMenuSearch.png");
}

div#site-navigation ul li h3#menu-customer {
  background-image: url("../images/iconMenuCustomer.png");
}

div#site-navigation ul li h3#menu-order {
  background-image: url("../images/iconMenuOrder.png");
}

div#site-navigation ul li h3#menu-organisation {
  background-image: url("../images/iconOrganisation.png");
}

div#site-navigation ul li h3#menu-stores {
  background-image: url("../images/iconStore.png");
}

div#site-navigation ul li h3#menu-ask {
  background-image: url("../images/iconMenuAsk.png");
}

/* submenus */

div#site-navigation ul ul {
  border-top: 0;
  border-bottom: #ccc 1px solid;
  padding-top: 5px;
  padding-bottom: 5px;
}

div#site-navigation ul ul li {
  font-weight: normal;
  font-size: 11px;
  line-height: 18px;
  margin: 0px;
}

div#site-navigation ul ul li span.disabled {
  display: block;
  color: lightGrey;
  background-color: #fff;
  text-decoration: none;
  padding-left: 5px;
  border: 0;
  padding-top: 0px;
  padding-bottom: 0px;
  padding-right: 0px;
  width: 162px; /* ie5 (width + 2px) */
  voice-family: "\"}\""; 
  voice-family:inherit;
  width: 155px; /* (width - 5px) */
  margin-top: 0px;
  -moz-outline: none;
}

div#site-navigation ul ul li a {
  display: block;
  color: #434f5e;
  background-color: #fff;
  text-decoration: none;
  padding-left: 5px;
  border: 0;
  padding-top: 0px;
  padding-bottom: 0px;
  padding-right: 0px;
  width: 162px; /* ie5 (width + 2px) */
  voice-family: "\"}\""; 
  voice-family:inherit;
  width: 155px; /* (width - 5px) */
  margin-top: 0px;
  -moz-outline: none;
}

div#site-navigation ul ul li a:hover {
  background: #fc0;
  color: #000;
}

div#site-navigation ul ul li a.selected {
  background: #ddd;
  color: #434f5e;
}

div#site-navigation ul ul li a.selected:hover {
  background: #fc0;
  color: #000;
}

div#site-navigation ul ul ul {
  border-left: #ddd 1px dotted;
  border-bottom: #ddd 1px dotted;
  padding-top: 0px;
  padding-bottom: 0px;
  width: 155px; /* (width - 5px) */
  margin-left: 20px; /* ie5 */
  voice-family: "\"}\""; 
  voice-family:inherit;
  margin-left: 5px;
}

/* sub-sub menus - form sections */

div#site-navigation ul ul ul li {
  font-size: 10px;
  line-height: 15px;
  margin-left: -15px; /* ie5 */
  voice-family: "\"}\""; 
  voice-family:inherit;
  margin-left: 0px;
}

div#site-navigation ul ul ul li a {
  padding-left: 5px;
  width: 149px; /* (width - 11px) */
  margin-top: 0px; 
}

/* Red "!" to denote an error in a form section */

div#site-navigation ul ul ul li span.alert {
  font-weight: bold;
  color: #ff0000;
  margin-right: 2px;
  font-size: 9px;
}


/******************************************************************************/
/*                                                                            */
/* Read-only tables                                                           */
/*                                                                            */
/******************************************************************************/

table.read-only {
  width: 100%;
  border-left: #b4b0bd 1px solid;
  border-right: #b4b0bd 1px solid;
  border-bottom: #b4b0bd 1px solid;
  background-color: #fff;
}

table.read-only caption img {
  vertical-align: middle;
  border: 0;
  margin-right: 2px;
}

table.read-only caption {
  font-weight: bold;
  font-size: 11px;
  text-align: left;
  border-top: #b4b0bd 1px solid;
  border-left: #b4b0bd 1px solid;
  border-right: #b4b0bd 1px solid;
  border-bottom: #b4b0bd 1px solid;
  padding: 5px 5px 5px 5px;
  background: #f6f5f7;
}

table.read-only td {
  padding-left: 1em;
  padding-right: 1em;
  padding-top: 0.25em;
  padding-bottom: 0.25em;
}

table.read-only label {
  display: block;
}

table.read-only span {
  display: block;
  font-weight: bold;
  color: #600;
  margin-left: 0.5em;
}

/******************************************************************************/
/*                                                                            */
/* The action bar                                                             */
/*                                                                            */
/******************************************************************************/

/* Action bar is where it's at.  It's either an action-bar.section or .screen */

div.action-bar {
  display: block;
  margin: 0px;
  height: 18px;
  padding: 2px 2px 2px 2px;
  clear: both;
}

/* Define some common attributes for all buttons */

div.action-bar button, div.action-bar input {
  margin: 0px;
  font: bold 10px "Trebuchet MS";
  background-repeat: no-repeat;
  cursor: pointer;
  border: 0;
  float: left;
}

/* And then specify some items that are specific to a "type" of button */

div.action-bar button.cancel, div.action-bar button.previous, div.action-bar input.cancel {
  text-align: left;
  padding-left: 22px;
  background-position: left;
}

div.action-bar button.continue, div.action-bar input.continue, 
div.action-bar button.open, div.action-bar input.open,
div.action-bar button.close, div.action-bar input.close {
  text-align: right;
  background-position: 98%;
  padding-right: 22px;
  float: right;
}

/* Finally, color the items, based on the function of the action-bar */

/* Colors for the "SCREEN" bar */

div.action-bar.screen {
  margin-top: 18px;
  background-color: #79A7A2;
  border: #527573 1px solid;
}

/* This will create a green background for ALL input elements inside */
/* the action-bar, but that's OK as it should only ever be a BUTTON  */
/* element or an input element of type "button".                     */

div.action-bar.screen button, div.action-bar.screen input {
  background-color: #79A7A2;
}

div.action-bar.screen button.continue, div.action-bar.screen input.continue {
  background-image: url("../images/actionNextGreen.png") ! important;
}

div.action-bar.screen button.continue.hover {
  background-image: url("../images/actionNextGreenHover.png") ! important;
}

div.action-bar.screen button.cancel, div.action-bar.screen input.cancel {
  background-image: url("../images/actionCancelGreen.png") ! important;
}

div.action-bar.screen button.previous, div.action-bar.screen input.previous {
  background-image: url("../images/actionPreviousGreen.png") ! important;
}

/* Colors for the "SECTION" bar */

div.action-bar.section {
  background-color: #ffffff;
  border-left: #b4b0bd 0px solid;
  border-right: #b4b0bd 0px solid;
  border-bottom: #b4b0bd 0px solid;
}

div.action-bar.section.open {
border-top: #b4b0bd 1px solid;
}

div.action-bar.section button, div.action-bar.section input {
  background-color: #fff;
}

div.action-bar.section button.continue, div.action-bar.section input.continue {
  background-image: url("../images/actionNextWhite.png") ! important;
}

div.action-bar.section button.cancel.hover {
  background-image: url("../images/actionCancelWhiteHover.png") ! important;
}

div.action-bar.section button.cancel, div.action-bar.section input.cancel {
  background-image: url("../images/actionCancelGreen.png") ! important;
}

div.action-bar.section button.continue.hover {
  background-image: url("../images/actionNextWhiteHover.png") ! important;
}

div.action-bar.section button.open, div.action-bar.section input.open{
  background-image: url("../images/actionShowWhiteHover.png") ! important;
}

div.action-bar.section button.close, div.action-bar.section input.close{
  background-image: url("../images/actionHideWhiteHover.png") ! important;
}
/******************************************************************************/
/*                                                                            */
/* The paging bar                                                             */
/* Expand / Contract Content  */
/*                                                                            */
/******************************************************************************/

div.paging-bar {
  background-color: #ffffff;
  border: #b4b0bd 1px solid;
  text-align:center;
  font-size:4px;
  padding:3px;
}

div.expand-content {
	text-align: right;
}

div.paging-bar.top {
  margin-bottom: 8px;
}

div.paging-bar.bottom {
  margin-top: 8px;
}

div.paging-bar img {
  border: 0px;
}

/******************************************************************************/
/*                                                                            */
/* The help bar                                                               */
/*                                                                            */
/******************************************************************************/

div.help-bar {
  display: block;
  margin: 0px 0px 15px 0px;
  clear: both;
  background: #eeedf0;
  border: #a8a2b3 1px solid;
  padding-right: 3px;
  padding-left: 3px;
  padding-top: 4px;
  font-size: 14px;
  font-weight: bold;
  color: #000;
  clear: both;
}

div.help-bar img {
  float: right;
  display: block;
  margin: 3px 0px 3px 0px;
}

/******************************************************************************/
/*                                                                            */
/* Data entry forms                                                           */
/*                                                                            */
/******************************************************************************/

table.standard-form {
  width: 100%;
}

table.standard-form.section {
  border-left: #b4b0bd 0px solid;
  border-right: #b4b0bd 0px solid;
  border-bottom: #b4b0bd 0px solid;
  background-color: #fff;
}

table.standard-form.section caption img {
  vertical-align: middle;
  border: 0;
  margin-right: 2px;
}

table.standard-form caption {
  font-size: 11px;
  font-weight: bold;
  text-align: left;
  padding: 5px 5px 5px 5px;
  background: #f6f5f7;
}

table.standard-form.section caption {
  border-bottom: #b4b0bd 1px solid;
}

table.standard-form.section caption {
  border-left: #b4b0bd 1px solid;
  border-right: #b4b0bd 1px solid;
  border-top: #b4b0bd 1px solid;
  padding-left: 4px;
}

table.standard-form th {
  padding: 5px 15px 5px 5px;
  font-weight: normal;
  text-align: right ! important;
  vertical-align: top;
}

table.stdForm td {
  border: none !important;
  vertical-align: top;
}

table.standard-form tr.required th {
  background-image: url("../images/iconRequired.png");
  background-position: 97% 6px;
  background-repeat: no-repeat;
}

table.standard-form tr.required td select, table.standard-form tr.required td input {
  background-color: #cecbd4 !important;
}

table.standard-form input, table.standard-form select {
  font: 11px "Trebuchet MS";
  background: #eeedf0;
}

table.standard-form input {
  width: 160px;
}

table.standard-form textarea {
  width: 95%;
  border: #a8a2b3 1px solid;
}

table.standard-form select{
  width: 166px;  
}

/* Exceptions to the rule above */

table.standard-form input.radio, table.standard-form input.checkbox {
  background: #ffffff ! important;
  height: 13px ! important;
  width: 14px ! important;
  margin: 2px;
}

/******************************************************************************/
/*                                                                            */
/* Displaying list of data... like a returned result set.                     */
/*                                                                            */
/******************************************************************************/

/* Overall Table look and feel                                                */

table.result-list {
  border: #a4b3af 1px solid;
  border-collapse: collapse;
}

table.result-list caption {
  text-align: left;
  padding: 0px 0px 5px 4px;
}

/* The header */

table.result-list thead th {
  background: #dce0df;
  color: #000 !important;
  /*border-top: #a4b3af 1px solid;*/
  border-bottom: #a4b3af 1px solid;
  padding: 0px;
  text-align: left;
  font-weight: bold;
}

table.result-list thead th span {
  display: block;
  margin: 0px;
  padding: 2px 4px 2px 4px;
  border-top: #fff 1px solid;
  border-left: #fff 1px solid;
  border-bottom: #fff 1px solid;
  height: auto;
}

table.result-list thead th a span {
	color: #000;
	text-decoration: underline;
}

table.result-list thead th:last-child span {
  border-right: #fff 1px solid;
}

/* The body */

table.result-list tbody tr.even {
  color: #000;
  background: #edf0ef;
}

table.result-list tbody tr.odd {
  color: #000;
  background: #ffffff;
}

table.result-list tbody td {
  padding: 4px 4px 4px 4px;
}

/* The footer */

table.result-list tfoot {
  font-weight: bold;
}

table.result-list tfoot td {
  background: #dce0df;
  border-top: #a4b3af 1px solid;
  padding: 2px 4px 2px 4px;
}

table.result-list tfoot td img {
  border: 0;
  vertical-align: middle;
}

table.result-list tfoot td a {
  text-decoration: none;
  color: #000 !important;
}

table.result-list tbody td button.remove {
  background-image: url("../images/actionCancelWhite.png") ! important;
  text-align: right;
  background-position: 98%;
  padding-right: 22px;
  float: right;
  margin: 0px;
  font: bold 10px "Trebuchet MS";
  background-repeat: no-repeat;
  cursor: pointer;
  border: 0;
  float: left;
  background-color: #fff;
  width: 19px;
  height: 19px;
}

/* Extra classes for defining rows in a selectable table */

.odd .shaded {
  background-color:#c9c9c9;
}

.even .shaded {
  background-color:#b4b0bd;
}
.highlight .shaded {
  background-color:#c5aa14 ! important;
}

.highlight {
  background-color:#F7C300 ! important;
}

/******************************************************************************/
/*                                                                            */
/* Miscellaneous extra classes for objects                                    */
/*                                                                            */
/******************************************************************************/

.center {
  text-align: center;
  margin: auto;
}

.hide {
  display: none;
}

/******************************************************************************/
/*                                                                            */
/* Warnings and information within the application                            */
/*                                                                            */
/******************************************************************************/

div.message-warning, div.message-confirmation, div.message-information {
  line-height: 0px;
  margin-left: 0px;
  font-size: 1px;
}

.message-warning ul, .message-confirmation ul, .message-information ul {
  margin-left: 0px;
  background-color: #fff;
  border: #dce0df 1px dashed;
  list-style-type: none;
	list-style-position: outside;
  padding-top: 5px;
  padding-bottom: 5px;
  margin-bottom: 15px;
  font-size: 11px ! important;
}

table .message-warning ul, table .message-confirmation ul, table .message-information ul {
  border: none;
}

.message-warning li, .message-confirmation li, .message-information li{
  vertical-align: middle;
  line-height: 16px;
  padding-top: 0px;
  margin-top: 5px;
  margin-left: 20px;
  margin-bottom: 5px;
  padding-left: 5px;
  font-size: 11px;
}

.message-warning ul {
	list-style-image: url("../images/iconAlert.png");
  color: #d90039;
}

.message-confirmation ul { 
  list-style-image: url("../images/iconTick.png");
  color: #00776a;
}

.message-information ul {
  list-style-image: url("../images/iconInformation.png");
  color: #0a82c1;
}

/******************************************************************************/
/*                                                                            */
/* Stuff for the notes frame                                                  */
/*                                                                            */
/******************************************************************************/

* html iframe#notes-frame { /* this selector recognized by IE only */
  width: 398px;   /* total width (only for IE5.x/Win) */
  padding: 0px 15px 0px 15px;
  w\idth: 367px;  /* content width (for other IE) */
}

iframe#notes-frame {
  width: 367px;   /* content width (for other browsers) */
}

iframe#notes-frame {
  position: absolute;
  top: 0px;
  left: 780px;
  height: 720px;
  overflow: auto;
  z-index: 64;
}
/******************************************************************************/
/*                                                                            */
/* Tree toggle                                                					   */
/*                                                                            */
/******************************************************************************/
.treelist{
    border:1px solid #ADA2B5;
  }
 #treeHolder #parent{
    background-color:#DEE3DE;
    cursor:hand;
  }
  #treeHolder #child{
    padding-left:30px;
    background-color:#fff; 
    cursor:hand;
  }
  
  #treeHolder .on{
    background-color:#C6AA10!important;
  }
  
  #treeHolder .childOn{
    background-color:#F7C300!important;
  }
  
/******************************************************************************/
/*                                                                            */
/* Error page for stack faults and so on                                      */
/*                                                                            */
/******************************************************************************/

div#error-page {
  position: absolute;
  top: 73px;
  left: 200px;
  background: #fff;
}

/******************************************************************************/
/*                                                                            */
/* Variables that specify the width of our elements.                          */
/* These include a few hax0r things that work around a fuxx0red box model...  */
/*                                                                            */
/******************************************************************************/

.w1                    { width: 366px ! important;}
.w3                    { width: 760px ! important;}

div.w1 hr {
  width: 366px;
}

ul.tab-menu.w1         { width: 366px ! important; voice-family: "\"}\""; voice-family:inherit; width: 359px ! important; }

table.read-only.w1     { width: 366px ! important; }
table.standard-form.w1 { width: 366px ! important; }
table.result-list.w1   { width: 366px ! important; }
table.result-list.w3   { width: 560px ! important; voice-family: "\"}\""; voice-family:inherit; width: 566px ! important; }}

div.help-bar.w1        { width: 500px ! important; voice-family: "\"}\""; voice-family:inherit; width: 359px ! important; }
div.action-bar.w1      { width: 460px ! important; voice-family: "\"}\""; voice-family:inherit; width: 360px ! important; }

.form-section { display: none; }

#customer-details{
 position:absolute;
 left:5px;
 top:364px;
 width:200px;
 height:250px;	
}

html>body #customer-details{
 position:fixed;
 top:382px;
}