@font-face {
	font-family: 'socomec-font-a2';
	src:	url('fonts/socomec-font-a2.woff') format('woff'),
		url('fonts/socomec-font-a2.ttf') format('truetype');
		/*url('fonts/icomoon.svg?50sf3h#icomoon') format('svg');*/
	font-weight: normal;
	font-style: normal;
}

[class^="icon_"], [class*=" icon_"] {
	font-family: 'socomec-font-a2';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1.3;
	color: #FFFFFF;
	display: inline-flex;
	font-size: 40px;
	width:100%;
	text-align:center;
	display:inline-block;
	margin-top: 10px;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon_realtime:before {
	content: "\0065";
}
.icon_realtime2:before {
	content: "\0045";
}
.icon_generalenergy:before {
	content: "\006C";
}
.icon_tariff:before{
	content: "\006F";
}
.icon_recordings:before{
	content: "\0075";
}
.icon_info:before{
	content: "\0038";
}
.icon_setup:before{
	content: "\0028";
}
.icon_logout:before{
	display: inline-block;
	content:"";
}
.icon_logout
{
    background: url('/images/deconnect.png') no-repeat center;
    background-size: 45px 45px;
    height: 55px;
}
.icon {
	font-size: 26px;	
	padding: .0em .0em;
	color: black;
	cursor: pointer;
}
.icon_button{
	font-size: 24px;	
	padding: .0em .0em;
	color: black;
	cursor: pointer;
	margin-bottom: 3px;
	margin-left: 4px;
}
BODY {
    PADDING-RIGHT: 0px; 
    PADDING-LEFT: 0px; 
    FONT-WEIGHT: normal; 
    PADDING-BOTTOM: 0px; 
    MARGIN: 0px; 
    PADDING-TOP: 0px; 
    FONT-FAMILY: Arial, sans-serif;
    COLOR: #000000;
    BACKGROUND-COLOR: #000000; /*page background color*/
    POSITION: absolute;
    width: 100%;
}
HTML{ 
	HEIGHT: 100%;
}
A.dash:link {
	BORDER-BOTTOM: 1px dashed
}
A.dash:visited {
	BORDER-BOTTOM: 1px dashed
}
A.dash:hover {
	BORDER-BOTTOM: 1px solid
}
H1 {
    FONT-WEIGHT: 900; 
    COLOR: #2F89C6;  
    FONT-FAMILY: Arial, Verdana, "Lucida Sans"; 
}
TD {
    FONT-SIZE: 100%;
    border: none;
}
A.option {
    FONT-WEIGHT: normal; 
    FONT-SIZE: 22px; 
    COLOR: #0e3754; 
    FONT-FAMILY: Arial, Verdana, "Lucida Sans";
}
A.option:hover {
    FONT-WEIGHT: normal; 
    FONT-SIZE: 22px; 
    COLOR: #1861a4; 
    FONT-FAMILY: Arial, Verdana, "Lucida Sans";
}
A.topmenu {
    FONT-FAMILY: Arial, Verdana, "Lucida Sans"; 
    TEXT-DECORATION: none;
}
.parametersTable{
	margin: 10px;
	width: 80%;
	max-width: 1100px;
	BACKGROUND-COLOR: #FFFFFF; /*table background color*/
	border: none;
	font-size:80%;
}
.rowHeader{
	BACKGROUND-COLOR: #2F89C6; /*table header row background color*/
	FONT-FAMILY: Arial, Helvetica;
	TEXT-ALIGN: center;
	COLOR: white;
	border: 1px solid #D3D3D3;
}
.textbox{
	HEIGHT: 26px;
	WIDTH: 150px;
	color: #4D4D4E;
}
.error {
	PADDING: 1em;
	WIDTH: 300px; 	
	FONT-SIZE: 14px; 
	COLOR: #FFCB08; /*error font color*/
	FONT-FAMILY: Arial, Helvetica;
	margin: auto;
	BACKGROUND-COLOR: #2F89C6;
}
.tabrow {
	text-align: center;
	list-style: none;
	padding: 0;
	line-height: 0px;
	font-size: 14px;
	font-family: Arial, Helvetica;
	position: relative;
	background: #000000;
	margin: 0;
	padding-top: 30px;
	text-align: left;
	display:inline-flex;
}
#clearit{
clear: both;
}
#menu_container{
	BACKGROUND-COLOR: #000000;
	position:relative;
	text-align: left;
	margin-left: auto;
	margin-right: auto;
	width: 90%;
	max-width:1100px;
	top: 0px;
	z-index:1;
}

#date_time_bar{
	background: #2F89C6;
	color: #FFFFFF;
	margin-bottom: 20px;
	margin-top: 10px;
	display: inline-block;
	width: 100%;
}
.menu_width
{
	position: relative;
	width: 100%;
}
.tabrow li {
	border: 1px solid #0000;
	background: #7F7F7F;
	display: inline-block;
	position: relative;
	z-index: 0;
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
	margin-right: 5px;
	padding: 0px;
	width: 110px;
	height: 100px;
	cursor: pointer;
}
.tabrow a {
    color: #555;
    text-decoration: none;
}

.tabrow li:hover {
	background: #2F89C6;
}

.tabrow li.selected {
	background: #2F89C6;
}

.menuButton{
	width:120px;
	height:30px;
	background-color:#C0C0C0;
	font-size:14px;
}
.buttonText{
	font-size:14px;
	font-family: Arial, Helvetica;
	position:relative;
	top:0px;
	left:2px;
	width: 100%;
	text-align: center;
}

.labelText{
	font-size:14px;
	font-family: Arial, Helvetica;
	position:relative;
	top:0px;
	left:2px;
	color: #2F89C6;
}

.menuText{
	position: absolute;
	text-align: center;
	font: bold 14px Arial, Helvetica, sans-serif;	
	left: 0px;
	justify-content: space-around;
	cursor: pointer;
	width: 110px;
	color: #FFFFFF;
	bottom: 15px;
}
a.metroButton {
	background-color: #808080;
	padding: 5px 0;
	text-decoration: none;
	margin-left: 15px;
	margin-top: 5px;
	margin-bottom: 5px;
	margin-right: 0px;
	display: inline-block;
	color: #FFFFFF;
	width: 110px;
	text-align: center;
}
.tableRow
{
	HEIGHT: 35px;
	border: 0;
}
.smallRow
{
	HEIGHT: 25px;
}
.paramCell2Col
{
	FONT-SIZE: 16px;	
	TEXT-ALIGN: right;
	vertical-align: top;
	FONT-FAMILY: Arial, "Lucida Console", Monospace;
	PADDING: 0px;
	MARGIN: 0px;
	DISPLAY: inline-block;
	TEXT-ALIGN: right;
	WIDTH: 50%;
	MIN-WIDTH:100PX;
	COLOR: #4D4D4E;
}
.header
{
	FONT-SIZE: 13px;
	TEXT-ALIGN: left;
	FONT-FAMILY: Arial, Monospace;
	BACKGROUND-COLOR: white;
}
INPUT, SELECT
{
    	font-size: 14px;
	text-align: center;
	FONT-FAMILY: Arial, Helvetica, Monospace;
}
.input_login
{
	text-align: center;
	FONT-FAMILY: Arial, Helvetica, Monospace;
}
.browse
{
   display:none;
}
.topline
{
	border-top: 1px solid black;
}
.black
{
	display:inline;
	color: black;
	vertical-align: top;
}
.numericalValue{
	display: inline-block;
	font-size: 1.1em;
	font-family: "Lucida Console", Monospace;
	color: #4D4D4E;
	margin-top: 1px;
}
.big_arrow
{
	font-size: 24px;
	display:inline;
}
.left_border
{
	border-left:2px solid #000000
}
.top_border
{
	border-top:2px solid #2F89C6;
}
.bottom_border
{
	border-bottom:2px solid #2F89C6;
}
#mainTable
{
	margin-left:auto;
	margin-right:auto;
	margin-top:5px;
	z-index:0;
	width: 90%;
	max-width:1100px;
	background: white;
	padding: 15px;
	text-align: center;
}
.countersResetTable
{
	background-color: #FFFFFF; /*reset table background color*/
}
.costValue{
	font-size: 1em;
}
.tableCol{
	align: center;
	border: 1px solid #808080;
}
.measureUnit{
	color: #4D4D4E;
	vertical-align: top;
}
.bottomDiv{
	margin-right: auto;
	margin-left:auto;
	text-align: right;
	max-width:1100px;
	width:90%;
}

.bar_left{
	text-align: left;
	display: inline-block;
	width: 49%;
	font-size: 14px;
	font-weight: bold;
	margin:4px;
}

.bar_right{
	text-align: right;
	display: inline-block;
	width: 49%;
	font-size: 14px;
	font-weight: bold;
}

.first_secondrow_cell{
	background: #F5F5F5;
	text-align: right;
	color: black;
	border: 1px solid #D3D3D3;
}

.secondrow_cell_left{
	background: #FFFFFF;
	text-align: left;
	color: black;
	border: 1px solid #D3D3D3;
}

.secondrow_cell_center{
	background: #FFFFFF;
	text-align: center;
	color: black;
	border: 1px solid #D3D3D3;
}

.secondrow_cell{
	background: #FFFFFF;
	text-align: right;
	color: black;
	border: 1px solid #D3D3D3;
}

.secondrow_cell_noborder{
	background: #FFFFFF;
	text-align: right;
	color: black;
	border: 0;
}

.secondrowCellNoborderSetup{
	width:25%;
	background: #FFFFFF;
	text-align: right;
	color: black;
	border: 0;
}

.separatorRow{
	border: none;
	height: 20px;
}

.titleRow{
	color: #A9948A; 
	width: 50%;
	border-bottom: 1px solid;
}

.bottomLeft{
	background: #000000;
	width: 100%;
	padding: 0;
}

.bottomRight{
	padding: 0;
	text-align: 100%;
}
.ftp_td
{
	align-items: center;
	height: 35px;
	width:15%
}

.spinBox{
  position      : relative;
  display       : inline-block;
  padding-right : 0.875em;
  border-radius : 0.25em;
  box-shadow    : 0 0.0625em 0 rgba(255,255,255,0.5);
  vertical-align: middle;
}

.spinBox input{
  display                   : block;
  height                    : 1.8em;
  width			    : 2em;
  padding                   : 0 0.25em;
  border                    : 0.0625em solid rgb(224,224,224);
  border-right              : none;
  border-top-left-radius    : 0.25em;
  border-bottom-left-radius : 0.25em;
  color                     : rgb(64,64,64);
  font-family               : inherit;
  font-size                 : 1em;
  text-align                : right;
  box-shadow                : 0 0.125em 0.125em rgba(0,0,0,0.03125) inset;
}

.spinBox input[disabled]{
  background : rgb(240,240,240);
}

.spinBoxUp,
.spinBoxDown{
  position         : absolute;
  right            : 0;
  display          : block;
  width            : 0.75em;
  height           : 0.75em;
  border           : 0.0625em solid rgb(224,224,224);
  background       : rgb(248,248,248);
  background-image : -webkit-linear-gradient(rgb(248,248,248),rgb(240,240,240));
  background-image :         linear-gradient(rgb(248,248,248),rgb(240,240,240));
  cursor           : pointer;
}

.spinBox input[disabled] + span,
.spinBox input[disabled] + span + span{
  background : rgb(240,240,240);
  cursor     : auto;
}

.spinBoxUp span,
.spinBoxDown span{
  display : block;
  width   : 0.75em;
  height  : 0.75em;
}

.spinBoxUp{
  top                     : 0;
  border-top-right-radius : 0.25em;
}

.spinBoxUp span{
  background : url('images/arrow-up.png') no-repeat center center;
}

.spinBoxDown{
  bottom                     : 0;
  border-bottom-right-radius : 0.25em;
}

.spinBoxDown span{
  background : url('images/arrow-down.png') no-repeat center center;
}