/* general styles */
@import url("font-sm.css");
@import url("font-aw.css");
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700&subset=latin-ext');

body {
	background-color:#f5f6f7;
	color: #616161;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	letter-spacing: 0.02em;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: 400;
}

ul, li, div, html, body, form {
	padding:0;
	margin:0;
}

#logo_trans {
	display: block;
	width: 100%;
	height: 100%;
	background: url('../branding/logo.png') 18px center no-repeat;
	background-size: auto 50px;
	padding: 0;
}

#container {
	width:100%;
	margin:0;
	font-size:14px;
	background:url('../images/bg_cont.png') left bottom repeat-x;
	background-color:#eceff1;
	height:100%;
	position: relative;
}

#min_height {
	float:left;
	height: 46em;
	width: 1px;
	margin: 0 0 0 -1px;
}

#sidebar {
	float:left;
	width:205px;
	background:#eceff1;
	margin: 0; padding: 0;
	/* tento styl nemenit !! .. je to soucast "Majtrosky". Styl upravuj v #sidebar-content */
}

#sidebar-content {
	margin:0;
	padding:0;
}

#main-div {
	margin: -38px 0px 0px 205px;
	padding: 0;
	/* tento styl nemenit !! .. je to soucast "Majtrosky". Styl upravuj v #main-content */
}

#main-content {
	background-color:#f5f6f7;
	-moz-border-radius:15px 0 0 15px;
	-webkit-border-radius:15px 0 0 15px;
	border-radius:15px 0 0 15px;
	/*overflow:auto;*/
	padding: 0px 0px 10px;
	min-height: calc(100vh - 49px);
}

#top_area {
	display:block;
}

#content {
	display:block;
	padding:1em 2em 0;
	/*overflow: hidden; !* zajisti, aby <hr class=cleaner> fungoval pouze relativne uvnitr #content *!*/
}

hr.cleaner {
	clear:both;
	height:1px;
	margin:-1px 0 0 0; padding:0;
	border:none;
	visibility:hidden;
}

/* -------------------------------------------------------------------------- */
/*	                        SIDEBAR (menu)                                */
/* -------------------------------------------------------------------------- */

#logo {
	height:65px;
	width:100%;
	background:#EC9207;
	padding:5px 0;
}

.arrow-left, .arrow-right {
	position: absolute !important;
	left: 100%;
	padding: 5px 25px 5px 10px !important;
}

.arrow-left {
	margin: -12px 0px 0px -5px !important;
	border-radius: 0 !important;
}

.arrow-right {

	margin: -12px 0px 0px 30px !important;
	border-radius: 0px 0px 5px 0px !important;
}

#menu ul {
	list-style-type:none;
	padding:0;
}

#sideMenu,
#sideMenu ul,
#sideMenu ul li,
#sideMenu ul li a {
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
	line-height: 1;
	display: block;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#sideMenu {
	width: 100%;
	color: #BDEF16;
}

#sideMenu ul ul {
	display: none;
}

#sideMenu > ul > li.active > ul {
	display: block;
}

.align-right {
	float: right;
}

#sideMenu > ul > li > a {
	padding: 16px 10px 16px 18px;
	cursor: pointer;
	z-index: 2;
	font-size: 16px;
	text-decoration: none;
	color: #616366;
	-webkit-transition: color .2s ease;
	-o-transition: color .2s ease;
	transition: color .2s ease;
}

#sideMenu > ul > li.open > a,
#sideMenu > ul > li > a:hover {
	color: #000;
	background:#cfd8dc;
}

#sideMenu .selected > a:after {
	content: "";
	position: absolute;
	left: 196px;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 8px 9px 8px 0px;
	border-color: transparent #f5f6f7 transparent transparent;
}

#sideMenu ul > li.has-sub > a:after {
	position: absolute;
	right: 22px;
	top: 19px;
	z-index: 5;
	display: block;
	height: 10px;
	width: 2px;
	background: #919599;
	content: "";
	-webkit-transition: all 0.1s ease-out;
	-moz-transition: all 0.1s ease-out;
	-ms-transition: all 0.1s ease-out;
	-o-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;
}

#sideMenu ul > li.has-sub > a:before {
	position: absolute;
	right: 18px;
	top: 23px;
	display: block;
	width: 10px;
	height: 2px;
	background: #919599;
	content: "";
	-webkit-transition: all 0.1s ease-out;
	-moz-transition: all 0.1s ease-out;
	-ms-transition: all 0.1s ease-out;
	-o-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;
}

#sideMenu ul > li.has-sub.open > a:after,
#sideMenu ul > li.has-sub.open > a:before {
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}

#sideMenu ul ul li a {
	padding: 10px 0px 10px 18px;
	cursor: pointer;
	z-index: 2;
	background:#dde3e6;
	color:#616366;
	text-decoration: none;
	-webkit-transition: color .2s ease;
	-o-transition: color .2s ease;
	transition: color .2s ease;
}

#sideMenu ul ul ul li a {
	padding-left: 32px;
}

#sideMenu ul ul li a:hover {
	color: #000;
}

#sideMenu ul ul > li.has-sub > a:after {
	top: 16px;
	right: 26px;
	background: #fff;
}

#sideMenu ul ul > li.has-sub > a:before {
	top: 20px;
	background: #fff;
}

#sideMenu a i.fa {
	margin-right: 8px;
	font-size: 18px;
	line-height: 14px;
}

#sideMenu li > ul > li a:hover,
#sideMenu li > ul > li.selected a {
	background:#cfd6db;
}

#sideMenu li > ul > li .selected a:hover {
	color:#000;
}

#info {
	padding: 0 1rem;
}

#config_area {
	display: none;
	position: absolute;
	right:0;
	width: 125px;
	min-height:150px;
	padding: 10px;
	z-index:100;
	border:4px solid #95BE0E;
	border-right:none;
	background: #fff;
	color: #92BE0C;
	text-align: center;
}

#submit_area {
	display: none;
	text-align: center;
	padding: 0px 0px 20px;
}

#main-content #submit_area .primary-btn {
	display: inline;
	float:none;
	background: #759F20;
}

#main-content #submit_area .primary-btn:hover {
	background: #95BE0E;
}

#submit_area .primary-btn:before,
#submit_area .cancel-btn:before {
	font-family: font_sm;
	content: "\e81e";
	margin-right: 10px;
	font-size: 20px;
}

#main-content #submit_area .cancel-btn {
	display: inline;
	float:none;
	background: #A1A1A1;
}

#main-content #submit_area .cancel-btn:hover {
	background: #B1B1B1;
}

#submit_area .cancel-btn:before {
	content: "\e832";
}

#menu #topLinks a,
#menu #topTools a {
	text-align:center;
	color:#fff;
	text-decoration:none;
}
#menu #topLinks a:hover,
#menu #topLinks a.active,
#menu #topTools a:hover {
	color:#000;
}

#menu #topLinks { position:absolute; top:5px; right:10px; font-size:10px; }
#menu #topLinks li { display: inline-block; }
#menu #topLinks a { font-size:11px; margin-right:15px; letter-spacing:0.05em; }
#menu #topLinks a:before { font-family: font_sm; font-size:16px; line-height:16px; vertical-align:middle; margin:0 5px; }
#menu #topLinks .wizard a:before { content: '\e82c'; }
#menu #topLinks .old a:before { content: '\e80b'; font-size:19px; font-family: font_sm; }
#menu #topLinks .web a:before { content: '\e81f'; font-size:16px; font-family: font_sm; }
#menu #topLinks .portal a:before { content: '\e823'; font-size:16px; font-family: font_sm; }
#menu #topLinks .wiki a:before { content: '\e82d'; }

#menu #todayInfo { position:absolute; top:33px; right:0; }
#menu #todayInfo div { display:inline-block; color:#6A6767; padding-right:20px; }
#menu #todayInfo dt { font-size:12px; }
#menu #todayInfo dd { font-size:18px; text-align:left; margin:0; }

#menu #topTools { position:absolute; top:81px; right:0; display:table; font-size:10px; }
#menu #topTools ul { display:table-cell; }
#menu #topTools li { display: table-cell; width:35px; }
#menu #topTools a { display:block; float:left; width:100%; }
#menu #topTools a span { display:none; }

#lang_area {
	display: none;
	position: absolute;
	right: 0;
	width: 175px;
	min-height: 34px;
	padding: 1px;
	z-index: 100;
	border-right: none;
	background: #fff;
	text-align: center;
}

#menu #lang a span {display:none; }
#menu #lang li { display:table-cell; }
#menu #lang a { display: block; width:24px; height:24px; margin:5px 0; opacity:0.3; cursor:pointer; }
#menu #lang li { padding: 0px 5px; }

.cs a, .en a, .de a,
.pt a, .el a, .fr a,
.it a, .es a, .sk a,
.pl a {
	background:url('../images/flags.png');
	background-repeat: no-repeat;
	height: 24px !important;
	width: 24px !important;
}

.cs a { background-position: 0px 0px; }
.de a { background-position: -24px 0px; }
.en a { background-position: -48px 0px; }
.es a { background-position: -72px 0px; }
.fr a { background-position: -96px 0px; }
.el a { background-position: -120px 0px; }
.it a { background-position: -144px 0px; }
.pl a { background-position: -168px 0px; }
.pt a { background-position: -192px 0px; }
.sk a { background-position: -216px 0px; }

#menu #lang a.active,
#menu #lang a:hover { opacity:1; }
#menu #topTools #tools a:before { display: inline-block; font-family: font_sm; font-size:20px; line-height:35px; vertical-align:middle; margin:0 5px; }
#menu #topTools .messages:before { background:#D90000; border-radius: 100%; content:'10'; padding: 3px; line-height:100%; position:absolute; top:24px; margin-left:-20px; color:#fff; }
#menu #topTools .messages a { background:#A1A1A1; border-radius: 5px 0 0 5px; padding-right: 5px; margin-right:-5px; }
#menu #topTools .messages a:before { content: '\e82e'; }
#menu #topTools .logout a,
#menu #topTools .restart a { background:#E76A0A; color:#fff; border-radius: 5px 0 0 5px; }
#menu #topTools .logout a:hover,
#menu #topTools .restart a:hover { background:#FF0000;	color:#fff; }
#menu #topTools .restart a:before { content: '\e82f'; }
#menu #topTools #tools .logout a:before { content: '\f011'; font-family: font_aw; }
#menu #topTools .config { background: #E76A0A; }
#menu #topTools .config a { background:#95BE0E; border-radius: 5px 0 0 5px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; width:35px;  }
#menu #topTools .config a.active { position:absolute; height:35px; transform: translate(-124px, 0); top:0; z-index:99; }
#menu #topTools .config a:before { content: '\e829'; }
#menu #topTools #lang_but a { width:24px; height:24px; margin:5px 0; cursor:pointer; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; }
#menu #topTools #lang_but a.active { position:absolute; transform: translate(-72px, 0); top:1px; z-index:99; }

/* -------------------------------------------------------------------------- */
/*                            TOP AREA                                        */
/* -------------------------------------------------------------------------- */

#top_area #caption {
	display:block;
	float:right;
	margin:1.2em 1em 0 0;
	text-align:right;
	font-variant:small-caps;
	font-weight:bold;
	letter-spacing:2px;
}

#top_area #dev_name {
	display:block;
	margin:0;
	padding:15px 25px 11px 25px;
	text-align:left;
	font-size: 28px;
	line-height:100%;
	font-weight: 400;
	color:#E56A0A;
}

#top_area #dev_name span {
	margin-right:10px;
	color:#A1A1A1;
}

/* -------------------------------------------------------------------------- */
/*                            BREADCRUMB                                      */
/* -------------------------------------------------------------------------- */

#breadcrumb {
	background: #ddd;
	background: -moz-linear-gradient(left, #f5f6f7 0%, #dddddd 35px, #dddddd 100%);
	background: -webkit-linear-gradient(left, #f5f6f7 0%,#dddddd 35px,#dddddd 100%);
	background: linear-gradient(to right, #f5f6f7 0%,#dddddd 35px,#dddddd 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f6f7', endColorstr='#dddddd',GradientType=1 );
	color:#A1A1A1;
	padding:9px 17px 9px 19px;
	font-size:12px;
	margin:0 0 20px 0;
}

#breadcrumb i.fsm {
	margin:0 5px;
	font-size:14px;
	vertical-align:middle;
	padding-bottom:3px;
}

#breadcrumb a {
	text-decoration:none;
	color:#A1A1A1;
}

#breadcrumb a:hover {
	color:#676767;
}

#breadcrumb span {
	color:#E76A0A;
}

/* -------------------------------------------------------------------------- */
/*                            CONTENT                                         */
/* -------------------------------------------------------------------------- */

#content dl {
	float:right;
	text-align:right;
	margin:30px 25px 0 0;
}

#content dd {
	margin:0 0 0 10px;
}

#content dd.large {
	font-size:30px;
	margin-bottom:10px;
}

#content ul {
	margin:1em 0 0 1.5em;
	font-size:9px;
}

/* -------------------------------------------------------------------------- */
/*                             ICONS                                          */
/* -------------------------------------------------------------------------- */

.ok-ico { background: transparent url(../images/tick.png) 0px 0px no-repeat; padding-left: 1em; font-size: 1.3em; }
.warning-ico:before {font: normal normal 15px 'font_aw'; content: "\f071"; margin-right: 3px; }
.online-ico:before {font: normal normal 15px 'font_aw'; content: "\f0c1"; margin-right: 3px; }
.offline-ico:before {font: normal normal 15px 'font_aw'; content: "\f127"; margin-right: 3px; }
.send-history-ico:before {font: normal normal 15px 'font_aw'; content: "\f1da"; margin-right: 3px; }
.wrong-time-ico:before {font: normal normal 15px 'font_aw'; content: "\f017"; margin-right: 3px; }
.license-ico:before {font: normal normal 15px 'font_aw'; content: "\f273"; margin-right: 3px; }
.stop-ico { background: transparent url(../images/stop.png) 0px 1px no-repeat; padding-left: 1.5em; font-size: 1.3em; }
.loading { background: transparent url(../images/spinner.gif) no-repeat center; width: auto; height:88px; }
.minus-ico { cursor:pointer; background: transparent url(../images/minus.png) 0px 1px no-repeat; padding-left: 1.5em; font-size: 1.3em; }
.plus-ico { cursor:pointer; background: transparent url(../images/plus.png) 0px 1px no-repeat; padding-left: 1.5em; font-size: 1.3em; }
.url-ico { cursor:pointer; background: transparent url(../images/url.gif) 0px 1px no-repeat; padding-left: 1.5em; font-size: 1.3em; }
.symlink-ico { cursor:pointer; background: transparent url(../images/symlink.png) 0px 1px no-repeat; padding-left: 1em; font-size: 1em; }
.save-ico { cursor:pointer; background: transparent url(../images/save.png) 0px 1px no-repeat; padding-left: 1.5em; font-size: 1.3em; }
.ledoff-ico { background: transparent url(../images/ledoff.gif) 0px 1px no-repeat; padding-left: 1.5em; font-size: 1.3em; }
.ledon-ico { background: transparent url(../images/ledblink.gif) 0px 1px no-repeat; padding-left: 1.5em; font-size: 1.3em; }
.calc-ico { cursor:pointer; background: transparent url(../images/calculator.png) 0px 1px no-repeat; padding-left: 1.5em; font-size: 1.8em; }
.find-ico { cursor:pointer; background: transparent url(../images/find.png) 0px 1px no-repeat; padding-left: 1.5em; font-size: 1.3em; }
.ote-logo { cursor:pointer; background: transparent url(../images/ote_logo.png) 0px 1px no-repeat; padding-left: 3em; font-size: 1.8em; }
.ote-ico { background: transparent url(../images/ote_ico.png) 0px 0px no-repeat; padding-left: 3em; font-size: .8em; }
.status-ok-ico { background: transparent url(../images/status_ok.png) 0px center no-repeat; padding-left: 1.5em; font-size: 1.3em; }
.status-ko-ico { background: transparent url(../images/status_ko.png) 0px center no-repeat; padding-left: 1.5em; font-size: 1.3em; }
.status-rdy-ico { background: transparent url(../images/status_rdy.png) 0px center no-repeat; padding-left: 1.5em; font-size: 1.3em; }
.send-receive-ico { background: transparent url(../images/send_receive.png) 0px 1px no-repeat; padding-left: 1.5em; font-size: 1.3em; }
.reload-ico { cursor: pointer; background: transparent url(../images/reload.png) 0px 1px no-repeat; padding-left: 1.5em; font-size: 1.3em; }
.isync-ico:before { cursor:pointer; font: normal normal 15px 'font_aw'; content: "\f021"; margin-right: 3px; }
.refresh-ico { cursor: pointer; background: transparent url(../images/refresh.png) 0px 1px no-repeat; padding-left: 1em; font-size: 1.3em; }
.bottom-ico { cursor: pointer; background: transparent url(../images/bottom.png) 0px 1px no-repeat; padding-left: 1em; font-size: 1.3em; }

.preview-ico:before { cursor:pointer; font: normal normal 15px 'font_aw'; content: "\f1c1"; margin-right: 3px; }
.invoice-ico:before { cursor:pointer; font: normal normal 15px 'font_aw'; content: "\f155"; margin-right: 3px; }  /*f0d6*/
.support-ico:before { cursor:pointer; font: normal normal 15px 'font_aw'; content: "\f025"; margin-right: 3px; }
.coins-ico:before { cursor:pointer; font: normal normal 15px 'font_aw'; content: "\f0c5"; margin-right: 3px; }
.coinsplus-ico { cursor: pointer; background: transparent url(../images/coins_plus.png) 0px 1px no-repeat; padding-left: 1.5em; font-size: 1.3em; }
.detele-ico { cursor: pointer; background: transparent url(../images/cross.png) 0px 1px no-repeat; padding-left: 1.5em; font-size: 1.3em; }
.edit-ico:before { cursor:pointer; font: normal normal 15px 'font_aw'; content: "\f044"; margin-right: 3px; }
.chart-link-ico:before { cursor:pointer; font: normal normal 15px 'font_aw'; content: "\f201"; margin-right: 3px; }

.unlock-ico:before {font: normal normal 15px 'font_aw'; content: "\f09c"; margin-right: 3px; }
.lock-ico:before {font: normal normal 15px 'font_aw'; content: "\f023"; margin-right: 3px; }
.link-ico:before {font: normal normal 15px 'font_aw'; content: "\f08e"; margin-right: 3px; }

/* -------------------------------------------------------------------------- */
/*                            TABLES                                          */
/* -------------------------------------------------------------------------- */

.ui-accordion-header,
.ui-accordion .table {
	margin: 0;
}

.ui-accordion-header {
	cursor: pointer;
}

.ui-accordion-header > span.ui-icon {
	float: left;
	position: absolute;
	margin: 10px 0 0 -5px;
	color: #E76A0A;
	font-size: 1.1em;
}

.ui-accordion-header label {
	padding-left: 20px;
	line-height: 44px;
	border-bottom: 1px solid #ccc;
}

.ui-accordion-header table {
	font-size: 14px;
}

.ui-accordion .nazev {
		padding-left: 20px;
		line-height: 40px;
}

.ui-accordion .table td:first-child {
	padding-left: 20px;
}

.ui-accordion-content {
	background: #eee;
}

td.name {
	color:#9A9898;
	padding-right: 10px;
}

#content .large td {
	text-align:center;
	font-weight:bold;
	font-size:40px;
}

table.table tr.odd.row_selected td,
table.table tr.even.row_selected td {
	background-color: #DDDDDD;
}

table.table tr.odd.row_selected td.sorting_1,
table.table tr.even.row_selected td.sorting_1 {
	background-color: #CCCCCC;
}

.tbl_half {
	width:50%;
	cursor:default;
}

#content .totalval td {
	text-align:center;
	font-size:16px;
}

.highlight thead,
.highlight tr {
	border-bottom:1px solid #ccc;
}

.highlight tbody tr:nth-child(odd) {
	background: rgba(255,255,255,0.6);
}

.highlight tbody tr:nth-child(even) {
	background: rgba(255,255,255,0.3);
}

.highlight tbody tr:hover {
	background: rgba(255,255,255,1);
}

.highlight td {
	padding:4px 4px 2px 4px;
	cursor:pointer;
}

.tbl_full {
	width:100%;
}

.tbl_full_with_scroll {
	width:54em;
	margin-left:1em;
}

.tbl_full_with_scroll tbody td {
	border:1px solid #F0F0F0;
	border-bottom:1px solid #999;
}

.scroll {
	display:block;
	height:33em;
	overflow-y:auto;
	overflow-x:hidden;
}

.last_sen {
	border-bottom:1px solid #939598;
}

span.label {
	position: relative;
	display: block;
	margin: 10px auto 30px !important;
	text-align: center;
	font-size: 15px;
}

span.label span, .drag_helper .custom_draggable_label_item, .placement_val {
	position: relative;
	display: inline-block;
		padding: 4px 10px;
		margin: 4px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	color: #fff;
}

span.label span span {
	margin: -3px 0 0 -4px;
}

span.label b, .drag_helper .custom_draggable_label_item b {
	font-weight: 900;
	font-size: 18px;
	margin-left: 8px;
}

/* -------------------------------------------------------------------------- */
/*		                     Colors                                   */
/* -------------------------------------------------------------------------- */

.alarm { color:#f00; }
.warning { color:#EB7B27; }
.ok { color:#0a5; }
.on { color:#E76A0A; }
.timeout { color:#DBDBDB; }
.description { color:#999; }
.black { color:#6A6767; }

/* -------------------------------------------------------------------------- */
/*	                        Text aligns                                   */
/* -------------------------------------------------------------------------- */

.left {
	text-align:left !important;
}

.right {
	text-align:right !important;
}

.center, .text-center {
	text-align:center !important;
}

/* -------------------------------------------------------------------------- */
/*                                 Forms                                      */
/* -------------------------------------------------------------------------- */

#content input {
	padding:0 0 0 .2em;
	margin: 0;
	width:95%;
	font-size:13px;
}

#content input:disabled {
	background: #dddddd !important;
	color: #000;
}

#content select:disabled {
	background: #dddddd !important;
	color: #000;
}

.input_text_2 {
	width:2em;
}

.input_text_port {
	width:3em;
}

.input_text_date {
	width:5em;
}

.checkbox {
	width:auto;
	margin-top:-3px;
	margin-bottom:-2px;
}

#ident input {
	margin-top:-2px;
	margin-bottom:-1px;
}

#inv_cfg input,#inv_cfg select,
#inv_enrg input,#inv_cfg select {
	margin-top:-1px;
	margin-bottom:-2px;
}

/* -------------------------------------------------------------------------- */
/*                                 Bottom line                                */
/* -------------------------------------------------------------------------- */

#bottom-contact {
	margin:1em 0;
	font-size:11px;
	text-align:center;
}

#bottom-contact a {
	color:#fff;
	text-decoration:none;
}

#bottom-contact a:hover {
	color:#000;
}

/* -------------------------------------------------------------------------- */
/*                                    Tooltips                                */
/* -------------------------------------------------------------------------- */

h1 .info {
	font-size:16px;
	margin-left:2em;
}

td .info {
	font-weight:bold;
}

.info {
	color:#F90;
	cursor:default;
}

/* Reset for -webkit / -moz browser
=============================== */
#content input[type="search"]::-webkit-search-decoration,
#content input[type="search"]::-webkit-search-cancel-button,
#content input[type="search"]::-webkit-search-results-button,
#content input[type="search"]::-webkit-search-results-decoration { display:none; }

#content select,
#content input[type="button"],
#content input[type="submit"],
#content input[type="search"] {
	-webkit-tap-highlight-color:transparent;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
	-webkit-border-radius:0px;
	border-radius:0px;
}

/* Inputs
=============================== */

#content .input { position:relative; }

#content .link {
	border-bottom:1px solid #90caf9;
	color:#1e88e5;
	font-size:14px;
	line-height:inherit;
	text-decoration:none;
}
#content .link:hover { border-bottom:none; }

#content .inline-group { display:inline-block; }

#content .hidden { display:none; }

#content .success { color: #739F1F; }
#content .success:before { content: '\e830'; font-family: font_sm; margin:0 5px; }
#content .error { color: #FF0000; }
#content .error:before { content: '\e814'; font-family: font_sm; margin:0 5px; }

#content .state_on { color: #739F1F; }

#content .state_on:before { content: '\e831'; font-family: font_sm; margin:0 5px; }
#content .state_off { color: #777; }
#content .off-ico { background: transparent url(../images/cross.png) 0px 0px no-repeat; padding-left: 1em; font-size: 1.3em; }
#content .state_off:before { content: '\e832'; font-family: font_sm; margin:0 5px; }
#content .state_undef { color: #FFBE00; }
#content .state_undef:before { content: '\e82d'; font-family: font_sm; margin:0 5px; }

#content .state_link,
#content .state_unlink { color: #E97925;font-size:26px;padding-top:12px; }
#content .state_link:before { content: '\e82b'; font-family: font_sm; margin:0 5px; }
#content .state_unlink:before { content: '\e82a'; font-family: font_sm; margin:0 5px; }
body.values #content .state_link,
body.values #content .state_unlink { font-size:14px;padding-top:0; }

#content input[type="text"],
#content input[type="password"],
#content input[type="email"],
#content input[type="search"],
#content input[type="date"],
#content input[type="url"],
#content textarea,
#content select {
	background:#fff;
	border:2px solid #A1A1A1;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-o-border-radius:3px;
	border-radius:3px;
	color:rgba(0,0,0,.87);
	display:block;
	font-family:inherit;
	font-size:14px;
	font-weight: 400;
	height:26px;
	line-height: 100%;
	padding:0 10px;
	width:100%;
	outline:none;
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-transition:all.4s;
	-moz-transition:all.4s;
	-ms-transition:all.4s;
	-o-transition:all.4s;
	transition:all.4s;
}

#content input.inline,
#content .dataTables_length select {
	display:inline-block;
	width:auto;
}

#content input.small,
#content label.small {
	height: 16px;
	line-height: 16px;
}

.dataTables_filter #search {
	float: left;
	margin: -10px 10px 0 0;
}

#content .dataTables_filter input[type="text"],
#content .dataTables_filter input[type="date"] {
	font-size: 11px;
	height: 24px;
	padding: 5px 10px;
	width: auto;
	margin: 10px 0 0 10px;
}

#content .table-buttons button {
	padding: 0 11px;
}

#content .table-buttons button.ui-state-disabled {
	opacity: 0.2;
}

#content .table-buttons button span {
	color: #fff;
}

#content .table-buttons button:hover span {
	color: #000;
}

.small-btn.fa-plus,
#content .table-buttons button.add_row {
	background-color: #95BE0E !important;
}

.small-btn.fa-trash,
#content .table-buttons button.delete_row {
	background-color: #FF0000 !important;
}

#content input[type="text"]:hover,
#content input[type="date"]:hover,
#content input[type="password"]:hover,
#content input[type="email"]:hover,
#content input[type="search"]:hover,
#content input[type="url"]:hover,
#content textarea:hover,
#content select:hover { border:2px solid rgba(233,109,15,0.6); }

#content input[type="text"]:focus,
#content input[type="date"]:focus,
#content input[type="password"]:focus,
#content input[type="email"]:focus,
#content input[type="search"]:focus,
#content input[type="url"]:focus,
#content textarea:focus,
#content select:focus { border:2px solid rgba(233,109,15,0.9); }

#content .input textarea {
	height:112px;
	overflow:auto;
	min-height:52px;
	resize:vertical;
}

#content .input textarea:focus { height:128px; }

#content input.hasDatepicker {
	width: 100px;
	margin: 0 15px 0 5px;
	font-size: 14px;
	line-height: 100%;
	height: 26px;
}

[id^="navi"] .tool_bar select,
.panel-ctrls select {
	padding: 0 20px 0 7px;
	font-size: 14px;
	line-height: 100%;
	height: 26px;
}

[id^="navi"] .tool_bar .label,
.panel-ctrls .label {
	margin: 0 !important;
	padding: 0 !important;
}

[id^="navi"] .tool_bar .select i,
.panel-ctrls .select i {
	top: 5px !important;
	right: 6px !important;
}

.panel-ctrls .flex {
	align-items: center;
}

[id^="navi"] .small-btn {
	margin: 0 5px 0 0 !important;
	padding: 0 8px !important;
}

/* Form element
=============================== */

#content fieldset {
	display: block;
	margin: 10px 1% 0 1%;
	padding: 10px 0 0 0;
	border: 0;
	border-top: 1px solid rgba(0, 0, 0, 0.12);
	width: 98%;
}

#content #step-8 fieldset {
	margin: 10px 1% 2px 1% !important;
	padding: 10px 0 2px 0;
}

#content fieldset:last-of-type {
	margin-bottom: 0px;
}

#content legend {
	display: table;
	min-width: 0px;
	max-width: 70%;
	position: relative;
	margin: auto;
	padding: 8px 10px 6px 10px;
	border: 1px solid rgba(0, 0, 0, 0.12);
	border-radius: 3px;
	background-color: #fff;
	color: #E96C0E;
	font-size: 18px;
	line-height:90%;
	text-align: center;
	white-space: nowrap;
}

#content legend.small {
	font-size: 14px;
	color: #A1A1A1;
	background-color: #E1E0E1;
}

/* Labels
=============================== */

#content label {
	display:block;
	color:inherit;
	font-weight: 400;
	text-align:left;
	margin-bottom:0;
}

#content .label, .drag_helper .custom_draggable_label_item { font-size:14px; margin: 2px 0 0 0; line-height:32px; min-height:32px; }
#content .label-big { font-size:17px; line-height:26px; height:26px; }
#content .input { margin: 3px 0; }

#content label.from,
#content label.to,
#content .label-right,
#content .label-center { height:26px; line-height:26px; text-align:center; margin-bottom:0; }
#content .label-right { text-align:right; }

#content .j-row > .label { padding-left:10px; }

/* Radio and checkbox
=============================== */

#content .radio,
#content .checkbox,
#content .radio-toggle,
#content .checkbox-toggle {
	color:rgba(0,0,0,.87);
	cursor:pointer;
	font-size:14px;
	margin-bottom:4px;
	position:relative;
	line-height:14px;
}

#content .radio,
#content .checkbox,
#content .inline-group .radio,
#content .inline-group .checkbox { padding:8px 0 8px 32px; }

#content .radio-toggle,
#content .checkbox-toggle,
#content .inline-group .radio-toggle,
#content .inline-group .checkbox-toggle { padding:8px 0 8px 58px; }
#content .checkbox-toggle.show { padding:8px 0 8px 83px; }
#main-content .small-btn#toggle-all { margin: 4px 0 !important; }

#content .radio:last-child,
#content .checkbox:last-child,
#content .radio-toggle:last-child,
#content .checkbox-toggle:last-child { margin-bottom:0; }

#content .inline-group .radio,
#content .inline-group .checkbox,
#content .inline-group .radio-toggle,
#content .inline-group .checkbox-toggle { display:inline-block; margin-right:25px; }

#content .radio input,
#content .checkbox input,
#content .radio-toggle input,
#content .checkbox-toggle input { position:absolute; left:-9999px; }

#content .radio i,
#content .checkbox i,
#content .checkbox-toggle i,
#content .radio-toggle i {
	border:2px solid rgba(0,0,0,.26);
	background-color:rgba(255,255,255,0.4);
	display:block;
	height:14px;
	left:0;
	outline:none;
	position:absolute;
	top:5px;
	-webkit-transition:border-color.2s;
	-moz-transition:border-color.2s;
	-ms-transition:border-color.2s;
	-o-transition:border-color.2s;
	transition:border-color.2s;
}

#content .radio i,
#content .checkbox i { width:18px; height: 18px; }

#content .radio-toggle i { width:46px; }

#content .checkbox-toggle i {
	height:22px;
	width: 50px;
}

#content .checkbox-toggle.show i {
	height:22px;
	width: 75px;
}

.graph_detail #content .checkbox-toggle i {
	width: 46px;
	height: 18px;
}

#content .checkbox i,
#content .checkbox-toggle i {
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-o-border-radius:3px;
	border-radius:3px;
}

#content .radio i,
#content .radio i:after,
#content .radio-toggle i:before {
	-webkit-border-radius:50%;
	-moz-border-radius:50%;
	-o-border-radius:50%;
	border-radius:50%;
}

#content .radio-toggle i {
	-webkit-border-radius:13px;
	-moz-border-radius:13px;
	-o-border-radius:13px;
	border-radius:13px;
}

#content .checkbox-toggle i:before {
	-webkit-border-radius:2px;
	-moz-border-radius:2px;
	-o-border-radius:2px;
	border-radius:2px;
}

#content .radio i:after {
	background-color:rgba(233,109,15,0.9);
	content:"";
	height:8px;
	top:3px;
	left:3px;
	opacity:0;
	position:absolute;
	width:8px;
}

#content .checkbox i:after {
	border-width:0 0 3px 3px;
	border-bottom:solid rgb(233,109,15);
	border-left:solid rgb(233,109,15);
	content:"";
	height:5px;
	top:3px;
	-webkit-transform:rotate(-45deg);
	-moz-transform:rotate(-45deg);
	-ms-transform:rotate(-45deg);
	-o-transform:rotate(-45deg);
	transform:rotate(-45deg);
	left:3px;
	opacity:0;
	position:absolute;
	width:10px;
}

#content .radio input:checked + i:after,
#content .checkbox input:checked + i:after { opacity:1; }

#content .checkbox-toggle i:before,
#content .radio-toggle i:before {
	border:none;
	background-color:rgba(0,0,0,0.4);
	content:"";
	display:block;
	height:14px;
	left:2px;
	position:absolute;
	top:2px;
	width:14px;
}

#content .checkbox-toggle input:checked + i:before,
#content .radio-toggle input:checked + i:before { left:30px; background-color:rgba(233,109,15,0.9); }

#content .checkbox-toggle.show input:checked + i:before { left:55px; background-color:rgba(233,109,15,0.9); }

#content .checkbox-toggle input:disabled + i:before,
#content .radio-toggle input:disabled + i:before { background-color:rgba(0,0,0,0.26) !important; }
#content .checkbox-toggle input:disabled + i,
#content .radio-toggle input:disabled + i { cursor: no-drop; opacity:0.3; border-color:rgba(0,0,0,.26) !important; }

#content .radio.disabled,
#content .checkbox.disabled,
#content .radio-toggle.disabled,
#content .checkbox-toggle.disabled {
	color:rgba(0,0,0,.26);
	cursor:no-drop;
}

#content .checkbox-toggle i:after,
#content .radio-toggle i:after,
#content .checkbox-toggle input:checked + i:after,
#content .radio-toggle input:checked + i:after {
	font-size:10px;
	font-style:normal;
	font-weight:bold;
	line-height:10px;
	position:absolute;
	top:4px;
}

#content .checkbox-toggle i:after,
#content .radio-toggle i:after { content:"NE"; left:25px; color:rgba(0,0,0,0.60); }

#content .checkbox-toggle input:checked + i:after,
#content .radio-toggle input:checked + i:after { content:"ANO"; left:4px; color:#000000; }

#content .checkbox-toggle.all i:after,
#content .radio-toggle.all i:after { content:"NIC"; left:22px; color:rgba(0,0,0,0.60); }

#content .checkbox-toggle.all input:checked + i:after,
#content .radio-toggle.all input:checked + i:after { content:"VŠE"; left:2px; color:#000000; }

#content .checkbox-toggle.show i:after { content:"SKRÝT"; left:22px; color:rgba(0,0,0,0.60); }
#content .checkbox-toggle.show input:checked + i:after { content:"ZOBRAZIT"; left:2px; color:#000000; }

#content .checkbox:hover i,
#content .radio:hover i,
#content .checkbox-toggle:hover i,
#content .radio-toggle:hover i { border:2px solid rgba(233,109,15,0.6); }
#content .checkbox-toggle:hover input + i:before,
#content .radio-toggle:hover input + i:before { background-color:rgba(233,109,15,0.8); }

#content .radio input:checked + i,
#content .checkbox input:checked + i,
#content .radio-toggle input:checked + i,
#content .checkbox-toggle input:checked + i { border:2px solid rgba(233,109,15,0.9); }

#content .radio input:checked + i,
#content .checkbox input:checked + i { color:rgba(233,109,15,0.9); }

#content .checkbox-toggle input:checked + i,
#content .radio-toggle input:checked + i { background-color:#ffffff; }

/* Placeholders
=============================== */

#content input::-webkit-input-placeholder,
#content textarea::-webkit-input-placeholder { color:rgba(0,0,0,.54); }

#content input::-moz-placeholder,
#content textarea::-moz-placeholder { color:rgba(0,0,0,.54); }

#content input:-moz-placeholder,
#content textarea:-moz-placeholder { color:rgba(0,0,0,.54); }

#content input:-ms-input-placeholder,
#content textarea:-ms-input-placeholder { color:rgba(0,0,0,.54); }

#content input:focus::-webkit-input-placeholder,
#content textarea:focus::-webkit-input-placeholder { color:rgba(0,0,0,.36); }

#content input:focus::-moz-placeholder,
#content textarea:focus::-moz-placeholder { color:rgba(0,0,0,.36); }

#content input:focus:-moz-placeholder,
#content textarea:focus:-moz-placeholder { color:rgba(0,0,0,.36); }

#content input:focus:-ms-input-placeholder,
#content textarea:focus:-ms-input-placeholder { color:rgba(0,0,0,.36); }

/* Select
=============================== */

#content select { padding-left:7px; padding-right: 20px; }

#content .multiple-select select { height:auto; }

#content .select i {
	height:15px;
	position:absolute;
	pointer-events:none;
	top:5px;
	right:14px;
	width:14px;
}

#content .select i.icon-more-right {
	right:55px;
}

#content .select i:after,
#content .select i:before {
	border-right:4px solid transparent;
	border-left:4px solid transparent;
	content:'';
	position:absolute;
	right:3px;
}

#content .select i:after { border-top:6px solid rgba(0,0,0,.4); bottom:0px; }

#content .select i:before { border-bottom:6px solid rgba(0,0,0,.4); top:0px; }

#content .select { position:relative; }

/* Icons
=============================== */

#content .icon-left,
#content .icon-right,
#content .icon-left-txt,
#content .icon-right-txt {
	color:rgba(0,0,0,.33);
	font-size:17px;
	height:23px;
	line-height:23px !important;
	position:absolute;
	text-align:center;
	top:2px;
	width:42px;
	z-index:2;
}

#content .icon-left-txt,
#content .icon-right-txt {
	font-size:14px;
	padding:0 10px;
	width:auto;
}

#content .icon-left, #content .icon-left-txt { border-right:1px solid rgba(0,0,0,.33); left:3px; }

#content .icon-right, #content .icon-right-txt { border-left:1px solid rgba(0,0,0,.33); right:3px; }

#content .icon-left-txt ~ input,
#content .icon-left-txt ~ textarea,
#content .icon-left ~ input,
#content .icon-left ~ textarea { padding-left:58px; }

#content .icon-right-txt ~ input,
#content .icon-right-txt ~ textarea,
#content .icon-right ~ input,
#content .icon-right ~ textarea { padding-right:58px; }

#content .icon-left .fa,
#content .icon-right .fa {
	line-height:20px !important;
	font-size:20px;
}

/* File for upload
=============================== */

#content .file-button input {
	bottom:-1px;
	font-size:34px;
	opacity:0;
	position:absolute;
	width:108px;
	z-index:0;
}

#content .prepend-small-btn .file-button input,
#content .prepend-big-btn .file-button input { left:0; }

#content .append-small-btn .file-button input,
#content .append-big-btn .file-button input { right:0; }

#content .prepend-small-btn .file-button,
#content .append-small-btn .file-button { width:64px; }

#content .prepend-big-btn .file-button,
#content .append-big-btn .file-button { width:106px; }

#content .prepend-small-btn .file-button,
#content .prepend-big-btn .file-button { left:1px; }

#content .append-small-btn .file-button,
#content .append-big-btn .file-button { right:1px; }

#content .append-small-btn .file-button,
#content .append-big-btn .file-button,
#content .prepend-small-btn .file-button,
#content .prepend-big-btn .file-button {
	-webkit-border-radius:2px;
	-moz-border-radius:2px;
	-o-border-radius:2px;
	border-radius:2px;
}

#content .prepend-big-btn input[type="text"] { padding-left:123px; }

#content .append-big-btn input[type="text"] { padding-right:123px; }

#content .prepend-small-btn input[type="text"] { padding-left:77px; font-size:12px; }

#content .append-small-btn input[type="text"] { padding-right:77px; font-size:12px; }

#content .input input[type="file"] { cursor:pointer; }

/* Buttons
=============================== */

#main-content button,
#main-content .small-btn,
#main-content .primary-btn,
#main-content .cancel-btn,
#main-content .secondary-btn,
.dialog-content .primary-btn {
	border:none;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-o-border-radius:3px;
	border-radius:3px;
	color:#fff;
	display:inline-block;
	cursor:pointer;
	font-size:14px;
	line-height: 26px;
	height: 26px;
	outline:none;
	padding:0 15px;
	white-space:nowrap;
}

#main-content .small-btn {
	font-size:14px;
	line-height: 26px;
	height:26px;
	margin: 0 10px 0 0;
	outline:none;
	padding:0 10px;
	white-space:nowrap;
	font-weight: 700;
}

#main-content .table-vcenter .small-btn {
	margin: 0;
	padding: 1px 0;
	width: 30px;
	text-align: center;
}

#main-content .table-vcenter .small-btn:before {
	margin: 0;
}

#main-content button,
#main-content .small-btn,
#main-content .primary-btn,
#main-content .cancel-btn,
.dialog-content .primary-btn { position:relative; }

#main-content .gr_devs .offset1 button#toggle-all {
	position: absolute;
	left: 55px;
	margin-top: 5px;
}

#main-content .content .primary-btn,
#main-content .content .cancel-btn,
#main-content .content .secondary-btn { margin:0 0 20px 20px; }

#main-content .file-button {
	color:#fff;
	display:block;
	font-size:12px;
	height:24px;
	line-height:26px;
	outline:none;
	overflow:hidden;
	position:absolute;
	text-align:center;
	top:1px;
	z-index:1;
}

#main-content button,
#main-content .small-btn,
#main-content .primary-btn,
#main-content .cancel-btn,
#main-content .file-button,
#main-content .secondary-btn,
.dialog-content .primary-btn {
	background:#E76A0A;
	-webkit-transition:background.2s;
	-moz-transition:background.2s;
	-ms-transition:background.2s;
	-o-transition:background.2s;
	transition:background.2s;
}

#main-content button:hover,
#main-content .small-btn:hover,
#main-content .primary-btn:hover,
#main-content .file-button:hover,
#main-content .secondary-btn:hover { background:#F5791B; }

#main-content .primary-btn:hover.processing { background:#E76A0A; cursor:wait; }

#main-content .file-button:hover + input { border:2px solid rgba(231,106,10,0.6); }

#main-content .secondary-btn,
#main-content .secondary-btn:hover,
#main-content .secondary-btn:active { opacity:.5; }

#main-content .primary-btn.processing:before {
	background:rgba(255,255,255,.4);
	content:'';
	height:100%;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	-webkit-animation:processing 3s ease-in-out infinite;
	-moz-animation:processing 3s ease-in-out infinite;;
	-ms-animation:processing 3s ease-in-out infinite;
	-o-animation:processing 3s ease-in-out infinite;
	animation:processing 3s ease-in-out infinite;
}

@-webkit-keyframes processing {
	0% { width:0; }
	100% { width:100%; }
}

@-moz-keyframes processing {
	0% { width:0; }
	100% { width:100%; }
}

@-ms-keyframes processing {
	0% { width:0; }
	100% { width:100%; }
}

@-o-keyframes processing {
	0% { width:0; }
	100% { width:100%; }
}

@keyframes processing {
	0% { width:0; }
	100% { width:100%; }
}

/* Tooltip
=============================== */

#content .info,
#content .help {
	position:relative;
	cursor: pointer !important;
	display: inline-block;
}

#content .help:after {
	font:normal normal normal 14px/1 font_sm;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
	content:"\e82d";
	color:#E76A0A;
	display: inline-block;
	margin: 0 8px;
}

#content .info .tooltip,
#content .help .tooltip {
	min-width: 200px;
}

#content .tooltip,
#content .tooltip-image {
	background-color:#E76A0A;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-o-border-radius:3px;
	border-radius:3px;
	display:block;
	left:-9999px;
	opacity:0;
	position:absolute;
	z-index:20;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
}

#content .tooltip {
	color:#fff;
	font-size:13px;
	letter-spacing: 0.05em;
	line-height:18px;
	padding:7px 10px 5px 10px;
}

#content .tooltip-image { padding:2px 2px 1px; }

#content .info:hover .tooltip,
#content .help:hover .tooltip,
#content .input:hover .tooltip,
#content .select:hover .tooltip,
#content .input:hover .tooltip-image,
#content .select:hover .tooltip-image { opacity:1; z-index:5;visibility: visible; }

#content .tooltip-left-top { bottom:100%; margin-bottom:4px; }

#content .tooltip-left-top:before {
	border-color:#E76A0A transparent;
	border-style:solid;
	border-width:8px 7px 0;
	bottom:-6px;
	content:"";
	left:16px;
	position:absolute;
}

#content .help:hover .tooltip-left-top,
#content .input:hover .tooltip-left-top,
#content .select:hover .tooltip-left-top { left:-9px; right:auto; }

#content .tooltip-right-top { bottom:100%; margin-bottom:4px; }

#content .tooltip-right-top:before {
	border-color:#E76A0A transparent;
	border-style:solid;
	border-width:8px 7px 0;
	bottom:-6px;
	content:"";
	position:absolute;
	right:16px;
}

#content .help:hover .tooltip-right-top,
#content .input:hover .tooltip-right-top,
#content .select:hover .tooltip-right-top { left:auto; right:0; }

#content .tooltip-left-bottom { margin-top:4px; top:100%; }

#content .tooltip-left-bottom:before {
	border-color:#E76A0A transparent;
	border-style:solid;
	border-width:0 7px 8px;
	top:-6px;
	content:"";
	left:16px;
	position:absolute;
}

#content .help:hover .tooltip-left-bottom,
#content .input:hover .tooltip-left-bottom,
#content .select:hover .tooltip-left-bottom { left:-9px; right:auto; }

#content .tooltip-right-bottom { margin-top:4px; top:100%; }

#content .tooltip-right-bottom:before {
	border-color:#E76A0A transparent;
	border-style:solid;
	border-width:0 7px 8px;
	top:-6px;
	content:"";
	right:16px;
	position:absolute;
}

#content .help:hover .tooltip-right-bottom,
#content .input:hover .tooltip-right-bottom,
#content .select:hover .tooltip-right-bottom { left:auto; right:0; }

#content .tooltip-right-side { margin-left:8px; top:8px; white-space:nowrap; }
#content .info .tooltip-right-side,
#content .help .tooltip-right-side { margin-left:0; top:-8px; }

#content .tooltip-right-side:before {
	border-color:transparent #E76A0A;
	border-style:solid;
	border-width:7px 8px 7px 0;
	content:"";
	left:-6px;
	position:absolute;
	top:8px;
}

#content .info:hover .tooltip-right-side,
#content .help:hover .tooltip-right-side,
#content .input:hover .tooltip-right-side,
#content .select:hover .tooltip-right-side { left:100%; }

#content .tooltip-left-side { margin-right:8px; top:8px; white-space:nowrap; }
#content .help .tooltip-left-side { margin-right:0; top:-8px; }

#content .tooltip-left-side:before {
	border-color:transparent #E76A0A;
	border-style:solid;
	border-width:7px 0 7px 8px;
	content:"";
	right:-6px;
	position:absolute;
	top:8px;
}

#content .help:hover .tooltip-left-side,
#content .input:hover .tooltip-left-side,
#content .select:hover .tooltip-left-side { left:auto; right:100%; }

/* Disabled state
=============================== */

#content .widget.disabled-view,
#content .input.disabled-view,
#content .select.disabled-view,
#content .checkbox.disabled-view,
#content .radio.disabled-view,
#content .checkbox-toggle.disabled-view,
#content .radio-toggle.disabled-view,
#content .primary-btn.disabled-view,
#content .secondary-btn.disabled-view,
#content .file-button.disabled-view { cursor:default; opacity:.5; }

#content .input.disabled-view input[type="file"] { cursor:default; }

#content .widget.disabled-view input,
#content .input.disabled-view input,
#content .input.disabled-view textarea,
#content .select.disabled-view select { border-color:rgba(0,0,0,.4) !important; }

#content .checkbox.disabled-view i,
#content .radio.disabled-view i,
#content .checkbox-toggle.disabled-view i,
#content .radio-toggle.disabled-view i { border-color:rgba(0,0,0,.5) !important; }

#content .primary-btn.disabled-view,
#content .secondary-btn.disabled-view,
#content .disabled-view .file-button { background:#303f9f; }

#content .widget.disabled-view .addon-btn:hover,
#content .widget.disabled-view .addon-btn:focus { background:#e0e0e0; cursor:default; color:rgba(0,0,0,.56); }

#content .widget.disabled-view .addon-btn i { color:rgba(0,0,0,.24) !important; }

/* Minimal jQuery Tabs Styles */
.ui-tabs { position: relative; padding: .2em; zoom: 1; }
#content .ui-tabs ul.ui-tabs-nav { margin: 0; padding: 0 1em; background: none; display: flex; justify-content: center; font-size: 14px; }
.ui-tabs .ui-tabs-nav li { list-style: none; position: relative; margin: 0 .6em 0 0; padding: 0 .2em; white-space: nowrap;
	color: #9e9e9e; line-height: 36px; min-height: 36px; border-bottom: 3px solid transparent;
	border-top-right-radius: 6px; border-top-left-radius: 6px;
	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .2), 0 0 3px 0 rgba(0, 0, 0, .2);

}

.ui-tabs .ui-tabs-nav li a { padding: .5em 1em; text-decoration: none !important; color: inherit; }

.ui-tabs .ui-tabs-nav li.ui-tabs-selected { margin-bottom: 0; padding-bottom: 1px; color: #616161; background-color: #fafafa; border-bottom-color: #E76A0A; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; }
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; }
.ui-tabs .ui-tabs-nav li.ui-state-hover { background-color: #fff; border-bottom-color: #9e9e9e; }
.ui-tabs .ui-tabs-panel { display: block; border-width: 0; }
.ui-tabs .ui-tabs-hide { display: none !important; }

/* Datapicker and Timepicker
=============================== */

.ui-datepicker {
	background-color:#fff;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-o-border-radius:3px;
	border-radius:3px;
	border:1px solid rgba(0,0,0,.26);
	-webkit-box-shadow:0 0 2px rgba(0,0,0,.5);
	-moz-box-shadow:0 0 2px rgba(0,0,0,.5);
	-o-box-shadow:0 0 2px rgba(0,0,0,.5);
	box-shadow:0 0 2px rgba(0,0,0,.5);
	color:rgba(0,0,0,.54) !important;
	display:none;
	font:16px 'Open Sans',Helvetica,Arial,sans-serif;
	text-align:center;
	padding:10px 0;
	width:240px;
	z-index:1100 !important;
}

.ui-datepicker-header {
	background-color:#f0f0f0;
	line-height:1.5;
	margin:-2px 0 12px;
	padding:10px;
	position:relative;
	border-radius: 0 !important;
}

.ui-datepicker-prev,
.ui-datepicker-next {
	cursor:pointer;
	display:block;
	font-size:18px;
	height:30px;
	position:absolute;
	text-decoration:none;
	top:6px;
	width:30px;
	font-family: 'font_aw';
}

.ui-datepicker-prev:before,
.ui-datepicker-next:before {
	display:block;
	font-size:18px;
	height:30px;
	position:absolute;
	text-decoration:none;
	top:6px;
	width:30px;
	font-family: 'font_aw';
}

.ui-datepicker-prev { left:0; }
.ui-datepicker-prev:before { content: "\f053"; }

.ui-datepicker-next { right:0; }
.ui-datepicker-next:before { content: "\f054"; }

.ui-state-disabled:before { opacity: 0.2; }

.ui-datepicker-prev .ui-icon,
.ui-datepicker-next .ui-icon { display: none; }

.ui-datepicker-calendar { border-collapse:collapse; line-height:1.5; width:100%; }

.ui-datepicker-calendar th span { color:rgba(0,0,0,.26); font-weight:lighter; }

.ui-datepicker-calendar a,
.ui-datepicker-calendar span {
	color:rgba(0,0,0,.54);
	display:block;
	font-size:14px;
	margin:0 auto;
	text-decoration:none;
	width:20px;
}

.ui-datepicker-calendar a:hover,
.ui-datepicker-calendar .ui-state-active { background-color:#e0e0e0; }

.ui-datepicker-today a { outline:1px solid rgba(0,0,0,.54); }

.ui-datepicker-inline {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	border:2px solid rgba(0,0,0,.12);
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	-o-box-shadow:none;
	box-shadow:none;
	width:100%;
}

.ui-state-disabled span { color:rgba(0,0,0,.26); }

.ui-timepicker-div .ui-widget-header { background-color:#f0f0f0; margin-bottom:8px; padding:10px 0; }

.ui-timepicker-div dl { text-align:left; }

.ui-timepicker-div dl dt { float:left; clear:left; padding:0 0 0 5px; }

.ui-timepicker-div td { font-size:90%; }

.ui-tpicker-grid-label { background:none; border:none; margin:0; padding:0; }

.ui-timepicker-rtl { direction:rtl; }

.ui-timepicker-rtl dl { text-align:right; padding:0 5px 0 0; }

.ui-timepicker-rtl dl dt { float:right; clear:right; }

.ui-timepicker-rtl dl dd { margin:0 40% 10px 10px; }

.ui-timepicker-div { font-size:15px; }

.ui-timepicker-div dl {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	border-top:1px solid rgba(0,0,0,.26);
	padding:16px 5px;
	margin:16px 0 0;
}

.ui-timepicker-div .ui_tpicker_time { margin:0 10px 10px 40%; }

.ui-timepicker-div .ui_tpicker_hour,
.ui-timepicker-div .ui_tpicker_minute { margin:16px 10px 10px 40%; }

.ui-datepicker-buttonpane { border-top:1px solid rgba(0,0,0,.26); }

.ui-datepicker-buttonpane button {
	background:#e0e0e0;
	border:none;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-o-border-radius:3px;
	border-radius:3px;
	color:rgba(0,0,0,.56);
	cursor:pointer;
	font:14px 'Open Sans',Helvetica,Arial,sans-serif;
	padding:5px 10px;
	margin:10px 5px 0;
	-webkit-transition:all.15s;
	-moz-transition:all.15s;
	-ms-transition:all.15s;
	-o-transition:all.15s;
	transition:all.15s;
	outline:none;
}

.ui-datepicker-buttonpane button:hover { background:#d6d6d6; color:rgba(0,0,0,.87); }

/*
[id^="label_energy_"] {
	clear: both;
}
*/

/*=================================================================*/
/* Panels */
/*=================================================================*/

.panel {
	position: relative
}

.panel .panel-heading h2,
.panel .panel-heading h3 {
	height: 100%;
		line-height: 100%;
	width: auto;
	float: left;
	position: relative
}

ul .panel .panel-heading h2 {
	padding: 0 !important
}

.panel .panel-heading .panel-ctrls {
	width: auto;
	padding: 0;
	margin: 0;
	line-height: 0
}

.panel .panel-heading .panel-ctrls .button-icon, .panel .panel-heading .panel-ctrls .dropdown {
	float: right;
	position: relative;
	text-align: center;
	cursor: pointer
}

.panel .panel-heading .panel-ctrls .button-icon:hover, .panel .panel-heading .panel-ctrls .dropdown:hover {
	text-decoration: none
}

.panel .panel-heading .panel-ctrls .button-icon:first-child, .panel .panel-heading .panel-ctrls .dropdown:first-child {
	margin-right: 0
}

.panel .panel-heading .panel-ctrls .button-icon.custom-icon, .panel .panel-heading .panel-ctrls .dropdown.custom-icon {
	float: left
}

.panel .panel-heading .panel-loader {
	float: right;
	background-repeat: no-repeat;
	background-position: center center;
	display: none
}

.panel .panel-heading:empty {
	border-width: 0;
	height: 2px;
}

.panel .panel-heading .nav > li > a:hover, .panel .panel-heading .nav > li > a:focus {
	background: 0 0;
}

.panel .panel-heading .nav-tabs {
	float: right;
	margin-top: 0;
	border-bottom: 0;
}

.panel .panel-heading .nav-tabs li i {
	margin: 0 !important;
}

.panel .panel-heading .nav-tabs li.open > a, .panel .panel-heading .nav-tabs li.open > a:hover,
.panel .panel-heading .nav-tabs li.open > a:focus, .panel .panel-heading .nav-tabs li.open > a:active,
.panel .panel-heading .nav-tabs li.open > a:visited {
	z-index: 4;
}

.panel .panel-heading .nav-tabs li.open .dropdown-menu, .panel .panel-heading .nav-tabs li.open .dropdown-menu:focus,
.panel .panel-heading .nav-tabs li.open .tt-dropdown-menu, .panel .panel-heading .nav-tabs li.open .tt-dropdown-menu:focus {
	z-index: 3;
}

.panel .collapsed .panel-heading {
	border-radius: 6px;
}

.panel .panel-body {
	width: 100%;
	position: relative;
}

.panel .panel-body.no-padding {
	padding: 0;
	overflow: hidden;
}

.panel .panel-body.no-padding table {
	margin: 0;
}

.panel .panel-body.no-padding > .table-responsive {
	margin: 0;
	border: 0;
}

#dynamic .panel .panel-body img {
	max-width: 40%;
	float:left;
	width:100px;
	height:75px;
}

#content .panel .panel-body dl {
	display: flex;
	flex-flow: row wrap;
	overflow: visible;
	line-height: 18px;
	margin: 0.5em 1em 0.5em 0;
	color: #919599;
	font-size: 12px;
}

#dynamic .panel .panel-body dl {
	width: 60%;
}

#content .panel .panel-body dl dt {
	flex: 0 0 40%;
	text-overflow: ellipsis;
	overflow: hidden;
	text-align: right;
	padding: 0 0 0.3em 0;
	margin: 0;
}

#content .panel .panel-body dl dd {
	flex:0 0 60%;
	margin-left: auto;
	text-align: right;
	text-overflow: ellipsis;
	overflow: hidden;
	margin: 0 0 0.3rem 0;
}

#content .panel .panel-body dl dd span {
	margin: 0 0.3rem 0 0;
	font-size: 18px;
	color: #6a6868;
}

unit {
	min-width: 50px;
	display: inline-block;
	text-align: left;
}

#content #totals .panel .panel-body dl {
	font-size: 14px;
	width: 98%;
	margin: 0 1%;
}

#content #totals .panel .panel-body dl dt {
	flex: 0 0 11.5%;
	max-width: 11.5%;
	text-align: left;
	line-height: 100%;
	padding: 0 0 0 40px;
	vertical-align: middle;
}

@media (min-width: 1600px) {
	#content #totals .panel .panel-body dl dt {
	line-height: 30px;
	}
}

#content #totals .panel .panel-body dl dt:before {
	display: block;
	position: absolute;
	margin-left: -40px;
	background: #ffeacc;
	border-right: 2px solid #ff9800;
	color: #ff9800;
	font: normal normal 16px 'font_aw';
	line-height: 30px;
	width: 30px;
	text-align: center;
}

#content #totals .panel .panel-body dl dt.tot_ins_power:before {
	font-family: 'font_sm';
	content: "\e806";
}

#content #totals .panel .panel-body dl dt.tot_act_pwr:before {
	content: "\f0e7";
}

#content #totals .panel .panel-body dl dt.tot_prod_today:before {
	background: #ccebff;
	border-right-color: #0099ff;
	color: #0099ff;
	content: "\f080";
}

#content #totals .panel .panel-body dl dt.tot_co2_today:before {
	background: #eaf2cf;
	border-right-color: #95be0e;
	color: #95be0e;
	content: "\f06c";
}

#content #totals .panel .panel-body dl dd {
	flex: 0 0 13.5%;
	max-width: 13.5%;
	padding: 0 2em 0 0;
	line-height: 30px;
}

.panel .panel-scroll {
	overflow-y: scroll
}

.panel .panel-scroll::-webkit-scrollbar {
	width: 6px
}

.panel .panel-scroll::-webkit-scrollbar-thumb {
	background-color: #c4c4c4;
	border-radius: 0
}

.panel .panel-scroll::-webkit-scrollbar-thumb:hover {
	background-color: #c4c4c4
}

.panel .panel-scroll::-webkit-scrollbar-track {
	background-color: #ededed
}

.panel, .panel .panel-body {
	border-radius: 6px
}

.panel .panel-heading {
	border-top-right-radius: 6px;
	border-top-left-radius: 6px
}

.panel .panel-heading + .panel-body, .panel .panel-editbox + .panel-body {
	border-top-right-radius: 0;
	border-top-left-radius: 0
}

.panel.panel-collapsed .panel-heading {
	border-bottom-right-radius: 2px;
	border-bottom-left-radius: 2px
}

.panel.panel-collapsed.editbox-open .panel-editbox {
	border-bottom: 0
}

.panel.editbox-open .panel-heading {
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0
}

.panel .panel-footer.no-padding {
	padding: 0
}

.panel {
	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .2), 0 0 3px 0 rgba(0, 0, 0, .2);
	border-radius: 6px;
	background-color: #fff;
	margin: 0 0 32px
}

.panel.off {
	opacity: 0.5;
}

.panel .panel-heading {
	color: #9e9e9e;
	background-color: #fafafa;
	padding: 0 16px;
	line-height: 48px;
	min-height: 48px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.panel-body .panel-heading {
	margin-top: 72px;
}

.panel .panel-heading h2 {
	color: #9e9e9e;
	font-size: 20px;
	font-weight: 400;
	padding: 14px 0;
	margin: 0;
	line-height: 20px;
	letter-spacing: 0.5px
}

.panel .panel-heading .perc {
	color: #ff9800;
	font-size: 18px;
	font-weight: 400;
	line-height: 48px;
}

.panel .panel-bar {
	background: #d9d9d9;
	width: 100%;
	height: 2px;
}

.panel .panel-bar > div {
	background: #ff9800;
	height: 2px;
}

.panel .panel-heading h2 i {
	margin-right: 8px
}

.panel .panel-heading h2 i.separator {
	height: 32px;
	width: 1px;
	display: inline-block;
	margin: 8px 16px
}

.panel .panel-heading .panel-ctrls, #graphcontainer .panel-ctrls {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	min-height: 48px;
}

#graphcontainer .panel-ctrls {
	flex-wrap: nowrap;
}

#graphcontainer .panel-ctrls #overview_val {
	width: 250px;
}

.panel .panel-heading .panel-ctrls i.low:before {
	color: #C70500;
}

.panel .panel-heading .panel-ctrls i.mid:before {
	color: #E36500;
}

.panel .panel-heading .panel-ctrls i.hi:before {
	color: #2A8300;
}

.panel .panel-heading .panel-ctrls i.off:before {
	color: #888B8E;
}

.panel .panel-heading .panel-ctrls i.separator {
	height: 32px;
	width: 1px;
	display: inline-block;
	margin: 8px 16px
}

.panel .panel-heading .panel-ctrls .button-icon {
	margin: 8px 0;
	line-height: 16px;
	padding: 8px 0;
	width: 32px;
	height: 32px;
	border-radius: 50%
}

.panel .panel-heading .panel-ctrls .button-icon.btn {
	margin: 8px 0
}

.panel .panel-heading .panel-loader {
	width: 14px;
	height: 14px;
	margin: 17px 0 0
}

.panel .panel-body {
	background-color: #fff;
	font-size: 14px;
	padding: 16px
}

.panel .panel-body.no-padding .alert {
	margin: 32px !important
}

.panel .panel-body.panel-tb-padding {
	padding: 16px 0
}

.panel .panel-body.panel-lr-padding {
	padding: 0 16px
}

.panel .panel-body.scroll-pane > .scroll-content {
	padding: 16px
}

.panel .panel-footer {
	padding: 8px 16px;
	background-color: #d9d9d9;
	color: #fff;
	border-radius: 0 0 6px 6px
}
.panel .panel-footer .datum {
	color: #000;
	float: right;
	margin-right:30px;
}
.panel .panel-footer .icon {
	position: absolute;
	right: 0;
	margin-top: -8px;
	width: 36px;
	height: 35px;
	line-height: 35px;
	border-radius: 0 0 6px 0;
	text-align: center;
}
.panel .panel-footer .icon:before {
	color: #fff;
	margin: 0;
}
.panel .panel-footer .icon.offline-ico {
	background: #919599;
}
.panel .panel-footer .icon.unlock-ico,
.panel .panel-footer .icon.link-ico,
.panel .panel-footer .icon.lock-ico {
	background: #95be0e;
}
.panel .panel-footer .icon.license-ico,
.panel .panel-footer .icon.warning-ico {
	background: #d56b6f;
}

.panel.ui-sortable-helper {
	-webkit-transform: rotate(1deg);
	transform: rotate(1deg)
}

.panel-placeholder {
	border-radius: 6px;
	margin-bottom: 32px;
	padding: 0;
	background-color: #eee;
	border: 2px dashed #e0e0e0
}

.panel .panel-heading .nav-tabs li {
	margin-bottom: 0
}

.panel .panel-heading .nav-tabs li a {
	border: 0;
	color: #9e9e9e;
	font-weight: 700;
	padding: 0 16px;
	line-height: 48px;
	border-radius: 0
}

.panel .panel-heading .nav-tabs li:hover a {
	color: #212121;
	background: 0 0
}

.panel .panel-heading .nav-tabs li.active a {
	background: #fff;
	font-weight: 700;
	color: #212121;
	box-shadow: none
}

.panel .panel-heading .nav-tabs li.active > a {
	color: #212121 !important
}

.panel .panel-heading .nav-tabs li.active:hover > a {
	color: #212121 !important;
	background: #fff
}

.panel .panel-heading h2 > ul.nav-tabs {
	margin: -14px 0 -14px -16px
}

.panel .panel-heading h2 > ul.nav-tabs > li > a {
	padding: 0 16px
}

.panel .panel-heading h2 > ul.nav-tabs li.active a {
	font-weight: 700 !important
}

.panel .panel-heading h2 > ul.nav-tabs li.tabdrop + li > a {
	border-top-left-radius: 2px
}

.panel .panel-heading li.tabdrop a {
	border-top-left-radius: 0 !important;
	border-top-right-radius: 0 !important
}

.panel .panel-heading li.tabdrop ul a {
	padding: 6px 16px !important;
	line-height: 1.45 !important;
	font-weight: 400 !important
}

.panel .panel-heading li.tabdrop.active a {
	box-shadow: none
}

.panel .panel-heading li.tabdrop.open > a, .panel .panel-heading li.tabdrop.open > a:hover,
.panel .panel-heading li.tabdrop.open > a:focus, .panel .panel-heading li.tabdrop.open > a:active,
.panel .panel-heading li.tabdrop.open > a:visited, .panel .panel-heading li.tabdrop.open a,
.panel .panel-heading li.tabdrop.open a:hover {
	color: #212121 !important;
	background: #fff !important
}

.panel .panel-heading li.tabdrop.open a {
	color: #9e9e9e !important;
	font-weight: 700 !important
}

.panel .panel-heading li.tabdrop.open a:hover, .panel .panel-heading li.tabdrop.open a:focus,
.panel .panel-heading li.tabdrop.open a:active {
	color: #212121;
	background: #f5f5f5
}

.panel .panel-heading li.tabdrop.open .active a {
	color: #212121 !important
}

.w-100 {
	width:100%!important;
}

@media (min-width: 1600px) {
	.col-xxl-3 {
	    -webkit-box-flex:0 !important;
	    -ms-flex:0 0 25% !important;
	    flex:0 0 25% !important;
	    max-width:25% !important;
	}
}

/* Allow Font Awesome Icons in lieu of jQuery UI and only apply when using a FA icon */
.ui-icon[class*=" fa-"] {
	background: none repeat scroll 0 0 transparent;
	text-indent: 0;
	margin-top: -0.5em;
}

.ui-icon.icon-large {
	margin-top: -0.75em;
}

.ui-button-icon-only .ui-icon[class*=" fa-"] {
	margin-left: -7px;
}

/*=================================================================*/
/* Dashboard */
/*=================================================================*/

#solar_table .name {
	color: #616366;
	font-size: 18px;
	line-height: 20px;
}

#solar_table td {
	font-size: 16px;
	line-height: 25px;
}

#solar_table td.time {
	font-size: 12px;
	line-height: 100%;
	vertical-align: middle;
}

#solar_table .row-bar {
	position: absolute;
	width: 100%;
	left: 0;
	margin-top: 10px;
	height: 2px;
	background: #d9d9d9;
}

#solar_table .row-bar > div {
	background: #ff9800;
	height: 2px;
}

#solar_table .led {
	color: #ff9800;
	float: right;
}

.led:after {
	display: inline-block;
	content: '';
	font: normal normal 15px 'font_aw'; content: "\f0a3";
	padding-left: 5px;
}

.led.low:after {
	color: #C70500;
}

.led.mid:after {
	color: #E36500;
}

.led.hi:after {
	color: #2A8300;
}

.led.off:after {
	color: #888B8E;
}

#solar_table .icon-link {
	width: 10px;
	display: block;
}

#solar_table .icon {
	display: block;
	position: absolute;
	width: 30px;
	height: 26px;
	line-height: 28px;
	margin: 10px 0 0px -10px;
	border-radius: 0 6px 0 0;
	text-align: center;
}

#solar_table .icon:before {
	color: #fff;
	margin: 0;
}

#solar_table .icon.offline-ico {
	background: #919599;
}

#solar_table .icon.unlock-ico,
#solar_table .icon.link-ico,
#solar_table .icon.lock-ico {
	background: #95be0e;
}

#solar_table .icon.license-ico,
#solar_table .icon.warning-ico {
	background: #d56b6f;
}

.offline {
	opacity: 0.5;
}

.legend {
	margin-top:5px;
	text-align: left;
	color: #808080;
}

.legend_index {
	padding: 2em 0;
	text-align: center;
	color: #808080;
}

.legend_index .mleft {
	margin-left:20px;
}

/*=================================================================*/
/* Grid layout */
/*=================================================================*/

#content [class*="span"] {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	float:left;
	padding-left:10px;
	padding-right:10px;
	position:relative;
}

#content [class*="span"].input,
#content [class*="span"].select {
	padding-left:0;
}

#content [class*="flex"] {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
}

#content .span1 { width:8.3333%; }
#content .span2 { width:16.6666%; }
#content .span3 { width:25%; }
#content .span4 { width:33.3333%; }
#content .span5 { width:41.6666%; }
#content .span6 { width:50%; }
#content .span7 { width:58.3333%; }
#content .span8 { width:66.6666%; }
#content .span9 { width:75%; }
#content .span10 { width:83.3333%; }
#content .span11 { width:91.6666%; }
#content .span12 { width:100%; }

#content .offset1 { margin-left:8.3333%; }
#content .offset2 { margin-left:16.6666%; }
#content .offset3 { margin-left:25%; }
#content .offset4 { margin-left:33.3333%; }
#content .offset5 { margin-left:41.6666%; }
#content .offset6 { margin-left:50%; }
#content .offset7 { margin-left:58.3333%; }
#content .offset8 { margin-left:66.6666%; }
#content .offset9 { margin-left:75%; }
#content .offset10 { margin-left:83.3333%; }
#content .offset11 { margin-left:91.6666%; }
#content .offset12 { margin-left:100%; }

#content .row {
	margin:0 -10px;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}

#content .row.m10 {
	margin:0 10px;
}

#content .row.m0 {
	margin:0;
}

#content .gr_devs .row {
	padding-bottom: 30px;
}

#content .gr_devs .row:nth-child(odd),
#content .gr_devs .row .row {
	padding-bottom: 0;
}

#content .gr_devs.audit_gr {
	display: flex;
	flex-wrap: wrap;
}

#submit_area:after,
#content .row:after {
	/*clear:both;*/
	content:".";
	display:block;
	height:0;
	visibility:hidden;
}

@media (max-width: 767px) {
	#main-content {
		min-height: calc(100vh - 22px);
	}
	.mobile-hide {
		display: none;
	}
	#logo {
		position:fixed;
		z-index:97;
	}
	#logo_trans {
		background-position: center 7px;
	}
	#menu #topLinks {
		position:fixed;
	}
	#menu #topLinks span {
		display: none;
	}
	#menu #topLinks a::before {
		font-size: 26px !important;
		line-height: 46px;
	}
	#menu #topTools {
		top: 129px;
	}
	#menu-switch {
		position: fixed;
		font-size: 26px;
		line-height: 16px;
		border-radius: 5px;
		background: rgba(0, 0, 0, 0.2);
		padding: 13px 12px;
		top: 14px;
		left: 7px;
		color: #fff;
		z-index: 99 !important;
		cursor:pointer;
	}
	#menu-switch:hover {
		background: rgba(149, 190, 14,0.9);
	}
	#menu-switch:after {
		font-family: font_sm;
		content:"\e833";
	}
	#sidebar {
		float: none;
		width: 100%;
		background: none;
		position: absolute;
		top:0;
		z-index:98;
	}
	#sidebar #sideMenu.open-menu {
		left: 0;
	}
	#sidebar #sideMenu {
		transition: .5s;
		float: none;
		position: fixed;
		height: 100%;
		width: 205px;
		top:75px;
		left: -205px;
		z-index: 20;
		background: #eceff1;
		display:block;
		overflow-y: auto;
	}
	#sideMenu ul {
		display: block;
	}
	#main-div {
		margin: 0;
	}
	#main-content {
		-moz-border-radius: 0;
		-webkit-border-radius: 0;
		border-radius: 0;
		padding-top: 75px;
	}
	#content div[class*="span"] {
		width:100%;
	}
}

@media (min-width: 768px) and (max-width: 1023px) {
	#main-content {
		min-height: calc(100vh - 87px);
	}
	#sideMenu > ul > li > a > span, #sideMenu > ul > li > a > lang {
		display: none;
	}
	#sideMenu > ul > li > a {
		padding: 14px 12px 12px 14px;
	}
	#sideMenu ul > li.has-sub > a::before, #sideMenu ul > li.has-sub > a::after {
		display: none;
	}
	#main-div {
		margin: 0px 0px 0px 43px;
	}
	#main-content {
		-moz-border-radius: 0 0 0 15px;
		-webkit-border-radius: 0 0 0 15px;
		border-radius: 0 0 0 15px;
	}
	#sidebar, #menu>ul {
		width: 43px;
	}
	#menu #topLinks {
		top: 29px; }
	#menu #topLinks a {
		font-size: 14px;
	}
	#menu #topTools {
		top: 119px;
	}
	#sideMenu .selected > a:after {
		left: 35px;
	}
	#sideMenu ul .selected > a:after {
		display: none;
	}
	#sideMenu > li {
		position:relative;
	}
	#sideMenu > li > a {
		padding-left: 12px;
	}
	#menu>ul>li>a>lang {
		display: none;
	}
	#sideMenu ul {
		position: absolute;
		left: 43px;
		top:0;
		min-width: 150px;
		box-shadow: 1px 1px 3px rgba(0,0,0,0.4);
		list-style: none;
		z-index:1000;
	}
	#sideMenu > ul {
		box-shadow: none;
		left: 0;
		min-width: 0;
		width: 43px;
	}
	#sideMenu .active ul,
	#sideMenu .selected ul {
		display: none;
	}
	#sideMenu > li:hover  ul {
		display:block;
	}
	#menu>ul ul:before {
		border-top: 7px solid transparent;
		border-bottom: 7px solid transparent;
		content: "";
		display: inline-block;
		left: -6px;
		position: absolute;
		top: 12px;
	}
	#menu>ul ul:after {
		border-top: 6px solid transparent;
		border-bottom: 6px solid transparent;
		content: "";
		display: inline-block;
		left: -5px;
		position: absolute;
		top: 13px;
	}
	#menu>ul ul li a {
		white-space: nowrap;
		padding: 10px 25px;
	}
	#content div.span3 { width:50%; }
	#content div.span4 { width:100%; }
	#content .span4.always3 { width:50%; }
	#content div.span6 { width:100%; }
}

@media (min-width: 1024px) and (max-width: 1520px) {
	#content div.span4 { width:50%; }
	#content .span4.always3 { width:33.3333%; }
	#content .unit .content.table i.fsm {
		margin: 40px 0 0 25px;
	}
	#content .content.table .space {
		padding: 40px 10px 30px 140px;
	}
	#logo_trans {
	  background-size: auto 44px;
	}
	#sidebar {
		width:175px;
	}
	#main-div {
		margin: -38px 0px 0px 175px;
	}
	#sideMenu a {
		width: 175px;
	}
	#sideMenu .selected > a:after {
		left: 166px;
		top: 30%;
	}
	#sideMenu a > lang,
	#sideMenu > ul > li > a > span {
		padding-left: 25px;
		display: block;
	}
	#sideMenu a i.fa {
		position: absolute;
	}
}

@media (min-width: 1024px) and (max-width: 1280px) {
	#content div.span3 { width:50%; }
	#content div.span4 { width:100%; }
	#content .span4.always3 { width:50%; }
	#content div.span6 { width:100%; }
	#content .span6.always2 { width:50%; }
}

@media (max-width: 1440px) {
	#content div.span6.nowide-full { width:100%; }
}

/* styles for IE */
.ie #content input[type="text"],
.ie #content input[type="password"],
.ie #content input[type="email"],
.ie #content input[type="search"],
.ie #content input[type="url"],
.ie #content textarea,
.ie #content select {
	padding:5px 10px 0 10px;
}

.ie #content .icon-left,
.ie #content .icon-right,
.ie #content .icon-left-txt,
.ie #content .icon-right-txt {
	line-height:28px !important;
}

.ie .StepSubtitle span { top: -9px !important; }

.ie select::-ms-expand {
	/* IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	/* IE 5-7 */
	filter: alpha(opacity=0);
	/* Good browsers :) */
	opacity:0;
}

.ie #CompareValue { padding: 5px 60px 0 60px !important; }

/*=================================================================*/
/*                        PORTAL layout                            */
/*=================================================================*/

/*
 * General style setup
 */

fieldset { margin: 10px auto 10px auto; padding: 10px; }
legend { margin: 0.2em 0px 0.2em 20px; padding: 4px; }

a.fg-button.button-report { outline: 0; margin:0 4px 0 0; padding: 1em 1.5em; text-decoration:none !important; cursor:pointer; position: relative;  text-align: center; zoom: 1; font-size: 1.2em; }

/* TODO smazat*/
.invoice_preview {
	cursor: pointer;
	background: transparent url(../images/pdf.gif) 0px 0px no-repeat;
	width: 16px;
	height: 16px;
	display: block;
}

.delete_individual {
	cursor: pointer;
	background: transparent url(../images/cross.png) 0px 0px no-repeat;
	width: 16px;
	height: 16px;
	display: block;
}

.edit_individual {
	cursor: pointer;
	background: transparent url(../images/edit.png) 0px 0px no-repeat;
	width: 16px;
	height: 16px;
	display: block;
}

/* TODO smazat*/
.log_alert { background-color: #FFCECE; }

#solar_body #demo {
	margin: 30px auto 0 auto;
}

#solar_body .demo_jui {
	margin: 30px auto 0 auto;
}

#solar_body .big {
	font-size: 1.3em;
	font-weight: bold;
	line-height: 1.6em;
	color: #4E6CA3;
	border-bottom: 1px solid #B0BED9;
	margin-bottom: 0.5em;
}

#solar_body .spacer {
	height: 20px;
	clear: both;
}

#solar_body .clear {
	clear: both;
}

#solar_body pre {
	padding: 15px;
	background-color: #F5F5F5;
	border: 1px solid #CCCCCC;
}

#solar_body h1 {
	margin-top: 1em;
	font-size: 1.1em;
	font-weight: normal;
	line-height: 1.6em;
	color: #4E6CA3;
	clear: both;
}

#solar_body a {
	text-decoration: none;
	outline: none;
	color: inherit;
}

#solar_body a:hover {
	text-decoration: underline;
}

.css_right {
	float: right;
}

.css_left {
	float: left;
}

.smtooltip {
	visibility:hidden;
	font-size: 0.9em;
	display: block;
	width: 100%;
	margin:0 0 5px 0;
	position: relative;
	top: 6px;
	text-align:center;
	color: #F37A19;
}

/*-------------------------------------------------------------------*/

#copyr {
	text-align: center;
	background: url('../images/bg_cont.png') left bottom;
}

#copyr a:hover {
	text-decoration: none;
}

#copyr .copyr_link {
	font-size: 0.8em;
	color: #919599;
}

/*-------------------------------------------------------------------*/

/*
 * Index section
 */

#header {
	height:158px; width:1034px;
	background-repeat: no-repeat;
	background-color: transparent;
}

#header .input {
	width: 80px;
	margin-right: 15px;
}

#header .button {
	display: block;
	float:right;
	margin-right: 15px;
}

#header .login {
	padding-left: 590px;
	padding-top: 89px;
	margin-bottom: 20px;
}

#header span {
	font-weight: normal;
	position: relative;
}

#header .logout {
	padding-left: 700px;
	padding-top: 93px;
	margin-bottom: 24px;
}

#header .title {
	padding-left: 590px;
	padding-top: 90px;
	margin-bottom: 20px;
}

.title_name {
	font-size: 1.3em;
	font-weight: bold;
}

#header label {
	  margin: 0px 4px 0px 0px;
	  text-align: right;
}

.lang {
	margin-top: -7px;
	display: block;
	float:left;
}

.table_head {
	margin: 0px;
	display: inline;
}

.menu {
	height:30px;
	margin:0 0 10px 0;
}

[id^="navi"] {
	min-height: 28px;
	display: block;
	margin-bottom: 15px;
	font-size: 1.1em;
	flex-wrap: wrap;
}

.navi_shift {
	width:100px;
	height:22px;
	display: block;
	float:left;
}

.navi_shift a {
	height: 22px;
	width: 22px;
	background-repeat: no-repeat;
	background-color: transparent;
	display: block;
	float:left;
	margin-left: 6px;
}

.prev_ico { background-image: url("../images/previous.png"); }
.up_ico { background-image: url("../images/up.png"); }
.next_ico { background-image: url("../images/next.png"); }

/*-------------------------------------------------------------------*/

.navi_button {
	margin:0 5px 0 8px;
	display: block;
	float:left;
	padding-top: 2px;
}

a.nav, a.nav:link, a.nav:visited {
	text-decoration: none;
	font-size:.9em;
	padding:3px 20px 3px 20px;
}

.cal_link {
	display: block;
	float:left;
	padding:0 7px 0 7px;
	color: #000;
	font-size:.9em;
	font-weight: normal;
}

.cal_link input.dp-applied {
	margin-left: 2px;
}

/*-------------------------------------------------------------------*/

.energy_area {
	clear:both;
	padding: 15px 0px 15px 10px;
	background-repeat: no-repeat;
	background-color: transparent;
}

[id^="graph_energy_"] {
	width:100%;
	height:190px;
}

[id^="graph_energy1_"], [id^="graph_energy2_"] {
	margin-top: 25px;
	float: left;
	width: 50%;
	height: 285px;
}

/*-------------------------------------------------------------------*/

.graph_val_area {
	margin-top: 10px;
	/*clear:both;*/
	padding: 15px 0px 15px 10px;
	background-repeat: no-repeat;
	background-color: transparent;
}

.tool_bar {
	display: block;
	width: 100%;
	height: 30px;
}

[id^="navi"] .tool_bar {
	display: flex;
	margin-left: 15px;
	width: auto;
}

[id^="navi"] .tool_bar .input,
.flex .input,
.tool_bar .input,
.panel-ctrls .input {
	margin: 0 15px 0 10px !important;
	padding: 0;
}

.selects {
	display: block;
	float:left;
	color: #999;
	font-size: 12px;
	font-weight: normal;
	margin-left: 20px;
}

#content .row.m0.small label {
	color: #999;
	font-size: 12px;
}

#content .row.m0.small .select {
	width: 50%;
	float: left;
}

.c_label {
	display: block;
	float: left;
	width: 100px;
	padding-right: 10px;
	text-align: right;
}

.c_select {
	display: block;
	float: left;
	width: 260px;
}

.c_select_val {
	display: block;
	float: left;
	width: 100px;
}

.label {
	color: #000;
	font-size: 12px;
}

.graph {
	display: block;
	float:left;
	padding-right: 20px;
}

.dev_sel, .dev_sel_comp {
	display: block;
	float:left;
}

.dev_sel_comp {
	width: 370px;
}

.strsets {
	display: block;
	float:left;
}

#inv_type, #inv_type1, #tra_type, #tra_type1, #bat_type, #bat_type1, #met_type, #met_type1, [id^="dev_type"]  {
	width:260px;
}

#graph_zoom {
	display: block;
	float:right;
}

.zoom_ico a {
	height: 22px;
	width: 22px;
	background-repeat: no-repeat;
	background-color: transparent;
	display: block;
	float:left;
	margin-left: 1px;
}

.full_ico:before { font: normal normal 15px 'font_aw'; content: "\f065"; margin-right: 3px; }
.zoom-in_ico:before { font: normal normal 15px 'font_aw'; content: "\f00e"; margin-right: 3px; }
.zoom-out_ico:before { font: normal normal 15px 'font_aw'; content: "\f010"; margin-right: 3px; }
.dash-ico:before { font: normal normal 15px 'font_aw'; content: "\f08d"; margin-right: 3px; }
.move-ico:before { font: normal normal 15px 'font_aw'; content: "\f047"; margin-right: 3px; }
.toggle_ico:before { font: normal normal 15px 'font_aw'; margin-right: 3px; }
.toggle_off_ico:before { content: "\f03c"; }
.toggle_on_ico:before { content: "\f03b"; }
.buy-ico:before { font: normal normal 15px 'font_aw'; margin-right: 3px; content: "\f07a"; }
.prepare-ico:before { font: normal normal 15px 'font_aw'; margin-right: 3px; content: "\f021"; color: #E76A0A; }

#show_overview {
	cursor:pointer;
}

#overview_val, #custom_overview_val {
	display: block;
	float:right;
	position:relative;
	width:340px;
	height:45px;
	visibility:hidden;
}

#custom_overview_val {
	width: 280px;
}

#graph_zoom {
	margin: 4px 2px 0 0px;
}

[id^="graph_dev_val"] {
	display: block;
	width: 100%;
	min-width: 100px;
	height: 235px;
}

[id^="graph_dev_val_choices"] {
	display: block;
	width:100%;
	height:unset;
	color: #3b3b3b;
}

[id^="graph_dev_val_choices"] table {
	border-collapse: collapse;
	text-align:left;
	table-layout: fixed;
	margin: 10px auto 0 auto;
}

[id^="graph_dev_val_choices"] td {
	padding-left: 40px;
	padding-right: 40px;
}

/*-------------------------------------------------------------------*/

.audit_area {
	/*clear:both;*/
	margin-top: 10px;
	padding: 15px 0px 15px 10px;
	background-repeat: no-repeat;
	background-color: transparent;
}

#graph_audit {
	display: block;
	width:100%;
	height:250px;
}

/*-------------------------------------------------------------------*/

.include_area {
	/*clear:both;*/
	margin-top: 10px;
}

#ui-datepicker-div {
	display: none;
}

.select_file {
	cursor: pointer;
	color: blue !important;
	text-decoration: underline !important;
}

.state_on {
	color: green;
}

.state_off {
	color: red;
}

.state_send {
	color: orange;
}

#tooltip {
	background: rgba(255, 255, 255, 0.8);
	padding: 5px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-transition: left .2s; /* Safari */
	transition: left .2s;
}

.tooltip-row {
	font-size: 12px;
}

.tooltip-row .value {
	display: inline;
	font-size: 15px;
}

.tooltip-row .label {
	display: inline;
}

/*-----------------------------*/
/* DASHBOARD */

.dash_include_area {
	/*clear:both;*/
	margin-top: 10px;
}

#graphcontainer {
	display: block;
	float: left;
	width: calc(70% - 25px);
	height: 420px;
	margin-top: 15px;
	margin-left: 25px;
}

#tooltip_dash_val {
	width: 30%;
	float: left;
}

.tool_dash {
	width: 100%;
}

.val_container {
	width: 100%;
}

.dash_nd, .dash_rd {
	width: 100%;
	text-align: right;
	font-size: 16px;
	display: inline-block;
}

.dash_value {
	width: 50%;
	float: right;
	text-align: left;
	padding-left: 1.5em;
}

.dash_name {
	width: 50%;
	float: left;
	padding-right: 1.5em;
}

#test_dash {
	display: inline-block;
	width: 100%;
}

#graph_dash {
	height: calc(100% - 48px);
}

@media (max-width: 900px) {
	#graphcontainer {
		width: 100%;
		margin-left: 0;
	}
	#tooltip_dash_val {
		width: 100%;
	}
}

.nodata {
	text-align:center;
	display: block;
	position: absolute;
	top: calc(50% - 12px);
	width: 100%;
	margin: 0 !important;
	font-size: 11pt !important;
}

.zasobnik {
	display: flex;
}

.zasobnik > *:first-child {
	margin-top: 2px;
}

.zasobnik .tickLabels {
	display: none;
}

#cus1, #cus2 {
	margin-bottom: 32px !important;
	height: 500px;
	display: flex;
}

#overview_hidden {
	width: 300px;
	height: 100px;
	display: none;
}

.drag_drop {
	position: relative;
	cursor: move; /* pokud nepodporuje grab, tak aspon move */
	cursor: grab;
}

.drag_prekryv {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

.zasobnik > * {
	width: 100%;
}

.zasobnik > div .dash_controls {
	display: none;
}

.zasobnik .panel-footer {
	display: none;
}

.zasobnik > div.in_dash .dash_controls, .zasobnik > div.in_dash .panel-footer {
	display: block;
}

.zasobnik > div.in_dash .drag_drop {
	height: 0;
	overflow: hidden;
}

.zasobnik > div:last-child {
	margin-bottom: 0;
}

.zasobnik:after {
	content: "\00a0";
	height: 2px;
}

.zasobnik:before {
	content: "\00a0";
	height: 2px;
}

.zasobnik_hidden .zasobnik {
	height: 0;
	width: 0;
	overflow: hidden;
}

@media (max-width: 1500px) {
	#custom_overview_val {
		width: 180px;
	}
}

.zasobnik_displayed {
	flex-direction: column;
}

.zasobnik_displayed .graphcontainer2, .zasobnik_displayed .zasobnik {
	width: 100%;
}

.zasobnik_displayed .zasobnik {
	overflow-x: scroll;
	overflow-y: scroll;
	flex-direction: row;
	height: 34%;
}

.zasobnik_displayed .zasobnik > * {
	min-width: 50%;
	height: 200%;
	margin-right: 25px;
	margin-top: 2px;
}

.zasobnik_displayed .zasobnik > *:last-child {
	margin-right: 0px;
}

.zasobnik_displayed #custom_dash {
	height: 180px;
}

.zasobnik_displayed #custom_totals {
	height: 100px;
}

.mini_graph, .mini_total {
	height: 90px;
	min-width: 100px;
}

/* .zasobnik_hidden */
.zasobnik_hidden .zasobnik {
	height: 0;
}

.zasobnik_hidden .graphcontainer2 {
	max-height: 100%;
	width: 100%;
}

.zasobnik_hidden #custom_dash {
	height: 370px;
}

.zasobnik_hidden #custom_totals {
	height: 290px;
}
/* /.zasobnik_hidden */

@media (min-width: 1281px) {
	/*
		pokud je span12 a siroky
	*/
	.include_area.span12 #custom_dash {
		height: 380px;
	}
	.include_area.span12 #custom_totals {
		height: 300px;
	}
	.include_area.span12 .zasobnik_displayed .graphcontainer2 {
		max-height: 100%;
		width: 66%;
		margin-right: 10px;
	}
	.include_area.span12 .zasobnik_displayed .zasobnik {
		flex-direction: column;
		overflow-y: scroll;
		overflow-x: visible;
		height: 100%;
		width: 34%;
		margin-left: 10px;
	}
	.include_area.span12 .zasobnik_displayed .zasobnik > * {
		width: calc(100% - 5px);
		height: auto;
		margin-right: 0;
		margin-left: 5px;
	}
	.include_area.span12 #cus1, .include_area.span12 #cus2 {
		flex-direction: row;
	}
	.include_area.span12 .mini_graph, .include_area.span12 .mini_total {
		height: 250px;
	}
	.include_area.span12 .zasobnik_dragging > * {
		width: calc(100% - 17px - 5px) !important;
	}
}

.zasobnik_displayed {
	overflow: hidden;
}

.zasobnik_displayed .graphcontainer2 .panel {
	margin-left: 2px;
	margin-right: 2px;
	margin-top: 2px;
}

.zasobnik_dragging {
	overflow: visible !important;
}

.include_area .panel .ui-resizable-handle {
	position: absolute;
	right: 0;
	bottom: 0;
	cursor: nw-resize;
}

.table_dash > .span6 .panel {
	max-width: calc(200% + 20px);
}

.table_dash > .span12 .panel {
	max-width: 100%;
}

.panel-ctrls > * {
	cursor: pointer;
}

.editing_on .custom_containers, .editing_on .custom_draggables {
	overflow-y: scroll;
	height: calc(100vh - 240px);
}

.editing_off .custom_draggables {
	width: 0;
	height: 0;
	min-height: 0;
	overflow: hidden;
}

.drop_overlay {
	display: none;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
	justify-content: center;
	align-items: center;
}

.drop_overlay .column {
	width: 130px;
	height: 80%;
	background: #e76a0a33;
	border: 4px dashed #e76a0a;
	border-bottom: 0;
	color: #e76a0a;
	font-weight: bold;
	text-align: center;
	padding-top: 72px;
	margin: 15px;
	margin-bottom: 0;
}

.drop_overlay .column.drag_over, .drop_overlay.drag_over {
	background: rgba(255, 255, 255, 0.8) !important;
}

.dragging .drop_overlay {
	display: flex;
}

.drag_overlay {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

.editing_on .custom_containers .span6 {
	width: 100% !important;
}

.editing_on .no_edit, .editing_off .no_view {
	display: none;
}

.editing_on .custom_containers [id^="graph_widget"] {
	height: 250px;
}

.editing_off .custom_containers [id^="graph_widget"] {
	height: 300px;
}

.custom_draggable_graph, .custom_draggable_label_item {
	position: relative;
}

.custom_draggable_graph.allow_drag, .draggable_labels .custom_draggable_label_item {
	cursor: move; /* pokud nepodporuje grab, tak aspon move */
	cursor: grab;
}

.custom_draggable_graph.deny_drag, .static_labels > span {
	cursor: not-allowed;
}

.drag_helper .custom_draggable_graph, .drag_helper .custom_draggable_label_item {
	cursor: grabbing;
}

.draggable_labels {
	min-height: 50px !important;
}

.editing_on .custom_draggables::before, .editing_on .custom_containers::before {
	display: block;
	content: "\00a0";
	height: 2px;
}

.custom_container, .custom_draggable {
	padding: 0 !important;
	margin: 0 !important;
}

.editing_on, .editing_off {
	width: 100%;
	padding: 0 !important;
	margin: 0 !important;
}

.custom_draggables, .custom_containers {
	padding: 0 !important;
	margin: 0 !important;
}

.editing_on .custom_containers {
	padding-left: 3px !important;
	padding-right: 10px !important;
}

.editing_on .custom_draggables {
	padding-left: 10px !important;
	padding-right: 10px !important;
}

.custom_draggable_graph_wrapper {
	height: 235px;
}

.custom_draggable_graph_wrapper_col {
	height: 190px;
}

.dragging .insert_allow {
	background: rgba(222, 107, 13, 0.3);
	border: 6px dashed #de6b0d;
	color: #de6b0d;
}

.dragging .insert_deny {
	background: rgba(128, 128, 128, 0.3);
	border: 6px dashed  rgb(128, 128, 128);
	color: rgb(128, 128, 128);
}

.drop_overlay h4 {
	text-align: center;
	font-size: 20pt;
	font-weight: bold;
}

.is_pinned {
	text-decoration: underline !important;
}

.custom_draggable_label_item::before {
	font: normal normal 15px 'font_aw';
	content: "\f047";
	margin-right: 10px;
}

.allow_drag .drag_overlay::before {
	font: normal normal 60px 'font_aw';
	content: "\f047";
	display: block;
	width: 100%;
	height: 100%;
	color: #9E9E9E;
	padding-top: 20px;
	padding-left: 80px;
}

.holderplace {
	display: inline-block;
}

.editing_off .col_left {
	padding-right: 15px !important;
}

.editing_off .col_right {
	padding-left: 15px !important;
}

.custom_container .panel .ui-resizable-se {
	position: absolute;
	z-index: unset !important;
}

.custom_container .panel .ui-resizable-s {
	display: none !important;
}

.editing_on .custom_container .panel .ui-resizable-handle {
	display: none !important;
}

[id^="graph_audit"] ~ .drop_overlay {
	border-radius: 0 !important;
}

input.error {
	background-color: #fc9999 !important;
}

select.error {
	background-color: #fc9999 !important;
}

.error-message {
	color: red;
	font-weight: bold;
}

.site-message {
	display: block;
	border-radius: 6px;
	padding: 16px;
	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .2), 0 0 3px 0 rgba(0, 0, 0, .2);
	background-color: #ffa;
	margin-top: -15px;
	margin-left: 5px;
	margin-right: 5px;
	margin-bottom: 20px;
}

.panel-footer-message {
	color: black;
}

.form_field_wrapper {
	display: block;
	width: 100%;
}
.form_field_label {
	display: inline-block;
	width: 33%;
	text-align: right !important;
	height: 30px;
	padding-right: 10px;
	vertical-align: center !important;
}
.form_field_label label {
	text-align: right !important;
	vertical-align: center !important;
}
.form_field {
	display: inline-block;
	width: 66%;
	height: 30px;
}
.form_field input,
.form_field select,
.form_field checkbox {
	width: 150px;
    display: inline-block !important;
}
.form_field_with_unit input,
#planner_holiday_config_form input {
	width: 150px !important;
}
.form_field_with_unit {
	display: inline-block;
	border: 2px solid #898989;
	border-radius: 3px;
}
.form_field_with_unit:hover {
	border-color: #e76a0a;
}
.form_field_with_unit input {
	display: inline-block !important;
	border-right: 1px solid #898989 !important;
	border-top: none !important;
	border-bottom: none !important;
	border-left: none !important;
	margin: 0 !important;
	height: 22px !important;
	border-radius: unset !important;
}
.form_field_unit {
	display: inline-block;
	height: 20px;
	padding-left: 5px;
	padding-right: 5px;
	width: 45px;
	text-align: center;
}
.submit_message {
	color: black;
}

/* SYP ‾˙v˙‾ SYP ‾˙v˙‾ SYP ‾˙v˙‾ SYP ‾˙v˙‾ SYP ‾˙v˙‾ SYP ‾˙v˙‾ SYP ‾˙v˙‾ SYP ‾˙v˙‾ SYP ‾˙v˙‾ SYP ‾˙v˙‾ SYP */

  @media (min-width: 768px) {
	.syp-main{
		padding-right: 20%;
	}
	.syp-containter{
		display: flex;
		flex-direction: row;
		justify-content: center;
		margin-bottom: 0.15rem;
		flex: 0 0 auto;
  		width: 100%;
	}
    .syp-label {
      text-align: end !important;
    }
	.syp-md-hide {
      display: none !important;
    }
	.syp-login{
		min-width: min-content !important;
		max-width: 25rem !important;
	}
	.syp-warning-checkboxes{
		display: flex;
		flex-direction: row;
		min-width: min-content;
		width: 83.33333333%;
		justify-content: center;
		margin-left: auto;
	}

  }

  @media (max-width: 767.98px) {
	.syp-main{
		padding-right: 0%;
	}
	.syp-containter{
		display: flex;
		flex-direction: column;
		justify-content: start;
		margin-bottom: 0.15rem;
		flex: 0 0 auto;
  		width: 100%;
	}
    .syp-label {
      text-align: start !important;
    }
    .syp-sm-hide {
      display: none !important;
    }
  }

/* SYP _.^._ SYP _.^._ SYP _.^._ SYP _.^._ SYP _.^._ SYP _.^._ SYP _.^._ SYP _.^._ SYP _.^._ SYP _.^._ SYP */

.variable {
	margin-top: 1px;
	margin-bottom: 1px;
	margin-right: 3px;
	padding: 4px;
	border-radius: 3px;
	background-color: #aaa;
	white-space: nowrap;
	color: white;
}
.variable-unit {
	padding: 2px;
	border-radius: 3px;
	background-color: #d1ffd1;
	color: black;
}
.variable-device-type {
	padding: 2px;
	border-radius: 3px;
	background-color: #d1ffff;
	color: black;
}
.variable-device {
	padding: 2px;
	border-radius: 3px;
	background-color: #d1d1ff;
	color: black;
}
.variable-variable {
	padding: 2px;
	border-radius: 3px;
	background-color: #ffd1d1;
	color: black;
}

.variable_dialog_wrapper {

}

.variable_list_wrapper {
	display: block;
	width: 100%;
	height: 400px;
	overflow: auto;
}
.variable_list {
	list-style-type: none;
	line-height: 35px;
}
.add_variable_form_wrapper {
	padding: 5px;
	border-radius: 5px;
	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .2), 0 0 3px 0 rgba(0, 0, 0, .2);
	background-color: #dddddd;
}

.dial-container {
	width: 200px;
	height: 100px;
	position: relative;
	display: inline-block;
}
.dial-container svg {
	width: 100%;
	height: 100%;
}
.dial-arc-bg {
	fill: none;
	stroke: #eee;
	stroke-width: 20;
}
.dial-arc {
	fill: none;
	/*stroke: #4caf50;*/
	stroke-width: 20;
	/*stroke-linecap: round;*/
}
.dial-value {
	font-family: sans-serif;
	font-size: 40px;
	font-weight: bold;
	fill: #333;
	text-anchor: middle;
}
.dial-secondary-value {
	font-family: sans-serif;
	font-size: 30px;
	font-weight: bold;
	fill: #333;
	text-anchor: middle;
}
.dial-title {
	font-family: sans-serif;
	font-size: 30px;
	font-weight: bold;
	fill: #333;
	text-anchor: middle;
}
.overview-value {
	font-size: 18px;
	font-weight: 400;
	letter-spacing: 0.32px;
}
.overview-label {
	font-size: 12px;
	font-weight: 400;
	letter-spacing: 0.32px;
}

.big_value_wrapper {
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
}
.big_value {
    font-size: 40px;
}
.big_value_label {
    font-size: 15px;
}
.info-box {
    padding-left: 20px;
    padding-right: 20px;
    text-align: center;
}
.value-unit {
    font-size: 50%;
}
.big_value_wrapper .value-unit {
    display: block;
}
.disabled {
	color: grey;
	font-style: italic;
}