/* Regular */
@font-face {
	font-family: 'Open Sans Regular';
	src: url('../fonts/OpenSans-Regular-webfont.eot');
	src: url('../fonts/OpenSans-Regular-webfont.eot?#iefix')
		format('embedded-opentype'),
		url('../fonts/OpenSans-Regular-webfont.woff') format('woff'),
		url('../fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
		url('../fonts/OpenSans-Regular-webfont.svg#OpenSansRegular')
		format('svg');
	font-weight: normal;
	font-weight: 400;
	font-style: normal;
}

/* Italic */
@font-face {
	font-family: 'Open Sans';
	src: url('../fonts/OpenSans-Italic-webfont.eot');
	src: url('../fonts/OpenSans-Italic-webfont.eot?#iefix')
		format('embedded-opentype'),
		url('../fonts/OpenSans-Italic-webfont.woff') format('woff'),
		url('../fonts/OpenSans-Italic-webfont.ttf') format('truetype'),
		url('../fonts/OpenSans-Italic-webfont.svg#OpenSansItalic')
		format('svg');
	font-weight: normal;
	font-weight: 400;
	font-style: italic;
}

/* Light */
@font-face {
	font-family: 'Open Sans Light';
	src: url('../fonts/OpenSans-Light-webfont.eot');
	src: url('../fonts/OpenSans-Light-webfont.eot?#iefix')
		format('embedded-opentype'),
		url('../fonts/OpenSans-Light-webfont.woff') format('woff'),
		url('../fonts/OpenSans-Light-webfont.ttf') format('truetype'),
		url('../fonts/OpenSans-Light-webfont.svg#OpenSansLight') format('svg');
	font-weight: 200;
	font-style: normal;
}

/* Light Italic */
@font-face {
	font-family: 'Open Sans';
	src: url('../fonts/OpenSans-LightItalic-webfont.eot');
	src: url('../fonts/OpenSans-LightItalic-webfont.eot?#iefix')
		format('embedded-opentype'),
		url('../fonts/OpenSans-LightItalic-webfont.woff') format('woff'),
		url('../fonts/OpenSans-LightItalic-webfont.ttf') format('truetype'),
		url('../fonts/OpenSans-LightItalic-webfont.svg#OpenSansLightItalic')
		format('svg');
	font-weight: 200;
	font-style: italic;
}

/* Semibold */
@font-face {
	font-family: 'Open Sans Semibold Title';
	src: url('../fonts/OpenSans-Semibold-webfont.eot');
	src: url('../fonts/OpenSans-Semibold-webfont.eot?#iefix')
		format('embedded-opentype'),
		url('../fonts/OpenSans-Semibold-webfont.woff') format('woff'),
		url('../fonts/OpenSans-Semibold-webfont.ttf') format('truetype'),
		url('../fonts/OpenSans-Semibold-webfont.svg#OpenSansSemibold')
		format('svg');
	font-weight: 500;
	font-style: normal;
}

/* Semibold */
@font-face {
	font-family: 'Open Sans Semibold Regular';
	src: url('../fonts/OpenSans-Semibold-webfont.eot');
	src: url('../fonts/OpenSans-Semibold-webfont.eot?#iefix')
		format('embedded-opentype'),
		url('../fonts/OpenSans-Semibold-webfont.woff') format('woff'),
		url('../fonts/OpenSans-Semibold-webfont.ttf') format('truetype'),
		url('../fonts/OpenSans-Semibold-webfont.svg#OpenSansSemibold')
		format('svg');
	font-weight: 400;
	font-style: normal;
}

/* Semibold Italic */
@font-face {
	font-family: 'Open Sans Semibold Italic';
	src: url('../fonts/OpenSans-SemiboldItalic-webfont.eot');
	src: url('../fonts/OpenSans-SemiboldItalic-webfont.eot?#iefix')
		format('embedded-opentype'),
		url('../fonts/OpenSans-SemiboldItalic-webfont.woff') format('woff'),
		url('../fonts/OpenSans-SemiboldItalic-webfont.ttf') format('truetype'),
		url('../fonts/OpenSans-SemiboldItalic-webfont.svg#OpenSansSemiboldItalic')
		format('svg');
	font-weight: 500;
	font-style: italic;
}

/* Bold */
@font-face {
	font-family: 'Open Sans bold';
	src: url('../fonts/OpenSans-Bold-webfont.eot');
	src: url('../fonts/OpenSans-Bold-webfont.eot?#iefix')
		format('embedded-opentype'),
		url('../fonts/OpenSans-Bold-webfont.woff') format('woff'),
		url('../fonts/OpenSans-Bold-webfont.ttf') format('truetype'),
		url('../fonts/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
	font-weight: bold;
	font-weight: 700;
	font-style: normal;
}

/* Bold Italic */
@font-face {
	font-family: 'Open Sans Bold';
	src: url('../fonts/OpenSans-BoldItalic-webfont.eot');
	src: url('../fonts/OpenSans-BoldItalic-webfont.eot?#iefix')
		format('embedded-opentype'),
		url('../fonts/OpenSans-BoldItalic-webfont.woff') format('woff'),
		url('../fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
		url('../fonts/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic')
		format('svg');
	font-weight: bold;
	font-weight: 700;
	font-style: italic;
}

/* Extra Bold */
@font-face {
	font-family: 'Open Sans EXbold';
	src: url('../fonts/OpenSans-ExtraBold-webfont.eot');
	src: url('../fonts/OpenSans-ExtraBold-webfont.eot?#iefix')
		format('embedded-opentype'),
		url('../fonts/OpenSans-ExtraBold-webfont.woff') format('woff'),
		url('../fonts/OpenSans-ExtraBold-webfont.ttf') format('truetype'),
		url('../fonts/OpenSans-ExtraBold-webfont.svg#OpenSansExtrabold')
		format('svg');
	font-weight: 900;
	font-style: normal;
}

/* Extra Bold Italic */
@font-face {
	font-family: 'Open Sans Extra Bold Italic';
	src: url('../fonts/OpenSans-ExtraBoldItalic-webfont.eot');
	src: url('../fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix')
		format('embedded-opentype'),
		url('../fonts/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
		url('../fonts/OpenSans-ExtraBoldItalic-webfont.ttf')
		format('truetype'),
		url('../fonts/OpenSans-ExtraBoldItalic-webfont.svg#OpenSansExtraboldItalic')
		format('svg');
	font-weight: 900;
	font-style: italic;
}

body {
	margin: 0 !important;
	padding: 0 !important;
}

.statusIcons {
	background-color: #424242;
	height: 30px;
	padding: 3px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	-moz-border-radius: 6px;
}

.darkpressed {
	box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.7) inset;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	-moz-border-radius: 6px;
	margin: 0px;
	padding: 0px;
	outline: none !important;
	text-decoration: none;
	border: none;
	background: #424242;
	color: white;
}

.alarmtabletitle {
	color: #E1E5F2;
}

.widgetDeviceNameLbl {
	color: #FFFFFF;
	font-family: 'Open Sans Regular';
}

.z-radio-cnt, .z-checkbox-cnt, input.button, input.file, .z-loading {
	font-family: 'Open Sans Regular';
}

.z-label {
	font-family: 'Open Sans Regular';
}

.treeLabelPlant {
	color: #fff;
}

.reportpanelcaption {
	font-family: 'Open Sans Regular';
}

.treeLabelPlant {
	font-family: 'Open Sans Regular';
	font-size: small;
	margin-left: 4px;
	margin-top: 1px;
	color: #EEE;
}

.treeLabelPlant:hover {
	color: #F1F1F1;
}

.treeLabelGroup {
	font-family: 'Open Sans Semibold Title';
	font-size: small;
	margin-left: 4px;
	margin-top: 1px;
	position: absolute;
}

.hiddenTreeLabelPlant {
	visibility: hidden !important;
}

.noSelect {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.yesSelect {
	-webkit-user-select: all;
	-moz-user-select: all;
	-ms-user-select: all;
	user-select: all;
}

.zoomSmaller {
	zoom: 0.83;
	-moz-transform: scale(0.83);
	-moz-transform-origin: 0 0;
}

.zoomNormal {
	zoom: 1.0;
	-moz-transform: scale(1.0);
	-moz-transform-origin: 0 0;
}

.zoomBigger {
	zoom: 1.2;
	-moz-transform: scale(1.2);
	-moz-transform-origin: 0 0;
}

.zoom1920 {
	zoom: 1.34;
	-moz-transform: scale(1.34);
	-moz-transform-origin: 0 0;
}

.DashboardGlobalBackground {
	background-color: #444;
}

.bar.right::before {
	left: -140px;
	top: -50px;
	border-right: 90px solid #424242;
}

.bar:before {
	content: "";
	width: 0px;
	height: 0px;
	border: 2.5em solid transparent;
	position: absolute;
}

.gecko {
	height: 100%;
	margin: 0 auto;
	padding: 0;
	width: 100%;
	padding: 0px 0px;
}

.gecko43 {
	height: 100%;
	margin: 0 auto;
	padding: 0;
	width: 100%;
	padding: 0px 0px;
}

.appBg {
	background-color: #e6e6e6;
}

.labelInfo {
	font-size: 16px;
	color: #424242;
}

.z-panel-hl {
	border-bottom: none;
}

div.z-grid-body, div.z-grid {
	background: transparent;
}

.body1 {
	width: 976px;
	margin: 0 auto;
	padding: 0;
}

.borderLayoutClass {
	z-index: 1;
	background: transparent;
	position: relative;
	margin: 0 auto;
	min-height: 808px;
} /* width:1176px;*/
.borderLayoutClassDetailScreen {
	background: #E6E6E6;
	align: center;
	position: relative;
	min-height: 735px;
	width: 955px;
	bottom: 80px;
	border: 1px solid #bcbcbc;
	overflow: hidden;
	top: 0;
}

.borderLayoutClass1 {
	background: #bcbcbc;
	align: center;
	position: absolute;
	min-height: 672px;
	width: 976px;
	border: 1px solid #bcbcbc;
	margin: 0 auto;
}

.logoImage {
	overflow: hidden;
	padding-left: 10px;
	width: 175px;
	margin-top: -2px;
}

.nbutton {
	border: 1px solid transparent;
	background: #424242;
	padding: 12px 14px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.7) inset;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	-moz-border-radius: 6px;
	outline: none !important;
	background: #424242;
	text-shadow: #1e4158 0 1px 0;
	color: #fff;
	font-size: 14px;
	font-family: helvetica, serif;
	text-decoration: none;
	vertical-align: middle;
	transition: background 0.3s linear 0s, color 0.3s linear 0s;
	-webkit-transition-duration: 0.3s;
	-moz-transition-duration: 0.1s;
	-o-transition-duration: 0.1s;
	transition-duration: 0.1s;
	-webkit-transition-property: -webkit-transform;
	-moz-transition-property: -moz-transform;
	-o-transition-property: -o-transform;
	transition-property: transform;
}

.h-inline-block {
	display: inline-block;
}

.nbutton:hover {
	border: 1px solid #b4bdc2;
	border: 1px solid orange;
	background: #111;
	color: #fff;
	cursor: pointer;
}

.ndiv {
	margin-left: 20px;
	float: left;
}

.ndiv1 {
	margin-top: 20px;
	margin-left: 7px;
	float: left;
}

.nsbutton {
	border: 1px solid #b4bdc2;
	background: #77ACA4;
	background: -webkit-gradient(linear, left top, left bottom, from(#42aaff),
		to(#003366));
	background: -webkit-linear-gradient(top, #42aaff, #003366);
	background: -moz-linear-gradient(top, #42aaff, #003366);
	background: -ms-linear-gradient(top, #42aaff, #003366);
	background: -o-linear-gradient(top, #42aaff, #003366);
	background-image: -ms-linear-gradient(top, #42aaff 0%, #003366 100%);
	padding: 12px 14px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	-webkit-box-shadow: rgba(255, 255, 255, 0.4) 0 1px 0, inset
		rgba(255, 255, 255, 0.4) 0 1px 0;
	-moz-box-shadow: rgba(255, 255, 255, 0.4) 0 1px 0, inset
		rgba(255, 255, 255, 0.4) 0 1px 0;
	box-shadow: rgba(255, 255, 255, 0.4) 0 1px 0, inset
		rgba(255, 255, 255, 0.4) 0 1px 0;
	text-shadow: #1e4158 0 1px 0;
	color: #ffffff;
	font-size: 14px;
	font-family: helvetica, serif;
	text-decoration: none;
	vertical-align: middle;
	cursor: pointer;
}

.ndisbutton {
	border: 1px solid #b4bdc2;
	background: #77ACA4;
	padding: 12px 14px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	-webkit-box-shadow: rgba(255, 255, 255, 0.4) 0 1px 0, inset
		rgba(255, 255, 255, 0.4) 0 1px 0;
	-moz-box-shadow: rgba(255, 255, 255, 0.4) 0 1px 0, inset
		rgba(255, 255, 255, 0.4) 0 1px 0;
	box-shadow: rgba(255, 255, 255, 0.4) 0 1px 0, inset
		rgba(255, 255, 255, 0.4) 0 1px 0;
	color: gray;
	font-size: 13px;
	font-family: helvetica, serif;
	text-decoration: none;
	vertical-align: middle;
	cursor: default;
}

.z-borderlayout-icon {
	background: url(../../../img/borderlayout_btn.png) no-repeat scroll 0 0
		transparent;
	height: 15px;
	width: 15px;
}

.z-south-colps, .z-north-exp {
	background-position: 0 -30px;
}

.nash {
	border-left: 1px solid #999999;
	cursor: pointer;
	margin-left: 10px;
	margin-top: 0;
	padding-left: 10px;
	height: max-content;
}

.setBtn {
	border-right: 0px solid #999999;
	cursor: pointer;
	float: left;
	margin-right: 10px;
	margin-top: 0;
	padding-right: 10px;
}

.fastInfoLabel {
	float: left;
	color: #E1E5F2;
	margin-top: 4px;
	font-size: 18px;
	background-color: transparent;
	padding-left: 10px;
	max-width: 50px;
}

.ctitle {
	font-weight: bold;
	float: left;
	margin-top: 4px;
	letter-spacing: 0.05em;
	color: #424242
}

.ctitleDark {
	font-weight: bold;
	float: left;
	color: #424242;
	margin-top: 4px;
	font-size: 18px;
	letter-spacing: 0.05em;
	background-color: transparent;
}

.breadCrumbs {
	float: left;
	color: #424242;
	margin-top: 4px;
	font-size: 14px;
}

.z-grid-header {
	background: #ffffff;
}

.gridRowId-inner {
	background: #e6e6e6;
}

.gridRowId.hover {
	background-color: none;
}

span.z-progressmeter-img {
	background: #002f79;
}

.check span.z-progressmeter-img {
	background: Red;
}

tr.z-grid-odd td.z-row-inner, tr.z-grid-odd .z-cell, tr.z-grid-odd {
	background: transparent;
	background-color: #F9F9F9
}

td.z-group-inner {
	border: none;
}

tr.z-group {
	background: url("../../../img/sptr_sidebar.png") repeat-x scroll left
		bottom #F3F3F1;
}

.z-caption .z-caption-l, .z-caption .z-caption-r {
	color: #8B4513;
}

.z-listgroup-img {
	background-image: url("../../../img/arrow_toggle.gif");
}

td.z-listgroup-inner {
	border-bottom: 1px solid #ABA799;
	border-top: 1px solid #ABA799;
}

td.z-listgroup-inner div.z-listcell-cnt {
	color: #000000;
}

.z-group-img {
	background-image: url("../../../img/arrow_toggle.gif");
	display: none;
}

.gridGroup .z-group-img {
	background-image: url("../../../img/arrow_toggle.gif");
	display: inline-block;
}

div.z-tree-header tr.z-treecols, div.z-tree-header tr.z-auxhead {
	background-image: none;
	background-color: #404040;
	border-style: none;
	color: #ffffff;
}

div.z-tree-header th.z-treecol, div.z-tree-header th.z-auxheader {
	border-style: none;
	padding-left: 4px;
}

div.z-treecol-cnt {
	font-weight: bold;
}

div.z-tree-body {
	background-color: #424242;
	overflow: hidden;
}

div.z-tree {
	background-color: transparent;
	border-style: none;
}

tr.z-treerow td.z-treerow-focus {
	background-image: none;
}

span.z-tree-root-open, span.z-tree-tee-open, span.z-tree-last-open, span.z-tree-root-close,
	span.z-tree-tee-close, span.z-tree-last-close {
	background-image: url("../../../img/arrow_toggle.gif");
}

div.z-treecell-cnt {
	margin-top: 2px;
	-webkit-transition: all 1s ease-in-out;
	color: #E1E5F2;
}

tr.z-treerow-seld, tr.z-treerow-over {
	background: url(../../../img/hover_bg.png) repeat-x scroll 0 0
		transparent;
	cursor: pointer;
	border: none;
	color: #424242;
}

.z-toolbar-tabs-outer {
	border-style: none;
}

.z-tabs-scroll .z-tabs-cnt {
	padding-left: 0px;
}

tr.z-vbox-sep {
	height: 0px;
}

.z-toolbar {
	padding: 0px;
	background-image: none;
	border-style: none;
	min-height: 571px;
	background-color: transparent;
}

.z-tabs-scroll {
	border-style: none;
}

.z-center {
	border-style: none;
}

.z-tabs-scroll {
	padding-bottom: 0px;
}

.z-toolbar-tabs-body, .z-toolbar-tabs-body span, .z-toolbar-body,
	.z-toolbar-body span {
	font-size: 12px;
}

.z-toolbar a, .z-toolbar a:visited, .z-toolbar a:hover {
	border-style: none;
	background-color: transparent;
}

.crtitle {
	color: #E1E5F2;
	margin-top: 4px;
	float: left;
}

.refreshHbox {
	float: right;
}

.checkbox {
	font-weight: bold;
	color: #FFFFFF;
	font-family: arial, sans-serif;
	font-size: 12px;
	float: right;
	margin-top: 2px;
}

.z-tabpanel {
	background-color: transparent;
}

.z-bandbox .z-bandbox-btn {
	background-image:
		url("/portal/zkau/web/43b6ef60/zul/img/button/combobtn.gif") no-repeat
		scroll 0 0 transparent;
}

.z-textbox {
	background-image: none;
}

#zk_proc {
	background: none repeat scroll 0 0 #E0E1E3;
	opacity: 0.8;
	position: fixed;
	width: 200%;
	height: 200%;
	left: 0;
	top: 0;
	z-index: 1800;
}

.s-modal-mask {
	background: none repeat scroll 0 0 #E0E1E3;
	opacity: 0.6;
	position: fixed;
	width: 200%;
	height: 200%;
	left: 0;
	top: 0;
	z-index: 1500;
}

.z-modal-mask {
	visibility: hidden;
}

.z-apply-loading-indicator {
	background-color: #FFFFFF;
	border: 1px solid #ABA799;
	padding: 6px;
	color: #403E39;
	white-space: nowrap;
}

.z-apply-loading {
	background-color: #ABA799;
	border-color: #ABA799;
	color: #403E39;
}

.z-textbox {
	background-color: #FFFFFF;
}

.lefttree {
	background: none;
}

.loginfailed {
	color: red;
	display: block;
	text-align: center;
	height: 20px;
}

.loginfailedcaptcha {
	color: red;
	display: block;
	text-align: center;
}

.welcomeuser {
	font-size: 10px;
	color: #E1E5F2;
	font-weight: 200;
}

z-listitem-seld {
	background-color: #FFFFFF;
}

.tophbox {
	margin-bottom: 5px;
	float: right;
}

.tophboxpar {
	margin-bottom: 5px;
	float: right;
}

.submitbuttonpara {
	float: right;
}

.test {
	width: 100%;
}

.submitbutton {
	float: right;
}

.sorting {
	float: left;
}

.devicedetailgrid {
	border: 1px solid #ABA799;
	height: 500px;
}

.slno {
	width: 25px;
}

.columnLabel {
	width: 25px;
}

.searchSortHbox {
	width: 921px;
}

.columnValue {
	width: 80px;
}

.columnName {
	width: 180px;
}

.renderimage {
	margin-left: 9px;
}

.rowrender {
	cursor: pointer;
}

.rowrender:hover {
	background-color: #404040;
	color: #FFFFFF;
}

.renderlabel {
	background-color: yellow;
}

/* alarm zul page css */
.alarmfilter {
	margin-top: 5px;
	border: 1px solid #ABA799;
	width: 957px;
}

.alarmfilterplant {
	margin-left: 3px;
	margin-top: 3px;
}

.alarmfiltervbox {
	margin-left: 15px;
	margin-top: 3px;
}

.alarmfilterbutton {
	margin-left: 5px;
	margin-top: 16px;
}

.alarmgrid {
	margin-top: 10px;
}

.alarmgridcolum {
	background: #E6E6E6;
}

/* dashboardcenter zul page css */
.settingImg {
	float: left;
	margin-right: 5px;
	cursor: pointer;
}

.th-grad {
	background: #000;
}

.th {
	background: #404040;
}

.th-trasp {
	background-color: transparent;
	width: 100%,
}

.thupdate {
	float: left;
	margin: 0 2px;
}

.tabbox {
	background: #f9f9f8;
	margin-top: 4px;
}

/*device detail zul page css*/
.backlable {
	float: left;
	cursor: pointer;
	padding-right: 5px;
}

.titlecenter {
	font-weight: bold;
	color: #FFFFFF;
	float: left;
	margin-top: 4px;
	margin-left: 350px;
}

.northtab {
	background: url(../../../img/topbar_bg.png) repeat-x scroll 0 0
		transparent;
	height: 70px;
}

.centerview {
	background: #ebebeb;
	top: 0px;
	bottom: 0;
	position: absolute;
	height: 100%;
	width: 100%;
	left: 0px;
}

.deviceNameLabel {
	float: left;
	font-size: 25px;
	color: #1A6699;
	margin-left: 20px;
	margin-top: 5px;
}

.deviceUpdLabel {
	float: left;
	color: #424242;
	margin-top: 5px;
	width: max-content;
}

.deviceDetailHbox {
	float: left;
	margin-bottom: 5px;
	margin-left: 20px;
}

/* device zul page css*/
.bandbox {
	margin-top: 1px;
}

.devicebutton {
	margin-left: 15px;
	margin-top: 17px;
}

/* login zul page css*/
.loginwindow {
	left: 50%;
	margin: 15% 0 auto -240px;
	position: relative;
	width: 480px;
}

.loginpanel {
	font: bold;
	margin-top: -40px;
}

.logincaption {
	font-weight: bold;
	padding-left: 170px;
}

.table {
	padding-top: 4px;
}

.tablepanel {
	margin: 5px;
}

.tablepanel1 {
	margin: 5px;
	padding-top: 3px;
}

.tablelabel {
	color: red;
	height: 20px;
	display: block;
}

.tablelabels {
	padding-left: 60px;
}

.tabletext {
	background: none repeat scroll 0 0 #F8F8F8;
	border: 1px solid #949494;
	display: block;
	height: 19px;
	line-height: 19px;
	padding: 4px;
	width: 42%;
	color: #E4F1E1;
}

.tablebutton {
	font-family: Arial;
	border: 1px solid #528AA5;
	color: #E4F1E1;
	background-color: #F4FCFF;
}

/* plantsDashBoard zul page css */
.lefttreecolum {
	height: 25px;
	width: 217px;
}

/* plant zul page css */
.northview {
	background: transparent;
	height: 60px;
	overflow: visible;
}

.headervlayout {
	width: 598px;
}

.headerLangDiv {
	margin-right: 40px;
	margin-top: 12px;
}

.headerBtnDiv {
	margin-left: 100px;
	margin-top: 14px;
}

.headerBtnDiv1 {
	margin-left: 95px;
	margin-top: 14px;
}

.headerlabel {
	color: #fefefe;
	font-size: 9px;
}

.centerbg {
	background: #ddd;
	overflow: hidden;
}

.southbg {
	background-color: #424242;
	font-family: Arial;
	height: 80px;
	position: relative;
	margin-top: -80px;
	z-index: 4;
	width: 100%;
}

.southdiv {
	position: relative;
	margin-top: 2px;
	margin: 0;
	width: 1174px;
	margin-top: 10px;
}

.southtable {
	position: relative;
	padding-left: 30px;
}

.southpanelbg {
	position: relative;
	background: #424242
}

/* report zul page css */
.tablepanelheader {
	margin-top: 5px;
	border-radius: 10px;
}

.begindatelable {
	margin: 5px;
	text-align: left;
}

.reportpanel {
	margin: 5px;
	float: right;
}

.reportpanelcaptionuser {
	font-family: 'Open Sans Semibold';
	color: #424242;
}

.reportpanellabel {
	margin: 5px;
	padding-top: 3px;
	text-align: right;
}

.locationpanelbg {
	margin-top: 5px;
	margin-left: 2px;
	border-radius: 10px;
}

.reporthbox {
	margin: 5px;
	padding-top: 5px;
	background-color: transparent;
}

.recentrepbut {
	float: right;
}

.reportformat {
	padding: 5px;
	overflow: auto;
}

.z-calendar {
	background-color: #e6e6e6;
}

.chartBg {
	background-color: #e6e6e6;
}

.reportLastUpd {
	font-weight: bold;
	color: #FFFFFF;
	margin-top: 4px;
	margin-right: 5px;
}

.z-calendar-left-icon, .z-calendar-right-icon {
	border-bottom: 6px solid #E6E6E6;
	border-top: 6px solid #E6E6E6;
}

.lang-menu {
	font-size: 9px;
	margin: 0;
	padding: 0;
}

.lang-menu .langItem td {
	text-align: center;
	text-transform: uppercase;
	padding: 0 0 0 4px;
}

.lang-menu img {
	display: block;
	margin: 0 0 2px;
	opacity: 0.5;
}

.lang-menu a {
	color: #666666;
	text-decoration: none;
	text-transform: uppercase;
}

.lang-menu .active img, .lang-menu a:hover img {
	opacity: 1;
	cursor: pointer;
}

.lang-menu .active a, .lang-menu a:hover {
	color: #1A6699;
	cursor: pointer;
}

.welcome {
	float: left;
	margin-left: 10px;
	margin-top: 15px;
	padding-left: 10px;
}

/* user setting */
.redcolor {
	color: #FF0000;
}

.addNewSetting {
	margin-top: 4px;
	margin-bottom: 4px;
}

.userListGrid {
	margin-right: 7px;
	margin-top: 7px;
	margin-left: 4px;
	border: 1px solid #ABA799;
}

.contentDiv {
	margin-left: 5px;
	margin-top: 5px;
}

.GridStyle {
	margin-top: 10px;
	border: 1px solid #ABA799;
	padding: 2px;
	text-align: left;
}

.newuserBtnHbox {
	float: right;
	width: 526px;
	margin-top: 10px;
}

.editChk {
	float: right;
	margin-bottom: 10px;
	width: 465px;
}

.editChkPlant {
	float: right;
	margin-bottom: 10px;
	width: 560px;
}

.editBtnHlayout {
	margin-top: 10px;
}

.editDiv {
	margin-top: 8px;
}

.devEditBtnHlayout {
	width: 492px;
}

.editLayout {
	margin-left: 5px;
	padding-top: 5px;
	width: 400px;
}

.plantListGrid {
	margin-right: 7px;
	margin-top: 4px;
	margin-left: 4px;
	border: 1px solid #ABA799;
}

.mL233px {
	margin-left: 233px;
}

.mL349px {
	margin-left: 349px;
}

.mL238px {
	margin-left: 238px;
}

.mL194px {
	margin-left: 194px;
}

.devEditChk {
	margin-bottom: 0px;
	margin-left: 434px;
}

.mL8px {
	margin-left: 8px;
}

.mT8px {
	margin-top: 8px;
}

.mL9px {
	margin-left: 9px;
}

.settingTree {
	padding-left: 10px;
	padding-top: 5px;
	padding-bottom: 3px;
	border-bottom: 1px solid #ABA799;
	width: 100%;
	background: url('../img/hover_bg.png') repeat-x scroll 0 0 transparent;
}

.fL {
	float: left;
}

.fR {
	float: right;
}

.w100 {
	width: 100%;
}

.w30 {
	width: 30%;
}

.w200px {
	width: 200px;
}

.m10 {
	margin: 10%
}

.mt10px {
	margin-top: 10px;
}

.settingTitle {
	font-weight: bold;
	color: #424242;
	font-size: 20px;
}

.mleft5 {
	margin-left: 5px;
}

.cursorpnt {
	cursor: pointer;
}

.pL10 {
	padding-left: 10px;
}

.z-grid-autopaging .z-row-cnt {
	height: auto;
}

.titleField {
	font-size: 16px;
	color: #000;
}

.appBg {
	background: transparent;
	font-size: 14px;
}

.disabledFeatureStyle {
	color: #a00;
	font-size: 16px;
}

.enabledFeatureStyle {
	color: #0c0;
	font-size: 16px;
}

.hmiBox {
	border: 1px solid #000;
	width: 320px;
	height: 150px;
	padding: 4px;
	background-color: #999;
}

.widgetBox {
	border: 1px solid #000;
	width: 320px;
	height: 500px;
	padding: 4px;
	background-color: #999;
}

.srcPageStyle {
	font-size: 12px;
}

.widget {
	position: relative;
	bottom: 0;
}

.boxTitle {
	font-size: 18px;
	color: #999;
}

.propertyLbl {
	font-size: 16px;
	font-weight: 400;
}

.reportpanelcaption {
	font-size: 14px;
	font-weight: 800;
	color: #424242;
}

.myLbl {
	font-size: 20px;
}

.devbgcolor tr.z-row-over>td.z-row-inner {
	color: white;
	background-color: #e6e6e6;
}

.loginBackground {
	height: 100%;
	width: 100%;
	background: url(../../../img/line.png) repeat-x scroll 0 0 #F9F9F9;
	background-color: #f9f9f9;
}

.loginBox {
	background: url("../../../img/login_box_bg.png") repeat-x scroll left
		top #FFFFFF;
	border: 1px solid #EEEEEE;
	box-shadow: 0 0 10px #666666;
	padding: 20px 0 38px;
	position: relative;
	width: auto;
	text-align: center;
	margin-top: -25px;
	z-index: 3;
}

.loginimage {
	left: 50%;
	margin: auto 0 auto -172px;
	position: relative;
}

.area {
	margin: 6px auto;
	overflow: hidden;
	padding: 0 10px 0 0;
	position: relative;
	width: 300px;
}

.textBox {
	background: none repeat scroll 0 0 #F8F8F8;
	border: 1px solid #949494;
	display: block;
	height: 19px;
	line-height: 19px;
	padding: 4px;
	width: 70%
}

.button {
	-moz-border-bottom-colors: none;
	-moz-border-left-colors: none;
	-moz-border-right-colors: none;
	-moz-border-top-colors: none;
	background: url("../../../img/button_bg.gif") repeat-x scroll left top
		#D2D2D2;
	border-color: #A6A6A6 #8A8A8A #8A8A8A #A6A6A6;
	border-image: none;
	border-right: 1px solid #8A8A8A;
	border-style: solid;
	border-width: 1px;
	color: #000000;
	cursor: pointer;
	font-size: 12px;
	margin: 0 3px 0 0;
	padding: 2px 12px;
	text-decoration: none;
	height: 25px;
	vertical-align: middle;
}

.button:hover {
	border-color: #5B5B5B;
}

.footer {
	border-top: 1px solid #C4C4C4;
	height: 40px;
	margin: 40px auto 0;
	position: relative;
	z-index: 4;
	padding-top: 5px;
	color: #666666;
}

.footer_label {
	font-size: 11px;
}

.timeImg {
	width: 14px;
	padding-top: 4px;
}

.wrapper {
	position: absolute;
	height: 100vh;
	width: 100vw;
	overflow: hidden;
}

.westBackground {
	background: #424242;
	font-size: 11px;
	margin-top: 3px;
	width: 260px;
	overflow: hidden;
	border-right: 3px solid #E4F1E1;
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-ms-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
}

.westSettingBackground {
	background: transparent;
	font-size: 11px;
	margin-top: 3px;
	width: 350px;
	overflow: hidden;
	border-left: 1px solid #aaa;
	border-right: 1px solid #aaa;
}

.insideWestBackground {
	background-color: #EBEBEB;
	font-size: 11px;
	margin-top: 1px;
	width: 220px;
	overflow: hidden;
	border-right: 1px solid #ABA799
}

.backgroundBG {
	background: #F9F9F9;
}

.plantGroupDiv {
	overflow: auto;
	top: 60px;
	bottom: 80px;
	position: absolute;
}

.deviceDetailTabpanels {
	top: 29px;
	bottom: 0px;
	position: absolute;
}

.z-comboitem {
	padding-bottom: 4px;
}

.langFlag-img {
	width: 30px;
	padding-bottom: 2px;
	padding-top: 2px;
}

.langFlag-seld {
	background-color: #D1CFCA;
}

.langFlag-over {
	background-color: #D1CFCA;
	cursor: pointer;
}

.langFlag-over-seld {
	background-color: #D1CFCA;
	cursor: pointer;
}

tr.z-comboitem, td.z-comboitem-img {
	padding-bottom: 2px;
	padding-top: 2px;
}

.reportTimeRang {
	float: right;
	margin: 0px;
}

.LM_btn, .LM_active_btn {
	cursor: pointer;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	text-rendering: optimizeLegibility;
	letter-spacing: 0.1em;
	color: #ffffff;
	padding: 16px 10px;
	margin-bottom: 12px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.LM_btn:hover>img, .LM_active_btn>img {
	width: 35px;
}

.LM_btn>img {
	width: 35px;
}

.LM_btn:hover {
	background: #111;
	color: #fff;
	color: orange;
	cursor: pointer;
}

button.LM_active_btn {
	border: none;
	border: 1px solid orange;
	background: #333;
	color: #fff;
	cursor: pointer;
	transition: background 0.3s linear 0s, color 0.3s linear 0s;
}

button.LM_btn {
	background: #424242;
	padding: 10px;
	transition: background 0.3s linear 0s, color 0.3s linear 0s;
	-webkit-transition: all 0.1s ease-in-out;
	-moz-transition: all 0.1s ease-in-out;
	-o-transition: all 0.1s ease-in-out;
	transition: all 0.1s ease-in-out;
}

button.LM_btn>img, button.LM_active_btn>img {
	float: right;
}

button.LM_active_btn>img {
	filter: brightness(0.52) sepia(1) saturate(900%) invert(15%);
}

.bar.right::before {
	left: -140px;
	top: -50px;
	border-right: 90px solid #424242;
}

.bar:before {
	content: "";
	width: 0px;
	height: 0px;
	border: 2.5em solid transparent;
	position: absolute;
}

.AlarmBackground {
	background: #cf867c; /* Old browsers */
	background: -moz-linear-gradient(top, #cf867c 0%, #821717 100%);
	/* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #cf867c),
		color-stop(100%, #821717)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #cf867c 0%, #821717 100%);
	/* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #cf867c 0%, #821717 100%);
	/* Opera 11.10+ */
	background: -ms-linear-gradient(top, #cf867c 0%, #821717 100%);
	/* IE10+ */
	background: linear-gradient(to bottom, #cf867c 0%, #821717 100%);
	/* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cf867c',
		endColorstr='#821717', GradientType=0); /* IE6-9 */
}

.btnVrt {
	height: 62px;
	width: 62px;
	border: none;
}

.btnVrt:hover {
	border: 1px solid orange;
}

.btnVrt_active {
	height: 62px;
	width: 60px;
	padding: 1px;
	border: 1px solid orange;
}

.topButton {
	height: 35px;
}

span.z-tree-line {
	height: 0;
}

span.z-tree-ico {
	vertical-align: middle;
}

.z-treerow-img-checkbox {
	vertical-align: middle;
}

.main, .main1, .main2, .main3, .main4, .main5, .main6, .main7, .main8 {
	cursor: pointer;
	font-size: 16px;
	font-weight: 500;
	color: #ffffff;
	padding: 10px 10px;
	margin-bottom: 2px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border: 1px transparent;
	background: #424242;
	padding: 1px;
}

.main:hover, .main1:hover, .main2:hover, .main3:hover, .main4:hover,
	.main5:hover, .main6:hover, .main7:hover, .main8:hover {
	background: #77ACA4;
	background: #000;
	color: #fff;
	cursor: pointer;
	color: orange;
}

.main:disabled, .main1:disabled, .main2:disabled, .main3:disabled,
	.main4:disabled, .main5:disabled, .main6:disabled, .main7:disabled,
	.main8:disabled {
	-moz-box-shadow: 0px 4px 30px rgba(000, 000, 000, 1), inset 0px 0px 17px
		rgba(255, 255, 255, 1);
	-webkit-box-shadow: 1px 1px 30px rgba(000, 000, 000, 1), inset 0px 0px
		17px rgba(255, 255, 255, 1);
	box-shadow: 0px 4px 10px rgba(000, 000, 000, 1), inset 0px 0px 6px
		rgba(255, 255, 255, 1);
	border: 2px solid #ccc;
}

button.main1 {
	border: 1px transparent;
	background: #445340; /* Old browsers */
}

button.main2 {
	border: 1px transparent;
	color: #FFFFFF;
	color: orange;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	-moz-border-radius: 6px;
	margin: 0px;
	padding: 0px;
	outline: none !important;
	text-decoration: none;
	border: none;
	cursor: pointer;
}

button.main3 {
	border: 1px transparent;
	background: #cf867c; /* Old browsers */
	background: -moz-linear-gradient(top, #cf867c 0%, #821717 100%);
	/* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #cf867c),
		color-stop(100%, #821717)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #cf867c 0%, #821717 100%);
	/* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #cf867c 0%, #821717 100%);
	/* Opera 11.10+ */
	background: -ms-linear-gradient(top, #cf867c 0%, #821717 100%);
	/* IE10+ */
	background: linear-gradient(to bottom, #cf867c 0%, #821717 100%);
	/* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cf867c',
		endColorstr='#821717', GradientType=0); /* IE6-9 */
}

button.main4 {
	border: 1px transparent;
	background: #7ccccf; /* Old browsers */
	background: -moz-linear-gradient(top, #7ccccf 0%, #297173 100%);
	/* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7ccccf),
		color-stop(100%, #297173)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #7ccccf 0%, #297173 100%);
	/* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #7ccccf 0%, #297173 100%);
	/* Opera 11.10+ */
	background: -ms-linear-gradient(top, #7ccccf 0%, #297173 100%);
	/* IE10+ */
	background: linear-gradient(to bottom, #7ccccf 0%, #297173 100%);
	/* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7ccccf',
		endColorstr='#297173', GradientType=0); /* IE6-9 */
}

.main5 {
	background: #424242;
	border: 1px transparent;
}

.leftbarbutton {
	border: 1px solid #E1E5F2;
	background: #424242;
	color: #fff;
	cursor: pointer;
	transition: background 0.3s linear 0s, color 0.3s linear 0s;
	padding: 6px;
	font-weight: bold;
	font-size: 16px;
}

.leftbarbutton:hover {
	background: #77ACA4;
	background: -webkit-gradient(linear, left top, left bottom, from(#404040),
		to(#77ACA4));
	background: -webkit-linear-gradient(top, #65a9d7, #77ACA4);
	background: -moz-linear-gradient(top, #65a9d7, #77ACA4);
	background: -ms-linear-gradient(top, #65a9d7, #77ACA4);
	background: -o-linear-gradient(top, #65a9d7, #77ACA4);
	background-image: -ms-linear-gradient(top, #65a9d7 0%, #77ACA4 100%);
	color: #fff;
	cursor: pointer;
	transition: background 0.3s linear 0s, color 0.3s linear 0s;
	padding: 6px;
}

button.main6 {
	border: 1px solid #b4bdc2;
	background: #625B63;
	padding: 6px;
}

button.main7 {
	border: 1px transparent;
	background: -moz-linear-gradient(top, #f2f2f2 0%, #707070 100%);
	/* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f2f2f2),
		color-stop(100%, #707070)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #f2f2f2 0%, #707070 100%);
	/* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #f2f2f2 0%, #707070 100%);
	/* Opera 11.10+ */
	background: -ms-linear-gradient(top, #f2f2f2 0%, #707070 100%);
	/* IE10+ */
	background: linear-gradient(to bottom, #f2f2f2 0%, #707070 100%);
	/* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2',
		endColorstr='#707070', GradientType=0); /* IE6-9 */
}

.main8 {
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	background: -moz-linear-gradient(top, #f5e267 0%, #e38800 100%);
	/* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f5e267),
		color-stop(100%, #e38800)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #f5e267 0%, #e38800 100%);
	/* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #f5e267 0%, #e38800 100%);
	/* Opera 11.10+ */
	background: -ms-linear-gradient(top, #f5e267 0%, #e38800 100%);
	/* IE10+ */
	background: linear-gradient(to bottom, #f5e267 0%, #e38800 100%);
	/* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5e267',
		endColorstr='#e38800', GradientType=0); /* IE6-9 */
}

.btnSetting {
	cursor: pointer;
	font-size: 16px;
	color: #ffffff;
	padding: 10px 10px;
	margin-bottom: 10px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid #FFFFFF;
	background: #424242;
	padding: 1px;
	transition: background 0.3s linear 0s, color 0.3s linear 0s;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3 sease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

button.btnSetting:hover {
	border: 1px solid #b4bdc2;
	background: #77ACA4;
	background: -webkit-gradient(linear, left top, left bottom, from(#404040),
		to(#77ACA4));
	background: -webkit-linear-gradient(top, #65a9d7, #77ACA4);
	background: -moz-linear-gradient(top, #65a9d7, #77ACA4);
	background: -ms-linear-gradient(top, #65a9d7, #77ACA4);
	background: -o-linear-gradient(top, #65a9d7, #77ACA4);
	background-image: -ms-linear-gradient(top, #65a9d7 0%, #77ACA4 100%);
	color: #fff;
	cursor: pointer;
}

.btnSetting:disabled {
	border: 1px solid #fff;
	opacity: 0.3;
	background: -moz-linear-gradient(top, #eee 0%, #707070 100%);
	/* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eee),
		color-stop(100%, #707070)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #eee 0%, #707070 100%);
	/* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #eee 0%, #707070 100%);
	/* Opera 11.10+ */
	background: -ms-linear-gradient(top, #eee 0%, #707070 100%);
	/* IE10+ */
	background: linear-gradient(to bottom, #eee 0%, #707070 100%);
	/* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#CACACA',
		endColorstr='#707070', GradientType=0); /* IE6-9 */
}

.btnSettingActive {
	cursor: pointer;
	font-size: 16px;
	color: #ffffff;
	padding: 10px 10px;
	margin-bottom: 10px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid #b4bdc2;
	background: #77ACA4;
	background: -webkit-gradient(linear, left top, left bottom, from(#404040),
		to(#77ACA4));
	background: -webkit-linear-gradient(top, #65a9d7, #77ACA4);
	background: -moz-linear-gradient(top, #65a9d7, #77ACA4);
	background: -ms-linear-gradient(top, #65a9d7, #77ACA4);
	background: -o-linear-gradient(top, #65a9d7, #77ACA4);
	background-image: -ms-linear-gradient(top, #65a9d7 0%, #77ACA4 100%);
	color: #fff;
	cursor: pointer;
	padding: 1px;
}

.rounded {
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
}

div.callout1 {
	padding: 10px;
	border-radius: 3px;
}

.callout1::before {
	content: "";
	width: 0px;
	height: 0px;
	border: 0.8em solid transparent;
	position: absolute;
}

.callout1.bottom-right::before {
	right: 1px;
	top: -19px;
	border-bottom: 10px solid #aaa;
}

.bigBtnImage>img {
	width: 30px;
}

/* General buttons*/
button.css3button {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #ffffff;
	padding: 10px 20px;
	background: -moz-linear-gradient(top, #7a797a 0%, #3b3b3b 50%, #242424 50%, #000000);
	background: -webkit-gradient(linear, left top, left bottom, from(#7a797a),
		color-stop(0.50, #3b3b3b), color-stop(0.50, #242424), to(#000000));
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	border: 1px solid #b0adb0;
	-moz-box-shadow: 0px 1px 3px rgba(000, 000, 000, 0), inset 0px 0px 1px
		rgba(255, 255, 255, 0);
	-webkit-box-shadow: 0px 1px 3px rgba(000, 000, 000, 0), inset 0px 0px
		1px rgba(255, 255, 255, 0);
	box-shadow: 0px 1px 3px rgba(000, 000, 000, 0), inset 0px 0px 1px
		rgba(255, 255, 255, 0);
	text-shadow: 0px 0px 0px rgba(000, 000, 000, 0), 0px 0px 0px
		rgba(255, 255, 255, 0);
}

.btnSmall {
	padding: 4px 4px;
	font-size: 12px;
}

button.tabletSlide {
	cursor: pointer;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 25px;
	color: #ffffff;
	padding: 7px 13px;
	border-radius: 6px;
	background-position: center center;
	background-repeat: no-repeat;
	background-color: #424242;
	transition: all 0.2s ease-in-out;
}

.tabletSlide:hover {
	transform: scale(0.8);
}

/* positionate widget to to bottom of his container*/
.widgetContainer {
	position: relative;
}

.widget {
	position: absolute;
	bottom: 0;
}

.widget1 {
	position: absolute;
	bottom: 140px;
}

.widget2 {
	position: absolute;
	bottom: 85px;
}

/* 7 segment font */
@font-face {
	font-family: 'Crystal';
	src: url('../../evco/LiquidCrystal-Normal.otf');
}

/* 7 segment display value */
.screenDispRed {
	font-family: 'Crystal', Arial, sans-serif;
	font-size: 30px;
	color: #2C75FF;
}

.screenDispBlue {
	font-family: 'Crystal', Arial, sans-serif;
	font-size: 16px;
	color: #2C75FF;
}

/* white widget characters */
.screenDispWhite {
	font-size: 14px;
	color: #FeFeFe;
}

/* 7 segment display label */
.screenDisp {
	font-family: 'Crystal', Arial, sans-serif;
	font-size: 14px;
	color: #000;
}

.screenDispBig {
	font-family: 'Crystal', Arial, sans-serif;
	font-size: 16px;
	color: #000;
}

.nomeDisp {
	color: #333;
	font-weight: 400;
	font-size: 12px;
}

.zoneDisp {
	font-family: 'Crystal', Arial, sans-serif;
	font-size: 11px;
}

.z-tabbox-accordion .z-tabpanel-accordion {
	border: none;
}

/* widget container bottom shadow*/
.widCont {
	-moz-box-shadow: inset 0px 1px 3px rgba(000, 000, 000, 0.5);
	-webkit-box-shadow: inset 0px 1px 3px rgba(000, 000, 000, 0.5);
	box-shadow: 0px 6px 10px rgba(130, 130, 130, 0.3);
	z-index: 100;
}

/* table odd light-grey */
.none-odd  div.z-row-cnt {
	color: #666;
}

.hoverIcon {
	box-shadow: 0px 4px 50px rgba(000, 000, 000, 0.5), inset 0px 0px 2px
		rgba(255, 255, 255, 0.7);
}

/*center div respect to his parent div*/
.cn {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	min-width: 400px;
}

.inner {
	display: inline-block;
	text-align: left;
}

.onoffswitch {
	position: relative;
	width: 90px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}

.onoffswitch-checkbox {
	display: none;
}

.onoffswitch-label {
	display: block;
	overflow: hidden;
	cursor: pointer;
	border: 2px solid #999999;
	border-radius: 20px;
}

.onoffswitch-inner {
	width: 200%;
	margin-left: -100%;
	-moz-transition: margin 0.3s ease-in 0s;
	-webkit-transition: margin 0.3s ease-in 0s;
	-o-transition: margin 0.3s ease-in 0s;
	transition: margin 0.3s ease-in 0s;
}

.onoffswitch-inner:before, .onoffswitch-inner:after {
	float: left;
	width: 50%;
	height: 28px;
	padding: 0;
	line-height: 28px;
	font-size: 14px;
	color: white;
	font-family: Trebuchet, Arial, sans-serif;
	font-weight: bold;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.onoffswitch-inner:before {
	content: "ON";
	padding-left: 10px;
	background-color: #ED9600;
	color: #FFFFFF;
}

.onoffswitch-inner:after {
	content: "OFF";
	padding-right: 10px;
	background-color: #CCCCCC;
	color: #333333;
	text-align: right;
}

.onoffswitch-switch {
	width: 17px;
	margin: 5.5px;
	background: #000000;
	border: 2px solid #999999;
	border-radius: 20px;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 58px;
	-moz-transition: all 0.3s ease-in 0s;
	-webkit-transition: all 0.3s ease-in 0s;
	-o-transition: all 0.3s ease-in 0s;
	transition: all 0.3s ease-in 0s;
}

.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-inner {
	margin-left: 0;
}

.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-switch {
	right: 0px;
}

.widgetStyle1 {
	cursor: pointer;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	background-color: #eaeaea;
	padding: 10px;
	font-family: arial;
	font-size: 20px;
	text-align: left;
	z-index: 100;
	margin-right: 20px;
	height: 100px;
}

.widgetStyle2 {
	cursor: pointer;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	background-color: #eaeaea;
	font-family: arial;
	font-size: 20px;
	text-align: left;
	z-index: 100;
	margin-right: 20px;
	height: 250px;
}

.widgetDark {
	background-color: #eaeaea;
}

.widgetFontTitle {
	font-size: 20px;
}

.backgroundGray {
	color: #FFF;
	background-color: #454545;
}

.whiteWid {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 20px;
	text-align: center;
	color: #000000;
	background: -moz-linear-gradient(top, #ffffff 0%, #e0e0e0 50%, #d6d6d6);
	background: -webkit-gradient(linear, left top, left bottom, from(#ffffff),
		color-stop(0.50, #e0e0e0), to(#d6d6d6));
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-moz-box-shadow: 0px 1px 3px rgba(79, 79, 79, 0.5), inset 0px 0px 1px
		rgba(255, 255, 255, 0.6);
	-webkit-box-shadow: 0px 1px 3px rgba(79, 79, 79, 0.5), inset 0px 0px 1px
		rgba(255, 255, 255, 0.6);
	box-shadow: 0px 1px 3px rgba(79, 79, 79, 0.5), inset 0px 0px 1px
		rgba(255, 255, 255, 0.6);
	text-shadow: 0px -1px 0px rgba(166, 166, 166, 1), 0px 1px 0px
		rgba(255, 255, 255, 0.2);
}

.blackWid {
	font-size: 18px;
	text-align: center;
	cursor: pointer;
	text-rendering: optimizeLegibility;
	letter-spacing: 0.1em;
	color: #ffffff;
	padding: 10px;
	margin-bottom: 10px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	font-weight: bold;
	border: none;
	background: #424242;
	transition: background 0.3s linear 0s, color 0.3s linear 0s;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3 sease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.blackWid:hover {
	background: #77ACA4;
	background: -webkit-gradient(linear, left top, left bottom, from(#404040),
		to(#77ACA4));
	background: -webkit-linear-gradient(top, #65a9d7, #77ACA4);
	background: -moz-linear-gradient(top, #65a9d7, #77ACA4);
	background: -ms-linear-gradient(top, #65a9d7, #77ACA4);
	background: -o-linear-gradient(top, #65a9d7, #77ACA4);
	background-image: -ms-linear-gradient(top, #65a9d7 0%, #77ACA4 100%);
	color: #fff;
	cursor: pointer;
}

.widRow {
	margin-bottom: 10px;
}

.labelInWidget {
	margin-top: 10px;
}

.redWid {
	font-size: 14px;
	background: #B60E27;
	color: #FFFFFF;
	background-color: #B60E27;
}

.redWid:hover {
	background: #77ACA4;
	background: -webkit-gradient(linear, left top, left bottom, from(#404040),
		to(#77ACA4));
	background: -webkit-linear-gradient(top, #65a9d7, #77ACA4);
	background: -moz-linear-gradient(top, #65a9d7, #77ACA4);
	background: -ms-linear-gradient(top, #65a9d7, #77ACA4);
	background: -o-linear-gradient(top, #65a9d7, #77ACA4);
	background-image: -ms-linear-gradient(top, #65a9d7 0%, #77ACA4 100%);
	color: #fff;
	cursor: pointer
}

.greenWid {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	background: #6B8F0B;
	background-color: #6B8F0B;
}

.orangeWid {
	background: -moz-linear-gradient(top, #ffbe19 0%, #ab6c00);
	background: -webkit-gradient(linear, left top, left bottom, from(#ffbe19),
		to(#ab6c00));
	background-color: #ab6c00;
	border: 1px solid #7d4f00;
	-moz-box-shadow: 0px 1px 3px rgba(000, 000, 000, 0.5), inset 0px 0px 2px
		rgba(255, 255, 255, 0.7);
	-webkit-box-shadow: 0px 1px 3px rgba(000, 000, 000, 0.5), inset 0px 0px
		2px rgba(255, 255, 255, 0.7);
	box-shadow: 0px 1px 3px rgba(000, 000, 000, 0.5), inset 0px 0px 2px
		rgba(255, 255, 255, 0.7);
	text-shadow: 0px -1px 0px rgba(000, 000, 000, 0.4), 0px 1px 0px
		rgba(255, 255, 255, 0.3);
}

.blink_me {
	-webkit-animation-name: blinker;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-name: blinker;
	-moz-animation-duration: 1s;
	-moz-animation-timing-function: linear;
	-moz-animation-iteration-count: infinite;
	animation-name: blinker;
	animation-duration: 1s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

.zoomSmaller {
	zoom: 0.83;
	-moz-transform: scale(0.83);
	-moz-transform-origin: 0 0;
}

.zoomNormal {
	zoom: 1.0;
	-moz-transform: scale(1.0);
	-moz-transform-origin: 0 0;
}

.zoomBigger {
	zoom: 1.2;
	-moz-transform: scale(1.2);
	-moz-transform-origin: 0 0;
}

.zoom1920 {
	zoom: 1.34;
	-moz-transform: scale(1.34);
	-moz-transform-origin: 0 0;
}

.appBg {
	margin-top: 35px;
	background: transparent;
	font-size: 14px;
}

.blinkMe {
	-webkit-animation-name: blinker;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-name: blinker;
	-moz-animation-duration: 1s;
	-moz-animation-timing-function: linear;
	-moz-animation-iteration-count: infinite;
	animation-name: blinker;
	animation-duration: 1s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

.groupPlantCont {
	width: 100%;
}

.plantDiv {
	box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.7) inset;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	-moz-border-radius: 6px;
	margin: 0px;
	outline: none !important;
	text-decoration: none;
	border: none;
	background: #424242;
	color: white;
	padding-left: 8px;
	padding-right: 20px;
	padding-top: 20px;
	padding-bottom: 20px;
	border-bottom: 1px solid #000;
	width: 100%;
	margin-bottom: 10px;
}

.plantTitle {
	font-size: 20px;
	cursor: pointer;
	font-weight: 800;
}

.plantTitle:hover {
	background: #CACACA;
	color: #424242;
}

.lmuTitle {
	font-size: 14px;
}

.imageStdDiv {
	min-width: 50px;
	text-align: center;
}

.descriptionLbl {
	font-size: 14px;
}

.descriptionLbl:hover {
	background: #FFFFFF;
	color: #424242;
}

.alarmActiveLbl {
	box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.7) inset;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	-moz-border-radius: 6px;
	margin: 0px;
	outline: none !important;
	text-decoration: none;
	border: none;
	background: #ff2819;
	color: #424242;
	padding-left: 4px;
	padding-right: 4px;
	padding-top: 2px;
	padding-bottom: 2px;
	font-size: 14px;
	font-weight: 800;
	-webkit-animation-name: blinker;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-name: blinker;
	-moz-animation-duration: 1s;
	-moz-animation-timing-function: linear;
	-moz-animation-iteration-count: infinite;
	animation-name: blinker;
	animation-duration: 1s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

.alarmActiveLbl:hover {
	background: #ff2819;
	color: #424242;
}

.alarmBox {
	cursor: pointer;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	-moz-border-radius: 6px;
	outline: none !important;
	text-decoration: none;
	border: none;
	background: #424242;
	color: white;
	padding-left: 8px;
	padding-right: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	width: 100%;
}

.alarmTimeLbl {
	color: #FFFFFF;
	border-right: 2px dashed #ffffff;
	padding-right: 6px;
	font-size: 14px;
	padding-left: 30px;
}

.alarmTimeLbl:hover {
	background: #FFFFFF;
	color: #424242;
}

.alarmCeasedLbl {
	box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.7) inset;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	-moz-border-radius: 6px;
	margin: 0px;
	outline: none !important;
	text-decoration: none;
	border: none;
	background: #CFBE27;
	color: #424242;
	padding-left: 4px;
	padding-right: 4px;
	padding-top: 2px;
	padding-bottom: 2px;
	font-size: 14px;
	font-weight: 800;
	cursor: pointer;
}

.sectionTitle {
	color: #424242;
	font-size: 16px;
	font-weight: 800;
	padding: 5px;
}

.alarmRow {
	padding: 5px;
}

.alarmfiltervbox {
	text-decoration: none;
	vertical-align: middle;
	padding: 2px;
	border-bottom: 4px solid #424242;
	color: #424242;
	margin-bottom: 10px;
}

.filterBox {
	margin-top: 20px;
	margin-top: 30px;
}

.alarmtabletitle {
	color: #424242;
}

.noAlarmBox {
	background: #6B8F0B;
	text-align: center;
	box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.7) inset;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	-moz-border-radius: 6px;
	margin: 0px;
	outline: none !important;
	text-decoration: none;
	border: none;
	color: #424242;
	padding-left: 4px;
	padding-right: 4px;
	padding-top: 24px;
	padding-bottom: 24px;
	font-size: 14px;
	font-weight: 800;
}

.noAlarmLbl {
	color: #FFFFFF;
	font-size: medium;
	font-weight: bold;
}

.dayHeaderRow {
	font-size: 14px;
	font-weight: bold;
	color: #65A9D7;
}

.alarmTimeEndLbl {
	display: none;
}

.descriptionLblBox {
	min-width: 200px;
}

.styled-table {
	width: 330px;
	margin: 20px 14px 0 14px;
	background: #f8f8f8;
	padding-bottom: 0px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	-moz-box-shadow: 0 2px 15px 0 rgba(0, 0, 0, .2);
	-webkit-box-shadow: 0 2px 15px 0 rgba(0, 0, 0, .2);
	box-shadow: 0 2px 15px 0 rgba(0, 0, 0, .2);
	overflow: visible;
}

.styled-table strong {
	font-weight: 700;
	color: #3d3d3d;
}

.styled-table-header {
	font-weight: 900;
	font-size: 30px;
	text-align: center;
	color: #444;
	margin-bottom: 5px;
	text-shadow: 0px 2px 3px rgba #444;
}

.styled-table-text {
	float: left;
	margin: 5px 30px 0 30px;
	padding: 0 10px 15px 10px;
	border-bottom: 1px solid #ddd;
	text-align: left;
	line-height: 30px;
	font-size: 16px;
	color: #888;
	font-weight: 900;
	color: #3d3d3d;
}

.plantTitleAlarm {
	color: #FF2819;
	font-size: 20px;
	cursor: pointer;
	font-weight: 800;
	transition: all 0.3s;
}

.plantTitleAlarm:hover {
	background: #FFFFFF;
}

.alarmActiveHistoryLbl {
	box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.7) inset;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	-moz-border-radius: 6px;
	margin: 0px;
	outline: none !important;
	text-decoration: none;
	border: none;
	background: #ff2819;
	color: #424242;
	padding-left: 4px;
	padding-right: 4px;
	padding-top: 2px;
	padding-bottom: 2px;
	font-size: 14px;
	font-weight: 800;
}

.alarmActiveHistoryLbl:hover {
	background: #ff2819;
	color: #424242;
}

.licenseLbl {
	color: #424242;
}

.gridColumnLbl {
	color: #424242;
}

.style1Title {
	color: #424242;
}

.style1Label {
	color: #424242;
}

/*
	Header
*/
.header-button {
	background: none;
	border: none;
	border-radius: 6px;
	cursor: pointer;
	outline: none;
}

.header-button:hover {
	background: #555;
}

.nashUserDiv {
	float: left;
	padding: 0px 4px;
}

.user-button {
	background: none;
	border: none;
	border-radius: 3px;
	cursor: pointer;
	padding: 8 10px;
}

.user-button:hover {
	background: #555;
}

/* Vertical bar */
.vertical-bar {
	width: 65px;
	margin: 0px;
	overflow: visible;
	position: relative;
	top: 0px;
	left: 0px;
	background: #444;
	min-height: 100%;
}

.vertical-bar-button, .vertical-bar-buttonActive {
	width: 62px;
	height: 62px;
	cursor: pointer;
	border-radius: 5px;
	border: none;
	background: none;
	margin-bottom: 5px;
	color: #fff;
}

.vertical-bar-button:hover, .vertical-bar-buttonActive,
	.vertical-bar-buttonSmall:hover {
	background: #888;
}

.vertical-bar-button>img, .vertical-bar-buttonActive>img {
	width: 35px;
}

.vertical-bar-buttonSmall {
	width: 45px;
	height: 45px;
	cursor: pointer;
	border-radius: 5px;
	border: none;
	background: none;
	margin-bottom: 5px;
}

.vertical-bar-buttonSmall>img {
	width: 30px;
}

/* Search Left bar */
.left-bar {
	position: absolute;
	top: 0;
	left: 0;
	width: 500px;
	height: 100vh;
	z-index: 100;
	background-color: #222;
}

.bar-visible {
	display: block;
}

.bar-notvisible {
	display: none;
}

.bar-actions-container {
	width: 100%;
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	height: 50px;
	margin-bottom: 4px;
}

.bar-tree-container {
	width: 500px;
	height: calc(100vh - 55px);
	overflow-x: hidden;
	overflow-y: scroll;
	top: 0;
	position: relative;
}

.bar-tree-container>.z-tree>.z-tree-body {
	padding-bottom: 15px;
}

.nav-bar-button {
	background: none;
	border: none;
	width: 45%;
	height: 40px;
	border-radius: 0;
	border-bottom: 2px solid #ccc;
	color: #ccc;
	margin: 0;
	font-size: 18px;
	cursor: pointer;
	outline: none;
}

.nav-bar-button:hover, .nav-bar-button-selected {
	border-bottom: 2px solid #eee;
	color: #eee;
	background: linear-gradient(to top, rgba(255, 255, 255, 0.5) 0, #222 10%);
}

.nav-bar-button img {
	width: 20px;
	filter: invert(30%);
}

.nav-bar-button:hover img, .nav-bar-button-selected img {
	filter: invert(0%);
}

.bar-button {
	cursor: pointer;
	background: #333;
	border: 1px solid rgb(241, 241, 241);
	color: rgb(241, 241, 241);
	font-size: 16px;
	padding: 5px 8px;
	border-radius: 2px;
	font-weight: bold;
}

.bar-button:hover {
	background: rgb(241, 241, 241);
	border: 1px solid rgb(241, 241, 241);
	color: #222;
}

.red-bar-button {
	cursor: pointer;
	background: #333;
	border: none;
	color: rgb(241, 241, 241);
	border-radius: 2px;
	font-weight: bold;
	margin: auto;
	font-size: 15px;
	padding: 2px 5px;
	cursor: pointer;
}

.red-bar-button:hover {
	background-color: #d21b0d;
}

.search-button {
	width: auto;
	height: auto;
	padding: 4px;
	margin: 0 5px;
}

.simple-search-container {
	display: flex;
	flex-wrap: nowrap;
}

.result-grid {
	border: none;
}

.oven-row {
	cursor: pointer;
	border: none;
	color: #f1f1f1;
}

.oven-row:hover td {
	background: rgba(235, 235, 235) !important;
}

.service-btn-container {
	margin-left: 300px;
	position: relative;
	z-index: 100;
	background: #ddd;
}

/* Edit */
.edit-container {
	background: #eee;
	padding: 10px 15px;
	border-radius: 4px;
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
}

/* Oven containers */
.main-container {
	height: calc(100vh - 140px);
	overflow: auto;
}

.pb-30 {
	padding-bottom: 30px;
}

.short-container {
	max-height: calc(100vh - 240px) !important;
}

/* Settings */
.rowSettings {
	width: 100%;
	display: flex;
	padding: 5px 0;
}

.modal {
	position: fixed;
	z-index: 100;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgba(0, 0, 0, 0.4);
}

.modal-content {
	background-color: #fefefe;
	margin: 12% auto;
	padding: 20px;
	border: 1px solid #888;
	width: max-content;
}

.modal-container {
	display: grid;
	justify-content: center;
	text-align: center;
}

.modal-title {
	margin-top: 15px;
	margin-bottom: 35px;
}

.modal-title span {
	font-size: 22px;
}

.modal-form span, .modal-form input {
	font-size: 18px;
}

.modal-form span {
	margin-right: auto;
}

.modal-form {
	margin: 0 10px 20px 10px;
	display: flex;
}

.modal-actions button {
	font-size: 16px;
	margin-bottom: 25px;
}

.modal-errors span {
	font-size: 15px;
	color: red;
}

.modal-errors {
	margin-bottom: 15px;
}

.modal-btn {
	background: #fdfdfd;
	color: #444;
	border: 1px solid #444;
	padding: 6px 4px;
	margin: 5px;
	font-size: 16px;
	cursor: pointer;
}

.modal-btn:hover {
	background: #444;
	color: #fdfdfd;
}

/* New style */
.noborder-container {
	padding: 5px 15px;
}

.mr-5 {
	margin-right: 5px;
}

.ml-5 {
	margin-left: 5px;
}

.mt-5 {
	margin-top: 5px;
}

.mb-10 {
	margin-bottom: 10px;
}

.mt-10 {
	margin-top: 10px;
}

.hidden {
	display: none !important;
}

.main-content {
	display: flex;
	background: #ddd;
	width: 100%;
}

.new-style-button {
	background: #fefefe;
	border: 1px solid #444;
	margin: 2px 5px;
	padding: 5px 7px;
	font-size: 15px;
	cursor: pointer;
	color: #444;
	height: max-content;
	border-radius: 4px;
}

.new-style-button:hover {
	background: #444;
	color: #fefefe;
}

.ns-button-image img {
	filter: invert(70%);
}

.ns-button-image:hover img {
	filter: invert(0%);
}

.new-style-button-red {
	background: #fefefe;
	border: 1px solid #8c1212;
	margin: 2px 5px;
	padding: 5px 7px;
	font-size: 15px;
	cursor: pointer;
	color: #8c1212;
	height: max-content;
	border-radius: 4px;
}

.new-style-button-red:hover {
	background: #8c1212;
	color: #fefefe;
}

.new-style-button-red.z-button-os.z-button-os-disd {
	color: #999;
	cursor: default;
	background: #eee;
	border: 1px solid #7d3838;
}

.new-style-button.z-button-os.z-button-os-disd {
	color: #999;
	cursor: default;
	background: #eee;
}

.ns-button-image.z-button-os.z-button-os-disd img {
	filter: invert(50%);
}

.new-style-button .z-label {
	font-size: 15px;
}

.half-width {
	width: 50% !important;
}
.small-width {
	width: 40% !important;
}

.new-style-row {
	display: flex;
	padding: 8px;
	align-items: center;
	flex-wrap: wrap;
	border-bottom: 1px solid #e5e5e5;
}

.new-style-flexcolumn {
	display: flex;
	flex-direction: column;
}

.new-style-flexrow {
	display: flex;
	flex-direction: row;
}

.new-style-flexcentered {
	align-items: center;
}

.new-style-flexwrap {
	flex-wrap: wrap;
}

.setting-column {
	margin: 0 25px;
}

.new-style-setting-textbox {
	font-size: 14px;
	padding: 0 2px;
	height: min-content;
}

.settingsTextbox {
	margin: 0 15px;
	font-size: 12px;
	height: 18px;
	min-width: 250px;
}

.settingsTextbox-small {
	font-size: 12px;
	height: 18px;
	width: 50px;
}
/* Navigation tab */
.ns-navtab-button {
	background: none;
	border: none;
	width: 150px;
	min-width: 150px;
	height: 60px;
	border-radius: 0;
	border-bottom: 2px solid #777;
	color: #444;
	margin: 0;
	font-size: 16px;
	cursor: pointer;
	outline: none;
}

.ns-navtab-button:hover, .ns-navtab-button-selected {
	border-bottom: 2px solid #002f79;
	color: #002f79;
	background: linear-gradient(to top, rgba(0, 47, 121, 0.4) 0, #ddd 10%);
}

.ns-navtab-button:focus-visible {
	outline: none;
}

.ns-navtab-button.z-button-os.z-button-os-disd {
	border-bottom: 2px solid #999;
	color: #999;
	cursor: default;
	background: none;
}

/*Settings*/
.setting-title {
	font-size: 22px;
	color: #002f79;
}

.settings-tab {
	margin: 20px 0;
	width: 96%;
	background: #eee;
	border-radius: 4px;
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
}

@media screen and (min-width: 833px) {
	.settings-tab {
		width: 45%;
		margin: 20px 2%;
	}
}

@media screen and (min-width: 1257px) {
	.settings-tab {
		margin: 20px 1%;
		width: 30%;
	}
}

.pwdViewImg {
	cursor: pointer;
	margin-left: -23px;
	background-color: #DCDEE2;
	border-radius: 2px;
	width: 22px;
	height: 19px;
	padding: 0;
	border: none;
}

.pwdViewImg img {
	width: 22px;
	height: 19px;
}

.pwdViewImg-disabled {
	cursor: auto;
}

.textboxPwd {
	padding-right: 25px;
	margin-left: 2px;
}

/* Counters */
.counters-row {
	display: flex;
	flex-direction: row;
	align-items: center;
	margin-left: 20px;
	padding: 5px 0;
	border-bottom: 1px solid #777;
}

.counters-reset-row {
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	padding: 5px 0;
}

/* IO */
.io-tab {
	padding: 0 20px 20px 0;
	width: max-content;
	background: #eee;
	border-radius: 4px;
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
}

.io-row {
	display: flex;
	flex-direction: row;
	margin: 0 10px;
	padding: 5px 0;
	border-bottom: 1px solid #999;
}

.io-label-cont {
	width: 80%;
}

.io-value-cont {
	flex-grow: 1;
	display: flex;
	align-items: center;
	justify-content: center;
}

.io-large-label {
	width: 180px;
}

.io-value {
	width: 45px;
}

/* Parameters */
.container-params {
	width: 100%;
	display: flex;
	flex-wrap: nowrap;
}

.half-container {
	width: 50%;
}

.tabTitle {
	font-size: 19px;
	color: #002f79;
	margin: 5px 20px 0px 20px;
}

.param-tab {
	margin: 8px;
	display: grid;
	background: #eee;
	border-radius: 4px;
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
}

.parameter-row {
	margin: 8px;
	padding-bottom: 5px;
	align-items: center;
	display: flex;
	justify-content: space-between;
}

.paramLabel {
	float: left;
	font-size: 15px;
	color: #333;
}

.paramValue {
	float: right;
	font-size: 14px;
	color: #222;
	border: 1px solid #999;
	padding: 2px 5px 2px 5px;
	border-radius: 3px;
}

.action-container {
	display: flex;
	justify-content: flex-end;
	margin: 15px 30px 0 0;
}

.info-message {
	padding: 3px 7px 3px 7px;
	color: #04871e;
	font-size: 16px;
}

.modif-input {
	border: 2px solid #03a824;
}

.error-message {
	padding: 3px 7px 3px 7px;
	color: #ab1005;
	font-size: 16px;
}

.error-input {
	border: 1px solid #ab1005;
}
/* Oven state */
.oven-info-container {
	margin: 10px 0 0 10px;
}
.device-infos-container{
	padding: 10px;
	background: #f2f2f2;
	border-radius: 4px;
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
}

/* Header */
.header-button img, .user-button img {
	height: 26px;
	width: 26px;
}

.user-menu-container {
	display: flex;
	width: 100%;
	height: 100%;
}

.bread-crumps-container {
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

/* User edit */
.edit-tab {
	margin-top: 15px;
	padding: 20px;
	width: max-content;
	background: #eee;	
	border-radius: 4px;
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
}

.edit-pwd-modal {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	background: rgba(0, 0, 0, 0.5);
	display: flex;
	align-items: center;
}

.edit-pwd-modal-content {
	background: #eee;
	width: 30%;
	min-width: 450px;
	margin: auto;
	min-height: 350px;
	display: flex;
	flex-direction: column;
	box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.6), 0 0 4px 2px rgb(50, 50, 50);
}

.edit-pwd-modal-actions {
	display: flex;
	padding: 5px 20px;
	margin: 10px 0;
	justify-content: end;
}

.edit-pwd-modal-body {
	margin: 15px 0;
	padding: 5px 20px;
	flex-grow: 2;
}

.edit-pwd-modal-row {
	margin: 10px 0 20px 0;
	display: flex;
}

.edit-pwd-modal-label {
	width: 40%;
	padding-right: 10px;
	font-size: 18px;
	font-family: Arial;
}

.edit-pwd-modal-input {
	width: 60%;
}

.edit-pwd-modal-input input {
	width: 90%;
	font-size: 16px;
}

.edit-pwd-modal-error {
	padding: 40px 0;
}

.edit-pwd-modal-errLabel {
	font-style: italic;
	color: rgb(179, 35, 35);
	font-size: 17px;
}
/* WashUI*/
.washUI-container {
	padding: 5px;
	background: #eaeaea;
	border-radius: 4px;
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
	color: #222;
	width: 220px;
}