body {
   margin: 0;
   background-color: white;
   color: black;
   font-family: Arial,Helvetica,sans-serif;
}
.fmldojoDndSource { display: block; }
.fmldojoDndItem { padding:3px; display: block; clear: both; height:50px;}
.dojoDndItemOver { background: #EDEDED; padding:3px;}
.chkbox { display:inline; float: left; }
.chkbox_label { font-weight:bold;}
.preview { display:inline; float: right; padding-right:15px;}
.fmldojoDndHandle { 
	display:inline; 
	float: right;
	background: transparent url('../img/drag_handle.jpg') no-repeat top left;
	height: 32px; 
	width: 32px;
}
.dashboard_edit_select {
	display: inline; 
	-moz-border-radius: 8pt 8pt 8pt 8pt;
	border-radius: 8pt 8pt 8pt 8pt;
	border: 3px solid #CCCCCC;
	padding: 1em;
	width: 38%;
	float: left;
}
.dashboard_edit_preview {
	display: inline; 
	-moz-border-radius: 8pt 8pt 8pt 8pt;
	border-radius: 8pt 8pt 8pt 8pt;
	border: 3px solid #CCCCCC;
	padding: 1em;
	width: 420px;
	float: right;
}

TD {font-family: Arial,Helvetica,sans-serif; font-size: 12px; font-style: normal;font-weight: normal; padding: 2px;}
TH {font-family: Arial,Helvetica,sans-serif; font-size: 12px; font-style: normal;font-weight: bold; background-color: #d2e9ee;}

H1 {
	font-family: Arial,Helvetica,sans-serif; 
	font-size: 16px; 
	font-style: normal; 
	font-weight: bold;
	color: #222222;
	border-bottom: 1px solid #808080;
	margin-top: 0;
	margin-left: 0;
	margin-bottom: 7px;
	padding: 3px 0 2px 0;
	width: 100%;
	/* border: 1px solid red; /* testing */
}

H2 {
	font-family: Arial,Helvetica,sans-serif; 
	font-size: 14px; 
	font-style: normal;
	font-weight: bold;
	/* background-color: #f8f8f8; */
	color: #222222;
	border-bottom: 1px solid #c0c0c0;
	margin-top: 3px;
	margin-bottom: 4px;
}

H3 {font-family: Arial,Helvetica,sans-serif; font-size:13px; font-style:normal; font-weight: bold;}
H4 {font-family: Arial,Helvetica,sans-serif; font-size:11px; font-style:normal; font-weight: bold;}

TABLE.calendarTable    { padding: 1px; }
A.calendarCaptionLeft  { color: black; }
A.calendarCaptionRight { color: black; }
A.calendarCaptionLeft:visited {color: black; text-decoration: none}
A.calendarCaptionRight:visited {color: black; text-decoration: none}
TD.calendarCaptionLeft {background-color: #D2E9EE; color: black; font-family: Arial,Helvetica,sans-serif; font-size: 12px}
TD.calendarCaptionRight {background-color: #D2E9EE; color: black; font-family: Arial,Helvetica,sans-serif; font-size: 12px}
TD.calendarCaption {background-color: #D2E9EE; color: black; font-family: Arial,Helvetica,sans-serif; font-weight: bold; font-size: 14px;}
TH.SundayTitle {background-color: #D2E9EE; font-family: Arial,Helvetica,sans-serif; font-size: 12px}
TH.SaturdayTitle {background-color: #D2E9EE; font-family: Arial,Helvetica,sans-serif; font-size: 12px}
TH.weekdayTitle {background-color: #D2E9EE; font-family: Arial,Helvetica,sans-serif; font-size: 12px}
TH.groupHeader {background-color: #D2E9EE; font-family: Arial,Helvetica,sans-serif; font-size: 14px}
TD.SundayCell {background-color: #DCE1EB}
TD.SaturdayCell {background-color: #DCE1EB}
TD.weekdayCell {background-color: #D9EBF0; font-family: Arial,Helvetica,sans-serif; font-size: 12px }
TD.calDayTitle {background-color: #DDDDDD; font-family: Arial,Helvetica,sans-serif; font-size: 14pt; font-weight: bold; }

/* for alternate row colors, top and side colors */
.row0 { background-color: #DCE1EB;  vertical-align: text-top; }
.row0 TD { vertical-align: top; }
.row1 { background-color: #D9EBF0;  vertical-align: text-top; }
.row1 TD { vertical-align: top; }
.top { background-color: #d2e9ee;  vertical-align: text-top; }
.top TD { vertical-align: top; }
.firstcol  {background-color: #d2e9ee; }
.sep { color: #808080; display: none;} /* pipe separator style, eg. Edit | List | Delete */
.navigate { 
    background-color: #f0f0f0; 
    padding: 5px;
    width: 100%; /* for a navigation bar on top */
} 

TD.emptyCell {background-color: #DDDDDD}
TD.numCell {background-color: #B0D0FF; color: #0000FF; font-family: Arial,Helvetica,sans-serif; font-size: 16px }
TD.weekCell {background-color: #D2E9EE; color: #0000FF; font-family: Arial,Helvetica,sans-serif; font-size: 16px }
TD.calendarEvent {background-color: #E9FBFF; font-family: Arial,Helvetica,sans-serif; font-size: 12px }
DIV.calendarDateStyle {font-family: Arial,Helvetica,sans-serif; font-size: 12px}
DIV.calendarEvent {font-family: Arial,Helvetica,sans-serif; font-size: 12px}

TD.messagebody { font-family: Arial, Helvetica, sans-serif; font-size: 120%; font-weight: normal; }

TR.uploadfile { background-color: #D2E9EE; }
TD.uploadfile { background-color: #D2E9EE; }

.xmenu { position: absolute; width: 180px; height: 21px; left: 0px; z-index: 15; }
.submenu { position: absolute; left: 0px; width: 180px; z-index: 10; visibility: hidden; }
.menuform { position: absolute; width: 180px; left: 3px; z-index: 0; }
img.top {vertical-align: top;}

TABLE.form       { background-color: #EEEEEE; border: none; border-collapse: collapse; padding: 2px }
TABLE.form TR TD { padding: 4px; border: 1px solid #eeeeee; }

TABLE.formlist   { background-color: #EEEEEE; border: 1px; padding: 2px }
TABLE.formfooter { background-color: white; border: 0px; padding: 2px }

TR.formhead      { background-color: #d2e9ee }
TR.formlist1     { background-color: #D9EBF0 }
TR.formlist2     { background-color: #DCE1EB }
TR.formmodified  { background-color: yellow  }
TD.formspecial   { background-color: #d0d0ff }
TD.formhead      { background-color: #d0d0ff }
TD.form          { background-color: #eeeeee }
TD.formlabel     { /* background-color: #D2E9EE */ }
TD.forminput     { /* background-color: white; */ }
TD.formsearch    { background-color: #dfdff4 }
.formsearch      { font-family:Arial,Helvetica,sans-serif; font-size: 10px; font-style: normal;font-weight: normal; }
.forminput       { font-family:Arial,Helvetica,sans-serif; font-size: 10px; font-style: normal;font-weight: normal; }
.formheadline    { font-family:Arial,Helvetica,sans-serif; font-size: 13px; font-style: normal;font-weight: bold; }
.formwarning     { font-family:Arial,Helvetica,sans-serif; font-size: 10px; font-style: normal;font-weight: normal; color: red; } 
.login           { 
	font-family: Arial,Helvetica,sans-serif; 
	font-size: 19px; 
	font-style: normal;
	font-weight: normal; 
	border-radius: 6px;
}

/* Styles for Menu Items */
ul.menu {
	font-family: Arial;
	font-size: 8pt;
	margin: 0px;
	padding: 0px;
	width: 178px;
	overflow: hidden;
}

ul.menu li {
	position: relative;
	list-style-type: none;
	border-left: 1px solid white; /* was #70b7c2; */
	border-right: 1px solid black;
	border-top: 1px solid white;
	border-bottom: 1px solid black;
	color: white;
	background-color: #017e93;
}

ul.menu li a {
	color: #ffffff;  
	display: block;
	text-decoration: none;
	background-color: #017e93; /* IE6 Bug */
	line-height: 2em; 
	height: 2em;	
	padding: 0 5px;
}

ul.menu li a.menuactive {
	color: #FDA801;  
	background-color: #017e93; /* IE6 Bug */
}

/* 2nd level menu */
ul.menu li ul {
    margin-left: 0px;  
    padding-left: 8px;
    position: relative;
    width: 169px; /* All browsers */
    *width: 176px; /* IE 7 and below */
    background-color: #017e93; /* was slightly darker #014955; */
}

/* 3rd level menu */
ul.menu li ul ul {
    margin-left: 0px;  
    padding-left: 8px;
    width: 160px;
    background-color: #017e93; /* was slightly darker #014955; */
}

/* 4th level menu */
ul.menu li ul ul ul {
    margin-left: 0px;  
    padding-left: 8px;
    width: 151px;
    background-color: #017e93; /* was slightly darker #014955; */
}

ul.menu li a:hover {
   color: #fda801;
}

ul.menu li ul  {  } /* Sub Menu Styles */
li.menuactive ul  { 
    display: block;
    color: #FDA801;  
 }
li.menuon ul  { display: block; }
li.menuoff ul { display: none; }

.minimenu {
    font-family: Arial,Helvetica,sans-serif; 
    font-size: 10px; 
    font-style: normal;
    font-weight: normal;
    color: #ffb811;  
    display: block;
    text-decoration: none;
    background-color: #017e93; /* IE6 Bug */
    width: 80px;
    /*line-height: 2em; 
      height: 2em;	*/
    padding: 0 5px;
}
.minimenu a {
    color: white;
    text-decoration: none;
}

.hidden { display: none; }
.layout { } /* this is for layout tables, that don't contain data */

@media print {
   TD {font-family: Arial,Helvetica,sans-serif; font-size: 10px; font-style: normal;font-weight: normal; padding: 2px; border-spacing: 0px; border: 1px solid #606060; }
   TD.layout { padding: 0; border: none; }
   TH {font-family: Arial,Helvetica,sans-serif; font-size: 10px; font-style: normal;font-weight: bold; background-color: #FFEDC7; border-spacing: 0px; border: 1px solid #404040;}
   H1 {font-family: Arial,Helvetica,sans-serif; font-size:14px; font-style:normal; font-weight: bold;} 
   H2 {font-family: Arial,Helvetica,sans-serif; font-size:12px; font-style:normal; font-weight: bold;}
	
   TABLE {background-color: #EEEEEE; border-style: none; padding: 0px; border-collapse: collapse; border: none;}
    /* list all elements, that should not be printed */
   .dontprint { display: none; }
   .printonly { display: inline-block !important; }
   A          { text-decoration: none; }
   .actbtn    { display: none !important; }
   .abtn      { display: none !important; }
   .menu      { display: none; }
   .gobtn     { display: none !important; }
   .back      { display: none !important; }
   .minimenu  { display: none !important; }
   #navbar    { display: none !important; }
	@page land {
		Size: A4 landscape;
		Margin: 0% 0% 0% 0%;
		filter: progid:DXImageTransform.Microsoft.BasicImage(Rotation=1);
	}
	.landscape { page: land; } /* print landscape (put in table tag) */
	/* repeat THEAD on every new page */
	thead { display: table-header-group; }
	tbody { display: table-row-group; }
	.morebutton { display: inline !important; } /* print more button text normal */   
	.morebuttonlnk { display: none !important; }
    TD.info, TD.warning, TD.error, TD.seriouswarning, TD.mildwarning, TD.serious_warning, TD.mild_warning, TH.mildwarning, TH.warning, TH.seriouswarning {
		background-image: none; 
		padding: 2px;
		border: 1px solid black;
		box-shadow: none;
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		background-color: #f0f0f0; /* maybe split for three levels, all light greys */
		font-size: 10px; /* back to normal */
		font-style: normal;
		font-weight: normal; 
	} 
}

/* Action Button Style for Anchors */
/* we have two styles: one for a nicely shaped, two sided 
   action button. the class name is is ACTBTN and here is how
   you use it: <a href=... class=actbtn><span>Edit</span></a>
*/

a.actbtn {
	background: transparent url('../img/square-gray-left.gif') no-repeat top left;
	display: inline-block;
	/*float: left;*/
	font: normal 12px Arial; /* Change 12px as desired */
	line-height: 15px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
	height: 23px; /* Height of button background height */
	padding-left: 9px; /* Width of left menu image */
	text-decoration: none;
    -moz-border-radius: 5px; /* css3 */
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

a:link.actbtn, a:active.actbtn {
	color: #494949; /*button text color*/
}
a:visited.actbtn {
	color: #696969; /*button text color*/
}

a.actbtn span {
	background: transparent url('../img/square-gray-right.gif') no-repeat top right;
	display: block;
	padding: 4px 9px 4px 0; /*Set 9px below to match value of 'padding-left' value above*/
}


a.actbtn:hover { /* Hover state CSS */
	background-position: bottom left;
}

a.actbtn:hover span { /* Hover state CSS */
	background-position: bottom right;
	color: black;
}

.buttonwrapper{ /* Container you can use to surround a CSS button to clear float */
overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
width: 100%;
}


/* 2nd style is a simpler button with simple background
   The class name is is ABTN and here is how
   you use it: <a href=... class=abtn>Edit</a>
*/
/* TODO: make bg-image larger (eg 1x50), so that multiple rows can be
   displayed. Delete "height" below and change line-height to 14px */
a.abtn {
	background: #fafafa url('../img/btn_bg1.png') repeat-x center center;
	opacity: 0.75;
	/* display: inline-block; */
	/* float: left; */
	font: normal 12px Arial; /* Change 12px as desired */
	line-height: 8px; /* This value + 2px + 2px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
	height: 9px; /* Height of button background height */
	margin: 1px 3px 1px 3px; /* changed from 5px left to 3+3 for symetry of single button in cell */
	padding: 0px 5px 0px 5px;
	text-decoration: none;
	border-bottom: 1px solid #a7a7a7;
	border-right: 1px solid #a7a7a7;
	border-top: 1px solid white;
	border-left: 1px solid white;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px; /* css3 */
}

/* mini version */
a.miniabtn {
	background: #fafafa url('../img/btn_bg1.png') repeat-x center center;
	opacity: 0.75;
	/* display: inline-block; */
	/* float: left; */
	font: normal 11px Arial; /* Change 12px as desired */
	line-height: 8px; /* This value + 2px + 2px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
	height: 9px; /* Height of button background height */
	margin-left: 2px; /* changed from 5px left to 3+3 for symetry of single button in cell */
	margin-right: 2px;
	padding: 1px 3px 1px 3px;
	color: black;
	text-decoration: none;
	border: 1px solid #aaaaaa;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px; /* css3 */
}

/* left action button */
a.labtn {
	background: #fafafa url('../img/btn_bg1.png') repeat-x center center;
	opacity: 0.66;
	display: inline-block;
	font: normal 12px Arial; /* Change 12px as desired */
	line-height: 8px; /* This value + 2px + 2px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
	height: 9px; /* Height of button background height */
	margin-left: 3px; /* changed from 5px left to 3+3 for symetry of single button in cell */
	margin-right: 1px;
	padding: 3px;
	text-decoration: none;
	border: 1px solid #a7a7a7;
    -moz-border-radius-topleft: 5px; /* css3 */
    -moz-border-radius-bottomleft: 5px; /* css3 */
    -webkit-border-radius-top-left: 5px;
    -webkit-border-radius-bottom-left: 5px;
	border-radius: 6px 0 0 6px; /* now IE9 compliant */
}

a.rabtn {
	background: #fafafa url('../img/btn_bg1.png') repeat-x center center;
	opacity: 0.66;
	display: inline-block;
	font: normal 12px Arial; /* Change 12px as desired */
	line-height: 8px; /* This value + 2px + 2px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
	height: 9px; /* Height of button background height */
	margin-left: 1px; /* changed from 5px left to 3+3 for symetry of single button in cell */
	margin-right: 3px;
	padding: 3px;
	text-decoration: none;
	border: 1px solid #a7a7a7;
    -moz-border-radius-topright: 6px; /* css3 */
    -moz-border-radius-bottomright: 6px; /* css3 */
    -webkit-border-radius-top-right: 6px;
    -webkit-border-radius-bottom-right: 6px;
	border-radius: 0 6px 6px 0;
	padding-left: 1px;
}

a:link.abtn, a:active.abtn, a:link.labtn, a:active.labtn, a:link.rabtn, a:active.rabtn {
	color: #202020; /*button text color; note opacity above */
}

a:visited.abtn,a:visited.labtn,a:visited.rabtn  {
	color: #404040; /*button text color; note opacity above */
}
a.abtn:hover { /* Hover state CSS */
	opacity: 1.0;
	color: black;
}
a.abtn:hover:active { /* Hover state CSS */
	opacity: 1.0;
	color: blue;
}

a.labtn:hover, a.rabtn:hover, a.miniabtn:hover { /* Hover state CSS */
	opacity: 1.0;
	color: black;
}

a.gobtn {
	color: #FFFFFF;
	background-color: #017E93;
	display: inline-block;
	/* float: left; /* taken out by Michael, otherwise will not right align ever */ 
	font: normal 11px Arial; /* Change 12px as desired */
	line-height: 8px; /* This value + 2px + 2px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
	margin: 3px 0px 3px 0px;
	margi\n:0px 0px 3px 0px;
	padding: 5px;
	text-decoration: none;
	border-bottom: 1px solid #a7a7a7;
	border-right: 1px solid #a7a7a7;
	border-top: 1px solid white;
	border-left: 1px solid white;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px; /* css3 */
}

a.gobtn:hover {
	color: #fda801;
}

input.gobtn {
	color: white;
	background-color: #017E93;
	display: block;
	float: left;
	font: normal 12px Arial; /* Change 12px as desired */
	line-height: 8px; /* This value + 2px + 2px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
	padding: 5pt;
	text-decoration: none;
	border-bottom: 1px solid #a7a7a7;
	border-right: 1px solid #a7a7a7;
	border-top: 1px solid white;
	border-left: 1px solid white;
    -moz-border-radius: 5px; /* css3 */
    -webkit-border-radius: 5px;
    border-radius: 5px;
	height: 30px;
}

input.gobtn:hover {
	color: #fda801;
}

.buttonwrapper { /* Container you can use to surround a CSS button to clear float */
	overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
	width: 100%;
}

/* styles for Info, Warn, Error to display 
 * Information, eg. "Your record has been saved"
 * Warnings, eg. "Your record was saved, but the field was shortened to 20 chars"
 * Errors, eg. "Your record was not saved. [Why?]"
*/
.info,.mildwarning,.mild_warning {
	background-color: #48ff48; /* nicer: #e0ffe0; */
	background-image: url('../img/icon_ok.gif');
    background-repeat: no-repeat;
    background-position: 5px center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
    padding: 10px 10px 10px 40px;
	/* border-left: 1px solid #a0f0a0;
	border-right: 1px solid #444444;
	border-top: 1px solid #a0fa0;
	border-bottom: 1px solid #446644; */
	border: 2px solid #00a000;
    -moz-border-radius: 5px; /* css3 */
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    -moz-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
}

.warning {
	background-color: #ffff48;
    background-image: url('../img/icon_warning.gif');
    background-repeat: no-repeat;
    background-position: 5px center;
    font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
    padding: 10px 10px 10px 40px;

	/* border-left: 1px solid #b0b0b0;
	border-right: 1px solid black;
	border-top: 1px solid #b0b0b0;
	border-bottom: 1px solid black; */
	
	border: 2px solid #a0a000;
    border-radius: 5px; /* css3 */
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    -moz-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
}

.highlight {
	background-color: #ffff48;
    font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
    padding: 1px;	
	border: 1px solid #a0a000;
    border-radius: 5px; /* css3 */
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.error,.seriouswarning,.serious_warning {
	background-color: #ff4848;
    background-image:url('../img/icon_error.gif');
    background-repeat:no-repeat;
    background-position: 5px center;
        
    font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: black; /* #FF0000; /* red foreground */
    padding: 10px 10px 10px 30px;           

	/* border-left: 1px solid #b0b0b0;
	border-right: 1px solid black;
	border-top: 1px solid #b0b0b0;
	border-bottom: 1px solid black; */
    border-radius: 5px; /* css3 */
    border: 2px solid #a00000;
    -moz-border-radius: 5px; /* mozilla before 3.6 */
    -webkit-border-radius: 5px;
    box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    -moz-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
}

TD.info, TD.warning, TD.error, TD.seriouswarning, TD.mildwarning, TD.serious_warning, TD.mild_warning {
	/* less spacing in tables, no image */
	background-image: none; 
	padding: 2px;
    /* background-position: 2px center;
    background-size: 20px 14px; /* original 30x21 */
	border: none; /* this will delete the normal table border and look ugly in print */
	box-shadow: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
} 

TR.info, TR.warning, TR.error, TR.seriouswarning, TR.mildwarning, TR.serious_warning, TR.mild_warning {
    /* less spacing in tables, no image */
    background-image: none; 
    padding: 2px;
    /* background-position: 2px center;
    background-size: 20px 14px; /* original 30x21 */
    border: none; /* this will delete the normal table border and look ugly in print */
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
} 


/* here are more warning and alert styles */

.sixmonthdue {
	background-color: #FDD017;
}

.oneyeardue {
	background-color: #F9B7FF;
}
.ontime {
	background-color: #66CCFF;
}

/* under the menu search boxes */
.leftsearch {
	color: #0A2d78;
	font-size: 7pt;
	font-weight: bold;
}

.printonly { display: none; }

/* style sheet for the business cards in phonebook.jsp */
.phoneName {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: bold;
    color: #555555;
    line-height: 25px;
}

.phonebookTable {
	display: inline-block;
	display: inline;	
}

.phonebookTD {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	background-color: #f0f0f0;
	line-height: 20px;
	width: 370px;
	height: 180px;
}
/* for vroon crew assignment calendar color coding */
     .type0 { background-color: #ffffff; } /* missing conract */
     .type1 { background-color: #00ff00; } /* work */
     .type2 { background-color: #ffff00; } /* leave */
     .type3 { background-color: #c0c0c0; } /* not counted */
     .type3 { background-color: #ff8080; } /* error */

/* for vroon payment calendar */
.paytype0 { background-color: #ffffff; } /* missing conract */
.paytype1 { background-color: #fefefe; } /* paid */
.paytype2 { background-color: #ffb0b0; } /* unpaid */

.dotline_hori {
        background: url('../img/dotline_hori.gif');
        background-repeat: repeat-x;
	background-position: center;
	height: 6px;
}
.dotline_vert {
        background: url('../img/dotline_vert.gif');
        background-repeat: repeat-y;
	/* background-position: center;
	height: 6px; */
}

.maindiv {
	overflow: visible;
}
	
/* container div for dashboards */
.dashboardcontainer {
	width: 408px;
    display: inline;
    overflow: visible;
    float: left;
    vertical-align: top;
}
	
.dashboard {
    width: 400px; /* or 40% */
    height: 280px; /* or 40% */
    border: 1px solid #017e93;
    -moz-border-radius: 8px; /* css3 */
    -webkit-border-radius: 8px;
    border-radius: 8px;
    font-size: 10px;
    font-weight: normal;
    padding: 0 0 10px 0;
    margin: 5px;
    -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    -moz-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
}

.dashboard H1 {
    background-color: #017e93;
    color: #fda801;
    width: 400px; /* 100% of above did not work */
    text-align: center;
    font-size: 12px;
    font-weight: bold;
    height: 16px;
    margin-top: 0;
    /* -moz-border-radius-top: 8px; /* css3 */
    /* -webkit-border-radius-top: 8px;*/
    border-radius: 8px 8px 0 0; /* now IE9 compliant */
    padding: 0;
    margin-bottom: 5px;
    overflow: hidden;
}
TABLE.db-boss {
	border-collapse: collapse;
}
TABLE.db-boss TR TH {
	font-size: 10px;
	text-align: center;
	width: 33%;	
	}
TABLE.db-boss TR TD {
	font-size: 48px;
	text-align: center;
    font-weight: bold;
    vertical-align: middle;
	width: 33%;	
	height: 72px;
}
TD.db-boss-change {
	font-size: 10pt !important;
	text-align: center;
    font-weight: normal !important;
	width: 33%;
	border-bottom: 2px solid black;	
	height: 12px !important;
}

/* For "Closing the loop" module  - starts */
.formitem {
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
}

.tundra .dijitTextBox input {
    float: left;
    padding: 2px;
}

.tundra .dijitTextArea {
    padding: 2px;
}

.tundra .dijitInputInner {
    background-color:transparent !important;
    border:0 none !important;
    margin-left: 2px !important;
    margin-right:0 !important;
    padding-right:0 !important;
    vertical-align:middle !important;
    width:100% !important;
}

/*
.tundra .dijitReset {
    border: 0 none;
    color: inherit;
    margin: 0;
    padding: 2px;
}
*/

.taskList {
    width: 900px;
    background-color: #FFFFFF;
    overflow: hidden;
    clear: both;
}
/* For "Closing the loop" module  - ends */

.shipheadline {
	font-family: Arial,Helvetica,sans-serif; 
	font-size: 12px; 
	font-style: normal;
	font-weight: bold;
	background-color: #f8f8f8;
	color: #222222;
	border-bottom: 1px solid #d0d0d0;
	margin: 0 0 3px 1px;
	width: 177px; /* same as menu */
	/*border: 1px solid red; /* for test */	
}

.shipheadline IMG {
	padding-right: 5px;
	border: none;
}

/* for tables with headline lines in them */
.white {
	background-color: white;
	border: none;
}

/* for time sheet */
.timeon {
	width: 15px;
	height: 40px;
	background-color: #ffd700; /* yellow/gold */
}

.timeoff0 {
	width: 15px;
	height: 40px;
	background-color: white;
}

.timeoff1 {
	width: 15px;
	height: 40px;
	background-color: #ECECEC; /* light grey */
}		
.timeonlow {
	width: 15px;
	height: 20px;
	background-color: #ffd700; /* yellow/gold */
}

.timeoff0low {
	width: 15px;
	height: 20px;
	background-color: white;
}

.timeoff1low {
	width: 15px;
	height: 20px;
	background-color: #ECECEC; /* light grey */
}		
/* for more button */
.morebutton {
	display: none;
}
.morebuttonlnk {
	display: inline;
	font-size: 8pt;
background-color: #ececec;
	color: #444444;
	margin-left: 8px; /* like space */
	padding: 1px;
	border: 1px solid #d0d0d0;
	border-radius: 4px;
}
.morebuttonlnk:hover {
	display: inline;
	font-size: 8pt;
	background-color: #fcfcfc;
	color: black;
	margin-left: 8px; /* like space */
	padding: 1px;
	border: 1px solid #666666;
	border-radius: 4px;
}

/* New form manager 2011 
 * all sub classes start with 'frm'
 */
.frmtab {
	/* for form table */
}
.frmtab TD {
	padding: 6px 3px 3px 3px; /* three more pixels on top */
}
.frmsep {
	/* separate two questions */
    /* background: url('../img/dotline_hori.gif');
    background-repeat: repeat-x;
	background-position: center; */
	height: 5px;
	background-color: white;
}
TD.frmseplevel1  {
     padding: 3px 3px 3px 30px;
}
TD.frmseplevel2  {
     padding: 3px 3px 3px 60px;
}
TD.frmseplevel3  {
     padding: 3px 3px 3px 90px;
}
.frmsepnormal {
	height: inherit;
}
.frmnote {
	font-size: 8pt;
	color: #666666;
	margin: 0;
}

/* icon view (classes of UI with icons) 
 * all subclasses start with 'iv' 
 */
.iconview {
	background-color: #fafafa;
	width: 200px; /* 25% did not work */
	height: 170px;
	display: inline-block;
	text-align: center;
	/* border: 1px solid red; /* test */
	padding: 5px;
	overflow: hidden;
	border: 2px solid #f6f6f6;
	border-radius: 12px;
	margin: 0 5px 5px 0;
	opacity: 0.8;
    box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    -moz-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
}

.ivtitle {
	color: #404040;
	font-size: 10pt;
	font-weight: bold;
	border: none;
	padding: 0;
	margin: 0 0 4px 0;
	/* border: 1px solid blue; /* test */
    display: inline-block;
}

.ivdate {
	color: #707070;
	font-size: 8pt;
	font-weight: normal;
	margin: 0 0 6px 0;
	padding: 0;
	display: inline-block;
	/* border: 1px solid green; /* test */
}
/* icon image itself */
.icon {
	width: 120px;
	height: 120px;
	border: none;
	padding: 4px;
	/* border: 1px solid yellow; /* test */
}

/* document system */
.docrevision {
	color: #888888;
	font-size: 8pt;
}

.docindH1 { margin-left: 0px; }
.docindH2 { margin-left: 20px; }
.docindH3 { margin-left: 40px; }
.docindH4 { margin-left: 60px; }
.docindH5 { margin-left: 80px; }
.docindH6 { margin-left: 100px; }

SPAN.document { font-size: 14px; font-weight: normal; }
H1.document { font-size: 36px; font-weight: bold; border-bottom: 3px solid #444444;}
H2.document { font-size: 24px; font-weight: bold; border-bottom: 1px solid #888888;}
H3.document { font-size: 18px; font-weight: bold; }
H4.document { font-size: 16px; font-weight: bold; }
H5.document { font-size: 14px; font-weight: bold; }
H6.document { font-size: 12px; font-weight: bold; }

/* book shelf */
.docbookshelf {
	background: url(../img/bookshelf.png);
	width: 100%;
	min-width: 600px;
	padding: 23px 0 0 10px;
	
}
.docbook {
	width: 100px;
	height: 150px;
	background: url(../img/bookcover.png) no-repeat left top;
	/*border: 1px solid black;*/
    box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
    -moz-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
	display: inline-block;
	padding: 0;
	margin: 12px 20px 0px 20px;
	overflow: hidden;
	text-align: center;
}

.docbook A {
	text-decoration: none;
	font-size: 8pt;
	font-weight: bold;
	color: black;
	margin: 24px 16px 0 16px;
    background-color: transparent;
	width: 70px;
	height: 64px;
	overflow: hidden;
	display: inline-block;
	padding: 0px;
	vertical-align: center;
	/* border: 1px solid red; */
}

.docbook SPAN A {
	/* for revision */
	font-size: 6pt !important;
	color: #666666 !important;
	bottom: 10px;
	position: relative;
}

.docsearch {
	position: relative;
	right: 0px;
	top: -10px;
	height: 12px;
	/*width: 280px;*/
	/*background-color: white; */
	/* border: 1px solid red; /* test */
	display: inline-block;
	float: right;
}

.docsearch FORM {
	display: inline;
}

.docsearch FORM INPUT {
	display: inline;
	height: 16px;
}

H2.doclibname {
	margin: 3px 0 8px 0;
	color: black !important;
	border: none !important;
}

/* iphone style back button */
.back {
	display: inline-block;
	-moz-appearance:none;
  	padding: 4px;
  	min-width: 75px;
  	text-align: center;
  	font-family: Helvetica, sans-serif;
  	font-weight: bold;
  	font-size: xx-small;
  	text-decoration: none;
  	border-left: 12px;
  	border-right: 5px;
  	color: white;
  	text-shadow: rgba(0,0,0,0.6) 0px 1px 1px;
  	-moz-border-image: url("../img/backBtnBG.png") 0 5 0 12;
	-webkit-border-image:  url("../img/backBtnBG.png") 0 5 0 12;
	border-image: url("../img/backBtnBG.png") 0 5 0 12;
	vertical-align: middle;
	margin-right: 15px;
}

.back:hover {
  	-moz-border-image: url("../img/left-hover.png") 0 5 0 12;
	-webkit-border-image:  url("../img/left-hover.png") 0 5 0 12;
	border-image: url("../img/left-hover.png") 0 5 0 12;
}

.back:hover:active {
	padding: 5px 3px 3px 5px;
}

.back3 {
	display: inline-block;
	-moz-appearance:none;
  	padding: 4px;
  	min-width: 75px;
  	text-align: center;
  	font-family: Helvetica, sans-serif;
  	font-weight: bold;
  	font-size: xx-small;
  	text-decoration: none;
  	border-top: 1px solid #888888;
  	border-bottom: 1px solid #888888;
  	border-right: 1px solid #888888;
  	border-left: none;
	/*border-radius: 4px;*/
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
	border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;
	color: black; 
	/* note: multiple backgrounds not supported in old browsers */
	background-color: #fafafa;
	/*background: url(../img/back1.png) no-repeat -3px 0%, url(../img/btn_bg1.png) repeat-x center center;*/
	background: url(../img/btn_bg1.png) repeat-x left center;
	vertical-align: middle;
	margin-right: 15px; // space on right towards headline
}

.back3:hover {
  	//-moz-border-image: url("../img/left-hover.png") 0 5 0 12;
	//-webkit-border-image:  url("../img/left-hover.png") 0 5 0 12;
	//border-image: url("../img/left-hover.png") 0 5 0 12;
	background-color:  #017e93;
}

.back3:hover:active {
	padding: 5px 3px 3px 5px;
}


/* for small tables we have a "wide" style for more space */

TABLE.wide TR TD { 
	padding: 3px 6px 3px 6px;
} 
TABLE.wide TR TH { 
	padding: 3px 6px 3px 6px;
}

TABLE.full {
	width: 100%;
}

/* the next is for all lists, that are INSIDE table cells: we reduce spacing a bit */
TD > UL {
	margin: 2px 0 2px 0;
	padding-left: 2em;
}

/* ***************** NAVIGATION BAR ***************** */
#navbar {
	height: 20px;
	width: 1500px; /* will later be reduced to windowsize - 250 by dojo animation */
	background-color: white;
	border: 1px solid #eaeaea;
	border-radius: 6px;
	margin-bottom: 5px;
	line-height: 6pt; /* this can move text up and down */
	color: #555555;
}

#navbar IMG {
	vertical-align: -70%;
	border: none;
}

#navbar IMG:first-child {
	margin-left: 15px;
	
}
#navbar A {
	color: #555555;
	text-decoration: none;
	display: inline-block;
}

#navbar A:hover {
	color: #0000ff;
	text-decoration: underline;
}

#navright {
	float: right;
}

/* left element, active */
.navprev {
	background: #fafafa url('../img/btn_bg1.png') repeat-x center center;
	color: #555555;
	display: inline-block;
	font: normal 12px Arial; /* Change 12px as desired */
	line-height: 8px; /* This value + 2px + 2px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
	height: 9px; /* Height of button background height */
	margin: 2px 1px 0 3px;
	padding: 4px 6px 2px 6px;
	text-decoration: none;
	border: 1px solid #bbbbbb;
    -moz-border-radius-topleft: 5px; /* css3 */
    -moz-border-radius-bottomleft: 5px; /* css3 */
    -webkit-border-radius-top-left: 5px;
    -webkit-border-radius-bottom-left: 5px;
	border-radius: 6px 0 0 6px; /* now IE9 compliant */
}

.navprev:hover 		  { color: black;   }
.navprev:hover:active {	color: #0000ff; }

/* left element, inactive */
.navnoprev {
	background: #fafafa url('../img/btn_bg1.png') repeat-x center center;
	color: #bbbbbb !important;
	display: inline-block;
	font: normal 12px Arial; /* Change 12px as desired */
	line-height: 8px; /* This value + 2px + 2px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
	height: 9px; /* Height of button background height */
	margin: 2px 1px 0 3px;
	padding: 4px 4px 2px 4px;
	text-decoration: none;
	border: 1px solid #bbbbbb;
    -moz-border-radius-topleft: 5px; /* css3 */
    -moz-border-radius-bottomleft: 5px; /* css3 */
    -webkit-border-radius-top-left: 5px;
    -webkit-border-radius-bottom-left: 5px;
	border-radius: 6px 0 0 6px; /* now IE9 compliant */
}
.navnoprev:hover {
	color: #bbbbbb !important;
	text-decoration: none !important;
}
.navnoprev:hover:active {
	color: #bbbbbb !important;
	text-decoration: none;
}

/* right element, active */
.navnext {
	background: #fafafa url('../img/btn_bg1.png') repeat-x center center;
	color: #555555;
	display: inline-block;
	font: normal 12px Arial; /* Change 12px as desired */
	line-height: 8px; /* This value + 2px + 2px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
	height: 9px; /* Height of button background height */
	margin: 2px 1px 0 3px;
	padding: 4px 4px 2px 4px;
	text-decoration: none;
	border: 1px solid #bbbbbb;
    -moz-border-radius-topright: 6px; /* css3 */
    -moz-border-radius-bottomright: 6px; /* css3 */
    -webkit-border-radius-top-right: 6px;
    -webkit-border-radius-bottom-right: 6px;
	border-radius: 0 6px 6px 0;
	padding-left: 1px;
}

/* right element, inactive */
.navnonext {
	background: #fafafa url('../img/btn_bg1.png') repeat-x center center;
	color: #bbbbbb !important;
	display: inline-block;
	font: normal 12px Arial; /* Change 12px as desired */
	line-height: 8px; /* This value + 2px + 2px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
	height: 9px; /* Height of button background height */
	margin-left: 0px; /* changed from 5px left to 3+3 for symetry of single button in cell */
	margin-right: 3px;
	margin-top: 2px;
	padding: 4px 4px 2px 4px;
	text-decoration: none;
	border: 1px solid #bbbbbb;
    -moz-border-radius-topright: 6px; /* css3 */
    -moz-border-radius-bottomright: 6px; /* css3 */
    -webkit-border-radius-top-right: 6px;
    -webkit-border-radius-bottom-right: 6px;
	border-radius: 0 6px 6px 0;
	padding-left: 1px;
}

.navnonext {
	color: #bbbbbb !important;
	text-decoration: none !important;
}

/* middle element, active */
.navelem {
	background: #fafafa url('../img/btn_bg1.png') repeat-x center center;
	color: #555555;
	display: inline-block;
	font: normal 12px Arial; /* Change 12px as desired */
	line-height: 8px; /* This value + 2px + 2px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
	height: 9px; /* Height of button background height */
	margin: 2px 1px 0 0px;
	padding: 4px 6px 2px 6px;
	text-decoration: none;
	border: 1px solid #bbbbbb;
}

.navelem:hover {
	color: black;
	border-color: #555555;
}

.navelem:hover:active {
	color: #0000bb;
}

/* middle element, inactive */
A.navnoelem {
	background: #fafafa url('../img/btn_bg1.png') repeat-x center center;
	color: #bbbbbb !important;
	display: inline-block;
	font: normal 12px Arial; /* Change 12px as desired */
	line-height: 8px; /* This value + 2px + 2px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
	height: 9px; /* Height of button background height */
	margin: 2px 1px 0 0px;
	padding: 4px 6px 2px 6px;
	text-decoration: none;
	border: 1px solid #bbbbbb;
}
.navnoelem:hover {
	color: #bbbbbb !important;
	text-decoration: none !important;
}

.navsep {
	color: #eaeaea;
}