* {
    margin: 0;
    padding: 0;
    font-family:  Arial, Helvetica, sans-serif;
}

html, body {
    height: 100%;
    width: 100%;
}

body {
    background:#fff;
/*  line-height:100%;*/



    }

/*  Die Textgrafiken als Textversion */
#textversion{
    border: 1px solid green;
    color:green;
    font-size: 1.4em;
    position:absolute;
    left:0px;
    z-index:0;
}
#textversionreden{
    color: #9990C7;
    font-size: 3em;
    position:absolute;
    left:200px;
    width:400px;
    z-index:0;
}
#textversionsusanne{
    color: #9C0B53;
    font-size: 3em;
    position:absolute;
    left:200px;
    top:2em;
    width:400px;
    z-index:0;
}
#textversionmut{
    color:#C8E2BB;
    font-size: 7em;
    position:absolute;
    left:600px;
    width:200px;
    z-index:0;
}




#wrapper{
    margin: 0px auto;
    background:#fff;
    color:black;
    position:relative;
    z-index:1;
    width: 980px;
    text-align:left; /* damit der IE sauber zentriert */
    min-height:750px;

}

#hintergrund{    /* grauer Verlauf unterhalb von Photo bis zum footer  */
    padding:0px;
    z-index:1;
    background-image:url("hintergrund_unten.gif");
    background-repeat:repeat-y;
    background-position:top center;
    min-height:750px;
    height:auto !important;
    height:750px;
    }

#hintergrund_weiss {
    display:block;
    width:980px; height:32px;
    z-index:2;
    overflow:hidden;
    position:absolute;
    background:#ffffff;
    left:0px;
    top:0px;
}


#hintergrund_rechts {
    display: none;
    z-index:1;
    width:416px; height:707px;
    background-image:url("hintergrund_rechts.png");
    background-repeat:repeat-x;
    overflow:hidden;
    position:absolute;
    left:530px;
    top:0px;
}

#hintergrund_komplett {
    z-index:4;
    display:none;
/*    display:block; */
    width:980px; height:707px;
    background-image:url("design_rea.jpg");
    background-repeat:no-repeat;
    overflow:hidden;
    position:absolute;
    left:0px;
    top:0px;
}


a#logohome {
    display:block;
    width:250px; height:200px;
    z-index:5;
    overflow:hidden;
    position:absolute;
/*    background-image:url("logo.png");
    background-repeat:no-repeat;
    */
    left:14px;
    top:45px;
}

#photo_index, #photo_impressum,#photo_mit_wem_ich_arbeite,#photo_ohne_scheu_im_business,#photo_redeschule_fuer_zurueckhaltende,#photo_was_ich_anbiete,#photo_was_ich_ihnen_schenke,#photo_was_sie_erwartet,#photo_wen_ich_empfehle,#photo_wer_ich_bin,#photo_wie_sie_mich_erreichen {
    display:block;
    z-index:2;
    background-repeat:no-repeat;
    overflow:hidden;
    position:absolute;
/* pschroefl: Positionen bei geteiltem Logo
    left:113px;
    top:33px;
    width:427px;
    height:674px;
*/
/* pschroefl: Positionen bei ungeteiltem Logo, aber eigenem MUT
    left:0px;
    top:0px;
    width:535px;
    height:707px;
*/
/* pschroefl: Positionen bei ungeteiltem Hintergrund lt. Vorlage */
    left:0px;
    top:0px;
    width:980px;
    height:707px;


}
#photo_index {
    background-image:url("gphoto_index.jpg");
}
#photo_ohne_scheu_im_business{
    background-image:url("gphoto_ohne_scheu_im_business.jpg");
}
#photo_impressum {
    background-image:url("gphoto_impressum.jpg");
}
#photo_mit_wem_ich_arbeite    {
    background-image:url("gphoto_mit_wem_ich_arbeite.jpg");
}
#photo_ohne_scheu_im_business {
    background-image:url("gphoto_ohne_scheu_im_business.jpg");
}
#photo_redeschule_fuer_zurueckhaltende {
    background-image:url("gphoto_redeschule_fuer_zurueckhaltende.jpg");
}
#photo_was_ich_anbiete {
    background-image:url("gphoto_was_ich_anbiete.jpg");
}
#photo_was_ich_ihnen_schenke {
    background-image:url("gphoto_was_ich_ihnen_schenke.jpg");
}
#photo_was_sie_erwartet {
    background-image:url("gphoto_was_sie_erwartet.jpg");
}
#photo_wen_ich_empfehle {
    background-image:url("gphoto_wen_ich_empfehle.jpg");
}
#photo_wer_ich_bin                 {
    background-image:url("gphoto_wer_ich_bin.jpg");
}
#photo_wie_sie_mich_erreichen {
    background-image:url("gphoto_wie_sie_mich_erreichen.jpg");
}


#text_RUHE,#text_RAUM,#text_MUT,#text_KRAFT,#text_FREUDE {
/*    display:block;*/
    display:none;
    width:390px; height:150px;
    z-index:2;
    background-repeat:no-repeat;
    overflow:hidden;
    position:absolute;
    left:585px;
    top:13px;
}
#text_RUHE{
    background-image:url("text_RUHE.png");
}
#text_RAUM{
    background-image:url("text_RAUM.png");
}
#text_MUT{
    background-image:url("text_MUT.png");
}
#text_KRAFT{
    background-image:url("text_KRAFT.png");
}
#text_FREUDE{
    background-image:url("text_FREUDE.png");
}


#bogen {
/*    display:block;*/
    display:none;
    width:120px; height:250px;
    z-index:2;
    background-image:url("bogen.png");
    background-repeat:no-repeat;
    overflow:hidden;
    position:absolute;
    left:861px;
    top:124px;
}

#footer{
    z-index:4;
    color: #38378b;
    background:#fff;
    background-image:url("streifenrot.gif");
    background-repeat:no-repeat;
/*    background-position:top center;  */
    bottom:0px;
/*    left:50% 490px;*/
    height:2.5em;
    padding-top:1em;
    width:980px;
    text-align:center;
    font-size: 0.60em;
    line-height: 0.75em;
}


#footer a:link{
    color: #38378b;
    text-decoration:none;
    }
#footer a:hover{
    color: #38378b;
    text-decoration:none;
    }
#footer a:visited{
    color: #38378b;
    text-decoration:none;
    }
#footer a:active{
    color: #38378b;
    text-decoration:none;
    }



/*  */
ul {
    list-style:disc;
/*    list-style-position:inside;*/
    list-style-position:outside;
    margin-left:0em;
    padding-left:0px;
}

li {
    margin-left:0em;
    padding-left:0px;
}


/* pschroef: Wegen der unterschiedlichen Standardschriftgrößen in IE und FF
gibts dafür eine Browserweiche.
*/
ul#navigation {
    position:relative;
    float: left;

    z-index:4;
    top: 250px;
    left: 0px;
    width: 450px;
    font-size: 0.6em;
    line-height: 1.85em;
    padding-left:20px;
    font-size: 0.8em;
    line-height: 1.75em;
}

ul#navigation ,
ul#navigation1 ,
ul#navigation2 {
    list-style:none;
    color:#38378b;
    }

/*damit die Menühinterlegung länger wird, ein nbsp*/
ul#navigation a:after {
    content:'\A0';
}

ul#navigation1 {
    /* text-transform: uppercase; */
    padding-left:20px;
    list-style:disc;
    }

ul#navigation2 {
    text-transform: none;
    list-style:none;
    padding-left:20px;
    }

ul#navigation a {
    font-weight: bold;
    text-decoration:none;
    color:#38378b;
    background:white;
    border: 0px
    }


/* pschroefl: Transparente png ausprobiert.
Es gibt z.Zt. vierteltransparent.png und halbtransparent.png.
Wenn wir das so machen sieht es im IE6
nicht sehr schön aus (blaugrauer Hintergrund). Ich hab daher für den IE das background:white
weitervererbt. Es gibt aber einige Hacks, um im IE6 transparente png
sauber darzustellen. Muß ich aber erst probieren.
Bitte um Feedback, ob ich das tun soll.

Das folgende wird von IE6 nicht interpretiert
*/
ul[id]#navigation a {
    background: transparent;
    background-image:url("vierteltransparent.png");
    background-repeat:repeat;
    }




/* pschroefl: statt text-decoration:underline schlage ich border-bottom vor
das kann man besser einzeln formatieren, und es macht die Linie
nicht über die Unterlänge der Buchstaben

Ich würde jedoch vorschlagen, in der Navigation ein anderes Schema zu verwenden:
* generell keine Unterstreichungen
* eine dunklere Farbe zur Kennzeichnung, auf welcher Seite ich mich gerade befinde
* Diese Farbe auch für hover und active verwenden
*/
ul#navigation a:hover {

    /* border-bottom: 2px solid #928bae;  */
    color:#9A004E;
    }

ul#navigation1 a:hover {
    /* border-bottom: 2px solid #38378b; */
    color:#9A004E;
    }


ul#navigation a:active {
    color: #9A004E;
    }

ul#navigation1 a:active {
    color: #9A004E;
    }

ul#navigation  a.auswahl{
    color:#9A004E;
}
ul#navigation1  a.auswahl{
    color:#9A004E;
}




div#Inhalt {
  /*border: 1px solid blue;*/
  z-index:4;
  margin-left: 478px;
  padding: 0em;
  width: 440px;
  position:relative;
  top: 188px;
/* pschroefl: und hier die Definitionen den IE6 */
  font-size: 0.843em;
  line-height:1.40em;
  font-size: 0.843em;
  line-height:1.40em;
}

div#Inhalt p {
    padding-bottom:1.0em;
}

div#Inhalt h1 {
    padding: 0.5em 0 0.5em;
    color: #38378b;
    font-weight: normal;
    font-size: 180%;
}

div#Inhalt h2 {
    /*margin: 1em 0 1em;*/
    padding: 0.5em 0 0.5em;
    color: #38378b;
    font-weight: normal;
    font-size: 130%;
}

div#Inhalt ul {
    list-style:disc;
    list-style-position:inside;
    margin-left:0em;
    padding-left:0px;
    }

div#Inhalt li {
    margin-left:0em;
    padding-left:0px;
}



div#Inhalt  {
  /*margin: 1em 0;*/
}
div#Inhalt a:link{
  color: #000;
  text-decoration:underline;
}
div#Inhalt a:hover{
  color: #000;
  text-decoration:underline;
}
div#Inhalt a:visited{
  color: #000;
  text-decoration:underline;
}
div#Inhalt a:active{
  color: #000;
  text-decoration:underline;
}


div#Inhalt h2 a:link{
  color: #38378b;
  text-decoration:underline;
}
div#Inhalt h2 a:hover{
  color: #38378b;
  text-decoration:underline;
}
div#Inhalt h2 a:visited{
  color: #38378b;
  text-decoration:underline;
}
div#Inhalt h2 a:active{
  color: #38378b;
  text-decoration:underline;
}



div#Inhalt li  {
/*  margin: 1em 0;*/
}




.anfuerungszeichen {
  font-size:6em;
  color:#98b28B;
    }

blockquote {
    color: #84C45B;
    font-weight: normal;
    text-align: right;
    font-size:100%;
    padding-left: 4em;
/*
  text-align:right;
  position:relative;
  left:40px;
  float:right;
  */


    }
.autor {
  font-size:90%;
    color: #84C45B;
    }



em {
    color: #38378b;
    font-weight: bold;
    font-style:normal;

}

/* fixxme: eigentlich sollte hier kein spacer notwendig sein
aber ohne spacer hängt der Text unten raus*/
#abstand_nach_text{
    padding-bottom:18em;
    }

/* damit immer ein vertikaler scrollbar da ist
und daher diee zentrierte Seite nicht dauernd um eine halbe Scrollbarbreite hüpft*/
#abstand_nach_footer{
    padding-bottom:500px;
    }

#w3c {
/*    background-image:url("w3c.gif");
    background-repeat:no-repeat; */
    position:absolute;
    right:10px;
    bottom:25px;
    width:150px;
    font-size:80%;
    color:#444444;
    }
#w3c em {
    color:#02589A;
}
#w3c  {
    text-decoration:none;
}

/****************** Stile Rea *********************/

.rot  {
color:#9A004E
}