
/* everything is constructed with a single background image */

/* root element for tabs */
#flowtabs {
	
	/* dimensions */
	width:760px;
	height:31px !important;
	margin:0 !important; 
	padding:0;	
	
	/* IE6 specific branch (prefixed with "_") */
	_margin-bottom:-2px;
}

/* single tab */
#flowtabs li { 
	float:left; 
	margin:0; 
	padding:0; 
	text-indent:0; 
	list-style-type:none;
}

/* a- tag inside single tab */
#flowtabs li a {
	background: url(images/panes.gif) no-repeat;
	display:block;
	height: 28px;   
	width: 21px; 	
	padding:0px;
	margin:0px;
}

/* adjust the background image position on each tab */
#flowtabs #t1 			{ background-position: -6px 0; }
#flowtabs #t2 			{ background-position: -27px 0; }
#flowtabs #t3 			{ background-position: -48px 0; }
#flowtabs #t4 			{ background-position: -69px 0; width:22px;}
 
/* mouseover state */
#flowtabs a:hover 		{ color:#fff;	 }
#flowtabs #t1:hover 	{ background-position:      -6px -34px; }
#flowtabs #t2:hover 	{ background-position: -27px -34px; }
#flowtabs #t3:hover 	{ background-position: -48px -34px; }
#flowtabs #t4:hover 	{ background-position: -69px -34px; }

/* currently selected tabs */
#flowtabs a.current		{ cursor:default; color:#fff; line-height:34px; }
#flowtabs #t1.current { background-position:      -6px -67px; }
#flowtabs #t2.current { background-position: -27px -67px; }
#flowtabs #t3.current { background-position: -48px -67px; }
#flowtabs #t4.current { background-position: -69px -67px; }


/* panes */
#flowpanes {
	width:844px;
	height:263px;	
}


/* single pane */
#flowpanes div {
	display:none;	
	color:#636363;	
	margin:10px 0px;
}

/* override the root element to enable scrolling */
#flowpanes {
	position:relative;
	overflow:hidden;
	clear:both;
}

/* override single pane */
#flowpanes div {
	float:left;
	display:block;
	width:844px;
	font-size:12px;
}

/* our additional wrapper element for the items */
#flowpanes .items {
	width:20000em;
	position:absolute;
	clear:both;
	margin:0;
	padding:0;
}

#flowpanes .less, #flowpanes .less a {
	color:#999 !important;
	font-size:11px;
}

#actionButtons
{
	position:absolute;
	z-index:5;
	margin-top:4px;
	margin-left:93px;
	width:265px;
	height:23px;
}

#actionButtons button
{
	background:url('images/action-buttons.gif') no-repeat;
	border:0px;
	height:28px;
	width:22px;
	cursor:pointer;
}

#actionButtons .stop { background-position: 0 0; }
#actionButtons .play { margin-left:-5px; background-position: -21px 0; }
#actionButtons .prev { margin-left:-5px; background-position: -42px 0; }
#actionButtons .next { margin-left:-5px; background-position: -63px 0; }

#actionButtons .stop:hover { background-position: 0 -34px; }
#actionButtons .play:hover { margin-left:-5px; background-position: -21px -34px; }
#actionButtons .prev:hover { margin-left:-5px; background-position: -42px -34px; }
#actionButtons .next:hover { margin-left:-5px; background-position: -63px -34px; }

#actionButtons .stop:active { background-position: 0 -68px; }
#actionButtons .play:active { margin-left:-5px; background-position: -21px -68px; }
#actionButtons .prev:active { margin-left:-5px; background-position: -42px -68px; }
#actionButtons .next:active { margin-left:-5px; background-position: -63px -68px; }