html {
		background: LightSteelBlue no-repeat ; /* For browsers that do not support gradients */
		background: -webkit-linear-gradient(left top, LightSlateGrey , LightSteelBlue ) no-repeat; /* For Safari 5.1 to 6.0 */
		background: -o-linear-gradient(bottom right, LightSlateGrey , LightSteelBlue) no-repeat; /* For Opera 11.1 to 12.0 */
		background: -moz-linear-gradient(bottom right, LightSlateGrey , LightSteelBlue) no-repeat; /* For Firefox 3.6 to 15 */
		background: linear-gradient(to bottom right, LightSlateGrey , LightSteelBlue) no-repeat; /* Standard syntax */
		height: 100%;
  		width: 100%;
	    font-family: "Antic", Helvetica, sans-serif;
	}
	
.general_position{
	width: 1024px;
	margin: 0 auto;
}

.break_line{
	height: 4px;
	background: rgba(140,140,140,1);
}

.top_margin{
	height: 20px;
}

h1{
	text-align: center;
	color: navy;
}

.log_in_form{
	text-align:center;
}

.input_field {
  display: inline-block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 150px;
  height: 42px;
  cursor: pointer;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 0 20px;
  overflow: hidden;
  border: none;
  -webkit-border-radius: 21px;
  border-radius: 21px;
  font: normal 20px/normal "Antic", Helvetica, sans-serif;
  color: rgba(140,140,140,1);
  text-decoration: normal;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  background: rgba(40,40,40,0.4);
  -webkit-box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.5) inset;
  box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.5) inset;
  -webkit-transition: all 502ms cubic-bezier(0.68, -0.75, 0.265, 1.75);
  -moz-transition: all 502ms cubic-bezier(0.68, -0.75, 0.265, 1.75);
  -o-transition: all 502ms cubic-bezier(0.68, -0.75, 0.265, 1.75);
  transition: all 502ms cubic-bezier(0.68, -0.75, 0.265, 1.75);
}

.input_field:hover {
  color: rgba(181,181,181,1);
  background: rgba(0,0,0,0.4);
  -webkit-transition: all 500ms cubic-bezier(0.68, -0.75, 0.265, 1.75);
  -moz-transition: all 500ms cubic-bezier(0.68, -0.75, 0.265, 1.75);
  -o-transition: all 500ms cubic-bezier(0.68, -0.75, 0.265, 1.75);
  transition: all 500ms cubic-bezier(0.68, -0.75, 0.265, 1.75);
}

.input_field:focus {
  width: 213px;
  cursor: default;
  padding: -13px 20px 0;
  color: rgba(255,255,255,1);
  -webkit-transition: all 601ms cubic-bezier(0.68, -0.75, 0.265, 1.75);
  -moz-transition: all 601ms cubic-bezier(0.68, -0.75, 0.265, 1.75);
  -o-transition: all 601ms cubic-bezier(0.68, -0.75, 0.265, 1.75);
  transition: all 601ms cubic-bezier(0.68, -0.75, 0.265, 1.75);
}

.label_front_page {
  display: inline-block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 150px;
  height: 20px;
  padding: 0 20px;
  overflow: hidden;
  font: normal 20px/normal "Antic", Helvetica, sans-serif;
  color: rgba(240,240,240,1);
  text-decoration: normal;
}

.user_info{
	display:block;
	-webkit-box-sizing: border-box;
  	-moz-box-sizing: border-box;
  	box-sizing: border-box;
	height: 25px;
	background: rgba(84,95,107,1);	
}
.top_info{
	margin-top: 2px;
	color: rgba(210,210,210,1);
	font-weight: bold; 	
}

.Temp{
	position: absolute; 
	display: block; 
	color:red; 
	background: white; 
	width: 100px;
}
.Humi{
	position: absolute; 
	display: block; 
	color:blue; 
	background: white; 
	width: 100px;
}

.top_menu{
	display:block;
	-webkit-box-sizing: border-box;
  	-moz-box-sizing: border-box;
  	box-sizing: border-box;
	height: 50px;
	background: rgba(84,95,107,1);
	text-align: center;
	padding-top: 5px;
	padding-bottom: 5px;
}

.menu_item{
	text-decoration: none;
	color: rgba(210,210,210,1);
	font-weight: bold;
	display:inline-block; 
	text-align: center; 
	padding: 10px;	
}
.menu_item:hover{
	color: black;
	background: rgba(210,210,210,1);
}
.menu_item_break{
	display: inline-block;
	width: 2px;
	padding-top: 25px;
	padding-bottom: 0px;
	height:15px;
	background: rgba(140,140,140,1);
	font-size: 0;
}

.inputFieldNewParam{
	width: 25px;	
}

.DryMode{
	margin-top: 2px;
	color: rgba(210,210,210,1);
	font-weight: bold;
	float: left; 
	display:inline-block; 
	width: 100%; 
	text-align: center;
}

/*Radio buttons with images*/
.RadioDry > input{ /* HIDE RADIO */
  visibility: hidden; /* Makes input not-clickable */
  position: absolute; /* Remove input from document flow */
}
.RadioDry > input + img{ /* IMAGE STYLES */
  cursor:pointer;
  border:4px solid transparent;
}
.RadioDry > input:checked + img{ /* (RADIO CHECKED) IMAGE STYLES */
  border:4px solid rgba(0,255,0,1);
}

/*Radio buttons with div*/
.RadioSetUp > input{ /* HIDE RADIO */
  visibility: hidden; /* Makes input not-clickable */
  position: absolute; /* Remove input from document flow */
}
.RadioSetUp > input + div{ /* IMAGE STYLES */
  margin-left:5px;
  float: left;
  cursor:pointer;
  border-bottom:10px solid transparent;
  display:inline-block; 
  width: 20%; 
  height: 70px; 
  background: rgba(210,210,210,1);
  
}
.RadioSetUp > input:checked + div{ /* (RADIO CHECKED) IMAGE STYLES */
  border-bottom:10px solid rgba(0,255,0,1);
}

/*Radio buttons with div for Periodic set up*/
.RadioSetUpPeriodic > input{ /* HIDE RADIO */
  visibility: hidden; /* Makes input not-clickable */
  position: absolute; /* Remove input from document flow */
}
.RadioSetUpPeriodic > input + div{ /* IMAGE STYLES */
  margin-left:5px;
  float: left;
  cursor: pointer;
  border-bottom:3px solid transparent;
  display:inline-block; 
  width: 25px; 
  height: 15px; 
  /*background: rgba(210,210,210,1);*/
  
}
.RadioSetUpPeriodic > input:checked + div{ /* (RADIO CHECKED) IMAGE STYLES */
  border-bottom:3px solid rgba(0,255,0,1);
}

.centerSpanText{
	display:inline-block; 
	width: 100%; 
	text-align: center;
}

.BoxText{
	margin-top:5px;
	font-size: 20px;
	font-weight: bold;
}

.ONOFF{
  margin-left:5px;
  margin-bottom: 2px;
  float: left;
  display:inline-block; 
  width: 20%; 
  height: 32px; 
  background: rgba(210,210,210,1);
  color: 	black;
}

.ONOFF.OFF{
	background: rgba(110,110,110,1);
	color: 	rgb(210,210,210,1);
}

.PlusMinusContainer{
  margin-right:5px;
  margin-bottom: 2px;
  float: right;
  border-bottom:10px solid transparent;
  display:inline-block; 
  width: 12%; 
  height: 70px; 
  color: black;
}

.PlusMinusBotton{
	display:inline-block; 
	width: 100%;
	height: 38px; 
	text-align: center;
	font-size: 25px;
	font-weight: bold;
}

.labelPeriodicText{
	display:inline-block; 
	width: 100%;
	height: 20px; 
	text-align: right;
	font-size: 15px;
	font-weight: bold;
}

.labelPeriodicContainer{
  margin-left:5px;
  float: left;
  display:inline-block; 
  width: 60px; 
  height: 20px; 
  color: rgb(210,210,210,1);
}

.RadioSetUpPeriodic1 > input{ /* HIDE RADIO */
  /*visibility: hidden; /* Makes input not-clickable */
  /*position: absolute; /* Remove input from document flow */
}
.RadioSetUpPeriodic1 > input + div{ /* IMAGE STYLES */
  margin-left:5px;
  float: left;
  cursor: pointer;
  display:inline-block; 
  width: 25px; 
  height: 15px; 
  /*background: rgba(210,210,210,1);*/
  
}



