@charset "iso-8859-1";
html {
	height: 100%;
}

/* structure */
body{
text-align: center;
font-family: Calibri;
font-size: 12px;
color: #000000;
margin:0px 0px 0px 0px;

}
#header{
position: relative;
width:100%;
height: 70px;
background: url('../images/inner_bg_header.gif') repeat-x top left;
}

#content{
	position:relative;
	width:960px;
	margin:0 auto 0 auto;	
	padding:3px 3px 3px 3px;
	
}

#content #leftcontent{
	position:absolute;
	width:550px;
	float:left;
	height:350px;
	vertical-align:top;	
	text-align:left;	
	padding: 0px 15px 0px 15px;
	
	
}

#content #leftcontent h2{
	font-family: Calibri;
	font-size: 22px;
	color: #c31818;
}

#content #rightcontent{
	position:absolute;
	width:250px;	
	float:left;		
	height:350px;
	margin-left:600px;
	border:1px solid #cccccc;
	background-image:url(../images/inner_bg_header.gif);
	background-repeat:repeat-x;
}

/* New Structure */
#mainBody{
	background: white;
	min-width: 780px;
	max-width: 1920px;
	margin: 0 auto;
	padding:0px 0px 0px 0px;	
	
	
}

#main-body-inside {
	margin: 0 10px;
	
}

#generalDialog{
	/*position:absolute;*/	
		
}
#generalDialog01{
	/*position:absolute;*/		
}
#generalDialog02{
	/*position:absolute;*/	
}

#left-content {
	float: left;
	width: 180px;
	height: 100%;
}

#adminContainer{
	
	
	margin-bottom:0px;

	
}

#adminContainer #data{		
	padding-left: 190px;
}

#adminContainer #add_edit_data{		
	padding-left: 190px;
}

#main-content {
	padding-left: 190px;
}
#main-content #add_edit_data{
	padding-left: 0px;
}


.inputwithbg{
padding:8px 8px 8px 8px;
width:180px;
font-size: 14px;
background-image:url(../images/inputbg.jpg);
border:1px solid #cccccc;
}
.loginbutton{
padding:8px 8px 8px 8px;
width:200px;
font-size: 14px;
}

#content #rightcontent h2{
font-family: Calibri;
font-size: 22px;
color: #c31818;
}

.asset_info_details{
width:100%;
}

.asset_info_details .title{
background-color:#dadada;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;	
padding:5px 5px 5px 5px ;	
}
.asset_info_details #label{
padding:3px 3px 3px 3px ;
border-bottom:1px solid #ccc;
}

.asset_info_details #uploaded_photo_thumbnails{
width:480px;
height:100px;
overflow:scroll;	
}

.asset_info_details #uploaded_file_thumbnails{
width:480px;
height:100px;
overflow:scroll;

}

.asset_info_details #data{
padding:3px 3px 3px 3px ;
border-bottom:1px solid #ccc;
}

.checktodel{
position:relative;
left:-100px;	
top:-2px;		
}

#uploaded_file_thumbnails{		
overflow-x:scroll;
height:150px;
width:610px;
}

#garduIndukFormTab{
width:98%;
height:330px;
}

#header_login{width:100%;height:15px;background-color: #cb4a22;}
#login_box{width:100%;height:300px;border: 2px solid #A8A7A7;position:absolute;top:50%;left:50%;text-align: left;}
#login_box h2{font-size: 1.8em;letter-spacing: 5px;font-weight: bold;text-align: center;margin-bottom:10px;}
#login_box_2{padding: 5px;}
#login_logo{width:294px;height:80px;background: url('../images/logo.gif') no-repeat top left;}
#login_box form p{line-height: 40px;height: 40px;}
#login_box form p label{font-size: 1.4em;float: left;text-align: right;width: 100px;}
#login_box input{margin-left: 10px;width: 200px}
#login_box input[type="submit"]{border: 1px solid #000;background: #cb4a22;padding: 1px 10px;width: 100px;cursor: pointer}
.border1px{border:1px solid #B1AFB0;}

#logo{
width:250px;
height:100px;
background: url('../images/inner_logo.gif') no-repeat top left;
float: left;
}

#main_menu{float: left; position: absolute; left: 200px; bottom: 0;display: block; height: 37px;}
#main_menu ul li.current a, #main_menu ul li.hover a, #main_menu ul li a:hover,ul.dropdown ul li:hover{ background: url('../images/bg_tab.gif') repeat-x top left}
#main_menu ul li a{font-weight: bold;font-size: 1em;color: #000;text-decoration: none;display: block;height: 36px;padding:0 20px;text-align: center;line-height: 36px;margin-right: 5px;}
ul.dropdown { position: relative; }
ul.dropdown li{list-style: none;float: left;height: 36px}
ul.dropdown li.hover, ul.dropdown li:hover  {position: relative}
ul.dropdown ul { width: 250px; visibility: hidden; position: absolute; top: 100%; left: 0;z-index: 80;
-moz-box-shadow: 3px 3px 10px #999;
-webkit-box-shadow: 3px 3px 10px #999;
box-shadow: 3px 3px 10px #999; }
ul.dropdown ul li  {float: none!important;background: #fff;border-bottom: 1px solid #eee;}
ul.dropdown ul li  a{background:none!important;text-align:left!important}
ul.dropdown ul li:last-child{border-bottom: none;}
/* IE 6 & 7 Needs Inline Block */
ul.dropdown ul li a {width: 100%; display: inline-block;line-height: 36px;}
/*End Navigation*/

#breadcrumb{height: 30px;line-height:30px;}
#breadcrumb li{float: left;color: #000;font-size:1em;font-weight: bold;}
#breadcrumb li a{float: left;color: #000;text-decoration:none;margin-right: 10px;background: url('../images/crumb.gif') no-repeat right 60%;padding-right:20px;}

.round{
/* Rounded corners in most browsers! */
-moz-border-radius: 4px; /* For Mozilla Firefox */
-khtml-border-radius: 4px; /* For Konqueror */
-webkit-border-radius: 4px; /* For Safari */
border-radius: 4px; /* For future native implementations */
}

/* #mainBody{
margin: 15px 0px 0px 20px;
position: absolute;
font-size: 13px;
width:97%;
} */


.tableForm{
border:1px solid #999999;
margin:20px 0px 20px 0px;
padding:3px 3px 3px 3px;
}

.tableFormBorderless{
margin:20px 0px 20px 0px;
padding:3px 3px 3px 3px;
}


.car_info{
position:relative;
width:250px;
height:220px;
overflow:hidden;
}

.car_info #title{
font-family:"Trebuchet MS";
font-size:18px;	
font-weight:bold;
text-align:left;
margin-bottom:10px;
}

.logViewer{	
	width:100%;
}

.logViewer .header{
	background-color:#eaeaea;
	padding:3px 3px 3px 3px;
	margin:1px 1px 1px 1px;
	font-weight:bold;		
}

.logViewer .data{
	padding:3px 3px 3px 3px;
	border-bottom:1px dashed #cccccc;	
}

.logViewer .trdata{
	background-color:#ffffff;
	cursor:pointer;	
}


.logViewer .trdata:hover{
	background-color:#fafafa;	
}



.logViewer .trdata{
	
	
}


.logupdater .title{
	font-family:"Trebuchet MS";
	font-size:22px;		
}
.logupdater .subtitle{
	font-family:"Trebuchet MS";
	font-size:14px;	
	padding-bottom:10px;
	
}

.logupdater .datetimeloc{	
	font-family:"Trebuchet MS";
	font-size:14px;
	font-weight:bold;
}

.logupdater #datetimelocdata{	
	font-family:"Trebuchet MS";
	font-size:12px;
	background-color:#eeeeee;
	padding: 0px 5px 0px 5px;
}

.logupdater textarea{
	width:100%;
	height:200px;
	border:1px solid #cccccc;
}

.logupdater input{
	width:100%;	
	height:48px;
	border:1px solid #cccccc;
	cursor:pointer;
}



.car_info #content{
font-family:"Trebuchet MS";
font-size:12px;		
overflow:hidden;
}

.car_info #content table{
	
}

.car_info #operation{
	text-align:left;
	margin-top:10px;
}

.car_info #operation a{
	padding:3px 3px 3px 3px;
	border:1px solid #cccccc;
	background-color:#eaeaea;
	text-decoration:none;
}

.car_info #operation a:hover{
	background-color:#fafafa;
}

.car_info #content #label{
font-weight:bold;		
}

.car_info #content #moreinfo a{
position:relative;
top:15px;
padding:3px 3px 3px 3px;
text-decoration:none;
border:1px solid #666;	
background-color:#CCC;
}

.car_info #content #moreinfo a:hover{
background-color:#eaeaea;
}


.statusMessageContainer{	
float:right;	
}
.statusMessageContainer td{
text-align:right;
}
.statusMessageContainer a{
font-size:9px;
}

.tableForm #label{
width:100px;
}

.tableForm td{
padding:3px 3px 3px 8px;

}

.tableForm #formTitle{
position:relative;
background-color:#eeeeee;
font-size:12px;
font-weight:bold;
top:-10px;
padding:2px 5px 2px 5px;
margin-left:5px;

}


.fileUploader{
text-align:left;
padding:3px 3px 3px 3px;	
}

.fileUploader #uploaded_photo_thumbnails{
background-color:#aaaaaa;
padding:5px 5px 5px 5px;
font-size:12px;
color:#eaeaea;	
position:relative;
top:-30px;
height:220px;	
}


.fileUploader #uploaded_file_thumbnails{
background-color:#aaaaaa;
padding:5px 5px 5px 5px;
font-size:12px;
color:#eaeaea;	
position:relative;
top:-30px;
height:220px;	
}


.fileUploader #asset_photo{
position:relative;	
float:left;
width:100px;
height:80px;
border:1px solid #333333;		
}


.fileUploader #asset_file{
position:relative;	
float:left;
width:100px;
height:80px;
border:1px solid #333333;		
}

.fileUploader #queuedivphoto{
position:relative;
top:-30px;
left:120px;
width:200px;
height:30px;			
}

.fileUploader #queuedivfile{
position:relative;
top:-30px;
left:120px;
width:200px;
height:30px;			
}


.thumbnails {	
margin:2px 2px 2px 2px;	

}

.imageframeparent{

vertical-align:top;
}

.thumbnails #imageframe{
background-color:#999999;
padding:3px 3px 3px 3px;
margin:2px 2px 2px 2px;
height:60px;		
}

.thumbnails #deletecheck{
background-color:#999999;
padding:3px 3px 3px 3px;
margin:2px 2px 2px 2px;
height:16px;

}
/* 
.lefttoolbar{	
user-select: none; 
-o-user-select: none; 
-moz-user-select: none; 
-khtml-user-select: none; 
-webkit-user-select: none; 

float:left;
position:absolute;
width:153px;		
border:solid 4px #d7d7d8;;

}

.lefttoolbar a{
text-decoration:none;
}
.lefttoolbar #toolheader{	
position:relative;
width:150px;
height: 20px;
padding:5px 0px 0px 5px; 
font-size: 14px;
font-weight: bold;
color: ffffff;
text-align: left;
border-bottom: solid 4px #d7d7d8;
background-color:#e6e7e8;

} */

.quickAccess{
width:520px;
height:160px;
border:solid;
border-color: #D7D7D8;
}

.divHeader{
height: 24px;
padding: 5px 0px 0px 20px;
font-size: 16px;
font-weight: bold;
color: black;
text-align: left;
border-bottom:solid;
border-color: #D7D7D8;
background-color: #E6E7E8; 
}

.divsearchtext{
width:150px;
height: 24px;
padding: 5px 0px 0px 1px;
font-size: 16px;
font-weight: bold;
color: black;
text-align: left;
border-bottom:solid;
border-color: #D7D7D8;
background-color: #E6E7E8; 
}

.divSubHeader{
background-color: #D2E28B;
height: 20px;
padding-top: 2px;
}

.imageHelpHeader{
margin-top:-5px;
float: right;
}

.quickAccessIcon{
width: 130px;
float:left;
padding-top:20px;
color: black;
font-weight: bold;
text-align:center;
}

.quickAccessIcon a{
text-decoration:none;

}

.kanan{
float: left;
}
.kananScroll{
overflow: auto;
height:347px;
}

.vehicleOnBase{
float: left;
width:240px;
height:300px;
border:solid;
border-color: #D7D7D8;
}

.vehicleOnField{
float: left;
width:240px;
height:290px;
border:solid;
border-color: #D7D7D8;
margin-left: 35px;
}

.vehicleContent1{
height: 20px;
font-size: 11px;
}

.vehicleContent2{
background-color: #FFF8AF;
height: 20px;
font-size: 11px;
}

.vehicleContent3{
background-color: #FFF8AF;
height: 15px;
text-align: right;
padding-right: 20px;
}

.vehicleImage{
margin-bottom: -5px;
}

/* sidebar */
.sidebar{
float: left;
width: 250px;
height: 300px;
}

.box_left_1{
width: 250px;
height: 300px;
border:1px solid #D7D7D8;
color:#000;
margin-bottom:20px
}
.box_left_3{
width: 250px;
height: 190px;
border:1px solid #D7D7D8;
color:#000;
margin-bottom:0px
}
.box_left_1 h2, .box_left h2{display:block;background:#E6E7E8;font-size: 14px;font-weight: bold;text-align:left;padding:10px}
.box_left_1 #search_form, .box_left #search_form{background:#FFF200;display:block;line-height:30px;}
.box_left_1 #search_by, .box_left #search_by{border:1px solid #d7d7d8;font-size:11px;padding:3px}
.box_left_1 #search_value, .box_left #search_value{border:1px solid #d7d7d8;font-size:11px;width:70px;padding:3px}
.box_left_1 #search_submit, .box_left #search_submit{background:#E6E7E8;border:1px solid #d7d7d8;font-size:11px;padding:2px 3px}
.box_left_1 #search_reset, .box_left #search_reset{background:#cb4a22;border:1px solid #d7d7d8;font-size:11px;padding:2px 3px}
.box_left_1 #search_submit:hover, .box_left #search_submit:hover{border:1px solid #ccc;cursor:pointer}
.box_left_1 #search_reset:hover, .box_left #search_reset:hover{border:1px solid #ccc;cursor:pointer}
.box_left_1 .thead td, .thead td{line-height:20px;text-align:center}
.box_left_1 tr.odd td, tr.odd td{line-height:20px;}
.box_left_1 tr.even td, tr.even td{line-height:20px;background:#FFF9AE}
.box_left_1 a, .box_left a{color:#c30}

.select_date{text-align:left;height: auto !important;}
.select_date p{padding:10px;line-height: 20px}
.select_date input[type="text"]{width: 180px}

.center{text-align:center !important;}
.left{text-align:left !important;}
.right{text-align:right !important;}

.border_grey{border:1px solid #d7d7d8;}
.pad3{padding:3px}


#main_content{float: left;margin-left:10px;background:#fff}
#map_canvas_2{height:600px;float: left;}

#map_canvas {
	height: 100%;
	width: 100%;
	background-color: #ccc;

}

#tab {
height: 487px;
margin: 0px 0px 0px 190px;
}

.box_left_2{
width: 250px;
height: 155px;
border:1px solid #D7D7D8;
color:#000;
margin-bottom:20px
}
.box_left_2 h2{display:block;background:#E6E7E8;font-size: 14px;font-weight: bold;text-align:left;padding:10px}
.box_left_2 #search_form{background:#FFF200;display:block;line-height:30px;}
.box_left_2 #search_by{border:1px solid #d7d7d8;font-size:11px;padding:3px}
.box_left_2 #search_value{border:1px solid #d7d7d8;font-size:10px;width:70px;padding:3px}
.box_left_2 #search_submit{background:#E6E7E8;border:1px solid #d7d7d8;font-size:11px;padding:2px 3px}
.box_left_2 #search_reset{background:#cb4a22;border:1px solid #d7d7d8;font-size:11px;padding:2px 3px}
.box_left_2 #search_submit:hover{border:1px solid #ccc;cursor:pointer}
.box_left_2 #search_reset:hover{border:1px solid #ccc;cursor:pointer}
.box_left_2 .thead td{line-height:20px;text-align:center}
.box_left_2 tr.odd td{line-height:20px;}
.box_left_2 tr.even td{line-height:20px;background:#FFF9AE}
.box_left_2 a{color:#c30}

.select_date{text-align:left;height: auto !important;}
.select_date p{padding:10px;line-height: 20px}
.select_date input[type="text"]{width: 180px}

/* report details */
#report_details{
width: 530px;
height:480px;
float: left;
margin-right:10px
}

.report_details{
text-align: left;
}
.report_details h2{font-size:20px;color:#000;font-weight:bold;margin-bottom:5px}
.report_details .head_1{background:#E7E8E9;border:1px solid #D7D7D8;padding:10px}
.report_details .head_2{}

/* table 1px border */
table.border, table.border td, table.border th
{
border-color: #b4b4b4;
border-style: solid;
}

table.border
{
border-width: 0 0 1px 1px;
border-spacing: 0;
border-collapse: collapse;
}

table.border td, table.border th
{
margin: 0;
padding: 4px;
border-width: 1px 1px 0 0;
}


.center{text-align:center !important;}
.left{text-align:left !important;}
.right{text-align:right !important;}

.border_grey{border:1px solid #d7d7d8;}
.pad_3{padding:3px}
.pad_7{padding:7px}


/* Left Sidebar */
#lefttoolbar, .lefttoolbar{	
	user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; 
	float:left;
	position:absolute;
	width:180px;		
	height:400px;
	text-align:left;
}
#lefttoolbar h3, .lefttoolbar h3 {
	font-size: 11px;
	font-weight: bold;
	line-height: 30px;
}
#lefttoolbar img, .lefttoolbar img{
	padding-right:5px;
}
#toolcontainer, .toolcontainer {
	height:450;
}
#toolcontainer a, .toolcontainer a{
	position:relative;
	left:-20px;
	display:block;
	text-decoration:none;
	width:167px;
	margin:0 0 5px 0;
	border-bottom:1px dashed #d2cfc0;
	border-right:2px solid #d2cfc0;
	font-size:10px;
}
#toolcontainer a .functiontitle, .toolcontainer a .functiontitle{
	position:relative;
	display:inline-block;	
	font-weight:bold;	
}
#toolcontainer a .functiondesc, .toolcontainer a .functiondesc{
	margin: 0px 5px 5px 25px;	
	font-size:9px;
}
#toolcontainer a:hover, .toolcontainer a:hover{
	border-right:2px solid #F60;
}
#toolcontainer a:active, .toolcontainer a:active{
	background-color:#d2cfc0;
}

.customerList {
	margin-left: -20px;
	width:165px;
	height: 410px;
	overflow: auto;
}

.cust_list {
	margin: 0 0 10px;
}

.cust_list_name {
	font-size: 11px;
}

.cust_list_action {
	
}

.cust_list_action a {
	left: 0;
	display: inline;
	border: none !important;
	text-decoration: underline;
	color: #c30;
}

.cust_list_action a :hover{
	border-right: none !important;
}

#cust_search {
	border: 1px solid #e2e4e5;
	padding: 8px 2px;
	margin: 0;
	position:absolute;
	bottom: 10;
	left:10;
	width: 160px;
}


.systemStatus{
	height:50px;
}

.clear {
	clear: both;
}



.vehicleList {
	top:50;
	position:absolute;
	margin-left: -20px;
	width:165px;
	height: 410px;
	overflow: auto;
}

.veh_list {
	margin: 0 0 10px;
}

.veh_list_name {
	font-size: 11px;
}

.veh_list_action {
	
}

.veh_list_action a {
	left: 0;
	display: inline;
	border: none !important;
	text-decoration: underline;
	color: #c30;
		font-size: 12px;
		font-weight:bold;
}

.veh_list_action a :hover{
	border-right: none !important;
}
.group_action {
	
}

.group_action a {
	left: 0;
	display: inline;
	border: none !important;
	text-decoration: underline;
	color:#808080;
	font-size: 12px;
	;
}
.group_action a :hover{
	border-right: none !important;
}

#veh_search {
	border: 1px solid #e2e4e5;
	padding: 8px 2px;
	margin: 0;
	position:absolute;
	top: 10;
	left:10;
	width: 160px;
}

.display-none {
	display: none;
}

.bold {font-weight: bold}

.myform p {
	padding: 5px 0;
}

.myform label {
	float: left;
	width: 150px;
}

.ui-state-error {
	padding: 10px;
}

#pickup h2, #destination h2, #taxi-appointment h2, #completed-dispatching h2{
	padding: 5px 0;
	margin: 0 0 10px;
	font-weight: bold;
	font-size: 16px;	
	border-bottom: 1px solid #bbb;
}

.pane p{
	margin-bottom: 5px;
}

#completed-dispatching {
	text-align: left;
}

#completed-dispatching p {
	margin-bottom: 10px;
}

#completed-dispatching label{
	float: left;
	width: 150px;
}

.ui-autocomplete {
	width: 25em;
	text-align: left;
}

.ui-autocomplete .ui-menu-item {
	padding: 3px;
	width: 100%;
	cursor: pointer;
}