@charset "utf-8";
/* CSS Document */
*{	/*font-size:11.5px;*/
	font-family:Arial, Helvetica, sans-serif;
	/*background-color:#FFFFFF;*/
}
body{	
	width:100%;
	margin:auto;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
	background-color:#F9F9F9;
	/*line-height:1.5em;*/
}

#divPage{
	margin:auto;
	position:static;
	width:100%;
	background-color:#F9F9F9;
}

.tblPage{	
	width:100%;
	border-spacing:0;
}

a{
	/*color:#0171a1;*/
	cursor:pointer;
	cursor:hand;
	text-decoration:none;
}

select:disabled{
	background-color:#E9EBEB;
}

input[disabled]{
	color:#868686;
}

.selBox{
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
	/*padding: 5px 5px 5px 5px;*/
	height:26px;
}

.selBox option{
	 padding:5px 5px 5px 5px;
}
.submitBttn{
	border-radius: 5px;
	font-family:verdana;
	font-size:11.5px;
    /*background-color:#006;
    color: #FFF;*/
	background-image: linear-gradient(180deg, #999, #2e353d);
    color: #e1ffff;
	font-weight:bold;
    padding: 8px 25px;
    margin: 5px 0;
    border: none;
    cursor: pointer;
	box-shadow: 2px 2px 3px #333;
}

.classForm{
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
	padding: 3px 3px 3px 3px;
}

textarea {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;	
	padding: 3px 3px 3px 3px;
}

.tblIcon{
	width:100%;
}

.tblIcon td{
	padding:3px 3px 3px 3px;
}

.pageTitle{
	font-family:Arial, Helvetica, sans-serif;
	font-size:18px;
	font-weight:bold;
}

.hrLine{
	border-top:#003 solid 2px;
	width:98%;
	/*float:right;*/
}

/*Login Page*/
#divLogin{	
	padding : 1.5em 1em;
	width: 310px;
	height: 410px;
	background: url('../img/login-bg.JPG') no-repeat top center;
    background-attachment: contain;
	background-size: 430px 450px;
	box-shadow: 5px 5px 5px #999999;
	/*border: 2px dotted #F00;
	position: absolute;
    top: 55%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -55%);
	border-radius: 10px;*/
}

.tblLoginForm{
	/*width:100%;*/
	width: 310px;
	height: 410px;
	border-radius: 10px;
	background-color: rgba(255, 255, 255, 0.7);
	/*position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);	*/
}

.tblLoginForm td{
	height:50px;
	/*padding:5px 25px 5px 25px;
	padding-bottom:5px;
	padding-top:5px;*/

}

.loginInput{
    width: 100%;
    padding: 10px 15px;
    margin: 5px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-sizing: border-box;
	font-size:13px;
	box-shadow: 3px 3px 5px #333;
}

/*.loginInput2{
    width: 40%;
    padding: 10px 15px;
    margin: 5px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-sizing: border-box;
	font-size:13px;
	box-shadow: 3px 3px 5px #333;
}*/

.loginBttn {
	border-radius: 5px;
	font-size:13px;
    background-color:#006;
    color: #FFF;
	font-weight:bold;
    padding: 10px 15px;
    margin: 5px 0;
    border: none;
    cursor: pointer;
    width: 50%;
	box-shadow: 3px 3px 5px #333;
	/*border: 3px solid #006;*/
}

#divLeftSide{
	/*border:1px solid #F00;
	background-color:#333;*/
	position:static;
	height:100%;
	float: left;
	width:16%;
}

#divRightSide{
	/*border:1px solid #F00;*/
	position:static;
	height:100%;
	float: right;
	width:84%;
}

#divDashCenter{
	/*border:1px solid #000;*/
	left:220px;
	position:absolute;
	height:410px;
	width:61%;
}

#divDashRight{	
	border-left:1px solid #CCC;
	position:static;
	height:410px;
	float: right;
	width:27.5%;
}

#my-iframe{
    position:static;
    width: 100%;
    height: 500px;
	/*border:#ccc solid 1px;*/
}

#my-iframe2{
    position:static;
    width: 100%;
    /*height: 500px;
	border:#ccc solid 1px;*/
}

/*Dashboard main*/
.tblMain{
	width:100%;
	border-spacing:0;
}

#frameDashNew{
    position:static;
    width: 100%;
    height: 350px;
	/*border:#ccc solid 1px;*/
}

#frameDashNew5{
    position:static;
    width: 100%;
    height: 265px;
	/*border:#ccc solid 1px;*/
}

#frameEvent{
    position:static;
    width: 100%;
    height: auto;
	/*border:#ccc solid 1px;*/
}

#frameFeed{
    position:static;
    width: 100%;
    height: 435px;	
	/*border:#ccc solid 1px;*/
}

.dashSttsNew{
	width:100%;
	/*border:1px #000066 solid;*/
}

.dashSttsNew td{
	padding: 5px 5px 5px 5px;
}

.dashInOut{
	width:100%;
	border:1px #000066 solid;
}

.dashInOut td{
	padding: 2px 2px 2px 2px;
	line-height:16px;
}

#divCountNew{
	border:#999 solid 1px;
	width:450px;
	/*width:230px;*/
	padding: 5px 5px 5px 5px;
	box-shadow: 3px 3px 3px #999999;
	border-radius:5px;
}

#divCountNew2{
	border:#999 solid 1px;
	width:210px;
	/*width:230px;*/	
	padding: 5px 5px 5px 5px;	
	box-shadow: 3px 3px 3px #999999;
	border-radius:5px;
}

.countNumNew1{
	color:#F00;
	font-weight:bold;
	font-size:35px;
}

.countNumNew2{
	color:#F00;
	font-weight:bold;
	font-size:24px;
}

.countNum{
	color:#F00;
	font-weight:bold;
	font-size:18px;
}

.countLbl{
	font-weight:bold;
	font-size:15px;
}

.dashSttsNew1{
	width:100%;
	/*border:1px #000066 solid;*/
}

.dashSttsNew1 td{
	padding: 2px 5px 2px 5px;
}

#divCountAlert{
	border:#999 solid 1px;
	width:227px;
	padding: 3px 3px 3px 3px;
	box-shadow: 3px 3px 3px #999999;
	border-radius:5px;
}

/*vehicle reservation*/
#fieldsetReservation{
	width:600px;
    border:2px solid #2E353D;
    border-radius:5px;
    padding:5px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
}

#legendReservation{
    background:#ddd;
	width:250px;
    color:#23282e;
	font-weight:bold;
    padding:5px 30px 5px 10px;
    border-radius:3px;
    box-shadow:0 0 0 2px #2E353D;
    margin-left: 20px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
}

.circle {
  height: 13px;
  width: 13px;
  background-color: #F0F0F0;
  border:#000 1px solid;
  border-radius: 50%;
}

.tblNewReservation{
	width:100%;
}

.tblNewReservation td{
	padding:5px 5px 5px 5px;
}

/*ComplaintInfo*/
#fieldsetInfo{
	width:600px;
    border:2px solid #2E353D;
    border-radius:5px;
    padding:5px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
}

#legendInfo{
    background:#ddd;
	width:250px;
    color:#23282e;
	font-weight:bold;
    padding:5px 30px 5px 10px;
    border-radius:3px;
    box-shadow:0 0 0 2px #2E353D;
    margin-left: 20px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
}

.tblNewInfo{
	width:100%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
}

.tblNewInfo td{
	padding:5px 5px 5px 5px;
}

/*reservStts*/
#fieldsetReservStts{
	width:580px;
    border:2px solid #2e353d;
    border-radius:5px;
    padding:5px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
}

#legendReservStts{
    background:#ddd;
	width:250px;
    color:#23282e;
	font-weight:bold;
    padding:5px 30px 5px 10px;
    border-radius:3px;
    box-shadow:0 0 0 2px #2E353D;
    margin-left: 20px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
}

.tblReservStts{
	width:560px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
}

.tblReservStts td{
	height:20px;
	/*padding-bottom:5px;
	padding-top:5px;*/
	padding:3px 3px 3px 3px;
}

.tblReservInfo{
	width:99%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
	border:1px #000066 solid;	

	box-shadow: 5px 5px 5px #999999;
}

.tblReservInfo th{
	height:20px;
	padding:3px 3px 3px 3px;
	background-color:#CCC;
}

.tblReservInfo td{
	height:18px;
	padding:3px 3px 3px 3px;
}

/*vehicle info*/
.tblVehicleInfo{
	width:100%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
	border:1px #000066 solid;	

	box-shadow: 5px 5px 5px #999999;
}

.tblVehicleInfo th{
	text-align:center;
	height:20px;
	padding:3px 3px 3px 3px;
	background-color:#CCC;
}

.tblVehicleInfo td{
	height:18px;
	padding:3px 3px 3px 3px;
}

/*vehicle complaint*/
.tblVehicleComplaint{
	width:100%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
	border:1px #000066 solid;	

	box-shadow: 5px 5px 5px #999999;
}

.tblVehicleComplaint th{
	height:20px;
	padding:3px 3px 3px 3px;
	background-color:#CCC;
}

.tblVehicleComplaint td{
	height:18px;
	padding:3px 3px 3px 3px;
}

/*FleetCar*/
#fieldsetFleetCar{
	width:600px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
    border:2px solid #2e353d;
    border-radius:5px;
    padding:5px;
}
#fieldsetFleetCarImg{
	width:300px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
    border:2px solid #2e353d;
    border-radius:5px;
    padding:5px;
}

#legendFleetCar{
    background:#ddd;
    color:#23282e;
	width: 250px;
	font-weight:bold;
    padding:5px 30px 5px 10px;
    border-radius:3px;
    box-shadow:0 0 0 2px #2E353D;
    margin-left: 20px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
}

.circle2 {
  height: 13px;
  width: 13px;
  background-color: #F0F0F0;
  border:#000 1px solid;
  border-radius: 50%;
  cursor:pointer;
}

.tblNewFleetCar{
	width:100%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
}

.tblNewFleetCar td{
	padding:5px 5px 5px 5px;
}

.tblFleetInfo{
	width:100%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
	border:1px #000066 solid;
	box-shadow: 5px 5px 5px #999999;
	background-color:#FFF;
}

.tblFleetInfo th{
	height:20px;
	text-align: center;
	padding:3px 3px 3px 3px;
	background-color:#CCC;
}

.tblFleetInfo td{
	height:18px;
	padding:3px 3px 3px 3px;
}

/*inspection form*/

/*vehicle check*/
#fieldsetChecking{
	width:800px;
    border:2px solid #1F497D;
    border-radius:5px;
    padding:5px;
	font-size:11.5px;
}

#legendChecking{
	font-size:11.5px;
	width:250px;
    background:#ddd;
    color:#1F497D;
	font-weight:bold;
    padding:5px 30px 5px 10px;
    border-radius:3px;
    box-shadow:0 0 0 2px #2E353D;
    margin-left: 20px;
}

.tblNewChecking{
	width:100%;
}

.tblNewChecking th{
	padding:5px 5px 5px 5px;
	background-color:#CCC;
}

.tblNewChecking td{
	padding:5px 5px 5px 5px;
}

.tblCheckVehicle{
	width:100%;
	border:1px #000066 solid;	
	box-shadow: 5px 5px 5px #999999;
}

.tblCheckVehicle th{
	padding:5px 5px 5px 5px;
	background-color:#CCC;
}

.tblCheckVehicle td{
	padding:5px 5px 5px 5px;
}

.tblNewCheck2{
	width:100%;
	border:2px #000066 solid;	
	/*box-shadow: 5px 5px 5px #999999;*/

}

.tblNewCheck2 th{
	padding:5px 5px 5px 5px;
	background-color:#ddd;
}

.tblNewCheck2 td{
	padding:5px 5px 5px 5px;
}

/*filter analysis*/
#fieldsetAnalysis{
	width:380px;
    border:2px solid #2E353D;
    border-radius:5px;
    padding:5px;
	font-size:11.5px;
}

#legendAnalysis{
    background:#ddd;
	width:250px;
	font-size:11.5px;
    color:#23282E;
	font-weight:bold;
    padding:5px 30px 5px 10px;
    border-radius:3px;
    box-shadow:0 0 0 2px #2E353D;
    margin-left: 20px;
}

.tblAnalysis{
	width:360px;
	font-size:11.5px;
}

.tblAnalysis td{
	height:20px;
	padding-bottom:5px;
	padding-top:5px;
	/*padding:5px 5px 5px 5px;*/
}

#fieldsetAnalysis_2{
	width:480px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
    border:2px solid #2E353D;
    border-radius:5px;
    padding:5px;
}

#legendAnalysis_2{
    background:#ddd;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
	width:250px;
    color:#23282E;
	font-weight:bold;
    padding:5px 30px 5px 10px;
    border-radius:3px;
    box-shadow:0 0 0 2px #2E353D;
    margin-left: 20px;
}

.tblAnalysis_2{
	width:460px;
}

.tblAnalysis_2 td{
	height:20px;
	padding-bottom:5px;
	padding-top:5px;
	/*padding:5px 5px 5px 5px;*/
}

/*inOut staff*/
#fieldsetFind{
	width:450px;
    border:2px solid #2E353D;
    border-radius:5px;
    padding:5px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
}

#legendFind{
    background:#ddd;
	width:250px;
    color:#1F497D;
	font-weight:bold;
    padding:5px 30px 5px 10px;
    border-radius:3px;
    box-shadow:0 0 0 2px #2E353D;
    margin-left: 20px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
}

.tblFind{
	width:430px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
}

.tblFind td{
	/*height:20px;
	padding-bottom:5px;
	padding-top:5px;*/
	padding:3px 3px 3px 3px;
}

.tblInOut{
	width:99%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11.5px;
	border:2px #000066 solid;
	box-shadow: 5px 5px 5px #999999;
}

.tblInOut th{
	text-align:center;
	height:20px;
	padding:3px 3px 3px 3px;
	background-color:#CCC;
}

.tblInOut td{
	/*font-size:11px;*/
	line-height:15px;
	/*height:18px;*/
	padding:3px 3px 3px 3px;
}

/*reqForm*/
#fieldsetReqForm{
	width:560px;
    border:2px solid #1F497D;
    border-radius:5px;
    padding:5px;
	font-size:11.5px;
}

#legendReqForm{
    background:#ddd;
	width:250px;
    color:#1F497D;
	font-weight:bold;
    padding:5px 30px 5px 10px;
    border-radius:3px;
    box-shadow:0 0 0 2px #2E353D;
    margin-left: 20px;
	font-size:11.5px;
}

.tblReqForm{
	width:100%;
	font-size:11.5px;
}

.tblReqForm td{
	padding:5px 5px 5px 5px;
}

/*touchngo*/
.tblTNG{
	width:70%;
	border:2px #000066 solid;
	box-shadow: 5px 5px 5px #999999;
	font-size:11.5px;
}

.tblTNG th{
	text-align: center;
	height:30px;
	padding:3px 3px 3px 3px;
	background-color:#CCC;
}

.tblTNG td{
	height:18px;
	padding:3px 3px 3px 3px;
}

/*petrol record*/
.tblPetrolRecord{
	width:100%;
	border:1px #000066 solid;
	box-shadow: 5px 5px 5px #999999;
	font-size:11.5px;
}

.tblPetrolRecord th{
	/*height:20px;*/
	padding:3px 3px 3px 3px;
	background-color:#CCC;
}

.tblPetrolRecord td{
	/*height:18px;*/
	padding:3px 3px 3px 3px;
}

/*staffList*/
.tblStaff{
	width:100%;
	font-size:11.5px;
	border:1px #000066 solid;	

	box-shadow: 5px 5px 5px #999999;
}

.tblStaff th{
	text-align:center;
	height:20px;
	padding:3px 3px 3px 3px;
	background-color:#CCC;
}

.tblStaff td{
	padding:3px 3px 3px 3px;
}



/*newstaff*/
#fieldsetNewStaff {
	width:500px;
    border:2px solid #2E353D;
    border-radius:5px;
    padding:5px;
	font-size:11.5px;
}

#legendNewStaff{
    background:#ddd;
	width:250px;
    color:#23282E;
	font-weight:bold;
    padding:5px 30px 5px 10px;
    border-radius:3px;
    box-shadow:0 0 0 2px #2E353D;
    margin-left: 20px;
	font-size:11.5px;
}

.tblNewStaff{
	width:100%;
	font-size:11.5px;
}

.tblNewStaff td{
	padding:5px 5px 5px 5px;
}

/*block*/
#fieldsetBlockMain {
	width:550px;
    border:2px solid #2E353D;
    border-radius:5px;
    padding:5px;
}

#fieldsetBlock {
	width:500px;
    border:2px solid #2E353D;
    border-radius:5px;
    padding:5px;
}

#legendBlock{
    background:#ddd;
	width:250px;
    color:#23282E;
	font-weight:bold;
    padding:5px 30px 5px 10px;
    border-radius:3px;
    box-shadow:0 0 0 2px #2E353D;
    margin-left: 20px;
	font-size:11.5px;
}

.tblBlock{
	width:95%;
	border:1px #000066 solid;	
	box-shadow: 5px 5px 5px #999999;
}

.tblBlock th{
	text-align:center;
	height:20px;
	padding:3px 3px 3px 3px;
	background-color:#CCC;
}

.tblBlock td{
	padding:3px 3px 3px 3px;
}

.tblBlockBttn{
	width:500px;
}

/*newVehicle*/
#fieldsetNewVehicle{
	width:550px;
    border:2px solid #2e353d;
    border-radius:5px;
    padding:5px;
	font-size:11.5px;
}

#legendNewVehicle{
    background:#ddd;
	width:250px;
    color:#23282e;
	font-weight:bold;
    padding:5px 30px 5px 10px;
    border-radius:3px;
    box-shadow:0 0 0 2px #2E353D;
    margin-left: 20px;
	font-size:11.5px;
}

.tblNewVehicle{
	width:100%;
	font-size:11.5px;
}

.tblNewVehicle td{
	padding:5px 5px 5px 5px;
}

/*updateVehicle*/
#fieldsetUpdateVehicle{
	width:580px;
    border:2px solid #2E353D;
    border-radius:5px;
    padding:5px;
	font-size:11.5px;
}

#legendUpdateVehicle{
    background:#ddd;
	width:250px;
    color:#23282E;
	font-weight:bold;
    padding:5px 30px 5px 10px;
    border-radius:3px;
    box-shadow:0 0 0 2px #2E353D;
    margin-left: 20px;
	font-size:11.5px;
}

.tblUpdateVehicle{
	width:100%;
	font-size:11.5px;
}

.tblUpdateVehicle td{
	padding:5px 5px 5px 5px;
}

/*smartpay usage form*/

#fieldsetSmartpay{
	width:99%;
    border:2px solid #2E353D;
    border-radius:5px;
    padding:5px;
}

#legendSmartpay{
    background:#ddd;
	width:250px;
    color:#23282E;
	font-weight:bold;
    padding:5px 30px 5px 10px;
    border-radius:3px;
    box-shadow:0 0 0 2px #2E353D;
    margin-left: 20px;
	font-size:11.5px;
}

.tblSmartpay{
	width:100%;
}

.tblSmartpay td{
	padding:5px 5px 5px 5px;
}

.tblSmartpayList{
	width:100%;
	border:1px #000066 solid;
}

.tblSmartpayList th{
	padding:3px 3px 3px 3px;
	background-color:#999;
}

.tblSmartpayList td{
	padding:3px 3px 3px 3px;
}

.tblList{
	width:100%;
	/*border:1px #000066 solid;*/
}

.tblList td{
	padding:3px 3px 3px 3px;
}

/*user-datails*/
#fieldsetDetails{
	width:440px;
    border:2px solid #2E353D;
    border-radius:5px;
    padding:5px;
	font-size:11.5px;
}

#legendDetails{
    background:#ddd;
	width:250px;
    color:#23282E;
	font-weight:bold;
    padding:5px 30px 5px 10px;
    border-radius:3px;
    box-shadow:0 0 0 2px #2E353D;
    margin-left: 20px;
	font-size:11.5px;
}

.tblDetails{
	width:440px;
}

.tblDetails td{
	height:20px;
	/*padding-bottom:5px;
	padding-top:5px;*/
	padding:5px 5px 5px 5px;
	font-size:11.5px;
}

/*new-password*/
#fieldsetPass{
	width:500px;
    border:2px solid #2E353D;
    border-radius:5px;
    padding:5px;
	font-size:11.5px;
}

#legendPass{
    background:#ddd;
    color:#23282E;
	font-weight:bold;
    padding:5px 30px 5px 10px;
    border-radius:3px;
    box-shadow:0 0 0 2px #2E353D;
    margin-left: 20px;
	font-size:11.5px;
	width:250px;
}

.tblPassword{
	width:500px;
	font-size:11.5px;
}

.tblPassword td{
	height:20px;
	/*padding-bottom:5px;
	padding-top:5px;*/
	padding:5px 5px 5px 5px;
}

.wrap{
	width:98%;
	height: 287px;
	overflow: auto;
	padding:5px 5px 5px 5px;
}