@charset "utf-8";
/*
(c) Copyright 2009 pixeler webagentur. All rights reserved.
theaterstr. 6 // 37073 goettingen // germany
T +49 551 2829464-0 // F +49 551 2829464-9
info@pixeler.de // www.pixeler.de

STYLESHEET MEDIA=SCREEN
*/

body {margin:0; padding:0; text-align:center; font-family:"Trebuchet MS",Verdana,Arial,Sans-serif; font-size:14px; color:#749fAE; background:#003446 url(images/back.png) repeat-x;}

/*
________________________________________________________________________________________________________________________globals
*/
.clearfloat {clear:both; height:0; font-size: 1px; line-height: 0px;}
.container {width:900px; margin:0 auto; text-align:left;}
img {border:none;}
.underline-big {width:700px; margin:10px 0 20px 100px; height:5px; background:url(images/headings/underline-big.png) no-repeat;}
h2 {font-weight:lighter; font-size:18px; letter-spacing:1px; color:#EEE; background:url(images/headings/underline-small.png) no-repeat; background-position:bottom; margin:20px 0 5px 0; padding:0 0 2px 0; text-align:center; opacity:0.99;}
.mehr {height:20px; background:url(images/headings/underline-small-2.png) no-repeat center; margin-top:25px;}
.mehr a {display:block; text-indent: -9000px;}
p.l {text-align:left;}
.r {text-align:right;}
p.c {text-align:center;}
span.i {font-style:italic;}
span.b {font-weight:bold;}
.quote {font-weight:bold; font-size:38px; color:EEE; overflow:hidden;}
.quote-r {text-align:right;}
.quo-cont {line-height:24px; font-style:italic; letter-spacing:1px; text-align:center; margin:-30px 30px -20px 30px;}
a.button {width:200px; height:30px; background:url(images/button.png); line-height:30px; margin:10px 0; font-weight:bold; display:block; text-decoration:none;}
a.button:hover {background:url(images/button2.png); text-decoration:none;}
a.button img {float:left; margin:8px 10px;}
.thirds ul, .two3rds-left ul {list-style-image:url(images/bullet.png); padding-left:10px; margin:0;}
.thirds li, .two3rds-left li {padding:0; margin:10px 0 10px 5px;}

	/*links*/
a:focus {outline:none;}
a {color:#EEE; opacity:0.99;}
a:hover {color:#FFF;}

	/*3 drittel*/
.thirds {background:url(images/thirds-bck.png);}
.thirds-top {width:900px; height:100px; background:url(images/thirds-top.png);}
.thirds p {font-size:13px;}
.left3rd, .mid3rd, .right3rd {opacity:0.99; line-height:22px;}
.left3rd {float:left; width:270px; padding:0 30px 10px 0;}
.mid3rd {float:left; width:240px; padding:0 30px 10px 30px;}
.right3rd {float:left; width:270px; padding:0 0 10px 30px;}

	/*2 drittel links*/
.two3rds-left {background:url(images/two3rds-left-bck.png);}
.two3rds-left .left {float:left; width:570px; padding:0 30px 10px 0;}
.two3rds-left .right {float:left; width:270px; padding:0 0 10px 30px;}


/*
________________________________________________________________________________________________________________________slideshow
*/
#slideshow {width: 900px; z-index:10;}  
#slideshow ul {margin: 0; padding: 0; list-style-type: none;  /* height: 1%;  IE fix */}  
#slideshow ul:after {content: "."; clear: both; display: block;  height: 0;  visibility: hidden;}              
#slideshow .slides {overflow: hidden;  width: 900px; height:260px;}  
#slideshow .slides ul {/* total width of all slides */ width: 5400px;}     
#slideshow .slides li {width: 900px;  float: left;  padding: 0;}  
	/*nav*/
#slideshow .slides-nav {padding-left:540px; background:url(images/thirds-bck.png);}  
#slideshow .slides-nav li {float: left;}  
#slideshow .slides-nav li a {display:block; outline:none; width:30px; height:30px; margin:2px 5px; background:url(images/slideshow-icon.png) no-repeat; text-align:center; line-height:30px; text-decoration:none;}
#slideshow .slides-nav li.on a, #slideshow .slides-nav li a:hover {background:url(images/slideshow-icon-on.png) no-repeat;}

/*
________________________________________________________________________________________________________________________tooltip
*/
.tip {width:200px; background:url(images/tooltip/tipTop.png) no-repeat; padding-top:19px; display:none; position:absolute; z-index:12; font-size:12px; font-weight:bold; color:#FEFEFE;}
.tipMid {width:160px; padding:0 20px; background:url(images/tooltip/tipMid.png);}
.tipBtm {width:200px; background:url(images/tooltip/tipBtm.png); height:37px;}
.tTip {cursor:pointer;}


/*
________________________________________________________________________________________________________________________forms
*/
input {outline:none;}
form {font-size:12px; color:#749fAE; text-align:left;}
form h3 {text-align:left; margin:20px 0 10px 105px; padding:0;}
form br {clear:both;}
input {float:left; width:140px; margin:2px 10px; padding:5px; display:block; background:url(images/input-bck.png) repeat-x; border:1px solid #1A4959; font-size:12px; color:#EEE;}
.inputon {border:1px solid #205A6E; background:#00475F url(images/input-bck2.png) repeat-x;}
.inputoff {border:1px solid #1A4959; background:#003B4F url(images/input-bck.png) repeat-x;}
.buttonon {border:1px solid #EEE;}
.buttonoff {border:1px solid #1A4959;}
label {float:left; width:75px; margin:2px 10px; padding-top:8px; display:block; text-align:right;}
textarea {width:210px; background:#003446; border:1px solid #1A4959; color:#EEE; padding:5px; margin:5px 10px 0 35px; font-family:"Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size:12px; background:#003B4F url(images/input-bck.png) repeat-x;}
input.submit {width:auto; cursor:pointer; margin:5px 0 0 105px;}
input.ksubmit {width:auto; cursor:pointer; margin:5px 0 0 183px;}
.formid_hidden {margin:0; padding:0; border:none; height:0; width:0; opacity:0; visibility:hidden;}
.errors {font-size:11px; color:#EEEEEE; margin:0 0 10px 37px;}

/*
________________________________________________________________________________________________________________________lightbox
*/
#jquery-overlay {position: absolute;top: 0;left: 0;z-index: 90;width: 100%;height: 500px;}
#jquery-lightbox {position: absolute;top: 0;left: 0;width: 100%;z-index: 100;text-align: center;line-height: 0;}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {position: relative;background-color: #fff;width: 250px;height: 250px;margin: 0 auto;}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {position: absolute;top: 40%;left: 0%;height: 25%;width: 100%;text-align: center;line-height: 0;}
#lightbox-nav {position: absolute;top: 0;left: 0;height: 100%;width: 100%;z-index: 10;}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {width: 49%;height: 100%;zoom: 1;display: block;}
#lightbox-nav-btnPrev { left: 0; float: left;}
#lightbox-nav-btnNext { right: 0; float: right;}
#lightbox-container-image-data-box {font-size: 10px;background-color: #fff;margin: 0 auto;line-height: 1.4em;overflow: auto;width: 100%;padding: 0 10px 0;}
#lightbox-container-image-data {padding: 0 10px; color: #666; }
#lightbox-container-image-data #lightbox-image-details { width: 70%; float: left; text-align: left; }	
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {display: block; clear: left; padding-bottom: 1.0em;	}			
#lightbox-secNav-btnClose {width: 66px; float: right;padding-bottom: 0.7em;	
}

/*
________________________________________________________________________________________________________________________top
*/
.top {width:900px; height:83px; overflow:hidden;}
.top .nav {float:left; display:block; line-height:105px; height:83px; padding:0 20px; border-left:1px solid #002E3F;}
.top .nav-last {float:left; display:block; line-height:105px; height:83px; padding:0 20px; border-left:1px solid #002E3F; border-right:1px solid #002E3F;}
.top a {font-weight:bold; color:#749fAE; text-decoration:none;}
.top a:hover {background:url(images/nav-bck.png) repeat-x; text-decoration:none; color:#EEE;} 
.top #logo {float:left; margin:25px 100px 14px 0;}

/*
________________________________________________________________________________________________________________________footer
*/
.footer {width:100%; height:180px; background:#002837; font-size:12px; color:#749fAE; overflow:hidden;}
.footer a {text-decoration:none;}
.footer a:hover {color:#749fAE;}
	/*left*/
.footer .left {float:left; width:290px; height:180px; padding:10px 10px 0 0; background:url(images/footer-bck.png);}
.footer .adr {float:left; width:120px; margin:10px 20px 0 0;}
.footer .adr2 {float:left; width:150px; margin-top:10px;}
.footer .adr2 a {border-bottom:1px solid #002E3F; text-align:right; display:block; width:120px; font-weight:bold;}
.footer .probono {width:290px; font-size:10px;}
.footer .probono-icon {float:left; text-align:center; margin:0 10px;}
.footer .probono-icon img {margin:30px 0 10px 0;}
	/*mid*/
.footer .mid {float:left; width:300px; padding-top:10px;}
.footer .mid a {text-align:left; display:block; width:260px; padding-left:50px; font-weight:bold; font-size:13px; letter-spacing:1px; margin-top:16px; color:#749fAE; background:url(images/ani_linkback.png) no-repeat; background-position:bottom;}
.footer .mid a:hover, .footer .mid a.selected {color:#FFF;}
	/*right*/
.footer .right {float:right; width:290px; height:180px; padding:10px 0 0 10px; text-align:right; background:url(images/footer-bck2.png);}
.footer .right h2 {font-size:30px; margin:0; padding:20px 0; font-weight:normal; line-height:normal; background:none; text-align:right;}
.footer .right a.social {display:block; width:32px; height:32px; float:right; margin:30px 0 0 35px; background-image: url(images/social-icons.png);}
.footer .right a.fb {background-position:0 32px;}
.footer .right a.fb:hover {background-position: 0 0;}
.footer .right a.wp {background-position: 96px 32px;}
.footer .right a.wp:hover {background-position: 96px 0;}
.footer .right a.tw {background-position: 64px 32px;}
.footer .right a.tw:hover {background-position: 64px 0;}
.footer .right a.rs {background-position: 32px 32px;}
.footer .right a.rs:hover {background-position: 32px 0;}
	/*ani*/
.popup {width:300px; height:340px; overflow:hidden; position:fixed; left:50%; margin-left:-150px; top:50%; margin-top:-170px; z-index:11; display:none;}
.popup .top {width:300px; height:9px; background:url(images/popup/popup_01.png);}
.popup .main {width:300px; height:320px; background:url(images/popup/popup_02.png);}
.popup .btm {width:300px; height:11px; background:url(images/popup/popup_03.png);}
.popup h3 {margin:0; padding:0 0 20px 35px; color:#EEE; letter-spacing:2px; opacity:0.95;font-size:16px;}
.popup .main p {padding: 3px 35px; font-size:12px; text-align:justify;}
.popup .main h3 {text-align:left;}
.closeani {cursor:pointer; width:20px; height:20px; background:url(images/ani_close.png) no-repeat; margin:0 9px 0 270px;}
.popupbck {width:100%; height:100%; background:url(images/popup/popupbck.png); z-index:10; position:fixed; top:0; left:0;}
.ajax-error {padding:20px; color:#C60000; font-weight:bold;}
/*
________________________________________________________________________________________________________________________hallo
*/
.index-u {width:531px; height:35px; background:url(images/headings/index-kreative-webagentur.png) no-repeat; margin:30px 0 0 110px; text-indent:-9000px;}
.index-u-sub {margin:0 0 20px 180px; color:#749fAE; line-height:25px;}


/*
________________________________________________________________________________________________________________________wer wir sind
*/
.wer h1 {width:900px; text-align:center; height:30px; text-indent:-9000px; background:url(images/headings/wer-u.png) no-repeat;}
.team {float:left; width:270px; overflow:hidden; margin:15px 10px 5px 0; font-size:12px; background:url(images/headings/underline-small.png) no-repeat bottom;}
.team .tleft {float:left; width:108px;}
.team .tright {float:left; width:160px;}
.team .tright h3 {margin:0; padding:0; color:#EEE; font-weight:normal; font-size:14px;}
.team img {border:1px solid #1C5770;}

/*
________________________________________________________________________________________________________________________was wir machen
*/
.was h1 {width:900px; text-align:center; height:30px; text-indent:-9000px; background:url(images/headings/was-u.png) no-repeat;}
div.toggle-trigger {background:url(images/toggle-trigger.png) no-repeat; height:30px; line-height:30px; cursor:pointer; padding:0 0 0 30px; font-weight:bold; color:#EEE; letter-spacing:1px; margin:10px 0 0 0;}
div.tgactive {background:url(images/toggle-trigger-active.png) no-repeat;}
div.toggle-cont {margin:0; padding:0;}

/*
________________________________________________________________________________________________________________________kontakt
*/
.kontakt h1 {width:900px; text-align:center; height:30px; text-indent:-9000px; background:url(images/headings/kontakt-u.png) no-repeat;}

/*
________________________________________________________________________________________________________________________wie wir arbeit
*/
.wie h1 {width:900px; text-align:center; height:30px; text-indent:-9000px; background:url(images/headings/wie-u.png) no-repeat;}
.wie .left3rd {padding:0; margin:0; width:300px;}
.wie .left3rd img {float:right;}
.wie ul {margin-top:60px;}
.wie .index-u-sub {margin-top:50px;}

/*
________________________________________________________________________________________________________________________agb
*/
.agb h1 {width:900px; text-align:center; height:40px; text-indent:-9000px; background:url(images/headings/agb.png) no-repeat;}

/*
________________________________________________________________________________________________________________________impressum
*/
.impressum h1 {width:900px; text-align:center; height:30px; text-indent:-9000px; background:url(images/headings/impressum.png) no-repeat;}

/*
________________________________________________________________________________________________________________________datenschutz
*/
.datenschutz h1 {width:900px; text-align:center; height:30px; text-indent:-9000px; background:url(images/headings/datenschutz.png) no-repeat;}

/*
________________________________________________________________________________________________________________________fehler
*/
.fehler {width:600px; margin:0 auto; opacity:0.99; padding:50px 0 100px 0;}

/*
________________________________________________________________________________________________________________________projektanfrage
*/
.anfrage h1 {width:900px; text-align:center; height:40px; text-indent:-9000px; background:url(images/headings/projektanfrage.png) no-repeat;}
.pr-anfrage {text-align:right;}
.pr-anfrage label, .pr-anfrage input, .pr-anfrage textarea, .pr-anfrage select {float:right; width:375px; text-align:left; margin:0;}
.pr-anfrage label {margin:15px 0 0 0; padding:0; font-size:12px;}
.pr-anfrage .submit {width:120px; text-align:center; margin-top:20px;}
.pr-anfrage select {width:387px; border:1px solid #1A4959; background:#003B4F; color:#EEE; line-height:30px;}
.pr-anfrage option {padding:2px; outline:none; line-height:30px;}