* {
    padding: 0;
    margin: 0;
}
html, body {
    font-family: arial, sans-serif;
    font-size: 100%;
}
body {
    background-color: lightblue;
    background-color: #ccd7da;
    background-color: silver;
    text-align: center;
/*    background-image: url(../bilder/hintergrund.png);*/
}
#wrapper {
    text-align: left;
    width: 800px;                                   /* Seitenbreite in Pixel*/
    margin: 0 auto;
    background-image: url(../bilder/hg-steuerung.jpg); /* Menü blau, Text weiß */
	border-left: black 1px solid;
	border-right: black 1px solid;
}
header{                                             /* Kopfbereich */
/*    background-color: deepskyblue;*/
    background-image: url(../bilder/Kopf_900_185.png);
    height: 185px;
}
header p {
    color: white;                                   /* */
    text-align: right;
    font-size: 2em;                                 /* relativ ... */
    font-weight: bold;                              /* Fette Schrift*/
    padding: 10px 40px 0 0;                         /* Abstand Umring */
	text-shadow: 1px 1px 1px black;                 /* Schrift mit Schatten versehen */
	opacity: 0.8;                                   /* Durchsichtige Schrift */
}
nav {
/*    background-color: orange;*/
    width: 234px;                                   /* Breite Navigationsleiste in Pixel*/
    float: left;
    margin-left: 30px;
}
nav ul{                                             /* Untermenü von Nav */
    list-style-type: none;    
	color: white;                                   /* Aufzählungszeichen (Quadrate) weiß angezeigen */
}
nav li {
	margin-top: 1em;                                /* Abstand zwischen den Menüpunkten vergrößern*/
}
nav ul ul {
/*	background-color: limegreen;*/
    list-style-type: square;                        /* Menüpunkte mit vorangestellten Quadrate*/
    padding-left: 1.5em;                            /* Menüpunktequadrate nach rechts einrücken */
    margin-bottom: 1em;
}
nav ul ul li:first-child {
/*	background-color: green;*/
	/* Gegenarbeiten zu nav li { margin-top: 1.3em; */
	margin-top: 0.4em;   
}
nav a {
/*	background-color: lightblue;*/
    color: white;                                   /* Schriftfarbe der Menüpunkte */
    text-decoration: none;                          /* Menüpunkte (Links) nicht unterstreichen */
    width: 100%;                                    /* Breite */
    display: inline-block;                          /* funktioniert nicht */
    line-height: 1.3em;                             /* Zeilenabstande */
	/*  sonst Breite nicht sinnvoll handelbar  */
	box-sizing: border-box;  
	/*  wird erst beim hervorheben der aktiven Zeile benötigt  */
	padding-left: 6px;    
	padding-right: 20px;
}
nav li.aktiv a {
	background-color: #7db0c6;
	/*	damit der Pfeil rechts nicht kommt */
	background-image:none;		 
	/*	keine Unterstreichung, dass es nicht nach Link aussieht */
	text-decoration: none;
	/*	Cursor normal, dass es nicht nach Link aussieht */
	cursor: default;             
}
nav a:hover{                                        /* Aktion bei Maus... */
    text-decoration: underline;                     /* Text unterstreichen*/
	background: url(../bilder/dreieck_weiss.gif) top right no-repeat; /* Weißer Pfeil*/	
}
article {
/*
    background-color: yellowgreen;
    background-color: #eff;
*/
    margin: 10px 20px 30px 290px;                   /* Rahmenbreite top right bottom left*/
}                                                   /*   article h1, ???*/
/*article h1,
article h2*/
/* Ersatz bzw Test article h1, article h2 */
h1{                                                 /* Gestaltung der 1. H1-Überschrift */
    color: cornflowerblue;                          /* Farbe der Überschrift */
}
h2{                                                 /* Gestaltung der H2-Überschrift */
    color: red;                                     /* Farbe der Überschrift */
}
/* ------------------------------------------------ */
{
    color: coral;
}
article p {                                         /* Gestaltung im Bereich ... */
    padding-bottom: 1em;                            /* ??? */
    line-height: 1.7em;                             /* Zeilenabstand */
}
figure {
	background-color: #eee;
	display: inline-block;
	padding: 10px;
	border: silver 1px solid;
	float: right;
	margin: 0.4em 0 0.4em 1em;
}
figcaption {
	font-size: 80%;
	text-align: center;
	font-style: italic;
}
.bildlinks {
	float: left;
	margin: 0.4em 1em 0.4em 0;
}
article ul {
    padding-left: 1.4em;
    line-height: 1.7em;
	margin-bottom: 2em;
	list-style-type: circle;
}
article ul ul {
	margin-bottom: 0em;
	list-style-type: square;
}
table {
	width: 100%;
    border: silver 1px solid;
    border-collapse: collapse;
	margin-bottom: 1em;
}
table thead {
    background-color: coral;
    color: white;
}
table th,
table td {
    padding: 4px 6px;
	border-right: white 1px solid;
}
tbody tr:nth-child(even) {background: #ccc}
tbody tr:nth-child(odd) {background: #fff}
th:last-child,
td:last-child { 
	border: silver 1px solid; 
}
tbody tr:hover {
	background-color: hsla(50, 20%, 50%, 0.6);
	cursor: default;
}
dl {
/*	background-color: yellow;*/
	margin-top: 1em;
	margin-bottom: 2em;
}
dt {
/*	background-color: orange;*/
	display: inline-block;
	float: left;
	font-weight: bold;
	max-width: 155px;
/*	color: coral;*/
}
dd {
/*	background-color: lime;*/
	margin-left: 160px;
	margin-bottom: 0.5em;
}
dl div {
/*	background-color: red;*/
	clear: both;
	margin-bottom: 1em;
	border: 0;
}
footer {
    background-color: black;                        /* Fußbereich schwarz */
	text-align: center;                             /* Text zentrieren */
    clear:both;
	line-height: 2em;
	color: silver;
	font-size: 80%;                                 /* Schriftgröße in Prozent */
}
footer a {
	color: silver;
	text-decoration: none;
}