body {
	display: flex;
	flex-flow: row wrap;
}
header, nav, article, section, aside, footer, p {
	border-radius: 0px 0.5em 0.5em 0.5em;
	border: 1px solid;
	padding: 10px;
	margin: 10px;
	flex: 1 100%;
}

.topic {
	border-radius: 0px 0.5em 0.5em 0.5em;
	border: 1px solid;
	padding: 10px;
	margin: 10px;
	flex: 1 100%;
}

.filter {
	background-color: #ebf5d7;
}

header {
	background: #F1F3F4;
	border-color: #d5d5d5;
}

nav {
	background: #fffbf0;
	border-color: #e7c157;
}
section {
	background: #F1F3F4;
	border-color: slateblue;
	display: flex;
	flex-direction: column;		/* Festlegumg der Hauptachse */
	justify-content: center; 	/* legt fest, wie Flex-Items entlang der Hauptachse angeordnet werden */
  	align-content: center;   	/* legt fest, wie Flex-Items entlang der Querachse angeordnet werden , dabei Größe = zur Verfügung stehender Platz */
 	/* align-items: center;     legt fest, wie Flex-Items entlang der Querachse angeordnet werden, dabei Größe = Inhalt */
}
article {
	flex: 3;
	background: #ffede0;
	border-color: #df6c20;
}
aside {
	flex: 1;
	background: #ebf5d7;
	border-color: #8db243;
}
footer {
	background: #e4ebf2;
	border-color: #8a9da8;
}


