*, *:before, *:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: none;
}
a {
	text-decoration: none;
}
body,html {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	font-family: Helvetica, Arial, Verdan, sans-serif;
	color:  #1C58A3;
	background-color: #F0F0FF;
}
input, select, option {
	color: #1C58A3;
	font-family: Helvetica, Arial, Verdan, sans-serif;
}
#header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background-color: #1C58A3;
	color: white;
	height: 40px;
	z-index: 9999;
}
#footer {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: #1C58A3;
	color: white;
	height: 45px;
	color: white;
	text-align: center;
	padding-top: 2px;
	z-index: 9999;
}
#footer A, #footer A:visited {
	text-decoration: none;
	color: White;
}
#footer a:hover {
	color: #DA0C1D;
}

#version {
	width: 40px;
	float: left;
	padding-left: 0.2em;
	line-height: 40px;
	vertical-align: middle;
}

#headericons {
	float: right;
	width: 300px;
	text-align: right;
	margin-top: 4px;
}
#login {
	width: 100%;
	background-color: White;
	padding: 1em 1em 1em 1em;
	margin-top: 1em;
	display: block;
}
#content {
	width: 100%;
	height: 100%;
	padding: 45px 0 50px 0;
}
.box2 {
	width: 100%;
	background-color: White;
	padding: 1em 1em 1em 1em;
	margin-top: 1em;
	display: block;
}
.box {
}
.clear {
	clear: both;
}
h1 {
	font-size: 1.2em;
	border-bottom: 1px solid #DA0C1D;
	line-height: 40px;
	margin-top: -0.4em;
}
.red {
	color: #DA0C1D;
}

.innerform {
	display: table;
	width: 100%;
}
.innerrow {
	display: table-row;
}
.innerrow span.label {
	display: table-cell;
	line-height: 1.2em;
	vertical-align: middle;
	padding: 0.2em 0.2em 0.2em 0em;
	width: 170px;
}
.innerrow span {
	display: table-cell;
	line-height: 1.2em;
	width: calc(100% - 170px);
	padding: 0.2em 0em 0.2em 0.2em;
	vertical-align: middle;

}
.innerrow span .input {
	-webkit-appearance: none;
	width: 100%;
	border: 1px solid #1C58A3;
	/*font-size: 1.2em;*/
	border-radius: 0;
	padding: 0.2em 0.2em 0.2em 0.2em;
}

.input {
	-webkit-appearance: none;
	width: 100%;
	border: 1px solid #1C58A3;
	/*font-size: 1.2em;*/
	border-radius: 0;
	padding: 0.2em 0.2em 0.2em 0.2em;
}
.input2 {
	width: 50px;
}

INPUT.submit {
	-webkit-appearance: none;
	background-color: #1C58A3;
	color: white;
	text-align: center;
	font-weight: bold;
	cursor: pointer;
	width: 100%;
	padding: 0.2em 0.2em 0.2em 0.2em;
	font-size: 1.2em;
	border-radius: 0;
	border: none;
	-webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.submit2 {
	-webkit-appearance: none;
	background-color: #1C58A3;
	color: white;
	text-align: center;
	font-weight: bold;
	cursor: pointer;
	padding: 0.2em 0.2em 0.2em 0.2em;
	/*font-size: 1.2em;*/
	border-radius: 0;
	border: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.submitpm {
	width: 1.6em;
}
.submit2:hover, .submit:hover {
	background-color: #DA0C1D;
}

.error {
	color: #DA0C1D;
	padding: 0.2em 0em 0.2em 0em;
}
.ok {
	color: Green;
	padding: 0.2em 0em 0.2em 0em;
}
.hide {
	display: none;
}
.bold {
	font-weight: bold;
}
#divcanvas {
	width: 100%;
	-webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
#divcontrol {
	width: 100%;
}
.col50left {
	width: 100%;
}
.col50right {
	width: 100%;
}

.table100 {
	width: 100%;
}
.text {
	line-height: 1.4em;
	vertical-align: middle;
}
.onoff {
	background-color: lightgrey;
	text-align: center;
	color: grey;
	padding: 0.2em 0.2em 0.2em 0em;
	font-weight: bold;
	width: 100px;
	text-align: center;
}
.on {
	color: White;
	background-color: Lime;
}
.off {
	color: White;
	background-color: #DA0C1D;
}
#logo img {
	width: 100%;
}


.tdright {
	text-align: right;
}
.tdcenter {
	text-align: center;
}
.ch {
	/*position: absolute;
	z-index: 10;
	top: 0;
	left: 0;
	*/
	background-color: White;
	background-color: #1C58A3;
	padding: 0.2em 0.2em 0.2em 0.2em;
	color: White;
	text-align: center;
}
.error2 {
	border: 1px solid #DA0C1D;
}
.time {
	font-size: 2em;
	font-weight: bold;
}

@media (min-width: 720px) {
	#login {
		width: 600px;
		height: 280px;
		position: absolute;
    	top:0;
    	bottom: 0;
    	left: 0;
    	right: 0;
    	margin: auto;
		border: 1px solid #DA0C1D
	}
	.row {
		display: flex;
	}

	/*
	#divcanvas {
		float: left;
		width: calc(50% - 0.5em);
		margin: 1em 1em 1em 0em;
	}

	#divcontrol {
		float:right;
		width: calc(50% - 0.5em);
		margin: 1em 0em 1em 1em;
	}
	*/

	.col50left {
		float: left;
		width: calc(50% - 0.5em);
		margin: 1em 1em 1em 0em;
	}
	.col50right {
		float:right;
		width: calc(50% - 0.5em);
		margin: 1em 0em 1em 1em;
	}

	.col70left {
		float: left;
		width: calc(70% - 0.5em);
		margin: 1em 1em 1em 0em;
	}
	.col30right {
		float:right;
		width: calc(30% - 0.5em);
		margin: 1em 0em 1em 1em;
	}


	h1.password {
		background-image: url('../image/password.png');
		background-repeat: no-repeat;
		text-indent: 40px;
	}
	h1.bt {
		background-image: url('../image/bt.png');
		background-repeat: no-repeat;
		text-indent: 40px;
	}
	h1.email {
		background-image: url('../image/email.png');
		background-repeat: no-repeat;
		text-indent: 40px;
	}
	h1.settings {
		background-image: url('../image/settings.png');
		background-repeat: no-repeat;
		text-indent: 40px;
	}
	h1.status {
		background-image: url('../image/status.png');
		background-repeat: no-repeat;
		text-indent: 40px;
	}
	h1.trommel {
		background-image: url('../image/trommel.png');
		background-repeat: no-repeat;
		text-indent: 40px;
	}
	h1.control {
		background-image: url('../image/control.png');
		background-repeat: no-repeat;
		text-indent: 40px;
	}
	h1.info {
		background-image: url('../image/info.png');
		background-repeat: no-repeat;
		text-indent: 40px;
	}
	h1.flushtimes {
		background-image: url('../image/clock.png');
		background-repeat: no-repeat;
		text-indent: 40px;
	}
	h1.alarms {
		background-image: url('../image/alarm.png');
		background-repeat: no-repeat;
		text-indent: 40px;
	}
	h1.heating {
		background-image: url('../image/cv.png');
		background-repeat: no-repeat;
		text-indent: 40px;
	}
	h1.graph {
		background-image: url('../image/graph.png');
		background-repeat: no-repeat;
		text-indent: 40px;
	}
	.box3 {
		margin-top: 1em;
		margin-bottom: 1em;
	}

}
@media (min-width: 900px) {

	#content {
		min-width: 900px;
		max-width: 980px;
		width: 80%;
		margin: 0 auto 0 auto;
	}

}