body {
   background: url("images/bg_main.png") repeat;
}

.sub {
   position: relative;
   margin: auto;
   width: 63em;
   padding: 0 1em;
   text-align: left;
}


/******************** Header ********************/

#header {
   height: 185px;
   padding: 30px 0 0 0;
   background: url("images/bg_header.png") repeat-x;
}
#header .img {
   position: absolute;
   top: -22px;
}

/******************** End Header ********************/



/******************** Navigation ********************/

#navi {
   height: 89px;
   background: url("images/bg_navi.png") repeat-x;
}

#navi ul {
   display: block;
   margin: auto;
   width: 55em;
   background: url("images/bg_navi_ul.png") center no-repeat;
}

#navi li {
   display: inline-block;
   list-style: none;
   margin: 0;
   padding: 0 15px;
   font-size: 24pt;
   font-family: "Berlin Sans FB", Rockwell, Arial, Verdana, Helvetica;
   font-weight: bold;
   line-height: 89px;
}

#navi a, #navi a:link, #navi a:active, #navi a:visited, #navi a:hover { color: #000; background: none; font-weight: normal; padding: 15px 30px; }

#navi li.current     { background: url("images/bg_navi_current.png") center no-repeat; }
#navi li.wer         { background: url("images/bg_navi_wer.png") center no-repeat; }
#navi li.was         { background: url("images/bg_navi_was.png") center no-repeat; }
#navi li.warum       { background: url("images/bg_navi_warum.png") center no-repeat; }
#navi li.wie         { background: url("images/bg_navi_wie.png") center no-repeat; }
#navi li.wo          { background: url("images/bg_navi_wo.png") center no-repeat; }
#navi li.wer:hover   { background: url("images/bg_navi_wer_hover.png") center no-repeat; }
#navi li.was:hover   { background: url("images/bg_navi_was_hover.png") center no-repeat; }
#navi li.warum:hover { background: url("images/bg_navi_warum_hover.png") center no-repeat; }
#navi li.wie:hover   { background: url("images/bg_navi_wie_hover.png") center no-repeat; }
#navi li.wo:hover    { background: url("images/bg_navi_wo_hover.png") center no-repeat; }

/******************** End Navigation ********************/


/******************** Main ********************/

#main {
   padding: 20px 0;
}

/****** Contactform ******/
#contactforms { width: 20em; }
.notification_error
{
background: rgba(255,225,225,0.6);
border: 1px solid #ccc;
height: auto;
width: 18em;
padding: 0.5em;
text-align: left;
margin: 1em 0;
}
.notification_ok
{
height: auto;
width: 18em;
padding: 0.5em;
background: rgba(255,255,255,0.6);
border: 1px solid #ccc;
text-align: center;
margin: 1em 0;
}
.button
{
display: block;
background: rgba(255,255,255,0.6);
border: 1px solid #ccc;
width: 18em;
}
label  { display: block; padding: 0; margin: 0; text-align: left; font-weight: bold; }
input, textarea
{
margin: 0 0 1em 0;
padding: 0.5em;
background: rgba(255,255,255,0.6);
border: 1px solid #ccc;
width: 18em;
}
input:focus, textarea:focus { background: rgba(225,225,225,0.6); }

/******************** End Main ********************/



/******************** Footer ********************/

#footer {
   padding: 20px 0;
   width: 100%;
   background: url("images/bg_footer.png") repeat-x #2a4300;
   color: #fff;
   min-height: 150px;
}
#footer a { font-weight: normal; }

#footer .float {
   float: left;
   width: 640px;
}

#footer .kontaktdaten {
   position: relative;
   float: left;
   width: 320px;
   height: 160px;
}
#footer .kontaktdaten img { position: absolute; bottom: 2em; right: 1em; }

#footer .sociallinks {
   width: 270px;
   margin: 0 0 0 320px;
   padding: 0 25px;
   line-height: 1.5em;
}
#footer .sociallinks img { display: inline; margin: 0 0 -0.2em 0;}

#tweets {
   width: 320px;
   margin: 0 0 0 640px;
   text-align: left;
   font-size: 0.8em;
   line-height: 100%;
}
#tweets .tweet_list { list-style: none; margin: 0; padding: 0; }
#tweets .tweet_list li { padding: 0; margin: 0 0 5px 0; }
#tweets img { margin: 0 0 1em 2em; }

/******************** End Footer ********************/