/* ***** GENERAL STYLES ***** */
html {
font: 13px Helvetica, sans-serif;
background:#0A0604 url(../images/bg.jpg) repeat-x;
}

body {
position:relative;
}

h1, h2, h3, h4 {
color:#FFF;
text-transform:uppercase;
}

h2 {
font-size:42px;
}

h3 {
font-size:22px;
}
h4 {
font-size:12px;
font-weight:bold;
}

object { display:block; }

.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
/* Controls the BR tag, which makes the WRAPPER float stretch for GECKO */
.clearfix { display: inline-block; }
/* Hides from IE-mac \*/
* html .clearfix {
height: 1%;
}
.clearfix {
display: block;
}
/* End hide from IE-mac */

#container {
position:relative;
width:960px;
margin:0 auto;
}

/* ***** HEADER ***** */
#header {
position:relative;
width:960px;
height:135px;
/*margin-left:20px;*/
color:#FFF;
}
div#logo {
width:242px;
height:123px;
margin-left:20px;
background:url(../images/branding/logo.png) no-repeat;
}
div#logo a {
display:block;
width:242px;
height:123px;
}
#header h1 {
position:absolute;
top:145px;
left:20px;
width:550px;
height:14px;
background:url(../images/branding/tagline.png) top left no-repeat;
text-indent:-9999px;
}


/* ***** MAIN NAV ***** */
#nav_main {
position:absolute;
top:0;
right:0;
width:678px;
height:135px;
list-style-type: none;
overflow: hidden;
}
#nav_main li {
float:left;
}
#nav_main li a {
display:block;
width:225px;
height:135px;
text-indent:-9999px;
margin-left:1px;
background:url(../images/nav_main/nav_main.png) 0 0 no-repeat;
}
/* initial positions and rollovers */
#nav_main li#nav_episodes a {
background-position:0 0;
}
#nav_main li#nav_episodes a:hover {
background-color:#FF00FF;
}
#nav_main li#nav_cast a {
background-position:-225px 0;
}
#nav_main li#nav_cast a:hover {
background-color:#FF00FF;
}
#nav_main li#nav_pad a {
background-position:-450px 0;
}
#nav_main li#nav_pad a:hover {
background-color:#FF00FF;
}

/* current page position */
#episodes #nav_main li#nav_episodes a {
background-color:#FF00FF;
}
#cast #nav_main li#nav_cast a {
background-color:#FF00FF;
}
#thepad #nav_main li#nav_pad a {
background-color:#FF00FF;
}

#branding {
position:absolute;
top:50px;
left:-90px;
width:127px;
height:123px;
background:url(../images/branding/branding_star.png) no-repeat;
text-indent:-9999px;
z-index:10;
}

/* ***** SUB NAV ***** */
#nav_secondary {
width:960px;
height:30px;
background:#300040 url(../images/nav_secondary/bg_subnav.gif) top left repeat-x;
}
#nav_secondary ul {
position:absolute;
top:142px;
right:20px;
}
#nav_secondary li {
float:left;
margin-left:15px;
}
#nav_secondary a {
font-size:13px;
font-weight:bold;
color:#FFF;
}
/* replace final 3 links with icons */
#nav_secondary ul li a#icon_youtube, #nav_secondary ul li a#icon_twitter, #nav_secondary ul li a#icon_facebook {
display:block;
margin-top:-2px;
width:19px;
height:19px;
text-indent:-9999px;
}
#nav_secondary a#icon_youtube {
background:url(../images/nav_secondary/youtube.png) top left no-repeat;
}
#nav_secondary a#icon_twitter {
background:url(../images/nav_secondary/twitter.png) top left no-repeat;
}
#nav_secondary a#icon_facebook {
background:url(../images/nav_secondary/facebook.png) top left no-repeat;
}

/* ***** CONTENT ***** */
#content {
width:920px;
padding:15px 20px;
background:#9300C4 url(../images/content_bg.gif) top left no-repeat;
float:left;
}
#main {
float:left;
width:630px;
}
#player {
margin-top:10px;
}
#player h2 {
display:inline;
max-width:600px;
min-height:7px;
padding:10px;
font-size:12px;
font-weight:bold;
background:#000;
}
#player .kaltura_wrapper {
margin-top:10px;
width:630px;
height:385px;
background:#000;
color:#CCC;
}

/* PLAYLIST */
.playlist {
position:relative;
width:632px;
margin-top:20px;
}
.playlist h2 {
display:inline;
max-width:600px;
min-height:7px;
padding:10px;
background-color:#000;
font-size:12px;
font-weight:bold;
}
/* rows */	
.playlist .row {
margin-top:10px;
margin-bottom:5px;
padding:0;
}

/* position and dimensions of the navigator */
ol.navi {
position:absolute;
top:3px;
right:25px;
}
ol.navi {list-style-type:decimal;margin:0;padding:0; }
ol.navi li{float:left;cursor:pointer;list-style-position:inside;font-size:11px;color:#CCC;font-weight:bold;margin:0 10px 0 0;padding:0;}
ol.navi li.active {
	color:#FFFF00;     
}

/* left right arrows */	
.playlist .row a.prevPage, 
.playlist .row a.nextPage {
display:block;
width:12px;
height:15px;
background:url(../images/player/arrows.gif) 0 center no-repeat;
}
.playlist .row a.prevPage {
position:absolute;
top:0;
right:15px;
}
.playlist .row a.nextPage {
position:absolute;
top:0;
right:0;
background-position:-12px;
}

/* disabled navigational button */
.playlist .row a.disabled {
	visibility:hidden !important;		
}

/* scrollable list */
.playlist .row .scrollable {
position:relative;
float:left;
width:632px;
height:140px;
overflow:hidden;
}
/* 
	root element for scrollable items. Must be absolutely positioned
	and it should have a super large width to accomodate scrollable items.
*/
.playlist .row ul{
position:absolute;
width:10000em;
}
.playlist .row ul li {
list-style:none;
float:left;
width:152px;
margin-right:8px;
color:#FFF;
font-size:11px;
}
.playlist .row ul li.hover {
color:#FFF;
}	


/*---------------------------------*/
.playlist .row ul li div {
position:relative;
overflow:hidden;
cursor:pointer;
}
.playlist .row ul li div b {
position:absolute;
top:50%;
left:50%;
margin:-17px 0 0 -17px;
width:34px;
height:34px;
background:url(../images/player/play_icon.png) 0 0 no-repeat;
}

.playlist .row ul li strong {
display:block;
width:100%;
}
.playlist .row ul li span {
display:block;
}
/*---------------------------------*/


#home #about {
position:relative;
padding-top:20px;
min-height:258px;
background:url(../images/home_about/about_photo.jpg) bottom left no-repeat;
}
#home #about #bubble {
margin-left:180px;
width:452px;
padding-top:15px;
background:url(../images/home_about/bubble_top.png) top right no-repeat;
}
#home #about #bubble h2 {
background-color:#FFFF00;
margin-left:63px;
padding:0 10px;
font-size:30px;
border-left:1px solid #000;
border-right:1px solid #000;
color:#000;
}
#home #about #bubble p {
background:#FFFF00;
margin-left:63px;
padding:10px 10px 0 10px;
border-left:1px solid #000;
border-right:1px solid #000;
}
#home #about a {
color:#240030;
font-weight:bold;
}
#home #about #bubble_footer{
width:452px;
height:30px;
background:url(../images/home_about/bubble_bottom.png) bottom right no-repeat;
}

/*
02-26-09
#about {
position:relative;
width:265px;
min-height:275px;
background:url(../images/about/about_photo.gif) bottom left no-repeat;
margin-top:20px;
}
#about #bubble {
position:absolute;
top:0;
left:265px;
width:389px;height:21px;
background: url(../images/about/bubble_top.gif) top left no-repeat;
}
#about h2 {
---
position:absolute;
top:0;
left:266px;
---
width:387px;
background:#FFFF00;
padding: 0 0 0 0;
margin-top:21px;
border-left:1px solid black;
border-right:1px solid black;
font-size:28px;
color:#000;
}
#about p {
width:387px;
background:#FFFF00;
padding: 0 0 0 0;
border-left:1px solid black;
border-right:1px solid black;
font-size:14px;
color:#000;
}

#about {
position:relative;
width:632px;
margin-top:85px;
height:200px;
background:url(../images/about/about_bg.gif) no-repeat;
}
#about h2 {
position:absolute;
top:-45px;
width:632px;
height:42px;
background:url(../images/about/about_headline.png);
text-indent:-9999px;
z-index:10;
}
#about p {
position:absolute;
bottom:0;
left:-65px;
width:685px;
height:230px;
background:url(../images/about/about_p.png);
text-indent:-9999px;
}
*/

#nav_share {
margin-top:25px;
margin-bottom:25px;
height:150px;
background:url(../images/nav_share/bg_share.gif) no-repeat;
}
#nav_share h3 {
text-indent:-9999px;
}
#nav_share ul {
/*width:100%;*/
height:56px;
margin-top:65px;
padding-left:53px;
background:url(../images/nav_share/arrow.gif) no-repeat;
}
#nav_share ul li {
float:left;
}
#nav_share ul li a {
display:block;
margin-top:12px;
margin-left:5px;
width:186px;
height:30px;
text-indent:-9999px;
}
#nav_share ul li a#share_youtube {
background:url(../images/nav_share/youtube.gif) no-repeat;
}
#nav_share ul li a#share_twitter {
background:url(../images/nav_share/twitter.gif) no-repeat;
}
#nav_share ul li a#share_facebook {
background:url(../images/nav_share/facebook.gif) no-repeat;
}

#sidebar {
margin-top:10px;
width:250px;
float:right;
}
#sidebar h4 {
display:inline;
padding:10px;
background:#000;
color:#FFF;
text-transform:uppercase;
}
#sidebar #ad_space {
margin-bottom:30px;
}
#sidebar #ad_space ul {
margin-top:10px;
}
#sidebar #mailing_list ul {
margin-top:10px;
}
#sidebar li {
margin-bottom:10px;
}
/*#sidebar li a {
display:block;
width:250px;
height:250px;
}
*/
/* MAILING LIST CALL OUT */
#sidebar #mailing_list {
margin-top:15px;
}
/*#sidebar #mailing_list h4{
width:65px;
}
*//*#sidebar #mailing_list ul li a {
display:block;
width:250px;
height:250px;
}
*/
/* FOOTER */
#footer {
clear:both;
width:960px;
border-top:3px solid #000;
background:#9300C4;
}
#footer ul {
margin-left:10px;
padding:10px 0;
}
#footer li {
float:left;
}
#footer ul li a {
padding:0 20px 0 0;
color:#240030;
font-weight:bold;
text-transform:uppercase;
font-size:10px;
}

#siteinfo {
clear:both;
color:#9300C4;
margin:15px 0 10px 20px;
font-size:11px;
}

/* ********** EPISODES ********** */
#episodes #episode_info {
position:relative;
padding-top:1px;
width:630px;
min-height:317px;
background:url(../images/episode_info_bg.jpg) bottom left no-repeat;
}
#episodes #episode_info #bubble {
margin-top:45px;
margin-left:180px;
width:452px;
padding-top:15px;
background:url(../images/home_about/bubble_top.png) top right no-repeat;
}
#episodes #episode_info #bubble h2 {
background-color:#FFFF00;
margin-left:63px;
padding:0 10px;
font-size:30px;
border-left:1px solid #000;
border-right:1px solid #000;
color:#000;
}
#episodes #episode_info #bubble p {
background:#FFFF00;
margin-left:63px;
padding:10px 10px 0 10px;
border-left:1px solid #000;
border-right:1px solid #000;
}
#episodes #episode_info #bubble_footer{
width:452px;
height:30px;
background:url(../images/home_about/bubble_bottom.png) bottom right no-repeat;
}

/* EPISODE PAGE PLAYLIST */
#episodes #playlist {
width:250px;
margin:10px 0 0 0;
}
#episodes #playlist h2 {
display:inline;
height:7px;
padding:10px;
font-size:12px;
font-weight:bold;
background-color:#000;
}
#episodes #playlist div.row {
margin-top:10px;
}
#episodes #scroll_content {
height:380px;
overflow:hidden;
}

#episodes #playlist ul {
width:215px;
margin:0;
padding:0;
overflow:hidden;
}

#episodes #scroll_content ul li {
/*width:140px;
height:85px;*/
cursor:pointer;
margin-bottom:5px;
}
#episodes #playlist ul li div.info {
float:right;
width:70px;
margin-top:15px;
color:#FFF;
font-family:Helvetica, sans-serif;
font-size:11px;
font-weight:bold;
}
#episodes #playlist .row ul li div+div {
width:140px;
position:relative;
}
#episodes #playlist ul li b {
position:absolute;
top:50%;
left:50%;
margin:-17px 0 0 -17px;
width:34px;
height:34px;
background:url(../images/player/play_icon.png) 0 0 no-repeat;
}

/* ********** THE CAST ********** */
#cast #content {
padding-bottom:15px;
}
#cast #cast_detail {
margin-top:5px;
}
#cast #cast_detail h2{
display:inline;
position:relative;
padding:10px;
height:7px;
background:#000;
color:white;
text-transform:uppercase;
font-size:12px;
font-weight:bold;
z-index:50;
}
#cast #cast_detail img {
margin-top:-10px;
}
/*
#cast #cast_detail {
width:632px;
}
#cast #cast_detail h2{
padding:10px;
width:286px;
height:7px;
background:#000;
color:white;
text-transform:uppercase;
font-size:12px;
font-weight:bold;
z-index:100;
}
#cast #cast_detail img {
margin-top:-10px;
}*/

#cast #sidebar {
position:relative;
margin-top:5px;
}
#cast #sidebar h4 {
display:inline;
height:7px;
padding:10px;
background:#000;
color:white;
text-transform:uppercase;
}
#cast #sidebar #thumbs ul {
position:absolute;
top:24px;
left:-20px;
width:290px;
}
#cast #sidebar #thumbs ul li {
float:left;
margin:0;padding:0;
}
/*
#cast #sidebar #thumbs ul li#apollo {
background:url(../images/characters/thumbs/apollo.jpg) top left no-repeat;
}
#cast #sidebar #thumbs ul li#iceflow {
background:url(../images/characters/thumbs/iceflo.jpg) top left no-repeat;
}
#cast #sidebar #thumbs ul li#mickey {
background:url(../images/characters/thumbs/mickey.jpg) top left no-repeat;
}
#cast #sidebar #thumbs ul li#laquisha {
background:url(../images/characters/thumbs/laquisha.jpg) top left no-repeat;
}
#cast #sidebar #thumbs ul li#snowflake {
background:url(../images/characters/thumbs/snoflake.jpg) top left no-repeat;
}
#cast #sidebar #thumbs ul li#angel {
background:url(../images/characters/thumbs/angel.jpg) top left no-repeat;
}
#cast #sidebar #thumbs ul li#sharquisha {
background:url(../images/characters/thumbs/sharquasia.jpg) top left no-repeat;
}
#cast #sidebar #thumbs ul li#pogo {
background:url(../images/characters/thumbs/pogo.jpg) top left no-repeat;
}
*/
#cast #sidebar li a {
display:block;
margin:0;padding:0;
background:none;
width:145px;
height:145px;
/*text-indent:-9999px;*/
}
#cast #player {
margin-top:5px;
}

/* ********** THE PAD ********** */
#thepad #content {
position:relative;
padding-top:25px
}
#thepad #coaster {
position:absolute;
top:340px;
left:600px;
width:312px;
height:312px;
background:url(../images/the_pad/coaster.png) top left no-repeat;
z-index:4;
}
#thepad #content h2 {
display:inline;
min-height:7px;
padding:10px;
background:#000;
color:#FFF;
font-size:12px;
font-weight:bold;
}
#thepad #letter {
position:relative;
margin-top:10px;
width:904px;
height:796px;
background:url(../images/the_pad/letter.png) top left no-repeat;
padding-bottom:225px;
text-indent:-99999px;
z-index:5;
}
#thepad #photo {
position:absolute;
bottom:0;
left:300px;
width:325px;
height:370px;
background:url(../images/the_pad/letter_photo.png) top left no-repeat;
z-index:6;
}
#thepad #specials {
position:absolute;
top:90px;
left:600px;
width:371px;
height:320px;
background:url(../images/the_pad/specials.png) top left no-repeat;
text-indent:-9999px;
z-index:3;
}

/* ********** SUB PAGES ********** */
#contact #content, #credits #content, #privacy #content, #legal #content {
width:940px;
padding:10px;
}
#contact #content p, #credits #content p, #privacy #content p, #legal #content p {
color:#FFF;
margin-top:10px;
font-size:11px;
}

/* ********** CONTACT ********** */
#contact {
color:#FFF;
}
#contact #content h2 {
font-size:14px;
background-color:#000000;
padding:10px 15px 10px 10px;
margin-bottom:10px;
}
#contact #content h3 {
text-transform:none;
font-size:14px;
margin-top:10px;
margin-bottom:10px;
}
#contact #content p {
margin:0 0 0 5px;
font-size:13px;
line-height:1.25;
}
#contact #content a {
color:#FFF;
}
#contact #legal {
margin-top:20px;
}

/* ********** ADVERTISE ********** */
#advertise {
color:#FFF;
}
#advertise h2 {
font-size:14px;
background-color:#000000;
padding:10px 15px 10px 10px;
margin-bottom:10px;
}
#advertise #content p {
margin-bottom:10px;
}
#advertise #content a {
color:#FFF;
}

/* ********** CREDITS ********** */
#credits #content h2 {
font-size:14px;
background-color:#000000;
padding:10px 15px 10px 10px;
margin-bottom:10px;
}
#credits dt {
margin-top:10px;
font-size:.9em;
font-weight:bold;
color:#FFF;
}
#credits dd {
font-size:1em;
color:#CCC;
}

#credits #content h3 {
margin-top:10px;
text-transform:none;
font-size:14px;
color:#240030;
}
#credits #content p {
margin:0;
line-height:1.25;
}
/* ********** LEGAL ********** */
#legal #content h2 {
font-size:14px;
background-color:#000000;
padding:10px 15px 10px 10px;
margin-bottom:10px;
}
#legal #content ol {
list-style-type:decimal;
color:#FFF;
}
#legal #content li {
font-size:11px;
}
#legal #content ol li {
margin-bottom:10px;
}
#legal #content ul {
padding-left:10px;
}
#legal #content ul li {
list-style-position:outside;
margin-bottom:5px;
padding-left:10px;
background:url(../images/bullet.gif) 0 2px no-repeat;
}
#legal h3 {
margin:0 0 5px 0;
font-size:1em;
font-weight:bold;
color:#FFF;
}
#legal #content a {
color:#FFF;
}
/* ********** PRIVACY ********** */
#privacy #content h2 {
font-size:14px;
background-color:#000000;
padding:10px 15px 10px 10px;
margin-bottom:10px;
}
#privacy #content h3 {
text-transform:none;
font-size:14px;
color:#CCCCCC;
margin-top:10px;
}
/* ********** PARTNERS ********** */
#partners #content h2 {
font-size:14px;
background-color:#000000;
padding:10px 15px 10px 10px;
margin-bottom:10px;
color:#FFF;
}
#partners #content h3 {
text-transform:none;
font-size:14px;
color:#CCCCCC;
margin-top:10px;
margin-bottom:5px;
}
#partners span.instructional {
font-size:.8em;
}
#partners li {
margin-bottom:5px;
}
#partners li a {
color:#FFF;
}
#partners #content li a:hover {
color:#FFF;
}
/* ********** SIGNUP ********** */
#signup #content h2 {
font-size:14px;
background-color:#000000;
padding:10px 15px 10px 10px;
margin-bottom:10px;
}
#signup #content h3 {
text-transform:none;
font-size:14px;
color:#CCCCCC;
margin-top:10px;
}
#signup #content p {
margin-top:10px;
margin-bottom:5px;
color:#FFF;
}

/* ********** REMIX-SEND ********** */
#remix-send form {
	margin:10px 0 0;
	float:left;
	width:415px;
}
#remix-send fieldset {
	border:none;
	margin:0 0 0 10px;
	padding:0;
}
#remix-send legend {
	background-color:#000;
	color:#FFF;
	padding:3px;
	margin:0 0 10px;
}
#remix-send form ol {
	margin:5px 0 10px;
	padding:0;
	list-style:none;
}
#remix-send form ol li{
	margin:0 0 5px;
}
#remix-send label {
	display:block;
	font-size:.9em;
	color:#FFF;
}
#remix-send #preview, #insult #preview {
	margin:10px 0 0;
	float:left;
}
#remix-send div.error {
	display:none;
}
#remix-send .error {
	color:#900;
	font-weight:bold;
}
#remix-send em.error {
	width:250px;
	display:block;
	float:right;
	font-size:.8em;
	margin: 0 0 0 3px;
}
#remix-send div#loading {
	background:url(../images/ajax-loader.gif) 0 0 no-repeat;
	margin: 0 0 0 10px;
	width:28px;
	height:28px;
	float:left;
	display:none;
}
#insult p { color:#c863ff; }
#insult #preview {
	float:none;
	margin-bottom:10px;
}
#insult a {
	text-decoration:underline;
	color:#FFF;
}