body,div,span,td,input,textarea,a,li,p
{
	font-family: 'Quicksand', sans-serif;
	/*letter-spacing:1px;*/
	font-size:15pt;
	box-sizing: border-box;
	background:transparent;
	margin:0;
	padding:0;
	color:rgb(53 120 0);
	line-height: 135%;
}
a,
a:link,
a:hover,
a:active,
a:visited {
	text-decoration: none;
	color:inherit;
	font-size:inherit;
}
.small {
	font-size:12px;
}
input {
	color:rgb(53 120 0);
	border: 1px solid rgb(53 120 0);
	padding: 0 10px;
}
input.duration {
	width:60px;
}
.content {
	margin-top:50px;
}
.doppellinie {
	width:100%;
	height:3px;
	padding-top:2px;
	margin-top:2px;
	border-bottom: 1px solid rgb(53 120 0);
	border-top: 1px solid rgb(53 120 0);
}
.linie {
	width:100%;
height:1px;
padding-top:2px;
border-bottom: 1px solid rgb(53 120 0);
	
}
.page {
	padding:10px;
}
h1,h2,h3,h4 {
	margin:0;
	padding:0;
	font-size:17pt;
	font-weight: bold;
}
.grau {
	color:#999;
	font-size:16px;
}
h1 {
	font-size:21pt;
	margin-bottom:15px;
	margin-top:20px;
}
h2 {
	margin-top:20px;
	margin-bottom:10px;
}
h1.splash {
	font-size:32pt;
	margin-top:40px;
	margin-bottom:20px;
	line-height: 135%;
}
.logo_splash {
	width:90%;
	
}
.header {
	height:auto;
	margin-bottom:20px;
	position:absolute;
	width:100%;
/* 	display:none; */
}
div.svg {
	margin-top:95px;
}
.logo {
/* 	background-image:url('images/logo_vcl.svg'); */
	background-size: 300px 98px;
	background-repeat: no-repeat;
	width:300px;
	height:98px;
	position: absolute;
	top:10px;
	left:20px;
	display: none;
}
ul,li {
	margin:0;
	padding:0;
	list-style: none;
	padding-inline-start: 0;
	margin-block-start: 0;
    margin-block-end: 0;
}
.hamburger {
/*
	background-image:url('images/hamburger.png');
	background-repeat: no-repeat;
	background-size: 44px 44px;
*/
	top: 10px;
	right: 40px;
	position: absolute;
	height: 50px;
	width: 70px;
	padding:10px;
	cursor:pointer;
	display: none;
}
.hamburger .oben {
	border-top:6px solid;
	border-bottom:6px solid;
	height:19px;
	border-color:rgb(53 120 0);
}
.hamburger .unten {
	height:13px;
	border-bottom:6px solid;
	border-color:rgb(53 120 0);
}
.main_spalte {
	margin: 0 auto;
	max-width:4000px;
	position: relative;
	
}
.topmenu {
/* 	position: absolute; */
	top:10px;
	right:0px;
}
.topmenu ul li {
	display:inline-block;
	margin-left:0px;
	margin-right:0px;
	margin-top:5px;
	padding: 5px 15px;
	font-size:15pt;
	background-color:rgb(53 120 0);
	color:#fff;
}
.topmenu ul li.button {
	background-color:#ebffe8;
	color:rgb(53 120 0);
	cursor:pointer;
}
.menu {
	margin-top:150px;
	margin-bottom:20px;
}
.menu>ul {
	display:flex;
	justify-content: space-around;
	padding:0 20px;
	
}
.menu>ul>li {
	flex-grow: 1;
	flex: 1 1 0px;
	margin-right:20px;
}
.menu>ul>li:last-child {
	margin-right:0;
}
.menuslider {
	background-color:#008b2d;
	position: absolute;
	width:100%;
	padding: 20px 20px;
	top:50px;
	z-index:1000;
}
.menuslider>ul {
	display: flex;
	
	justify-content: space-around;
	
}
.menuslider>ul>li {
/* 	justify-content: space-around; */
	flex-grow:1;
	flex-shrink:1;
	padding:0;
	flex: 1 1 0px;
	margin-right:20px;

}
.menuslider>ul>li:last-child {
	margin-right:0px;
}
.menuslider ul li a {
	color:#fff;
	font-size: 13pt;
}
.mainpic {
	overflow:hidden;
	position:relative;
}
.mainpic img.cover {
	object-fit: cover;
	width:100vw;
	height:40vw;
}
.energiefluss {
	display:flex;
}
.energiefluss .spalte:first-child {
	margin-right:50px;
}
.energiefluss .spalte>div {
	display:flex;
}
.energiefluss>div .label {
	width: 250px;
}
.energiefluss>div .wert {
	text-align: right;
	width:100px;
	margin-right:20px;
}
.energiefluss>.breit .wert {
	width:400px;
	text-align:left;
	margin-right:0;
}
.desc {
	vertical-align: bottom;
	display:block;
}
ul.tabelle li {
	display:flex;
}
ul.tabelle li div.datum {
	min-width:120px;
	max-width:120px;
	text-align:right;
}
ul.tabelle li div.e {
	min-width:150px;
	max-width:150px;
	text-align:right;
}
ul.tabelle li.titel div {
	font-weight:bold;
}
.kopf,.jahre {
	margin:60px 0 40px;
	display:flex;
	
}
.kopf.battery {
	position: fixed;
	top:70px;
	background-color: #deffdb;
	border: 1px solid #99d;
}
.kopf.battery .result {
	background-color: #deffdb;
}
.kopf.battery .result table {
	width:400px
}
.kopf.battery .result td {
	text-align: right;
}
.button {
	padding:5px 10px;
	min-width:120px;
	margin-right: 20px;
	text-align:center;
	cursor:pointer;
}
.button.aktiv {
	background-color: #c0e9ba;
	font-weight: bold;
}
input[type=checkbox] {
	margin-right:5px;
	margin-left:20px;
}
.batterie_simulation td {
	padding:3px 10px;
	text-align: right;
}
.login_pane {
	position:absolute;
	top: 40vh;
	left: calc(50vw - 160px);
	width:300px;
	height:200px;
	padding:10px;
	background-color: white;
	border:1px solid #ccc;
	display:none;
}
.login_pane .close {
	position: absolute;
	top:10px;
	right:10px;
	cursor:pointer;
}
.layer .close {
	position:absolute;
	right:20px;
	top:20px;
	width:20px;
	height:20px;
	background-image: url('images/close.svg');
	cursor:pointer;
}
.login_pane .felder {
	position: absolute;
	top:50px;
	left:10px;
	width:100%;
}
.login_pane .feld:fist-child {
	margin-top:40px;
}
.login_pane .feld {
	margin-bottom:10px;
	position: relative;
}
.login_pane input {
	left:80px;
	width:200px;
	position: absolute;
}
.login_pane .button {
	margin-top:30px;
}
ul.auto_werte_tot {
	margin-left:50px;
	padding-bottom:50px;
	width:600px;
}
ul.auto_werte_tot .klein {
	font-size:16px;
}
ul.auto_werte_tot li {
	display:flex;
}
ul.auto_werte_tot li .label {
	width:200px;
}
ul.auto_werte_tot li .wert {
	width:150px;
	text-align:right;
	padding-right: 20px;
}
ul.auto_werte_tot li.total {
	padding-top:10px;
	margin-top:10px;
	border-top:1px solid #000;
}
ul.auto_werte_tot li.total div {
	font-weight: bold;
}
.control {
	position: relative;
	height:auto;
	padding-top:10px;
	font-size:16pt;
}
.control .error {
	color:#d00;
}
.energiefluss .spalte>.controls {
	display: block;
}
.schalter {
	position: absolute;
	top:0px;
	margin-left:170px;
	width:100px;
	height:40px;
	background-size: 70px 40px;
	background-repeat: no-repeat;
	cursor:pointer;
}
.schalter.off {
	background-image: url('images/schalter_off.png');
}
.schalter.on {
	background-image: url('images/schalter_on.png');
}
.zahl_short {
	position: absolute;
	margin-left:180px;
	width:65px;
	top:10px;
	display: block;
}
svg #control {
	cursor:pointer;
}
.layer {
	display:none;
	position:absolute;
	width:50%;
	border:1px solid #999;
	background-color:#fff;
	padding:20px;
	top:40px;
	height:60vh;
	overflow:hidden;
 left: 50%;
	  transform: translateX(-50%);
}
.layer .schalter,
.layer input {
	margin-left:350px;
}

.miniLayer {
	display:none;
	position:absolute;
	width:300px;
	height:220px;
	border:1px solid #999;
	background-color: #fff;
}
.leftSlider {
	display:flex;
	position:fixed;
	top:100px;
	left:0px;
	background-color:blue;
	color:#fff;
}
.leftSlider .content {
	width:500px;color:#fff;
	padding:10px;
}
.leftSlider .content h1,
.leftSlider .content p {
	color:white;
}
.leftSlider .label {
	width: 30px;
	background-color: aquamarine ;
	min-height: 100px;
	padding-top: 50px;
	cursor: pointer;
	

	
}
.leftSlider .label span {
	display:block;
	font-size:22pt;
	padding:2px;
	transform: rotate(-90deg);
}
#preischart {
	height:250px;
}