/* =========================================================
Stylesheet für den Internetauftritt von Nicole Feuerle
Datei: bildschirm.css
Datum: Mai 2012
Autor: Thomas Feuerle
Aufbau:
1. Kalibrierung und Restauration
2. Allgemeine Styles
3. Styles für Layoutbereiche
4. Sonstige Styles
========================================================== */


/* =======================================
1. Kalibrierung und Restauration
======================================= */

/* * { padding: 0; margin: 0; }*/
/* erzwingt Scrollbar im Firefox */
html { height: 101%; }

  /* Abstand nach unten */
h2, p, ul, ol { margin-bottom: 1em; }

/* Verschachtelte Listen ohne Abstand */
ul ul { margin-bottom: 0; }

/* Abstand von links */
li { margin-left: 1em; }

/* =======================================
2. Allgemeine Styles
======================================= */

body {
  background-color: #8c8c8c;
  color: white;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: small;
}

h1 {
  font-size: 150%;
  color: rgb(153,40,76);
}
h2 {
  font-size: 130%;
  color: rgb(153,40,76);
}
h3 {
  font-size: 110%;
  color: rgb(153,40,76);
}
h4 {
  font-size: 100%;
  color: rgb(153,40,76);
}

  /* outline: none; */ /* nur wenn es Sie wirklich stört */
a { text-decoration: none; }

a:hover, a:focus { border-bottom: 1px solid #d90000; }
a:active {
  color: white;
  background-color: #d90000;
}
a:link { color: #d90000; }
a:visited { color: #cc6666; }

/* Skipling dadurch ausblenden, dass er weit außerhalb des Bildschirms platziert wird*/
.skiplink {
  position: absolute;
  top: -9999px;
  left: -9999px;
  width: 0;
  height: 0;
  font-size: 0;
  line-height: 0;
}

/* =======================================
3. Styles für die Layoutbereiche
======================================= */

div#wrapper {
  color: black;
  background-color: white;
  width: 99%;
  height: 99%;
  margin-top: 2px;
  margin-right: auto; /* Abstand rechts */
  margin-bottom: 2px;
  margin-left: auto; /* Abstand links */
}

div#kopfbereich {
  text-align: center; /* zentrieren */
  background-color: rgb(153,40,76);
  color: white;
}
#kopfbereich a {
  border-bottom: 0 solid #d90000;
  outline: none;
}

#kopfbereich p {
  padding: 5px 0 5px 0;
  margin-bottom: 0; /* war 1em */
}

div#textbereich {
  padding-left: 2%;
}

div#fussbereich {
  text-align: center; /* zentrieren */
  background-color: rgb(153,40,76);
  color: white;
  padding-top: 10px; /* unterhalb Rahmenlinie */
  border-top: 1px solid rgb(153,40,76); /* Linie oben */
  margin-top: 20px; /* oberhalb Linie */
  padding-bottom: 10px;
}

div#navibereich {
/*  padding-top: 10px;
  border-right: 1px solid rgb(153,40,76);
  margin-left: 0;
  width: 20%;
  height: 100%;
*/
  background-color: rgb(153,40,76);
  color: white;
  border-top: 1px solid black;
  border-bottom: 1px solid black;
}

#navibereich ul { margin-bottom: 10px; }
#navibereich li {
  display: inline;
  list-style-type: none;
  margin: 0;
}
#navibereich a {
  color: white;
  background-color: rgb(205,63,107);
  padding: 4px 8px 4px 8px;
  border: 1px solid black;
}

#startseite #navi01 a,
#babymassage #navi02 a,
#mobilemassage #navi03 a,
#preise #navi04 a,
#kontaktseite #navi05 a {
  color: black;
  background-color: white;
  border-bottom-color: white;
}

#navibereich a:hover,
#navibereich a:focus {
  color: white;
  /*background-color: rgb(153,40,76);*/
  color: black;
  background-color: white;
  border-bottom-color: white; /* war #d90000 */
}

#navibereich a:active {
  color: black;
  background-color: white;
  border-bottom-color: white;
}

#preise #textbereich {
padding-top: 1em;
}

#kontaktseite #textbereich {
padding-top: 1em;
}

address {
  text-align: center; /* zentrieren */
  font-size: 80%; /* etwas kleiner als der Rest */
  font-style: normal; /* normale Schrift, nicht kursiv */
  letter-spacing: 2px; /* Abstand zwischen den Buchstaben */
  line-height: 1.5; /* Zeilenabstand, ohne Einheit */
}

/* =======================================
4. Sonstige Styles
======================================= */

/* Das Kontaktformular */
form {
  background-color: rgb(153,40,76);
  color: white;
  width: 370px; /* Breite des Formulars */
  padding: 20px;
  border: 1px solid #8c8c8c;
}
label { /* Beschriftung auf eigener Zeile */
  display: block;
  cursor: pointer; /* Mauszeiger wird zur Hand */
}
input#absender,
textarea {
  width: 300px;
  border: 1px solid #8c8c8c;
  margin-bottom: 1em;
}
textarea {
  height: 7em;
}
input:focus,
textarea:focus {
  background-color: #d9d9d9;
}

/* Die Preistabelle */

table {
  background-color: rgb(205,63,107);
  color: white;
  border-collapse: collapse;
  border: none;
}
thead {
  background-color: rgb(153,40,76);
  color: white;
}
tfoot {
  background-color: #F7F1D4;
  font-size: 80%;
  border-top: 1px solid #999;
}
td, th {
  text-align: left;
  padding: 0.5em 1em;
}


/* =======================================
E N D E   D E S   S T Y L E S H E E T S
======================================= */