@import "html5reset-1.4.1.css";

/**** Common = Allgemein, HTML TAGS ****/
* { margin: 0; padding: 0; border:0;}   
body{font-family: Lucida Grande, Helvetica, Arial, sans-serif; font-size:0.81em; color: #5a5a5a; background:#fff; line-height:22px;}
a {	text-decoration:none; color:#2176ba; /*blau*/ }
a:hover { text-decoration:underline; }
ul, ol { list-style:none;}
p{margin:0; padding:0;}
form{margin:0; padding:0;}
input{font-family:Lucida Grande, Helvetica, Arial, sans-serif; font-size:13px;}
textarea{font-family:Lucida Grande, Helvetica, Arial, sans-serif; font-size:13px;}
.clearboth{clear:both; height:1px; font-size:1px; line-height:1px; margin:0px; padding:0px;} 
.clear {clear:both;	overflow:hidden;}
a.anchor{display:block;width:0;height:0;overflow:hidden;}

/**** Header ****/
header {width:100%; display:block; background:url('/img/common/bg-header.jpg') repeat-x top left;}
#orange header {width:100%; display:block; background:url('/img/common/bg-header-orange.jpg') repeat-x top left;}
header a {	}
header .content { width:980px; background:url('/img/common/kuhbg-blau.jpg') no-repeat top left; margin:auto; }
#orange header .content{ width:980px; background:url('/img/common/kuhbg-orange.jpg') no-repeat top left; margin:auto; }
header .logo{padding:16px 0 0 0; float:left; width:300px; }
header .icons{float:left; text-align:right; width:680px; margin:55px 0 0 0;}
header .icons a {padding:0 0 0 8px;}

/**** HAUPTNAV ****/
.hauptnavdiv {width:100%; clear:both;}
.hauptnav{width:980px; margin:auto; font-weight:bold; overflow:hidden; }
.hauptnav nav {float: left;  margin:228px 0 0px 0px;}
.hauptnav nav a{display:inline-block; color:#e14f22;}
.hauptnav nav a:hover{text-decoration:none;}
.hauptnav nav a.active{color:#e14f22;}
.hauptnav nav a.active:hover{text-decoration:none;}
.hauptnav nav ol{ font-weight:bold; font-size:18px;}
.hauptnav nav ol li{display:block;float:left; text-align:center; padding:17px 0px 24px 0px; margin:0 16px 0 0;}
.hauptnav nav ol li.halloactive{background:url('/img/btn/hallo-active.gif') no-repeat bottom left; width:110px;}
.hauptnav nav ol li.hallo{background:url('/img/btn/hallo.gif') no-repeat bottom left; width:110px;}
.hauptnav nav ol li.halloactive a, .hauptnav nav ol li.hallo a{padding:0 23px 0 0px;}
.hauptnav nav ol li.hallo:hover{background:url('/img/btn/hallo-active.gif') no-repeat bottom left; width:110px;}

#orange .hauptnav nav ol li.halloactive{background:url('/img/btn/hallo-active-orange.gif') no-repeat bottom left; width:110px;}
#orange .hauptnav nav ol li.hallo{background:url('/img/btn/hallo-orange.gif') no-repeat bottom left; width:110px;}
#orange .hauptnav nav ol li.halloactive a, .hauptnav nav ol li.hallo a{padding:0 23px 0 0px;}
#orange .hauptnav nav ol li.hallo:hover{background:url('/img/btn/hallo-active-orange.gif') no-repeat bottom left; width:110px;}

.hauptnav nav ol li.zugangactive{background:url('/img/btn/unserzugang-active.gif') no-repeat bottom left; width:176px;}
.hauptnav nav ol li.zugang{background:url('/img/btn/unserzugang.gif') no-repeat bottom left; width:176px;}
.hauptnav nav ol li.zugang:hover{background:url('/img/btn/unserzugang-active.gif') no-repeat bottom left; width:176px;}

#orange .hauptnav nav ol li.zugangactive{background:url('/img/btn/unserzugang-active-orange.gif') no-repeat bottom left; width:176px;}
#orange .hauptnav nav ol li.zugang{background:url('/img/btn/unserzugang-orange.gif') no-repeat bottom left; width:176px;}
#orange .hauptnav nav ol li.zugang:hover{background:url('/img/btn/unserzugang-active-orange.gif') no-repeat bottom left; width:176px;}

.hauptnav nav ol li.nutzenactive{background:url('/img/btn/ihrnutzen-active.gif') no-repeat bottom left; width:147px;}
.hauptnav nav ol li.nutzen{background:url('/img/btn/ihrnutzen.gif') no-repeat bottom left; width:147px;}
.hauptnav nav ol li.nutzen:hover{background:url('/img/btn/ihrnutzen-active.gif') no-repeat bottom left; width:147px;}

#orange .hauptnav nav ol li.nutzenactive{background:url('/img/btn/ihrnutzen-active-orange.gif') no-repeat bottom left; width:147px;}
#orange .hauptnav nav ol li.nutzen{background:url('/img/btn/ihrnutzen-orange.gif') no-repeat bottom left; width:147px;}
#orange .hauptnav nav ol li.nutzen:hover{background:url('/img/btn/ihrnutzen-active-orange.gif') no-repeat bottom left; width:147px;}

.hauptnav nav ol li.arbeitactive{background:url('/img/btn/unserearbeit-active.gif') no-repeat bottom left; width:173px;}
.hauptnav nav ol li.arbeit{background:url('/img/btn/unserearbeit.gif') no-repeat bottom left; width:173px;}
.hauptnav nav ol li.arbeit:hover {background:url('/img/btn/unserearbeit-active.gif') no-repeat bottom left; width:173px;}

#orange .hauptnav nav ol li.arbeitactive{background:url('/img/btn/unserearbeit-active-orange.gif') no-repeat bottom left; width:173px;}
#orange .hauptnav nav ol li.arbeit{background:url('/img/btn/unserearbeit-orange.gif') no-repeat bottom left; width:173px;}
#orange .hauptnav nav ol li.arbeit:hover {background:url('/img/btn/unserearbeit-active-orange.gif') no-repeat bottom left; width:173px;}

.hauptnav nav ol li.kontaktactive{background:url('/img/btn/kontakt-active.gif') no-repeat bottom left; width:122px;}
.hauptnav nav ol li.kontakt{background:url('/img/btn/kontakt.gif') no-repeat bottom left; width:122px;}
.hauptnav nav ol li.kontakt:hover{background:url('/img/btn/kontakt-active.gif') no-repeat bottom left; width:122px;}

#orange .hauptnav nav ol li.kontaktactive{background:url('/img/btn/kontakt-active-orange.gif') no-repeat bottom left; width:122px;}
#orange .hauptnav nav ol li.kontakt{background:url('/img/btn/kontakt-orange.gif') no-repeat bottom left; width:122px;}
#orange .hauptnav nav ol li.kontakt:hover{background:url('/img/btn/kontakt-active-orange.gif') no-repeat bottom left; width:122px;}

.hauptnav nav ol li.blogactive{background:url('/img/btn/ihrnutzen-active.gif') no-repeat bottom left; width:147px;}
.hauptnav nav ol li.blog{background:url('/img/btn/ihrnutzen.gif') no-repeat bottom left; width:147px;}
.hauptnav nav ol li.blog:hover{background:url('/img/btn/ihrnutzen-active.gif') no-repeat bottom left; width:147px;}

#orange .hauptnav nav ol li.blogactive{background:url('/img/btn/ihrnutzen-active-orange.gif') no-repeat bottom left; width:147px;}
#orange .hauptnav nav ol li.blog{background:url('/img/btn/ihrnutzen-orange.gif') no-repeat bottom left; width:147px;}
#orange .hauptnav nav ol li.blog:hover{background:url('/img/btn/ihrnutzen-active-orange.gif') no-repeat bottom left; width:147px;}

/**** MAINCONTENT ****/
#maincontent{width:100%; overflow:hidden; padding:45px 0 0 0; }
#maincontent .maincontentbox{width:980px; margin:0 auto 0 auto;}
#maincontent .maincontentbox h1{color:#575a5d; font-weight:normal; font-size:35px; line-height:44px; margin:0 0 25px 0;}


/* leftcol = content */
#maincontent .maincontentbox .leftcol{float:left; width:560px; margin:0px 0 50px 0; clear:both; }
#maincontent .maincontentbox .leftcol .absatz{padding:48px 0 0 0; margin:10px 0 20px 0;}
#maincontent .maincontentbox .leftcol #absatz1{background:url('/img/common/trenner1.png') no-repeat top left;}
#maincontent .maincontentbox .leftcol #absatz2{background:url('/img/common/trenner2.png') no-repeat top left;}
#maincontent .maincontentbox .leftcol #absatz3{background:url('/img/common/trenner3.png') no-repeat top left;}
#maincontent .maincontentbox .leftcol #absatz4{background:url('/img/common/trenner4.png') no-repeat top left;}
#maincontent .maincontentbox .leftcol #absatz5{background:url('/img/common/trenner5.png') no-repeat top left;}
#maincontent .maincontentbox .leftcol p{margin:0 0 18px 0; }
#maincontent .maincontentbox .leftcol ul, #maincontent .maincontentbox .leftcol ol{margin:0 0 15px 10px; }
#maincontent .maincontentbox .leftcol ul li{padding:0 0 10px 15px; background:url('/img/common/list.gif') no-repeat 0px 9px;}
#maincontent .maincontentbox .leftcol h2{color:#26596f; font-weight:normal; font-size:25px; line-height:25px; margin:0 0 18px 0;}
#maincontent .maincontentbox .leftcol h3{color:#272727; font-weight:bold; text-transform:uppercase; font-size:1em; margin:10px 0 0px 0;}

/* rightcol */
#maincontent .maincontentbox .rightcol{float:left; width:350px; margin:0 0 50px 70px;}
#maincontent .maincontentbox .rightcol .box { margin:0px 0 50px 0px; }
#maincontent .maincontentbox .rightcol .box .hinterlegt1 {padding:15px 15px 15px 15px; background:url('/img/common/einklinkerbg1.jpg') no-repeat bottom right;}
#maincontent .maincontentbox .rightcol .box .hinterlegt2 {padding:15px 15px 15px 15px; background:url('/img/common/einklinkerbg2.jpg') no-repeat bottom right;}
#maincontent .maincontentbox .rightcol p{margin:0 0 18px 0;}
#maincontent .maincontentbox .rightcol h2{font-weight:normal; font-size:25px; text-align:right; margin:0 0 15px 0;}
#maincontent .maincontentbox .rightcol .asidebottom{background:url('/img/common/asidebottombg.png') no-repeat top left; }

/* customers quer ganze breite */
#maincontent .customers{width:980px; margin:0px auto 50px auto; clear:both;}
#maincontent .customers ul{padding:0px 0 0 0; text-align:center;}
#maincontent .customers li{float:left;height:60px; margin:0 13px 8px 30px;}
#maincontent .customers li a{}
#maincontent .toplink{clear:both; width:990px; margin: 0 auto 50px auto;}

/* unsere arbeit - threecols */
#maincontent .maincontentbox .threecols{width:100%; overflow:hidden; margin:0 0 50px 0;}
#maincontent .maincontentbox .threecols .col{width:300px; margin:0 40px 25px 0; float:left; background:white;}
#maincontent .maincontentbox .threecols .last{margin:0 0 25px 0;}
#maincontent .maincontentbox .threecols .col .box{padding:9px 9px 11px 9px; background:url('/img/common/box-bg.jpg'); margin:0 0 15px 0;}
#maincontent .maincontentbox .threecols .col .box:hover{background:url('/img/common/box-bg-hover.jpg');}
#maincontent .maincontentbox .threecols .col .box img{margin:1px;}
#maincontent .maincontentbox .threecols .col .box p{text-align:right; text-transform:uppercase; font-weight:bold;}
#maincontent .maincontentbox .threecols .col a{color:#5a5a5a;}
#maincontent .maincontentbox .threecols .col:hover a{color:#fff; }
#maincontent .maincontentbox .threecols .col .preview{float:left; width: 282px; background: #fff; overflow: auto; }

/* unsere arbeit detail - onecol */
#maincontent .maincontentbox .onecol {width:100%; overflow:hidden; margin:0 0 50px 0;}
#maincontent .maincontentbox .onecol .box{width:642px; float:left;}
#maincontent .maincontentbox .onecol .box .hinterlegt{padding:10px 10px 11px 11px; background:url('/img/common/box-bg.jpg');}
#maincontent .maincontentbox .onecol .box .hinterlegt p{text-align:right; text-transform:uppercase; font-weight:bold;}
#maincontent .maincontentbox .onecol .info {margin:0 0 35px 68%;height:475px;}
#maincontent .maincontentbox .onecol .imgbox{width:620px; height:420px; overflow:hidden; margin:0 0 10px 0;position:relative;}
#maincontent .maincontentbox .onecol .imgscrolltop{width:620px;height:140px;top:10px;position:absolute;z-index:20;}
#maincontent .maincontentbox .onecol .imgscrollbottom{width:620px;height:140px;top:290px;position:absolute;z-index:20;}
#maincontent .maincontentbox .onecol ul.ziffern{float:left; width:200px; font-weight:bold;}
#maincontent .maincontentbox .onecol ul.ziffern li{float:left; background-color:#fff; width:25px; text-align:center; margin:0 10px 0 0;}
#maincontent .maincontentbox .onecol ul.ziffern li:hover{background-color:#2176ba;}
#maincontent .maincontentbox .onecol ul.ziffern li:hover a{color:#fff; text-decoration:none;}
#maincontent .maincontentbox .onecol ul.ziffern li.active{background-color:#2176ba;}
#maincontent .maincontentbox .onecol ul.ziffern li.active a{color:#fff; text-decoration:none;}
#maincontent .maincontentbox .onecol .moreinfo {width:640px;}

/**** FOOTER ****/
footer {display:block; width:100%; overflow:hidden; background:url('/img/common/bg-footer.jpg') no-repeat top center;background-color:#136a9f !important;}
#orange footer{background:url('/img/common/bg-footer-orange.jpg') no-repeat top center!important;background-color:#dcd623 !important;}
footer a{}
footer a:hover {text-decoration:underline;}
footer .content { width:980px; margin:0px auto 0px auto; overflow:visible; clear:both;}
footer .content .stern{float:left; height:120px; width:128px; margin:0 15px 0 0; background:url('/img/common/stern.jpg') no-repeat top left;}
#orange footer .content .stern{float:left; height:120px; width:128px; margin:0 15px 0 0; background:url('/img/common/stern-orange.jpg') no-repeat top left;}
footer .content .footercontent{float:left; width:837px; background:url('/img/common/footercontentbg.jpg') repeat; color:#2e1f05; margin:0 0 40px 0;}
#orange footer .content .footercontent{float:left; width:837px; background:url('/img/common/footercontentbg-orange.jpg') repeat; color:#fff; margin:0 0 40px 0;}
#orange footer .content a{color:#fff}
#orange footer .content a:hover{color:#fff; text-decoration:underline;}
footer .footercontent ol{margin:30px 0 0 40px; font-size:25px; color:#e14f22; width:100%; clear:both;}
#orange footer .footercontent ol{margin:30px 0 0 40px; font-size:25px; color:#fff; width:100%; clear:both;}
footer .footercontent li{float:left; padding:0 10px 0 0; }
footer .footercontent ol a{color:#e14f22;}
#orange .footercontent ol a{color:#fff; }
footer .footercontent h1{margin:0 0 10px 0; font-weight:normal;}
footer .footercontent div.bild{float:left; clear:left; width:80px; height:205px; margin:40px 0 40px 40px;}
footer .footercontent div.text{float:left; margin:40px 0 40px 25px;}
footer .footercontent div.formular{float:left; margin:40px 0 30px 30px; width:450px;}
footer .footercontent .formular label{font-weight:bold;}
footer .footercontent .formular input.text{width:200px; height:23px; margin:0px 10px 10px 0; padding:0 3px 0 3px;}
footer .footercontent .formular input.submit{color:#fff; font-weight:bold; width:105px; /*height:30px;*/ margin:10px 0 5px 0; background:url('/img/btn/submit-bg.jpg') no-repeat; padding:6px 5px 7px 5px;}
#orange footer .footercontent .formular input.submit{color:#fff; font-weight:bold; width:105px; /*height:30px;*/ margin:10px 0 5px 0; background:url('/img/btn/submit-bg-orange.jpg') no-repeat; padding:6px 5px 7px 5px;}
footer .footercontent .formular textarea{padding:3px 3px 3px 3px; margin:0 0 10px 0;}
footer .footercontent .formular .formspalte{float:left; width:215px}