/*****************************************************************************
 * Projekt	| www.bpo.de
 *
 * Datum	| 2009-10-26
 * Datei	| style.css
 * Funktion	| style-definition for all browsers
 *****************************************************************************/

/* 
Aufbau: 1. Kalibrierung
        2. Allgemeine Styles
        3. Styles für Layoutbereiche
        4. Sonstige Styles 
*/

/*====  1. Kalibrierung ====================================================*/

* {
	padding: 0;
	margin: 0;
}

html {
	height: 101%;
}

h1, h2, h3, p, ul, ol {
	margin-bottom: 0.6em;
}

ol ul {
	margin-bottom: 0;
}

li {
	margin-left: 2px;
	padding-left: 8px;
}

#textbereich ul {
	list-style-type: none;
	list-style-position: outside;
}

#textbereich li {
	background-image: url(../images/list.gif);
	background-repeat: no-repeat;
	background-position: left 5px;
	list-style-position: outside;
	margin-left: 2px;
	padding-left: 8px;
}

/*====  2. Allgemeine Styles ===============================================*/

body {
	background-color: #FFF;
	background-repeat: repeat-x;
	color: #636161;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
}

h1 {
	font-size: 185%;
	color: #00b722;
	font-weight: lighter ;
}

h2 {
	font-size: 130%;
	color: #00b722;
}

h3 {
	font-size: 100%;
	color: #1f1e21;
	margin-bottom: 10px;
}

h4 {
	font-size: 100%;
	color: #00b722;
	margin-bottom: 10px;
}

/* Hyperlinks */  

a {
	text-decoration: none;
	outline: none;
}

a:link, a:visited {
	color: #1cbf3a;
}

a:hover, a:focus, a:active {
	color: #73d786;
}

/*====  3. Styles für Layoutbereiche ========================================*/

#wrapper {
	background-color: #fff;
	color: #4c4c4e;
	width: 990px;
	padding: 30px 0px 40px 0px;
}

#left {
	width: 474px;
	float: left;
}

#right {
	width: 475px;
	margin-left: 474px;
	padding-left: 37px;
}

#menue {
	/*overflow: hidden;*/
	font-size: 17px;
	padding-bottom: 88px;

}

	#menue ul {
		float: right;  
  		width: auto; 
  		margin-bottom: 0;
		background-image: url(../images/menuebalken.gif);
		background-repeat: no-repeat;
		background-position: left 5px;
	}

	#menue li {
		float: left; 
   		width: auto; 
   		margin: 0;
		list-style-type: none;
		padding: 0px 16px 0px 13px;
		background-image: url(../images/menuebalken.gif);
		background-repeat: no-repeat;
		background-position: right 5px;
	}
	
	#menue a, #menue span {
		color: #00b722;
		font-weight: normal;
	}
	
	#menue a:hover, #menue a:focus {
		color: #73d786;
	}
	
	#menue .menueaktive {
		color: #73d786;
	}

/* -- Untermenü Profil -- */

#umenue-profil {
	position: absolute;
	top: 56px;
	left: 125px;
}

#umenue-profil a {
	font-size: 11px;
	font-weight: bold;
	line-height: 15px;
}

#umenue-profil .menueaktive {
	font-size: 11px;
	font-weight: bold;
	line-height: 15px;
	color: #73d786;
}

/* -- Untermenü Produkte -- */

#umenue-produkte {
	position: absolute;
	top: 56px;
	left: 195px;
}

#umenue-produkte a {
	font-size: 11px;
	font-weight: bold;
	line-height: 15px;
}

#umenue-produkte .menueaktive {
	font-size: 11px;
	font-weight: bold;
	line-height: 15px;
	color: #73d786;
}

#textbereich {
	margin-top: 50px;
	padding-top: 5px;
	background-image: url(../images/pkt-line.gif);
	background-position: left top;
	background-repeat: no-repeat;
	padding-right: 30px;
	min-height: 467px;
  	height:  auto !important;
  	height: 467px; 
}

.breadcrumb {
		color: #9b9c9e; 
		font-size: 11px;
}

	.breadcrumb a {
		text-decoration: none;
		outline: none;
		color: #9b9c9e !important; 
	}
	
	.breadcrumb a:link, .breadcrumb a:visited { 
		color: #9b9c9e !important; 
	}
	
	.breadcrumb a:hover, .breadcrumb a:focus, .breadcrumb a:active { 
    	color: #1f1e21 !important; 
	}
	
	.breadcrumb-active {
		color: #1f1e21 !important; 
	}

/* -- Linker Seitenbereich -- */

#winkel {
	margin-top: 110px;
	padding-left: 110px;
	padding-top: 16px;
	height: 267px;
	background-image: url(../images/green-01.gif);
	background-repeat: no-repeat;
	z-index: 10;
}

#winkel2 {
	margin-top: 110px;
	padding-left: 295px;
	padding-top: 60px;
	height: 267px;
	color: #868788;
	background-image: url(../images/green-01.gif);
	background-repeat: no-repeat;
	z-index: 10;
}

#winkel3 {
	margin-top: 110px;
	padding-left: 110px;
	padding-top: 16px;
	height: 267px;
	background-image: url(../images/green-02.gif);
	background-repeat: no-repeat;
	z-index: 10;
}

#gfx {
	margin-top: 0px;
	padding-left: 0px;
	padding-top: 0px;
}

#gfx2 {
	margin-bottom: -310px;
	padding-left: 83px;
	padding-top: 102px;
	z-index: 20;
	width: 200px;
}

#logo { 
    position: relative; 
}

	#logo p {
		position: absolute;
		top: 80px;
		left: 90px;
		font-size: 11px;
   	}
   
	#sprache {
		position: absolute;
		top: -10px;
		right: 10px;
		font-size: 10px;
		color: #9b9c9e;
   	}
	
	.sprache-active {
		color: #cfcfd1;
   	}
   
	#sprache a { 
		text-decoration: none;
		outline: none;
		color: #9b9c9e; 
	}
   	
	#sprache a:link, #sprache a:visited { 
		color: #9b9c9e; 
	}
	
	#sprache a:hover, #sprache a:focus, #sprache a:active { 
    	color: #cfcfd1; 
	}

#footer {
	padding-top: 15px;
	padding-right: 30px;
}

	#footer ul {
		float: left;  
  		width: auto; 
  		margin-bottom: 0;
		background-image: url(../images/f-menuebalken.gif);
		background-repeat: no-repeat;
		background-position: left 4px;
	}

	#footer li {
		float: left; 
   		width: auto; 
   		margin: 0 ;
		list-style-type: none;
		padding: 0px 8px 0px 8px;
		background-image: url(../images/f-menuebalken.gif);
		background-repeat: no-repeat;
		background-position: right 4px;
	}
	
	#footer a, #footer span {
		color: #1cbf3a;
		font-weight: normal;
	}
	
	#footer a:hover, #footer a:focus {
		color: #73d786;
	}



/*====  4. Sonstige Styles ==================================================*/


.bold {
	color: #333;
	font-weight: bold;
}

#sitemap #textbereich ul {
	list-style-type: none;
	list-style-position: outside;
}

#sitemap #textbereich li {
	background-image: url(../images/kreislist.gif);
	background-repeat: no-repeat;
	background-position: left 5px;
	list-style-position: outside;
	margin-left: 0;
	padding-left: 12px;
}

	#sitemap #textbereich li a {
		color: #58595b;
		font-weight: bold;
	}
	
	#sitemap #textbereich li a:hover, #sitemap #textbereich li a:focus {
		color: #9b9c9e;
	}
	
a.bold:link, a.bold:visited {
	color: #58595b;
}

a.bold:hover, a.bold:active, a.bold:focus {
	color: #9b9c9e;
}

/* Underline Link */

a.underline:link, a.underline:visited {
	color: #58595b;
	text-decoration: underline;
}

a.underline:hover, a.underline:active, a.underline:focus {
	text-decoration: underline;
	color: #9b9c9e;
}

/* Grauer Link */

a.grau:link, a.grau:visited {
	color: #58595b;
	font-weight: normal;
	text-decoration: none;
}

a.grau:hover, a.grau:active, a.grau:focus {
	color: #9b9c9e;
}

/*  Menü für Forum (linksbündig) */

#forum #menue {
	/*overflow: hidden;*/
	font-size: 17px;
	margin-top: 0;
	padding-bottom: 88px;
	margin-left: 40px;
}

	#forum #menue ul {
			float: left;  
			width: auto; 
			margin-bottom: 0;
			background-image: url(../images/menuebalken.gif);
			background-repeat: no-repeat;
			background-position: left 5px;
		}
	
	#forum #menue li {
			width: auto; 
			margin-left: 0;
			list-style-type: none;
			padding: 0px 16px 0px 13px;
			background-image: url(../images/menuebalken.gif);
			background-repeat: no-repeat;
			background-position: right 5px;
		}
		
.red {
	color: #F06;
}

.green {
	color: #00b722;
	font-weight: normal;
}

/* Trennlinien in Text */

#linie, #linie2, #linie3, #linie4, #linie5, 
#linie6, #linie7, #linie8, #linie9, #linie10,
#linie11, #linie12, #linie13, #linie14, #linie15, 
#linie16, #linie17, #linie18, #linie19, #linie20 {
	width: auto; 
	margin-left: 0;
	padding: 10px 0px 10px 0px;
	background-image: url(../images/txt-pkt-line.gif);
	background-repeat: no-repeat;
	background-position: left 12px;
	margin-right: -30px;
}

/* mini-workshop */

#mini-workshop {
	width: auto; 
	margin-left: 0;
	margin-right: -30px;
	padding: 10px 10px 10px 10px;
	border: 2px solid #00B722;
}

/* block-link */

#block-link {
	width: auto; 
	margin-left: 0;
	margin-right: -30px;
	padding: 0;
	text-align: right;
}

	#block-link a:link, #block-link a, #block-link span, 
	#block-link a:hover, #block-link a:focus, 
	#block-link a:visited {
		color: #00b722;
		border: 0px;
	}
	
	#block-link img{
		border: 0px;
	}