/*  body  */
body {
	display:grid;
	grid-template-columns:1fr;
	grid-template-rows:100px 60px auto 70px;
	gap:8px;
}

header {
	grid-column:1/2;
	grid-row:1/2;
}

nav {
	grid-column:1/2;
	grid-row:2/3;
}

main {
	grid-column:1/2;
	grid-row:3/4;
}

footer {
	grid-column:1/2;
	grid-row:4/5;
}


/*  footer  */
footer {
	display:grid;
	grid-template-columns: 1fr 1fr;
}

.div1_footer {
	margin:auto;
	column:1/2;
}

.div2_footer {
	margin:auto;
	column:2/3;
}

/*  Aufgaben beginnen hier!  */

.main {
	display:grid;
	grid-template-columns:1fr 1fr;
	grid-template-rows:auto auto;	
	padding:10px;
}

.bild1 {
	margin:8px;
	display:grid;
	background:#fff;
	grid-column:1/2;
	grid-row:1/2;
	border:3px solid white;
	padding:10px;
	border-radius: 1rem 1rem 1rem 1rem;
}

.bild2 {
	display:grid;
	background:#fff;
	grid-column:2/3;
	grid-row:1/2;
	border:3px solid white;
	margin:8px;
	padding:10px;
	border-radius: 1rem 1rem 1rem 1rem;
}

.bild3 {
	margin:8px;
	display:grid;
	background:#fff;
	grid-column:1/2;
	grid-row:2/3;
	border:3px solid white;
	padding:10px;
	border-radius: 1rem 1rem 1rem 1rem;
}

.bild4 {
	display:grid;
	background:#fff;
	grid-column:2/3;
	grid-row:2/3;
	border:3px solid white;
	margin:8px;
	padding:10px;
	border-radius: 1rem 1rem 1rem 1rem;
}

.bild1 img {
	max-height:95%;
	margin:auto;
}

.bild2 img {
	max-height:95%;
	margin:auto;	
}

.bild3 img {
	max-height:95%;
	margin:auto;
}

.bild4 img {
	height:95%;
	margin:auto;	
}


@media (max-width: 80em) {


.main {
	display:grid;
	grid-template-columns:1fr;
	grid-template-rows:auto auto auto auto;	
	padding:10px;
}

.bild1 {
	margin:8px;
	display:grid;
	background:#b300b8;
	grid-column:1/2;
	grid-row:1/2;
	border:5px solid white;
	padding:10px;
	border-radius: 1rem 1rem 1rem 1rem;
}

.bild2 {
	display:grid;
	background:#b300b8;
	grid-column:1/2;
	grid-row:2/3;
	border:5px solid white;
	margin:8px;
	padding:10px;
	border-radius: 1rem 1rem 1rem 1rem;
}

.bild3 {
	margin:8px;
	display:grid;
	background:#b300b8;
	grid-column:1/2;
	grid-row:3/4;
	border:5px solid white;
	padding:10px;
	border-radius: 1rem 1rem 1rem 1rem;
}

.bild4 {
	display:grid;
	background:#b300b8;
	grid-column:1/2;
	grid-row:4/5;
	border:5px solid white;
	margin:8px;
	padding:10px;
	border-radius: 1rem 1rem 1rem 1rem;
}
	
}