@charset "utf-8";
/* CSS Document */

/*ELEMENTE*/


a {
	/*Layout:*/
	
	/*Schrift:*/
		color: white;
		text-decoration: none;
}


body {
	/*Größe:*/
		height: 98vh;
		width: 100vw;
		overflow: hidden;
	
	/*Layout:*/
		background-color: white;
		display: grid;
			grid-template-columns: 1fr 18fr;
	
	/*Schrift:*/
		font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
}


figcaption {
	/*Text:*/
		font-size: 80%;
		font-weight: bold;
		text-align: center;
}


h1 {
	/*Größe:*/
		width: 90%;
	
	/*Layout:*/
		background-color: #353A3F;
		float: right;
		padding-left: 4vw;
	
	/*Schrift:*/
		color: white;
	
}


/* KLASSEN */


.Bild_links{
	/*Größe:*/
		width: 25vw;
	
	/*Layout:*/
		padding: 1vw;
	
	/*Positionierung:*/
		float: left;
}


.Bild_rechts{
	/*Größe:*/
		width: 25vw;
	
	/*Layout:*/
		padding: 1vw;
	
	/*Positionierung:*/
		float: right;
}



.Infokasten {
	/*Größe:*/
		width: 20vw;
	
	/*Layout:*/
		background-color: powderblue;
		/*background-color: burlywood;*/
		border: solid medium #353A3F;
	
	/*Position:*/
		float: right;
		margin-left: 20px;
		margin-right: 20px;
}


.menu{
	/*Layout:*/
		display: none;
		padding-left: 10px;
		z-index: 10;
		
	/*Schrift:*/
		color: white;
}


.menu_item {
	/*Schrift:*/
		font-weight: bold;
	
	/*Sonstige:*/
		cursor: pointer;
}


.menu_subitem {
	/*Sonstige:*/
		cursor: pointer;
}


.Navbutton {
	/*Größe:*/
		height: 100%;
		width: 100%;
	
	/*Sonstiges*/
		cursor: pointer;
	
	/*Text:*/
		font-weight: bold;
		vertical-align: middle;
}

/*******/
/* IDs */
/*******/


#bottomline {
	/*Layout:*/
		background-color: #353A3F;
	
	/*Position:*/
		position: absolute;
			bottom: 0;
			right: 0;
	
	/*Schrift:*/
		color: white;
}


#ThemenNavbar {
	/*Größe:*/
	
	/*Layout:*/
		background-color: floralwhite;
	
	/*Position:*/
		position: sticky;
			top: 0;
}


#Themennavigation{
	
	/*Größe:*/
		width: 90%;
	
	/*Layout:*/
		background-color: #353A3F;
		border-bottom: red solid medium;
		boder-left: red solid medium;
		display: grid; 
		grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
		padding-left: 1rem;
	
	/*Position*/
		position: sticky;
			top: 5px;
	
	/*Schrift:*/
		color: white;
		font-size: 80%;
}


#unterrand {
	/*Größe:*/
		height: 20vh;
		width: 80vw;
	
	/*Layout:*/
		background-color: #353A3F;
			opacity: 0.8;
	
	/*Position:*/
		position: absolute;
			bottom: 5vh;
			right: 0;
			
	/*Schrift*/
}



@media screen and (max-width: 1400px){
	
	.Bild_links {
		/*Größe:*/
			width: 40vw;
	}
	
	
	.Bild_rechts {
		/*Größe:*/
			width: 40vw;
	}
	
	
	.Navbutton {
		/*Größe:*/
			min-height: 2rem;
		
		/*Text:*/
			font-size: 1.2rem;
	}
	

	#Themennavigation{
		/*Layout:*/
			display: grid;
			grid-template-columns: 1fr 1fr 1fr 1fr;
	}
}


@media screen and (max-width: 700px){
	
	body {
		/*Layout:*/
			grid-template-columns: 1fr 9fr;
	}
	
	.Bild_links {
		/*Größe:*/
			width: 80%;

		/*Layout:*/
			display: block;
			padding-bottom: 2vh;
	}	
	
	
	.Bild_rechts {
		/*Größe:*/
			width: 80%;

		/*Layout:*/
			display: block;
			padding-bottom: 2vh;
	}		
	
	.Navbutton {
		/*Größe:*/
			min-height: 2rem;
		
		/*Layout:*/
			border-bottom: solid medium red;
			vertical-align: middle;
		
		/*Text:*/
			font-size: 1.2rem;
	}
	

	#Themennavigation{
		/*Layout:*/
			display: grid;
				grid-template-columns: 1fr 1fr;
	}
}


@media screen and (max-height: 700px){
	
	.Navbutton{
		/*Layout:*/
			font-size: 2rem;
	}
}


@media screen and (max-height: 700px){
	
	#ThemenNavbar{
		/*Layout:*/
			border-bottom: solid medium #353A3F;
	}
	
	#Themennavigation{
		/*Layout:*/
			border: none;
	}
	
	.Navbutton{
		/*Layout:*/
			border: none;
			display: none;
	}
}



th {
	/*Layout:*/
		background-color: #353A3F;
	
	/*Text*/
		color: white;
}

table {
	/*Text:*/
		font-size: 90%;
	
	/*Layout:*/
		border: solid thin #353A3F;
}

.Tabellenspalte_links {
	/*Layout:*/
		background-color: floralwhite;
	
	/*Text:*/
		font-weight: bold;
}

td {
	/*Layout:*/
		border-bottom: solid thin #353A3F;
		padding: 5px;
}

.Tabelle_rechts {
	/*Größe:*/
		width: 50%;
	
	/*Layout:*/
		padding: 10px;
			padding-left: 20px;
	
	/*Positionierung:*/
		float: right;
}
