/* `Basic HTML
----------------------------------------------------------------------------------------------------*/

/* font normalization inspired by  from the YUI Library's fonts.css: developer.yahoo.com/yui/ */
body { 
	/*background: white url('../images/gridbg.gif'); /* Typo Grid */
	font:13px/1.231 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif; 
	*font-size:small; /* hack retained to preserve specificity */
} 
select, input, textarea, button { font:99% sans-serif; }

/* normalize monospace sizing
 * en.wikipedia.org/wiki/MediaWiki_talk:Common.css/Archive_11#Teletype_style_fix_for_Chrome */
pre, code, kbd, samp { font-family: monospace, sans-serif; }

/* `Links
----------------------------------------------------------------------------------------------------*/

a {
  	color:rgb(0, 126, 188);
  	text-decoration: none;
}

a:hover {
    color:rgb(0, 126, 188);
    text-decoration:underline;
}

a:focus {
    outline: thin dotted;
}

hr {
	border: 0 #ccc solid;
	border-top-width: 1px;
	clear: both;
	height: 0;
}

/* `Headings
----------------------------------------------------------------------------------------------------*/
h1 {
	font-size: 25px;
	line-height: 37px;
}

h2 {
	font-size: 23px;
	line-height: 23px;
}

h3 {
	font-size: 21px;
	line-height: 27px;
}

h4 {
	font-size: 19px;
	line-height: 27px;
}

h5 {
	font-size: 17px;
	line-height: 23px;
}

h6 {
	font-size: 15px;
	line-height: 21px;
}

/* `Lists
----------------------------------------------------------------------------------------------------*/
dd {
    margin: 0 0 0 20px;
}
ol {
	list-style: decimal;
}

ul {
	list-style: disc;
}

/* `Spacing
----------------------------------------------------------------------------------------------------*/
li {
	margin-left: 20px;
}

p,
dl,
hr,
h1,
h2,
h3,
h4,
h5,
h6,
ol,
ul,
pre,
table,
address,
fieldset {
	margin-bottom: 18px;
}
/* ==|== primary styles =====================================================
   	Author: Joerg Schoeneburg
   ========================================================================== */
#wrapper {
	margin-top: 15px;
}
	#header {}
	
	#topMenue { margin-bottom: 35px; }
		#topMenue a:hover { color: rgb(70,70,70); text-decoration: none;}
		
		#topMenue div.mediaNav li.print {
			margin-left: 20px;
		}
			#topMenue div.mediaNav img {
				vertical-align:bottom;
			}
					
		/** Mainnav **/
		#mainNav {}
			#mainNav li a {
				color: rgb(0,0,0);
				font-size: 14px;
				padding:0 13px;
			}
				#mainNav li:first-child a { padding-left:0; }
				/** override nav object **/
				#mainNav.nav.horizontal.divider li:after,
				.lt-ie9 #mainNav.nav.horizontal.divider li .ie-after {
				    content: "|";  /* 1. */
			  		*zoom: expression(this.runtimeStyle['zoom'] = '1', this.innerHTML = "|"); /* 2. */
				} 
				#mainNav.nav.horizontal.divider li:last-child:after,
				.lt-ie9 #mainNav.nav.horizontal.divider li:last-child .ie-after {
					content: "";
				  	background: none repeat scroll 0 0 transparent;
				  	padding-left:0;
				  	/* IE6, IE7 & IE8 dont display content Hack ;)  */
				  	*color:transparent;
				  	*background-color: transparent;
				  	*font-size: 0;
				  	*line-height: 0;
				  	*visibility: hidden;
				  	*orphans: 0;
				}
		
		/** Lang Switch **/
		#langSwitch {
			text-align: right;
		}
			#langSwitch li a,
			#langSwitch li {
				color: rgb(0,0,0);
				font-size: 13px;
			}
			#langSwitch li.current_lang {
				margin-right: 32px;
			}
			#langSwitch li.current_lang:last-child {
				margin-left: 32px;
				margin-right: 0;
			}
				#langSwitch img { vertical-align:text-bottom; }
	
	/** Slider **/	
	#slider {
		height: 260px;
		overflow: hidden;
		margin-bottom: 28px;
	}
	
	/** Main **/
	#main {}
	
		/** Teaser **/
		#teaser { margin-bottom: 20px; }
			#teaser img.logo {
				float:left;
				margin-right: 61px;
			}
			#teaser .welcome {
			   color:rgb(0, 122, 165);
			   float:left;
			   font-size:34px;
			   font-weight: normal;
			   line-height:35px;
			   margin:0;
			   position:relative;
			   top:30px;
			}
			#teaser div.teaserContent {
				margin-top: 38px;
				margin-bottom: 28px;
			}
			
			#teaser #logoAndSitename > * { padding-left:30px; }
				#teaser .sitename {
				    font-size:43px;
				    font-weight:normal;
				    margin-top:40px;
				    text-align:center;
				    line-height:51px;
				}
			#teaser #productImage img {
				border:4px solid rgb(255, 255, 255);
				-webkit-box-shadow: 0 0 3px 0 rgb(153, 153, 153);
				-moz-box-shadow: 0 0 3px 0 rgb(153, 153, 153);
				-o-box-shadow: 0 0 3px 0 rgb(153, 153, 153);
				box-shadow: 0 0 3px 0 rgb(153, 153, 153); 
				behavior: url('/files/css/iefix/PIE.htc');
			}
				
		/** Produkt Slider **/
		#productSlider {
			margin:0 auto; 
			overflow: hidden;
		}			
			#productSlider .scrollable {
			  	/* required settings */
			  	position:relative;
			  	overflow:hidden;
				width: 868px; 
				height: 169px;
				float:left;
			}
				#productSlider div.item {
				  	background: transparent url('../images/box-shadow.png') no-repeat bottom center;
				  	float:left;					  	
				  	width: 205px;
					height: 148px;
					margin:0 5px;					  	
					padding-bottom: 22px;
				}
				    /** Arrows **/
					#productSlider a.browse {
					    background:url("../images/sprites.png") no-repeat scroll 0 0 transparent;
					    cursor:pointer;
					    display:block;
					    float:left;
					    font-size:1px;
					    height:32px;
					    width:29px;
					    margin: 58px 0;
					}
					#productSlider a.left {
						margin-left: 0;
						margin-right: 7px;
					}
					#productSlider a.right {
						background-position: -50px 0;
						clear: right;
						margin-left: 7px;
    					margin-right: 0;
					}
					
					/** Tooltips **/
					.tooltip {
						display:none;
						position: relative;
					   	background-color: rgb(0, 0, 0);
					   	border-radius: 4px 4px 4px 4px;
					   	color: rgb(255, 255, 255);
					   	max-width: 200px;
					   	padding: 5px 10px;
					   	text-align: center;
					   	text-decoration: none;
					   	display: block;
					   	font-size: 11px;
					   	z-index: 1030;
					}						  
						.tooltip-arrow {
						    border-color: transparent;
						    border-style: solid;
						    height: 0;
						    position: absolute;
						    width: 0;
						}
							.tooltip .tooltip-arrow {
							    border-top-color: rgb(0, 0, 0);
							    border-width: 5px 5px 0;
							    bottom: -5px;
							    left: 50%;
							    margin-left: -5px;
							}

		/** Produktliste **/
		#produktWrapper {
			margin-top: 27px;
		}
		#productList {
			font-size: 14px;
			text-align: center;
		}
		
	/** Footer **/
	#footer { 
		border-top: 3px solid rgb(0, 204, 255); 
		margin-top: 23px;
		padding-top: 20px;
		text-align: center;
		color: rgb(80,80,80);
	}

/** News Modul **/
span.date {
    display:block;
    font-weight:bold;
    margin-bottom:5px;
}
  
/** TinyMCE Content **/
.teaserText {
	font-size:24px;
}

.teaserTextFett {
	font-size:24px;
	font-weight:bold;
} 
.floatLeft {
	float: left;
	margin-right: 6px;
	margin-bottom: 4px;
}
.floatRight {
	float: right;
	margin-left: 8px;
	margin-bottom: 5px;
}
.normal {
	clear: both;
	margin-top: 10px;
}
.floatLeft, .floatRight {
	margin-top: 0;
	vertical-align: text-bottom;
}
.pdf {
	background: transparent url('../images/file_pdf.png') no-repeat left center;
	display:-moz-inline-stack;
	display:inline-block;
	zoom:1;
	*display:inline;
    line-height:48px;
    padding-left:50px;
}
  
/* ==|== CSS object classes =================================================
   	Please define your styles before this section.
   ========================================================================== */

/** `the nav object **/
.nav {}
	.nav ul { margin-bottom: 0; }
		.nav li { 
			list-style: none; 
			list-style-image: none;
			margin-left:0;
		}
			/** `nav object for horizontal navigations **/
			.nav.horizontal ul,
			.nav.horizontal li { display: inline; }
			
				/** 
				 * 	`nav object for horizontal navigations with divider
				 * 	 1. divider style
				 *   2. IE6, IE7 & IE8 content hack  
				 */	
				.nav.horizontal.divider li:after,
				.lt-ie9 .nav.horizontal.divider li .ie-after {
				    content: "|";  /* 1. */
					padding:0 10px;
				    display:inline-block;
				    display:-moz-inline-stack;
	          		*zoom: expression(this.runtimeStyle['zoom'] = '1', this.innerHTML = "|"); /* 2. */
				    *display:inline;
				    font-style: normal;
				}
				.nav.horizontal.divider li:last-child:after,
				.lt-ie9 .nav.horizontal.divider li:last-child .ie-after {
					content: "";
				  	background: none repeat scroll 0 0 transparent;
				  	padding-left:0;
				  	/* IE6, IE7 & IE8 dont display content Hack ;)  */
				  	*color:transparent;
				  	*background-color: transparent;
				  	*font-size: 0;
				  	*line-height: 0;
				  	*visibility: hidden;
				  	*orphans: 0;
				}							
	
				/** `nav object for breadcrumb, with divider **/
				.nav.breadcrumb li{ 
					display: inline; 
					margin-left:20px;
				}
				/** 
				 * 	1. divider 
				 * 	2. IE6, IE7 & IE8 content hack  
				 */
				.nav.breadcrumb li:after,
				.lt-ie9 .nav.breadcrumb li .ie-after { 
					content: "\25B8"; /* 1. */
				    display:inline-block;
				    display:-moz-inline-stack;
				    *display:inline;
				    *zoom: expression(this.runtimeStyle['zoom'] = '1', this.innerHTML = "\25B8"); /* 2. */			    
				    font-size:1.5em;
				    font-style: normal;
				    padding:0 0 0 20px;
				    vertical-align:middle;			    
				}
				.nav.breadcrumb li:last-child:after, 
				.lt-ie9 .nav.breadcrumb li:last-child .ie-after {
					content: "";
					/* IE6, IE7 & IE8 dont display content Hack ;)  */
				  	*color:transparent;
				  	*background-color: transparent;
				  	*font-size: 0;
				  	*line-height: 0;
				  	*visibility: hidden;
				  	*orphans: 0;
				}
				.nav.breadcrumb li a {color: #2c4460 !important;}
				
		/* ==|== IE6, IE7 & IE8 ::after polyfill ============================================= */
		.lt-ie9 .nav.horizontal.divider li,
		.lt-ie9 .nav.breadcrumb li { zoom: expression( this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i") ).className="ie-after" ); }

/* ==|== non-semantic helper classes ======================================== */
.pull-left { 
  float: left; 
  margin: 0 18px 18px 0; 
}

.pull-right { 
  float: right; 
  margin: 0 0 18px 18px; 
}

/*
 * Chrome Frame Prompt
 */
.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/*
 * Image replacement
 */
.ir {
	border: 0;
	margin: 0;
	border: 0;
	font-size: 0 !important;
	line-height: 0 !important;
	text-shadow: none;
	color: transparent;
	background-color: transparent !important;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */
.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */
.visuallyhidden {
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    width: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute; 
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */
.invisible {
    visibility: hidden;
}

/*
 * Contain floats: h5bp.com/q
 */
.clearfix:before,
.clearfix:after {
    content: "";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}