/*** BEGIN: dialog for flash install/warning ***/
div.overlay { 
     
    /* growing background image */ 
    background-image:url(../img/petrol.png); 
     
    /* dimensions after the growing animation finishes  */ 
    width:310px; 
    height:310px;
     
    /* initially overlay is hidden */ 
    display:none; 
     
    /* some padding to layout nested elements nicely  */ 
    padding: 55px;
}

/* default close button positioned on upper right corner */ 
div.overlay div.close { 
    background-image:url(../img/close.png); 
    position:absolute; 
    right:5px; 
    top:5px; 
    cursor:pointer; 
    height:35px; 
    width:35px; 
}

a#toggleFlashDialog {
	position:absolute;
	display:none;
	background-color:red;
	height:10px;
	width:10px;
	margin-top:290px;
	margin-left:285px;
	z-index:1000;	
}

div#overlayContent {
	width:310px;
	height:225px;
	background-color: black;
}

div#flashRequired, div#flashRequired a {
	font-family:"Lucida Grande","Lucida Sans Unicode","bitstream vera sans","trebuchet ms",verdana,arial,sans-serif;
	font-size:15px;
}

div#flashRequired {
	color: red;
	font-weight:bold;
}
/*** END: dialog for flash install/warning ***/

/*{{{ playlist.css */


/*{{{ general playlist settings, light gray */

div.playlist, div.clips {
	width:260px;	
}

div.clips a {
	display:block;

	padding:12px 15px;
	height:46px;
	width:196px;
	font-size:12px;
	border:1px outset #ccc;		
	text-decoration:none;
	letter-spacing:-1px;
	color:#000;
}

div.clips a.playing, div.clips a.paused, div.clips a.progress {
	background:url(../img/light.png) no-repeat 0px -69px;
	padding-right:60px;
	border:0;
}

div.clips a.paused {
	background-position:0 0;	
}

div.clips a span {
	display:block;		
	font-size:11px;
	color:#666;
}

div.clips a em {
	font-style:normal;
	color:#f00;
}	

div.clips a:hover {
}

div.clips a.playing:hover, div.clips a.paused:hover, div.clips a.progress:hover {
	background-color:transparent !important;		 
}
/*}}}*/

/*{{{ very basic styles */
body, p, div, a {
	font-family:"Lucida Grande","Lucida Sans Unicode","bitstream vera sans","trebuchet ms",verdana,arial,sans-serif;
	font-size:12px;
}

a {
	color:#295c72;
}


div.clear, hr {
	clear:both;
	display:block;
	font-size:1px;
	height:0pt;
	line-height:1px;
	margin:0pt;
	padding:0pt;
}


.col {
	float:left;
	width:250px;
	margin:0 0 0 10px;	
}


img {
	border:0;		
}

a:active {
  outline:none;
}

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

/*}}}*/


/*{{{ typo */

p {
	margin:10px 0px;		
}

/*}}}*/


/*{{{ global elements */
#wrap {
	width:850px;
	text-align: center;
	margin: auto;
}

#secondWrap {
	width:850px;
	margin-left: auto;
	margin-right: auto;
	text-align: left; /* overrule inheritance */	
}

#content {
	width:800px;
	float:left;
}

.playerCol {
	float: left;
	display: block;
	width: 480px;
	height: 372px;
	margin: 12px 0 0 0;
}
/*}}}*/

/*{{{ BOXES */

/*{{{ player */

.audio {
	display:block;
	background:url(../img/splash.jpg) no-repeat;
	width:480px;
	height:24px;
	cursor:pointer;
	float:left;
}

a.player {
	display:block;
	background:url(../img/splash.png) no-repeat;
	width:425px;
	height:298px;
	padding:0 126px 75px 127px;
	color:#fff;
	text-decoration:none;
	cursor:pointer;
	/* 
		width:672px;
		height:367px; 
	*/
}

/* play button */
a.player img {
	display: block;
	float: left;
}

.playBtn {
	margin: 295px 0 0 10px;
}

div.playerCol img.loadingGIF {
	display: none;
	position: relative;
	top: -249px;
	left: 190px;
}
/*}}}*/

/*{{{ home */

#tabWrapper {
	height:57px;
	width:800px;
	float:left;
}

#outerTabContainer {
	position:relative;
	height:57px;
	width:800px;	 
	overflow:hidden;
}

#innerTabContainer {
	position:absolute;
	width:9999em;
	left: 0px;
/*	top:-7px; */
}

#tab_panes {
	background:url(../img/bottom.png) no-repeat;
	position:relative;
	top:-1px;
	height:500px;
	width:800px;	 
	overflow:hidden;
}

#items {
	position:absolute;
	width:9999em;
	padding-top: 40px;
	left: 0px;
}

#items div.item {
	padding:10px 30px;
	width:770px; 
	float:left;
	color:white;
/*	display:none;*/
}

#items a.player {
	padding:0 0 0 0;
	height:348px;		/* player dimensions */
	width:480px;
	float:left;
}

#items p.description {
	font-size:12px;
}

#items p.description_alt1 {
	font-size:12px;
	font-style:italic;
}

#items p span.subtitle {
	font-size:10px;
}

#items p.foot_note {
	font-size:10px;
}

#items p.foot_note  a:link {
	color: #000040;
}

#items p.foot_note  a:visited {
	color: #0000c0;
}

#items p.foot_note  a:active {
	color: #ffffff;
}

#items p.foot_note  a:hover {
	color: #0000ff;
}

#items div.clips {
	float:left;
	margin-top:10px;
}

#items pre code {
	line-height:14px;	
}

a.prevTab, a.nextTab, a.prevTabPage, a.nextTabPage {
	background:transparent url(../img/left.png) no-repeat scroll 0 0;
	cursor:pointer;
	display:block;
	float:left;
	height:18px;
	width:18px;
	margin-top:22px;
}

a.prevTab.nextPrevHover, a.nextTab.nextPrevHover, a.prevTabPage.nextPrevHover, a.nextTabPage.nextPrevHover {
	background-position:0 -18px;
}

a.disabled {
	visibility:hidden !important;
}

a.nextTab, a.nextTabPage {
	background-image:url(../img/right.png);
	clear:right;
}

/* tabs */
div#innerTabContainer div {
	float:left;
	margin:0;
	padding:0;
	height:57px;
	width:200px;
}

div#innerTabContainer div a {
	display:block;
	height: 57px;  
	overflow: hidden;
	width: 200px;
	padding:0px;
	margin:0px;
}


div#innerTabContainer div a#t1 { background-image: url('../img/tab left.png'); }		/* NOTE:	only need to sepcify the bg image for the first 4 tabs sincs these are */
div#innerTabContainer div a#t2 { background-image: url('../img/tab middle.png'); }		/* 			visible; for all other tabs the bg image is set via javascript when    */
div#innerTabContainer div a#t3 { background-image: url('../img/tab middle.png'); }		/* 			they're scrolled into view */
div#innerTabContainer div a#t4 { background-image: url('../img/tab right.png'); }

div#innerTabContainer div a.tabLink {
	cursor:					pointer;
	background-position: 	0px 0px;
}

div#innerTabContainer div a.tabHover { background-position: 0px -57px; }

div#innerTabContainer div.active a.tabLink {
	cursor:					default;
	background-position:	0px -114px;
}

div#innerTabContainer div .tabWrap1 {	/* wrap 1 to horizontally center */
	position:absolute;			/* ***START*** of vertical centering */
	top:50%;
	height:50px;
	margin-top:-25px; 			/* negative half of content height; ***END*** of vertical centering */

	float:none;
	margin-left: auto;
	margin-right: auto;
	text-align: left; /* overrule inheritance */
}

div#innerTabContainer div .tabWrap2 {	/* wrap 2 to horizontally center */
	float:none;
	text-align: center;
}

/* right picks */

/*}}}*/