html{
	background: linear-gradient(to bottom right, #E6BE59, #DCBF74 50%, #f0d590);
}

body{
	/*Darstellungsart*/
	display: grid;
	/*Höhe der Reihen und die Anzahl*/
	grid-template-rows: minmax(5em, auto) minmax(2.5em, auto) minmax(30em, auto) 2.5em;
	/*Breite der Spalten und die Anzahl*/
	grid-template-columns: 25% 25% 25% 25%;
	/*Bezeichnung der einzelnen Bereiche, also das Layout*/
	grid-template-areas:	"header header header header"
							". nav nav ."
							"content content content content"
							". footer footer .";
	background-image: url("../bilder/kreuz.svg");
	background-repeat: space;
	background-size: 10% auto;
	background-position: center;
}

header{
	display: flex;
	flex-direction: column;
	grid-area: header;
	padding: 0.75em;
	justify-content: left;
	align-content: center;
	font-size: 2.5em;
}
header p{
    /*Schriftgröße, horizontale und vertikale Ausrichtung*/
    font-size: 0.5em;
    text-align: center;
}

nav{
	display: flex;
	flex-flow: row wrap;
	grid-area: nav;
	justify-content: space-around;
}
.nav_btn{
	display: flex;
	height: 40px;
	width: 80px;
	font-size: 0.75em;
	padding: .25em;
 	margin: 0.6em;
	align-items: center;
	justify-content: center;
	border-top: #FAEBD7 solid 0.2em;
	border-bottom: #FAEBD7 solid 0.2em;
	border-radius: 35%;
	transform: rotate(-10deg);
}
.nav_btn h1{
	color: #E0FFFF;
}
nav a :hover{
	color: black;
	transform: rotate(0deg);
}

content{
	display: flex;
	flex-direction: column;
	grid-area: content;
	width: 90%;
	justify-self: center;
	align-content: space-around;
	justify-content: start;
	margin-top: 0.75em;
}
content p{
    text-align: justify;
}

footer{
	display: flex;
	flex-flow: row wrap;
	grid-area: footer;
	justify-content: space-around;
    margin-top: 0.75em;
}
.footer_btn{
	display: flex;
	font-size: 0.5em;
	align-items: center;
	justify-content: center;
    margin: 0.6em;
	border-top: #FAEBD7 solid 0.2em;
	border-bottom: #FAEBD7 solid 0.2em;
	border-radius: 35%;
	transform: rotate(-10deg);
}
.footer_btn h1{
	color: #556B2F;
}
footer a :hover{
	background-color: rgb(247, 199, 67);
	color: black;
	transform: rotate(0deg);
}

h1{
	color: #8B4513;
}

h2{
	color: #8B4513;
}

a:link, a:visited, a:hover{
	text-decoration-line: none;
	color: rgb(236, 95, 7);
}

content a :hover{
	background-color: rgb(247, 199, 67);
	color: black;
}

.Zitat{
    display: flex;
    flex-direction: row;
    text-align: center;
    margin: 0 auto;
    justify-content: center;
    color: #8B4513;
    font-size: large;
}

.logos{
    display: flex;
    flex-direction: row;
    text-align: center;
	flex-wrap: wrap;
    margin-top: 0.15em;
    margin-bottom: 0.15em;
    padding-top: 0.15em;
    padding-bottom: 0.15em;
    justify-content: center;
    background-color: white;
    font-size: large;
}