#body{
    font-family: Tahoma , Verdana, Geneva, sans-serif; /* Verdana, Geneva, sans-serif */
    transition: 1.5s all;
    
    background-color: black;
    color: 	#d4d4d4;
    font-size: 1.0em;
    
}

a{
	color: greenyellow
}

.flex { 
    display: flex; 
    justify-content: center; 
    align-items: center;
}
.green{
	color: greenyellow;
}
.hrGrau{
	border: 1px solid grey;
}

.hrGreen{
	border: 1px solid greenyellow;
}

.backGroundDiv{
	display:inline-block; /*Div bleibt genau so gross wie inhalt*/
	background-image: url("bilder/transparent_schwarz_90.png");
	padding: 30px;
}

#top{	
	height: 50px;
}

#freie_energie{
	position: absolute;
	top: 20px;
	display:inline-block; /*Div bleibt genau so gross wie inhalt*/
	/*border: 1px solid red;*/
	/*border-top: 1px solid red;*/
	font-size: 1.8em;

}

#logo{
	background-image: url("bilder/logo/logo.png");
	width: 100px;
	height: 100px;
}

#hamburger{
	background-image: url("bilder/hamburger.png");
	width: 50px;
	height: 30px;
	background-size: contain;
	background-repeat: no-repeat;
	cursor: pointer;
	border: 1px solid red;
	/* z-index: 1000; */
}

#menu{
	position: absolute;
	top: 40px;
	left: 60px;
	visibility: hidden;
	display:inline-block; /*Div bleibt genau so gross wie inhalt*/
	/* cursor: pointer; */
	border: 1px solid red;
	padding: 5px 10px 5px 10px;
	background-image: url("bilder/transparent_schwarz_90.png");
	z-index: 10000;
}

.menuEintrag{
	text-decoration:underline;
	/* text-underline-offset: 0.2em; */
	padding: 3px 1px 3px 1px;
	cursor: pointer;
}

.menuEintrag:hover{
	color: greenyellow;
}



#loginBtn{
	display:inline-block; /*Div bleibt genau so gross wie inhalt*/
	position: absolute;
	top: 10px;
	right: 20px;
	cursor: pointer;
	border: 1px solid greenyellow;
	padding: 2px 3px 2px 3px;
}

#red_line{
	/*background-image: url("bilder/pinsel.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;*/
	width:100%;
	height:10px;
	/*border: 1px solid red;*/
}
#line{
	width:50%;
	height:5px;
	border: 1px solid red;
	position: relative;
	left: 25%;
	border-radius : 5px 0 5px 0; /* oben links, oben rechts, unten rechts, unten links */
}
#nav{
	height: 80px;
	/*border: 1px solid red;*/
	/*visibility: hidden;*/
	display: none;
}

#zierstreifen{
	/*border: 1px solid red;*/
	margin-bottom:40px;
	margin-top:30px;
	padding:20px;
	
	background-image: url("bilder/wald.jpg");
	background-repeat: no-repeat;
	background-position: center;
	/*background-size: contain;*/
	
	/*background-color: white;*/
}
#zierbild{
	max-height:300px;
	height:30vw;
	/*background-image: url("bilder/transparent_weiss_75.png");*/
	/*border-radius : 100px 100px 100px 100px;*/ /* oben links, oben rechts, unten rechts, unten links */
	/*border: 3px solid greenyellow;*/
}

.projekt_Header{
	width: 100%;
	/*border: 1px solid red;*/
}

#inhalt{
	position:absolute;
	top:97px;
	width:100%;
	/*border: 1px solid red;*/
}

.flex_inhalt{
	position:absolute;
   top: 0px;
   width: 100%;
   /*border: 1px solid red;*/
   display: flex; 
   justify-content: center; 
   align-items: center;
}
#titel_inhalt{
	color: greenyellow;
	display:inline-block;
	font-size: 1.5em;
	background-color:black;
	border: 1px solid red;
	padding:10px;
}
#info_inhalt{
	position:relative;
	width: 200px;
	left:0px;
	border: 1px solid red;
	background-image: url("bilder/transparent_schwarz_90.png");
}
.closeDiv{
	position:absolute;
	right:15px;
	top: 0px;
	cursor: pointer;
}
.closeImg{
	height: 50px;
}

#projekte{
	min-height: 300px;
	border: 1px solid red;
}
#titel_projekte{
	color: red;
	position: relative;
	font-size: 1.2em;
	top: -30px;
	left: 10px;
	display:inline-block; /*Div bleibt genau so gross wie inhalt*/
}

.karten_kontainer{
	 display: flex; /* or inline-flex */
    flex-wrap: wrap; /*nowrap | wrap | wrap-reverse*/
    justify-content: center;
    /*position: relative;*/
    /*top: 2px;*/
    /*height: 200px;*/
    /*border: 1px solid darkmagenta;*/
    /*border-radius : 50px 0 0 0;*/ /* oben links, oben rechts, unten rechts, unten links */
    /*padding: 10px;*/
}

.Karte{
	border: 1px solid grey;
   border-radius : 50px 0 0 0; /* oben links, oben rechts, unten rechts, unten links */
   margin: 10px;
   padding: 10px 10px 20px 10px; /* top right bottom left */
   cursor: pointer;
}
.Karte:hover {
	box-shadow: inset 2px 2px 5px white;
}

.kartenBild{
	border-radius : 50px 0 0 0; /* oben links, oben rechts, unten rechts, unten links */
}

.kartenTitel{
	font-size: 1.0em;
	color: grey;
	padding-top: 10px;
	padding-bottom: 10px;
}

.kartenText{
	padding-bottom: 20px;
	font-size: 0.8em;
	
}

.projekt_Header{
	display:inline-block; /*Div bleibt genau so gross wie inhalt*/
	/* border: 1px solid red; */

}

.projektInhalt{
	/* border: 1px solid red; */
}

.text{
	width: 50%;
	background-image: url("bilder/transparent_schwarz_90.png");
	padding: 30px;
	font-size: 1.1em;
	z-index: 10000;
	border: 1px solid red; 
}


#name{
    background-color: #c0a471;
    width: 25vw;
    height: 25px;
    padding-left: 10px;
    border: 1px solid greenyellow;
    border-radius : 12px 0 0 0; /* oben links, oben rechts, unten rechts, unten links */
}
#email{
    background-color: #c0a471;
    width: 25vw;
    height: 25px;
    padding-left: 10px;
    border: 1px solid greenyellow;
    border-radius : 12px 0 0 0; /* oben links, oben rechts, unten rechts, unten links */
}
#textAreaKontakt {
    background-color: #c0a471;
    width: 25vw;
    min-height: 200px;
    padding-left: 10px;
    border: 1px solid greenyellow;
    border-radius : 12px 0 0 0; /* oben links, oben rechts, unten rechts, unten links */
}
#answerKontaktMail{
	visibility; hidden;
}
.formButton{
    display:inline-block; /*Div bleibt genau so gross wie inhalt*/
    border: 1px solid greenyellow;
    width: 200px;
    text-align: center;
    border-radius : 3px 3px 3px 3px; /* oben links, oben rechts, unten rechts, unten links */
    cursor: pointer;
    transition: 1s background-color;
    background-color: green;
    font-family: Candara, Tahoma, Arial, sans-serif;
    padding: 10px;
}
.formButton:hover {
    background-color: blue;
}

#login{
	position: absolute;
	top: 35px;
	right: 62px;
	visibility: hidden;
	display:inline-block; /*Div bleibt genau so gross wie inhalt*/
	/* cursor: pointer; */
	border: 1px solid greenyellow;
	padding: 5px 10px 5px 10px;
	background-image: url("bilder/transparent_schwarz_90.png");	
	z-index: 10000;
}

.infoText{
	color: orange;
	font-size: 0.8em;
}

#usrform{
border: 1px solid red; 
}

.vorschau_bild{
	width: 30px;
}

.tableBorder {
	border: 1px solid red;
	padding: 5px;
}

.paddingLeft{
	padding-left: 30px;
}

.json_table {
	border: 1px solid red;
	color: black;
	
}
.json_table td{
	padding-left: 5px;
	padding-right: 5px;
}

.scrollY {
	overflow-y: auto;
}



#bottom_div {
	position: relative;
	bottom: 0px;
	height: 50px;
	border: 1px solid red;
	margin-top: 20px;
}
#impressum_bottom_div {
	display:inline-block;
	position: absolute;
	bottom: 0px;
	padding: 3px 10px 0 10px;
	border: 1px solid grey;
	border-radius : 12px 12px 0 0; /* oben links, oben rechts, unten rechts, unten links */
	cursor: pointer;
}
#impressum_bottom_div:hover {
	box-shadow: inset 2px 2px 5px white;
}
.space {
	height: 50px;
}
#orangeLink {
	color: orange;
}

.b_link{
	text-decoration:underline;
	/* text-underline-offset: 0.2em; */
	padding: 3px 1px 3px 1px;
	cursor: pointer;
	font-weight: normal;
}