body {margin:0; padding:0; text-align:center; font-family:'Open Sans',Arial, sans-serif; font-size:13px; color:#fff; background-color:#aaa; background-image:url(../img/bg.png); background-repeat:repeat-x;}

img {display:block;}
a {color:#319F49}
a.more {padding-left:13px; background-image:url(../img/arrow_outlink.gif); background-position:0 4px; background-repeat:no-repeat;}
.clear {clear:both; height:1px; width:100%; overflow:hidden;}
.colored {color:#319F49}
hr {clear:both; border:solid #95A8AB 1px; border-bottom-width:0; height:1px; margin:5px 0 15px;}

#outer {position:relative; width:992px; max-width:100%; overflow:hidden; margin:auto; text-align:left; color:#333; background-color:#fff; box-shadow:0 0 5px 5px #999; border-radius:0 0 10px 10px;}
#all {position:relative; margin:0 45px; padding:20px 0 45px;}

#header {position:relative; padding-bottom:25px;}
#logo {}
#logo img {width:235px; height:auto;}
#header h1 {position:absolute; top:20px; left:255px; margin:0; padding:0; color:#319F49; font-family:'Tinos', Times New Roman, Times, serif; font-size:31px; font-weight:normal; line-height:32px;}
#header h2 {position:absolute; top:52px; left:255px; margin:0; padding:0; color:#ddd; font-family:'Open Sans',sans-serif; font-size:24px; font-weight:400; line-height:24px; letter-spacing:1px; text-transform:uppercase;}
.headerInfo {position:absolute; top:0; right:0; width:200px; padding:15px 0 10px; border:1px #ddd solid; border-radius:0.5em;}
.headerInfo p {margin:0 15px 5px; padding:0 0 0 25px;}
.headerInfo .phone {background-image:url(../img/phone.gif); background-position:0 1px; background-repeat:no-repeat;}
.headerInfo .mail {background-image:url(../img/email.gif); background-position:0 2px; background-repeat:no-repeat;}

#mainNav {height:32px; color:#333; background-color:#eee; border:1px #ddd solid; border-left-width:0; border-radius:0.5em 0.5em 0 0; box-shadow:1px 1px 2px -1px #ccc;}
#mainNav ul {margin:0; padding:0;}
#mainNav li {list-style-type:none; margin:0; padding:0; float:left;}
#mainNav a {display:block; height:32px; overflow:hidden; font-family:'Open Sans',sans-serif; font-size:13px; line-height:36px; padding:0 10px; font-weight:600; text-decoration:none; text-transform:uppercase; color:#333; background-color:#eee; border-left:1px #ddd solid; border-right:1px #fff solid;}
#mainNav a:hover {background-color:#F7F7F7;} 
#mainNav li.first a {border-radius:0.5em 0 0 0;} 
#mainNav li.last a {border-right:none;} 
#mainNav li.act a {height:34px; color:#319F49; background-color:#F7F7F7;} 
#subNav {height:32px; color:#333; background-color:#F7F7F7; border:1px #ddd solid; border-top-color:#fff; border-radius:0 0 0.5em 0.5em; margin-bottom:15px; box-shadow:1px 1px 2px -1px #ccc;}
#subNav ul {margin:1px 0 0; padding:0;}
#subNav li {list-style-type:none; margin:0; padding:0; float:left;}
#subNav a {display:block; height:32px; overflow:hidden; font-family:'Open Sans',sans-serif; font-size:13px; line-height:32px; padding:0 10px; text-decoration:none; color:#333;}
#subNav li.first a { border-radius:0.5em 0 0 0;} 
#subNav li.act a {color:#319F49;} 

#main {position:relative; float:left; width:680px;}
#main h1 {font-family:'Tinos', Times New Roman, serif; padding:5px 0; margin:0; font-size:39px;}
#main h2, #main h3, #main h4 {padding:5px 0; margin:0; color:#319F49;}
#main h2 {font-size:20px;}
#main h3 {font-size:15px;}
#main h4 {font-size:13px;}
#main p {font-size:13px; line-height:22px; margin:0 0 10px;}
.boxFull img {max-width:100%; height:auto;}
.picFull {position:relative; margin:0 0 20px; border-radius:1em; box-shadow:1px 1px 3px 0 #999;}
.picFull img {width:100%; height:auto; border-radius:1em;}
.picLeft, #main p.picLeft {float:left; margin:5px 15px 10px 0; border-radius:0.5em; box-shadow:1px 1px 3px 0 #999;}
.picRight, #main p.picRight {float:right; margin:5px 0 10px 15px; border-radius:0.5em; box-shadow:1px 1px 3px 0 #999;}
img.picLeft, img.picRight, .picLeft img, .picRight img {max-width:335px; height:auto; border-radius:0.5em;}
iframe {max-width:100%;}

#sidebar {float:right; width:200px;}
.widgetBox {color:#999; background-color:#F7F7F7; border:1px #ddd solid; border-radius:0.5em; margin-bottom:15px; box-shadow:1px 1px 2px -1px #ccc;}
.widgetBox .boxFull {padding:15px 15px 6px; border-top:1px #fff solid; border-bottom:1px #ddd solid;}
.widgetBox .boxFull.first {border-top:none;}
.widgetBox .boxFull.last {border-bottom:none;}
.widgetBox h3 {font-family:'Tinos', Times New Roman, serif; font-size:20px; font-weight:normal; color:#319F49; margin:0 0 10px; padding:0;}
.widgetBox p {margin:0 0 10px;}
.widgetBox a {text-decoration:none;}
.widgetBox a:hover {text-decoration:underline;}
.widgetBox a[name], .widgetBox a[name]:hover {color:#999; text-decoration:none;}
.widgetBox .outlink {padding-left:13px; color:#319F49; background-image:url(../img/arrow_outlink.gif); background-position:0 4px; background-repeat:no-repeat;}
.widgetBox img {max-width:100%; height:auto;}

/* Startseite */
.picBox {position:absolute; bottom:15px; left:15px; width:325px; font-family:Arial, sans-serif; padding:10px 5px; background-color:#fff; background:rgba(256, 256, 256, 0.9); border-radius:0.5em; box-shadow:0 0 6px -2px #000;}
#main .picBox h3 {margin:0 15px 10px; padding:0; font-size:24px; font-weight:normal;}
#main .picBox p {line-height:18px; margin:0 15px 10px;}
#main .picBox ul {margin:0 15px 10px; padding:0;}
#main .picBox li {list-style-type:none; margin:0; padding:0 0 3px 15px; background-image:url(../img/arrow_green.gif); background-position:0 4px; background-repeat:no-repeat;}

.startBox {padding:0 15px; background-color:#EEFDEA; border:1px #ddd solid; border-radius:0.5em; margin-bottom:15px; box-shadow:1px 1px 2px -1px #ccc;}
#main .startBox p {line-height:20px;}
#main .startBoxHead {border-bottom:1px #ddd solid; padding:5px 0; margin:0 0 10px;}
#main .startBoxHead h3 {float:left; margin:0; padding:0; font-family:'Open Sans',Arial,sans-serif; font-size:13px; line-height:13px; text-transform:uppercase; color:#319F49;}
#main .startBoxHead p.date {margin:0; margin-left:130px; font-family:'Tinos', Times New Roman, serif; font-size:13px; line-height:13px; color:#319F49;}
.startBoxPic {float:left; padding-bottom:10px;}
.startBoxContent {margin-left:130px;}
.startBoxPic img {width:115px; height:auto;}

/* Seite volle Breite */
.pageFull #main {float:none; width:auto;}
.pageFull #sidebar {display:none;}
.teaserbox {width:915px; padding-top:15px;}
.teaser {float:left; width:140px; margin-right:11px;}
.teaser img {width:100%; height:auto;}
#main .teaser p {line-height:18px;}

/* News */
.breadcrumbs {position:absolute; top:0; right:0; font-size:12px;}
.listBox {padding:15px 0 5px; border-top:1px #ddd solid;}
.listBox .picLeft {float:left; margin:5px 15px 10px 0; border-radius:0.5em;}
.listBox .picLeft img {width:160px; height:auto; border-radius:0.5em;}
.listBox .newsContent {margin-left:175px;}
#main .listBox h3 a {text-decoration:none;}
#main .listBox p {line-height:18px;}
#main .listBox p.date {float:right; line-height:15px; margin:8px 0 0 15px;}
.newsDetail {padding-top:10px; border-top:1px #ddd solid;}
#main .newsDetail h2 {}
#main .newsDetail p.date {float:right; padding:6px 0 0 15px; margin:0;}

.paginationbox {padding-top:5px; border-top:1px #ddd solid;}
.paginationbox p {text-align:right;}
.paginationbox a {text-decoration:none;}
.pagination {padding-top:5px; float:right;}
.pagination a {display:block; float:left; height:24px; width:24px; overflow:hidden; padding:0; text-align:center; font-weight:bold; line-height:24px; text-decoration:none; background-color:#E4EFE9; border:2px #fff solid; border-radius:0.5em;}
.pagination a:hover {border-color:#319F49;}
.pagination a.inactive, .pagination a.inactive:hover {color:#ccc; background-color:#eee; border-color:#fff;}
.pagination a.active {color:#fff; background-color:#319F49;}

/* Formular */
.contactform {margin:0; padding:10px 0 0; border-top:1px #ddd solid;}
.messagebox {background-color:#EEFDEA; border:3px #319F49 solid; padding:20px; margin:0 0 20px;}
.formRow {clear:both; padding:5px 0;}
.label {float:left; width:110px;}
.labelFull {width:auto; margin-left:120px; float:none;}
.formField {margin-left:120px;}
.iHalf, .iLarge {font-family:Arial, sans-serif; font-size:13px; padding-top:4px; padding-bottom:4px; border:1px #ccc solid;}
.iHalf {width:200px;}
.iLarge {width:400px;}
.submit {font-family:'Open sans',Arial, sans-serif; font-size:13px; font-weight:bold; color:#fff; background:#319F49; border:1px #319F49; solid; border-radius:0.3em;}
.marked input, .marked select, .marked textarea {background:#ffefef;border-color:#c00;}
.marked span {color:#c00; background:#ffefef;}
.pageFull .label {margin-left:100px;}
.pageFull .iLarge {width:500px;}
.pageFull .labelFull, .pageFull .formField {margin-left:220px;}


/* Footer */
#footer {width:992px; margin:20px auto; text-align:left; color:#fff;}
#footer p {margin:0 45px 5px; font-size:13px;}
#footer a {color:#fff; text-decoration:none;}
#footer img {display:inline;}
#footer p.footerLeft {float:left; display:inline; margin-left:45px; min-width:400px;}
#footer p.footerCenter {}
#footer p.footerRight {float:right; display:inline; margin-right:45px;}
.cmsInfo {position:absolute;bottom:2px; right:2px;}

@media screen and (max-width:990px){
  #outer {width:auto; max-width:992px; box-shadow:none;}
  .headerInfo {position: relative; top:10px; right:0; width:auto; padding: 5px 0 0px;}
  #all {margin: 0 20px; padding: 20px 0 20px;}
  #topNav {position:fixed; top:0; left:100%; width:100%; height:100%; background:#eee; z-index:99; transition:0.5s;}
  #topNav.act {left:0;}
  .btnNav {height:40px; width:40px; background-color:#eee; background-image:url(../img/btn_nav.png); background-position:center center; background-repeat:no-repeat; cursor:pointer; transition:0.3s;}
  .btnNav:hover {background-color:#ccc;}
  #topNavShow {position:absolute; top:20px; left:-40px;}
  #topNavHide {position:absolute; top:20px; right:0px;}
  #mainNav, #subNav {height:auto; border:none; border-radius:0; box-shadow:none;}
  #mainNav {padding-top:20px;}
  #mainNav li, #subNav li {float:none;}
  #mainNav a, #subNav a {text-align:center;}
  #main {float:none; width:auto;}
  #subNav a:hover {text-decoration:underline; background:#fff;}
  .teaserbox {width:auto;}
  .teaser {width:30%; margin-right:3%;}
  #sidebar {float:none; width:auto;}
  .widgetBoxPages {display:none;}
  #footer {width:auto; max-width:992px;}
  #footer p, #footer p.footerLeft, #footer p.footerRight {margin: 0 10px 5px; min-width:0;}
  .footerCenter {display:none;}
  .footerBottom {clear:both;}
}

@media screen and (max-width:850px){
  .pageFull .label {margin-left:0;}
  .pageFull .iLarge {max-width:95%;}
  .pageFull .labelFull, .pageFull .formField {margin-left:120px;}
}

@media screen and (max-width:750px){
  #header h1, #header h2 {display:none;}
  .picBox {display:none;}
  .picLeft, .picRight {max-width:33%;}
  .picLeft img, .picRight img {max-width:100%;}
}

@media screen and (max-width:650px){
  td {display:block;}
}

@media screen and (max-width:550px){
  .picLeft, .picRight, .listBox .picLeft {float:none; max-width:100%; margin:0 0 10px; box-shadow:none;}
  .listBox .newsContent {margin-left:0;}
  .label, {float:none; width:auto;}
  .formField, .pageFull .labelFull, .pageFull .formField {margin-left:0;}
  .iLarge {max-width:95%;}
  .startBoxContent {clear:both; margin-left:0;}
  .teaser {width:45%; margin-right:4.8%;}
}

@media screen and (max-width:400px){
  .teaser {float:none; width:auto; margin-right:0;}
}

@media screen and (max-width:990px) and (max-height:460px){
  #all {padding-top:5px;}
  #topNavShow, #topNavHide {top:5px;}
  #mainNav {padding-top:0px;}
  #mainNav a, #mainNav li.act a {line-height:24px; height:auto;}
  #subNav a, #subNav li.act a {line-height:24px; height:auto;}
}