﻿@font-face{
    font-family:'Roboto';
    font-style:thin;
    font-weight:100;
    src:url(../fonts/Roboto_100.eot);
    src:url(../fonts/Roboto_100.ttf) format('truetype');    
}
@font-face{
    font-family:'Roboto';
    font-style:light;
    font-weight:300;
    src:url(../fonts/Roboto_300.ttf) format('truetype');    
}
@font-face{
    font-family:'Roboto';
    font-style:normal;
    src:url(../fonts/Roboto_regular.ttf) format('truetype');    
}
@font-face{
    font-family:'Roboto';
    font-style:bold;
    font-weight:700;
    src:url(../fonts/Roboto_700.ttf) format('truetype');    
}
*{
    margin: 0 auto;
    padding: 0;
    font-family:'Roboto';
    font-weight:300;
    -webkit-print-color-adjust : exact;
}
body
{
    overflow-y: scroll;
}
.container
{
    /*min-width: 1024px;*/
    min-width: 1007px;
    max-width:1440px;
    width:100%;
    
    /*background-color: #363636;*/
    /*background: #4f4c4c;*/
    /*background-image: url(../images/pink.png);*/
}
.underline
{
    border-bottom:1px dashed #363636;    
}
.headerTheme
{
      position: relative;
    overflow:hidden;    
}
.logout
{
	position:fixed;
	bottom:5px;
	right:5px;
	width:32px;
	height:32px;	
	background-image:url("../images/logout.png");
	z-index:99999;
	cursor:pointer;
}
.logout:hover
{
	background-image:url("../images/logout_hover.png");
}
.loading
{
	/*width:300px;*/
	width:400px;
	min-height :25px;
	background-color:#e5e5e5;
	/*color:#555;
	color: #ed4345;*/
    color: #228cc0;
	position:fixed;
	top:0;
	right:-200px;	
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.7);
	z-index:99999;
	background-color: #fff;
  
  
}
.loading > div
{
	display:table;
	margin:0px auto;
	font-weight: 400;	
}
.titlebar
{
	font-size:0;
	margin:10px 0px 1px 0px;
	display:inline-block;
	cursor:pointer;
	color: #b7b7b7;
}
.titlebar:hover
{
	color:#ef7b26;	
} 
.titlebar .titlebarContent
{
	padding: 0px 5px;
	margin: 0px;
	display: inline-block;
	background-color: #555;
	font-size: 24px;
	font-weight: 300;
	vertical-align:top;
}
.titlebar .titlebarContent.orange
{
    background-color: #ef7b26;
    color: #fff;
    height: 32px;
    /*padding: 0px 5px;*/
}
.titlebar .titlebarArrow
{
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 16px 0 16px 15px;
	border-color: transparent transparent transparent #555;
	display:inline-block;	
}

.menubar
{
	width:9%;
	position:relative;
	display:inline-block;
	/*overflow:hidden;	*/
	vertical-align:top;
}
.menuicon
{
	display:inline-block;
	position:relative;
	color:#fff;
	font-weight:300;
	padding:5px;
	background-color:#363636;	
	cursor:pointer;
}
.menuicon:hover
{
	background-color:#555;
}
.menus
{
	position:absolute;	
	display:none;
	z-index:100;
}
.menus ul
{
	width:220px;	
}
.menus ul li
{
	list-style-type:none;
	background-color: #363636;
	color: white;
	font-weight: 300;	
}
.menus>ul>li>a
{
	display:block;
	padding: 5px 10px;
	color: white;	
	text-decoration:none;
	-webkit-transition: all .2s;
    transition: all .2s;
	
}
.menus>ul>li>a:hover
{
	color:#ef7b26;
	padding: 10px 20px;
	background-color: #363636;
	border:1px solid #ef7b26;	
}
.sub-menu
{
	display:none;	
}
.sub-menu>li>a
{
	display:block;
	color: white;	
	text-decoration:none;
	-webkit-transition: all .2s;
    transition: all .2s;
	padding:5px 10px 5px 25px;
	background-color:#555; 	
}
.sub-menu>li>a:hover
{
	color:#ef7b26;
	padding: 10px 30px;
	border:1px solid #ef7b26;		
}
.sub-sub-menu
{
	display:none;	
}
.sub-sub-menu>li>a
{
	display:block;
	color: white;	
	text-decoration:none;
	-webkit-transition: all .2s;
    transition: all .2s;
	padding:5px 10px 5px 35px;
	background-color:#6a6a6a; 	
}
.sub-sub-menu>li>a:hover
{
	color:#ef7b26;
	padding: 10px 0px 10px 40px;
	border:1px solid #ef7b26;		
}
.menuOverlay
{
	width:100%;
	position:fixed;
	top:0px;
	left:0px;
	background-color:rgba(0,0,0,0);
	z-index: 1;	
}
.filterContainer
{
	width:90%;	
	display:inline-block;
	font-size:0;
	text-align:right;
	color:#fff;
}
.filterContainer .filterArrow
{
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 20px 15px 20px 0px;
	border-color: transparent #363636 transparent transparent;
	display:inline-block;	
	font-size:0px;
	margin:0px;
	padding:0px;
}
.filterContainer .filterBody
{
    position:relative;
	display:inline-block;
	background-color:#363636;
	padding:0px 10px;
	margin:0px;
	vertical-align:top;
	font-size:16px;
	font-weight:300;
	border-bottom-right-radius: 10px;
	border-top-right-radius: 10px;
}
.filterContainer .filterBody select
{
	margin:7px 3px;
	width:auto;	
}
.filterContainer .filterBody input
{
	margin:5px 3px;
}
.filterContainer .filterBody input[name="search"],.filterContainer .filterBody .search
{
	background-color:#39c5f0;	
	padding:15px 20px;
	border-radius:10px 40px 10px 40px;
	box-shadow: 0px 0px 5px rgba(0,0,0,1);
	transition:all .2s;
}
.filterContainer .filterBody input[name="search"]:hover,.filterContainer .filterBody .search:hover
{
	background-color:#fff;	
	box-shadow: 0px 0px 5px #fff;	
}
.searchReset
{
    display:inline-block;
	width:30px;
	margin-left:5px;
	height:24px;
	background:url("../images/clear.png") no-repeat center;
	border:0;
	vertical-align:middle;
	cursor:pointer;
}	
.searchReset:hover
{		
	background:url("../images/clearHover.png") no-repeat center;
}
.delete
{
    display:inline-block;
	width:20px;
	margin-left:5px;
	height:20px;
	background:url("../images/delete.png") no-repeat center;
	border:0;
	vertical-align:middle;
    transition:all ease-in .2s;
	cursor:pointer;
}	
.delete:hover
{		
	box-shadow: 0px 2px 0px 0px #363636;
    border-radius:5px;
}
.filterContainer .filterBody .info
{
	display: inline-block;
	margin: 0px 5px;
	border: 0;
	vertical-align: middle;
	cursor: pointer;
	padding:2px 10px;
	border-radius:50%;
	box-shadow: 0px 0px 5px rgba(0,0,0,1);
	background-color: rgba(38,184,111,1);
    color: #fff;
    font-weight:700;
	transition:all .2s;
}
.filterContainer .filterBody .info:hover
{
	background-color:#fff;	
	color:rgba(38,184,111,1);
	box-shadow: 0px 0px 5px #fff;		
}
.filterContainer .filterBody .info.info-button, .filterContainer .filterBody .createInvoice,.filterContainer .filterBody .vehicleListBtn{
    border-radius: 5px;
    font-weight: 400;    
    vertical-align: middle; 
    margin: 8px 3px;
}
.filterContainer .filterBody input[type="radio"]
{
    vertical-align:middle;  
    margin: 13px 5px;  
}
.disableSearch
{
	background-color: #363636;
	box-shadow: none;
	cursor: not-allowed;	
}
.disableSelect
{
	background-color:rgba(255,255,255,0.7);
	box-shadow:none;
	cursor:not-allowed;	
}
.header
{
    width:100%;
    color:#b7b7b7;
    background-color: #555;    
}
.header li{
    text-align: center;
    cursor: pointer;
    padding: 6px 10px;
    word-wrap:normal;
}
.header li:hover{
    color:#fff;
    background-color: #282828;
    /*border-radius: 5px 5px 0px 0px;*/
}
.title{
    width: 17%;
    padding: 0px 10px;
    font-size: 24px;
    font-weight:300;
    color:#ef7b26;
    display: inline-block;
}
.menu-wrapper{
    display:none;
}
.menu{
    width: 80%;
    color:white;
    font-weight:300;
    font-size: 18px;
    text-align: right;
    display: inline-block;  
}
.menu ul li{
    list-style-type: none;
    display: inline-block;
    transition: color .2s;
}
.menu ul li:hover{
    color:#ef7b26;
}
.selectedMenu
{
	color:#ef7b26;	
}
.menu ul li img{
    position: absolute;
}
.subMenu{
    position:absolute;
    display:none;
    /*width:0px;
    height:0px;*/
    background-color: #282828;
    border: 5px solid #282828;
}
.subMenu ul li{
    color: white;
    list-style-type: none;
    display:block;
    transition: color .5s
}
.subMenu ul li:hover{
    background-color: #4f4c4c;
    border-radius: 0px;
}
	.Table
    {
        display: table;
        /*min-width:1024px;
        max-width:1440px;*/
        width:80%;
        margin:0 auto;
        box-shadow:0px 0px 1px rgba(0,0,0,0.5);
    }
    .Title
    {
        display: table-caption;
        text-align: center;
        /*font-weight: bold;
        font-size: larger;*/
        font-size:36px;
    }
    .Heading
    {
        display: table-row;
        
        text-align: center;
    }
    .Row
    {
        display: table-row;
    }
    .dataContentTable
    {
        background-color:#fff;    
    }
    .dataContentTable .Row:hover
    {
		background-color: #ef7b26;
    }
    .Cell
    {
        display: table-cell;
        /*border: solid;
        border-width: thin;*/
        /*padding:10px 0px;*/
        padding:5px 0px;
        text-align: center;
        /*font-size: 18px;*/
        font-size:16px;
        border-bottom:1px solid #ef7b26;
    }
    .Row .Cell
    {
        cursor:pointer;    
    }
    .Row:nth-last-child(1) .Cell{
        border-width:0px;
    }
    .rowSelect
    {
		background-color: #ef7b26;	
	}
	.noBorder
    {
        box-shadow:none;
    }
	.noBorder .Cell
	{
		padding:0px;
        text-align: left;
        border-bottom:0;
	}
    /*.Cell:nth-child(1){
        border-left: 1px solid rgba(54,54,54,1);
    }
    
    .Heading .Cell{
        border-top: 1px solid rgba(54,54,54,1);
    }
    .Row:nth-last-child(1) .Cell{
        border-bottom: 1px solid rgba(54,54,54,1);
    }
   */
    /*.Cell:nth-child(1)
    {
    	text-align: left;
    	font-size:20px;
    }*/
 .Heading .Cell{
    	background:#555;
        padding: 5px;
        /*color: #ef7b26;
        font-size:22px;*/
        color:White;
        font-size:18px;
        font-weight:300;
        border:0;
    }
    .Cell.sn {
        width:40px;
        text-align:center;
    }
    .upper
    {
		text-transform: uppercase;
	}
input[type="text"],input[type="file"],input[type="password"],input[type="number"],textarea,select
{
	border: 0;
    outline:0;
	margin-left:5px;
	padding:2px 5px;
	box-shadow: 0px 0px 1px 0.5px;	
}
input[type="file"]{
    padding: 2px 8px 2px 2px;
}
textarea
{
	max-height:150px;	
}
input[type="text"],input[type="password"],input[type="number"],select
{
	height: 26px;
}
div[data-select] {
    display:inline-block;
    position:relative;
}
div[data-select] > input {
    height:22px;
}
div[data-select] > input::after {
    display:block;
    content:'dfhed';
}
div[data-select] > select.select-search {
    position:absolute;
    height:150px;
    top:24px;
    left:0px;
    z-index:1;
}
input[name="search"]
{
	width:30px;
	margin-left:5px;
	height:24px;
	background:url("../images/search.png") no-repeat center;
	border:0;
	vertical-align:middle;
	cursor:pointer;
}	
input[name="search"]:hover
{
	background:url("../images/searchHover.png") no-repeat center;
}
.search
{
	display:inline-block;
	margin-left:5px;
	background:url("../images/search.png") no-repeat center;
	border:0;
	vertical-align:middle;
	cursor:pointer;	
}
.search:hover
{
	background:url("../images/searchHover.png") no-repeat center;	
}
.excelExport
{
    width: 32px;
    height: 32px;
	display:inline-block;
	margin-left:5px;
	background:url("../images/export.png") no-repeat center;
	border:0;
	vertical-align:middle;
	cursor:pointer;	
}
.excelExport:hover
{
	background:url("../images/exportHover.png") no-repeat center;
}
.pdfExport
{
    width: 32px;
    height: 32px;
    display:none;
	/*display:inline-block;*/
	margin-left:5px;
	background:url("../images/exportPdf.png") no-repeat center;
	border:0;
	vertical-align:middle;
	cursor:pointer;	
}
.pdfExport:hover
{
	background:url("../images/exportPdfHover.png") no-repeat center;
}
input[name="clear"]
{
	width:30px;
	margin-left:5px;
	height:24px;
	background:url("../images/clear.png") no-repeat center;
	border:0;
	vertical-align:middle;
	cursor:pointer;
}	
input[name="clear"]:hover
{		
	background:url("../images/clearHover.png") no-repeat center;
}
.dataContainer
{
	width:80%;	
	/*margin-top:60px;*/
}
.dataEntry
{
	margin:10px 0;	
}
.dataLabel,.dataField
{
	width:50%;
	display:inline-block;
	vertical-align:top;
}
.dataLabel label,.dataField input,.dataField textarea,select
{
	width:100%;	
	max-width:100%;	
}
.filterContainer select {
    max-width:150px;
}
.dataField span
{
	vertical-align:middle;
}
.dataField input[type="submit"],.dataField input[type="reset"]
{
	width:40%;
	margin-right:5%;
	margin-top:10px;
	height: 26px;
	border: 0;
	margin-left:5px;
	padding:2px 5px;
	box-shadow: 0px 0px 5px;	
	cursor:pointer;
	transition:all .3s;
}
.dataField input[type="submit"]
{
	color:Green;	
}
.dataField input[type="reset"]
{
	color:Red;	
}
.dataField input[type="submit"]:hover
{
	box-shadow: 0px 0px 10px;
}
.dataField input[type="reset"]:hover
{
	box-shadow: 0px 0px 10px;
}
.formAppendDivContainer
{
	position:absolute;
	padding:10px 0px;
	/*padding:10px 0px 20px 0px;
	height:300px;	*/
	display:none;
	border-bottom:1px solid #ef7b26;
}
.formAppendDivContainer .Cell
{
	font-size:14px;	
	cursor:default;
    padding: 0px 5px;
}
.formAppendDivContainerEdit
{
    /*margin-right:10px;
	margin-bottom:10px;
	text-align: right;*/	
}
.formAppendDivContainerEdit img
{
    position:absolute;
    top:5px;
    right:5px;   
	cursor:pointer;		
}

.formAppendDivContainerLink img.link{
  position: absolute;
  top: 5px;
  right: 40px;
  cursor: pointer;
}
.tabContainer
{
	width:90%;
	margin:20px 5%;

}
.tabButton
{
	width:99%;
}
.tabButton>div
{
	display:inline-block;
	padding:5px 20px;
	border-radius:5px 5px 0px 0px;	
	cursor:pointer;
	transition: all .2s;
    border-width:2px 2px 0px 2px;
    border-style:solid;    
}
.tabButton>div:hover
{
	/*color:#fff;*/
	opacity:1;
    background:none;
}
.tabPanel
{
	width:99%;
	/*background-color:rgba(239,123,38,0.1);
	border:1px solid #ef7b26;*/		
}
.registerTab
{
		opacity:0.5;
	/*background-color:#555;*/	
    background-color:#d6d6d6;
    border-color:#555;
}
.plotRegisterTab
{
		opacity:0.5;
	/*background-color:#ed4345;*/
    background-color:#d6d6d6;
    border-color:#ed4345;
	/*background-color:rgba(237,67,69,1)*/
	/*background-color:#c01315;
	/*background-color:rgba(192,19,21,1)*/		
}
.bidderRegisterTab
{
		opacity:0.5;
	/*background-color:#26b86f;*/
    background-color:#d6d6d6;
    border-color:#26b86f;
	/*background-color:rgba(38,184,111,1)*/		
}
.plotAssignTab
{
		opacity:0.5;
	/*background-color:#228cc0;*/
    background-color:#d6d6d6;
    border-color:#228cc0;
	/*background-color:rgba(34,140,192,1)*/		
}
.materialAssignTab
{
		opacity:0.5;
	/*background-color:#df9f01;*/
    background-color:#d6d6d6;
    border-color:#df9f01;
	/*background-color:rgba(223,159,1,1)*/		
}
.tabPanel > div {
    border-width:2px 0px;
    border-style:solid;
}
.registerPanel
{
	/*background-color:rgba(85,85,85,0.1);*/
	/*border:2px solid #555;	*/
    border-color:#555;
}
.plotRegisterPanel
{
	/*background-color:rgba(237,67,69,0.1);*/
	/*border:2px solid #ed4345;*/
    border-color:#ed4345;
	display:none;	
}
.bidderRegisterPanel
{
	display:none;
	/*background-color:#26b86f;*/
	/*background-color:rgba(38,184,111,0.1);*/	
	/*border:2px solid #26b86f;*/
    border-color:#26b86f;	
}
.plotAssignPanel
{
	display:none;
	/*background-color:#228cc0;*/	
	/*background-color:rgba(34,140,192,0.1);*/	
	/*border:2px solid #228cc0;*/
    border-color:#228cc0;
}
.materialAssignPanel
{
	display:none;
	/*background-color:#df9f01;*/
	/*background-color:rgba(223,159,1,0.1);*/		
	/*border:2px solid #df9f01;*/
    border-color:#df9f01;
}
.FinedTab
{
	opacity:0.7;
	background-color:#228cc0;
	/*background-color:rgba(34,140,192,1)*/	
}
.FIRTab
{
		opacity:0.7;
	background-color:#ed4345;
	/*background-color:rgba(237,67,69,1)*/
}
.RTOTab
{
		opacity:0.7;
	background-color:#26b86f;
	/*background-color:rgba(38,184,111,1)*/		
}
.FinedTab,.FIRTab,.RTOTab
{
    font-weight:400;
}
.FinedTab>input,.FIRTab>input,.RTOTab>input
{
    margin-right: 5px;
    vertical-align: middle;
    cursor:not-allowed;
}
.FinedPanel
{
	/*background-color:#228cc0;*/	
	background-color:rgba(34,140,192,0.1);	
	border:2px solid #228cc0;
}
.FIRPanel
{
	background-color:rgba(237,67,69,0.1);
	border:2px solid #ed4345;
	display:none;
	/*background-color:rgba(237,67,69,1)*/
	/*background-color:#c01315;
	/*background-color:rgba(192,19,21,1)*/		
}
.RTOPanel
{
	display:none;
	/*background-color:#26b86f;*/
	background-color:rgba(38,184,111,0.1);	
	border:2px solid #26b86f;	
}
.selectedTabButton
{
	opacity:1;
	/*color:#fff;*/
    background:none;
}
.tabPanel>div>.Table
{
	width:100%;
	box-shadow:none;	
	cursor:default;
}
.tabPanel>div>.Table>.Row>.Cell
{
	cursor:default;	
	vertical-align:top;
}
.chartTitle
{
    text-align:center;    
}
.chartTitle>div
{
    text-align: center;
  font-size: 18px;
  color: #363636;
  border-bottom: 1px dashed;
  display: inline-block;
}
.mapIndex
{
	position:relative;
}
.mapIndex>div
{
	padding:10px 20px;
	width: 150px;
  height: 50px;
  position: absolute;
  background-color: rgba(54,54,54,0.1);
  border:1px dashed rgba(54,54,54,0.5);
  right: 10px;	
}
.mapIndex>div div
{
	line-height:24px;	
}
.mapIndex .colorBox
{
	display:inline-block;
	width:20px;
	height:20px;
	vertical-align:middle;	
}
.mapIndex span
{
	vertical-align:middle;	
}
.progressbarContainer .colorBox
{
	display:inline-block;
	width:20px;
	height:20px;
	vertical-align:top;	
}
.progressbarContainer .c1
{
    background-color: #f1a165;
    background-image: -moz-linear-gradient(top, #f1a165, #f36d0a);  
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #f1a165),color-stop(1, #f36d0a));
    background-image: -webkit-linear-gradient(#f1a165, #f36d0a);
}
.progressbarContainer .c2
{
    background-color:#555;
}
.progressbarContainer span
{
	vertical-align:middle;	
}
.progressbarContainer .QuantityInfo>div
{
    display:inline-block;
    width: 49%;
    margin-top: 5px;
    text-align: center;
    font-weight:400;
    vertical-align: top;
}
.progressbarContainer .QuantityInfo>div span
{
    font-weight:400;
    font-size: 14px;
}
.progressbarContainer .QuantityInfo>div>div:nth-last-child(1)    
{
    display: inline-block;
    padding-left: 7px;
}
.PageNo
{
    display:table;    
}
.pageCorner
{
    margin:0px 5px !important;    
}
.PageNo>div
{
    display:inline-block; 
    margin:0px 2px;   
    vertical-align:bottom;
    cursor:pointer;
}
.PageNo>div .pageArrow
{
      width: 0;
      height: 0;
      border-style: solid;
      border-width: 10px 15px 0px 15px;
      border-color: transparent transparent transparent transparent;
}
.PageNo>div .pageArrow.small { border-width: 8px 10px 0px 10px; }  
.PageNo>div .pageArrow:hover
{
      border-color: rgba(54,54,54,1) transparent transparent transparent;
}
.PageNo > div.pageCorner > div.icon {
    display:inline-block;
    width:20px;
    height:20px;
    background-image: url('../images/arrows.png');
}
.PageNo > div.pageCorner > div.icon.first { background-position: 0; }
.PageNo > div.pageCorner > div.icon.previous { background-position: -20px 0px; }
.PageNo > div.pageCorner > div.icon.next { background-position: -40px 0px; }
.PageNo > div.pageCorner > div.icon.last { background-position: -60px 0px; }
.PageNo *
{
    text-align:center;
}
.pageNoHover
{
      border-color: rgba(54,54,54,1) transparent transparent transparent !important;
}
.pageArrowSelected
{
      border-color: rgba(54,54,54,1) transparent transparent transparent !important;
}
.title-container {
    position:relative;    
}
.title-container .title-wrapper {
    position: absolute;
    right: 10px;
    top: 10px;
    font-weight: 400;
    font-size: 1.2em;
}
.progessbar
{
    position:relative;    
}
.progressbarContainer
{
    position:absolute;
    width:320px;
    height:80px;    
    /*background-color:rgba(255,0,0,0.1);*/
    /*right:100px;*/
    left:245px;
    top:0px;
}
.truckContainer
{
    margin-top:5px;
    padding:0px;  
    position:relative;
    z-index:1;
    /*transition: all 2s ease;*/
}
.truckContainer>img
{
    transform:translateX(-50%);    
}
.truckContainer .downarrow
{
    margin-top:-5px;    
}

/**********************************************Progress-Bar***************************************************/
		.meter  
		{
			height: 20px;  /* Can be anything */
			position: relative;
			margin: 0px; /* Just for demo spacing */
			background: #555;
			-moz-border-radius: 25px;
			-webkit-border-radius: 25px;
			border-radius: 25px;
			/*padding: 10px;*/
			-webkit-box-shadow: inset 0 -1px 1px rgba(255,255,255,0.3);
			-moz-box-shadow   : inset 0 -1px 1px rgba(255,255,255,0.3);
			box-shadow        : inset 0 -1px 1px rgba(255,255,255,0.3);
		}
		.meter > span {
			display: block;
			height: 100%;
			   -webkit-border-top-right-radius: 8px;
			-webkit-border-bottom-right-radius: 8px;
			       -moz-border-radius-topright: 8px;
			    -moz-border-radius-bottomright: 8px;
			           border-top-right-radius: 8px;
			        border-bottom-right-radius: 8px;
			    -webkit-border-top-left-radius: 20px;
			 -webkit-border-bottom-left-radius: 20px;
			        -moz-border-radius-topleft: 20px;
			     -moz-border-radius-bottomleft: 20px;
			            border-top-left-radius: 20px;
			         border-bottom-left-radius: 20px;
			background-color: rgb(43,194,83);
			background-image: -webkit-gradient(
			  linear,
			  left bottom,
			  left top,
			  color-stop(0, rgb(43,194,83)),
			  color-stop(1, rgb(84,240,84))
			 );
			background-image: -moz-linear-gradient(
			  center bottom,
			  rgb(43,194,83) 37%,
			  rgb(84,240,84) 69%
			 );
			-webkit-box-shadow: 
			  inset 0 2px 9px  rgba(255,255,255,0.3),
			  inset 0 -2px 6px rgba(0,0,0,0.4);
			-moz-box-shadow: 
			  inset 0 2px 9px  rgba(255,255,255,0.3),
			  inset 0 -2px 6px rgba(0,0,0,0.4);
			box-shadow: 
			  inset 0 2px 9px  rgba(255,255,255,0.3),
			  inset 0 -2px 6px rgba(0,0,0,0.4);
			position: relative;
			overflow: hidden;
		}
		.meter > span:after, .animate > span > span {
			content: "";
			position: absolute;
			top: 0; left: 0; bottom: 0; right: 0;
			background-image: 
			   -webkit-gradient(linear, 0 0, 100% 100%, 
			      color-stop(.25, rgba(255, 255, 255, .2)), 
			      color-stop(.25, transparent), color-stop(.5, transparent), 
			      color-stop(.5, rgba(255, 255, 255, .2)), 
			      color-stop(.75, rgba(255, 255, 255, .2)), 
			      color-stop(.75, transparent), to(transparent)
			   );
			background-image: 
				-moz-linear-gradient(
				  -45deg, 
			      rgba(255, 255, 255, .2) 25%, 
			      transparent 25%, 
			      transparent 50%, 
			      rgba(255, 255, 255, .2) 50%, 
			      rgba(255, 255, 255, .2) 75%, 
			      transparent 75%, 
			      transparent
			   );
			z-index: 1;
			-webkit-background-size: 50px 50px;
			-moz-background-size: 50px 50px;
			background-size: 50px 50px;
			-webkit-animation: move 2s linear infinite;
			-moz-animation: move 2s linear infinite;
			   -webkit-border-top-right-radius: 8px;
			-webkit-border-bottom-right-radius: 8px;
			       -moz-border-radius-topright: 8px;
			    -moz-border-radius-bottomright: 8px;
			           border-top-right-radius: 8px;
			        border-bottom-right-radius: 8px;
			    -webkit-border-top-left-radius: 20px;
			 -webkit-border-bottom-left-radius: 20px;
			        -moz-border-radius-topleft: 20px;
			     -moz-border-radius-bottomleft: 20px;
			            border-top-left-radius: 20px;
			         border-bottom-left-radius: 20px;
			overflow: hidden;
		}
		
		.animate > span:after {
			display: none;
		}
		
		@-webkit-keyframes move {
		    0% {
		       background-position: 0 0;
		    }
		    100% {
		       background-position: 50px 50px;
		    }
		}
		
		@-moz-keyframes move {
		    0% {
		       background-position: 0 0;
		    }
		    100% {
		       background-position: 50px 50px;
		    }
		}
		
		
		.orange > span 
		{
		    margin:0px;
		    width:0px;
		    /*transition: all 2s ease;*/
			background-color: #f1a165;
			background-image: -moz-linear-gradient(top, #f1a165, #f36d0a);
			background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #f1a165),color-stop(1, #f36d0a));
			background-image: -webkit-linear-gradient(#f1a165, #f36d0a); 
		}
		
		
		.nostripes > span > span, .nostripes > span:after {
			-webkit-animation: none;
			-moz-animation: none;
			background-image: none;
		}
/**********************************************Progress-Bar***************************************************/	
.onlyBorder
{
    border:1px solid #555;    
}

.loadingeffect{
    height: 100%;
    min-height:40px;
    position: relative;
}
.loadingeffect>img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);    
}
.Date,.fromDate,.toDate
{
    width:72px;	
}
.createInvoiceContainer
{
    width:90%;
    margin:10px auto;    
}
.createInvoiceContainer .invoiceHeader>div
{
  width: 28%;
  display: inline-block;
  padding: 2px 2.66%;
}
.bindTable h2
{
    text-align:center;    
}
.vehicleInfoContainer
{
    display:none;    
}
.infoOverlay
{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    background-color: rgba(0,0,0,0);   
    cursor:not-allowed;   
}
.infoContainer
{
    display: inline-block;
    position:absolute;     
    transform: translateX(-50%);
}
.infoContainer .arrow
{
    width: 0px;
    font-size: 0px;
    border-width: 0px 15px 10px 15px;
    border-color: transparent transparent #363636 transparent;
    border-style: solid;   
}
.infoContainerContent
{
    border: 5px solid #363636;
    border-radius: 5px;
    padding: 5px 10px;
    background-color: #d6d6d6;
}
.saveUpdate,.cancel{
	width:40%;
	margin-right:5%;
	margin-top:10px;
	border: 0;
	margin-left:5px;
	padding:5px 0px;
	font-size:14px;
	display:inline-block;
	box-shadow: 0px 0px 5px;	
	cursor:pointer;
	transition:all .3s;
	background-color: rgb(221, 221, 221);
}
.saveUpdate
{
	color:Green;	
}
.cancel
{
	color:Red;	
}
.saveUpdate:hover
{
	box-shadow: 0px 0px 10px;
}
.cancel:hover
{
	box-shadow: 0px 0px 10px;
}
.checkboxContainer{
    text-align: left;
    background-color: rgba(54,54,54,0.5);
    border-radius: 25px;    
    margin: 2px auto;
    cursor:pointer;
}
.checkbox
{
    width: 15px;
    height: 15px;
    display: inline-block;
    background-color: #363636;
    border-radius: 50%;
    vertical-align: middle;
    margin: 5px 10px 5px 5px;
    border: 3px solid #363636;   
    cursor:pointer; 
}
.checkbox:hover
{
    background-color: #26b86f;  
}
.selectedCheckbox
{
    background-color: #26b86f;  
}
.CheckboxHover
{
    background-color: #26b86f;  
}
.checkboxLabel
{
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-weight: 400;
    cursor:pointer;
}
.userProfileInfoContainer
{
    position:relative;    
}
.userProfileInfo
{
	position: absolute;
	top: 0px;
	left: 120px;
	background-color: rgba(248, 248, 248, 1);
	padding: 2px 5px;
	border-radius: 0px 0px 5px 5px;
	box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.5);	
	transition:width ease .5s;
	z-index:1;
}
.usernameInfo
{
    padding-bottom:10px;
    cursor: pointer;
    text-align:center;
}
.usernameInfo img
{
	width: 16px;
	vertical-align:middle;
}
.usernameInfo span
{
	font-size:14px;
	vertical-align:middle;
}
.usernameDownArrow
{
    position: relative;    
}
.usernameDownArrow span
{
    /*color: #363636;*/
    color: rgba(54,54,54,0.23);
    position: absolute;
    top: -18px;
    left: 50%;
    transform: translateX(-50%);
    cursor: pointer;    
}
.userDetailsContainer
{
    font-size:14px;    
    padding: 2px 5px;
    border-bottom: 1px dashed #363636;
}
.Cell > p
{
    word-break: break-all;    
}
.buttonDiv
{
    text-align: right;    
}
.button {
    background: #363636 none repeat scroll 0 0;
    /*border: 2px solid;
    border-radius: 10px;
    box-shadow: 0 0 2px #363636;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    margin-left: 10px;
    padding: 1px 5px;
    text-align: center;
    transition: all 0.2s ease 0s;   
    vertical-align: middle;*/ 
    border: 2px solid;
    border-radius: 2px;
    box-shadow: 0 0 2px #363636;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 1em;
    font-weight: 400;
    margin-left: 10px;
    padding: 2px 5px;
    text-align: center;
    transition: all 0.2s ease 0s;
    vertical-align: middle;
}
.button:hover {
    background-color: #fff;
    box-shadow: none;
    color: #363636;
}
.button-green
{
   background: rgba(38,184,111,1) none repeat scroll 0 0;
}
.button-green:hover
{
    color: rgba(38,184,111,1);        
}
.button-red
{
   background: rgb(237, 67, 69) none repeat scroll 0 0;
}
.button-red:hover
{
    color: rgb(237, 67, 69);        
}
.button-blue {
    background: rgb(34, 140, 192) none repeat scroll 0 0;
}
.button-blue:hover {
    color:rgb(34, 140, 192);
}
.button-yellow {
    background: rgb(223, 159, 1) none repeat scroll 0 0;
}
.button-yellow:hover {
    color:rgb(223, 159, 1);
}
.dataPopup
{
    display:none;
}
.dataPopupOverlay
{
    position: fixed;
    background-color: rgba(0,0,0,0.5);
    width: 100%;
    height:100%;
    top: 0px;
    cursor: pointer;
    z-index: 999998;
}
.dataPopupContainer
{
    position: fixed;
    background-color: #fff;
    top: 50%;
    left: 50%;    
    transform: translate(-50%,-50%);
    padding: 20px 20px 10px 20px;
    z-index: 999999;
}
.field-container { 
    width:400px; 
    padding:20px;
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.4); 
    background-color:#fff;
}
.field {
    position:relative;
    margin-top:10px;
    margin-bottom:10px;
}
.field .text {
    width:calc(100% - 155px);
    padding-left:150px;
    margin:0;
    box-shadow: 0px 0px 1px 0.5px rgba(0,0,0,0.5);
}
.field .label {
    position:absolute;   
    width: 130px;
    padding: 4px 5px 5px;
    text-align: right;
    background-color: #e5e5e5;    
    border-right: 1px solid #ccc;
}
.field  div.text {
    min-height:21px;
    padding-top: 3px;
    padding-bottom: 4px;
    padding-right: 5px;
    cursor: not-allowed;
    word-break: break-word;
}
.field  textarea.text {
    /*max-width: 245px;*/
    max-height: 54px;
}
.field  select.text{
    margin-left: -3px;
    height: 30px;
    vertical-align: bottom;
    width: calc(100% - 142px);
    padding-left: 5px;
}
.field .label-select {
    box-shadow: 0px 0px 1px 0.5px rgba(0,0,0,0.5);
    position: static;
    display: inline-block;
}
.width400
{
    width:600px;
    height:400px;    
}
.width0
{  
    width:0px;
    height:0px;
}
.div90
{
    width: 90%;
    margin: 0 auto; 
}
.tab-panel-container {
    margin: 10px 0px;
}
.tab-container {
    width:19%;
    display:inline-block;
    margin-left:2px;
    vertical-align:top;
    position:relative;
}
/*.tab-container .tab-cell {
    border-bottom: 1px solid #fff;
    border-left: 2px solid #fff;
    padding: 2px 5px;
    background-color: #555;
    color: #fff;   
}*/
.tab-container .tab-cell {
    border-bottom: 1px solid #fff;
    border-left: 2px solid #fff;
    padding: 5px 10px;  
    transition:border-left-color ease-in .2s,color ease-in .2s;
    border-width:0px 1px 1px 5px;
    border-color:#363636;
    border-style:solid;
    cursor:pointer;
}
.tab-container .tab-cell:first-child {
    border-width:1px 1px 1px 5px;
}

.tab-container .tab-cell:hover,.tab-container .tab-cell.selected {
    border-left-color:#ef7b26 ;
    color:#ef7b26 ;
}
.tab-container .tab-cell.selected {
    border-right-color:#fff;
}
.panel-container {
    width:80%;
    display:inline-block;
    vertical-align:top;
    margin-left:-1px;
    border:1px solid #363636;
}
.panel-container .panel-cell {
    display:none;
}
.section {
    padding:5px 10px;
}
.section .half-section {
    width:49%;
    display:inline-block;
    vertical-align:top;
}
.section .one-third-section {
    width:33%;
    display:inline-block;
    vertical-align:top;
}
.section .two-third-section {
    width:65%;
    display:inline-block;
    vertical-align:top;
}
.section .one-fourth-section {
    width:24%;
    display:inline-block;
    vertical-align:top;
}
.section .three-fourth-section {
    width:74%;
    display:inline-block;
    vertical-align:top;
}
.link-list-container {
    position: relative;
}
.link-list-container .link-list-wrapper {
    position:absolute;
}
.link-list-container .link-list {
    position: relative;
    background-color: #555;
    width: 175px;
    padding: 4px 35px 4px 5px;
    margin: 10px 0px;
    border-left: 5px solid #ef7b26;
    cursor: pointer;
    color: #e5e5e5;
    font-size: 18px;
    border-radius: 0px 15px 15px 0px;
    z-index: 1;
}
.link-list-container .link-list span {
    transition:all ease .2s;   
}
.link-list-container .link-list:hover{
    color:#ef7b26;
}
.link-list-container .link-list .icon {
    position: absolute;
    width: 32px;
    height: 32px;
    background-color: #fff;
    border-radius: 50%;
    border: 4px solid #555;
    top: -4px;
    right: 0px;
}
div.Table-60 { width:calc(100% - 60px); }
div.Table-60.border,div.Table-0.border { border-top:1px solid #555; }
div.Table-0 { width:100%; }
.Table .text {
    box-shadow: none;
    border-bottom: 1px solid #ccc;
    padding: 0;
    margin: 0;
    height: auto;
    text-align: center;
    font-size:16px;
    font-weight:500;
}
.Table .transfer {
    display: inline-block;
    font-weight: bold;
    padding: 0px 5px;
    color: rgb(34, 140, 192);
    border-radius: 5px;
    line-height: 16px;
    font-size: 25px;
    cursor:pointer;
    transition:all ease .2s;
}
.Table .transfer:hover {
    color: #26B86F;
}
.details-title {
    display: inline-block;
    margin:0;
    margin-left: 30px;
    margin-top:10px;
    padding: 2px 5px;
    font-size:18px;
    font-weight:500;
}
.side-title {
    font-size: 1em;
    display: inline-block;
    color: #ef7b26;
    font-weight:400;
}
.side-title.orange {
    color:#ef7b26;
}
.side-title.red {
    background-color: rgb(237,67,69);
}
.side-title.yellow {
    background-color: rgb(223,159,1);
}
.side-title.light-grey {
    background-color: #ccc;
}
.side-title.grey {
    background-color: #363636;
}
.orange-title-container {
    text-align: center;
}
.orange-title {
    font-size: 1.5em;
    border-bottom: 1px solid;
    display: inline-block;
    margin-top: 5px;
    color: #ef7b26;
}
.message-container {
    text-align:center;
}
.message-container .message {
    display:inline-block;
    border: 0;
    font-size: 0.9em;
    font-weight: 500;
    /*color: #363636;*/
    margin: 0;
}
.message-container .message::before {
    content:'(Message :- ';
}
.message-container .message::after {
    content:')';
}
.colon-left::before,.colon-right::after {
    content: ' : ';
}
.hyphen-left::before, .hyphen-right::after {
    content:' - ';
}
.map-container {
    margin:10px;
}
.map {
    min-height:200px;
    box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
}
.image-view-container {
  
}  
.image-view-container .image-view-parent{
    vertical-align:bottom;
    text-align:center;
}
.image-view{
    width:100%;
    height:100%;
    box-shadow: 0px 0px 1px rgba(0,0,0,0.5);
    /*cursor:pointer;*/
}
.center-container {
    height: 100%;
    min-height:40px;
    position: relative;
}
.center-container>*{
    position: absolute;
    width:100%;
    text-align:center;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);    
}
a.link {
    color: #2ba6cb;
    font-weight: 400;
    cursor: pointer;
    text-decoration: none;
}
a.link:hover {
    text-decoration:underline;
}
.note {
    margin: 2px 5px;
    font-size: 0.8em;
    font-weight: 500;
}
.border-section-right { border-right:1px solid; }
.border-section-left { border-left: 1px solid; margin-left: -1px; }
.radio-container {

}
.radio-label, .radio-label * {
    vertical-align: middle;
    cursor: pointer;
}
.radio-label input[type="radio"] {
    width: 15px;
}
.radio-label span {
    vertical-align:baseline;
}
h2 { text-align:center; }
.m-0 { margin:0px; }
.m-top--1 { margin-top:-1px; }
.m-left--1 { margin-left:-1px; }
.m-right--1 { margin-right:-1px; }
.m-bottom--1 { margin-bottom:-1px; }
.m-top-0  { margin-top:0px; }
.m-top-5  { margin-top:5px; }
.m-top-10 { margin-top:10px; }
.m-top-15 { margin-top:15px; }
.m-top-20 { margin-top:20px; }
.m-top-25 { margin-top:25px; }
.m-left-0  { margin-left:0px; }
.m-left-5  { margin-left:5px; }
.m-left-10 { margin-left:10px; }
.m-left-15 { margin-left:15px; }
.m-left-20 { margin-left:20px; }
.m-left-25 { margin-left:25px; }
.m-bottom-0  { margin-bottom:0px; }
.m-bottom-5  { margin-bottom:5px; }
.m-bottom-10 { margin-bottom:10px; }
.m-bottom-15 { margin-bottom:15px; }
.m-bottom-20 { margin-bottom:20px; }
.m-bottom-25 { margin-bottom:25px; }
.m-right-0  { margin-right:0px; }
.m-right-5  { margin-right:5px; }
.m-right-10 { margin-right:10px; }
.m-right-15 { margin-right:15px; }
.m-right-20 { margin-right:20px; }
.m-right-25 { margin-right:25px; }
.p-0 { padding:0px; }
.p-top-0  { padding-top:0px; }
.p-top-5  { padding-top:5px; }
.p-top-10 { padding-top:10px; }
.p-top-15 { padding-top:15px; }
.p-top-20 { padding-top:20px; }
.p-top-25 { padding-top:25px; }
.p-left-0  { padding-left:0px; }
.p-left-5  { padding-left:5px; }
.p-left-10 { padding-left:10px; }
.p-left-15 { padding-left:15px; }
.p-left-20 { padding-left:20px; }
.p-left-25 { padding-left:25px; }
.p-bottom-0  { padding-bottom:0px; }
.p-bottom-5  { padding-bottom:5px; }
.p-bottom-10 { padding-bottom:10px; }
.p-bottom-15 { padding-bottom:15px; }
.p-bottom-20 { padding-bottom:20px; }
.p-bottom-25 { padding-bottom:25px; }
.p-right-0  { padding-right:0px; }
.p-right-5  { padding-right:5px; }
.p-right-10 { padding-right:10px; }
.p-right-15 { padding-right:15px; }
.p-right-20 { padding-right:20px; }
.p-right-25 { padding-right:25px; }
.w-0 { width: 0%; }
.w-5 { width: 5%; }
.w-10 { width: 10%; }
.w-15 { width: 15%; }
.w-20 { width: 20%; }
.w-25 { width: 25%; }
.w-30 { width: 30%; }
.w-35 { width: 35%; }
.w-40 { width: 40%; }
.w-45 { width: 45%; }
.w-50 { width: 50%; }
.w-55 { width: 55%; }
.w-60 { width: 60%; }
.w-65 { width: 65%; }
.w-70 { width: 70%; }
.w-75 { width: 75%; }
.w-80 { width: 80%; }
.w-85 { width: 85%; }
.w-90 { width: 90%; }
.w-95 { width: 95%; }
.w-100 { width: 100%; }

.w-11 { width: 11%; }
.w-22 { width: 22%; }
.w-33 { width: 33%; }
.w-44 { width: 44%; }
.w-66 { width: 66%; }
.w-88 { width: 88%; }

strong,.strong{font-weight:700;}
bold, .bold {font-weight:500;}
.italic {font-style:italic;}
.oblique {font-style:oblique;}
.v-align-baseline {vertical-align:baseline;}
.v-align-middle {vertical-align:middle;}
.v-align-top {vertical-align:top;}
.text-left   { text-align:left; }
.text-right  { text-align:right; }
.text-center { text-align:center; }
.position-relative { position:relative; }
.position-absolute { position:absolute; }
.orange {color:#ef7b26;}
.red {color: rgb(237,67,69);}
.yellow {color: rgb(223,159,1);}
.light-grey {color: #ccc;}
.grey {color: #363636;}
.blue {color:rgb(34, 140, 192);}
.red {color:rgb(237, 67, 69);}
.green {color: rgb(38,184,111); }
.disabled {pointer-events: none;}
.uppercase {text-transform:uppercase;}
.lowercase {text-transform:lowercase;}
.capitalize {text-transform:capitalize;}
.hide{display:none;}
.display-inline-block{display:inline-block;}
.no-border { border:none; }