/*
***
Dieses Template wurde im Auftrag von Microsoft Deutschland erstellt.

Sowohl die Erstellung des Designs als auch die Umsetzung des Templates
wurden von Vladimir Simovic (www.perun.net) durchgeführt.
 ***
 */

body {
    margin: 0; padding: 0;
    font: 100% georgia, serif;
    background: #fff url(images/hintergrund.gif) repeat-x; color: #444;
    text-align: center;
}

/* Allgemeingueltige Klassen und Elemente */

a {
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}

img {
    border: 2px solid #ddd; padding: 5px;
}

blockquote {
    color: #555; font-style: italic;
}

code {
    font: 14px consolas, 'courier new', monospace;
    color: #900;
}

pre {
    overflow: auto; padding: 1em;
    background: #eee;
    border: 1px solid #ddd;
    font-size: 1em;
}

.kein-bild-effekt {
    border: none; padding: 0;
}

.bild-links { /* Diese Klasse vergeben Sie einem Bild welches links ausgerichtet werden soll */
    float: left;
    margin: .1em 1em .4em 0;
}

.bild-rechts { /* Diese Klasse vergeben Sie einem Bild welches rechts ausgerichtet werden soll */
    float: right;
    margin: .1em 0 .4em 1em;
}

bild-abstand {
    margin: 0 .5em .5em 0;
}

.center {
    text-align: center;
}

.clearer {
    clear: both; /* hebt die vorhergehenden Floats auf */
}

h1, h2, h3, h4, h5 {
    font-family: georgia, serif; font-weight: normal;
}


/*
* Hauptbereich #container
 */

#container {
    width: 51em; min-width: 816px; max-width: 98%; /* Ermöglich auch bei den älteren Browsern das Zoomen. */
    text-align: left; margin: 0 auto;
}


/*
* Hauptbereich: #container
** Unterbereich: #kopfbereich
 */

#kopfbereich {
    overflow: hidden; height: 1%; min-height: 1%;
}


/*
* Hauptbereich: #container
** Unterbereich: #kopfbereich
*** Abschnitt: #logo
 */

#logo {
    float: left;
}
#logo h1 {
    margin: 0; font-size: 1.875em; font-weight: normal; line-height: 1.15; margin-top: .4em;
}
#logo h1 span {
    color: #777; font-size: .5667em; font-style: italic;
}

#navigation {
    float: right;
}


/*
* Hauptbereich: #container
** Unterbereich: #kopfbereich
*** Abschnitt: #navigation
 */

#navigation ul {
    list-style: none; margin: 0; padding: 0;
}
#navigation li {
    display: inline;
}
#navigation a {
    float: left;
    display: block; padding: 3.5em 1em 1em 1em;
    color: #444; background: #eee;
    font-weight: bold; font-size: .75em; text-decoration: none;
}

/* Farbliche Abwandlungen der einzelnen Navigationspunkte */
#navigation .navi1 {
    border-top: .5em solid #b21;
}
#navigation .navi1:hover, #navigation .aktiv .navi1 {
    background: #b21; color: #fff;
}
#navigation .navi2 {
    border-top: .5em solid #09a;
}
#navigation .navi2:hover, #navigation .aktiv .navi2 {
    background: #09a; color: #fff;
}
#navigation .navi3 {
    border-top: .5em solid #e60;
}
#navigation .navi3:hover, #navigation .aktiv .navi3 {
    background: #e60; color: #fff;
}
#navigation .navi4 {
    border-top: .5em solid #6a3;
}
#navigation .navi4:hover, #navigation .aktiv .navi4 {
    background: #6a3; color: #fff;
}
#navigation .navi5 {
    border-top: .5em solid #49f;
}
#navigation .navi5:hover, #navigation .aktiv .navi5 {
    background: #49f; color: #fff;
}


/*
* Hauptbereich: #container
** Unterbereich: #mittelbereich
*** Abschnitt: #navigation
 */

#mittelbereich {
    clear: left; padding-top: 2em;
}

#mittelbereich h2 {
    font-size: 1.375em; margin: 1.5em 0 .5em 0;
}
#mittelbereich h3 {
    font-size: 1.2666em;
    margin: 1.25em 0 .1em 0;
}
#mittelbereich h4 {
    font-size: 1.1333em; font-style: italic;
    margin: 1.25em 0 .1em 0;
}
#mittelbereich h5 {
    font-size: 1em; font-weight: bold;
    margin: 1.25em 0 .2em 0;
}

/*
* Hauptbereich: #container
** Unterbereich: #mittelbereich
*** Abschnitt: #inhalt
 */

#inhalt {
    float: left; width: 34em;
    font-size: .9375em;
}
#inhalt h2 {
    margin: 0 0 .5em 0; font-size: 1.4667em; font-weight: normal;
}

/*
* Hauptbereich: #container
** Unterbereich: #mittelbereich
*** Abschnitt: #sidebar
 */

#sidebar {
    float: right; width: 17.667em; font-size: .9375em;
}
#sidebar h2 {
    margin: 0;
    font-size: 1.4667em; font-weight: normal;
}

#sidebar ul, #sidebar ol {
    padding: 0; margin-left: 2em;
}


/*
* Hauptbereich: #footer
 */
#footer {
    border-top: .154em solid #ddd; padding: 1em;
    background: url(images/hintergrund.gif) repeat-x; color: #555;
    font-size: .9375em;
    height: 5.5em; min-height: 5.5em;
    margin-top: 3em;
}

#footer p {
    margin-top: 0;
}


/*
Einzelnen Unterseiten: farbliche Hervorhebung.

*** Startseite: "rote Farbe" ***
*/

#startseite {
    border-top: .563em solid #b21;
}

#startseite a {
    color: #b21;
}

#slogan h2, #slogan p {
    margin: 0;
}
#slogan h2 {
    font-size: 2em; color: #555;
}
#slogan p {
    font-style: italic; color: #777;
}

/* Spalten auf der Startseite */
#spalte1, #spalte2, #spalte3, #spalte1-breit {
    font-size: .9375em; width: 17em;
}
#spalte1-breit, #spalte2-breit {
    font-size: .9375em; width: 26em;
}

#spalte1, #spalte2, #spalte1-breit {
    float: left;
}
#spalte1, #spalte1-breit {
    margin-right: 25px;
}
#spalte3, #spalte2-breit {
    float: right;
}
#spalte1 p, #spalte2 p, #spalte3 p, #spalte1-breit p, #spalte2-breit p {
    margin-top: 0;
}


/*
*** Über mich: "Tuerkis" ***
*/

#ueber-mich {
    border-top: .563em solid #09a;
}
#ueber-mich a {
    color: #09a;
}

/*
*** Leistungen: "Orange" ***
*/

#leistungen {
    border-top: .563em solid #e60;
}
#leistungen a {
    color: #e60;
}

/*
*** Referenzen: "Gruen" ***
*/

#referenzen {
    border-top: .563em solid #6a3;
}
#referenzen a {
    color: #6a3;
}

/*
*** Impressum: "Blau" ***
*/

#impressum {
    border-top: .563em solid #49f;
}
#impressum a {
    color: #49f;
}