/* --------------------------------- */
/* Body und alle Container-Divs */
/* --------------------------------- */

/* Globale Einstellungen (z.B. Schrift, Hintergrund, Breite) */
body
{
	background-image: url(/img/hpconsulting_ausgebleicht.png);
	background-repeat: repeat;
	font-family: Verdana, Tahoma, Arial;
	font-size: 10pt;
	color: #555555;
}

/* Alles umfassender Div */
div#main
{
	width: 800px;
	margin-left: auto;
	margin-right: auto;
}

/* Gemeinsamkeiten der obersten Container-Divs */
div#top, div#right, div#content, div#footer
{
	background-color: White;
	padding: 4px;
}

/* Spezielle Eigenschaften des Headers */
div#top
{
	width: 100%;
}

/* Hintergrundfarbe für den Titel */
div#top > div > div
{
	background-color: #000099;
	height: 106px;
}

div#top > div > div > *
{
	/*padding: 4px;*/
}

/* Spezielle Eigenschaften des dynamischen Inhalts-Divs */
div#content
{
	float: left;
	width: 800px;
	font-size: 10pt;
}

/* Hintergrundfarbe des Inhalts- und Footer-Divs */
div#content > div > div, div#footer > div > div
{
	background-color: #f7f7ff;
}

/* Zentrales Padding für jedes Kind-Element im Inhalts-Div */
div#content > div > div > *
{
	padding-left: 4px;
	padding-right: 4px;
}

/* Spezielle Eigenschaften der Fußzeile */
div#footer
{
	clear: both;
	width: 100%;
}

div#footer > div > div > *
{
	padding: 4px;
}


/* --------------------------------- */
/* Allgemeine Klassen */
/* --------------------------------- */

/* Element ohne Padding, Border oder Margin */
.nopbm
{
	padding: 0;
	border: 0;
	margin: 0;
}

/* Float-Eigenschaft auf Left oder Right */
.leftfloating
{
	float: left;
}
.rightfloating
{
	float: right;
}

/* Fett */
.bold
{
	font-weight: bold;
}

/* Tabelle ohne Margin, Border und Padding inkl. Elemente */
table.nopbm, table.nopbm tr, table.nopbm td
{
	padding: 0;
	border: 0;
	margin: 0;
}

.topaligned
{
	vertical-align: top;
}

.p
{
	margin-bottom: 10pt;
}

/* --------------------------------- */
/* Formatierungen */
/* --------------------------------- */

/* Normaler Absatz im Inhalts-Div */
div#content p
{
	font-size: 10pt;
}

/* Kurzbeschreibung/Überblick-Überschrift im Haupt-Inhalts-Div */
div#content > div > div > h1
{
	margin-top: 0px;
	font-weight: normal;
	font-style: italic;
	width: inherit;
	background-color: #ddddff;
	font-size: 10pt;
	padding-bottom: 10px;
	padding-top: 10px;
}

/* Oberste Unterteilungs-Überschrift (z.B. "Abwasser", "Flussbau", ...) */
div#content h3
{
	border-bottom: 1px solid #888888;
	margin-left: 4px;
	margin-right: 4px;
	clear: both;
}

/* Unterüberschrift von h3 */
div#content h4
{
	/*margin-bottom: -10px;*/
	font-weight: bold;
	font-size: 10pt;
}


/* --------------------------------- */
/* Schatten-Implementierung */
/* --------------------------------- */

/* Schatten für alle möglichen Block-Elemente */
.shadow
{
	float:left;
	background: url(/img/shadows/shadowAlpha.png) no-repeat bottom right !important;
	background: url(/img/shadows/shadow.gif) no-repeat bottom right;
}

.shadow > div
{
	background: none !important;
	background: url(/img/shadows/shadow2.gif) no-repeat left top;
}

.shadow > div > div
{
	background-color: White;
	border: 1px solid #a9a9a9;
	margin: -6px 6px 6px -6px !important;
	margin: 0;
}

/* Schatten für img-Elemente */
.img-shadow
{
	background: url(/img/shadows/shadowAlpha.png) no-repeat bottom right !important;
	background: url(/img/shadows/shadow.gif) no-repeat bottom right;
	/*margin: 10px 0 0 10px !important;
	margin: 10px 0 0 5px;*/
	padding: 4px 4px 4px 4px;
}

.img-shadow img
{
	display: block;
	position: relative;
	background-color: #fff;
	border: 1px solid #a9a9a9;
	margin: -6px 6px 6px -6px;
	padding: 4px;
}

ol.alphabracket,li {
    margin: 0;
    padding: 0;
}

ol.alphabracket {
    counter-reset: foo;
    display: table;
}

li {
    list-style: none;
    counter-increment: foo;
    display: table-row;
}

li::before {
    content: counter(foo, lower-alpha) ")";
    display: table-cell;
    text-align: right;
    padding-right: .3em;
    padding-left: 1em;
}