/* Google-Font: Lato 100,300,400,700,900 entfernt */

html,body { background: url(hintergrund-verlauf.png) repeat-x; font-family: Lato, Verdana, Arial, Tahoma; }
ul { margin: 0; padding: 0; list-style-type: none; }
h1 { margin: 0; padding: 0; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }

#wrapper { margin: 0 auto; width: 1000px; border-radius: 10px; font-size: 1.2em; }

#kopf, #topmenu, #inhalt, #fuss { background-color: white; }
#kopf_innen, #inhalt_innen, #fuss_innen { padding: 10px 25px; }
#kopf { height: 120px; border-top-left-radius: 10px; border-top-right-radius: 10px; box-shadow: 3px 5px 3px #888; -webkit-box-shadow: 3px 5px 3px #888; }
#kopf img.logo { float: left; margin: 10px 25px 0 40px; }
#kopf h1 { padding: 35px 0 0 15px; letter-spacing: 3px; color: #01753e; font-size: 22px;}
#topmenu { clear: both; height: 48px; margin-bottom: 25px; box-shadow: 3px 3px 3px #888; -webkit-box-shadow: 3px 3px 3px #888; background: url(menu-verlauf.png) repeat-x;}
#topmenu ul li { float: left; border-right: 1px solid #656561; }
#topmenu ul li a { display: block; color: white; padding: 13px 25px; font-weight: bold; }
#topmenu ul li a:hover { background: url(menu-verlauf-hover.png) repeat-x; }
#topmenu a.aktiv { background: url(menu-verlauf-hover.png) repeat-x; }
.linker-rand { border-left: 1px solid #83827e; }

#leftmenu { float:left; width: 210px; margin-right: 35px; font-size: 0.8em; }
#leftmenu ul { margin: 30px 25px 25px 25px; }
#leftmenu ul li { height: 35px; line-height: 35px; }
#leftmenu ul li a { display: block; padding: 0 15px; color: black; text-decoration: none; font-weight: bold; background: url(graues-kaestchen.png) no-repeat 145px; }
#leftmenu ul li a:hover { color: #01753e; background: url(gruenes-kaestchen.png) no-repeat 145px;}
#leftmenu a.aktiv { background: url(gruenes-kaestchen.png) no-repeat 145px; }

#inhalt { border-left: 220px solid white; min-height: 350px; box-shadow: 3px 5px 3px #888;  -webkit-box-shadow: 3px 5px 3px #888; }
#inhalt img { float: right; margin: 20px 25px; border-radius: 10px; box-shadow: 3px 3px 3px #333;  -webkit-box-shadow: 3px 3px 3px #333; }
#inhalt p { /*margin-right: 350px;*/ text-align: justify; }
#inhalt ul { list-style-type: disc; padding-left: 25px; }
#inhalt ul p, #inhalt ul ul { margin-right: 0; }
#inhalt li { padding: 5px 0; }
#inhalt .normal { width: 100%; }
#inhalt input, #inhalt textarea   { padding: 10px 20px; border: 1px solid #bbb; border-radius: 5px;  }

#fuss { border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; text-align: center; font-size: 0.8em; color: #858585;  box-shadow: 3px 3px 3px #888; -webkit-box-shadow: 3px 3px 3px #888; }

#design { padding: 10px 0 5px 0; text-align: center; font-size: 0.75em; color: #656565; }
#design a { color: #656565; }

@media (min-width: 1460px) {
    #wrapper { width: 1400px; font-size: 1.2em; }
    #kopf h1 { font-size: 22px; }
    #kopf h2 { font-size: 18px; }
    #inhalt input, #inhalt textarea { font-size: 18px; }
    #inhalt p, #inhalt ul { line-height: 1.5em; }
    #design { font-size: 0.8em; }
}

@media (max-width: 1000px) {
    #wrapper { width: 100%; }
    #kopf { height: auto; min-height: 120px; }
    #leftmenu { display: none; }
    #inhalt { border-left: 0; }
    #inhalt p, #inhalt ul { line-height: 1.5em; }
}

@media (max-width: 600px) {
    #kopf img.logo { float: none; margin-bottom: 10px; }
    #kopf h1        { padding-top: 0; }
    #inhalt input, #inhalt textarea   { width: 80%; }
}

@media (max-width: 790px) {
    #wrapper { font-size: 1.2em; }
    #kopf h2 { font-size: 18px; }
    #topmenu { height: auto; background: none; }
    #topmenu ul li { float: none; background: url(menu-verlauf.png) repeat-x; }
    #inhalt .bild_rechts { display: none; }
    #inhalt p, #inhalt ul { margin-right: 0; }
    #design { font-size: 1em; }
    #inhalt img     { display: none; }
}