3.6.1 Stylesheet dieser Website

• 1 Allgemeine Bemerkungen
• 2 Ablageort des Stylesheets
• 3 Aufrufen des Stylesheets durch den Anwender
• 5 Anzeige des allgemeinen Stylesheets dieser Website

-

⇧ 1 Allgemein

Allgemeine Bemerkungen

• Die Angaben in den Stylesheet sind normalerweise auf die speziellen und individuellen Anwendungen der entsprechenden Webseiten ausgerichtet.

• Wenn im folgenden etwas "empfohlen" wird, ist dies eher als "Möglichkeit" zu verstehen.

• Das Stylesheet dieser Website ist nicht mustergültig.

• Es soll aus den Definitionen, Beispielen und Bemerkungen keine Vorschriften gemacht werden.

• Die Kompatibilität mit verschiedenen Browsern zwingt manchmal zu den unmöglichsten Style-Definitionen.

• Es ist auch möglich, dass verschiedene Teile von Stylesheets im Kopfbereich der HTML-Dokumente oder gar im Text festgelegt werden.

Arten der Einbindung von Stylesheets

CSS: External Stylesheet

CSS: Internal Stylesheet

CSS: Inline Stylesheet

Separate Stylesheets

• Teile von Stylesheets können auch in separaten Dateien festgelegt werden.

• Diese Datein werden anschliessend in das allgemeine Stylesheet der Website mit dem PHP-Befehl include eingelesen.

Formular-Stylesheet

Formulare: Stylesheet

Definitionen der Farben

• Die Farben werden in einer separaten Datei definiert und mit einem Include-Befehl in das Stylesheet eingelesen.

Datei-Endungen

• Die Stylesheet haben normalerweise die Endung .css.

• Da in dieser Website jedoch PHP-Befehle zum Beispiel für das Einlesen von Farben aufgenommen wurden, wurde das .css belassen aber die Endung .php zugefügt.

• Die Stylesheets dieser Website habe also alle die Endung.php.

Verwendung des vorliegenden Stylesheets

• Das vorliegende Stylesheet wird in verschiedenen Websites verwendet.

• Es enthält daher die Definitionen, die verschiedenen Ansprüchen entsprechen müssen.

• Verschiedenen Einträge dienen im Webseitenbau auch nur zur Instruktion.

Webseitenbau

Internet-Vademecum

-

⇧ 2 Ablageort des Stylesheets herausfinden

Wo ist das Stylesheet gespeichert?

1. Im Kopfbereich jedes HTML-Dokumentes ist angegeben wo sich das Stylesheet befindet.

   <link rel='stylesheet' type='text/css' href='../../styles/allgemein.css.php'>

2. Der Name und Ablageort des Stylesheet der Website ist demnach wie folgt:

   '../../styles/allgemein.css.php'

3. Der URL des Stylesheets lautet daher

   http://webbau.brandenberger.eu/styles/allgemein.css.php

-

⇧ 3 Aufrufen des Stylesheets durch den Anwender

Vorgehen

1. Mit der rechten Maustaste auf die Website klicken und den Quelltext öffnen.
2. Name und Ablageort des Stylesheets notieren.
3. Ganzen Pfad im Browser eingeben.

Das Stylesheet kann durch jeden Anwender eingesehen werden

• Stylesheet für Webseiten: http://webbau.brandenberger.eu/styles/allgemein.css.php

-

⇧ 5 Anzeige des allgemeinen Stylesheets dieser Website

Pfad: http://webbau.brandenberger.eu/styles/allgemein.css.php

/***********************************************************/
/* http://webbau.brandenberger.eu/styles/allgemein.css.php */
/* CSS-Definitionen für Vademecum und Webbau               */
/* Normalausgabe für Opera, IE und Firefox                 */
/* von Alfred Brandenberger - alfred@brandenberger.eu      */
/***********************************************************/

/* Die folgende Include-Datei liest die Farben ein.
Achtung: Die Farben müssen zum Teil im Kopf 
und in anderen Dateien von Hand geändert werden.
In der Datei  /webbau/styles/farbe-louis.php
ist angegeben, wo die Farben sonst noch von Hand
eingegeben werden müssen.
*/


/* Menuübreite: 14.7em */

/***********************************************************/
/* Kopfbereich                                             */
/***********************************************************/

#kopfbehaelter {
position:fixed; top:0; left:0; right:0;
z-index:0;
margin:0;
padding:0; 
background: #283A4B;
color:#D7E1EA;
}

#kopf {
position:fixed; top:0; left:0; right:0;
border:none;
padding-top:0.5em;
z-index:0;                          /* Louis geändert am 27.10.2013, vorher 3 */
background:#283A4B;
color:#D7E1EA;
text-align:center;
font-size:1.38em;
font-weight:bold; 
letter-spacing:1px;
height:2.7em;                           /* Louis hinzugefügt am 27.10.2013 */
}

/* Dies wird vom IE6 nicht verstanden */
/* Darum kann kein h1 verwendet werden*/
#kopf h1 {
position:fixed; top:0; left:0; right:16px;
height:100%;
border:none;
margin-top:0;
padding-top:0;
z-index:3;
text-align:center;
font-size:1.38em;
font-weight:bold;
letter-spacing:0.1em;
}

#suchen-website {
position:fixed; top:0; right:0;
padding:2px 0 0 0;
z-index:4;
font-size:0.88em;
font-weight:bold;
}

#sprache {
position:fixed; top:56px; right:2.4em;
z-index:4;
font-size:0.75em;
font-weight:bold;
}

#home, #site, #home_aktiv, #site_aktiv, #aktuelles_kap {
position:fixed; left:14.2em;
z-index:3;
background:#283A4B;
color:#D7E1EA;
font-size:0.88em;
font-weight:normal;
padding:2px 2px 0 2px;
line-height:1.3em;
}

#home, #home_aktiv {
top:2px; 
}

#home_aktiv {
background:#D7E1EA;
color:#283A4B;
font-weight:bold;
}

#site, #site_aktiv{
top:1.6em;
}

#site_aktiv {
background:#D7E1EA;
color:#283A4B;
font-weight:bold;
}

/* Aktuelles Kapitel ist die Anzeige unterhalb der Site*/
#aktuelles_kap {
top:2.8em;
width:50em;
margin-left:-1.35em;
padding-left:0;
z-index:2; 
text-align:left;
font-size:0.96em; 
font-weight:normal;
}

/***********************************************************/
/* Inhalt-Bereich                                          */
/***********************************************************/

#inhalt {   
max-width:1400px;
margin-top:-3.2em; /* Damit der Abstand oben im IE und Opera gleich gross aussehen */
padding:4.5em 2px 25em 12.42em; /* padding top für Ausgleich im IE und Opera */
z-index:2;  
}

/***********************************************************/
/* Menübereich                                             */
/***********************************************************/

#menue li {                                                 /* Rand im Menü */
margin: 0;
padding-left:2px;
}

#menue {
position:fixed;
top:0.2em;
left:0;
width:14.7em;
margin:0;
padding-left:0;                                     /*Wegen Opera notwendig */
padding-bottom:46em;           /* Dies verlängert den Hintergrund nach unten */
z-index:5;
background:#283A4B;
color:#D7E1EA;
line-height:1.2em;                      /* Zeilenabstand der Kapitel im Menü */
list-style: none;
font-size:0.82em;                                             
font-weight:normal;
}

#menue_aktiv {
background:#283A4B;
color:#D7E1EA;
font-weight:bold;
}

.menue_uk1 {
padding-top:0px;
padding-bottom:0px;
line-height:1.1em;                               
background:#44627E;
color:#D7E1EA;
}

#menue_uk1_aktiv {
background:#44627E;
color:#D7E1EA;
font-weight:bold;
}

.menue_uk2 {
line-height:1.1em;              
list-style: none;
background:#A5BCCF;
color:#0E141B;
font-size:0.96em;
font-weight:normal;
}
 
#menue_uk2_aktiv { 
line-height:1.1em;              
list-style: none;
background:#D7E1EA;
color:#0E141B;
font-size:0.96em;
font-weight:bold;
}
#menue_uk2_aktiv a {
color:#000;
}

#menue hr {
background:#A5BCCF;	/* setzt die Farbe der Trennlinie im Menü*/
height:1px;	                       	/* ersetzt size=1  */
border:none;                    		/* ersetzt noshade */
}

.menue_versteckt {
display:none;
}

/***********************************************************/
/* Fussbehälter                                            */
/***********************************************************/

#fussbehaelter {
position:fixed; bottom:-1px; left:0; right:0;
z-index:6;

background:#283A4B;
color:#D7E1EA;
}

#fuss1 {
position:fixed; 
left:0; bottom:0;
display:inline;
padding:2px 0 2px 0.2em;
z-index:6;
font-size:0.75em;
font-weight:normal;
}

#fuss2 {
position:fixed; right:0; bottom:0;
display:inline;
margin-left:20em;
padding:1px 0.5em 1px 0;
text-align:right;
font-size:0.75em;
font-weight:normal;
}

/***********************************************************/
/* Diverses für alle Bereiche                              */
/***********************************************************/

/* Nur für den MSIE */
* html, * html body {
overflow:hidden;
bottom:0;
height:100%;
}

* html #kopfbehaelter, * html #fussbehaelter {
position:absolute;
width:100%;
padding-right:16px;
}

* html #menue {
position:absolute;
}

* html #kopf, * html #fuss1, * html #fuss2 {
height:100%;
position:static;
}

* html #inhalt {
position:absolute;
top:0; bottom:0; left:0; right:0;
height:100%;
width:100%;
overflow:auto;
margin:0;
}

/* Fügt ein Zeichen vor externe Links ein */ 
a[href^="http://"]:before { 
content: "\2197\a0" 
}

/* von Louis für interne Submenüs: Einzug für Unteruntermenüs */
li.einzug {
margin-left:2.5em ! important;
}
li.einzug2 {
margin-left:5em ! important;
}

/***********************************************************/
/* Links                                                   */
/* Die Links müssen in folgender Reihenfolge sein          */
/***********************************************************/
/* 1) a:link (noch nicht besuchter Link*/

a:link   {
color:#283A4B;            /* Für Farben Louis */
} 

#kopfbehaelter a:link {
background:transparent;
color:#D7E1EA;
text-decoration:none;
margin:0;
padding:0em;
}

#aktuelles_kap a:link {
color:#D7E1EA;
}

#menue a:link {
background:transparent;
/*color:#D7E1EA;  Louis auskommentiert 12.01.2014 */
text-decoration:none;
margin:0;
padding:0;
}
#menue a:visited {          /* Louis 12.1.2014 : Chaos im Code erweitert
background:transparent;
/*color:#D7E1EA;  Louis auskommentiert 12.01.2014 */
text-decoration:none;
margin:0;
padding:0;
}

#menue_aktiv a:link {
background:#D7E1EA;
color:#283A4B;
text-decoration:none;
margin:0;
padding:0em;
}
 
#menue_uk2_aktiv a:link {
background:#D7E1EA;
color:#283A4B;
text-decoration:none;
margin:0;
padding:0em;
}

#fussbehaelter a:link {
background:transparent;
color:#D7E1EA;
text-decoration:none;
}

/***********************************************************/
/* 2) a:visited (schon besuchter Link*/

/* a:visited {
color:#283A4B;
}  */

#kopfbehaelter a:visited {
background:transparent;
color:#D7E1EA;
text-decoration:none;
margin:0;
padding:0em;
}

#home a:visited {
background:transparent;
color:#D7E1EA;
text-decoration:none;
margin:0;
padding:0em;
}

#site a:visited {
background:transparent;
color:#D7E1EA;
text-decoration:none;
margin:0;
padding:0em;
}

#aktuelles_kap a:visited {
background:#283A4B;
color:#D7E1EA;
text-decoration:none;
margin:0;
padding:0em;
}

#menue a:visited{
background:transparent;
/*color:#D7E1EA;   Nein-auskommeniert Louis 13.10.2013 */
text-decoration:none;
margin:0;
padding:0em;
}

#menue_aktiv a:visited {
background:#D7E1EA;
color:#283A4B;   /*Nein-auskommeniert Louis 13.10.2013 */
text-decoration:none;
margin:0;
padding:0em;
}

#menue_uk2_aktiv a:visited {
background:transparent;
color:#283A4B;       /*Nein-auskommeniert Louis 13.10.2013 */ 
text-decoration:none;
margin:0;
padding:0em;
}
#menue_uk1_aktiv a:visited {           /* Louis: Chaos im Code erweitert 14.1.2014 */
color:#D7E1EA;       
}
.menue_uk2 a:link {            /* Louis: Chaos im Code erweitert 14.1.2014 */
color:#283A4B;       
}
.menue_uk2 a:visited {            /* Louis: Chaos im Code erweitert 14.1.2014 */
color:#283A4B;       
}
.menue_uk0 a {            /* Louis: Chaos im Code erweitert 14.1.2014 */
color:#D7E1EA;       
}
.menue_uk0 a:link {            /* Louis: Chaos im Code erweitert 14.1.2014 */
color:#D7E1EA;       
}
.menue_uk0 a:visited {            /* Louis: Chaos im Code erweitert 14.1.2014 */
color:#D7E1EA;       
}
.menue_uk1 a {            /* Louis: Chaos im Code erweitert 14.1.2014 */
color:#D7E1EA;       
}
.menue_uk1 a:link {            /* Louis: Chaos im Code erweitert 14.1.2014 */
color:#D7E1EA;       
}
.menue_uk1 a:visited {            /* Louis: Chaos im Code erweitert 14.1.2014 */
color:#D7E1EA;       
}
/***********************************************************/
/* 3) a:hover (Benutzer hovert mit der Maus) */

a:hover {
color:;
} 

#kopf a:hover, #home a:hover, #site a:hover, #aktuelles_kap a:hover{
color:;
}

#menue a:hover {
color:;
}

#menue_uk2_aktiv a:hover {
background:transparent;
color:;                /* Schriftfarbe des aktiven uk2*/
text-decoration:none;
margin:0;
padding:0em;
}

#fussbehaelter a:hover {
color:;
text-decoration:none;
}

/***********************************************************/
/* 4) a:active 
(Anzeige, wenn man mit der linken Maustaste auf den Link drückt)*/

a:active {
color:#6D3758;
} 

#aktiv {
text-decoration:none;
} 

/***************************************************************/
/* Internet-Vademecum: Inhalt-Bereich                          */
/* Achtung: Wegen Anpassung des Menues an den IE6              */
/* sind viele Formatierungen evtl. nicht mehr W3C CSS Konform  */
/***************************************************************/

/*body früher: font-size:100.1%*/

body {
position:absolute;
background:#FFFFFF;
color:#000000;
font-family:Verdana,Helvetica,sans-serif;
font-size:103%;
}

html, body { 
top:0; left:0; right:0;
min-height:100%;
/* wegen dem IE notwendig*/
margin:0;
padding:0;
/* wegen dem IE notwendig*/
width:100%;
}

p {
margin:1em 0;
padding-left:5px;                  /*2016-02-19 damit links Abstand vom Rand*/
}

/* Normaler Abschnitt aber eingeschoben */
/* Angewendet in webbau.brandenberger.eu/html/dokument */
/* Angewendet in /themen/klima/kontroverse.php */
.e {
margin:1em 0 1em 2em;  /*2019-01-15 links 2em 2016-02-25 links Abstand vom Rand 1 anstatt 0.5em*/
padding:0;
}

/* Zeile mit z-Zeilenabstand*/
.z {
line-height:1.3em;
}

/* Fett mit grösserem oberen Abstand für kleine Titel*/
/* Angewendet in Webbau /php/navigation/array.php*/
p.fetta {
margin-top:1.2em;
font-weight:bold;
}

/* Fett mit grösserem a-oberem und z-Zeilen Abstand für kleine Titel*/
/* Angewendet Vademecum Fragen */
p.fettaz {
margin-top:1.2em;
line-height:1.3em;
font-weight:bold;
}

/* Kleine Schrift z.B. Sprache bei Titeln (span class="klein")*/
/* Beispiel auch das 2 bei CO2 */
.klein {
font-size:0.82em;
letter-spacing:0;
font-weight:bold;
}

/* Halber Zeilenabstand oben */
.halb {
margin-top:-0.5em;
}

/* Etwas kleineren oberen Abstand als halb */
/* Für grauen Text in Verzeichnissen*/
.kleiner {
margin-top:-0.8em;
}

/* Halber Zeilenabstand oben und linker Abstand wie class="e" */
.he {
margin-top:-0.5em;
margin-left:0.5em;
}

/* Jahresangaben in Verzeichnissen Variante 1*/
/* Beispiel p class="jahr" (ohne b) bei nachfolgenden Überschriften */
.jahr {
margin-bottom:-72px;
font-weight:bold;
}

/* Jahresangaben in Verzeichnissen Variante 2 */
/* Beispiel li class="jahra" (mit a) im Verzeichnis */
.jahra {
margin-top:0.5em;
font-weight:bold;
}

/* Jahresangaben in Verzeichnissen Variante 2 */
/* Beispiel p class="jahrb" (mit b) bei nachfolgenden normalen Links (z.B. in Echo */
/* Das b erzeugt einen grösseren unteren Abstand (b=bottom) */
.jahrb {
margin-top:0.5em;      /* gleich wie jahra ?????? */
font-weight:bold;
}

h1 {
margin-top:2.7em;
margin-bottom:0.8em;
padding:10px 10px;
border-style:solid; border-width:0;
border-left-color:#283A4B;
border-top-color:#283A4B;
border-right-color: #283A4B;
border-bottom-color: #283A4B;
background: #283A4B ;
color: #D7E1EA;
font-size:1.25em; font-weight:bold; letter-spacing:0.02em;
}

h2 {
margin-top:2.7em;
padding:8px 10px;
border-style:solid; border-width:4px;
border-left-color:#A5BCCF;
border-top-color:#A5BCCF;
border-right-color:#283A4B;
border-bottom-color:#283A4B;
background:#44627E;
color:#D7E1EA;
font-size:1.25em; font-weight:bold; letter-spacing:0.02em;
}

h3 {
margin-top:1.5em; 
padding:8px 5px;
border-style:solid; border-width:4px;
border-left-color:#D7E1EA;
border-top-color:#D7E1EA;
border-right-color:#44627E;
border-bottom-color:#44627E;
background:#A5BCCF;
color: #283A4B;
font-size:1.25em; font-weight:bold; letter-spacing:0.02em;
}

/* Schrift von h3 aber ohne box*/
.h3 {
margin-top:1.3em; /*nur wegen dem IE*/
padding:8px 5px;
background:transparent;
color: #283A4B ;
font-size:1.25em; 
font-weight:bold; 
letter-spacing:0.02em;
}

h4 {
margin-bottom:-0.05em; /* zugefügt wegen dreieck am 2022-04-29*/
padding:8px 5px;
border-style:solid; border-width:4px;
border-left-color:#D7E1EA;
border-top-color:#D7E1EA;
border-right-color:#A5BCCF;
border-bottom-color:#A5BCCF;
background:#D7E1EA;
color: #283A4B;
font-size:1.2em; 
font-weight:bold; 
letter-spacing:0.02em;
}

h5 {
margin-top:1em;
margin-bottom:0.8em; /* zugefügt da Absand zu gross war 2022-05-02*/
padding:2px;
border-style:solid; border-width:2px;
border-left-color:#D7E1EA;
border-top-color:#D7E1EA;
border-right-color:#A5BCCF;
border-bottom-color:#A5BCCF;
background: #E8EEF3 ;
color: #283A4B ;
font-size:1.12em; 
font-weight:bold; 
letter-spacing:0.01em;
}

.h5box {
margin:0;
padding:2px;
border-style:solid; border-width:1px;
border-left-color:#D7E1EA;
border-top-color:#D7E1EA;
border-right-color:#A5BCCF;
border-bottom-color:#A5BCCF;
background: #E8EEF3 ;
color: #283A4B ;
font-size:1.12em; 
font-weight:bold; 
letter-spacing:0.01em;
}

/* Schrift von h5 ohne box */
.h5 {
padding:2px 0 2px 2px;
margin:0;
background:transparent;
color: #283A4B ;
font-size:1.12em; 
font-weight:bold; 
letter-spacing:0.01em;
}


/* wird nicht mehr gebraucht*/
/* Titel von h5 aber ohne box*/
.h5titel {
padding:2px 0 0 2px;  
margin-top:1em;
margin-bottom:0.7em;  /* Kontrolle: Klimaverlauf/Geschichte */
                      /* am 2015-01-29 margin-bottom:... zugefügt damit */ 
                      /* der nächste Abschnitt mit class="halb" oder "gelb" */
background:transparent;
color: #283A4B ;
font-size:1.12em; 
font-weight:bold; 
letter-spacing:0.01em;
}

/* Ersatz a für h5titel (a = Abstand oben) */
/* Ähnlich wie h5titel aber mit kleinerem Abstand unten */
/* Versuchsweise angewendet in Webbau /php/navigation/array.php*/
.h5a {
margin-top:1em;
margin-bottom:-0.3em;  
background:transparent;
color: #283A4B ;
font-size:1.12em; 
font-weight:bold; 
letter-spacing:0.01em;
}

/* e = Einzug links und a = Abstand oben */
/* Versuchsweise angewendet in /themen/klima/kontroverse.php */
.h5ea {
margin-top:1em;
margin-left:0.5em;
margin-bottom:-0.3em;  
background:transparent;
color: #283A4B ;
font-size:1.12em; 
font-weight:bold; 
letter-spacing:0.01em;
}

/* Ersatz b für h5titel (b = Abstand bottom) */
/* Ähnlich wie h5titel auch mit grossem Abstand oben und unten für class halb */
/* Versuchsweise angewendet in webbau.brandenberger.eu/php/einleitung/bezeichnungen */
.h5b {
margin-top:1em;
margin-bottom:0.7em;  
background:transparent;
color: #283A4B ;
font-size:1.12em; 
font-weight:bold; 
letter-spacing:0.01em;
}

/* Mit mit a-oben grösserem Abstand */
/* In "/include/index/update_klima.php" */
.h5ab {
margin-top:1em;
margin-bottom:0.7em;
padding-top:0.8em;  
background:transparent;
color: #283A4B ;
font-size:1.12em; 
font-weight:bold; 
letter-spacing:0.01em;
}

/* Schrift von h6 ist wegen Webbau so komisch */
/* Schrift von h6 verwendet in /css/erstellen/external.php */
/* /css/erstellen/internal.php und /css/spezifikation/prinzip.php */
h6 {
background:transparent;
color: fuchsia;
font-size:1em; 
font-weight:bold; 
letter-spacing:0.02em;
}

/***********************************************************/
/* Farbe: Grund  */
/***********************************************************/
/* Hintergrund wie Home*/
.home {
background:#283A4B;
color:#D7E1EA;
}

/***********************************************************/
/* Farbe: Schwarz                                          */
/* Alternative Angabe: "black"                             */
/*Im Stylesheet: $... = "#000000"; oder $... = "black";    */
/*Im HTML-Quelltext: color:"#000000" oder color:"black"    */
/***********************************************************/

/* Schwarzer Rahmen */
.box-schwarz {
border-style:solid; 
border-width:2px; 
margin:1em 0;
padding:5px;
border-color:#000000;
background:#FFFFFF;
color:#000000;
}

/* Schwarzer Rahmen mit innerem oberem grossen Abstand für Farben-Text */
.box-schwarzb {
border-style:solid; 
border-width:2px; 
margin:1em 0;
padding:1.4em 0.5em 0 0.5em;
border-color:#000000;
background:#FFFFFF;
color:#000000;
}


/***********************************************************/
/* Weiss                                                   */
/* Alternative Angabe: "white";                            */
/*Im Stylesheet: $... = "#FFFFFF"; oder $... = "white";    */
/*Im HTML-Quelltext: color:"#FFFFFF" oder color:"white"    */
/***********************************************************/

/* kein Style */

/***********************************************************/
/* Farbe: Blau-Grün                                        */
/* Für Blau-Grün werden die Grundfarbe von Louis verwendet */
/***********************************************************/

/* class="blau-gruen" Blau-Grüner Hintergrund zum Hervorheben von Text */
.blau-gruen {
padding:2px;
background:#D7E1EA;
color:#000000;
}

/* class="box-blau-gruen" Blau-gruene Box (Hintergrund mit Rahmen) */
.box-blau-gruen {
border-style:solid; 
border-width:3px;
background:#D7E1EA;
border-left-color: #E8EEF3 ;
border-top-color: #E8EEF3 ;
border-right-color: #A5BCCF ;
border-bottom-color:#A5BCCF;
color:#000000;
padding:0.5em;
}


/***********************************************************/
/* Farbe: Blau  */
/***********************************************************/

/* blaue Schrift: class="text-blau" */
.text-blau {                          /* Noch nicht definiert, noch nicht verwendet */     
color: #B3C5D6;
}

.titel-blau {
text-align:center;
color:#B3C5D6;
font-size:1.32em; 
font-weight: bold; 
}

.untertitel-blau {
text-align:center;
color:#B3C5D6;
font-size:0.93em; 
font-weight: bold; 
}

/* Blauer Hintergrund */
.blau {
padding:2px;
background:#B3C5D6;
color:#000000;
}

/* Blaue Box */
.box-blau {
display:block;
border-style:solid; 
border-width:3px;
padding:0.5em;
background:#B3C5D6;
border-left-color: #D4DFE8 ;
border-top-color: #D4DFE8 ;
border-right-color: #7092B2 ;
border-bottom-color:#7092B2;
color:#000000;
}

/***********************************************************/
/* Farbe: Blau für Sprachen  */

/* Kleiner blauer Hintergrund mit Spreizung des Textes der Sprache Französisch: class="fr" */
.fr {
background:#3F8DDA ;
color:white ;
padding:0;
font-size:15px;
font-weight:bold;
letter-spacing:3px;
}

/* Kleiner blauer Hintergrund ohne Spreizung des Textes */
.frn {
background:#3F8DDA ;
color:white ;
padding:0;
font-size:12px;         /* Bemerkung: Die Schrift ist etwas kleiner als mit Spreizung */
font-weight:bold;
letter-spacing:0;
}

/* Grosser blauer Hintergrund mit Spreizung des Textes der Sprache Französisch: class="frg" */
.frg {
background:#3F8DDA ;
color:white ;
padding:0;
font-size:0.88em;
font-weight:bold;
letter-spacing:3px;
padding:2px;
}

/* Grosser blauer Hintergrund ohne Spreizung des Textes der Sprache Französisch: class="frgn" */
.frgn {
background:#3F8DDA ;
color:white ;
padding:0;
font-size:0.88em;
font-weight:bold;
letter-spacing:0;
padding:2px;
}

/***********************************************************/
/* Farbe: Grau  */
/***********************************************************/

/* Grauer dunkler Hintergrund */ 
.grau {
margin-top:-0.5em;
padding:1px;
background:lightgrey;
color:#000000;
}

/* mit oberhalb grösserem und unten kleinerem Abstand und kleinerem padding */
/* für grauen Text in Verzeichnissen */
/* Grauer dunkler Hintergrund */ 
.graua {
margin-top:-0.9em;
margin-bottom:-0.8em;
background:lightgrey;
color:#000000;
}

/* mit oberhalb noch grösserem etwas und oben und unten mit kleinem padding */
/* für grauen Text für Anzeige von Links im Text */
/* Grauer dunkler Hintergrund */ 
.grauaa {
margin-top: 0.5em;
padding: 1px;
background:lightgrey;
color:#000000;
}

/* Graue Box display:block */ 
.box-grau {
display:block;
border-style:solid; 
border-width:2px;
padding:5px;
background:#F2F2F2;
border-left-color: #BFBFBF ;
border-top-color: #BFBFBF ;
border-right-color: #808080 ;
border-bottom-color:#808080;
color:#000000;
}

/* Graue Box display:inline */
/* ohne display:block Daher Rahmen nur um den Text */
.inlinebox-grau {
border-style:solid; 
border-width:3px;
padding:5px;
background:#F2F2F2;
border-left-color: #BFBFBF ;
border-top-color: #BFBFBF ;
border-right-color: #808080 ;
border-bottom-color:#808080;
color:#000000;
}

/* Tabelle mit Links "table-normal" mit normaler Schrift */
.table-normal {
background:#E8EEF3;
color:#808080;
}

/* Tabelle mit Links class="table-link" und kleiner Schrift*/
.table-link {
margin-top:0.5em;
background:#E8EEF3;
color:#808080;
font-size:85%;
border-color:#E8EEF3;
}

/* Tabelle 1 neue Farbe 1 und grösser in Webbau  mit Links "table-link1"
Ausgeschaltet, da ich nicht weiss wofür
.table-link1 {
background:;
color:#000000;
font-size:95%;
border:0;                   
}
*/

/* Tabelle oder Box für "Weiter" mit Links class="weiter" und kleiner Schrift*/
.weiter {
margin-bottom:1.5em;
padding:2px 5px; 
background:#E8EEF3;
color:#808080;
font-size:95%;
border-color:#E8EEF3;
}


/* Tabelle oder Box für "Klimaschau" (mit Blauem Pfeil)*/
.schau {
padding:0;
background:#E8EEF3;
color:#808080;
font-size:95%;
border-color:#E8EEF3;
}


/* Tabelle für "Welt" mit Links class="welt" und kleiner Schrift*/
.welt {
margin-top:1.5em;
margin-bottom:1.5em;
font-size:98%;
}


/* Tabelle für "teil" unter Titel mit h1 und h2 */
.teil {
font-size:90%;
margin-top:-0.8em;
margin-bottom:1.2em;
padding:0.1em 0 0.15em 0;
width:100%;
display:block;
border-style:solid; 
border-width:2px;
background:#F2F2F2;
border-left-color: #BFBFBF ;
border-top-color: #BFBFBF ;
border-right-color: #808080 ;
border-bottom-color:#808080;
color:#000000;
}

/* Tabelle als "teil-1" mit blauem Hintergrund als Menü-Wiederholung */
.teil-1 {
font-size:90%;
margin-top:-0.8em;
margin-bottom:1.2em;
padding:0.1em 0 0.15em 0;
width:100%;
display:block;
border-style:solid; 
border-width:2px;
background:#B3C5D6;
border-left-color: #BFBFBF ;
border-top-color: #BFBFBF ;
border-right-color: #808080 ;
border-bottom-color:#808080;
color:#000000;
}


/***********************************************************/
/* Farbe: Rot  */
/***********************************************************/

/* Rote Schrift: class="text-rot" */
.text-rot {                               
color: #D42B34;
}

/* Titel mit class="titel_rot"> formatieren */
.titel-rot {
text-align:center;
font-size:1.2em; 
font-weight: bold; 
color: #D42B34;
}

/* Roter Hintergrund: classs="rot"  */
.rot {
padding:1px;
background:#D42B34;  /* noch nicht verwendet  */
color:#000000;
}

/* Roter Rahmen class="box-rot"  */
.box-rot {
border-style:solid;
border-width:5px; 
padding:0.5em;
border-color: #D42B34;
background:#FFFFFF;                  /* Hintergrund: Weiss */
color:#000000;                       /* Schrift: Schwarz */
text-align:center;                   /* Achtung: Zentriert */
}

/* Roter Rahmen class="box-rota" mit grösserem Abstand über dem Rahmen*/
.box-rota {
margin-top:1em;
border-style:solid;
border-width:5px; 
padding:0.5em;
border-color: #D42B34;
background:#FFFFFF;                  /* Hintergrund: Weiss */
color:#000000;                       /* Schrift: Schwarz */
text-align:center;                   /* Achtung: Zentriert */
}

/* Roter Rahmen class="box-rota"  mit innerem oberem grossen Abstand für Farben-Text */
.box-rotb {
border-style:solid;
border-width:5px; 
padding:1.4em 0.5em 0 0.5em;
border-color: #D42B34;
background:#FFFFFF;                  /* Hintergrund: Weiss */
color:#000000;                       /* Schrift: Schwarz */
text-align:center;                   /* Achtung: Zentriert */
}

/* Roter Rahmen class="box-rota" mit grösserem Abstand über und unter dem Rahmen*/
.box-rotab {
margin-top:1em;
border-style:solid;
border-width:5px; 
padding:1.4em 0.5em 0 0.5em;
border-color: #D42B34;
background:#FFFFFF;                  /* Hintergrund: Weiss */
color:#000000;                       /* Schrift: Schwarz */
text-align:center;                   /* Achtung: Zentriert */
}

/* Dünner roter Rahmen class="box-rotduenn" */
.box-rotduenn {
border-style:solid; 
border-width:2px; 
border-color: #D42B34;
color:#000000;                       /* Schrift: Schwarz */
text-align:left;
padding-left:0.5em;
padding-right:0.5em;
}

/* Dünner roter Rahmen class="box-rotduenn" mit grösserem Abstand über dem Rahmen*/
.box-rotduenna {
margin-top:0.5em;
border-style:solid; 
border-width:2px; 
border-color: #D42B34;
color:#000000;                       /* Schrift: Schwarz */
text-align:left;
padding-left:0.5em;
padding-right:0.5em;
}


/* Dünner roter Rahmen mit innerem oberem grossen Abstand für Farben-Text */
.box-rotduennb {
border-style:solid; 
border-width:2px; 
border-color: #D42B34;
color:#000000;                       /* Schrift: Schwarz */
text-align:left;
padding:1.4em 0.5em 0 0.5em;
}

/* Dünner roter Rahmen class="box-rotduenn" mit grösserem Abstand über dem Rahmen*/
/* Dünner roter Rahmen mit innerem oberem grossen Abstand für Farben-Text */
.box-rotduennab {
margin-top:0.5em;
border-style:solid; 
border-width:2px; 
border-color: #D42B34;
color:#000000;                       /* Schrift: Schwarz */
text-align:left;
padding:1.4em 0.5em 0 0.5em;
}


/* Kleiner roter Hintergrund der Sprache Englisch: class="en" */
.en {
background:#D42B34 ;  
color:white;           
padding:0;
font-size:15px;
font-weight:bold;
}

/* Grosser roter Hintergrund der Sprache Englisch: class="eng" */
.eng {
background:#D42B34 ;
color:white ;
padding:0;
font-size:0.88em;
font-weight:bold;
padding:2px;
}

/***********************************************************/
/* Farbe: Gelb           */
/***********************************************************/

/* Gelber Hintergrund: class="gelb"  */
.gelb {
margin-top:-0.5em;
padding:1px;
background:#F5F08F;
color:#000000;
}

/* Wie Gelb aber mit oberem normalem Abstand  */
/* Gelber Hintergrund: class="gelb"  */
.gelba {
margin-top:0.1em;
padding:1px;
background:#F5F08F;
color:#000000;
}


/* Mit class="gelbfett" für Text fett und Hintergrund gelb */
/* Abstand oben ist kleiner als ein Leerabstand */
.gelbfett {
margin-top:-0.5em;
padding:1px;
background:#F5F08F;
color:#000000;
font-weight:bold;
line-height:120%;
}

/* Wie gelbfett aber für grösseren oberen Abstand */
.gelbfetta {
margin-top:0.1em;
padding:1px;
background:#F5F08F;
color:#000000;
font-weight:bold;
line-height:120%;
}

/* Gelber Hintergurund und roter Rahmen fuer Posteingang (vorne=outset)*/
.box-gelb {
border-style:outset; 
border-width:3px; 
padding:0;
border-color:#D42B34;
background:#F5F08F; 
color:#000000;
}

/***********************************************************/
/* Farbe: Grün  */
/***********************************************************/

/* Grüne Schrift: class="text-gruen" */
.text-gruen {                               
color: ;    /* noch nicht definiert - noch nicht verwendet  */
}

/* Grüner Hintergrund: class="gruen" */
.gruen {
background:#D0E5CD;
color:#000000;
padding:1px;
}

/* Gruener Hintergurund mit Rahmen */
.box-gruen {
display:block; 
border-width:3px; 
padding:0.5em;
border-color:#99CC66; 
background:#D0E5CD; 
color:#000000;
}

/* Mit span class="gruenklein" kann Text klein und grünem Hintergrund hervorgehoben werden */
.gruenklein {
background:#D0E5CD;
color:#000000;
padding:1px;
font-size:0.75em;
font-weight:bold;
}

/* Kleiner grüner Hintergrund von Sprache Deutsch: class="de" */
.de {
background:#2FBE27 ;
color:white ;
padding:0;
font-size:15px;        
font-weight:bold;
}

/* Grosser grüner Hintergrund der Sprache Deutsch: class="deg" */
.deg {
background:#2FBE27 ;
color:white ;
padding:0;
font-size:0.88em;
font-weight:bold;
padding:2px;
}

/***********************************************************/
/* Farbe: Violett  */
/* Diese Farbe wird ausschliesslich im Webbau verwendet    */
/* Diese Farbe ist ähnlich der Farb Wichtig im Vademecum   */
/***********************************************************/

/* Mit class="violett" kann Text mit violettem Hintergrund hervorgehoben werden */
.violett {
padding:2px;
background:#E1C6C6;
}

/***********************************************************/
/* Farbe: Wichtig                                          */
/* Vor allem für Videos                                    */
/* Diese Farbe ist ausschliesslich im Vademecum            */
/***********************************************************/

/* class="wichtig" */
.wichtig {
padding-top:1px;                     
padding-bottom:1px;                       
background:#E1C6C6;
color:#000000;
font-size:98%;
}

/***********************************************************/
/* Farbe: Wiki  */
/***********************************************************/

/* Hintergrund mit Farbe Wiki  */
.wiki {
margin-top:-0.5em;
padding:1px;
line-height:120%;
background:#F0DBBD;
}

/* Wie wiki aber für grösseren oberen Abstand */
/* Hintergrund mit Farbe Wiki  */
.wikia {
margin-top:0.1em;
padding:1px;
line-height:120%;
background:#F0DBBD;
}

/* Hintergrund von der Farbe "wiki" und Schrift "fett" */
/* Mit span class="wikifett" kann Text etws kleiner fett hervorgehoben werden */
/* Abstand oben ist kleiner als ein Leerabstand */
/* Formatiert wie "gelbfett" */
.wikifett {
margin-top:-0.5em;
padding:1px;
background:#F0DBBD;
color:#000000;
font-weight:bold;
line-height:120%;
}


/* Wie wikifett aber für grösseren oberen Abstand */
/* Hintergrund von der Farbe "wiki" und Schrift "fett" */
/* Mit span class="wikifett" kann Text etws kleiner fett hervorgehoben werden */
/* Abstand oben ist kleiner als ein Leerabstand */
/* Formatiert wie "gelbfett" */
.wikifetta {
margin-top:0.1em;
padding:1px;
background:#F0DBBD;
color:#000000;
font-weight:bold;
line-height:120%;
}


/* Tabelle mit class="table-wiki"   */
.table-wiki {
background:#F0DBBD;
font-size:85%;
}

/***********************************************************/
/* Farbe: Suchen                                           */
/* Vor allem für die Google-Suche                          */
/* Diese Farbe ist ausschliesslich im Vademecum            */
/***********************************************************/

/* Hintergrund von Formulare "Suchen" */
.suchen {
background:#D0E5CD;
padding:1em;
}

/***********************************************************/
/* Farbe: Code                                             */
/***********************************************************/

/* Allgemeiner code..../code */
code {
padding:1px 0.2em; 
background:#E6E6E6;
color:#000000;
font-size:105%;
font-weight:bold;
}

/* Code im Menü, etwas verschieden von Code im Text */
#menue code {
padding:0;
background:#BFBFBF;
color:#000000;
}


/* Allgemeiner code..../code */
codegr {
padding:1px 0.2em; 
background:#E6E6E6;
color:#000000;
font-size:125%;
font-weight:bold;
}


/***********************************************************/
/* class="pre"                                        */
/* Text in Monospace (gleichmässige Breite                 */
/* Wird ausschliesslich im Webbau benutzt                  */
/***********************************************************/

/* Allgemein class="pre" */
pre {
font-family:monospace;
font-size:0.93em;
}

/* Ausgerichteter Text mit schwarzem Rahmen (Verwendet in Webbauu Beispiel) */
pre.text-box {
font-family:sans-serif;
border-style:solid; border-width:1px; padding:5px;
border-color:#000000; background:#FFFFFF; color:#000000;
}

/***********************************************************/
/* pre class="code"                                        */
/* Darstellung: Codes ausschliesslich im Webbau        */
/***********************************************************/

/* Darstellung Codes */
pre.code {
border-style:solid;
border-width:3px;
padding:5px;
border-left-color: #BFBFBF ;
border-top-color: #BFBFBF ;
border-right-color: #808080 ;
border-bottom-color:#808080;
background:#E6E6E6;
color:#000000;
}


/***********************************************************/
/* pre class="quell"                                       */
/* Darstellung: Quelltext ausschliesslich im Webbau        */
/***********************************************************/

/* Darstellung Quelltext */
pre.quell {
border-style:solid;
border-width:3px; 
padding:5px;
background:#F0DBBD; 
border-color:#DCAD6A; 
color:#000000;
}

/***********************************************************/
/* pre class="style"                                       */
/* Darstellung: Stylesheets ausschliesslich im Webbau      */
/***********************************************************/

/* Darstellung Stylesheet */
pre.style {
border-style:solid; 
border-width:3px; 
padding:5px;
background:#F5F08F; 
border-color:#D8CE13; 
color:#000000;
}

/***********************************************************/
/* p class="php"                                         */
/* pre class="php"                                         */
/* Darstellung: PHP-Befehle ausschliesslich im Webbau      */
/***********************************************************/

/* Darstellung PHP */
pre.php {
border-style:solid;
border-width:3px;
padding:5px;
background:#E1C6C6; 
border-color:#D8B7B6; 
color:#000000;
}

/* Darstellung PHP normal (nicht pre)*/
.php {
background:#E1C6C6; 
color:#000000;
}


/***********************************************************/
/* pre class="js"                                         */
/* Darstellung: JavaScript ausschliesslich im Webbau      */
/***********************************************************/

/* Darstellung javascript */
pre.js {
border-style:solid; 
border-width:3px;  
padding:5px;
background:#E9D6FF;
border-color:#A557FF;  
color:#000000;
}

/****************************************************************************/
/* Zum Teil spezielle Formatierung fuer Beispiele                           */
/* Bei Aenderung: Beispiele kontrollieren!!                                 */
/* Achtung: im Kopf von verschiedenen Kapiteln hat es noch mehr CSS-Angaben */
/****************************************************************************/

em {
font-style:italic;
}

/* provisorisch auf alt umgetauft am 2015-03-06 */ 
ul.alt {
margin:-0.3em 0 0.9em 1em;  /* Kontrolle: Normen/Allgemein */ 
list-style-type:disc;
}

/* Typisches Beispiel in /grundlagen/grundlagen/begriffe.php */ 

ul { 
margin-top:1em;             /* zugefügt am 2015-03-06 */
margin-left:-0.5em;
} 

/* class="link" */
ul.link { 
list-style-type:square;
margin-left:0;                /* geändert am 2021-07-28*/
} 

/* class="linkvideo" */
/* verwendet damit "Video-Wichtig" kleineres "padding" hat" */
ul.linkvideo { 
list-style-type:square;
margin-top:-0.8em;             
margin-left:0;               
margin-bottom:-0.5em;          /* neu am 2021-07-28*/
} 


/* Für Links, die fast ganz link den das Quadrat haben, wie z.B. in Tabellen */
/* class="linkrand" */
ul.linkrand { 
list-style-type:square;
margin-top:1em;             /* zugefügt am 2015-03-05 */
margin-left:-0.8em; 
} 

/* Für Links, die zum Beispiel in den News ohne linken Abstand sein sollen */
/* Beispiel div class="rand" */
/* class="rand" */
.rand { 
margin-left:-2em; 
}
 
/* Für Aufzählungen die links mit dem Text bündig sind */
/* Beispiel ul class="bund" */
/* class="bund" */
.bund {                                /* Achhtung: das geht nicht !!!!!!!!! */
margin-left:-1.2em; 
} 

ul.verzeichnis { 
/* class="verzeichnis" */
/* Für normales Inhaltsverzeichnis */
/* Für normales eingeschobenes Verzeichnis 1-9 */
/* Beispiel: /themen/klima/einfuehrung.php */
/* Beispiel: /grundlagen/normen/allgemein.php */
list-style-type:circle; 
margin: 0 0 0 -0.8em;
line-height:1.5em;
}

ul.verzeichnisa { 
/* class="verzeichnisa" mit grösserem Abstand oben */
/* Achtung: getrennte Verzeichnisse (mit neuem vereichnisa) */
/* Beispiel: http://vademecum.brandenberger.eu/themen/klima-1/co2.php */
list-style-type:circle; 
margin: 0.6em 0 0 -0.8em;
line-height:1.5em;
}

ul.verzeichnis-0 { 
/* class="verzeichnis-0" */
/* Für eingeschobenes Verzeichnis ohne Nummer vorher */
/* Beispiel: /include/klima/inhalt/treibhaus_effekt.php  */
list-style-type:circle;
margin:0 0 0 -1.5em;
line-height:1.5em;
}

ul.verzeichnis-1 { 
/* class="verzeichnis-1" */
/* Für normales eingeschobenen Inhaltsverzeichnis 10 und mehr (1-9 mit  ) */
/* Beispiel: /themen/klima/news.php */
/* Beispiel: /include/klima/erdtemp.php */
/* Beispiel: /include/klima/erdtemp.php */
list-style-type:circle;
margin:0 0 0 0;
line-height:1.5em;
}

ul.verzeichnis-a { 
/* class="verzeichnis-a" */
/* Für normales eingeschobenen Inhaltsverzeichnis a, b, c */
/* Beispiel: /themen/klima/news.php */
/* Beispiel: /include/klima/erdtemp.php */
/* Beispiel: /include/klima/erdtemp.php */
list-style-type:circle;
margin:0 0 0 -0.5em;
line-height:1.5em;
}

ul.verzeichnis-f { 
/* class="verzeichnis-f" */
/* Für fettes separates Inhaltsverzeichnis  */
/* Format grösser als fett und kleiner als h5 */
/* Beispiel: /themen/klima/ursache.php */
/* Beispiel: /themen/klima-1/oszillation.php */
/* Beispiel: /themen/klima-2/schwindel.php */
/* Beispiel: /themen/klima-2/hysterie.php */
/* Beispiel: /themen/klima-2/argumente.php (speziell fettes Verzeichnis) */
/* Beispiel: /include/klima/modell.php (speziell für line-height) */
list-style-type:circle; 
margin: 0.5em 0 0.2em -0.8em;
font-size:1.05em;
font-weight:bold;
line-height:1.3em;
}

ul.verzeichnis-2 {
/* class="verzeichnis-2" */
/* Für separates Verzeichnis unterhalb fetten Verzeichnistitel 1-9 */
/* Beispiel: /themen/klima/ursache.php */
/* Beispiel: /themen/klima-1/oszillation.php */
/* Beispiel: /themen/klima-2/schwindel.php */
list-style-type:circle;
margin:0 0 0 1.5em;
line-height:1.5em;
}

ul.verzeichnis-3 {
/* class="verzeichnis-3" */
/* Für separates Verzeichnis unterhalb fetten Verzeichnistitel 10 und mehr (1-9 mit  )*/
/* Beispiel: /themen/klima-2/hysterie.php */
/* Beispiel: /themen/skandal/manipulation.php */
list-style-type:circle;
margin:0 0 0 2.4em;
line-height:1.5em;
}

/* ul class="self" und das Bild mit Self wegnehmen  */
/* angewandt in  webbau/php/einleitung/test.php */
ul.self {
list-style-type:none;
margin-top:-1em; 
margin-left:6.8em;
}

/* in den Verzeichnissen den Abstand oberhalb li vergrössern*/
.lia {
margin-top:0.5em; 
}

/* in den Verzeichnissen den Abstand oberhalb li gross*/
/* in who is who Verzeichnis hier würde evtl 1em genügen */
/* in e_brand hier eher sogar 2em */
.liaa {
margin-top:1.5em; 
}

ol {
margin:0.9em 0 0.9em 3em;
padding:0;
}

ol li { /* Abstand oben und unten in den numerierten Aufzählungen */
margin:0.7em 0;
} 

/* a=class="a" Anker oben unsichtbar und mit Abstand zum folgenden Text */
.a { 
visibility:hidden;
margin:-3em 0 3.7em 0;
} 

/* a=class="a-top" Anker zuoberst anstatt top */
.a-top { 
visibility:hidden;
margin:-1.5em 0 3.7em 0;
} 

/* a=class="a_tabelle" Anker oben unsichtbar und mit Abstand zum Text in Tabelle */
.a_tabelle { 
visibility:hidden;
margin:-4.1em 0 4.7em 0;
} 

/* a=class="an" Anker oben unsichtbar mit nur kleinem Abstand im Text
Wird vor allem im Stichwortverzeichnis und bei "Übersicht" gebraucht */
.an { 
visibility:hidden;
margin:-4.7em 0 4.1em 0;
} 

/* class="b" Im Who: Pfeil nach oben, links oberhalb vom unteren Bild */
.b { 
margin-bottom:-1.2em;   /* geht nicht!!!! im Text p style="margin-bottom:-1.2em" */
} 

/* hr class="b" mit grösserem unterem Abstand (wenn unten z.B. gelb) */
hr.b {
background:#999;	/* setzt die Farbe */
height:1px;		/* ersetzt size=1  */
border:none;		/* ersetzt noshade */
margin-bottom:1.2em;
}

/* hr class="duenn" Dünner Trennstrich  */
hr.duenn {
background:#999;	/* setzt die Farbe */
height:1px;		/* ersetzt size=1  */
border:none;		/* ersetzt noshade */
}

/* hr class="ah" Nach dem Anker einen Trennstrich */
/* Anwendung in Who is who */
.ah { 
margin:-1em 0 0 0;
}

/* Mit span class="fett" kann Text fett hervorgehoben werden */
/* Abstand oben ist kleiner als ein Leerabstand */
.fett {
margin-top:-0.5em;
font-weight:bold;
}

/* Mit span class="fettgross" kann Text fett und etws grösser hervorgehoben werden */
/* Die Grösse ist etwas grösser als normal aber kleiner als mit h5 */
/* Das Margin wirkt nicht bei span="fettgross" sondern nur bei p class="fettgross"  */
.fettgross {
font-size:1.05em;
font-weight:bold;
margin:1em 0 -0.3em 0;
}


?E?

↑