/* 
 * General style setup
 */

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

h3 > span.ui-icon { float: left }

@font-face {
  font-family: 'FontAwesome';
  src: url('../css/fonts/fontawesome-webfont.eot?v=4.6.3');
  src: url('../css/fonts/fontawesome-webfont.eot?#iefix&v=4.6.3') format('embedded-opentype'), url('../css/fonts/fontawesome-webfont.woff2?v=4.6.3') format('woff2'), url('../css/fonts/fontawesome-webfont.woff?v=4.6.3') format('woff'), url('../css/fonts/fontawesome-webfont.ttf?v=4.6.3') format('truetype'), url('../css/fonts/fontawesome-webfont.svg?v=4.6.3#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

.ok-ico {background: transparent url(../images/tick.png) 0px 0px no-repeat; padding-left: 1.5em; font-size: 1.3em;}
.warning-ico:before {font: normal normal 15px 'FontAwesome'; content: "\f071"; margin-right: 3px;}
.off-ico {background: transparent url(../images/cross.png) 0px 0px no-repeat; padding-left: 1.5em; font-size: 1.3em;}
.online-ico:before {font: normal normal 15px 'FontAwesome'; content: "\f0c1"; margin-right: 3px;}
.offline-ico:before {font: normal normal 15px 'FontAwesome'; content: "\f127"; margin-right: 3px;} 
.send-history-ico:before {font: normal normal 15px 'FontAwesome'; content: "\f1da"; margin-right: 3px;}
.wrong-time-ico:before {font: normal normal 15px 'FontAwesome'; content: "\f017"; margin-right: 3px;}
.license-ico:before {font: normal normal 15px 'FontAwesome'; 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:32px;}
.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 1px no-repeat; padding-left: 1.5em; font-size: 1.3em;}
.status-ko-ico {background: transparent url(../images/status_ko.png) 0px 1px no-repeat; padding-left: 1.5em; font-size: 1.3em;}
.status-rdy-ico {background: transparent url(../images/status_rdy.png) 0px 1px 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 'FontAwesome'; 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 'FontAwesome'; content: "\f1c1"; margin-right: 3px;}  
.invoice-ico:before {cursor:pointer; font: normal normal 15px 'FontAwesome'; content: "\f155"; margin-right: 3px;}  /*f0d6*/
.coins-ico:before {cursor:pointer; font: normal normal 15px 'FontAwesome'; 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 'FontAwesome'; content: "\f044"; margin-right: 3px;}     
.chart-link-ico:before {cursor:pointer; font: normal normal 15px 'FontAwesome'; content: "\f201"; margin-right: 3px;}  


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

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 {
	font: 12px "Trebuchet MS", Helvetica, Arial;
	margin: 0;
	padding: 0;
	color: #333;
	background-color: #fff;
}

#solar_body #container {
	width: 1000px;
	margin: 10px auto;
	padding: 0;
}

#solar_body #footer {
	margin: 50px auto 0 auto;
	padding: 0;
}

#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 {
	/*color: #0063DC;*/
	text-decoration: none;
	outline: none;
}

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

.css_right {
	float: right;
}

.css_left {
	float: left;
}

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

#copyr {
	text-align: center;
	margin-top: 10px;
}

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

#copyr .copyr_link {
	font-size: 0.8em;
	color: #aaa;
}
/*-------------------------------------------------------------------*/

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

#header .input {
    /*border: 1px solid #006;*/
    /*background: white;*/
    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;
}

#navi {
	height: 28px;
	padding-top: 8px;
	display: block;
	float:left;
	margin-bottom: 15px;	
	font-size: 1.1em;
}

.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;
}

#graph_energy {	
	width:100%; 
	height:190px;
}

#graph_energy1, #graph_energy2 {	
	margin-top: 25px;
	float: left;
	width: 50%; 
	height: 300px;
}
/*-------------------------------------------------------------------*/

.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;
}

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

.select_val, .select_val1 {
	display: block;
	float:left;
	width: 370px;
	color: #999;
	font-size: 12px;
	font-weight: normal;
}

.select_val1 {
	width: 220px;
}

.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;
}

#graph_type {
	/*width:180px;*/
}
#inv_type, #inv_type1, #tra_type, #tra_type1, #bat_type, #bat_type1, #met_type, #met_type1  {
	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 'FontAwesome'; content: "\f065"; margin-right: 3px; }
.zoom-in_ico:before { font: normal normal 15px 'FontAwesome'; content: "\f00e"; margin-right: 3px; } 
.zoom-out_ico:before { font: normal normal 15px 'FontAwesome'; content: "\f010"; margin-right: 3px; }  

#show_overview {
	cursor:pointer;
}

#overview_val {
	display: block;
	float:right;
	position:relative;
	top: -10px;	
	width:275px; 
	height:45px; 
	visibility:hidden;
}

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

#graph_dev_val {
	display: block;
	width:100%; 
	height:235px; 
}

#graph_dev_val_choices {	
	display: block;
	width:100%;
	color: #3b3b3b;
}

#graph_dev_val_choices table {
  border-collapse: collapse;
  text-align:left;
  table-layout: fixed;
	margin: 10px auto 0 auto; 
}

#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;
}

.led {
  width: 30px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  border: none;
  color: #FFFFFF;
  display: inline-block;
  font-family: Arial;
  font-size: 12px;
  font-weight: bold;
  padding: 2px 8px;
  text-align: center;
}

.led.low {
	background-color: #C70500;
}
/*           
@-webkit-keyframes low {
  0% { background-color: #C70500; -webkit-box-shadow: 0 0 1px #C70500; }
  50% { background-color: #FF130D; -webkit-box-shadow: 0 0 3px #FF130D; }
  100% { background-color: #C70500; -webkit-box-shadow: 0 0 1px #C70500; }
}

@-moz-keyframes low {
  0% { background-color: #C70500; -moz-box-shadow: 0 0 1px #C70500; }
  50% { background-color: #FF130D; -moz-box-shadow: 0 0 3px #FF130D; }
  100% { background-color: #C70500; -moz-box-shadow: 0 0 1px #C70500; }
}

@-o-keyframes low {
  0% { background-color: #C70500; box-shadow: 0 0 1px #C70500; }
  50% { background-color: #FF130D; box-shadow: 0 0 3px #FF130D; }
  100% { background-color: #C70500; box-shadow: 0 0 1px #C70500; }
}

@keyframes low {
  0% { background-color: #C70500; box-shadow: 0 0 1px #C70500; }
  50% { background-color: #FF130D; box-shadow: 0 0 3px #FF130D; }
  100% { background-color: #C70500; box-shadow: 0 0 1px #C70500; }
}

.led.low {
  -webkit-animation: low 1500ms infinite;
  -moz-animation: low 1500ms infinite;
  -o-animation: low 1500ms infinite;
  animation: low 1500ms infinite;
}
*/
.led.mid {
	background-color: #E36500;
}
/*
@-webkit-keyframes mid {
  0% { background-color: #E36500; -webkit-box-shadow: 0 0 1px #E36500; }
  50% { background-color: #FF7100; -webkit-box-shadow: 0 0 3px #FF7100; }
  100% { background-color: #E36500; -webkit-box-shadow: 0 0 1px #E36500; }
}

@-moz-keyframes mid {
  0% { background-color: #E36500; -moz-box-shadow: 0 0 1px #E36500; }
  50% { background-color: #FF7100; -moz-box-shadow: 0 0 3px #FF7100; }
  100% { background-color: #E36500; -moz-box-shadow: 0 0 1px #E36500; }
}

@-o-keyframes mid {
  0% { background-color: #E36500; box-shadow: 0 0 1px #E36500; }
  50% { background-color: #FF7100; box-shadow: 0 0 3px #FF7100; }
  100% { background-color: #E36500; box-shadow: 0 0 1px #E36500; }
}

@keyframes mid {
  0% { background-color: #E36500; box-shadow: 0 0 1px #E36500; }
  50% { background-color: #FF7100; box-shadow: 0 0 3px #FF7100; }
  100% { background-color: #E36500; box-shadow: 0 0 1px #E36500; }
}

.led.mid {
  -webkit-animation: mid 1500ms infinite;
  -moz-animation: mid 1500ms infinite;
  -o-animation: mid 1500ms infinite;
  animation: mid 1500ms infinite;
}
*/
.led.hi {
	background-color: #2A8300;
}
/*
@-webkit-keyframes hi {
  0% { background-color: #37A900; -webkit-box-shadow: 0 0 1px #37A900; }
  50% { background-color: #4FF500; -webkit-box-shadow: 0 0 3px #45D500; }
  100% { background-color: #37A900; -webkit-box-shadow: 0 0 1px #37A900; }
}

@-moz-keyframes hi {
  0% { background-color: #37A900; -moz-box-shadow: 0 0 1px #37A900; }
  50% { background-color: #45D500; -moz-box-shadow: 0 0 3px #45D500; }
  100% { background-color: #37A900; -moz-box-shadow: 0 0 1px #37A900; }
}

@-o-keyframes hi {
  0% { background-color: #37A900; box-shadow: 0 0 1px #37A900; }
  50% { background-color: #45D500; box-shadow: 0 0 3px #45D500; }
  100% { background-color: #37A900; box-shadow: 0 0 1px #37A900; }
}

@keyframes hi {
  0% { background-color: #37A900; box-shadow: 0 0 1px #37A900; }
  50% { background-color: #45D500; box-shadow: 0 0 3px #45D500; }
  100% { background-color: #37A900; box-shadow: 0 0 1px #37A900; }
}

.led.hi {
  -webkit-animation: hi 1500ms infinite;
  -moz-animation: hi 1500ms infinite;
  -o-animation: hi 1500ms infinite;
  animation: hi 1500ms infinite;
}
*/
.led.off {
	background-color: #888B8E;
}

.offline {
	opacity: 0.5;
}

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

.legend_index {
	margin-top:5px;
	text-align: center;
	color: #808080;
}

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

.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 */
/*
#graph_dash {
	display: block;
	width: 100%; 
	height: 500px; 
}

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

.tool_dash {
	width: 20%;
	float: left;
	display: block;
	margin-left: 30px;
}

.val_container {
	width: 100%;
}

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

.dash_value {
	width: 50%;
	float: right;
}

.dash_name {
	width: 50%;
	float: left;
}
*/

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

#graph_dash {
	display: block;
	float: left;
	width: 750px; 
	height: 420px;
	margin-top: 15px;
	margin-left: 25px;
}

#tooltip_dash_val {
	width: 20%;
	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: 65%;
	float: right;
}

.dash_name {
	width: 35%;
	float: left;
}

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

.site-message {
	border: 1px solid #d5d5d5;
	background: #ffffaa;
	color: #555;
	border-radius: 4px;
	padding: 10px;
	margin-bottom: 10px;
}