@charset "utf-8";
/* CSS Document */

body {
	/*	font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;*/
	background-color: #EFEFEF;
	margin: 0;
	padding: 0;
	color: #000;
	font-family: Verdana, Geneva, sans-serif;
}
/* ~~ Element/tag selectors ~~ */
form, ul, ol, dl { 
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
/*	line-height: 1.3;*/
}
p {
	line-height: 1.3;
/*	padding-right: 15px;
	padding-left: 15px;*/
}
h1, h2, h3, h4, h5, h6 {
	color: #0060AF;
	line-height: 1;
	margin: 0px;
	font-family: "Lucida Console", Verdana, Geneva, sans-serif;
	padding: 0px;
	text-transform: uppercase;
}
img {
	margin: 0px;
}
a img { 
	border: none;
}
a {
	text-decoration: none;
	color: #008FD5;
}
a:link {
	color:#008FD5;
	text-decoration: none;
}
a:visited {
	color: #008FD5;
	text-decoration: none;
}
a:hover, a:active, a:focus {
	text-decoration: none;
}
a:hover {
	color: #C00;
}
.container {
	width: 100%;
	min-width: 780px;
	margin: 0 auto; /* the auto value on the sides, coupled with the width, centers the layout. It is not needed if you set the .container's width to 100%. */
	overflow: auto;
}

/* ~~the header is not given a width. It will extend the full width of your layout. It contains an image placeholder that should be replaced with your own linked logo~~ */
.topbar {
	background-color: #000000;
	color: #FFF;
	font-size: small;
	line-height: 1;
	padding-top: 8px;
	padding-right: 30px;
	padding-bottom: 8px;
	padding-left: 30px;
}
.topbar .loginstatus {
	float: right;
}
.topbar .loginstatus a {
	color: #00AEEF;
/*	font-weight: bold;*/
	text-decoration: none;
}
.header {
	padding-left: 30px;
	padding-right: 30px;
	padding-top: 10px;
	padding-bottom: 10px;
}
.nav {
	color: #FFFFFF;
	font-size: medium;
	line-height: 1.3;
	/*	background-color: #EFEFEF;*/
	background-color: #0060AF;
	overflow: auto;
	padding: 0px;
	margin-top: 0px;
	margin-right: 30px;
	margin-bottom: 3px;
	margin-left: 30px;
}
.nav ul {
	padding: 0px;
	margin: 0px;
}
.nav ul li {
	float: left;
	list-style-type: none;
}
.nav ul li a {
	color: #FFFFFF;
	text-decoration: none;
	/*	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #000;*/
	padding-top: 8px;
	padding-right: 20px;
	padding-bottom: 8px;
	padding-left: 20px;
	/*	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #EFEFEF;*/
	display: block;
	text-transform: capitalize;
	letter-spacing: 1px;
	font-weight: normal;
}
.nav ul li a:hover {
	color: #000;
	background-color: #00AEEF;
}
.content {
	background-color: #FFF;
	min-height: 480px;
	padding: 30px;
	margin-top: 0px;
	margin-right: 30px;
	margin-bottom: 0px;
	margin-left: 30px;
	overflow: auto;
	position: relative;
}
.content .nav-bar {
	font-size: x-small;
	line-height: 1;
	padding: 0px;
	position: absolute;
	top: 5px;
	left: 5px;
}
.content .nav-bar a {
	text-decoration: none;
	color: #008FD5;
	
}
/* ~~ This grouped selector gives the lists in the .content area space ~~ */
.content ul, .content ol { 
	padding: 0 15px 15px 40px; /* this padding mirrors the right padding in the headings and paragraph rule above. Padding was placed on the bottom for space between other elements on the lists and on the left to create the indention. These may be adjusted as you wish. */
}

/* ~~ The footer ~~ */
.footer {
	text-align: right;
	color: #000;
	font-size: small;
	padding-top: 0px;
	padding-right: 30px;
	padding-bottom: 0px;
	padding-left: 30px;
}
.fltrt {  
	float: right;
}
.fltlft { 
	float: left;
}
.clearfloat { 
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}
/* Corner radius */
.corner-all, .corner-top, .corner-left, .corner-tl { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; -khtml-border-top-left-radius: 4px; border-top-left-radius: 4px; }
.corner-all, .corner-top, .corner-right, .corner-tr { -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; -khtml-border-top-right-radius: 4px; border-top-right-radius: 4px; }
.corner-all, .corner-bottom, .corner-left, .corner-bl { -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; -khtml-border-bottom-left-radius: 4px; border-bottom-left-radius: 4px; }
.corner-all, .corner-bottom, .corner-right, .corner-br { -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; -khtml-border-bottom-right-radius: 4px; border-bottom-right-radius: 4px; }

input.txt, textarea.txt, select.txt {
	font-size: medium;
	border: 1px solid #CCCCCC;
	background-color: #EFEFEF;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	color: #000;
	line-height: 1;
}
input.txt:focus, textarea.txt:focus {
	border-top-color: #C00;
	border-right-color: #C00;
	border-bottom-color: #C00;
	border-left-color: #C00;
	background-color: #FFF;
}
input.highlight {
	border: 1px solid #C00;
	background-color: #FFC;
}
select.txt option {
	padding-top: 6px;
	padding-right: 10px;
	padding-bottom: 6px;
	padding-left: 10px;
	font-size: medium;
	background-color: #EFEFEF;
}
select.highlight {
	border: 1px solid #C00;
	background-color: #FFC;	
}
option:focus {
	background-color: #FFF;
}
button {
	font-style: normal;
	font-size: medium;
	background-color: #0060AF;
	color: #FFF;
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 10px;
	padding-left: 20px;
	border: 1px solid #0060AF;
	line-height: 1;
	margin: 0px;
}
button.img {
	padding-left: 10px;
}
button:hover, button.img:hover {
	background-color: #00AEEF;
	border-top-color: #000;
	border-right-color: #000;
	border-bottom-color: #000;
	border-left-color: #000;
	cursor: pointer;
	color: #000;
}
button.disabled, button.disabled:hover {
	background-color: #CCC;
	color: #999;
	border-top-color: #999;
	border-right-color: #999;
	border-bottom-color: #999;
	border-left-color: #999;
	cursor: not-allowed;
	background-image: none;
}
.errorMsg {
	color: #900;
	background-color: #FFCACA;
	padding: 30px;
	border: 1px solid #900;
	font-size: medium;
}
.successMsg {
	background-color: #E1FFD2;
	padding: 30px;
	border: 1px solid #060;
	font-size: medium;
}
.panel {
	padding: 0px;
}
.tableSummary {
	width: 100%;
}
.tableSummary th {
	color: #FFF;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFF;
	font-weight: normal;
	text-align: left;
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 10px;
	padding-left: 20px;
	background-color: #0060AF;
}
.tableSummary th.empty {
	background-color: #FFFFFF;
}
.tableSummary th.accountOrder, .tableSummary th.jobOrder, .tableSummary th.thSort {
	cursor: pointer;	
}
.tableSummary th.accountOrder:hover, .tableSummary th.jobOrder:hover, .tableSummary th.thSort:hover {
	background-color: #00AEEF;
	color: #000;
}
.tableSummary tr td {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFF;
	font-size: medium;
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 10px;
	padding-left: 20px;
	background-color: #EFEFEF;
	color: #000;
	cursor: pointer;
	line-height: 1;
}
.tableSummary tr td a {
	text-decoration: none;
	color: #000;
}
.tableSummary tr:hover td {
	background-color: #00AEEF;
}
.page-bar {
	font-size: small;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	text-align: left;
	background-color: #FFF;
	color: #000;
}
.page-bar .summary {
	font-size: small;
}
.page-bar dl {
	float: right;	
}
.page-bar dl dt {
	float: left;
	padding-right: 5px;
}
.page-bar dl dd {
	float: left;
	margin: 0px;
	margin-left: 1px;
	padding: 3px;
	display: block;
	color: #000;
	border: 1px solid #CCC;
	font-weight: normal;
}
.page-bar dl dd.ddPage {
	background-color: #EFEFEF;
	cursor: pointer;
}
.page-bar dl dd.ddPage:hover {
	background-color: #7EB5F8;
	border-top-color: #7EB5F8;
	border-right-color: #7EB5F8;
	border-bottom-color: #7EB5F8;
	border-left-color: #7EB5F8;	
}
.optionpanel {
	padding: 15px;
/*	border: 1px solid #CCCCCC;*/
	position: relative;
	background-color: #EFEFEF;
	margin-bottom: 5px;
}
.optionpanel dl {
	float: left;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #CCCCCC;
	margin: 0px;
	padding-top: 0px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 20px;
}
.optionpanel dt {
	font-size: x-small;
}
.optionpanel dd {
	margin-left: 10px;
}
.optionpanel button, .optionpanel input.bt {
	font-size: small;
	background-color: #7EB5F8;
	border: 1px solid #7EB5F8;
	padding-top: 2px;
	padding-right: 10px;
	padding-bottom: 2px;
	padding-left: 10px;
}
.optionpanel button.btUpdate, .optionpanel input.bt {
	float: right;
	margin-top: 12px;
	margin-left: 20px;
	margin-right: 10px;
	margin-bottom: 0px;
	cursor: pointer;
}
.optionpanel input.searchtxt {
	margin: 0px;
	padding: 2px;
	font-size: small;
	border: 1px solid #00AEEF;
}
.optionpanel select {
	border: 1px solid #00AEEF;	
}
.optionpanel select option {
	
}
.optionpanel #divClearSearch {
	position: absolute;
	height: 14px;
	width: 14px;
	background-image: url(../images/icon_close.png);
	background-repeat: no-repeat;
	background-position: center center;
	cursor: pointer;
	display: block;
	right: 0px;
	top: 0px;
	z-index: 2;
}
#nameSuggestion {
	position: absolute;
	z-index: 2;
	min-width: 300px;
	max-width: 600px;
/*	background-color: #EFEFEF;*/
	top: 20px;
	left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 3px;
	padding-left: 0px;
/*	border: 1px solid #000;*/
}
#nameSuggestion #btClose {
	height: 14px;
	width: 14px;
	float: right;
	background-image: url(../images/icon_close.png);
	background-repeat: no-repeat;
	background-position: center center;
	position: relative;
	z-index: 5;
	cursor: pointer;
}
#nameSuggestion a {
	display: block;
	color: #000;
	text-decoration: none;
	padding: 2px 5px;
	font-size: small;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF;
	background-color: #EFEFEF;
}
#nameSuggestion a:hover {
	color: #000;
	background-color: #00AEEF;
	text-decoration: none;
}
.textBarLoading {
	background-image: url(../images/img_loader_s.gif);
	background-repeat: no-repeat;
	background-position: right center;	
}
.divLoading {
	background-image: url(../images/img_loader.gif);
	background-repeat: no-repeat;
	background-position: center center;
	min-height: 50px;
}
.panelDetail {
	position: relative;
/*	border: 2px solid #C1DAFF;*/
	padding-top: 30px;
	padding-right: 30px;
	padding-bottom: 30px;
	padding-left: 30px;
}
.divBox {
	overflow: auto;
	width: 100%
}
.divBox dl {
	float: left;
	margin: 20px;
}
.divBox dt {
	font-size: small;
	color: #999;
}
.divBox dd {
	margin-left: 20px;
}
.divBox dd small {
	color: #348AF3;
	margin-left: 10px;
}
.txtRed {
	color: #C00;
}
.txtOrange {
	color: #F90;
}
.txtGreen {
	color: #090;
}
.txtGrey {
	color: #CCC;	
}
tr.viewAccount td, tr.viewJob td {
	cursor: pointer;
}
#divBackgound {
	display: none;
	position: fixed;
	height: 1px;
	width: 1px;
	z-index: 20;
	background-color: #000;
	opacity: .40;
	left: 0px;
	top: 0px;
	margin: auto;
	text-align: center;
}
.shadow-all {
	-khtml-box-shadow:  0 0px 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 0 0px 3px rgba(0,0,0,0.3);
	-o-box-shadow: 0 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0 0px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0 0px 3px rgba(0, 0, 0, 0.3);
	box-shadow: 0 0px 3px rgba(0, 0, 0, 0.3);
}
.shadow-right {
	-khtml-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) ;
	-ms-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) ;
	-o-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) ;
	-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) ;
	-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) ;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) ;
}
