/*
	GLOBAL
*/
a img {border:0}
button, .clickable { cursor:pointer; }
input, textarea { cursor:text; }
span {display:inline-block; display:-moz-inline-box}
.clr {clear:both}
.onepixel { font-size:0; width:1px; height:1px; line-height:0; margin:0; padding:0 }
.bold {font-weight:bold }
.f-left, .LHS  {float:left}
.f-right, .RHS {float:right}
.num {text-align:right}
.hidden {display:none}
.ralign {width:100%; text-align:right }

body {-webkit-text-size-adjust: none;background-color: #c0c0c0; text-align:center; margin:0 auto;}
* {padding:0; margin:0; font-family:Arial, Helvetica, sans-serif; font-size:11px }

a         { color:#333; text-decoration:none; }
a:visited { color:#333; text-decoration:none; }
a:hover   { color:#666; text-decoration:underline; }


/*
	COMMON
*/
.breadcrumb           { background:url(img/breadcrumb.png); height:16px; font-weight:bold; color:#fff; padding:4px 0 4px 4px; margin:12px 0 0 0; }
.breadcrumb a         { color:#fff; text-decoration:underline; }
.breadcrumb a:visited { color:#fff; text-decoration:underline; }
.breadcrumb a:hover   { color:#ccc}
.breadcrumb .beam-balance {background:url(img/beam-balance-ico.png); width:20px; height:20px; margin:-2px 4px;}

.mainbody             { width:auto; margin:20px; font-size:13px }
.mainbody *           { font-size:13px }
.mainbody .small      { font-size:12px }
.mainbody h1          { margin:18px 0 4px 0 }
.mainbody ul          { margin-left:35px }
.quotationmark        { background:url(img/quotationmark.png) no-repeat; padding:0 30px }

.search-again-button  { width:200px; height:20px; background:url(img/search-again.png) no-repeat; margin:0 0 12px 0; cursor:pointer }

.title    { margin:20px 0 0 20px; color:#faa61b; font-size:14px; text-align:left; font-weight:bold; padding-bottom:8px}
.title2   { margin:8px 0 0 20px; color:#ffbc0f; font-size:12px; text-align:left; font-weight:bold; padding-bottom:4px}
.title3   { margin:8px 0 0 20px; color:#333333; font-size:11px; text-align:left; font-weight:bold; margin-top:0; padding-bottom:4px }

a.yellow-large        { padding-bottom:8px; color:#faa61b; font-size:14px; text-align:left; font-weight:bold }
.hlite                { color:#faa61b; font-weight:bold }



/*
	BUTTON
*/
button.btn48        { width:48px;  height:20px; border:0; margin-right:8px; font-size:11px; background:url(img/btn48.png); padding-bottom: 2px; _padding-bottom: 0px; line-height: 1.8em; *line-height: 1.6em; }
button.btn48:hover  { background:url(img/btn48on.png) }
button.btn58        { width:58px;  height:20px; border:0; margin-right:8px; font-size:11px; background:url(img/btn58.png); padding-bottom: 2px; _padding-bottom: 0px; line-height: 1.8em; *line-height: 1.6em; }
button.btn58:hover  { background:url(img/btn58on.png) }
button.btn73        { width:73px;  height:20px; border:0; margin-right:8px; font-size:11px; background:url(img/btn73.png); padding-bottom: 2px; _padding-bottom: 0px; line-height: 1.8em; *line-height: 1.6em; }
button.btn73:hover  { background:url(img/btn73on.png) }
button.btn98        { width:98px;  height:20px; border:0; margin-right:8px; font-size:11px; background:url(img/btn98.png); padding-bottom: 2px; _padding-bottom: 0px; line-height: 1.8em; *line-height: 1.6em; }
button.btn98:hover  { background:url(img/btn98on.png) }
button.btn123       { width:123px; height:20px; border:0; margin-right:8px; font-size:11px; background:url(img/btn123.png); padding-bottom: 2px; _padding-bottom: 0px; line-height: 1.8em; *line-height: 1.6em; }
button.btn123:hover { background:url(img/btn123on.png) }
button.btn148       { width:148px; height:20px; border:0; margin-right:8px; font-size:11px; background:url(img/btn148.png); padding-bottom: 2px; _padding-bottom: 0px; line-height: 1.8em; *line-height: 1.6em; }
button.btn148:hover { background:url(img/btn148on.png) }



/*
	DIALOG BOX
*/
.dialog-box               { background:#fff; padding:8px 8px 8px 8px; border:5px solid #ccc }
.dialog-box-close-button  { position:absolute; top:-9px; right:-12px; width:25px; height:29px; background:url(img/close_x.png) no-repeat; display:inline; z-index:3200; cursor:pointer }




/*
	FORM
*/

.form1 .grouplabel      { padding-bottom:4px }
.form1 .titlefield      { width:180px; text-align:left; color:#333; font-size:10px; font-weight:bold; height:16px; line-height:16px; padding:8px 0 0 8px; text-align:left }
.form1 .inputfield      { padding:0 0 0 8px; text-align:left }
.form1 .inputtext       { width:176px; border:1px solid #ccc; height:16px; margin:1px 0; padding:2px 0 0 2px; color:#666 }
.form1 .hintsfield      { color: #999999; height:0; padding:0 0 4px 0; line-height:14px; font-size:9px }
.form1 select           { width:180px; height:20px; margin:1px 0 2px 0; color:#666 }
.form1 textarea         { border:1px #A7A6AA solid; margin:2px 0 2px 0; padding:4px }
.form1 .buttonplace     { width:188px; text-align:right; padding:16px 0 }
.form1 #aToggleOpt      { margin-right:16px; font-size:10px }
.form1 a                { color:#333; text-decoration:none }
.form1 a:visited        { color:#333; text-decoration:none }
.form1 a:hover          { color:#000; text-decoration:underline }

.form2                  { text-align:left; margin:0 0 16px 20px; }
.form2 .grouplabel      { text-align:left; padding-right: 4px; border-top:#ccc 1px solid; padding-left:20px; font-weight:900; font-size: 11px; padding-bottom: 4px; border-left:#ccc 1px solid; color:#525252; padding-top: 4px; text-align:left; background:url(img/orange-bullet.png) no-repeat 6px 5px }
.form2 .mandatory       { font-style:italic; padding:12px 0}
.form2 .mandatory span  { color:red}
.form2 .titlefield      { width:150px; text-align:left; color:#333; font-weight:bold; height:16px; line-height:18px; padding:8px 6px 0 0; vertical-align:top}
.form2 .inputfield      { text-align:left; padding:6px 0 0 0; }
.form2 .inputtext       { width:176px; border:1px solid #ccc; height:18px; padding:2px 0 0 2px; color:#666}
.form2 .hintsfield      { color: #999999; height:0; padding:0 0 4px 0; line-height:14px; font-size:9px;}
.form2 select           { border:1px #A7A6AA solid; width:200px; height:20px; margin:3px 0 2px 0; color:#666; }
.form2 textarea         { border:1px #A7A6AA solid; margin:2px 0 2px 0; padding:4px; }
.form2 .trailingText    { width:180px; font-size:10px; line-height:11px; text-align:justify}
.form2 .buttonplace     { text-align:right; }



/*
	MAIN LAYOUT
*/
.header               {background-color:#323232; height:130px; width:990px; border-bottom:#ccc; margin:0 auto;}
.header .top          {height:10px; border-bottom:1px solid #ccc; width:100%; text-align:left}
.header .top-left     {width:200px; border-right:1px solid #CCC; background-color:#666; height:10px;}
.header .logo         {float:left; margin:50px 0 0 20px }
.header .link         {float:left; margin:75px 0 0 40px }
.header .link a       {color:#ccc; margin-right:25px; font-size:11px;}
.header .link a:hover {color:#fff; }

.content { width:990px; background-color:#fff;  margin:0 auto; height:auto; background-image:url(img/background.gif)}
.content_left   {float:left; width:200px; background-color:#fff;}
.content_right  {float:left; width:770px; border-left:1px solid #ccc; background-color:#fff; }

.footer               {clear:both; width:990px; background:#ccc;  margin:0 auto;}
.footer .top          {background-color:#323232; width:100%; height:25px; text-align:left;}
.footer .top-left     {float:left; border-right:1px solid #ccc; width:200px; height:25px;}
.footer .bottom       {background-color:#666666; height:35px; border-top:1px solid #ccc; clear:both;}
.footer .bottom .link {padding:10px 0 0 10px; color:#ccc }
.footer .bottom .link a       {color:#ccc; font-size:10px}
.footer .bottom .link a:hover {color:#fff; }
.footer .bottom-left  {float:left; border-right:1px solid #ccc; width:200px; height:35px;}
.footer .version      {text-align:right; padding:10px 19px 0 0; color:#fff; font-size:10px}

.textleft{ text-align:left;}
.top_line{border-top:1px solid #bfbdb7; width:100%;}
.bottom_line{border-bottom:1px solid #bfbdb7; width:100%;}
.margin_left{ margin-left:20px;}
.margin_right{ margin-right:20px;}
.margin5{ margin:5px;}
.padding5{ padding:5px;}
.padding9{ padding:9px;}
.font_yelow{color:#FFCA2E; font-size:25px;}
.font_yelow1{color:#faa61b; font-size:14px; text-align:left; font-weight:bold; padding-bottom:8px}



/*
	NAVIGATION MENU
*/
.leftnav         {}
.leftnav a       { font-weight: bold; color:#333; float:left; width:179px; padding:8px 0 8px 20px; text-align:left; background:url(img/leftnav-menuitem.png); font-size:11px}
.leftnav a:hover { color:black; text-decoration:none; background:url(img/leftnav-menuitem-on.png)}
.leftnav a.hlite { background:url(img/leftnav-menuitem-on.png)}
.leftnav a.tool       { background:url(img/leftnav-menuitem-tool.png)}
.leftnav a.tool:hover { background:url(img/leftnav-menuitem-on.png)}



/*
	PAGINATION
*/
.page-first         { background:url(img/page-first.png); float:left; width:18px; height:14px;}
.page-prev          { background:url(img/page-prev.png);  float:left; width:18px; height:14px;}
.page-pages         { float:left; height:14px;}
.page-next          { background:url(img/page-next.png);  float:left; width:18px; height:14px;}
.page-last          { background:url(img/page-last.png);  float:left; width:18px; height:14px;}
.pagebanner         { display:block}


/*
	TABLE
*/
.data-table {
	width:770px;
	border:#f0f0f0 1px solid;
	font-size:11px;
	margin:8px 0;
	color:#000;
	border-collapse:collapse;
	border-spacing:0;
	/*empty-cells:hide;*/
}
.data-table caption  { border-right: #f0f0f0 1px solid; padding-right: 4px; border-top: #f0f0f0 1px solid; padding-left:20px; font-weight: 900; font-size: 11px; padding-bottom: 4px; border-left: #f0f0f0 1px solid; color:#525252; padding-top: 4px; border-bottom: #f0f0f0 0px solid; text-align:left; background:url(img/orange-bullet.png) no-repeat 6px 5px }
.data-table thead th { border-right: #f0f0f0 1px solid; padding-right: 4px; border-top: #f0f0f0 1px solid; padding-left: 4px; font-weight: bold; font-size: 11px; padding-bottom: 6px; border-left: #f0f0f0 1px solid; color:#000; padding-top: 6px; border-bottom: #f0f0f0 1px solid; white-space:nowrap; background-color:#eee; text-align:left}
.data-table thead th a         { color:#000; font-size:11px }
.data-table thead th a:visited { color:#000; }
.data-table thead th a:hover   { color:#000; text-decoration:underline}
.data-table td       { border-right: #f0f0f0 1px solid; padding-right: 5px; border-top: #f0f0f0 1px solid; padding-left: 5px; font-size: 11px; padding-bottom: 5px; border-left: #f0f0f0 1px solid; padding-top: 5px; border-bottom: #f0f0f0 1px solid; vertical-align:middle }
.data-table td a         { color:#000; font-size:11px }
.data-table td a:visited { color:#000; }
.data-table td a:hover   { color:#000; text-decoration:underline}
.data-table .clickable   { background:#f6f6f6}

.data-table th.sorted a, th.sortable a { background:right no-repeat; display:block; width:100%}
.data-table th.sortable a              { background-image:url(GUIControl/displaytag/arrow_off.png)}
.data-table th.order1 a                { background-image:url(GUIControl/displaytag/arrow_down.png)}
.data-table th.order2 a { background-image:url(GUIControl/displaytag/arrow_up.png)}

.data-table .label { padding:4px 12px 4px 4px; width:100px; vertical-align:center; border-right:0 }
.data-table .value { padding:4px; vertical-align:center; ; border-left:0}


.contentbox01 { border-bottom:1px solid #ccc; text-align:left; padding:12px 8px 12px 12px;}
.contentbox02 { text-align:left; padding:12px 8px 12px 12px;}




/*
	TABBED PAGE
*/
.tab88       { width:88px; height:20px; float:left; padding:3px 0 0 0; text-align:center; background:url(img/tab88.png); font-weight:normal; cursor:pointer; }
.tab88:hover { background:url(img/tab88on.png); }
.tab88on     { background:url(img/tab88on.png); font-weight:bold }





/*
	jSuggest (jquery plugin)
*/

.jSuggestContainer {
	position:absolute;
	font: 12px Tahoma;
	border:1px solid #ffb931;
	border-top:0;
	background:#FFF;
	text-align:left;
	height:200px;
	overflow-y:auto;
	overflow-x:hidden;
	display:none
}

.jSuggestLoading {
	font-style:italic;
	padding: 10px;
}

.jSuggestContainer ul, .jSuggestContainer ul li{
	margin: 0;
	padding:0;
	list-style:none;
}

.jSuggestContainer ul li{
	padding:2px 4px;
	border-bottom: 1px dotted #ffe594;
	color:#666;
	background:#fff9e7;
	cursor:pointer
}

.jSuggestContainer ul li.last{
	border-bottom: 0;
}

.jSuggestContainer ul li.jSuggestHover{
	background:#ffeaaa;
	color:#333;
}



/* calendar fix */
.calendar {
	z-index: 11000;
}


.ui-tabs .ui-tabs-nav {
	#height: 27px;
}



/* */
.data-list {
	border: 1px solid #ccc;
	border-collapse: collapse;
}
	.data-list th {
		padding: 3px 5px;
		background-color: #ddd;
	}
	.data-list td {
		vertical-align: top;
		padding: 5px;
	}
	.data-list .even {
		background-color: #efefef;
	}
	.data-list .detail {
		text-align: right;
	}
	.data-list .flag {
		margin: 20px 7px 0 0;
	}
	.data-list div {
		text-align: center;
	}