/* everything is constructed with a single background image */

/* root element for tabs */
#flowtabs {
	
	/* dimensions */
	width:870px;
	height:31px !important;
	margin-top: 0px;
	margin-bottom: 1px;
	margin-left:20px;
	margin-right: 0px;
	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 {
	display:block;
	height: 28px;   
	width: 189px; 	
	padding:0px;
	margin:0px;
	border: 1px solid #FF6600;
	background-image: url(../images/tabactive.gif); background-repeat: repeat-x; background-color:#ff6600;

	
	/* font decoration */
	color:#fff;
	font-size:12px;
	line-height:28px;
	text-align:center;
	text-decoration:none;
}

/* adjust the background image position on each tab */
#flowtabs #t1 			{ background-position: 0 0; color:#000;}
#flowtabs #t2 			{ background-position: -189px 0; color:#000;}
#flowtabs #t3 			{ background-position: -378px 0; color:#000;}
#flowtabs #t4 			{ background-position: -567px 0; width:192px; color:#000;}
 
/* mouseover state */
#flowtabs a:hover 		{ color:#fff; background-image: url(../images/tabcurrent.gif); background-repeat: repeat-x; background-color:#ff6600;
 }
#flowtabs #t1:hover 	{ background-image: url(../images/tabcurrent.gif); background-repeat: repeat-x; background-color:#ff6600 color:#fff;}
#flowtabs #t2:hover 	{ background-image: url(../images/tabcurrent.gif); background-repeat: repeat-x; background-color:#ff6600 color:#fff;}
#flowtabs #t3:hover 	{ background-image: url(../images/tabcurrent.gif); background-repeat: repeat-x; background-color:#ff6600 color:#fff;}
#flowtabs #t4:hover 	{ background-image: url(../images/tabcurrent.gif); background-repeat: repeat-x; background-color:#ff6600 color:#fff;}

/* currently selected tabs */
#flowtabs a.current		{ cursor:default; color:#fff; line-height:28px; background-image: url(../images/tabcurrent.gif); background-repeat: repeat-x; background-color:#ff6600; 	border: 2px solid #000;}
#flowtabs #t1.current {background-image: url(../images/tabcurrent.gif); background-repeat: repeat-x; background-color:#ff6600; color:#fff;}
#flowtabs #t2.current { background-image: url(../images/tabcurrent.gif); background-repeat: repeat-x; background-color:#ff6600; color:#fff;}
#flowtabs #t3.current { background-image: url(../images/tabcurrent.gif); background-repeat: repeat-x; background-color:#ff6600; color:#fff;}
#flowtabs #t4.current {background-image: url(../images/tabcurrent.gif); background-repeat: repeat-x; background-color:#ff6600; color:#fff;}


/* panes */
#flowpanes {
	background-color:#000;
	width:870px;
		border: 1px solid #FF6600;
			margin-top: 0px;
	margin-bottom: 1px;
	margin-left:20px;
	margin-right: 0px;
	padding: 0px;


}


/* single pane */
#flowpanes div {
	display:none;	
	background-color:#000;
	padding-top: 10px;
	padding-bottom: 0px;
	padding-left: 0px;
	padding-right: 0px;
	color:#fff;	
	margin-bottom: 20px;
}

/* some decorations for elements inside single pane */
#flowpanes div h2 {
	font-weight:normal;
	color:#ddd;
	letter-spacing:1px;
	font-size:22px;	
		padding-right: 0px;
}

#flowpanes a {
	color:#cc9;		
	font-size:14px;
		padding-right: 0px;
}

#flowpanes p, #flowpanes samp {
	color:#ccc;	
	padding:0px;	
		padding-right: 0px;
}

#flowpanes div.narrow {
	padding-right:0px;		
		padding-right: 0px;
}


div.leftColumn, div.middleColumn {
	width: 260px;
	min-height: 500px;
	height: auto;
	float: left;
	overflow: hidden;
	margin: 12px 20px 0 0;
		padding-right: 0px;
}
		
div.leftColumn {
	margin: 12px 28px 0 18px;
		padding-right: 0px;
}
		
div.rightColumn {
	width: 200px;
	min-height: 500px;
	height: auto;
	float: left;
	overflow: hidden;
	margin: 12px 0 0 12px;
		padding-right: 0px;
}
		
div.leftColumn h3, div.middleColumn h3, div.rightColumn h3 {
	font-size: 13px;
	color: #ff5500;
	font-weight: bold;
	margin: 5px 0 2px 0;
	padding: 0;
}