/* ===========================================
      Stylesheet für s' Supperl
      11.12.2011
      Georgia Farys
 
      1. Kalibrierung und allgemeingültige Styles
      2. Styles für die Layout-Bereiche
      3. Sonstige Styles 
      =========================================== */

   /* ===========================================
      1. Kalibrierung und allgemeingültige Styles 
      =========================================== */

    /* Kalibrierung der wichtigsten Abstände */
 
* {
   margin: 0;
   padding: 0;
   }

     /* Allgemeine Selektoren */

html {
   height: 100.01%;
   }

body {
   font-family: Trebuchet, Arial, Verdana, sans-serif;
   font-size: 62.5%;
   color: #5a2100;
   background: #ffffff;
   }


     /* Allgemeine Hyperlinks */

img, a img { border: 0; }


   /* Allgemeine Klassen und IDs */


h1 {
   color: #5a2100;
   background-color: #ffffff;
   font-size: 1.6em;
   padding: 0;
   display: block;
   }
h2 {font-size: 1.4em;
   }
h3 {font-size: 1.2em;
   }
h4 {font-size: 1em;
   }
h5 {font-size: 0.9em;
   }
h6 {font-size: 0.8em;
}

h2, h3, h4, h5, h6 {
   color: #5a2100;
   background-color: #ffffff;
   padding: 0.2em 0;
}

table {
   margin: 0;
   padding: 0;
   }
tr {
   margin: 0;
   padding: 0;
   }
th {
   margin: 0;
   padding: 0;
   }
td {
   margin: 0;
   padding: 0;
   }

address {
   margin: 0;
   padding: 0;
   color: #5a2100;
   background-color: #ffffff;
   }

p {
   margin: 0;
   padding: 0;
   color: #5a2100;
   background-color: #ffffff;
   }

a {
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   color: #5a2100;
   background-color: #ffffff;
   }
a:visited {
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   color: #5a2100;
   background-color: #ffffff;
   }
a:hover, 
a:focus, 
a:active {
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   color: #ffffff;
   background-color: #5a2100;
   }

fieldset {
   float: left;
   margin: 0;
   padding: 10px;
   color: #0072a6;
   background-color: #ffffff;
   border: 2px solid #0072a6;
   }
label {
   float: left;
   margin: 0;
   padding: 2px;
   width: 150px;
   display: block;
   border: 1px solid #0072a6;
   }

input {
   float: left;
   margin: 0;
   padding: 2px;
   width: 200px;
   color: #0072a6;
   background-color: #ffffff;
   border: 2px solid #0072a6;
   }
input:focus, input:active, input:hover {
   float: left;
   padding: 2px;
   width: 200px;
   color: #0072a6;
   background-color: #cecece;
   border: 2px solid #0072a6;
   }

select {
   float: left;
   margin: 0;
   padding: 2px;
   width: 200px;
   color: #0072a6;
   background-color: #ffffff;
   border: 2px solid #0072a6;
   }
select:focus, select:active, select:hover {
   float: left;
   padding: 2px;
   width: 200px;
   color: #0072a6;
   background-color: #aeaeae;
   border: 2px solid #0072a6;
   }

textarea {
   float: left;
   margin: 0;
   padding: 2px;
   width: 200px;
   color: #0072a6;
   background-color: #ffffff;
   border: 2px solid #0072a6;
   }

textarea:focus, textarea:active, textarea:hover {
   float: left;
   padding: 2px;
   width: 200px;
   color: #0072a6;
   background-color: #cecece;
   border: 2px solid #0072a6;
   }

checkbox {
   float: left;
   margin: 0;
   padding: 2px;
   width: 20px;
   font-size: 1em;
   color: #0072a6;
   background-color: #ffffff;
   border: 2px solid #0072a6;
   }

checkbox:focus, checkbox:active, checkbox:hover {
   float: left;
   margin: 0;
   padding: 2px;
   width: 20px;
   font-size: 1em;
   color: #0072a6;
   background-color: #ffffff;
   border: 2px solid #0072a6;
   }

   /* ===========================================
      2. Styles für die Layoutbereiche 
      =========================================== */
#zentrierung {
   margin: 10px auto;
   width: 1000px;
   height: auto;
   font-size: 1.2em;
   text-align: center;
   }
#mantel {
   float: left;
   margin: 0;
   padding: 0;
   width: 1000px;
   height: auto;
   font-size: 1.2em;
   line-height: 150%;
   text-align: center;
   border: 10px solid #cc9d1e;
   }
#titel {
   float: left;
   margin: 0;
   padding: 0;
   width: 1000px;
   height: 180px;
   background: url(hg-titel.jpg) no-repeat;
   }
#spruch {
   float: left;
   margin: 0;
   padding: 45px 165px 25px 10px;
   width: 200px;
   height: 115px;
   text-align: center;
   background-color: transparent;
   }
#spruch h1 {
   color: #5a2100;
   background-color: transparent;
   font-size: 1.2em;
   padding: 0;
   display: block;
   }

#logo {
   float: left;
   margin: 0;
   padding: 0;
   width: 250px;
   height: 180px;
   text-align: center;
   background-color: transparent;
   }
#info {
   float: left;
   margin: 0;
   padding: 30px 10px 25px 165px;
   width: 200px;
   height: 130px;
   text-align: center;
   background-color: transparent;
   }

     /*Beginn hcard microformats*/

address.vcard {
   float: left;
   margin: 0;
   padding: 0;
   width: 200px;
   height: 115px;
   text-align: center;
   background-color: transparent;
   }
div.org {
   margin: 0 0 10px 0;
   padding: 0;
   font-family: frankfurt, Trebuchet, Arial, Verdana, sans-serif;
   font-size: 2em;
   text-align: center;
   background-color: transparent;
   }
a.url {
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   color: #5a2100;
   background-color: transparent;
   }
a.url:visited {
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   color: #5a2100;
   background-color: transparent;
   }
a.url:hover, 
a.url:focus, 
a.url:active {
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   color: #ffffff;
   background-color: #5a2100;
   }
a.email {
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   color: #5a2100;
   background-color: transparent;
   }
a.email:visited {
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   color: #5a2100;
   background-color: transparent;
   }
a.email:hover, 
a.email:focus, 
a.email:active {
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   color: #ffffff;
   background-color: #5a2100;
   }

     /*Ende hcard microformats*/

#zeile-gold {
   clear: both;
   margin: 0;
   padding: 0;
   width: 1000px;
   height: 10px;
   background-color: #cc9d1e;
   }
#zeile-turkis {
   clear: both;
   margin: 0;
   padding: 0;
   width: 1000px;
   height: 10px;
   background-color: #00ffff;
   }


#navieins {
   float: left;
   margin: 0;
   padding: 5px 10px;
   width: 980px;
   height: 30px;
   background-color: #0072a6;
   }

#navieins ul {
   float: left;
   margin: 0;
   padding: 0;
   display: block;   
   }

#navieins li {
   float: left;
   margin: 2px;
   padding: 0;
   display: block;
   color: #ffffff;
   background-color: #0072a6;
   border: 2px solid #cc9d1e;
   }
#navieins a {
   padding: 2px 5px;
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   display: block;
   color: #ffffff;
   background-color: #0072a6;
   }
#navieins a:visited {
   padding: 2px 5px;
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   display: block;
   color: #ffffff;
   background-color: #0072a6; 
   }
#navieins a:hover, 
#navieins a:focus, 
#navieins a:active {
   margin: 0;
   padding: 2px 5px;
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   display: block;
   color: #0072a6;
   background-color: #ffffff; 
   }
#navieins li.active {
   float: left;
   margin: 2px;
   color: #ffffff;
   display: block;
   border: 2px solid #cc9d1e;
   }
#navieins a.active {
   margin: 0;
   padding: 2px 5px 2px 25px;
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   display: block;
   color: #ffffff;
   background: url(naviblume.jpg) no-repeat #0072a6;
   }
#navieins a.active:hover, 
#navieins a.active:focus, 
#navieins a.active:active {
   margin: 0;
   padding: 2px 5px 2px 25px;
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   display: block;
   color: #ffffff;
   background: url(naviblume.jpg) no-repeat #0072a6;
   }

     /*vorbereitet für Zukunft*/

#navizwei {
   float: right;
   margin: -40px 0 0 0;
   padding: 5px 10px;
   width: 270px;
   height: 30px;
   background-color: transparent;
   }
#navizwei ul {
   float: left;
   margin: 0;
   padding: 0;
   display: block;
   list-style-type: none;
   }
#navizwei li {
   float: left;
   margin: 2px;
   padding: 0;
   display: block;
   width: 120px;
   color: #ffffff;
   background-color: #00007f;
   }
#navizwei a {
   padding: 2px;
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   display: block;
   color: #ffffff;
   background-color: #00007f;
   }
#navizwei a:visited {
   padding: 2px;
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   display: block;
   color: #ffffff;
   background-color: #00007f;
   }
#navizwei a:hover, 
#navizwei a:focus, 
#navizwei a:active {
   margin: -5px 0 0 0;
   padding: 7px 2px;
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   display: block;
   color: #00007f;
   background-color: #ffcc00; 
   }
#navizwei li.active {
   float: left;
   margin: 2px;
   color: #f69700;
   background-color: #c31514;
   display: block;
   width: 135px;
   border: 0 solid;
   }
#navizwei a.active {
   margin: -5px 0 0 0;
   padding: 7px 2px;
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   display: block;
   color: #f69700;
   background-color: #c31514;
   }
#navizwei a.active:hover, 
#navizwei a.active:focus, 
#navizwei a.active:active {
   margin: -5px 0 0 0;
   padding: 7px 2px;
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   display: block;
   color: #8d141b;
   background-color: #ffcc00; 
   }

     /*Vorbereitung Ende*/


#inhalt {
   float: left;
   margin: 0;
   padding: 0;
   width: 1000px;
   height: auto;
   min-height: 250px;
   }
#inhalt a {
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   color: #5a2100;
   background-color: #ffffff;
   }
#inhalt a:visited {
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   color: #5a2100;
   background-color: #ffffff;
   }
#inhalt a:hover, 
#inhalt a:focus, 
#inhalt a:active {
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   color: #ffffff;
   background-color: #5a2100;
   }
     /*Beginn Auflistung Suppen*/

#monatssuppe {
   margin: 20px 140px 10px 140px;
   padding: 10px;
   width: 700px;
   height: auto;
   text-align: center;
   border: 2px solid #cc9d1e;
   }
div.monatssuppe {
   float: left;
   margin: 10px;
   padding: 5px;
   width: 200px;
   height: auto;
   text-align: center;
   }
div.anmerkung {
   margin: 20px 50px 10px;
   padding: 10px;
   text-align: center;
   border: 2px solid #cc9d1e;
   }  
#suppen {
   float:left;
   margin: -10px 25px;
   padding: 10px;
   width: 930px;
   height: auto;
   text-align: center;
   border: 2px solid #ffffff;
   }
div.suppe {
   float:left;
   margin: 10px 15px;
   padding: 10px;
   width: 256px;
   height: auto;
   text-align: center;
   border: 2px solid #cc9d1e;
   }
h3.suppe {
   margin-bottom: 10px;
   text-align: center;
   }

p.suppe {
   float:left;
   padding: 5px;
   width: 150px;
   text-align: left;
   }

     /*Ende Auflistung Suppen*/


#text {
   float: left;
   margin: 0;
   padding: 20px;
   width: 680px;
   height: auto;
   min-height: 250px;
   text-align: left;
   }
#text ul {
   margin-left: 10px;
   list-style-type: disc;
   color: #5a2100;
   background-color: #ffffff;
   }
#text li {
   margin-left: 10px;
   list-style-type: disc;
   color: #5a2100;
   background-color: #ffffff;
   }

#text p {
   margin-bottom: 10px;
   padding: 0;
   }
#text h3 {
   margin-bottom: 10px;
   padding: 0;
   }



#foto {
   float: left;
   margin: 0;
   padding: 10px;
   width: 260px;
   height: auto;
   text-align: center;
   }


#zeile-turkis-unten {
   clear: both;
   margin: 0;
   padding: 0;
   width: 1000px;
   height: 10px;
   background-color: #00ffff;
   }
#fusszeile {
   float: left;
   margin: 0;
   padding: 5px;
   width: 990px;
   height: 30px;
   font-size: 0.9em;
   text-align: right;
   color:#ffffff;
   background-color: #0072a6 ;
   }
   /* ===========================================
      3. Sonstige Styles 
      =========================================== */

.clear {
   clear: both;
   width: 400px;
   height: 1px;
   }

     /*Container*/


     /*Absätze*/
p.ueberschrift {
   margin: 10px 0;
   padding: 0;
   font-weight: bold;
   }


    /* Überschriften */


     /*Listen*/   
li.bild {
   float: left;
   margin: 0;
   padding: 0;
   width: 100px;
   height: 100px;
   list-style-type: none;
   }
li.text {
   float: left;
   margin: 0;
   padding: 50px 5px 5px 5px;
   width: 150px;
   list-style-type: none;
   }
li.clear {
   clear: both;
   list-style-type: none;
   }

     /*Tabellen*/ 


     /*label*/


     /*Links*/    

a.bild {
   margin: 0;
   padding: 0;
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   background-color: transparent;
   }
a:visited {
   margin: 0;
   padding: 0;
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   background-color: transparent;
   }
a:hover, 
a:focus, 
a:active {
   margin: 0;
   padding: 0;
   font-weight: bold;
   text-decoration: none;
   font-size: 1em;
   background-color: transparent;
   }


#skiplink {
   position: absolute;
   top: -2000px;
   left: -3000px;
   width: 0;
   height: 0;
   overflow: hidden;
   display: inline;
   }

/* ===========================================
   Ende des Stylesheets 
   =========================================== */