#featured{ 
	width:400px; 
	/*padding-right:250px; */
	padding-right:190px; 
	position:relative; 
	border:2px solid #ccc; 
	height:250px;
	background:#fff;
}

#featured ul.ui-tabs-nav{ 
	position:absolute; 
	top:0; left:400px; 
	list-style:none; 
	padding:0; margin:0; 
	width:190px; 
}
#featured ul.ui-tabs-nav li{ 
	padding:0px;padding-left:13px;
	color:#001a45; 
}
#featured ul.ui-tabs-nav li img{ 
	/*float:left; margin:2px 5px; 
	background:#fff; */
	padding:0px; margin:0px;
	border:0px solid #eee;
}
#featured ul.ui-tabs-nav li span{ 
	font-size:12px; font-family:Verdana; 
	line-height:18px;
}
#featured li.ui-tabs-nav-item a{ 
	display:block; 
	height:38px; 
	color:#001a45;  background:#fff; 
	line-height:18px;
}
	#featured li.ui-tabs-nav-item a.nobg{ 
	background:none;
	/*background:#f2f2f2;*/
}
#featured li.ui-tabs-nav-item a:hover{ 
	/*background:#f2f2f2; */
}
#featured li.ui-tabs-selected{ 
	background:url('../../library/gifs/selected-item.gif') top left no-repeat;
	
}
#featured ul.ui-tabs-nav li.ui-tabs-selected a{ 
	background:#ccc; 
}
#featured .ui-tabs-panel{ 
	width:400px; height:250px; 
	background:#999; 
	position:relative;
}
#featured .ui-tabs-panel .info{ 
	position:absolute; 
	top:185px; left:0; 
	height:65px;; 
	width:400px;
	background: url('../../library/gifs/transparent-bg.png'); 
}

	/*Style für Infobereich bei Brauprozess*/
	#featured .ui-tabs-panel .infotext{ 
	position:absolute; 
	top:500px; left:0; 
	height:100px;; 
	width:800px;
	background: url('../../library/gifs/transparent-bg.png'); 
	}
	#featured .infotext p{ 
		margin:5px 5px 0 5px; 
		font-family:Verdana;
		line-height:15px; color:#f0f0f0;
	}
	/*ende*/


#featured .info h2{ 
	font-size:18px;
	color:#fff; padding:5px; margin:0;
	overflow:hidden; 
}
#featured .info p{ 
	margin:0 5px; 
	font-family:Verdana; font-size:11px; 
	line-height:15px; color:#f0f0f0;
}
#featured .info a{ 
	text-decoration:none; 
	
}
#featured .info a:hover{ 
	text-decoration:none; 
}
#featured .ui-tabs-hide{ 
	display:none; 
}

/*	Styles für die jquery Tabs auf der Seite */

.panes div {	//	der Content Layer
	display:none;		
//	padding:5px 5px;
//	border:1px solid #999;
//	border-top:0;
//	height:100px;
}
/* root element for tabs  */
ul.tabs { 
	list-style:none; 
	margin:0 !important; 
	padding:0;	
	border-bottom:0px solid #000;	
	height:30px;
}

/* single tab */
ul.tabs li { 
	float:left;	 
	text-indent:0;
	padding:0;
	margin:0 !important;
	list-style-image:none !important;
	color:#d0af42;
}

/* link inside the tab. uses a background image */
ul.tabs a { 
//	background: url(/tools/img/tabs/blue.png) no-repeat -420px 0;
	display:block;
	/*height: 30px;  */
	line-height:30px;
	width: 80px;
	text-align:center;	
	text-decoration:none;
	padding:0px;
	margin:1px;	
	position:relative;
	top:1px;
	color:#d0af42;
	border:1px solid #d0af42;
}

ul.tabs a:active {
	outline:none;
	color:#fff;
}

/* when mouse enters the tab move the background image */
ul.tabs a:hover {
	background-position: -420px -31px;	
	color:#fff;	
}

/* active tab uses a class name "current". its highlight is also done by moving the background image. */
ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a {
	background-position: -420px -62px;		
	cursor:default !important; 
//	color:#fff; !important;

}

/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */


/* width 1 */
ul.tabs a.s 			{ background-position: -553px 0; width:81px; }
ul.tabs a.s:hover 	{ background-position: -553px -31px; }
ul.tabs a.s.current  { background-position: -553px -62px; }

/* width 2 */
ul.tabs a.l 			{ background-position: -248px -0px; width:174px; }
ul.tabs a.l:hover 	{ background-position: -248px -31px; }
ul.tabs a.l.current  { background-position: -248px -62px; }


/* width 3 */
ul.tabs a.xl 			{ background-position: 0 -0px; width:248px; }
ul.tabs a.xl:hover 	{ background-position: 0 -31px; }
ul.tabs a.xl.current { background-position: 0 -62px; }


/* initially all panes are hidden */ 
.panes .pane {
	display:none;		
}

/*	Ende Styles für jquery TABS	*/