﻿body {background: #1e1e1e url(/img/main/StreamingBG.jpg); margin: 0; font-size: 11px; font-family: Arial, sans-serif;  color: #fefefe;}
a {outline:none; border: none; color: #fff; text-decoration:none;}
a:hover {text-decoration: underline;}
a img {border: none;}

#Header #StreamingLogo {width: 149px; height: 73px; position: absolute; top: 9px; left: 165px; text-indent: -550em;}
#Header #streamPlayer {width: 750px; height: 360px; position: absolute; top: 1px; right: 0;}


#contentSummary{position:relative;}
.expanded{z-index:1;}
.collapsed{z-index:0;}

#ProfileBox {padding: 33px 0 0 11px; width:316px; height:194px; float: left; background: url(/img/main/StreamingSocialBG.gif) no-repeat 14px 8px;  overflow: hidden;}
#ProfileBox .Tabs {background: #373737 url(/img/main/StreamingTabBG.gif) repeat-x 0 0; height: 28px; border-left: solid 1px #4e4e4e; }
#ProfileBox .Tabs a {display: block; height: 18px; float: left; padding: 5px 10px 5px 10px; color: #fff; text-decoration: none;}
#ProfileBox .Tabs a.selected {background: url(/img/main/StreamingTabSelBG.gif) no-repeat 50% 0;}
#ProfileBox .Tabs .More {float:right; width:20px; height: 23px; padding-top: 1px; background:url(/img/main/StreamingMore.gif) no-repeat 95% 50%; padding-right: 35px;}
#ProfileBox #Status, #ProfileBox #Messages {background: #373737; border-left: solid 1px #4e4e4e; }

.StatusMessage {border-bottom: solid 1px #545252; padding:5px 10px; clear: both; min-height: 30px; }
.StatusMessage .Avatar {float: left; width: 28px; height: 28px; border: solid 1px #fff; margin-right: 7px;}
.StatusMessage .Avatar img {width: 28px; height: 28px; }
.StatusMessage .UserName {color:#ff0c00; display: block; font-size: 12px; text-transform: uppercase; }
.StatusMessage span {color:#fff;}

.Message {border-bottom: solid 1px #545252; padding:5px 10px; clear: both; min-height: 30px; }
.Message .Avatar {float: left; width: 28px; height: 28px; border: solid 1px #fff; margin-right: 7px;}
.Message .Avatar img {width: 28px; height: 28px; }
.Message .Origin {color:#ff0c00; display: block; font-size: 12px; text-transform: uppercase; }
.Message .UserName  {display:inline; color: #777;}

#StuffBox {padding: 33px 10px 0 0; width:405px; height:194px; float: right; background: url(/img/main/StreamingStuffBG.gif) no-repeat 5px 8px; overflow: hidden;}
#StuffBox .Tabs {height: 35px; background: url(/img/main/StreamingTabBG.gif) repeat-x 0 0; }
#StuffBox .Tabs a {display: block; height: 18px; float: left; padding: 5px 10px 5px 10px; color: #fff; text-decoration: none;}
#StuffBox .Tabs a.selected {background: url(/img/main/StreamingTabSelBG.gif) no-repeat 50% 0;}
#StuffBox .Tabs .More {float:right; width:20px; height: 23px; padding-top: 1px; background:url(/img/main/StreamingMore.gif) no-repeat 95% 50%; padding-right: 35px;}
#StuffBox a.Thumb {width: 70px; height: 50px; border: solid 1px #777; float: left; display: block; margin:0 7px 0 0;}
#StuffBox a.Thumb img {width: 70px; height: 50px;}
#StuffBox #PhotosBest, #StuffBox #PhotosRecent {clear:both; height: 70px;}

#FeatureBox {padding: 10px 0 0 11px; height: 126px; width:316px; float: left; overflow: hidden;} 
#FeatureBox .Tabs {background: #373737 url(/img/main/StreamingTabBG.gif) repeat-x 0 0; height: 28px; border-left: solid 1px #4e4e4e; }
#FeatureBox .Tabs a {display: block; height: 18px; float: left; padding: 5px 10px 5px 10px; color: #fff; text-decoration: none;}
#FeatureBox .Tabs a.selected {background: url(/img/main/StreamingTabSelBG.gif) no-repeat 50% 0;}

#ArticleBox {padding: 10px 10px 0 0; height: 126px; width:405px; float: right; overflow: hidden;}
#ArticleBox .Tabs {background: #373737 url(/img/main/StreamingTabBG.gif) repeat-x 0 0; height: 28px; border-left: solid 1px #4e4e4e; }
#ArticleBox .Tabs a {display: block; height: 18px; float: left; padding: 5px 10px 5px 10px; color: #fff; text-decoration: none;}
#ArticleBox .Tabs a.selected {background: url(/img/main/StreamingTabSelBG.gif) no-repeat 50% 0;}
#ArticleBox .Tabs .More {float:right; width:20px; height: 23px; padding-top: 1px; background:url(/img/main/StreamingMore.gif) no-repeat 95% 50%; padding-right: 35px;}

.ArticleItem {border-bottom: solid 1px #545252; padding:5px 10px; clear: both; min-height: 30px; background: #373737; border-left: solid 1px #4e4e4e; }
.ArticleItem .Thumb {float: left; width: 38px; height: 28px; border: solid 1px #fff; margin-right: 7px;}
.ArticleItem .Thumb img {width: 38px; height: 28px; }
.ArticleItem strong {float: left; display: block; width: 200px; height: 28px; overflow: hidden; }
.ArticleItem .Date  {color: #777; font-style:italic;}

#JustPlayed, #Favourite {position: absolute; top: 100px; right: 10px; background:#656565;border-top:1px solid #797979;clear:both;float:left;padding:5px 15px;width:281px; color: #fff; z-index: 10;}

#LeaderBoard {clear:both;height:90px;padding-left:10px;padding-top:10px;width:728px;}

/* float hack */
hr.clearer {display: block; clear: both; margin: -0.66em 0; visibility: hidden;}
div.clearer {clear: both; line-height: 0; height: 0; font-size: 1px;}
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
a#NowPlayingDL {display:block; height:100px; position:absolute; width:125px; z-index:100;}
