/* ======================================
  1. Allgemeine Styles
  ====================================== */
body {
    color: black;
    background: #E4C7A5 url(Bilder/bg_beige2_5_900.jpg) repeat-x top left;

}



h1 { font-size: 150%; }
h2 { font-size: 130%; }
h3 { font-size: 110%; }
address {
  text-align: center;
  font-size: 80%;
  font-style: normal;
  letter-spacing: 2px;
  line-height: 1.5;
}
a {
  text-decoration: none;
  /* outline: none; */ /* nur wenn es Sie wirklich stört */
}
a:link { color: #000000; }
a:visited { color: #000000; }
a:hover,
a:focus { color: #0000CD;
  border-bottom: 0px solid #0000CD;
}
a:active {
  color: white;
  background-color: #d90000;
}
/* Allgemeine Klassen und IDs */
img#logo {
  background-color: white;
  color: black;
  padding: 10px;
  border: 0px solid #d9d9d9;
}
.bildlinks {
  float:left;
  padding: 3px;
  border: 0px solid #ccc;
  margin-right: 10px;
  margin-bottom: 10px;
}
.bildrechts {
  float:right;
  padding: 3px;
  border: 0px solid #ccc;
  margin-bottom: 10px;
  margin-left: 10px;
}

/* ======================================
  2.  Styles für die Layoutbereiche
  ====================================== */
#wrapper {
  background-color: #FFFFFF;
  color: black;
  width: 720px;
  margin: 10px auto;
}
#kopfbereich {
  position: relative;
  background: #ffffff;
  color: black;
  padding: 10px 20px 8px 20px;
}
  #kopfbereich h1 { margin-bottom: 0; }
  p#slogan {
    position:absolute;
    top: 10px ;
    right: 20px ;
    padding: 5px 0 5px 100;
    margin-bottom: 0;
  }
  p#slogan span {
    color: #d90000;
  }

#textbereich {
  padding: 5px 20px 0px 20px;
    border-bottom: 0px solid #d90000;
}
  #textbereich a {
  border-bottom: 0px dotted #cc0000;
}
  #textbereich a:hover,
  #textbereich a:focus {
    border-bottom: 0px solid #d90000;
  }
#fussbereich {
  padding: 10px 20px 20px 20px;
  border-top: 0px solid #8c8c8c;
  border-bottom: 0px;
  margin-top: 0;
     color:#000000;
}
#fussbereich p {
  text-align: center;
  font-size: 80%;
  letter-spacing: 2px;
  line-height: 1.5;
}

#box1 {
/*   position:relative;
   left: 0px;
   top: 5px;*/
   display: table;
         float:left;
   width: 300px;
   height:70px;
   border: 1.5pt solid #EFC39E;
   padding: 3px 3px 3px 3px;
            margin:0px 3px 0px 0px;
   background-color:#E46C0A;
   text-align:center;
   font-family:'Copperplate Gothic Light', 'Times New Roman', serif;
   font-size: 1.5em;
   color:#000000;
}

#box2 {
/*   position:relative;
   left: 320px;
   top: -77px;*/
   display: table;
   width: 350px;
   height:70px;
   border: 1.5pt solid #93CCDD;
   padding: 3px 3px 3px 3px;
         margin:0px 0px 0px 3px;
   background-color:#215968;
   text-align:center;
   font-family:'Copperplate Gothic Light', 'Times New Roman', serif;
   font-size: 1.5em;
   color:#FFFFFF;
}

#box3 {
/*   position:relative;
   left: -1px;
   top: -74px;*/
   display: table;
            float:left;
   width: 300px;
   height:70px;
   border: 1.5pt solid #93CCDD;
   padding: 3px 3px 3px 3px;
      margin:3px 3px 0px 0px;
   background-color:#215968;
   text-align:center;
   font-family:'Copperplate Gothic Light', 'Times New Roman', serif;
   font-size: 1.1em;
   color:#FFFFFF;
}


#box4 {
/*   position:relative;
   left: 320px;
   top: -155px;*/
   display: table;
   width: 350px;
   height:70px;
   border: 1.5pt solid #EFC39E;
   margin:3px 0px 0px 5px;
   padding: 3px 3px 3px 3px;
   background-color:#E46C0A;
   text-align:center;
   font-family:'Copperplate Gothic Light', 'Times New Roman', serif;
   font-size: 1.1em;
   color:#ffffff;
}


#box5 {
/*   position:relative;
   left: -1px;
   top: -74px;*/
   display: table;
   float:left;
   width: 665px;
   height: 100px;
   border: 1.5pt solid #93CCDD;
   padding: 3px 3px 5px 3px;
      margin:3px 3px 0px 0px;
   background-color:#215968;
   text-align:center;
   font-family:'Copperplate Gothic Light', 'Times New Roman', serif;
   font-size: 1.1em;
   color:#FFFFFF;
}


#box6 {
/*   position:relative;
   left: -1px;
   top: -74px;*/
   display: table;
   float:left;
   width: 665px;
   border: 1.5pt solid #EFC39E;
   padding: 5px 3px 3px 3px;
      margin:0px 3px 3px 0px;
   background-color:#E46C0A;
   text-align:center;
   font-family:'Copperplate Gothic Light', 'Times New Roman', serif;
   font-size: 1.2em;
   color:#ffffff;
}

#box7 {
/*   position:relative;
   left: -1px;
   top: -74px;*/
   display: table;
   float:left;
   width: 665px;
   border: 2pt solid #EFC39E;
   padding: 3px 3px 3px 3px;
   margin:0px 3px 3px 3px;
   text-align:center;
   color:#000000;
}

#box7 hr{
...clear: both;
   width: 0;
   height: 0;
   font-size: 0;
   line-height: 0;
}

.clearing { clear: both; }

/* ======================================
  4. Sonstige Styles
  ====================================== */
/* Das Kontaktformular */
form {
  background-color: #d9d9d9;
  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#besuchername,
input#besuchermail,
textarea {
  width: 300px;
  border: 1px solid #8c8c8c;
  margin-bottom: 1em;
}
input:focus,
textarea:focus {
  background-color: #ffeda0;
}

/* Die kleine Galerie */
div.galerie1 {
   overflow: hidden; /* zum Einschließen der gefloateten Fotos */
   float: left;
   padding: 25px 10px 10px 10;
   margin: 0 0px 0px 0;
 }
div.galerie1 img {
   float: left;
   padding: 15px;
   margin-right: 10px;
   margin-bottom: 15px;
   margin-left:20px;
}


div.galerie2 {
   overflow: hidden; /* zum Einschließen der gefloateten Fotos */
   float: left;
   padding: 2px 1px 1px 1px;
   margin: 0 40px 0px 40px;
 }
div.galerie2 img {
   float: left;
   padding: 1px;
   margin-right: 40px;
   margin-bottom: 2px;
   margin-left:40px;
}


#bild1 {
/*   position:relative;
   left: 0px;
   top: 5px;*/
   clear: both;
   float:left;
   width: 250px;
   height:70px;
   border: 0pt solid #EFC39E;
   padding: 3px 3px 3px 3px;
            margin:0px 30px 0px 30px;
   background-color:none;
   text-align:center;
   font-family:'Copperplate Gothic Light', 'Times New Roman', serif;
   font-size: 1.5em;
   color:#000000;
}

#bild2 {
/*   position:relative;
   left: 320px;
   top: -77px;*/
   display: table;
   width: 250px;
   height:70px;
   border: 0pt solid #93CCDD;
   padding: 3px 3px 3px 3px;
   margin:30px 0px 0px 3px;
   background-color:none;
   text-align:center;
   font-family:'Copperplate Gothic Light', 'Times New Roman', serif;
   font-size: 1.5em;
   color:#FFFFFF;
}



/* Sternchen-Hack und Holly-Hack
   bewirken hasLayout im IE6 */
* html div.galerie { height: 1%; }

/* =======================================
   E N D E   D E S   S T Y L E S H E E T S
   ======================================= */