/* root element for tabs  */
ul.tabs, ul.tabs#small-tab {
	list-style:none;
	/*margin:0 !important;*/
	padding:0;
	border-bottom:1px solid #818d45;
	height:31px;
	margin:0 0 15px 0 !important;
}

/* single tab */
ul.tabs li, ul.tabs#small-tab li{
	float:right;
	text-indent:0;
	padding-bottom:0;
	margin:0 !important;
	list-style-image:none !important;
	font-size:13px;
	direction:rtl;
}
/* link inside the tab. uses a background image */
ul.tabs a, ul.tabs#small-tab a {
	background: url("images/green.png") no-repeat;
	font-size:14px;
	font-weight:bold;
	font-family:arial,serif;
	border-bottom:1px solid #9eaf4f;
	display:block;
	height: 30px;
	line-height:30px;
	width: 130px;
	text-align:center;
	text-decoration:none;
	color:#555 !important;
	padding:0;
	margin: 0;
	position:relative;
	top:1px;
}
ul.tabs#small-tab a {
  background: url("images/green-small.png") no-repeat;
  width: 65px;
}

ul.tabs a:active, ul.tabs#small-tab a:active{
	outline:none;
}

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

/* 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,
ul.tabs#small-tab a.current, ul.tabs#small-tab a.current:hover, ul.tabs#small-tab  li.current a{
	background-position: 0 -62px;
	cursor:default !important;
	color:#fff !important;
}

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