@charset "UTF-8";
/* TRANCETRIBE V4.6 HOME PAGE SPECIFIC STYLES */

.clear { clear: both; content: "."; height: 0; visibility: hidden; display: block; }
#homeMain			{ float: left; width: 815px; margin-right: 25px; }

/* HERO FEATURES */
#hero								{ position: relative; width: 815px; height: 442px; overflow: hidden; margin: 8px 0px 20px 0px; }
#tabs								{ position: absolute; left: 0px; top: 315px; z-index: 1; height: 146px; width: 600px; padding: 0px 0px 0px 10px; background: #242424 url('../images/home/hero_bg.png') repeat-x left top; }
#panels								{ position: absolute; left: 0px; top: 0px; z-index: 0; width: 610px; height: 315px; overflow: hidden; }
#panels img							{ width: 610px; height: 315px; }
#hero ul li 						{ float: left; margin-right: 10px; width: 140px; height: 141px; position: relative; padding: 9px 0px; }
#hero ul li img						{ border: solid 1px #aaaaaa; -webkit-transition: all 200ms; }
#hero ul li img:hover				{ border-color: #FFF; }
#hero ul li img:active				{ border-color: #000; }
#hero ul li h2						{ line-height: 10px; }
#hero ul li h2 a					{ font-size: 12px; color: #FFF; font-weight: bold; font-family: "Trebuchet MS", Tahoma, sans-serif; }	
#hero ul li h2 a:hover				{ color: #999; }	
#hero ul li span					{ z-index: 2; display: none; position: absolute; left: 55px; top: -1px; background: transparent url('../images/home/hero_arrow.png') no-repeat left top; width: 21px; height: 10px; }
#hero ul li.ui-tabs-selected:hover span	{ display: block; background-position: left -10px; }
#hero ul li.ui-tabs-selected span	{ display: block; }			
#hero ul li:hover img  				{ border-color: #FFF; }			
#hero ul li:hover img:active  		{ border-color: #000; }	
#hero .panel						{ position: relative; width: 610px; height: 315px; background-color: #000; }
.ui-tabs-hide						{ display: none; }
.heroBlack							{ position: absolute; z-index: 1; left: 0px; bottom: 0px; width: 610px; height: 70px; background-color: #000; filter: alpha(opacity=75); filter: progid:DXImageTransform.Microsoft.Alpha(opacity=75); -moz-opacity: 0.75; opacity: 0.75; }
.heroText							{ position: absolute; left: 0px; bottom: 0px; padding: 14px; z-index: 3; }
.heroText h2						{ font-size: 26px; color: #FFF; margin: 0px; }
.heroText p							{ color: #b2b1b1; font-size: 12px; margin: 0px; }
.heroText h2 a						{ color: #FFF; }
.heroText h2 a:hover				{ color: #CCC; }

/* TUNE OF THE WEEK */
#totw								{ position: absolute; left: 610px; top: 0px; width: 176px; height: 408px; background: #313131 url('../images/global/details_bg.png') repeat-y left top; padding: 17px 12px 17px 15px; -webkit-border-top-right-radius: 8px; -moz-border-radius-topright: 8px; border-top-right-radius: 8px; }
#totw h2							{ font-size: 19px; color: #CCC; margin-bottom: 5px; }
#totw img							{ width: 172px; height: 172px; border: solid 1px #b1b1b1; }
#totw h3							{ margin: 0px; }
#totw h3 a							{ font-size: 12px; color: #FFF; }
#totw h3 a:hover					{ color: #4dc9d9; }
#totw h4 a							{ font-size: 12px; color: #4dc9d9; }
#totw h5							{ color: #747474; }
#totw p								{ color: #bdbdbd; }
#totw .comments						{ margin-bottom: 5px; }
#totw iframe						{ margin-top: 5px; }

/* MAIN HEADING IS HIDDEN */
h1									{ text-indent: -9999px; margin-bottom: -24px; }

/* COMMENT STYLES */
.comments							{ position: absolute; font-size: 12px; display: block; padding: 3px 0px; height: 20px; width: 26px; text-align: center; font-weight: bold; line-height: 13px; }
.comments:hover						{ color: #CCC; }
#hero .comments						{ right: -2px; top: 6px; color: #313131; text-shadow: -1px -1px 0px #FFF; background: url('../images/global/comment_light.png') no-repeat left center; }
#hero .comments:hover				{ color: #7a7a7a; }
#totw .comments						{ right: 12px; top: 39px; }
.item .comments						{ left: 110px; top: 7px; color: #FFF; text-shadow: -1px -1px 0px #000; background: url('../images/global/comment_dark.png') no-repeat left center; }
.item .comments:hover				{ color: #CCC; }
.article .comments					{ right: -2px; top: -3px; color: #FFF; text-shadow: -1px -1px 0px #000; background: url('../images/global/comment_dark.png') no-repeat left center; }
.article .comments:hover			{ color: #CCC; }

.more								{ font-size: 11px; line-height: 15px; height: 15px; margin-top: 4px; color: #828282; background: url('../images/global/icon_more.png') no-repeat left center; padding: 2px 0px 2px 22px; }
.browse								{ text-align: right; font-size: 11px; line-height: 15px; height: 15px; margin-top: 4px; color: #828282; background: url('../images/global/icon_browse.png') no-repeat right center; padding: 2px 22px 2px 0px; }


/* HERO FEATURES */
#articles							{ width: 840px; margin-right: -25px; }
#articles h2						{ margin-bottom: 6px; }
.article							{ float: left; width: 255px; height: 300px; margin-right: 23px; margin-bottom: 30px; position: relative; }
.article img						{ width: 253px; height: 190px; margin: 1px 0px 2px 0px; }
.article img:hover 					{ margin: 2px 0px 1px 0px }
.article img:active					{ margin: 3px 0px 0px 0px }

/* NEWS */
#latestnews							{ margin-bottom: 20px; }
#latestnews .item, #upcomingevents .item { width: 395px; float: left; margin-right: 10px; clear: none; border-bottom: solid 1px #e2e2e2; }
#latestnews .item					{ height: 132px; overflow: hidden; padding: 10px 0px 10px 0px; }
#latestnews .item img				{ width: 132px; height: 132px; border: solid 1px #b1b1b1; }
#upcomingevents .item img 			{ width: 132px; height: 185px; border: solid 1px #b1b1b1; }
#latestnews .item img:hover, #upcomingevents .item img:hover {border-color: #d9d9d9; }
#upcomingevents .item				{ height: 185px; overflow: hidden; padding: 10px 0px 10px 0px; }
.state								{ color: #FFF; font-size: 11px !important; background: #bbbaba; font-weight: bold; padding: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -o-border-radius: 3px; }
#upcomingevents .item h4			{ color: #999; margin: 1px 0px 1px 0px; }

/* SIDEBAR STATS */
#stats								{ padding: 14px; height: 36px; border-bottom: solid 1px #505050; background: url('../images/global/sidebar_header_bg.png') repeat-x left bottom; }
#stats #memberCount					{ float: left; width: 60px; padding-left: 44px; background: url('../images/home/user_icon.png') no-repeat left top; color: #c7c7c7; font-size: 11px; }
#stats #memberCount em				{ color: #c7c7c7; font-size: 26px; font-weight: bold; font-style: normal; line-height: 26px; }
#stats #newestMembers				{ float: left; width: 160px; font-size: 11px; font-weight: bold; color: #7e7e7e; line-height: 13px; }
#stats #newestMembers a				{ color: #65c6d3; } #stats #newestMembers a:hover { color: #FFF; }