/* root element for tabs  */
ul.tabs a#

/* single tab */
ul.tabs li { 
	float:left;	 
	list-style-image:none !important; 
}

/* link inside the tab. uses a background image */
ul.tabs a { 
	background: url(../img/application.png) no-repeat -400px -150px;
	font-size:11px;
	display:block;
	height: 30px; 
	text-indent: -99999px;
	height: 12px; 
	float: left;
	
	margin-bottom: 130px;
	
	}

ul.tabs a:active {
	outline:none;		
}

/* 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". it's highlight is also done by moving the background image. */
ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a {
		
	cursor:default !important; 
	color:#000 !important;
}

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

ul.tabs a#one {width: 60px; background-position: -400px -150px;}
ul.tabs a#one.hover {background-position: -400px -180px;}
ul.tabs a#one:hover {background-position: -400px -180px;}

ul.tabs a#two {width: 120px; background-position: -460px -150px;}
ul.tabs a#two.hover {background-position: -460px -180px;}
ul.tabs a#two:hover {background-position: -460px -180px;}

ul.tabs a#three {width: 70px; background-position: -580px -150px;}
ul.tabs a#three.hover {background-position: -580px -180px;}
ul.tabs a#three:hover {background-position: -580px -180px;}

ul.tabs a#four {width: 100px; background-position: -650px -150px;}
ul.tabs a#four.hover {background-position: -650px -180px;}
ul.tabs a#four:hover {background-position: -650px -180px;}



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

div.panes div.pane {width: 350px; background: #232323;}

div.panes div {
	display:none;		
	height:200px;
	font-size:14px;
	width: 350px;
}

.panes ul li {font-size: 11px; padding-bottom: 2px; }