/* tab pane styling */
.custompanes div
{
	display: none;
	padding: 15px 30px 15px 30px;
	border: 1px solid #999;
	border-top: 0;
	font-size: 14px;
	background-color: #fff;
	text-align: justify;
	color: #000000;
	font-family: Arial, Helvetica, sans-serif;
}

.custompanes div .block-1 .node-content
{
	padding:0px 15px 0px 0px;
	text-align: left;
}

ul.bullets li
{
	list-style:circle;
	list-style-position:inside;
	padding: 0px 0px 0px 20px;
	text-align:left;
}
ul.bullets li.none
{
	list-style:none;
	list-style-position:inside;
	padding: 0px 0px 0px 40px;
	text-align:left;
}
/*.custompanes div ul, ul li
{
	list-style:circle;
	list-style-position:outside;
	padding: 0px 0px 0px 20px;
	text-align:left;
}*/


ul.customtabs, ul.customtabs li 
{ list-style:none; 
  list-style-image:none; 
  list-style-type:none;
}

/* root element for tabs  */
ul.customtabs { 
	list-style:none; 
	margin:0 !important; 
	padding:0;	
	border-bottom:1px solid #666;	
	height:30px;
}

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

/*Based on the image used to build the background
and the colour blue.png the offset in background and the width have
to correspond
So looking at the image to get the third block we would start from the left
of 0 until we reached the starting edge of the block 420 pixels, hence the background -420px
and it has a width of 134px
ul.customtabs a { 
	background: url(../images/blue.png) no-repeat -420px 0;
	font-size:11px;
	display:block;
	height: 30px;  
	line-height:30px;
	width: 134px;
	text-align:center;	
	text-decoration:none;
	color:#333;
	padding:0px;
	margin:0px;	
	position:relative;
	top:1px;
	left: 53px;
}
/* link inside the tab. uses a background image */
ul.customtabs a
{
	background: url(../images/blue.png) no-repeat 0px 0;
	font-size: 11px;
	display: block;
	height: 30px;
	line-height: 30px;
	width: 248px;
	text-align: center;
	text-decoration: none;
	color: #333;
	padding: 0px;
	margin: 0px;
	position: relative;
	top: 1px;
}

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

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

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

/* Different widths for tabs: use a class name: s, l, xl against the a under customtabs*/


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

/* width 4 */
ul.customtabs a.m 			{ background-position: -420px 0; width:134px; }
ul.customtabs a.m:hover 	{ background-position: -420px -31px; }
ul.customtabs a.m.current  { background-position: -420px -62px; }

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


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


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