table.t1 {text-align:left; vertical-align:middle; border-collapse: collapse; width:100%;} 
table.t1 td { padding: 0.3em 0.3em 0.3em 0.3em; font-size: .8em; font-family:Arial, Helvetica, sans-serif; white-space: nowrap; height:2em;} 



table.t1 th{padding: 0.2em 0.3em 0.2em 0.3em; font-size:1em;color:#ffffff;text-align:center; font-family:Arial, Helvetica, sans-serif;background-color: #c0c0c0; border: 0.2em solid #666; height:2em; white-space:nowrap;}

.border {border-right: 0.2em solid #666;
border-left: 0.2em solid #666;}
.border1 {border-right: 0.4em solid #666;
border-left: 0.4em solid #666;}



table.t1 tr.r1 td { background-color: #e0e0e0;padding: 0.5em 0.3em 0.5em 0.3em; font-size: 1em; font-family:Arial, Helvetica, sans-serif; white-space: nowrap;height:2em; } 



table.t1 tr.r0 td { background-color: #ffffff;padding: 0.5em 0.3em 0.5em 0.3em; font-size: 1em; font-family:Arial, Helvetica, sans-serif; white-space: nowrap;height:2em; } 



table.t1 tr.r1 td.ready { background-color: #ff0000;padding: 0.2em 0.2em 0.2em 0.2em; font-size: 1em; font-family:Arial, Helvetica, sans-serif; white-space: nowrap;height:2em;} 



table.t1 tr.r0 td.ready { background-color: #ff0000;padding: 0.2em 0.2em 0.2em 0.2em; font-size: 1em; font-family:Arial, Helvetica, sans-serif; white-space: nowrap;height:2em; }



table.t1 tr.r1 td.in { background-color: #66cc00; padding: 0.2em 0.2em 0.2em 0.2em; font-size: 1em; font-family:Arial, Helvetica, sans-serif; white-space: nowrap;height:2em;} 



table.t1 tr.r0 td.in { background-color: #66cc00;padding: 0.2em 0em 0.2em 0.2em; font-size: 1em; font-family:Arial, Helvetica, sans-serif; white-space: nowrap;height:2em; }



table.t1 tr.r1 td.booking, table.t1 tr.r1 td.empty, table.t1 tr.r1 td.dispatched, table.t1 tr.r1 td.on, table.t1 tr.r1 td.loaded { background-color: #ffcc00; padding: 0.2em 0.2em 0.2em 0.2em; font-size: 1em; font-family:Arial, Helvetica, sans-serif; white-space: nowrap;height:2em;} 



table.t1 tr.r0 td.booking, table.t1 tr.r0 td.empty, table.t1 tr.r0 td.dispatched, table.t1 tr.r0 td.on, table.t1 tr.r0 td.loaded { background-color: #ffcc00; padding: 0.2em 0.2em 0.2em 0.2em; font-size: 1em; font-family:Arial, Helvetica, sans-serif; white-space: nowrap;height:2em;}











table.t2 {width:80%;margin-left:auto; margin-right:auto;text-align:left;vertical-align:middle } 



table.t2 td { padding: 0.2em 0 0.2em 2em;FONT-SIZE: 12px; font-family:Arial, Helvetica, sans-serif; vertical-align:middle} 



table.t2 th{ width:50%; padding: 0.2em 0 0.2em 1em; font-size:12px;color:#ffffff;text-align:left; font-family:Arial, Helvetica, sans-serif;background-color: #666; }







table.t2 tr.r1 td { background-color: #f1f1f1; vertical-align:middle} 



table.t2 tr.r0 td { background-color: #ffffff; vertical-align:middle} 



table.t2 tr.r1 td.ready { background-color: #ff0000; vertical-align:middle} 



table.t2 tr.r0 td.ready { background-color: #ff0000; vertical-align:middle}



table.t2 tr.r1 td.in { background-color: #66cc00; vertical-align:middle} 



table.t2 tr.r0 td.in { background-color: #66cc00;vertical-align:middle }



table.t2 tr.r1 td.booking, table.t2 tr.r1 td.empty, table.t2 tr.r1 td.dispatched, table.t2 tr.r1 td.on, table.t2 tr.r1 td.loaded { background-color: #ffcc00;vertical-align:middle } 



table.t2 tr.r0 td.booking, table.t2 tr.r0 td.empty, table.t2 tr.r0 td.dispatched, table.t2 tr.r0 td.on, table.t2 tr.r0 td.loaded { background-color: #ffcc00; vertical-align:middle}







table.t3 {width:80%;margin-left:auto; margin-right:auto;text-align:left;vertical-align:middle } 



table.t3 td { padding: 0.2em 1ex 0.2em 2ex;FONT-SIZE: 12px; font-family:Arial, Helvetica, sans-serif; vertical-align:middle} 



table.t3 th{ width:30%; padding: 4px 5px 4px 40px; font-size: 12px;color:#ffffff;text-align:left; font-family:Arial, Helvetica, sans-serif;background-color: #c0c0c0; }







table.t4 {margin-left:auto; margin-right:auto;text-align:left;vertical-align:middle; } 



table.t4 td { padding: 3px 0 3px 10px;FONT-SIZE: 12px; font-family:Arial, Helvetica, sans-serif; vertical-align:middle; text-align:left; color:#fff;} 



table.t4 th{ padding: 3px 5px 3px 10px; font-size: 12px;color:#ffffff;text-align:left; font-family:Arial, Helvetica, sans-serif;background-color: #c0c0c0; }





table.t5 {margin-left:auto; margin-right:auto;text-align:center;vertical-align:middle } 



table.t5 td { padding: 0.2em 1ex 0.2em 2ex;FONT-SIZE: 12px; font-family:Arial, Helvetica, sans-serif; vertical-align:middle; text-align:left} 



table.t5 th{ padding: 4px 5px 4px 40px; font-size: 18px;color:#ffffff;text-align:right; font-family:Arial, Helvetica, sans-serif;background-color: #C60; }

table.t6 {color:#ccc;

	font-size: 12px;

	padding:0 0.2em 0 5px;

	font-weight:normal;

	font-family:Arial, Helvetica, sans-serif;

}



table.t6 td{text-align:right; padding:0 0 0 0.5em;	font-family:Arial, Helvetica, sans-serif;font-size: 12px; 

 }



table.t6 th {text-align:left;

font-size: 12px; padding:0;

font-weight:normal;	font-family:Arial, Helvetica, sans-serif;

}

table.t7 {color:#ccc;

	font-size: 14px;

	padding:0 0 0 5px;

	font-weight:normal;

	font-family:Arial, Helvetica, sans-serif;

}



table.t7 td{text-align: left; padding:0 0 0 20px;	font-family:Arial, Helvetica, sans-serif;font-size: 14px; 

 }



table.t7 th {text-align:left;

font-size: 14px; padding:0;

font-weight:normal;	font-family:Arial, Helvetica, sans-serif;

}






h1{







	font-family:Arial, Helvetica, sans-serif; font-size:26px;



color:1389dc;



}



h2{



	font-family:Arial, Helvetica, sans-serif; font-size:14px;

color:#fff;

}


p	{



	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
color:#CCC;
	}
	
h55	{

	font-family:Arial, Helvetica, sans-serif;

	font-size:12px;

color:#CCC;



	}



h77	{

	font-family:Arial, Helvetica, sans-serif;

	font-size:20px;

color:#CCC;

 font-weight:bold;

	}



h88	{







	font-family:Arial, Helvetica, sans-serif;

	font-size:14px;

color:#CCC;

	}



body { margin-top: 0.0em;  text-align: center; height: 100%;

overflow:hidden;

font-size: 62.5%;



}







* {



  margin: 0;



}



html {



  height: 100%;



}



.page-wrap {



  min-height: 88%;



  /* equal to footer height */



  margin-bottom: 0px; 

overflow:hidden;
clear:both;
}



.page-wrap:after {



  content: "";



  display: block;



}



.site-footer{
  height: 5%; 
clear:both;
}



.site-footer { 
background-image:url(../images/background1.jpg);
 // text-align:right;
}

.site-footer p{
padding: .8em 1em 0 0.4em;
}



.button-detail {
  background: #d2d3d4;
  background-image: -webkit-linear-gradient(top, #d2d3d4, #aeb7bd);
  background-image: -moz-linear-gradient(top, #d2d3d4, #aeb7bd);
  background-image: -ms-linear-gradient(top, #d2d3d4, #aeb7bd);
  background-image: -o-linear-gradient(top, #d2d3d4, #aeb7bd);
  background-image: linear-gradient(to bottom, #d2d3d4, #aeb7bd);
  -webkit-border-radius: 5;
  -moz-border-radius: 5;
  border-radius: 5px;
  font-family: Arial;
  color: #000;
  font-size: 12px;
  padding: 0.1em 0.2em 0.2em 0.2em;
  text-decoration: none;
  margin-top: 0em;
}

.button-detail:hover {
  background: #787e82;
  background-image: -webkit-linear-gradient(top, #787e82, #55595c);
  background-image: -moz-linear-gradient(top, #787e82, #55595c);
  background-image: -ms-linear-gradient(top, #787e82, #55595c);
  background-image: -o-linear-gradient(top, #787e82, #55595c);
  background-image: linear-gradient(to bottom, #787e82, #55595c);
  text-decoration: none;
  color: #fff;
}
.button-detail1 {
  background: #d2d3d4;
  background-image: -webkit-linear-gradient(top, #d2d3d4, #aeb7bd);
  background-image: -moz-linear-gradient(top, #d2d3d4, #aeb7bd);
  background-image: -ms-linear-gradient(top, #d2d3d4, #aeb7bd);
  background-image: -o-linear-gradient(top, #d2d3d4, #aeb7bd);
  background-image: linear-gradient(to bottom, #d2d3d4, #aeb7bd);
  -webkit-border-radius: 5;
  -moz-border-radius: 5;
  border-radius: 5px;
  font-family: Arial;
  color: #000;
  font-size: 10px;
  padding: 0.1em 0.2em 0.2em 0.2em;
  text-decoration: none;
  width:50%;
  margin-top: .5em;
}

.button-detail1:hover {
  background: #787e82;
  background-image: -webkit-linear-gradient(top, #787e82, #55595c);
  background-image: -moz-linear-gradient(top, #787e82, #55595c);
  background-image: -ms-linear-gradient(top, #787e82, #55595c);
  background-image: -o-linear-gradient(top, #787e82, #55595c);
  background-image: linear-gradient(to bottom, #787e82, #55595c);
  text-decoration: none;
  color: #fff;
}
.button-detail2 {

  background: #d2d3d4;

  background-image: -webkit-linear-gradient(top, #d2d3d4, #aeb7bd);

  background-image: -moz-linear-gradient(top, #d2d3d4, #aeb7bd);

  background-image: -ms-linear-gradient(top, #d2d3d4, #aeb7bd);

  background-image: -o-linear-gradient(top, #d2d3d4, #aeb7bd);

  background-image: linear-gradient(to bottom, #d2d3d4, #aeb7bd);

  -webkit-border-radius: 5;

  -moz-border-radius: 5;

  border-radius: 5px;

  font-family: Arial;

  color: #000;

  font-size: 12px;

  padding: 0.1em 0.2em 0.2em 0.2em;

  text-decoration: none;

  margin-top: 0em;

}



.button-detail2:hover {

  background: #787e82;

  background-image: -webkit-linear-gradient(top, #787e82, #55595c);

  background-image: -moz-linear-gradient(top, #787e82, #55595c);

  background-image: -ms-linear-gradient(top, #787e82, #55595c);

  background-image: -o-linear-gradient(top, #787e82, #55595c);

  background-image: linear-gradient(to bottom, #787e82, #55595c);

  text-decoration: none;

  color: #fff;

}



#lefty {background-color:#3FC;
		width:10%;
		float:left;
		overflow:hidden;
		height:88%;
		min-height:600px;
		  text-align:left;
background-image:url(../images/background1.jpg);
}

#lefty p{padding:1em 0 0 1em;

}
#lefty h55{padding:1em 0 0 1em;

}

#navbar {width:100%;
background-image:url(../images/background1.jpg);
height:7%;
  text-align:left;
  vertical-align:middle;
  overflow:hidden;
 
}
#logo img {padding:0.2em 0 0 0.4em;
height:90%;

}
#logo {float:left;

}

#appname {float:left;
padding:0 0 0 0;
height:100%;
}


#mainwindow {width:90%;
height:88%;
background-image:url(../images/background0.jpg);
/*background-position:-7% -10%;*/
float:right;
overflow: scroll;  
white-space: nowrap;
 text-align:left;
}

.darker {
	color:#000;
	font-weight: bold;
}
.lighter {
	color:#f94;
	font-weight: normal;
}