div#bereichzentrum { float:left; text-align:left; width:86%; margin-top:90px; padding: 0; color:#000000; background:#FFFFFF /*url(../../../bilder/HGErklaerung1.jpg) no-repeat right top*//* Farbe artikelcontainer */; }
div#scharfmacher, div#erklaerung, div#sicherheit, div#ertrag, div#flexibilitaet, div#artikel, div#mehrere, div#einzelnes, #bereichunten {padding: 0 3px 3px 1em;margin: 0;}
body { font:x-small "Verdana", sans-serif; margin:0; padding:0; background:#F3F3D8;/*Farbe Hintergrund Werberahmen*/ }
div#seite { font-size:120%; width:100%; padding:0; }

/* allgemeingültig */
a, a strong {text-decoration: none;color: #191971;background: none;}
a:focus {border: 1px dotted black;}
a:hover {text-decoration: underline;}
a:active {background: #CCD0FF;}
img {margin: 0; padding: 0; border: none;}
p {font-size: 100%;margin: 0 0 .6em 0;line-height: 1.4em;}
em {font-style:normal;background-color: #F2F2F2/*#FFFFB2*/;} /* Textmarkierer */
.basis em {background: #E3E3B5/*#E8E8C9;*/} /* Textmarkierer im Basiskasten */
.beispiel em {background: #E6E699;} /* Textmarkierer im Beispielkasten */
strong, a.weiter {font-weight: bold;}
cite {font-weight: normal;}
dfn, dfn>strong {font-style:normal; cursor: help;color: #008000;} /* Definitionen */
dfn:hover {border-bottom: 1px dotted;}
h1, h2, h3, h6, caption {font-family: "Trebuchet MS", "Tahoma", sans-serif;}
h1, h2, h3, h4, h5, h6, caption {line-height: 1.2em; text-align:left; font-weight:bold; margin:0; padding: .7em 0 .4em 0; }
h1 {font-size: 148%;clear:left; margin-bottom:.2em; }/* für die Hauptüberschrift(en) */
h1 span.dachzeile {display:block; font-size:73%; padding:0; }
h2 {font-size: 108%;clear:left; padding:1em 0 0 0; margin-bottom:-.5em; }
h2 span.rechts span {font-weight: normal;margin-left:.3em;} /* für Seitenzahl */
div.tkopf h2, h3, caption {font-size: 124%;}/* für Zwischenüberschriften */
h4 {font-size: 116%;clear: left;}
h5 {font-size: 100%;}
h6 {font-size: 92%;padding: 0 0 .3em 0;margin:0;} /* für Kastenüberschrift */
.links {float:left}
span.rechts {display:block; text-align:right;}
.anmerkung, a.weiter {font-size: 79%;} /* für Anmerkungen u. ä. */
span.nachkomma {font-size: 85%;}
span.minuten {font-size: 79%;vertical-align:top;padding-left:.2em;text-decoration:underline;}
span.dezent, .menu .rechts {color: #AAAAAA} /* dezente Dachzeilenergänzung deaktive Menü-Verweise */
.nichtzeigen {display:none;}/* Bindestrich zwischen Überschriftshälften und : bei Uhrzeiten verschwinden*/
h1 + p, h1 + div + p, h1 + div + div + p {font-weight:bold} /* Einleitungsabsatz (Lead) in Artikel auch neben Beispielkasten und Bild wird fett */

/* Listen */
ul, ol {line-height: 1.3em;margin: 0 0 .5em 0;padding: 0;}
ul {list-style-type: square;}
p + ul, p + ol {margin-top: -.3em;} /* Listenpunkt rückt näher an vorhergehenden Absatz */
ul li {margin: 0 0 .3em 1.2em;padding:0;}
ol li {margin: 0 0 .3em 2em;padding:0; }
li>span {font-weight:normal;color: #000000;}/* Farbe Listenpunkte überfärben */
/* Notwendige Zusätze für Listen neben floatendem Bild */
div#bereichzentrum>div ul, div#bereichzentrum>div>ol {overflow:hidden;} /* html>body ul {overflow:auto;} für ff, ie7 u.a. moderne Browser */
* html ul {height:1em;} /* für ie6 */

/* Anzeigen */
div#bereichoben { position:absolute; top:0px; left:0px; height:90px; width:86%; padding:0; overflow:visible; }
div#bereichoben div div>img {display:none;}/*temporär, damit in anlageideen anzeigen-gif nicht mehr stört*/
div#bereichoben div a:focus {border: none;}
div#bereichoben div { width: 728px; height:90px; margin:0 auto; } /* Bigsize & Skyscaper */
div#bereichrechts { position:absolute; top:90px; left:0px; width:14%; margin-left:86%; overflow:hidden; } /* Bigsize & Skyscaper */
/*div#bereichoben div { width:728px; height:90px; float:right; } /* Wallpaper */
/*div#bereichrechts { position:absolute; top:0px; left:0px; width:14%; margin-left:86%; overflow:hidden; } /* Wallpaper */

/* Beispiel-, Basiskasten, Besondersabsatz */
div#erklaerung>p, div#sicherheit>p, div#ertrag>p, div#flexibilitaet>p, #artikel>p,
div#erklaerung h1, div#sicherheit h1, div#ertrag h1, div#flexibilitaet h1, div#artikel h1, div#mehrere h1, div#einzelnes h1, 
div#erklaerung h2, div#sicherheit h2, div#ertrag h2, div#flexibilitaet h2, div#artikel h2, 
div#erklaerung h3, div#sicherheit h3, div#ertrag h3, div#flexibilitaet h3, div#artikel h3, div#mehrere h3, div#einzelnes h3, 
h5,
div#erklaerung>ul, div#sicherheit>ul, div#ertrag>ul, div#flexibilitaet>ul, #artikel>ul, 
div#flexibilitaet>div.tipp>ul,
/*temp*/#artikel>div.tipp>ul,
div.basis, 
#artikel div.raster, div#mehrere div.raster, div#einzelnes div.raster  {text-align: justify;margin-right: 12%;}
div.beispiel {clear: right;float: right;width: 38%;margin-bottom: 3px;}
div.beispiel div.raeumen  {margin: .2em 0 0 1em;padding: 0 .3em 0 .5em;}
div.beispiel div.navi {margin: .2em 0 0 1em;}
div.beispiel div.raeumen>p:last-child, table.mini tr:last-child p {margin-bottom: .2em;} /* Verkürzung des letzten Absatzes */
div.basis {padding: .5em .7em .1em .7em;margin-bottom:.5em;}
p.basis {padding: .5em .7em;}
p.besonders {padding:.5em .7em;} /* Besondersabsatz (Absatzstil bei Speziellem für Fortgeschrittene) */

/* Bilder */
div.bild {width: 61.99%;margin-bottom: .5em;overflow:hidden;}
div.rahmen_kurse div.beispiel + table.kurse {width: 61.99%;margin-bottom: .5em;overflow:hidden;} /* Kurstabelle wird wie Bild formatiert */
* html div.bild, * html div#einzelnes div.rahmen_kurse table.kurse {width: 60.5%;} /* Korrektur für ie 6 */
* html div#einzelnes div.rahmen_kurse div.beispiel table.kurse {width: auto;} /* Korrektur für ie 6 */
div.bild div {margin: 0 -10%;}
div.bild div img, div.bild p.bu {display:block;width:100%;margin: 0 auto;} /* display:block/vertical-align:bottom wg Vermeidung der Bild-Unterlängen bei FF */
div.bildchenlinks {float:left; margin: .3em .7em 0 0;}
div.bildchenlinks img {display:block;background: #F2F2F2;} /* display:block damit ff auf Schriftunterlänge verzichtet */ 
div.bildchenlinks + .tipp {margin-left:32px;padding-left:.7em;}
p.bu {position: relative;font-size: 79%;margin: 0;}/* für Bildunterschriften u. ä. */
.bu dfn.bildrechte {color: #AAAAAA;position: absolute; right:0px;} /* Bildquellenhinweis */

/* Seitenfuß */
#bereichunten {clear:both;text-align: center;font-size: 85%;}
#fussnote {display:none;}

/* Textfluss wiederherstellen */
.raeumen:after {content: ".";display: block;clear: both;visibility: hidden;line-height: 0;height: 0;}
.raeumen {display: inline-block;}
html[xmlns] .raeumen {display: block;}
* html .raeumen {height: 1%;}

/* Wertpapiertabellenumfeld */
div.rahmen_kurse {clear:left;width:100%} /* vor Kursen: bildet klare Abschnitte */
div.rahmen_kurse table.kurse {width: 100%;float: left;/* float braucht firefox, damit Tabelle gleich auf 1. Blatt anfängt */} /* Kurstabelle wird ähnlich p formatiert */ 
div.h {clear:left;float:left;}

/* Tabelle */
table {border-collapse: collapse;}
table tfoot tr td {text-align: right;font-size: 79%;vertical-align: top;} /* Tabellenfuß */
div.navi {border-bottom: 1px solid transparent;} /* braucht ie7 damit Nachfolgendes beim hovern nicht springt */
div.navi table.mini, div.navi table caption {float:right;color: #A39129;font-size:92%;}
div.navi table.mini thead tr th {text-align:left;padding: 0 .3em 1px .3em;} /* Kopf Zellen in Navigation */
div.navi table.mini tr td {background: #F3F3D8;padding: 0 .3em 1px .3em;} /* Body Zellen in Navigation */
div.navi table.mini thead tr th:first-child, div.navi table.mini tbody tr td:first-child {padding-left:.5em;} /* 1. Spalte in Navigation */
div.navi table.mini tbody tr td a:hover {text-decoration: none;}
div.navi table.mini tbody tr td.erstklassige span.angeklickt span, div.navi table.mini tbody tr td.erstklassige a:hover span {border-bottom: 1px solid #00A800;}
div.navi table.mini tbody tr td.mittelklassige span.angeklickt span, div.navi table.mini tbody tr td.mittelklassige a:hover span {border-bottom: 1px solid #E6C300;}
div.navi table.mini tbody tr td.hochzins span.angeklickt span, div.navi table.mini tbody tr td.hochzins a:hover span {border-bottom: 1px solid #A80000;}

table.kurse {margin-bottom: 3px;}
table.kurse thead tr.tdachzeile th {text-align: center;font-weight: bold;color: #4D4419;} /* Dachzeilen für Spalten(gruppen) */
table.kurse tfoot tr td {border-top: 2px solid #A39129;} /* Tabellenfußlinie Mehrere */
div#mehrere table.kurse thead.haupt tr.oberzeile th {border-bottom: 2px solid #A39129;} /* Tabellenkopflinie Mehrere */
div#einzelnes table.kurse thead tr.unterzeile th {border-bottom: 2px solid #A39129;} /* Tabellenkopflinie Einzelansicht */
div#einzelnes div.beispiel table.kurse thead tr.kopf th {border-top: 2px solid #A39129;} /* Tabellenkopflinie Einzelansicht Beispiel */
div#mehrere table.kurse thead.haupt tr.unterzeile th {border-bottom: 1px solid #4D4419;} /* Tabellenkopf Mehrere */
div#einzelnes table.kurse thead tr.kopf th {border-bottom: 1px solid #4D4419;} /* Tabellenkopf Einzelansicht */
div#einzelnes h5 {background: #F3F3D8;} /* Tabellenkopf Einzelansicht Konditionen */
table.kurse thead.haupt tr.unterzeile th.sortiert1k {color: #000000; background: #FFFFFF url(../../../bilder/abwaerts.jpg) no-repeat -22px -32px;} /* Tabellenkopf sortiert kleiner Wert */
table.kurse thead.haupt tr.unterzeile th.sortiert1g {color: #000000; background: #FFFFFF url(../../../bilder/aufwaerts.jpg) no-repeat -22px -6px;} /* Tabellenkopf sortiert großer Wert */
table.kurse thead.haupt tr th a span {visibility:hidden;} /* Sortiermarker */
table.kurse thead.haupt tr th a:hover span {visibility:visible;color: #191971;text-decoration: none;} /* Sortiermarker */
table.kurse tbody {background: #EBEBBD;} /* Zebrastreifen ungerade */
table.kurse tbody.zweitgruppe tr td {background: #FFFFFF;} /* Zebrastreifen gerade */
table.kurse tbody.haupt tr.haupt td {font-size:132%;}

table.kurse tbody tr td.guthaben {width:40%;} /* für weitere Kurse wichtig, sonst ist die Spalte zu schmal für floatende spans */

table.kurse tr.unterzeile, table.kurse tr.oberzeile {font-size: 79%;} /* Nebenzeilen */
table.kurse thead tr th, table.kurse tr td {border-left: 3px solid #FFFFFF;vertical-align: top; } /* alle Zellen: Spaltenlinien, Textausrichtung */
table.kurse thead tr th:first-child, table.kurse tr td:first-child {border-left: none} /* keine erste Spaltenlinie */
table.kurse tr.unterzeile th, table.kurse tr.unterzeile td {text-align: right;}
table.kurse tr.normalzeile td.preis span.tbreitepreis {display:block; max-width:8.6em; text-align:right;} /* rechtsbündiger Preis in linksbündiger Spalte */
table.kurse tr.normalzeile td.stueckpreis span.tbreitestueckpreis {display:block; max-width:6em; text-align:right;} /* rechtsbündiger Stückpreis in linksbündiger Spalte */
table.kurse tbody tr.neuerabschnitt td {border-top: 1px solid #4D4419;} /* Anfang neuer Abschnitt */
table.kurse tr th.zeit, table.kurse tr th.guthaben, table.kurse tr th.ertrag {text-align: center;}
table.kurse tr .guthaben {text-align: right;} /* tabelle ein zinspapier */
table.kurse tr .ertrag {text-align: right;} /* tabelle ein zinspapier */
table.kurse thead.haupt tr.bildzeile th {overflow:hidden;} /* wie große Bilder */
table.kurse thead.haupt tr.bildzeile th div {margin:0 -80px;} /* wie große Bilder */
div.drunter img, div.dazwischen img, div.drueber img {vertical-align:bottom;} /* display:block/vertical-align:bottom wg Vermeidung der Bild-Unterlängen bei FF */
table.kurse thead.haupt tr.bildzeile th div div.drunter, table.kurse thead.haupt tr.bildzeile th div div.dazwischen {margin-bottom:-130px;} /* unterlegte Bilder */
table.kurse thead.haupt tr.unterzeile th, table.kurse thead.haupt tr.oberzeile th {font-weight: normal;}
div.beispiel table.kurse tbody tr.neuerabschnitt + tr.normalzeile td.ertrag strong {border-bottom:3px double #4D4419;} /* Beispieltabelle ein zinspapier */
div.beispiel table.kurse tbody tr.normalzeile td.zeit {vertical-align: top;} /* Tabellen-Zahlen-Zellen */
div.beispiel table.kurse tbody tr.normalzeile td.guthaben, div.beispiel table.kurse tbody tr.normalzeile td.ertrag {vertical-align: bottom;} /* Tabellen-Zahlen-Zellen */

/* Tabelle: Festzins-Zinspapier-Navigation, Zinspapier-Auswahl, Impressum, Zinspapier-Bedingungen */
div.raster table.mini thead tr th, div.raster table.mini tr td {padding: 1px .3em 0 .5em;} /* alle Zellen in Zeile eingepaßt */
div.raster table.mini thead tr th {background: #F3F3D8;line-height:1.8em;} /* Tabellenkopf in Zeile eingepaßt */
div.raster table.mini thead tr th:first-child, div.raster table.mini tbody tr td:first-child {text-align:right;color: #4D4419;background: #F3F3D8;width:15%;padding-left:0;font-weight: bold;} /* 1. Spalte in Zeile eingepaßt */
div.raster h2 {text-align:center;padding: .1em 0 .1em 15%;}/* für rasterüberschriften */

/* Formulare */
form {margin:0;}
form table.mini tbody tr td div input[type=submit] {padding: 0 10px;}
label, label dfn {cursor:pointer;color: #191971;background: #F3F3D8;text-decoration:none;}
form div.knopf {text-align:center;}
form table.mini tbody tr td div.links {background: #F3F3D8;margin:0 .7em .1em 0;}
form table.mini tbody tr td div.links input {float:left;cursor:pointer;margin:.7em .3em;}
form table.mini tbody:first-child {display:none;}
* html form table.mini tbody tr td div.links input, *:first-child+html form table.mini tbody tr td div.links input {float:left;margin:.7em 0;} /* damit auch bis ie6 und ie7 bei checkboxen keinen linken Abstand darstellt */
form table.mini tbody tr td div.links p {float:left;padding:0;}

/* Zinspapier-Konditionen */
div.raster table.mini tbody tr td {padding-top: .3em;vertical-align: top;}
div.raster table.konditionen tbody tr td.klassisches {text-align:left;width:5%;} /* Text zentriert */
div.raster table.konditionen tbody tr td.klassisches img {margin:-3px 0;}
div.raster table.konditionen {background: #F3F3D8 url(../../../bilder/hg-konditionen.gif) center center no-repeat;}
div.raster table.konditionen tfoot {background: #F3F3D8;}

/* Div-Tabelle: (Rubrik)raster */
div.raster {clear:both;margin-bottom: .7em;}
div.raster div.tkopf {padding: 0;margin-bottom:3px;border-top: 1px solid #E2E28D;}
div.raster div.tfuss {clear:both;text-align:right;border-bottom: 1px solid #E2E28D;}
div.raster div.tfuss p {font-size: 85%;margin: 0;}
div.raster div.zeile {float:left;width:100%;padding-bottom:0;margin-bottom:3px;}
* html div.raster div.zeile, *:first-child+html div.raster div.zeile {margin-bottom:0px;} /* damit auch bis ie6 und ie7 bei einzeiligen rastern nur 3px margin-bottom darstellt */
div.raster div.zeile div.spalte1 {width: 20%;float:right;}
div.raster div.zeile div.spalte2 {width: 45%;float:right;overflow:hidden;margin-left:-5px;/* damit ie nachfolgende Container nicht umbricht */}
div.raster div.zeile div.spalte3 {width: 35%;float:left;overflow:hidden;}
div.raster div.zeile div.spalte4 {width: 35%;clear:left;float:left;overflow:hidden;}
div.raster div.zeile div.spalte3>div {margin: 0 .7em 0 0;padding:0;}
div.raster div.zeile div.spalte4>div {margin: 0 .7em 0 0;padding:0 0 .3em 0;}
div.raster div.zeile div.spalte2>div {margin: 0 0 .3em 0;padding:0 .7em 0 .7em;border-left: 1px solid #E2E28D;border-right: 1px solid #E2E28D;} /* Mittelspalte mit rasterränder */
div.raster div.zeile div.spalte1>div {margin: 0 0 0 .7em;}
div.raster div.zeile table.mini {width:100%;} /* MiniTabelle eingepaßt */
* html div.raster div.zeile div div {margin: 0 0 .3em 0;padding: .2em .7em 0 .7em;} /* damit auch bis ie6 bei rastern Ränder darstellt */
/* Spalten-Neu Start */
.spaltenrahmen { clear:left; width: 100%; border-top:2px solid #A39129; border-bottom:2px solid #A39129; }
.sp-25 {float:left; width:25%; min-width:109px; }
.sp-50 {float:left; width:50%; min-width:218px; }
.sp-100 {float:left; width:100%; min-width:218px; }
.sp-VorTop {margin-bottom: 2.2em; }
.sp-rechts {margin-right:-2px; }
.hinterlegt {background: #EBEBBD; }
.sp-100-Top {float:left; width:100%; height:2.2em; border-bottom:1px solid #4D4419; }
.sp-25-Top {float:left; width:100%; height: 0; margin-top: -1px; border-bottom:1px solid #4D4419; }
.sp-25-Top .insp-r {margin-top: -2.2em; height: 2.2em; background: #EBEBBD; }
.sp-100-Top h2, .sp-25-Top h2 {font-size:124%; padding:.3em 0; /*und damit ie7 auch Unterlängen anzeigt*/position:relative;}
.insp-l {padding: 0 .7em 0 0; }
.insp-m {padding: 0 .7em; }
.insp-r {padding: 0 0 0 .7em; }
img.spaltenbild { display:block; width:100%; margin-bottom:.5em; }
div.sp-50>div.insp-l>img.spaltenbild { margin:1.1em 0 1.1em 0; }
.fussnote {width:100%; min-width:109px; margin-bottom:2em; }
/* Spalten-Neu Ende */

/* Rubrik-Ankernavigation */
.ankerzeile a {font-size: 90%;padding: .1em 0 .1em 0;background: transparent url(../../../bilder/down_blau.gif) no-repeat left center;padding-left: 16px;}

/* Startseiten-Kopf und Menü-zeile */
div#kopf img {display:block;margin: 2em auto .5em auto;padding-right:30px;/*Korrektur linkes 30-Pixel-Logo-Symbol*/ }
div#kopf .menu, div.nichtdrucken .menu {text-align:center;}
.menu { font-size: 100%; font-weight:bold; line-height:1.4em; margin: 3px 3px 3px 0;padding: 0 3px 0 0;}
.menu img {float:left; margin-top:-14px; margin-bottom:-14px; padding-top:.7em;}
.menu .rubrikliste a {line-height:1.4em;background: transparent url(../img/back.gif) no-repeat left center;padding: .1em 4px .1em 16px;}
.menu .rubrikliste a:hover, .menu .rubrikliste a:focus, .menu .rubrikliste a:active {background: url(../img/back_w.gif) no-repeat left center; text-decoration: none;}
.menu .rubrikliste span {line-height:1.4em;background: none;padding: .1em 4px .1em 16px;}/* deaktive Menü-Verweise */

/* Farbpalette Allgemein */
.menu, .spalte2, div.bild, p.bu {background: #F3F3D8;} /* Menüzeile Bildunterschriften */
strong, h5, h6, p.bu {color: #4D4419;} /* starker Textmarkierer */
div.beispiel div.raeumen, .tkopf, .tfuss {background: #EBEBBD;} /* Beispielkasten (Kastenstil bei Beispielen) und Rubrikkasten (Kastenstil bei rastern in Rubrik und Startseite) */
span.fehlermarker {background-color: #FFFFFF;color: #FF0040;font-weight: bold;} /* Textmarkierer im Beispielkasten */
.bildchenlinks {background: #F3F3D8;} /* Basiskasten (Kastenstil bei Basiswissen für Anfänger) */
.basis {background: #F3F3D8;border: 1px solid #4D4419;} /* Basiskasten (Kastenstil bei Basiswissen für Anfänger) */
p.besonders {background: #F3F3D8;} /* Besondersabsatz (Absatzstil bei Speziellem für Fortgeschrittene) */
p.besonders strong:first-child {font-style:italic;color: #8F3D74;} /* Besondersabsatz (Absatzstil bei Speziellem für Fortgeschrittene) */

/* Linkhintergründe */
.menu .rubrikliste a:hover, .menu .rubrikliste a:focus, .menu .rubrikliste a:active {background-color: #191971;color:white;} /* Hintergründe */
a:hover img, a:focus img, a:active img {background-color: #CCD0FF;} /* Link-Bilder-Hintergrund (Logo-Link) */

/* Einfärbungen */
strong.einzahlung {color: #007038;}
strong.auszahlung {color: #700000;}

/* Farben der Perspektiven */
div#erklaerung h1 span.rechts, div#erklaerung ul>li, div#erklaerung ol>li {color: #2E669E/*#2E669E#6181D1*/;} /* Kapitelfarbe Erklärung */
div#sicherheit h1 span.rechts, div#sicherheit ul>li, div#sicherheit ol>li {color: #669E2E/*#669E2E#74D161*/;} /* Kapitelfarbe Sicherheit */
div#ertrag h1 span.rechts, div#ertrag ul>li, div#ertrag ol>li {color: #850000/*#B24934#D17461*/;} /* Kapitelfarbe Ertrag */
div#flexibilitaet h1 span.rechts, div#flexibilitaet ul>li, div#flexibilitaet ol>li {color: #008542/*#2E9E66#D2B362*/;} /* Kapitelfarbe Flexibilität */



/*****************   Korrektur von Academy Design   *****************/
.menu .rubrikliste a {padding: 0.1em 6px 0.1em 18px;}
.menu .rubrikliste .wissen:hover, .menu .rubrikliste a.wissen:hover {color: #fff;}
div#kopf img.logoklein {margin:0; margin:-14px 0; padding-right: 0;} /* Korrektur da Kleines Logo und Navigation anders gecoded wurde als bei Startseite - nicht kompatibel mit Typo3 */