/* standalone css */

body {
	padding:5px 200px;
	font-family:"Lucida Grande","bitstream vera sans","trebuchet ms",sans-serif,verdana;
}


/* get rid of those system borders being generated for A tags */
a:active {
  outline:none;
}

:focus {
  -moz-outline-style:none;
}


	
	a{
		color:#000;
		font-size:13px;
	}
	
	.interact{
	margin-bottom: 166px;
	}
	
	/* navigation */
	#nav {
		background:#ddd url(http://static.flowplayer.org/img/global/gradient/h300_reverse.png);
		border-bottom:1px solid #CCCCCC;
		height:156px;	
		width: 832px;
		
		-webkit-border-top-left-radius: 0px;
		-webkit-border-top-right-radius: 0px;
		-webkit-border-bottom-right-radius: 8px;
		-webkit-border-bottom-left-radius: 8px;
		-moz-border-radius-topleft: 0px;
		-moz-border-radius-topright: 0px;
		-moz-border-radius-bottomright: 8px;
		-moz-border-radius-bottomleft: 8px;
		border-top-left-radius: 0px;
		border-top-right-radius: 0px;
		border-bottom-right-radius: 8px;
		border-bottom-left-radius: 8px;
	}
	
	#nav ul {	
		width:800px;
		margin:0 auto;	
	}
	
	#nav li {	
		border-right:1px solid #ddd;
		float:left;
		padding-left:1px;
		width:175px;
		list-style-type:none;
		text-align:center;
		margin-top:0px;
	}
	
	#nav a {
		color:#333333;
		display:block;
		padding:17px;
		position:relative;
		word-spacing:-2px;
		font-size:11px;		
		height:122px;
		text-decoration:none;
	}	
	
	#nav a.current {
		background:url(http://static.flowplayer.org/tools/img/tabs/down_large.jpg);	
	}
	
	#nav img {
		background-color:#fff;
		border:1px solid #ccc;
		margin:3px 0 5px 27px;
		padding:4px;		
		display:block;
	}
	
	#nav strong {
		display:block;		
		font-size:13px;
	}
	
	/* panes */
	#panes {
		background: -webkit-gradient(linear, left top, left bottom, from(grey), to(#fff));
   		background: -moz-linear-gradient(top, grey, #fff);
		border-color:#ccc;
		border-style:solid;
		border-width:1px 1px 0;
		width:830px;	
		height:320px;
		//margin-bottom:-20px;
		//padding-bottom:20px;
		
		-webkit-border-top-left-radius: 8px;
		-webkit-border-top-right-radius: 8px;
		-webkit-border-bottom-right-radius: 0px;
		-webkit-border-bottom-left-radius: 0px;
		-moz-border-radius-topleft: 8px;
		-moz-border-radius-topright: 8px;
		-moz-border-radius-bottomright: 0px;
		-moz-border-radius-bottomleft: 0px;
		border-top-left-radius: 8px;
		border-top-right-radius: 8px;
		border-bottom-right-radius: 0px;
		border-bottom-left-radius: 0px;
		
		/* must be relative so the individual panes can be absolutely positioned */
		position:relative;
	}
	
	/* crossfading effect needs absolute positioning from the elements */
	#panes div {
		display:none;		
		position:absolute;
		top:20px;
		left:20px;
		font-size:13px;
		color:#444;	
		width:650px; 
	}
	
	#panes img {
		float:left;
		margin-right:20px;		
	}
	
	#panes p.more {
		color:#000;
		font-weight:bold;
		font-size:13px;
	}
	
	#panes h3 {
		margin:0 0 -5px 0;
		font-size:22px;
		font-weight:normal;
	}
	
	.overlay {
		display:none;
		width:500px;
		padding:20px;
		background-color:#ddd;
	}
	
	/* fancybox */
	
	#content {
	width: 350px;
	margin: 30px auto;
	padding: 20px 60px;
	border: 1px solid #D2D2D2;
	-moz-box-shadow: 0 0 30px #CCC;
	-webkit-box-shadow: 0 0 30px #CCC;
	box-shadow: 0 0 30px #CCC;
	background: #FFF;
	background: -webkit-gradient(linear, left top, left 15, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF));
	background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 15px);
}