/*
 --------------------------------------------------------------------------------------------------
 Date			Changed By      Description
 ---------		------------    -------------------------------------------------------------------
 07/31/2009		Pramod			Initial version 
 08/18/2009		Neel			Implemented the Feedback changes
 09/01/2009		Dinesh			Modified Timecard screen style			
 09/07/2009		Dinesh			Modified Timecard Popup style		
 02/25/2010		Pramod			Added new CSS classes for TimeCard Screen
 --------------------------------------------------------------------------------------------------
*/

/* Dashboard Summary */

.helpIcon
{
	background:url('../images/help_ms12.gif') no-repeat;
	width:12px !important; 	
	height:12px !important;
	float:right;	  
}


.defaultsTable
{
    border-collapse:collapse; 
    border:1px solid #708090;
    border-bottom:0;
    border-right:0;	
    align:center;
}

.defaultsTable td.helpImage  
{
	border-right:0px solid #fff;	
}

.defaultsTable td {
    padding:2px;
    border-right:1px solid #708090;
    border-bottom:1px solid #708090;	    
}

.minimumValue
{   
    background-color:#ff9900;
}

.maximumValue
{		
    background-color:#ff0000;   
}

.normalValue
{
	background-color:#00ff00;
}

.minimumValueGroup2
{  
	background-color:#ff9900;
}

.maximumValueGroup2
{	
   background-color:#ff0000;  
}

.group1
{
	background-color:#95c4f5;	
}

.group2
{	
	background-color:#FFF8DC !important; 	
}

.group3
{	
	background-color:#E6E6FA !important; 	
}

.group4
{
	background-color:#F5DEB3 !important; 	
}

.group5
{
	background-color:#ADD8E6 !important; 	
}

.date
{
    background-color:#95c4f5       /*#FBFD9D;*/
}

.weekDay
{
    background-color:#FCD57A;
}

.weekEnd
{
    background-color:#C0C0C0;
}

.gridTable {
	border-right:1px solid #adaa9c !important;
	border-bottom:1px solid #adaa9c !important;
	margin:0 auto !important;
}

.gridTable tr.gridHeader th {
	background:#cecfce;
	border-top:0px solid #adaa9c;
	border-left:1px solid #efebde;
	border-bottom:1px solid #efebde;
	border-right:0 !important;
	color:#00009c;
	text-align:left; 
	vertical-align:top;
}

.gridTable tr.gridHeader th:first-child {
	border-left:1px solid #adaa9c !important;
}

.gridTable tr.gridOddRow td,
.gridTable tr.gridEvenRow td {
	border-left:1px solid #efebde;
	*border-bottom:1px solid #efebde;
	border-top:1px solid #efebde;
	border-right:0 !important;
	padding:5px;
}

.gridTable tr.gridEvenRow {
	background-color:#f7f7f7;
}

.gridTable tr.gridOddRow {
	background-color:#fff;
	
}

.gridTable td:first-child {
	border-left:1px solid #adaa9c !important;
}

.gridPager {
	border-top:1px solid #efebde !important;
	border-bottom:1px solid #adaa9c !important;
}

.gridPager td table td:first-child
{
	border-left:0 !important;
}


.gridGraphHeader
{
	background-position: #D7FAD1;
	padding: 5px !important;
	border-top: 1px solid #adaa9c !important;
	border-left: 1px solid #efebde !important;
	background: #f8f5e7;
	text-align: center;
	font-weight: bold;
	border-bottom: 0 !important;
}

.gridGraphHeader a
{	text-decoration :underline;
 	color:Teal;
}

.gridGraphHeader:hover
{
	padding: 5px !important;
	border-top: 1px solid #adaa9c !important;
	border-left: 1px solid #efebde !important;
	text-align: center;
	font-weight: bold;
	border-bottom: 0 !important;
	text-decoration :underline;
}

/***/

.gridGraphHeaderGrp2
{
	background-position: #D7FAD1;
	padding: 5px !important;
	border-top: 1px solid #adaa9c !important;
	border-left: 1px solid #efebde !important;
	background: #FFF8DC;
	/* background: url(../images/Group1.png) repeat; */
	text-align: center;
	font-weight: bold;
	border-bottom: 0 !important;
}
 
.gridGraphHeaderGrp2 a
{	text-decoration :underline;
 	color:Teal;
}

.gridGraphHeaderGrp2:hover
{
	padding: 5px !important;
	border-top: 1px solid #adaa9c !important;
	border-left: 1px solid #efebde !important;
	text-align: center;
	font-weight: bold;
	border-bottom: 0 !important;
	text-decoration :underline;
}

.gridGraphHeaderGrp3
{
	background-position: #D7FAD1;
	padding: 5px !important;
	border-top: 1px solid #adaa9c !important;
	border-left: 1px solid #efebde !important;
	background: #E6E6FA;
	text-align: center;
	font-weight: bold;
	border-bottom: 0 !important;
}

.gridGraphHeaderGrp3 a
{	text-decoration :underline;
 	color:Teal;
}

.gridGraphHeaderGrp3:hover
{
	padding: 5px !important;
	border-top: 1px solid #adaa9c !important;
	border-left: 1px solid #efebde !important;
	text-align: center;
	font-weight: bold;
	border-bottom: 0 !important;
	text-decoration :underline;
}

.gridGraphHeaderGrp4
{
	background-position: #D7FAD1;
	padding: 5px !important;
	border-top: 1px solid #adaa9c !important;
	border-left: 1px solid #efebde !important;
	background: #F5DEB3;
	text-align: center;
	font-weight: bold;
	border-bottom: 0 !important;
}

.gridGraphHeaderGrp4 a
{	text-decoration :underline;
 	color:Teal;
}

.gridGraphHeaderGrp4:hover
{
	padding: 5px !important;
	border-top: 1px solid #adaa9c !important;
	border-left: 1px solid #efebde !important;
	text-align: center;
	font-weight: bold;
	border-bottom: 0 !important;
	text-decoration :underline;
}

.gridGraphHeaderGrp5
{
	background-position: #D7FAD1;
	padding: 5px !important;
	border-top: 1px solid #adaa9c !important;
	border-left: 1px solid #efebde !important;
	background: #ADD8E6;
	border-bottom: 0 !important;
}

.gridGraphHeaderGrp1
{
	background-position: #D7FAD1;
	padding: 5px !important;
	border-top: 1px solid #adaa9c !important;
	border-left: 1px solid #efebde !important;
	background: #95c4f5;
	border-bottom: 0 !important;
}

/***/

.subTab {
	border-bottom:1px solid #a9a7a7;
	font-size:11px;
	padding:5px 0 0 5px;

}

.subTab ul {
	list-style:none;
	margin:0;
	padding:0;
	display:block;
	clear:both;
	border-left:1px solid #a9a7a7;
}

.subTab ul li:first-child {
	border-left:1px solid #a9a7a7;
}

.subTab ul li {
	margin:0;
	padding:0;
	float:left;
}

.subTab ul li a {
	text-decoration:none;
	color:#000;
	display:block;
	width:80px;
	padding:3px 0;
	text-align:center;
	border:1px solid #a9a7a7;
	border-width:1px 1px 0 0;
}

.subTab ul li a {
	background:#f3f3f3 url('../images/tabBg.gif') repeat-x 0 0

}

.subTab ul li.selected a, .subTab ul li.selected a:hover {
	background:#fdb133 url('../images/selectedBg.gif') repeat-x 0 0
}

.subTab ul li a:hover {
	background:#f9f9f9 url('../images/tabHoverBg.gif') repeat-x 0 0

	}

.clear {
	height:1;
	display:block;
	clear:both;
	font-size:0;
}

.gridTableCaption 
{
	padding:5px !important;
	background:#CCCCCC;
    border-collapse:collapse;   
}

.EmptyDataRow td 
{
	float:none !important;
	padding:0 !important;
	width:100% !important;
}

.timeCardTable {
	border:solid #adaa9c;
	border-width:0 0 0 0; 
	font-size:10px;	
}
 
.timeCardTable td {
	border-left:1px solid #adaa9c;
    border-bottom:1px solid #adaa9c !important;
	padding:0px;
}


.timeCardTable td.vehicleDt {
	width:84px;
	word-break:break-all;
	text-align:left;
	padding-left: 3px !important;
	border-right:0px solid #adaa9c;
	border-left:1px solid #adaa9c !important;
}

.timeCardTable td.vehicleNameDt {
	width:110px;
	word-break:break-all;
	text-align:left;
	padding-left: 3px !important;
	border-right:0px solid #adaa9c;
	border-left:1px solid #adaa9c !important;
}

.timeCardTable td.link {
	width:80px;
	font-weight:bold; 
	border:solid #adaa9c;
	border-width:0 1px 0 1px; 
}
 
.timeCardTable td.details {
	font-size:0;
	color:#fff;	
	border-left:1px solid #adaa9c !important;
	padding:0 !important;
    white-space:nowrap !important;
    cursor:pointer !important;
}

td.timeCardHeader 
{
    border-width:0 0 0 0 !important;
	color:Black !important;
	text-align:left;
	font-weight:bold;
	cursor:default;
	height:13px; 
	width:25px !important;     
	text-align:left;	
	padding-left:0px;
	padding:0 !important;	
	vertical-align:bottom;
	display:-moz-inline-block;
	display:inline-block;
}

td.NightTime
{
	background-color:Black;  
	border-width:0 0 0 0 !important;
	border:0px; 
	width:24px; 
}

td.DayTime
{
	background-color:#8AC5FF;  
	border-width:0 0 0 0 !important;
	border:0px; 
	width:24px; 
}

tr.timecardScaleDt td
{
	border:0;
	height:5px;
	font-size:0;
	}
	
	
tr.timecardScaleDt td.timecardScaleLast
{
	background:url('../images/timeCardScaleLast.gif') no-repeat left bottom;
	}
tr.timecardScaleDt td.timecardScale
{
	background:url('../images/timeCardScale.gif') no-repeat left bottom;
	}	

td.noBorderCell
{
    border-width:0 0 0 0 !important;
    border:0;
 }

td.timeCardlinkHeader {
	border-width:0 0 0 0 !important;
	color:#00009c !important;
	text-align:left;
	font-weight:bold;  
	width:58px;
	padding-left: 3px !important;	
}

td.timeCardVehicleHeader {
	border-width:0 0 0 0 !important;
	color:#00009c !important;
	text-align:left;
	font-weight:bold;
	width:84px;   
	padding-left: 3px !important;
	display:block;  
}

td.timeCardVehicleNameHeader {
	border-width:0 0 0 0 !important;
	color:#00009c !important;
	text-align:left;
	font-weight:bold;
	width:107px;   
	padding-left: 3px !important;
}

.timeCardPager {
	border-bottom:1px solid #adaa9c !important;
	border-left:1px solid #adaa9c !important;
	border-right:1px solid #adaa9c !important;
	height:20px; 
}
 
.empty,
.moving,
.ignitionon,
.ignitiononoff,
.idling,
.idle {
	width:2px;
	height:24px;
	display:-moz-inline-block;
	display:inline-block;
	font-size:0;
}
 
.empty {
	background:#fff;
}
 
.moving {
	background:#00A600/*#ffb245 #336633*/;
}
 
.idle {
	background:#ff0000; 
}
 
.ignitionon 
{
	background-color:#33cc00 ;
	/*background-color:#ffcc00;*/
}

.ignitiononoff 
{
	background-color:#ff00ff;  /* ff9900; */
}

.idling 
{
	background-color:Yellow;  /* ff9900; */
}
 
#timeCardDtView {
	position:absolute;
	/*width:410px;*/
	width:430px;
	padding:0 10px;
	overflow:hidden;
	border:1px solid;
	border-left-color:#636363;
	border-top-color:#636363;
	border-right-color:#636363;
	border-bottom-color:#636363;
	z-index:99999;
	left:-100%;
	background:#f0f0f0;
}
 
#timeCardDtView #detailsInfo {
	display:block;
	font-size:12px;
	font-weight:bold;
	text-align:center;
	padding:7px 0;
	color: #00009c;
}
 
#timeCardDtView .empty,
#timeCardDtView .moving,
#timeCardDtView .ignitionon,
#timeCardDtView .ignitiononoff,
#timeCardDtView .idling,
#timeCardDtView .idle {
	width:24px;
	border:1px solid #444444;
	border-left:0;
}
  
#timeCardDtholder {
	border-left:1px solid #444444;
	margin:0 auto;
	white-space:nowrap;
	width:301px;

}
 
#timeCardDtView .empty,
#timeCardDtView .moving,
#timeCardDtView .ignitionon,
#timeCardDtView .ignitiononoff,
#timeCardDtView .idling,
#timeCardDtView .idle {
	height:65px;
}

#timeCardDtholder {height:67px;}
 
.timeCardLegend {
	font-size:10px;
	FONT-FAMILY: Verdana, Arial;
	white-space:nowrap;
	vertical-align:middle;
}

.timeCardLegend #key {
    width:auto;
    padding:0;
    margin:0;
}

.timeCardLegend #key ul {
    width:250px;
    padding:2px 0;
    margin:0;
}
.timeCardLegend #key ul li {
   margin-right:2px;
   margin-left:5px;
}  

 
#key {
	font-size:11px;
	padding:7px 0;
/*	white-space:nowrap; */
}
 
#key ul {
	margin:0 auto 0 10px;
	*margin:0 auto 0 15px;
	padding:0;
}
 
#key ul li {
	display: inline;
	font-size:10px;
	margin-left:6px;
}
 
#key ul li:first-child {
	margin-left:0;
}
 
#key ul li span {
	width:7px !important;
	height:7px;
	display:inline-block;
	border:1px solid #000;
    *vertical-align:middle;
    *margin-right:3px;    
}
 
#key ul li span.idlingKey {
	background:Yellow;	
}

#key ul li span.noDataKey {
	background:#fff;	
}
 
#key ul li span.movingkey {
	background:#00A600/*#ffb245*/;
}
 
#key ul li span.idleKey {
	background:#ff0000;  /* #dd0d2f */
}

#key ul li span.ignON {
	background:#33cc00;/*#ffcc00*/
}

#key ul li span.ignONOFF {
	background:#ff00ff;  /* #ff9900 */
}

.timeCardNoData {
	border: solid 1px #adaa9c !important;
	font-size:10px;
	FONT-FAMILY: Verdana, Arial;
	text-align:center;
	vertical-align:middle; 
	height:20px;
	min-height:500px;     
}

.footerNoteWithData {
	padding-top:10px;
	padding-bottom:10px;
}

.footerNoteWithOutData {
    padding-top:250px;
    padding-bottom:10px;     
}
.popupTimeCardScale
{		background:url('../images/popupTimeCardScale.gif') repeat-x left top;
 		height:6px;
 		font-size:0;
 		width:301px;
 		/*margin:0 auto; 		*/
 		margin-left:64px;
	}

.minuteInfo {
    display:none; 
}

#timeCardDtView .minuteInfo {
    height:13px;    
	padding-left:0px; 
	padding-top:1px; 
	display:-moz-inline-block;
	display:inline-block;
	text-align:left;
	border:0px solid red !important;
	width:24px;
	font-size:9px;
 
}

#timeCardDtView #minsDt { 
	border-left:0px solid #444444; 
	white-space:nowrap;
	width:301px;
	margin:0 auto;
}

.standardlgd
{	
	height:10px;
	background:#FF9900;	
}

.daylgd
{	
	height:10px;
	background:#8AC5FF;	
}

.nightlgd
{	
	height:10px;
	background:#000000;	
}


.jbuslgd
{
	height:10px;
	background:#FF0000;	
}

.gridTitleIgnOnText
{
	background-position: #D7FAD1;
	padding: 5px !important;
	border-top: 1px solid #adaa9c !important;
	border-left: 1px solid #efebde !important;
	background: #cbe7a8;
	font-weight: bold;
	border-bottom: 0 !important;
	text-align:center;  
}

.gridTitleIgnOffText
{
	background-position: #D7FAD1;
	padding: 5px !important;
	border-top: 1px solid #adaa9c !important;
	border-left: 1px solid #efebde !important;
	background: #ffaaa4;
	font-weight: bold;
	border-bottom: 0 !important;
	text-align:center;  
}

/* -----Time card table legend --------- */

.timeCardLegendTbl {
	font-size:10px;
	FONT-FAMILY: Verdana, Arial;
	white-space:nowrap;
	vertical-align:middle;
}

.timeCardLegendTbl #keyTbl {
    width:auto;
    padding:0;
    margin:0;
}

.timeCardLegendTbl #keyTbl ul {
    width:250px;
    padding:2px 0;
    margin:0;
}
.timeCardLegendTbl #keyTbl ul li {
   margin-right:2px;
   margin-left:5px;
}  

#keyTbl {
	font-size:11px;
	padding:7px 0;
/*	white-space:nowrap; */
}
 
#keyTbl ul {
	*width:375px;
	margin:0 auto;
}
 
#keyTbl ul li {
	display: inline;
	font-size:11px;
	margin-left:5px;
}
 
#keyTbl ul li:first-child {
	margin-left:0;
}
 
#keyTbl ul li span {
	width:8px !important;
	height:8px;
	display:inline-block;
	border:1px solid #000;
    *vertical-align:middle;
    *margin-right:3px;    
}

#keyTbl ul li span.idlingKeyTbl {
	background:Yellow;	
}
  
#keyTbl ul li span.noDataKeyTbl {
	background:#fff;	
}
 
#keyTbl ul li span.movingkeyTbl {
	background:#00A600;
}
 
#keyTbl ul li span.idleKeyTbl {
	background:#ff0000;  
}

#keyTbl ul li span.ignONTbl {
	background:#33cc00;
}

#keyTbl ul li span.ignONOFFTbl {
	background:#ff00ff; /* #ff9900; */
}

/*------Sorted bargraph Popup -------- */

.lblGraph{
	font-family:Trebuchet MS;
    font-size:11px;
    color:#133195;
    font-weight:bold;
}
       
.lblGraphtitle
{
	font-family:Trebuchet MS;
    font-size:medium;
    color:#133195;
    font-weight:bold;
}
       
#mask {
	overflow:hidden;
	position:absolute;
	z-index:0;
	width:100%;
	height:100%;
	left:0;
	top:0;
	background:url(../images/maskBg.png) 0 0;
}

.ifrmPopupPannel {
	position:absolute;
	left:-100%;
	z-index:999;
	overflow:hidden !important;
	background:transparent;
}

#ifrm
{
	 padding:0; margin:0; overflow:hidden !important;}

#popupWrapper {
	margin:0 auto;
	font-size:12px;
}

#popupWrapper ul,
#popupWrapper ul li {
	padding:0;
	margin:0;
}

.popupTLt,
.popupBLt {
	margin-right: 21px;
	background-image: url(../images/popupHeaderFooterBg.png);
	height: 21px;
	font-size: 0;
}

.popupTRt,
.popupBRt {
	margin-top: -21px;
	margin-left: 21px;
	background-image: url(../images/popupHeaderFooterBg.png);
	background-position: 100% 0px;
	height: 21px;
	width: 21px;
	font-size: 2px;
	float:right;
}

.popupBLt {
	background-position: 0 -21px;
}

.popupBRt {
	background-position: 100% -21px;
}

.contentPanel {
	background:url(../images/popupContentBg.png) repeat-y 0 0;
	display:block;
	clear:both;
}

.contentPanelMiddle {
	background:url(../images/popupContentBg.png) repeat-y 100% 0;
}

.content {
	margin:0 7px;
	background:#fff;
}

.popupTopPanel {
	background:#e7e7e7;
	border-bottom:1px solid #adaa9c;
	padding:0 5px;
	height:23px;
}

.popupTopPanel .heading {
	float:left;
	font-weight:bold;
	font-size:12px;
	color:#0b2168;
	margin-right:25px;
	margin-top:3px
}

.popupTopPanel .detail {
	float:left;
	font-size:10px;
	margin-top:5px;
	text-align:center;
}

.popupTopPanel .action {
	float:right;
	margin-top:2px;
}

.popupTopPanel .action ul {
	float:left;
	list-style:none;
}

.popupTopPanel .action ul li {
	float:left;
}

.popupTopPanel .action ul li a {
	color:#222;
	text-decoration:none;
	display:block;
	padding:0 5px;
	font-size:11px;
	padding:3px 0 2px 20px;
	margin-left:15px;
}

.popupTopPanel .action ul li a.print {
	background: url(../images/icon_print.gif) no-repeat 0 2px;
}

.popupTopPanel .action ul li a.close {
	background: url(../images/icon_close.gif) no-repeat 0 2px;
}

.graphHolder {
	overflow:auto;
	overflow-x:hidden;
	max-height:400px;
	min-height:200px;
	text-align:center;
	padding:10px 5px;
	display:block;
	clear:both;
}

.graphHolder img {
}

.popupBottomPanel {
	background:#e7e7e7;
	border-top:1px solid #adaa9c;
	padding:0 5px;
	height:23px;
	font-size:11px;
}

.popupBottomPanel .pagination {
	float:left;
	margin-top:5px;    
}

.popupBottomPanel .pagination a {
	color:#222;
}

.popupBottomPanel .graphkey {
	float:right;
	margin-top:5px;
}

.popupBottomPanel .graphkey ul {
	margin:0 auto;
	list-style:none;
}

.popupBottomPanel .graphkey ul li {
	/*display: inline;*/
	float:left;
	margin-left:25px;
	
}

.popupBottomPanel .graphkey ul li:first-child {
	margin-left:0;
}

.popupBottomPanel .graphkey ul li span {
	width:18px;
	height:9px;
	display:inline-block;
	border:0px solid #000;
 *vertical-align:middle;
 *margin-right:3px;
}

.popupBottomPanel .graphkey ul li span.lowKey {
	background:#ff9c00;
}

.popupBottomPanel .graphkey ul li span.normalkey {
	background:#5bff00;
}

.popupBottomPanel .graphkey ul li span.highKey {
	background:#ff0000;
}

.dividerPipe {
	margin:0 2px;
	font-weight:normal !important;
	color:#b4b4b4 !important;
}


.headerInfo
{
	font-size:11px;
	border-bottom:1px solid #efebde;
	padding:0 0px;
	}
.userDt
{
	float:left;
	margin-right:20px;
	margin-top:5px;
	width:65px; 
	
		}
.userDt #lblCompanyName
{
	padding:4px;
	font-weight:bold;
	font-size:12px;
	display:inline-block;
	border:1px solid darkred;
	}
		
.dataTime
{ float:left; text-align:left; font-weight:bold;
  margin-top:5px;
	}
.graphDt
{
	margin-top:10px;
	margin-bottom:10px;
	text-align:left;
	padding-left:80px;
	}				
.graphDt #lblTimePeriod{
	font-size:10px;
	display:inline-block;
	margin-bottom:8px;
	}
	
.floatLt{
	float:left;
	}
	
.floatRt{
	float: right;
	}
	
/* Home Module */
.greenlgd
{
	height:10px;
	background: #8fee92;
}
.redlgd
{
	height:10px;
	background:#ffafaf;	
}
.orangelgd
{
	height:10px;
	background:#fea405;
}