body {
	//margin-top: 10px; 
	//background-image: 
	//box-sizing: border-box;
	}

/* Farbe braun: #8B572A */	
/* Farbe grün für Katja Böhler im Logo: #D3EBD1 */	
/* Farbe helles grün für die Balken: #E0EBD1 */		
/* Hintergrund wrapper: weiss */	
/* Bilder auf der Startseite: 300x200px */	
/* Bilder auf der in den Rubriken: 200x200px */	
/* background-color: rgba(224, 235, 209, 0.3); entspricht F6F9F2, ohne opacity: E0EBD1 */

/* ab 940px: Desktop */
/* über 780px werden zwei Boxen nebeneinander angezeigt */
/* bei weniger als 779px werden alle vier Boxen untereinander angezeigt und content zentriert auf 100% */
/* bei weniger als 520px content und box mit Abstand-links schöner ausrichten */
/* bei weniger als 376px wird der header etc verkleinert angezeigt */


#wrapper {
	max-width: 940px; 
	height: 1000px; 
	margin-left: auto; /* Aussenabstand */	
	margin-right: auto;
	margin-top: 0px;
	//border: solid #ccc 2px; 
	//background-color: #FF0000;
	}

#wrapper_datenschutz {
	max-width: 940px; 
	height: 2200px; 
	margin-left: auto; /* Aussenabstand */	
	margin-right: auto;
	margin-top: 0px;
	//border: solid #ccc 1px; 
	//background-color: #FF0000;
	}

#header {
	width: 100%; 
	height: 200px; 
	//padding: 0px; /* Innenabstand */
	//margin: 0px; /* Aussenabstand */	
	//margin-top: 0px; 
	//margin-bottom: 0px;
	//border-radius: 0px;
	//border: solid #ccc 1px; 
	background-image: url(header.png);
	background-repeat: no-repeat;
    background-size: contain;
	}

#content {
	width: 700px; 
	height: 600px;
	margin-left: 100px; 
	margin-right: 100px; 
	//overflow: auto;
	//padding: 0px; 
	//padding-top: 20px; 
	//float: right;
	//margin-left: 0px; 	
	//border: solid #ccc 1px; 
	//margin-top: 0px; 
	//background-color: #DCDCDC;
	//text-align: center;
	}

#table {
	//border-collapse: collapse;
	//border: 1px solid;
	margin-left: 100px;
	font-family: Helvetica Neue, HelveticaNeue, Verdana, Arial, Times New Roman; 
	font-size: 14px; 
	font-weight: 300;
	text-align: left;
	color: #8B572A; 
	}

th { /* Tabellenüberschrift */
	//border-top: 1px solid;
	//border-bottom: 1px solid;
	}

td { /* Tabellendaten */
	//padding: 1em;
	//font-weight: normal;
	//border: 1px solid;
	}

#content1-breit-leer {
	max-width: 100%; 
	height: 80px; 
	//padding: 0px;
	//margin-left: 0px; 
	//margin-top: 0px; 
	//float: left;
	//margin: 00px; 	
	//border: solid #0F0 1px; 
	//margin-top: 0px; 
	//background-color: #FFF;
	}

#content1-breit-gruen {
	max-width: 100%; 
	height: 60px; 
	//padding: 0px;
	//margin-left: 0px; 
	margin-bottom: 50px; 
	//float: left;
	//margin: 00px; 	
	//border: solid #00F 1px; 
	//margin-top: 0px; 
	//background-color: rgba(224, 235, 209, 0.3);
	background-color: #f6f9f2;
	}

#box {
    width: 300px;
    height: 200px;
    line-height: 170px;
	margin-left: 130px; 
	margin-right: -50px; 
	margin-top: 40px; 
	float: left;  
	border: solid #BBD69B 1px; 
	font-size: 32px; 
	font-style: normal;
	text-align: center;
	color: #8B572A; 
    }

    span {
    display: inline-block;
    vertical-align: middle;
    //line-height: normal;
	font-family: Bradley Hand, Helvetica Neue, HelveticaNeue, Verdana; 
	font-size: 32px; 
	font-style: normal;
	text-align: center;
	color: #8B572A; 
    }

/* content start */

.maintext {
	margin: 20px;
}

.kontakt-bild { /* Bild bei Kontakt*/
	float: right;
	padding-left: 40px;
}

/* content end */

/* start footer */

#footer {
	max-width: 940px; 
	height: 40px; 
	margin-top: 20px;
	margin-left: auto; 
	margin-right: auto;
	text-align: center;
	//border: solid #ccc 3px; 
	//background-color: #CCCCCC;
	clear: both;
	}

ul {
	list-style: none;
	margin: 0;
	padding: 0;
	}

li a {
	width: 160px; /* Breite der Rechtecke*/
	height: 20px; 
	float: left;
	padding-top: 3px;
	font-family: Helvetica Neue, HelveticaNeue, Verdana, Arial;  
	font-size: 14px; 
	font-weight: regular;
	text-align: center;
	color: #8B572A; 
	text-decoration: none;
	border: solid #BBD69B 1px; /* */
	margin: 0 12px; /* Anstand zwischen den Buttons */
	}

li.akt a {
	//color: #8B572A;
	font-weight: bold;
}

a:link { 
	//text-decoration: none;
	//color: #FFF;
	}

/*a:visited { 
	color: #000;
	}
*/

a:focus { /* mit Tastatur angeklickt */ 
	//border: solid 15px; 
	//border-bottom: none;
	//border-left-color: green;
	}

a:hover { /* bei Maus-over */ 
	//text-decoration: underline;
	//border: solid 3px; 
	//border-bottom: none;
	//background:url(./bilder/lupe.gif) no-repeat left center;
	}

.bilder a:hover { /* bei Maus-over bei den Bildern*/ 
	//text-decoration: underline;
	//border: solid 3px; 
	//z-index: 2;	
	//background:url(./bilder/lupe.gif) no-repeat left center;
	//display: block;
	}

a:active { /* bei Mausklick */ 
	//text-decoration: underline;
	//border: solid 5px; 
	//border-bottom: none;
	//border-left: 20px solid #FF6600;
	}

/* end footer */


/* start Cookie-footer */

  #footer-cookie,
    #footer-cookie * {
      box-sizing: border-box;
    }

    #footer-cookie {
      display: none;
      position: fixed;
      bottom: 0px;
      left: 0px;
      width: 100%;
      height: 60px;
      padding-left: 30px;
      padding-right: 30px;
      line-height: 60px;
      background: #303030;
      color: #fff;
      font-family: Helvetica, serif;
    }
    
    #footer-cookie a {
      color: #fff;

    }

    #footer-cookie #description {
      float: left;
    }

    #footer-cookie #accept {
      float: right;
    }

    #footer-cookie #accept a {
      border: 1px solid #fff;
      padding: 5px 10px;
      text-decoration: none;
    }

    @media (max-width: 1200px) {
      #footer-cookie {
        padding-top: 30px;
        padding-bottom: 30px;
        line-height: inherit;
        height: auto;
      }

      #footer-cookie #description {
        width: 100%;
      }

      #footer-cookie #description a {
        width: 100%;
        display: block;
        text-align: center;
      }

      #footer-cookie #accept {
        width: 100%;
        margin-top: 15px;
      }

      #footer-cookie #accept a {
        width: 100%;
        display: block;
        text-align: center;
      }
    }

/* end Cookie-footer */


#content a:hover  { /* Link w.Mauszeiger darüber ist */
	border: none;
}

h1  {
	font-size: 20px; font-family: Verdana; font-weight: normal; color: red; text-decoration : none; margin-bottom: 0pt; }

h2 { 
	font-size: 14px; font-family: verdana; font-weight: normal; font-style: normal; color: #1D1D1B;  text-decoration: none; margin-bottom: 0pt; }

h3 { 
	font-size: 9px; font-family: verdana; font-weight: bold; font-style: normal; color: White;  text-decoration: none; margin-bottom: 0pt, }

p { 
	font-size: 12px; font-family: verdana; font-weight: normal; color: black; font-style: normal; text-decoration: none; }

a { 
	font-size: 14px; font-family: verdana; font-weight: normal; color: black; font-style: normal; text-decoration: none; }


#content1 p { 
	font-family: verdana; font-size: 12px; font-weight: normal; color: black; font-style: normal; text-decoration: none; padding: 5pt;}

#content1-breit-gruen p { 
	font-family: Bradley Hand, Lucida Handwriting, Helvetica Neue, HelveticaNeue, Verdana; 
	font-size: 20px; 
	font-weight: normal; 
	color: #8B572A; 
	font-style: normal; 
	text-decoration: none; 
	padding-left: 100px; 
	padding-top: 20px;
	}

.linie { 
	max-width: 800px; 
	text-align: center;
	border: none;
	border-top: 1px solid #D3EBD1;
	//margin: 0px 0px 0px 0px;
	//margin: 0, auto;
	}


.linie_oben { 
	max-width: 800px; 
	text-align: center;
	border: none;
	border-top: 1px solid #D3EBD1;
	margin-top: 200px;
	//margin: 0px 0px 0px 0px;
	//margin: 0, auto;
	}

.linie_unten { 
	max-width: 800px; 
	text-align: center;
	border: none;
	border-top: 1px solid #D3EBD1;
	}

.kategorie p {
	font-family: Bradley Hand; HelveticaNeue-Light; Times New Roman; 
	font-size: 36px; 
	font-style: normal;
	//font-weight: 100;
	color: #8B572A; 
	//text-decoration: none; 
	text-align: center;
	padding-top: 50px;
	vertical-align: middle;
	//border: solid #A4A4A4 5px; 
	}

#content p { 
	font-family: Helvetica Neue, HelveticaNeue, Verdana, Arial; 
	font-size: 14px; 
	font-weight: 300;
	text-align: left;
	color: #8B572A; 
	text-decoration: none; 
	}

p.stand  {
	font-family: Verdana; font-size: 12pt; font-weight: normal; color: White; font-style: normal; text-decoration: none; text-align: left;}

#header p  {
	font-family: Verdana; font-size: 16pt; font-weight: bold; color: White; font-style: normal; text-decoration: none; text-align: center; }


/* Desktop first: When the screen is less than 780 pixels wide: obere ud untere Linie auf index ausblenden, content anpassen */
@media screen and (max-width: 779px) {

.linie_unten {
    border-top: 0px;
  }

.linie_oben {
    border-top: 0px;
  }

#header {
	height: 120px; 
	}

#content {
	max-width: 100%;
	height: 650px;
    margin-left: 20px;
	margin-right: 20px;
	margin-top: 60px;
	}

#table {
	margin: auto;
	}

/* Desktop first: When the screen is less than 520 pixels wide, box und content ausrichten */
@media screen and (max-width: 520px) {

#box {
   margin-left: 50px;
   }

#content {
   margin-left: 0px;
   margin-right: 0px;
  }

/* Desktop first: When the screen is less than 375 pixels wide, .header noch kleiner... 376 eintragen*/
@media screen and (max-width: 376px) {

#wrapper {
	height: 900px; 
	}

#header {
	height: 80px; 
	}

#content1-breit-leer {
	height: 20px; 
	}

#content1-breit-gruen {
	margin-bottom: 0px;
	height: 60px; 
	}

#content1-breit-gruen p {
	font-size: 14px; 
	padding-left: 40px;
	}

#content {
   margin-left: 0px;
   margin-right: 0px;
  }

#box {
   margin-left: 20px;
   }

#table {
	margin-left: 0px;
	}

ul li a {
    margin: 0 80px;
	}

.linie_unten {
    border-top: 0px;
  }