@charset "windows-1251";
/* CSS Document */

* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}

html, body {
  height: 100%;
  width: 100%;
}

body {
	font-family: "MS Sans Serif";
	font-weight:normal; 
    font-size:14px;
	color:#333333;
}


img {border:none;}
/*div { border: 1px solid red;} /*ONLI FOR DEVELOPMENT*/

.pointer{cursor:pointer;}
/*.rowclickable{background-color: #666;}*/

.nodisplay{display: none;}
.invisible{visibility:hidden;}
.visible_my{visibility:visible;}

.font_shadow{
	text-shadow: 0.5px 0.5px #999;
}

.color_white{
	color: white;
}


.topbar{
	position:fixed;
	height:70px;
	width:100%;
	border-bottom:2px solid #8EC82F;
	border-bottom:2px solid #f5f5f5;
	z-index:1000;
	background-color:#fafafa;
	
}



.logowraper{
	float:left;	
	width:280px;
	height:70px;
	/* background-color:#333; */
	/*background-color:#001E3C;*/
	/*color:#8EC82F;*/
	font-size:24px;		
}



.logo{
	float:left;
	margin-left:30px;
	margin-top: 25px;
	width:30px;	
}

.logan{
	float:left;
	margin-left:20px;
	margin-top: 27px;
	color:#D3D3D3;	
}

.iconexpand{
	float:left;
	margin-top: 15px;
	margin-left:30px;
	color:#8EC82F;
	display:none;
	cursor:pointer;
}

.mainfirm_div{float: left; margin-top:25px; margin-left:5%; font-size: 16px;}


 /* .mainfirm_div{float: right; margin-top:25px; margin-right:30%; font-size: 16px;} */
.logoffdiv{float:right; margin-top:15px; margin-right:5%;}
.logofficon{font-size:32px;}



.leftbar{
	float:left;
	width:280px;
	height:100%;	
	/* background-color:#333; */
	background-color:#333;
	/*background-color:#001E3C;*/
	color:#999;
	padding-top:150px;
	
	overflow-y:scroll;
	scrollbar-width: thin;
	text-indent:10px;
	
}

::-webkit-scrollbar {
    height: 12px;
    width: 12px;
    /* background: #000; */
}

.leftbar a{
	color:#999;
	text-decoration: none;
}

.leftbar a:hover {
	color:#C0C0C0;
}


.delicon {
	cursor: pointer;	
}

.leftbar a:active {
	color:#C0C0C0;	

}

.jslink{
	cursor: pointer;
	color: #004080;
	text-decoration: none;
}
.jslink:hover{
	color:#8EC82F;
}

.filter > .jslink {
	margin-left: 20px;
}

.operations > .jslink {
	margin-right: 20px;
	margin-top: 50px;
}


.zdiv , .popup{
	position:absolute;
	min-height:200px;
	width:310px;
	padding-top: 5px;
	z-index:9000;
	background-color: white;
	text-align: center;
	border:1px solid #8EC82F;
	cursor: pointer;
}



.langdiv{
	position:absolute;
	min-height:50px;
	width:40px;
	padding-top: 10px;
	z-index:9000;
	background-color: white;
	text-align: center;
	border:1px solid #f5f5f5;
	cursor: pointer;
	display: none;
	font-size: 18px;
}

.langdiv p{
	padding-top: 5px;
	padding-bottom: 10px;
}

.actiondiv{
	position:absolute;
	min-height:50px;
	width:130px;
	padding-top: 10px;
	padding-left: 10px;
	z-index:9000;
	background-color: white;
	/* background-color:#333; */
	/* background-color:#fafafa; */
	/* text-align: center; */
	/* border:1px solid #8EC82F; */
	border:2px solid #f5f5f5;
	cursor: pointer;
	display: none;
	/* font-size: 18px; */
}

.actiondiv p{
	padding-top: 5px;
	padding-bottom: 10px;
}

.popup{	
	width:400px;
	height:250px;
	overflow-y: scroll;
	text-align: left;
	padding: 10px;
}

.popup p{padding-top: 5px;}


.rightbar{
	/*background-color:#999;*/
	padding-top:100px;
	padding-bottom: 150px;
	height:100%; 
	overflow-y:scroll;
	scrollbar-width: thin;
	text-align:center;
}


.nav{
	width:100%;
	margin-top:20px;
	cursor:pointer;	
}

.navicons{
	font-size:20px;
}

.navlink{
	font-size:16px;
}

.navlink:hover {
	color:#C0C0C0;
}

.navlink div:nth-child(1){
	float: left;
	width: 200px;
}

.navlink div:nth-child(2){
	float: right;
	width: 48px;
}



/*.subnavline{	
	text-indent:54px;
	margin-top:10px;
}
*/
.navchildren{
	display:none;
}

.navchildren div{
	text-indent:30px; 
	margin-top:15px;
}

.green_dot{
	font-size: 20px;
	color:#8EC82F;
	text-indent: 0px;
	visibility: hidden;
}

.material-icons-outlined {
    position: relative;
    top: 5px; /*Change this to adjust the icon*/
}





.nav , .iconexpand , .logowraper {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}


.filter{
	position:relative;
	margin:15px auto;
	width:80%;
	max-width:600px;
}

.filter div:nth-child(1){
	height:30px;
	background-color:#C9C9C9;
	background-color:#D9D9D9;
	color:#333;
	font-weight:bold;
	border-top:2px solid #004080;
}

.filter div:nth-child(1) span:nth-child(1){
	float: left;
	margin-top: 5px;
	margin-left: 10px;
}

.filter div:nth-child(1) span:nth-child(2){
	float: right;
	margin-right: 10px;
}

.filter div:nth-child(2){
	text-align: left;
	padding-left: 20px;
	padding-top: 10px;
	display: none;
	max-height: 500px;
	overflow-y: scroll;
}



.div_datetime{
	position:relative;
	margin:5px auto;
	width:400px;	
}


input , select {
    height: 25px;
    padding: 0 6px;
    line-height: 25px;
	font-size:14px;
	background-color:#F5F5F5;
	border:1px solid #CCC;
	border:1px solid #8EC82F;
	outline: none;
}

input[type="checkbox"]{
    vertical-align:middle;
}

/* input[type="button"] ,  */

input[type="submit"]{
    background-color:#a2b388;
    background-color:#bfbfbf;
    color: #333;
    -webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

.buttoncpecial{
	background-color:#DEF0BF;
	border:1px solid #8EC82F;
}


.login{
	position:relative;
	margin:0 auto;
	width:350px;
	min-height:200px;
	background-color:#E8E8E8;
	padding-top:20px;
	padding-bottom:20px;
	
	border:1px solid  #C4C4C4;
	border-top:4px solid #C4C4C4;
	/*
	border-bottom:4px solid  #333;
	border-radius: 5px 5px 5px 5px;*/	
}

.login input{
	height: 30px;
	line-height: 30px;
	font-size:16px;
	margin-top:20px;
}

.w40{width:40px;}
.w50{width:50px;}
.w60{width:60px;}
.w70{width:70px;}
.w100{width:100px;}
.w130{width:130px;}
.w150{width:150px;}
.w180{width:180px;}
.w200{width:200px;}
.w250{width:250px;}
.w300{width:300px;}
.w350{width:350px;}
.w360{width:360px;}
.w400{width:400px;}
.w800{width:800px;}

.w5pr{width:5%;}
.w10pr{width:10%;}
.w15pr{width:15%;}
.w20pr{width:20%;}
.w25pr{width:25%;}
.w30pr{width:30%;}
.w35pr{width:35%;}
.w40pr{width:40%;}
.w45pr{width:45%;}
.w50pr{width:50%;}
.w55pr{width:55%;}
.w60pr{width:60%;}
.w65pr{width:65%;}
.w70pr{width:70%;}
.w75pr{width:75%;}
.w80pr{width:80%;}
.w85pr{width:85%;}
.w90pr{width:90%;}
.w95pr{width:95%;}
.w100pr{width:100%;}

.h30{height: 30px;}
.h40{height: 40px;}
.h100{height: 100px;}
.hauto{height: auto;}


.fs80{font-size: 80px;}
.fs18{font-size: 18px;}
.fs12{font-size: 12px;}
.fs10{font-size: 10px;}
.fs48{font-size: 48px;}

.top4{top: 4px;}



.visible{display: block;}
/*.fclear{display: none;}*/
.calendar , .filter div:nth-child(1) {cursor: pointer;}


.clear{clear:both;}


.infodiv{
	position:relative;
	margin:5px auto;
	padding: 10px;
	width:400px;
	border-radius: 3px;	
}


.errordiv{
	position: relative;
	margin: 0px auto;
	background-color: #FFC6C6;
	border: 1px solid #FF8484;
	width: 90%;
	max-width: 600px;
}

.okdiv{
	background-color: #d8ff96 ;
	border: 1px solid #8EC82F;
}

.usertab{
	position:relative;
	margin:10px auto;
	/*padding: 5px;*/
	width:60%;
	min-width: 400px;
	/*height: 200px;*/
	/*min-height: 30px;*/
	font-size: 14px;
	border-radius: 3px;
	/*background-color: #d8ff96 ;*/
	border: 1px solid #8EC82F;
}

.usertab_head{
	background-color:#d1eba7; 
	color: #4f4f4f; 
	height:35px;
	cursor: pointer;
}

.usertab_1{
	float: left;
	width: 50%;
	text-align: left;
	border: 0px solid red;
}	
.usertab_2{
	float: right;
	width: 50%;
	text-align: right;
	border: 0px solid red;
}	


.table_data{
	position: relative;
	margin: 0px auto;
	width:90%;
	padding-bottom: 200px;
}

table{border-collapse: collapse;}
th, td {
  /*border-bottom: 1px solid #ddd;*/
  padding: 5px;
}
tr:nth-child(odd) {background-color: #f2f2f2;}
th{	background-color:#f2ffde; color:#333;}


table .head1{background-color: #f2f2f2; font-weight: bold; }
table .head2{background-color: transparent; font-weight: bold; }
table .item1{background-color: transparent;}
table th {height: 40px;}
.advertisment{text-align: center; margin-top: 100px;}

.sumrow1{
	font-weight:bold; 
	
}





.maincard{
	width:250px;
	height:80px;
	/* float:left; */
	display: inline-block;
	margin-left:6%;
	margin-top:20px;
	background-color:#F9F9F9;
	border: 1px solid #CCCCCC;
	
  	border-radius: 5px 5px 5px 5px;
	text-align:center;
	font-size:24px;
}

.fc{
	float: none;
	display: inline-block;
}

.cardicon{
	width:30%;
	margin-top:10px;
	border: 0px solid red;
	float:left;
}

.cardvalue{
	width:60%;
	margin-top:10px;
	border: 0px solid red;
	float:left;
}

.cardvalue p:nth-child(1){
	margin-top:15px;
}
.cardvalue p:nth-child(2){
	margin-top:5px;
}








.rowclickable_down{background-color:#999; } /*#f2ffde;*/

.docwrapper{
	position: relative;
	margin:100px auto;
}



.doctitle{
	text-align:center;
	font-weight:bold;
	font-size:18px;
}

.invoice_headers{
	font-size:12px;
	font-weight:bold;
}


.containerflex{
	display:flex;
	height: 100%;
 	flex-flow: column;  	
	background-color:#FFC; 	
}

.top_side{
	flex: none;
	height:70px;
	background-color:#999;
	overflow:visible; 
}

.bottom_side {
	
	display:flex;
	background-color: #DDDDDD;
	flex-grow : 1;
}



.left_tab{
	flex: none;
	width:300px;
	height:100%;	
	background-color:#840; 
	
}

.right_tab{
	flex-grow : 1;			
	background-color:#845; 
}

.navigation{
	width:100%;
	background-color:#333;
	height:100%;
	overflow-y: scroll;
}

.fl{float: left;}

.kiosk_div{
	float:left; 
	width:210px; 
	height:120px; 
	margin-left:10px; 
	margin-top:10px;
	padding-top: 5px;
	background-image: url('/images/kiosk_tab.png');
	background-repeat: no-repeat;
}

.kiosk_wrapper1{
	float: left;
	width: 40%;
	border: 1px solid green;
	margin-top: 150px;
	text-align: center;
}

.kiosk_wrapper2{
	float: left;
	width: 55%;
	border: 1px solid green;
	margin-top: 150px;

}

.kiosk_wrapper3{
	position: relative;
	margin: 0px auto;
	width: 100%;
	margin-top:20px;
	padding-top: 10px;
	background-color:#F9F9F9;
	border: 1px solid #CCCCCC;
	
  	border-radius: 5px 5px 5px 5px;
}	
.terminal_fail_div{
	clear: both;
	position: relative;
	margin: 0px auto;
	margin-top: 100px;
	width: 90%;
	max-width: 1000px;
	
}
.kiosk_data{
	width: 350px;
	/* background-color: yellow; */
}

.kiosk_icon{
	width: 150px;
	float: left;
}

.kiosk_statusicons{
	float:right; 
	margin-right:15px;
	width:30px;
	/* border: 1px solid red;  */
	/* padding-top:10px; */
}

.mt15{
	margin-top: 5px;
}
.kiosk_parts{
	text-align: left;
	width: 170px;
	padding-top: 10px;
	float: left;
}

/* .chart_div{
	float: left;
	width:48%;
	min-width: 500px;
	margin-top: 100px;
	margin-left: 1%;
} */

.advertisment_1{
	margin-top: 100px;
	text-align: center;
}

.iconok{
	color:#8EC82F;
	font-size: 32px;
	/* position: relative;
	top: -5px; */
}



.iconerr{
	color:red;
	font-size: 32px;
	position: relative;
	top: 5px;
}

.kioskicons{
	/* color:#4f4f4f; */
	color:#666;
	font-size: 32px;
}

.myfloat{
	float:right;
}

@media only screen and (min-width: 1320px) {
	.chart_div {
		float: left;
		width:48%;
		min-width: 500px;
		margin-top: 100px;
		margin-left: 1%;
	}
  }

@media only screen and (max-width: 1321px) {
	.chart_div {
		float: left;
		width:100%;
		margin-top: 100px;
	}
  }

.selected_firms , .selected_cards{
	margin-top: 10px;
}

#map {
    height: 100%;
    width: 100%;
  }
  
.fuelPrice{
	display: inline-block;
	border: 1px solid red;
	margin-left: 10%;
}

textarea {
    resize: none;
}

.goodselect_div {
	/* display: none; */
	/* background-color: #845; */
	width: 90%;
	margin: 0px auto;
}

.posfixed{
	background-color:#8EC82F;
	position:fixed;
	top: 300px;
	left: 300px;
}

#dialog{
	width: 100%;
	z-index: 1000;
}
.ucfirst{
	text-transform: capitalize;
}

.tac{
	position: relative;
	padding: 0px auto !important;
	/* margin-top:10px;
	margin-bottom: 10px;
	margin-left: auto;
	margin-right: auto; */

	text-align: center;
}

.testmargin{
	width:99%;
	border:1px solid red;
	position: relative;
	padding: 0px auto;
}

.tbl_center{
	width:90%;
	margin-left:5%;
	
}

.ib{
	display: inline-block;
	margin-top:10px;
	/* width: 90%; */
}

.ib input{
	margin-top: 10px;
}
#tabs{
	width: 90%;
	margin-top: 20px;
}
thead {
	text-align: center;
}

.tal{
	text-align:left;
}
.tar{
	text-align:right;
}
.tac{
	text-align:center;
}

.chargepoint_container{
	width: 200px;
	float: left;
	margin-left: 10px;
	padding-top: 5px;
	margin-top: 10px;
	border: 1px solid #f5f5f5;
	border-radius: 5px;
	background-color:#f5f5f5;
	/* color:#555454; */
}

.connector_container{
	border: 0px solid #f5f5f5;
	margin-bottom: 10px;
}
.ev_connector_div{
	float:left; 
	width:48%; 
	text-align:left;
}



.ev_connector_status{
	clear:both;
	font-weight:bold;
	/* color:lightskyblue;
	color:lightblue;
	color:#004080; */
	
	
}

.filled {
	font-variation-settings: "FILL" 1; /* Filled icon */
}

.tree_icon_additional{
	font-size: 18px;
	color:green;
	position:relative;
	/* margin-top: 10px; */
}
.del_barcode{
	font-size: 24px;
}


.td_searchmaterial {
    width: 200px;  /* Set a fixed width */
    white-space: nowrap; /* Prevent text from wrapping */
    overflow-x: auto; /* Enable horizontal scrolling if needed */
}

.searchmaterial{
	display: none;
}