@charset "utf-8";
/* CSS Document */

@font-face {
    font-family: 'LeagueGothicRegular';
    src: url('League_Gothic-webfont.eot');
    src: url('League_Gothic-webfont.eot?#iefix') format('embedded-opentype'),
         url('League_Gothic-webfont.woff') format('woff'),
         url('League_Gothic-webfont.ttf') format('truetype'),
         url('League_Gothic-webfont.svg#LeagueGothicRegular') format('svg');
    font-weight: normal;
    font-style: normal;
	}

* {padding:0; margin:0;}

body {background:#e2d7bb url(../../images/body.jpg); font:0.9em 'Droid Serif', arial, serif; color:#201f09; font-style:italic;}
p {margin:0 0 1.5em 0;}
li {list-style:none;}
h1 a {position:absolute; width:150px; height:150px; top:85px; left:390px;}
#index h1 a {width:150px; height:150px; top:220px!important; left:755px!important; position:absolute; }


h3  {color:#eae1c8; text-transform:uppercase; font-weight:normal; background:url(../../images/h3.png) center top no-repeat; font:1.5em 'LeagueGothicRegular', Arial, sans-serif; padding:6px 0 20px 0; margin:0 0 0.6em 0; letter-spacing:0.05em; text-align:center; }
h3 a {color:#eae1c8; text-decoration:none;}
h4  {color:#eae1c8; text-transform:uppercase; font-weight:normal; background:url(../../images/h3.jpg) no-repeat; font:1.4em 'LeagueGothicRegular', Arial, sans-serif; padding:3px 3px 3px 12px; margin:0 0 0.6em 0; letter-spacing:0.05em;}
h5 {margin:0 0 0.8em 0; font-size:1.4em; font-weight:normal; color:#6b3110;}
a {color:#201f09;}
blockquote {width:255px; background:#f5f2e9 url(../../images/blockquote.jpg) bottom left no-repeat; padding:20px 20px 50px 20px; }
fieldset {border:0;}
label {width:90px; display:block; float:left; padding:0 0 0 15px; margin:0 10px 8px 0;}
input, select {width:180px; float:left; display:block; padding:3px; border-left:1px solid #e2e2e2; border-top:1px solid #e2e2e2; border-bottom:1px solid #c1c1c1; border-right:1px solid #c1c1c1; background-color:#fbfbfb;margin:0 0 10px 0; }
input:focus {border:1px solid #444;}
.required {background:url(../../images/li.png) right center no-repeat;}
form br {clear:both; float:none;}
img.required {border:0!important; background:none!important; padding:0!important;}

#Teilnemen {margin:0 0 0 0;}
.eventanmeldung {width:45%; float:left; margin:0 10px 0 0;}
.eventanmeldung input {width:100px; padding:6px;}
.eventanmeldung label {width:90px;}
#label-labelingverfahren {width:1px; margin:0 0 0 -1px;}


.design-img {margin:0 20px 20px 20px;}
/*Classes*/

.trenner {width:938px; height:5px; clear:both; float:none; background:url(../../images/trenner.gif) center top no-repeat; margin:0 0 1.5em 0;}
.trenner2 {width:938px; clear:both; float:none; background:url(../../images/trenner2.jpg) center top  no-repeat; margin:0 0 1.5em 0; padding:40px 0 0 0;}
.trenner3 {width:938px; height:5px; clear:both; float:none; background:url(../../images/trenner3.gif) center top no-repeat; margin:0 0 1.5em 0;}
.clear {clear:both; float:none;}
.no-text {font-size:1px; display:block; overflow:hidden;  text-indent:-9999px;}
.last {margin-right:0!important;}

#index #wrapper {width:100%; position:relative; background:url(../../images/wrapper-index.jpg) center top repeat-x;}
#index #wrapper2 {width:100%; position:relative; background:url(../../images/wrapper2-index.jpg) center top no-repeat;}
#wrapper {width:100%; position:relative; background:url(../../images/wrapper.jpg) repeat-x;}
#wrapper2 {width:100%; position:relative; background:url(../../images/wrapper2.jpg) center top no-repeat;}

#pflanzen {width:400px; position:absolute; height:172px; background:url(../../images/pflanzen.png) center top no-repeat; z-index:50;}
#index #pflanzen {width:100%; position:absolute; height:172px; background:url(../../images/pflanzen.png) center top no-repeat; z-index:50;}

#index #container {width:960px; margin:0 auto; position:relative; background:url(../../images/container-index-en.jpg) no-repeat;}
#container {width:960px; margin:0 auto; position:relative; background:url(../../images/container.jpg) no-repeat;}

#index #header {height:685px;}
#header {height:264px;}
#header h2 {position:absolute; top:240px; left:380px; color:#fff; font-weight:normal; font-size:1em; width:300px;}

#sprache {position:absolute; top:116px; right:83px; z-index:60;}
#sprache li {float:left;}
#sprache a {width:40px; height:27px;}

#navi {position:absolute; top:62px; left:10px; width:960px; z-index:200;}
#index #navi { top:550px; left:50px;}
#navi li { float:left; font-size:0.9em; margin:0 10px 0 0; position:relative; letter-spacing:0.05em;}
#index #navi li {width:170px; font-size:0.75em!important; padding:0; margin:0 26px 20px 0; }
#index #navi li.service {width:203px; margin:0 134px 0 0;}
#index #navi li.events {width:170px; margin:0;}
	
#index #navi li.design {width:170px; margin:0; position:absolute; top:-196px; left:340px; color:#fff;}
#index #navi li.coffee {width:170px; margin:0; position:absolute; top:-196px; left:530px; color:#fff; }
#index #navi li.design .mehr, #index #navi li.coffee .mehr {margin:1px 0 0 10px; color:#fff; display:block; clear:both; float:none; position:absolute; }
#index #navi .mehr {margin:1px 0 0 10px;  display:block; clear:both; float:none; position:absolute; top:92px; font-size:0.85em!important;}
#navi a {display:block; color:#514e47; text-decoration:none; font:1.5em 'LeagueGothicRegular', Arial, sans-serif; text-transform:uppercase; color:#2e2e2e; padding:4px 0 4px 20px; letter-spacing:0.05em;}
#navi a:hover {color:#446cbd;}
#index #navi a {padding:0 0 0 20px;}
	#navi ul {position:absolute; display:none; background: url(../../images/bg-navi-ul2.png) no-repeat; top:29px; z-index:50; padding:10px 10px 10px 0;}
		#navi-design { width:132px;}
		#navi-coffee { width:130px;}
		#navi-service {width:190px;}
		#navi-shop {width:164px;}
		#navi-ueber-uns {width:147px;}
		#navi-events {width:100px;}
	#navi li:hover ul {display:block;}
	#navi ul li { float:none; font-size:0.9em; margin:0 0 10px 0; padding:0 10px 0 0!important; position:relative; letter-spacing:0.05em;}
	#navi ul li a {font:1.1em 'Droid Serif', arial, serif; text-transform:none; padding:0 0 0 20px!important;}

#index #navi a {height:23px;}
#index #navi a:hover {color:#B30000;} 
#index #navi ul {background: url(../../images/bg-navi-ul.png) bottom left no-repeat;  position:absolute; display:none; padding:5px 5px 35px 5px; margin:0px 0 0 -15px; z-index:200;}
#index #navi li.coffee ul {background: url(../../images/bg-navi-ul-coffee.png) bottom left no-repeat; }
#index #navi li:hover ul {display:block;}
	#index #navi ul li {margin:0 26px 0 0; }
	#index #navi ul li a {font:1.4em 'Droid Serif', arial, serif; color:#514e47; text-transform:none; height:auto; padding:5px 30px!important; display:block;}
	#index #navi ul li a:hover {text-decoration:underline; color:#514e47; }
	#index #navi li.coffee  ul li a {color:#fff;}


#design, #coffee {height:24px!important; }
#unser-service width:215px;}
#unser-service:hover {background-position:-9999px;}
#kontakt { width:215px;}
#kontakt:hover {background-position:-9999px;}
#ueber-uns {width:200px;}
#ueber-uns:hover {background-position:-9999px;}
#events {width:170px;}
#events:hover {background-position:-9999px;}
#navi li#shop { padding:0 110px 0 0; }


#content {line-height:1.4em; position:relative; padding:0 0 0 15px;}
#referenzen { height:350px; background:url(../../images/referenzen-en.jpg) 5px 0 no-repeat; clear:both; float:none; overflow:hidden; padding:100px 0 0 0; position:relative; margin:0 0 0 -17px; }
#referenzen a {position:absolute; width:122px; height:58px; display:block; right:20px; top:210px;}

#anfrage {background:url(../../images/anfrage-en.jpg) top center no-repeat; padding:100px 0 0 0; clear:both; float:none; position:relative;}
#leistungen {background:url(../../images/our-offers.jpg) no-repeat; padding:100px 0 0 0; clear:both; float:none; margin:-15px 0 0 0;}
	.oder {width:276px; height:43px; background:url(../../images/or.jpg) no-repeat;}

	
	
.col2 {width:430px; float:left; margin:0 30px 0 0;}
.col2a {width:390px; float:left; position:relative;}
.pay-sub {border:0; background:none;}
	.fairtrade {margin:0 0 0 -50px;}
.col2b {width:545px; float:left; position:relative;}
.col2c {text-align:right; padding:0 20px 0 30px;  width:160px; float:left; position:relative;}
	.warenkorb { float:left; margin:0 20px 0 0!important; display:block;}
.col3 {width:295px; float:left; margin:0 20px 0 0;}
.col4 {width:610px; float:left; margin:0 20px 0 0;}
#anfrage2 {position:relative;}
#anfrage .col3, #anfrage2 .col3 {width:263px;}


.vergroessern {width:290px;  background:url(../../images/enlarge.jpg) bottom center no-repeat; padding:0 0 25px 0;}
.bild {width:290px;  background:url(../../images/bild.jpg) bottom center no-repeat; padding:0 0 25px 0;}
#content img, #content a img {border:1px solid #ccc; background-color:#fff; padding:4px;}
#content img.ohne {border:0!important; background:none;}
img.logo {margin:0 10px 5px 0;}
.first {background:url(../../images/first.png) 0 3px no-repeat; width:48px; height:54px; display:block; float:left;}
.design-img {margin:0 20px 20px 20px;}


#content ul {margin:0 0 1.5em 0; clear:both; float:none;}
#content li {background:url(../../images/li.png) 0 4px no-repeat; padding:0 0 3px 20px; margin:0 0 0 5px;}

.www {background-color:#af1317; color:#fff; padding:4px 8px; text-decoration:none; float:right;}
.www:hover {text-decoration:underline;}
.rechts {font-size:0.9em; margin-left:120px;}

h3#sechsgruende {width:539px; height:59px; background:url(../../images/h3-sechsgruende-en.jpg) no-repeat;}


#footer {width:100%; height:559px;  background:url(../../images/footer.jpg) top center repeat-x; position:relative;}
#footer-inner {width:980px; height:329px; padding:230px 0 0 0; margin:0 auto; position:relative; background:url(../../images/footer-inner-en.jpg) no-repeat; font-size:0.9em;}
#footer ul, #footer p, #footer h2, #footer dl {float:left; font-style:italic;   margin:0 30px 0 0;  line-height:1.5em; }
#footer h2 a, #footer h2 {width:110px!important; height:80px; display:block; margin:8px 0 0 0!important;}
#footer dl { padding:0 0 0 18px; width:210px;}
#footer dt { display:block; float:left; width:50px;}
#footer dd {float:left; width:160px; display:block;}
#footer dl.geschaeftsfuehrer {width:160px; margin:0!important;}
#footer dl.geschaeftsfuehrer dt {width:60px;}
#footer dl.geschaeftsfuehrer dd {width:80px;}
#footer a {color:#201f09; text-decoration:none;}
#footer a:hover {text-decoration:underline;} 
#footer-navi {position:absolute; right:30px; top:310px;}
#glueckstueck {position:absolute; width:112px; height:50px;  top:487px; left:455px; }
#zert {float:left;}
#zert p {padding:0 10px 0 10px; margin:50px 0 0 0;}
#zert p#foot-fairtrade {width:20%; padding:0 0 0 60px; }
#sitemap {position:absolute; top:355px; padding:0 40px 0 20px;}
#sitemap a {padding:0 5px 0 0; }
#sitemap li { background:url(../../images/li.png) 0 1px no-repeat; padding:0 0 0 17px; line-height:1.2em;}
#sitemap ul { float:left;margin:0 20px 0 0;}
#top {position:absolute; top:26px;  left:185px; z-index:150; padding:20px 0 0 130px;  height:177px; overflow:hidden;}
#facebook {width:110px; height:40px;position:absolute; top:18px; left:0;}




p#fehlermeldung {display:none; width:245px; background:#f5f2e9 url(../../images/blockquote.jpg) bottom left no-repeat; padding:15px 15px 75px 15px; font-size:0.8em;position:absolute; top:120px;}
#anfrage2 p#fehlermeldung  {top:0;}}

#slideshow {
	width:654px; 
	height:285px;
	background:url(../../images/slider.jpg) no-repeat;
	float:left;
	display:block;
	padding:0px 0 100px 0;
	
	}
	
#slideshow2 {
	width:654px; 
	height:285px;
	font-size:0.9em; 
	line-height:1.4em;
	overflow:hidden;
	float:left;
	display:block;
	top:0;
}

#auswahl {width:574px; height:305px; padding:40px;}
#auswahl a {padding:4px 4px 4px 25px; background:url(../../images/radio.png) 0 4px  no-repeat; display:block;}
#auswahl a:focus {background:url(../../images/radio-hover.png) 0 4px no-repeat;}

#beratung-angaben, #kontaktdaten, #kontaktdaten2 {width:574px; height:305px; padding:40px; position:relative;}


#beratungszeit {width:574px; height:305px; padding:40px; position:relative;}

#submit, #submit2 {width:152px; height:41px; background:url(../../images/send.jpg) no-repeat; display:block; border:0; position:absolute; bottom:122px; right:81px; cursor:pointer; z-index:100!important;}
#submit:hover, #submit2:hover { background:url(../../images/send-hover.jpg) no-repeat;}

#Teilnemen #submit2 {bottom:85px; right:43px; }

#kontaktdaten2  #submit {bottom:52px; right:43px;}

.checkbox, .radio {width:20px; float:left;}
label.checkbox{width:140px;}
label.radio {width:340px;}

#danke, #danke-preisangebot {width:504px; height:305px; padding:50px 100px 50px 50px; position:relative;}
#preisangebot {width:534px; height:305px; padding:40px 80px 40px 40px; position:relative;}

#labelingverfahren, #verpackungsdesign, #umsatz {width:534px; height:305px; padding:40px 80px 40px 40px; position:relative;}

#labelingverfahren label.checkbox, #verpackungsdesign label.checkbox,  #umsatz label.checkbox {width:300px;}

.zurueck {
  background:transparent url(../../images/left.png) center center no-repeat;
  position:absolute;
 width:50px; height:50px;  bottom:125px; left:20px;
 float:left;
}
.weiter {
  background:transparent url(../../images/right.png) center center no-repeat;
    position:absolute;
 width:50px; height:50px;  bottom:125px; left:80px;
 float:left;
}


#slideshow {
	width:654px; height:385px; margin:0 0 0 310px;
	background:url(../../images/slider.jpg) no-repeat;
	position:relative; font-size:0.9em; line-height:1.4em;
}



/** 
 * Slideshow controls style rules.
 */
.control {
  display:block;
  width:50px;
  height:335px;
  text-indent:-10000px;
  position:absolute;
  cursor: pointer;
}
#leftControl {
  top:0;
  left:0;
  background:transparent url(../../images/left.png) center center no-repeat;
}
#rightControl {
  top:0;
  right:40px;
  background:transparent url(../../images/right.png) center center no-repeat;
}