/* ------------------------------------------------------- */
/* ------ CSS-Steuerung für www.die-reblaus.com ---------- */
/* ------------------------------------------------------- */

/* ------------------------------------------------------- */
/* ----------        allgemeine Angaben         ---------- */
/* ------------------------------------------------------- */
* {
   margin:0;
   padding:0;
   }

body {
   text-align: center;
   height: 101%;
   background-color: #EFEFEF;
}

h1, h2, h3, h4 {
   color: #8C1E34;
   font-weight: bold;
   padding-bottom: 5px;
   text-align: center;
}

h1 {
   font-size: 1.5em;
}

h2 {
   font-size: 1.3em;
   text-decoration: underline;
}

h3 {
   font-size: 1em;
}

h4 {
   font-size: 0.8em;
   text-decoration: underline;
}

a:active, a:focus {
   outline: none;
}

/* ------------------------------------------------------- */
/* ----------                Boxes              ---------- */
/* ------------------------------------------------------- */

#wrapper {
   width: 80%;
   margin: 0 auto;
   height: 100%;
}

#kopfbereich {
   position: fixed;
   top: 5px;
   width: 80%;
   height: 70px;
   margin: 0 auto;
   border-bottom: 5px solid #8C1E34;
   z-index: 5;
}

#kopfbereich h3 {
   float: left;
   font-size : 2em;
   font-weight: bold;
   letter-spacing: 0.2em;
}

/* Fix ie6 */
* html #kopfbereich {
  width: 96%;
  height: 75px;
  margin-left: 0;
  margin-bottom: 5px;
}

/* Fix ie7 */
*+ html #kopfbereich {
  left: 10%;
}

#logo_links {
   color: #8C1E34;
   float: left;
   margin-top: 5px;
   line-height: 1.5em;
   text-align: center;
}

#logo_links h3 {
   font-size: 1.7em;
}

#logo_links p {
   font-size: 0.6em;
}

#logo_rechts {
   float: right;
   margin-top: 15px;
   height: 50px;
   width: 230px;
}

#logo_mitte {
   float: left;
   margin-top: 0;
   margin-left: 30px;
}
#logo_mitte img {
   border: none;
}

#facebook {
   position: fixed;
   top : 51px;
   left: 820px;
}

#zoomsearch {
   position: fixed;
   top : 51px;
   left: 770px;
}

#deko {
   position: fixed;
   top: 71px;
   float: left;
   z-index: 1;
}

/* Fix ie7 */
*+ html #deko {
  left: 10%;
}

#datenbereich {
   position: absolute;
   top: 85px;
   left: 33%;
   width: 57%;
   height: 75%;
   border-top: 5px solid #8C1E34;
   z-index: 1;
}

* html #datenbereich {
   left: 31.3%;
   width: 69%;
}

/* Text (z.B. bei Bilder, 'fahren Sie mit der Maus...'), der im IE6 nicht angezeigt wird, da
   die Funktion (z.B. Bilder in gross anzeigen) nicht funktioniert...*/
* html .nicht_ie6 {
   display: none;
}

#inhalt {
   position: relative;
   height: 100%;
   width: 99%;
   padding-top: 10px;
   padding-right: 10px;
   overflow: auto;
   z-index: 1;
   }

#inhalt p {
   margin-bottom: 1em;
}

#bildeingang {
   float: center;
   margin-right: 30px;
   margin-bottom: 5px;
   width: 30%;
}

#bildterasse {
   margin-right: 10px;
   margin-bottom: 5px;
   padding-bottom: 50px;
   width: 30%;
}

#bildtoni {
   float: left;
   margin-right: 10px;
   margin-bottom: 5px;
}

#gruss h3 {
   border-top: 70px;
}

#oeffnungszeiten {
   font-weight: bold;
   text-align: center;
   /*display: block;*/
   padding-bottom: 10px;
   margin-top: 1em;
   margin-bottom: 1em;
   border-bottom: 3px solid #8C1E34;
}

#googlemap {
   margin: auto;
   width: 460px;
   height: 400px;
   padding:5px;
   font-weight: bold;
   /*display: block;*/
   border: 3px solid #8C1E34;
   background-color: white;
}

/* Kontaktformular */
#kontaktform {
   width: 80%;
   margin: 0 auto;
}

#kontaktform td {
   height: 30px;
}

#kontaktform td.sp1 {
   width: 150px;
   text-align: left;
   padding: auto auto auto 5px;
}

#kontaktform td.sp2,
#kontaktform td.sp2 h2 {
   width: 400px;
   text-align: left;
   padding: auto auto auto 5px;
}

#kontaktform td.sp2 input,
#kontaktform td.sp2 textarea {
   width: 340px;
   border: 1px solid #6F6F6F;
   text-align: left;
   padding: auto auto auto 5px;
}

#kontaktform td.sp2 input:focus,
#kontaktform td.sp2 textarea:focus {
   border: 3px groove #6F6F6F;
}

#kontaktform td.button {
   text-align: left;
}

/* ------------------------------------------------------- */
/* ----------            Bildershow             ---------- */
/* ------------------------------------------------------- */
.bild_popup {
    position: fixed;
    right: 7%;
    top: 120px;
    border: 3px solid #7F7F7F;
    padding: 3px;
    height: 320px;
    /*height: 380px;*/
    display: none;
}

/*#datenseite a:hover .bild_popup {*/
a:hover .bild_popup {
    display: block;
}

.hover {
   text-align: center;
   width: 85%;
   margin: auto;
   padding-top: 5px;
   padding-bottom: 5px;
   border-top:  3px solid #8C1E34;
}

.hoverbox {
    cursor: default;
    list-style: none;
}

.hoverbox a {
    cursor: default;
}

.hoverbox a .preview {
    display: none;
}

.hoverbox a:hover .preview {
    display: block;
    position: fixed;
    top: 20%;
    left: 10%;
    z-index: 1;
    padding: 10px;
    border: 5px solid #8C1E34;
    background-color: #EFEFEF;
    }

.hoverbox img {
    border-style: none;
    padding: 2px;
    vertical-align: top;
    width: 100px;
    height: 75px;
}

.hoverbox li {
    border: 1px solid #8C1E34;
    display: inline-block;
    /*float: left;*/
    margin: 3px;
    padding: 5px;
}

/* Fix ie6 */
* html .hoverbox li {
   display: inline;
}

/* Fix ie7 */
*+ html .hoverbox li {
   display: inline;
}

.hoverbox .preview {
    border-color: #8C1E34;
    width: 350px;
    height: 250px;
}
/* ------------------------------------------------------- */
/* ----------       weitere Definitionen        ---------- */
/* ------------------------------------------------------- */
.clearfloat { clear: both; } /* 'Clearing von gefloateten Abschnitten */

.center { text-align: center; }

.left { text-align: left; }

.seitenende {
   width: 100%;
   margin-top: 5px;
   border-top: 2px solid #8C1E34;
}

ul.text_liste {
   list-style: none;
   font-weight: bold;
   border-bottom: 3px solid #8C1E34;
   padding-bottom: 1em;
   margin-bottom: 1em;
}

ul.speisen_liste {
   margin-top: 1em;
   list-style: none;
}

ul.speisen_liste h3 {
   text-decoration: underline;
}

.linkspeisen { /* Definiert die Links zu Speisekarten */
   text-align: left;
   list-style: url(../images/hand_rechts.gif) inside none;
   font-size: 1.2em;
   font-weight: bold;
   padding-top: 0.5em;
   padding-bottom: 1em;
}

.linkspeisen li {
   padding-bottom: 5px;
}

.linkspeisen a {
   color: #6F6F6F;
}

.speisekarte { /* Definition des Bereichs, in dem die Speisekarten angezeigt werden (als iframe eingefügt) */
   width: 100%;
   height: 100%;
   margin: 0 auto;
   text-align: left;
   overflow: scroll;
   background-color:#EFEFEF;
}

.karten { /* Definition der Speisekarten,die durch Toni gepflegt werden */
   text-align: center;
}

a.begriff { /* Begriffserklärung */
   color : #5F5F5F;
   font-style: italic;
   font-weight: bold;
   text-decoration: none;
}
/*========================================================
  Ende Stylesheet
======================================================= */