@font-face {
    font-family: NeoSansProRegular;
    src: url("NeoSansProRegular.otf") format("opentype");
}


:root {
	--tagify-dd-color-primary: #7BA87D !important;
	--tagify-dd-bg-color:white;
}

span {
	position: relative;
	display: inline-block;
}

.faIcon {
	z-index: 1;
    position: relative;
	color: white;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    vertical-align: super;
}

.faIconLeft {
	z-index: 1;
    position: relative;
	display: inline-flex;
	left: -1em;
	color: white;
}

thead th,
thead td {
	background-color: #ffffff !important;
}
tbody th,
tbody td {
	border-bottom: 1px solid #e6e6e6 !important;
	word-break: break-all;
}

tbody tr:last-child td {
	border-bottom: 0px !important;
}

/*
tbody tr {
	background-color: #ffffff !important;
}
tbody tr:nth-child(even) {
	background-color: #eeeeee !important;
} */ 


.popupIcon {
	margin: 10px;
}

.formCenter {
	max-width:  800px;
	margin-left: auto;
	margin-right: auto;
}

.imgCenter {
	display: block;
	margin: 2px auto;
	cursor: pointer;
	font-size: 2.2vw;
}

.header, .footer {
	z-index: 1005 !important;
}

.titleMain {
	padding: 0px 15px;
}

form div[data-role="collapsibleset"] {
	padding: 5px 15px;
}

/* Override style =================================*/
.ui-icon-fa{
	 text-indent: 0px !important;
	text-shadow: none !important;
	text-align: inherit !important;  
}


.ui-checkbox{
	margin: 0px !important;
}

.inputWapper {
    max-width:  800px;
}

li > a {
	font-size: 12px !important;
}

.ui-overlay-a {
	color: #333 !important;
    text-shadow: 0 1px 0 #f3f3f3 !important;
}

.ui-popup-screen {
	height: auto !important;
}

.ui-select {
	margin-left: 0px !important;
	margin-right: 0px !important;
}

.ui-select .ui-btn {
	padding: 0.4em !important;
}

.jconfirm-box {
	min-width: 200px;
	max-width: 800px;
}
.jconfirm-box-small .jconfirm-box {
	min-width: 200px;
	max-width: 400px;
}

.ui-btn.ui-input-clear {
	 margin: -14px 6px !important;
}

.ui-page-theme-a a, label.ui-btn {
	font-weight: normal !important;
	text-align: left !important;
}

.ui-page-theme-d a, label.ui-btn {
	font-weight: normal !important;
	text-align: left !important;
}



.ui-bar-c {
	border-width: 0px !important;
}

.ui-body-c {
	background-color: rgba(0, 0, 0, 0.2) !important;
	border-width: 0px !important;
}

/* Change dafault (17em) width of right panel ==== */
.ui-panel-position-right{
	width: 18em !important;
}

 .ui-panel-animate.ui-panel-position-right.ui-panel-display-overlay, .ui-panel-animate.ui-panel-position-right.ui-panel-display-push {
  right: 0;
  -webkit-transform: translate3d(18em,0,0) !important;
  -moz-transform: translate3d(18em,0,0) !important;
  transform: translate3d(18em,0,0) !important;
}

.ui-panel-animate.ui-panel-open.ui-panel-position-right.ui-panel-display-overlay, .ui-panel-animate.ui-panel-open.ui-panel-position-right.ui-panel-display-push {
  -webkit-transform: translate3d(0,0,0) !important;
  transform: translate3d(0,0,0) !important;
  -moz-transform: none !important;
}

/* flipswitch override for .appPushOut ============*/
.appPushOut .ui-btn.ui-flipswitch-on{
	font-weight: 700 !important;
}

.appPushOut .ui-flipswitch a:hover{
	color:unset !important;
	text-shadow: unset !important;
}

.appPushOut .ui-flipswitch.ui-flipswitch-active{

	background-color: #7cd26c !important;
    border-color: #7cd26c !important;
    color: #fff !important;
    text-shadow: 0 1px 0 #5cc24c !important;
}

.appPushOut .ui-flipswitch{

	background-color: #ebb22f !important;
    border-color: #ebb22f !important;
    color: #fff !important;
    text-shadow: 0 1px 0 #ebb22f !important;
}
/*=================================================*/


.tableColumnCheckbox .ui-mini{
	font-size: 9.5px !important;
}

.tableColumnCheckbox .ui-btn.ui-flipswitch-on{
	font-weight: 700 !important;
}

.tableColumnCheckbox .ui-flipswitch a:hover{
	color:unset !important;
	text-shadow: unset !important;
}

.tableColumnCheckbox .ui-flipswitch.ui-flipswitch-active{

	background-color: #2ad !important;
    border-color: #2ad !important;
    color: #fff !important;
    text-shadow: 0 1px 0 #5cc24c !important;
}

.tableColumnCheckbox .ui-flipswitch{
	margin: 0px !important;
    color: #fff !important;
}
.tableColumnCheckbox .ui-flipswitch{
	width: 4em;
}
.tableColumnCheckbox .ui-flipswitch.ui-flipswitch-active {
    padding-left: 2.1em ;
}

/* Fields validations =============================*/
.fieldInvalid {
	border-color: coral !important;
	border-width: 2px !important;
}

.fieldInvalidText {
	color: coral !important;
}

.fieldInvalidTitle {
	float: left;
	padding-right: 10px;
	color: coral !important;
}

.fieldInvalidCommonText {
	float: right;
	margin-right: 10px !important;
	color: coral !important;
	line-height: 70px;
}
/*=================================================*/

/* UI loading======================================*/
.ui-loader-background {
	width:100%;
	height:100%;
	top:0;
	padding: 0;
	margin: 0;
	background: rgba(0, 0, 0, 0.3);
	display:none;
	position: fixed;
	z-index:1010;
}
.ui-loading .ui-loader-background {
	display:block;
}
/*=================================================*/

/* Info box =======================================*/

#infoBox_div {
	position: fixed;
	display: block;
	top: 82px;
	right: 18px;
	background-color: rgba(0,0,0,0.5);
	z-index: 6;
	cursor: pointer;
	padding-right: 32px;
	height: 32px;
	overflow: hidden;
}

#infoBox_divIcon{
	position: absolute;
	right: 5px;
	top: 5px;
	line-height: 1em;
	font-size: 22px;
}

#infoBox_divCustomerName {
	font-size: 16px;
	text-align: center;
	padding-top: 2px;
	margin-left: 8px;
	line-height: 32px;
}

/*=================================================*/

/* Password fields ================================*/
.password .controlgroup-textinput{
	padding: 0 !important;
	width: 100%;
}

.password .ui-controlgroup-controls {

	width: 100%;
	display: flex !important;
}

.password .ui-controlgroup-controls button{
	padding: 0.5em !important;
    width: 30px !important;
}
/*=================================================*/

/* Spin Animation =================================*/
.spin {
	transition: transform 1s ease !important;
	transform: rotateY(360deg) ;
}
/*=================================================*/


/* Menu horizontal default ========================*/
.ui-panel{
	position:fixed !important;
	top: 50px !important;
}

.logo {
	position: absolute;
	left: 15px;
	top:8px;
	line-height: 59px; 
	font-family: 'NeoSansProRegular';
	display: table;
	font-size: 2.8vw;
}

.logoImg{
	height: 2.2vw;
}


.navMenu{
	margin: 15px 20%;
}

.ui-navbar ul {
	width: 100%;
}

.ui-navbar li {
	width: 25%;
}

.ui-navbar li:first-child {
	width: calc(10% - 3px);
}

.ui-navbar li:first-child a {
	visibility: collapse;
	line-height: 25px;
}

.ui-navbar li:not(:first-child) a {
	visibility: visible;
	text-align: center;
	line-height: 25px;
}
/*=================================================*/

/* Menu right panel default =======================*/
.rightMenu-left{
	float: left;
}
.rightMenu-right{
	float: right;
}
/*=================================================*/

.inLineButtons {
		width: 225px;
	}


/* Media breakpoints (grids, menu and panels)======*/

/* horizontal */
@media (max-width: 100em) {

	.columntoggle th.priority-7,
	.columntoggle td.priority-7 {
	  display: none !important;
	}

}

@media (max-width: 90em) {

	.columntoggle th.priority-6,
	.columntoggle td.priority-6 {
	  display: none !important;
	}
}

@media (max-width: 80em) {

	.columntoggle th.priority-5,
	.columntoggle td.priority-5 {
	  display: none !important;
	}
}

@media (max-width: 70em) {

	.columntoggle th.priority-4,
	.columntoggle td.priority-4 {
	  display: none !important;
	}
}

@media (max-width: 60em) {
	.blockContainer .ui-block-a,
	.blockContainer .ui-block-b,
	.blockContainer .ui-block-c,
	.blockContainer .ui-block-d,
	.blockContainer .ui-block-e {
		width: 100% !important;
		float: none;
	}

	.columntoggle th.priority-3,
	.columntoggle td.priority-3 {
	  display: none !important;
	}

}

@media (max-width: 50em) {

	.columntoggle th.priority-2,
	.columntoggle td.priority-2 {
	  display: none !important;
	}

}

@media (max-width: 40em) {

	.columntoggle th.priority-1,
	.columntoggle td.priority-1 {
	  display: none !important;
	}

}

@media (max-width: 35em) {
	.columntoggle td.priority-1,
	.columntoggle td.priority-2,
	.columntoggle td.priority-3,
	.columntoggle td.priority-4,
	.columntoggle td.priority-5,
	.columntoggle td.priority-6  {
	  display: table-cell !important;
	}
	/* Table handle last item ==============*/
	tbody tr:last-child td {
		border-bottom: 1px solid #e6e6e6 !important;
	}
	tbody tr:last-child td:last-child {
		border-bottom: 0px !important;
	}
	/* =====================================*/

	.multiSelect{
		display: inline !important;
	}

	.ui-table-cell-label div{
		display: none;
	}

	.ui-table-cell-label{
		float: left !important;
		
	}


	.ui-table-reflow td .ui-table-cell-label{
		min-width: 40% !important;
		margin: 0px !important;
		padding: 0px !important;
	}

	/* Menu vertical default ===============*/
	.logo {
		position: absolute;
		margin-left: auto;
		margin-right: auto;
		left: 0px;
		right: 0px;
		top:5px;
		font-size: 5vw;
	}

	.logoImg{
		height: 4.4vw;
	}

	.navMenu {
		margin: 15px;
	}

	.ui-navbar ul {
		margin:0px !important;
		width: 100%;
	}

	.ui-navbar {
		max-width: 100% !important;
	}

	.ui-panel
	.ui-navbar li:first-child {
		width: 30px;
	}

	.ui-navbar li:first-child a {
		visibility: visible ;
		text-align: center;
		width: 30px;
	}

	.ui-navbar li:not(:first-child) a {
		visibility: collapse;
		text-align: left;
	}

	.navbarFirst, .navbarLast {
		border-radius: 0px;
	}
	/*======================================*/

	/* Menu expland from button ============*/
	.menuExpandHeader {
		height: auto;
	}

	.menuExpandText {
		visibility:visible !important;
		margin: 0px !important;
	}

	.menuExpandElement {
		width:100% !important;
	}

	.menuExpandPanel {
		/* top: 170px !important; */
		top: 214px !important;
	}
	/*======================================*/

	/* Menu Collapse from button ========== */
	.menuCollapseHeader {
		height: 75px;
	}

	.menuCollapseText {
		visibility:collapse !important;
	}

	.menuCollapseElement {
		width:25% !important;
	}

	.menuCollapsePanel {
		top: 50px !important;
	}
	/*======================================*/

	.ui-navbar .ui-link.ui-btn
	{
		font-size: 16px !important;
		line-height: 16px;
	}
	
	.ui-navbar .ui-link.ui-btn:hover
	{
		background-color: #7BA87D !important;
		-webkit-box-shadow: 0 0px 0px #7BA87D !important /*{d-active-background-color}*/;
		-moz-box-shadow: 0 0px 0px #7BA87D !important /*{d\-active-background-color}*/;
		box-shadow: 0 0px 0px #7BA87D !important /*{d-active-background-color}*/;
	}

	
	.ui-navbar .ui-link.ui-btn.ui-btn-active
	{
		background-color: #7BA87D !important;
		-webkit-box-shadow: 0 0px 0px #7BA87D !important /*{d-active-background-color}*/;
		-moz-box-shadow: 0 0px 0px #7BA87D !important /*{d\-active-background-color}*/;
		box-shadow: 0 0px 0px #7BA87D !important /*{d-active-background-color}*/;
	}

}

@media (min-width: 70em){

	.logoImg{
		height: 25px;
	}
	.logo{
		font-size: 35px;
	}

	.ui-link.ui-btn
	{
		font-size: 18px !important;
	}

	#infoBox_div {
		top: 88px !important;
	}
}


/* Vertical */
@media (min-height: 25em){

	.rightMenu-left{
		float: none;
	}
	.rightMenu-right{
		float: none;
	}

}
.input-file{
	position: absolute;
	width: calc(100% - 34px);
	box-shadow:none !important;
}
/*=================================================*/

.gauge-container > .gauge > .dial {
	stroke: #334455;
	stroke-width: 2;
  }

  .gauge-container > .gauge > .value {
	stroke: rgb(47, 227, 255);
	stroke-width: 2;
  }

  .gauge-container > .gauge > .value-text {
	fill: rgb(47, 227, 255);
	font-family: sans, 'sans-serif';
	font-weight: bold;
	font-size: 0.6em;
  }



/* tbody {
    display:block;
    height:200px;
    overflow:auto;
}
thead, tbody tr {
    display:table;
    width:100%;
    table-layout:fixed;
}
thead {
    width: calc( 100% - 1em )
} */