@font-face { font-family: 'OpenSanso'; src: url('../fonts/OpenSans-Bold.ttf') format('truetype'); } 
@font-face { font-family: 'OpenSanso'; src: url('../fonts/OpenSans-ExtraBold.ttf') format('truetype'); } 
@font-face { font-family: 'OpenSanso'; src: url('../fonts/OpenSans-Semi-Bold.ttf') format('truetype'); } 
@font-face { font-family: 'OpenSanso'; src: url('../fonts/OpenSans-Light.ttf') format('truetype'); } 
@font-face { font-family: 'OpenSanso'; src: url('../fonts/OpenSans-Medium.ttf') format('truetype'); } 

/* eingebundene Schriften */

*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

html, body {margin:0; padding:0; }
body {font-size: 100.01%; line-height:120%; font-family: Verdana, Arial, Helvatica; color: #3F2612}

h1 {font-size:110%; display:none}
h2 {font-family: Optimum, Verdana, Arial, Helvetica, sans-serif; font-size:150%}

p {margin-bottom: 1.5em; line-height: 1.5em;}
.clear {clear: both; overflow: hidden; height: 0;}

ul {line-height: 250%}
#top img, #footer img {border: none}
img {max-width: 100%; height: auto; border: none;}
#hintergrund {top: 0; left: 0; width: 100%; height:100%; position: fixed; z-index: 1; }

#all {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 15}

#container {width:100%; margin: auto}
.wrap {width: 100%; max-width: 582px; background-color: #3F2612; z-index: 20; margin: auto}
#menu {margin-top:5px; float:left; left; background-color:#3F2612; padding-left:1px }

/* Fusszeile Impressum */
#footer {clear: both; margin: 1%; font-size: 80%; font-family: Optima; }
#footer img {float:left; border: none}
#footer .emotion {display:none}  
.webmaster {float:left; width:50%}
.impressum {float:right; width:50%; text-align:right}

/* ########### ausgeblendete Inhalte auf Desktop-Screens #############  */

.toggle_icons, .menu_mobile, .logomobile {display: none}

/* header  */

#header {margin-left:1px; background-position: left top; background-repeat: no repeat; }
#header p {margin: 0; padding: 0}

/* Inhalt Artikel */

#main {float:left; position:absoulte; z-index: 20; text-align: left; font-size: 0.9em; }
#main ul {padding-left:15px; line-height: 150%}
#main ul li ul {list-style-type:disc; padding-left:15px; list-style-type:circle}

#content {float:left; width: 100%; background-color: white; padding: 20px}

/* Text-Links */

a:link {color: #3F2612}
a:visited {color: #B0A396}
a:hover,a:active,a:focus {background: #B0A396; color: #FFF}

#footer a:link {text-decoration:none; color:#FFF}
#footer a:visited {color: #FFF}
#footer a:hover,a:active,a:focus {background: #B0A396; color: #FFF}

a:link img, a:active img, a:focus img, a:visited img, a:hover img {text-decoration: none}
.footer a:link, .footer a:active, .footer a:focus, .footer a:visited, .footer a:hover {color:#FFFFFF; text-decoration: none}

@media screen and (max-width:1000px) {
.menu_mobile {left: 0; position: absolute top: 0; height: 0px; overflow: hidden}
.toggle_icons {display: block; float: right}
.ontop {width: 100%; height: 3.5em }
.mobile, .menu_mobile {display: block; width:50%; position: fixed; z-index:10;}
.logomobile {display: block; width:30%; padding: 2% 2% 2% 3%; float: left}
.mobile, .menu_mobile img {width:100%}
.mobile {padding: 0}
.menu_mobile {left: 0; position: absolute top: 0; height: 0px; overflow: hidden}
#emotion {display:none}  
#footer .emotion {display:block}  
#menu-open:target .menu_mobile {height:46em}
a.open {display:block; width:35%; float: right; margin:5% 5% 0 0}
a.close {display:none; width:35%; float: right; margin:5% 5% 0 0}
#menu-open:target a.open {display: none}
#menu-open:target a.close {display: block}
.menu_mobile, .top {transition: .7s}
#header {width:100%}
.menu, .logodesktop {display:none}
#container {width:100%}
.wrap {width: 100%; max-width: 100%;}
#content {width: 96%; margin: 2%; background-color: #FFF}
.item-page.home, .item-page.angebot, .item-page.ernaehrung, .item-page.kontakt {background-image: none}
.global.home #content, .global.angebot #content, .global.ernaehrung #content, .global.kontakt #content {background-image: none}
#footer .emotion {display:block}  
}


