/* use a semi-transparent image for the overlay */ 
#overlay {
	background-image:url(/images/transparent.png);
	color:#efefef;
	height:450px;
}  /* container for external content. uses vertical scrollbar, if needed */
div.contentWrap {
	height: 441px;
	overflow: auto;
}



/* look and feel for embed and email tabs */
#shareTabs { 
	list-style-type:none; 
	padding:0;	
	float:left;
	margin:13px 0 0 0 !important;
}

#shareTabs li { 	 
	padding:0;
	margin:0;
	list-style-image:none !important;	
}

#shareTabs a {
	background:#444 url(/img/player/sharing.png) repeat scroll 2px 3px;
	display:block;
	width: 38px;  
	height: 38px;
	padding:0px;
	margin:0px;	
	-moz-border-radius-topright:3px;
	-moz-border-radius-bottomright:3px;
}

#shareTabs a:hover {
	background-color:#000;
}

#shareTabs a:focus {
	background-color:#444;
}
	
#shareTabs a.current {
	background-color:#567078;
}

#shareTabs #embedTab {
	background-position: 2px -60px;
}

/* container for each pane: video, embed and email */
#panes {
	width:460px;
	float:left;	
	color:#fff;
	position:relative;
	z-index:1;	
	font-family:verdana;
	font-size:12px;
	margin-top:20px;
}

/* embed and email pane */
#emailPane, #embedPane {	
	padding:10px;
	display:none;
	min-height:265px;	
}

/* player container style */
#player {	
	display:block;	
	height:340px;	
	text-align:center;
	color:#fff;
	text-decoration:none;
	cursor:pointer;
}

#panes input, #panes textarea {
	width:420px;
	font-size:12px;
	font-family:verdana;
	border:1px inset #666; 	
	padding:2px;
}

#panes textarea {
	padding:4px;
	height:100px;
}


#panes label.left {
	float:left;
	margin-right:15px;	
}

#panes label.left input {
	width:180px;		
}

#panes h2 {
	margin-top:0px !important;		
}

#embedPane textarea {
	height:130px;
	overflow:hidden;
	padding:4px;
	color:#123;
}

/* close image */
div.close {
	background:url(/images/close.png) no-repeat;
	position:absolute;
	top:5px;
	right:5px;
	width:35px;
	height:35px;
	cursor:pointer;
}




/*{{{ go buttons */

a.go {
	display:block;
	width:18px;
	height:18px;
	background:url(/img/playlist/arrow/up.png) no-repeat;
	margin:5px 0 5px 105px;
	cursor:pointer;
}

a.go:hover, a.go.down:hover {
	background-position:0px -18px;		
}

a.go.down {
	background-image:url(/img/playlist/arrow/down.png);	
}

div.petrol a.go {
	background-image:url(/img/playlist/arrow/up_dark.png);		
}

div.petrol a.go.down {
	background-image:url(/img/playlist/arrow/down_dark.png);		
}

a.go.disabled {
	visibility:hidden;		
}

/*}}}*/


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

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

/* link inside the tab. uses a background image */
ul.tabs 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:#000;
	padding:0px;
	margin:0px;	
	position:relative;
	top:1px;
}

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

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

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

/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */


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

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


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


/* initially all panes are hidden */ 
div.panes div.pane {
	display:none;		
}


/*{{{  global switch, user account  */


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

hr {
	margin:-5px 0px 5px 0;
	border:1px solid #6a0002;
	border-width:1px 0 0 0;
}

.col {
	float:left;
	margin-right:20px;
}

#content div.col50 {
	float:left;
	margin-right:40px;
	width:350px;
}

.last {
	margin-right:0px !important;		
}

div.col h2 {
	margin:0 0 5px 0;		
}

img {
	border:0;		
}

table {
	border-collapse:collapse;		
}

a:active {
  outline:none;
}

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

#content ul li, #content ol li, #right ul.smaller li {	
	margin-top:7px;	
}

#right ul.smaller {
	margin-top:20px;
}

#right ul.smaller li a.selected {
	cursor:default;
	color:#000;
	font-weight:bold;
}

body.ie7 #content ul, body.ie7 #content ol {
	margin-left:50px;
}

/*}}}*/


/*{{{ typo */

h1, h2, h3, h4 {
	font-weight:normal;
	letter-spacing:-1px;
	color:#000; 
	margin: 0px 0 -5px 0;
}

h2 { font-size:22px; }
h3 { font-size:18px;	}
h4 { font-size:16px;	margin-top:20px; }

h1 em, h2 em, h3 em, h4 em {
	font-style:normal;
	color:rgb(45, 90, 195);
}

ul, ol, p, table {
	margin:10px 0px;		
}

samp {
	color:#112699;		
}

.first {
	margin-top:0px;		
}

.lower {
	margin-top:20px !important;		
}

.higher {
	margin-top:40px !important;	
}

.red {
	color:#bf0d00;	
}

.blue {
	color:#2D5AC3;	
}


/*}}}*/


#footer {
	font-size:11px;
	color:navy;	
}

#footer a {
	color:#666;
	text-decoration:none;
	font-size:11px;
	margin:0px 5px;	
}

#footer a:hover {
	text-decoration:underline;
	color:#123;
}
/*}}}*/


span.icon.js {
	background-position:0 -25px;	
}

span.icon.streaming {
	background-position:0 -50px;	
}

span.icon.tools {
	background-position:0 -74px;	
}



/*{{{ forms */
form {
	margin:10px 0;		
}

input.text, textarea {
	padding:3px 4px;
	border:1px inset #ccc;
	font-size:12px;
	-moz-border-radius:3px;
	margin-top:2px;
}

textarea {
	width:98%;
	height:200px;
	padding:6px;
	font-size:13px;
	overflow:auto;
}

select {
	font-size:11px;	
	border:1px inset #ccc;
	padding:2px;
}	

td.label {
	width:120px;
	color:#809198;
}

.help {
	font-size:11px;
	color:#666;
}

.help a {
	font-size:11px;	
}

td.help {
	padding-left:10px;		
}

p.less {
	color:#555;		
}


.jform textarea {
	border:1px outset #ddd;	
}

input.readmode {
	text-decoration:underline;			
}

 
div.error {
	color: #ff0000;
	font-size:11px;
}

button {
	font-size:12px;		
}

td.blank {
	border:0;
	height:30px;
}

/*}}}*/


/*{{{ buttons */

button {
	outline:1px outset #999;	
	border:1px solid #fff;	
	background-color:#222;
	color:#fff;
	height:24px;
	-moz-border-radius:4px;
	-moz-outline-radius:4px;
	cursor:pointer;
	font-size:11px;
}

button em {
	color:yellow;
	font-style:normal;
}

/* button.custom */
button.custom span {
	position:relative;
	top:-1px;		
}

button.custom.low span {
	top:-2px;		
}

/*{{{ tables */

table.listing {
	width:100%;
	background-color:#fff;
}

table.listing td {
	border-bottom:1px solid #ddd;
	padding:5px;	
}


table.listing a:hover {
	color:#000;
}

table.listing a:hover span {
	color:#333;
}

th { 
	background:url(/images/h30.png) 0 0px repeat-x;
	background-color:#c2d0da;
	text-align:left;
	padding:5px; 
	border-bottom:5px solid #fff;
	font-weight:normal;
	font-size:14px;
}

table.listing td img {
	cursor:pointer;		
}

th.sort {
	cursor:pointer;
	background-color:#A2D0DA;
	border-left:1px solid #FFFFFF !important;
}

th.sort.asc, th.sort.desc {
	background-color:#ffD0DA;
}


/* overlay */ 
div.overlay, #overlay {
	padding:40px;	
	width:576px;  
	display:none;
	background-image:url(/images/transparent.png);	
}

div.overlay div.close, #overlay div.close {
	background:url(/images/close.png) no-repeat;
	position:absolute;
	top:2px;
	right:5px; 
	width:35px;
	height:35px;
	cursor:pointer;
}

#overlay_player { 		
	display:block;
	height:450px;
}


#right li a span {
	display:block;
	margin-top:2px;
	color:#333;
	font-size:11px;
}

#right li a.selected span {
	display:block;
	margin-top:2px;
	color:yellow;
}

/*}}}*/


/*{{{ home */

#index #content {
	background:none;
	width:768px;
	margin:0px;
	padding:0px;
}

#index #right {
	width:210px;
	float:right;
	margin:-1px  0;	
}


h1#logo span {
	position:relative;
	top:32px;		
	font-size:22px;
}



#items {
	position:absolute;
	width:9999em;
}

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

#items #first {
	background:url(/img/home/main.jpg) no-repeat 0 -546px;		
	height:425px; 
	padding-top:50px;
}

#items div.item h2 {
	margin-top:20px;
	color:white;
}

#items a.flowplayer {
	display:block;
	background:transparent url(/images/h500.png) repeat-x;
	height:320px;
	width:430px;
	float:left;
	text-align:center;
	margin:20px 20px 0 0;
}

#items a.flowplayer img {
	margin-top:120px;		
}

/* old flash version */
#items a.flowplayer h2, #items a.flowplayer a {
	font-size:20px;
	color:#fff;
}

#items div.col {
	float:right;
	width:230px;
	margin:0px;
}

#items #first a.flowplayer {
	width:460px;		
	margin:0px;
}


#items #first div.col {
	width:165px;		
}

#items p.more {
	font-weight:bold;
	font-size:12px;
	margin-top:30px;
}

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

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

/* tabs */
ul#tabs { 
	list-style:none; 
	margin:0 !important; 
	padding:0 !important; 
}

#player3 object {
	z-index:10000;		
}

ul#tabs li { 
	float:left; 
	margin:0; 
	padding:0; 
	text-indent:0; 
	list-style-image:none;
}

#content ul#tabs li a { 
	display:block;
	height: 33px;  
	overflow: hidden; 
	text-indent: -999em; 
	width: 189px; 
	background: url(/img/home/main.jpg) no-repeat;
	padding:0px;
	margin:0px;
}

#content #tabs #t1 { background-position: 0 0; }
#content #tabs #t2 { background-position: -189px 0; }
#content #tabs #t3 { background-position: -378px 0; }
#content #tabs #t4 { background-position: -567px 0; width:192px;}
               
#content #tabs #t1:hover { background-position:      0 -33px; }
#content #tabs #t2:hover { background-position: -189px -33px; }
#content #tabs #t3:hover { background-position: -378px -33px; }
#content #tabs #t4:hover { background-position: -567px -33px; }

#content #tabs a.active   {cursor:default; }
#content #tabs #t1.active { background-position:      0 -66px; }
#content #tabs #t2.active { background-position: -189px -66px; }
#content #tabs #t3.active { background-position: -378px -66px; }
#content #tabs #t4.active { background-position: -567px -66px; }





@media print {

	body {
		padding:0;		
	}
	
	#globalnav, #right, #user, .noprint, #breadcrumb {
		display:none;		
	}
	
	#wrap, #content {
		width:98%;		
		margin:0;
	}
	
	#content h1 {
		padding:0;
		margin:0;
		top:0;		
	}
}