body {
	margin: 0;
	padding: 0;
	min-height: 100vh;
	/* Das Grund-Beige vom Pergament */
	
	/* Der Regenbogen-Verlauf kombiniert mit der Struktur */
	background-image: 
		/* Regenbogen von unten rechts (315 Grad) nach oben links mit 25% Deckkraft */
		linear-gradient(315deg, 
			rgba(255, 0, 0, 0.25) 0%, 
			rgba(255, 127, 0, 0.25) 15%, 
			rgba(255, 255, 0, 0.25) 30%, 
			rgba(0, 255, 0, 0.25) 45%, 
			rgba(0, 0, 255, 0.25) 60%, 
			rgba(75, 0, 130, 0.25) 75%, 
			rgba(148, 0, 211, 0.25) 100%
		),
		/* Deine originalen Pergament-Schattierungen & Körnung */
		radial-gradient(circle at 50% 50%, rgba(255,255,255,0.1) 0%, rgba(0,0,0,0.05) 100%),
		radial-gradient(circle at 20% 30%, #e2c08d 0%, transparent 20%),
		radial-gradient(circle at 80% 70%, #d8b078 0%, transparent 30%),
		radial-gradient(circle at 30% 80%, #e8c99b 0%, transparent 25%),
		url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
	
	background-blend-mode: multiply;
	font-family: 'Georgia', serif;
	color: black;
	line-height: 1.3;
}

/* Behoben: Fehlerhafte CSS-Eigenschaften dem Body oder Containern korrekt zugewiesen */
.content {
	max-width: 800px;
	margin: 50px auto;
	padding: 40px;
	background: rgba(255, 255, 255, 0.2);
	box-shadow: 0 0 20px rgba(0,0,0,0.1);
	border-radius: 5px;
}

h1 {
	font-size: 3em;
	font-weight: 900;
	text-align: center;
	padding: 0;
	margin: 0;
}

h2 {
	font-size: 1.5em; /* Behoben: Komma zu Punkt geändert */
	font-weight: 900;	
	margin: 0;
}

header {
	text-align: center;
	height: 140px;
	border-bottom: 5px solid black;
}

/* Präziserer Selektor für die obere Navigation */
.top-nav {
	margin-top: 10px;
}

.top-nav a {
	color: black;
	display: inline-block;
	text-decoration: none;
	margin: 0 20px; /* Symmetrischerer Abstand statt nur links */
	font-size: 1.5em;
	font-weight: bold;
}

/* Unterstreichung für aktive oder betonte Links via CSS statt <u>-Tag */

header a.side-nav {
	font-weight: bold;
}

header a.aktuell {
	font-weight: bold;
}


main {
	width: 100%;
	height: 750px;
	margin: auto;
	display: flex;
}

aside {
	width: 30%;
	height: 750px;
	border-right: 5px solid black;
	overflow-y: auto; /* 'auto' zeigt Scrollbalken nur an, wenn nötig */
}

.side-nav ul {
	margin: 0;
	padding: 1em;
	list-style: none;
}

.side-nav li {
	margin-bottom: 0.8em;
}

.side-nav a {
	color: black;
	text-decoration: none;
	font-size: 1.2em;
	display: block;
}

a:hover {
	color: white;
}

section {
	width: 70%;
	height: 750px;
	color: black;
	overflow-y: auto;
}

section h2 {
	text-decoration: underline;
	padding: 1em 0 0 1em;
}

p {
	margin-top: 0;
	padding: 1em;
	font-size: 1.2em; /* 1.5em war extrem groß für Fließtext, leicht angepasst */
	font-weight: normal; /* Normaler Text liest sich flüssiger als 900er-Fettung */
}

footer {
	border-top: 5px solid black;
	padding: 1em;
	margin-top: 1em;
	font-size: 90%;
	text-align: center;
}