@charset "UTF-8";
@import url("/tnnCss/hub/liveSpill.css");
@import url("/tnnCss/hub/mSlider.css");
@import url("/tnnCss/hub/mComments.css");
@import url("/tnnCss/hub/mViewAll.css");
@import url("/tnnCss/hub/mUpload.css");
@import url("/tnnCss/hub/about.css");
@import url("/tnnCss/hub/friends.css");

/* tHub CSS */
#hubAboutContainer a:link, #activityDiv a:link, #friendsList a:link  {
	
	color: #CC0000;
	font-size: 10px;
	font-weight: normal;
	text-decoration:none;
}
#hubAboutContainer a:visited, #activityDiv a:visited, #friendsList a:visited{
	
	color: #CC0000;
	font-size: 10px;
	font-weight: normal;
	text-decoration:none;
}
#hubAboutContainer a:hover, #activityDiv a:hover,  #friendsList a:hover{
	
	color: #FFCC00;
	font-size: 10px;
	font-weight: normal;
	text-decoration:none;
}
#hubAboutContainer a:active, #activityDiv a:active,  #friendsList a:active{
	
	color: #FFCC00;
	font-size: 10px;
	font-weight: normal;
	text-decoration:none;
}
#hubAboutContainer, #activityDiv {
	background-color:#000000;
	
	color:#CC9933;
	font-size:10px;
}
#hubRightContainer {
	background-color:#000000;
	
	color:#CC9933;
	font-size:12px;
	float:left;
	width:100%;
	margin:10px 0px 0px 0px;
	min-height:1000px; /* I know it's a bad idea, but the friends page is too short and the scroll bar disappearing is driving me crazy. */
}

#uploadVideoForm p {
	color:#666666;
	font-size:10px;
}

#uploadPhotoForm p {
	color:#666666;
	font-size:10px;
}

.noComments{
	color:#666666;
	font-size:10px;
}

.hubHeader1{
	
	color:#FFB400;
	font-size:16px;
	font-weight:bold;
}
.hubHeader2{
	
	color:#CC9933;
	font-size:14px;
	color:#666666;
}

.hubTopUser{
}

.mainHubNavigation {
	color:#ffffff;
	font-size:12px;
	font-weight:bold;
	margin:10px 0px 5px 0px;
	padding-bottom:2px;
	border-bottom:1px #444444 solid;
	font-size:12px;
}

a.hubTopMainNav:link {
	font-weight: normal;
	color:#999999;
	text-decoration:none;
	background-color: #202020;
	padding:2px 15px 2px 15px;
	margin:0px 3px 0px 0px;
}
a.hubTopMainNav:visited {
	font-weight: normal;
	color:#999999;
	text-decoration:none;
	background-color: #202020;
	padding:2px 15px 2px 15px;
	margin:0px 3px 0px 0px;
}
a.hubTopMainNav:hover {
	font-weight: normal;
	color:#FFB400;
	text-decoration:none;
	background-color: #202020;
	padding:2px 15px 2px 15px;
	margin:0px 3px 0px 0px;
}
a.hubTopMainNav:active {
	font-weight: normal;
	color:#999999;
	text-decoration:none;
	background-color: #202020;
	padding:2px 15px 2px 15px;
	margin:0px 3px 0px 0px;
}
a.hubTopMainNavHere:link {
	font-weight: bold;
	color:#FFFFFF;
	text-decoration:none;
	background-color: #333333;
	padding:2px 12px 2px 12px;
	margin:0px 3px 0px 0px;
	border:1px solid #444444;
	border-bottom:1px solid #333333;
}
a.hubTopMainNavHere:visited {
	font-weight: bold;
	color:#FFFFFF;
	text-decoration:none;
	background-color: #333333;
	padding:2px 12px 2px 12px;
	margin:0px 3px 0px 0px;
	border:1px solid #444444;
	border-bottom:1px solid #333333;
}
a.hubTopMainNavHere:hover {
	font-weight: bold;
	color:#FFB400;
	text-decoration:none;
	background-color: #333333;
	padding:2px 12px 2px 12px;
	margin:0px 3px 0px 0px;
	border:1px solid #444444;
	border-bottom:1px solid #333333;
}
a.hubTopMainNavHere:active {
	font-weight: bold;
	color:#FFFFFF;
	text-decoration:none;
	background-color: #333333;
	padding:2px 12px 2px 12px;
	margin:0px 3px 0px 0px;
	border:1px solid #444444;
	border-bottom:1px solid #333333;
}
.hubLeftBox {
	width:300px;
	border-bottom: #444444 1px solid;
	margin-bottom:5px;
	padding-bottom:5px;
}
.hubLeftBox .boxheader {
	
	font-size:10px;
	font-weight:bold;
	color:#FFB400;
	margin:5px 0px 5px 0px;
	text-transform:uppercase;
	letter-spacing:2px;
}
a.linkLiveSpillAct:link {
	background-color:#0063c1;
	color:#fff;
}	
a.linkLiveSpillAct:visited {
	background-color:#0063c1;
	color:#fff;	
}
a.linkLiveSpillAct:hover {
	background-color:#0063c1;
	color:#FFB400;	
}
a.linkLiveSpillAct:active {
	background-color:#0063c1;
	color:#fff;	
}


/* ----------------------- for liveSpill indicator link as separate from tab navigation 
#hubLeftSpillInactive,
#hubLeftSpillActive {
	padding-top:5px;
	}
#hubLeftSpillInactive a.spillInact {
	
	font-size:10px;
	font-weight:normal;
	color:#666;
	margin:5px 0px 5px 0px;
	text-transform:uppercase;
	text-decoration:none;
	letter-spacing:2px;
}
#hubLeftSpillInactive a.spillInact:hover {
	
	font-size:10px;
	font-weight:normal;
	color:#fff;
	margin:5px 0px 5px 0px;
	text-transform:uppercase;
	text-decoration:none;
	letter-spacing:2px;
}
#hubLeftSpillActive a.spillAct {
	background: url(/img/liveSpill/aire/aireRight/spillIconBlk.gif) right center no-repeat;
	padding-right: 15px; 
	color:#fff;
	
	font-size:10px;
	font-weight:bold;
	margin:5px 0px 5px 0px;
	text-decoration:none;	
	text-transform:uppercase;
	letter-spacing:2px;		
}	
#hubLeftSpillActive a.spillAct:hover {
	background: url(/img/liveSpill/aire/aireRight/spillIconBlk.gif) right center no-repeat;
	padding-right: 15px; 
	color:#FFB400;
	
	font-size:10px;
	font-weight:bold;
	margin:5px 0px 5px 0px;
	text-decoration:none;	
	text-transform:uppercase;
	letter-spacing:2px;		
}	
 ----- */

#hubAboutContainer ul, #activityDiv ul {
	list-style:none;
	padding:0px;
	margin:0px;
}

a.hubLeftSmallLink:link {
	font-weight: normal;
	color:#990000;
	text-decoration:none;
}
a.hubLeftSmallLink:visited {
	font-weight: normal;
	color:#990000;
	text-decoration:none;
}
a.hubLeftSmallLink:hover {
	font-weight: normal;
	color:#FFB400;
	text-decoration:none;
}
a.hubLeftSmallLink:active {
	font-weight: normal;
	color:#FFB400;
	text-decoration:none;
}

a.hubFriendRemove:link {
	font-size:10px;
	font-weight:normal;
	color:#666666;
}

#hubLeftAvatar{
	border:none;
	margin-top:7px; /* I know it's a weird number, but it looks right */
}

.hubLeftIndFriend{
	width:60px;
	padding:3px;
	float:left;
	text-align:center;
	list-style:none;
}
.hubMainIndFriend{
	width:132px;
    height:200px;
	margin-bottom:20px;
	padding:5px;
	float:left;
	text-align:center;
	list-style:none;
    overflow:hidden;
}
.hubLeftIndFriend IMG, {
	width:60px;    
}

.hubMainIndFriend IMG {
	/* width:132px; */
	}

.hubFriendsThumb{
	/* width:132px; */
	height:132px;
	white-space:nowrap;
	overflow:hidden;
	display: block;
	border: none;
	padding-right:10px;
}
#hubLeftAvatar{
	width:380px;
	/*height:400px;*/
	white-space:nowrap;
	overflow:hidden;
	display: block;
	border: none;
	padding-right:10px;
}
#hubLeftAvatar img{
	width: 380px;
}
.hubFriendsThumb_activity{
	width:30px;
    height: 30px;
	padding-right:10px;
	overflow:hidden;
	display: block;
	border: none;
	white-space:nowrap;
}

.hubFriendsLink {
	font-size:10px;
 	padding: 5px 0px;
}

.hubLeftIndVideo{
	float:left;
	width: 290px;
	padding:3px;
	list-style:none
}
.hubLeftIndVideo IMG {
	width:100px;
	height:60px;
	border: none;
	float:left;
	margin:0px 5px 0px 0px;
}
.hubLeftIndVideoText, .hubLeftIndPhoto{
	color: #999999;
}
.hubPhotoThumb  IMG{
	width:100px;    
}
.hubPhotoThumb {
	width:100px;
	height: 60px;
	white-space:nowrap;
	overflow:hidden;
	display: block;
	border: none;
	float: left;
	padding: 0px 5px 0px 0px;
}
/*.hubPhotoLink {
	float: left; 
	width: 100px;
}*/
.hubLeftIndPhoto{
	float:left;
	width: 290px;
	padding:3px;
	list-style:none;
}

.hubLeftIndPosts{
	float:left;
	width: 290px;
	padding:3px;
	list-style:none;
}

.hubLeftIndPhotoText{
	color: #999999;
}

.hubLeftIndThreadText, .hubTimeStamp{
	color: #999999;
}
.viewPort { /* probably won't need any styling (it's sized properly based on the javascript init)'*/
}
.contentItems { /* probably won't need any styling (this is the slidey container for photo/video content) */
}
#mytPhotoThumbnails {   /* top-level div for the photo thumbnail control.  The id must match what's passed to the javascript init */
    width: 1000px;
}
#mytVideoThumbnails {   /* top-level div for the video thumbnail control.  The id must match what's passed to the javascript init */
    width: 1000px;
}
.thumbnails {   /* inner container for the thumbnails.  This class name tells the javascript where to put the thumbnails. */
}
div.thumbnailWrapper {  /* a div wrapper for each thumbnail image */
    width: 100px;
    height: 80px;
    margin: 5px 4px;
    text-align: center;
    border: #000000 solid 1px;
}
img.thumbnail {
    cursor: pointer;
}
div.thumbHighlight {       /* added to the div wrapper to indicate thumbnail selection */
    border: red solid 1px;
}
#postButton:hover{
 	cursor: pointer;
}
#hubForumLinks{
	padding: 10px 0px;
}
/* pager styles */
.pager {    /* the top-level pager element */
    font-size:10px;
	margin: 0px auto 5px auto;
	text-align:center;
	width:700px;
}
a.pagerLink:link, a.pagerLink:visited {  /* each link in the pager control */
    color:#CC0000;
    
    font-size:10px;
    font-weight:bold;
    text-decoration:none;
    padding: 0px 3px;
}
a.current:link, a.current:visited {    /* the current page link */
    color:#CC9933;
}
.pager .sepRight {  /* placed on the 'prev' and 'first' link group to render a separator on the right side */
    border-right: #666666 solid 2px;
	padding: 0px 3px;
	margin:0px 3px;
}
.pager .sepLeft {   /* placed on the 'next' and 'last' link group to render a separator on the left side */
    border-left: #666666 solid 2px;
	padding: 0px 3px;
	margin:0px 3px;
}

/* friends username overflow */
#hubLeftFriends ul {
	padding: 0px; 
	margin: auto;
}
#hubLeftFriends li {
	padding:3px 10px 2px 5px;
}
#hubLeftFriends a.hubLeftSmallLink, #mainFriends a.hubLeftSmallLink{
   white-space:nowrap;
   text-overflow:ellipsis; /* for internet explorer */
   overflow:hidden;
   width:60px;
   display:block;
}

.hubVideoNavigation {
	margin:0px 0px 0px 0px;
	color:#999999;
	padding-bottom:2px;
	border-bottom:1px #444444 solid;
	font-size:12px;
}
#editQuip-inplaceeditor{
	padding-bottom: 5px;
}