/*													*/
/* ClikThrough Site-wide Stylesheet					*/
/* Copyright (c) 2008, ClikThrough Inc				*/
/*													*/

/* GLOBAL X-BROWSER STYLESHEET NEUTRALIZER */
	html,body,div,br,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
		margin:0;
		padding:0;
		/*border-collapse:collapse;*/
	}
	table {
		border-collapse:collapse;
		border-spacing:0;
		border-style:none;
	}
	fieldset { 
		border:0;
	}
	address,caption,cite,code,dfn,em,strong,th,var {
		font-style:normal;
		font-weight:normal;
	}
	ol,ul {
		list-style:none;
	}
	caption,th {
		text-align:left;
	}
	h1,h2,h3,h4,h5,h6 {
		font-size:100%;
		font-weight:normal;
		cursor:default;
	}
	q:before,q:after {
		content:'';
	}
	abbr,acronym {border:0;
	}


/* CLIKTHROUGH SITE-WIDE STYLES */
	body {
		text-align:center;
		font:80% tahoma,arial,sans-serif; /*Verdana,"Trebuchet MS", Palatino*/
		color:#333;
		background-color:#000; /* black */
	}
	.clik-ajax {}
	.clikOrange	{ color:#f93; /* clik orange */}
	/* clik orange? f93 or F7941D or FF6600(slightly darker) */
	a, a:visited, a:active, a:hover {
		color:#f93; /* clik orange */
		outline:none;
		text-decoration:none;
	}
	/*a:hover {
		text-decoration:underline;
	}*/
	img {outline:none; border:none;}
	.clear {clear:both; height:0;}
	.floatRight {float:right}
	.floatLeft {float:left}
	.hidden {display:none}

	p {margin-bottom:20px;}

	/* GENERAL LAYOUT/POSITIONING */
	.oneColFixCtrHdr #container {
		width: 1000px;  /* target width - 20px = allows for browser scroll bars */
		margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
		text-align: left; /* this overrides the text-align: center on the body element. */
	}
	.oneColFixCtrHdr #header {
		height: 130px;
		width: 1100px;
		padding: 0;
		margin: 0 -50px -30px -50px;
	}
	.oneColFixCtrHdr #mainContainer {
		width:950px;
		margin:0 auto;
	}
	.oneColFixCtrHdr #footer {
		position:absolute;
		/*bottom:0;*/
		height:92px;
		width:1100px;
		margin:-35px -50px 0 -50px;
		padding:0;
		z-index:-1;
	}

	#preloader {
	  display: none;
	  background-image: url(../images/input-rounded-caps.png), url (../images/input-rounded-repeat.png);
	}

/* HEADER */
	#header {
		background:transparent url(../images/header-background-24bit.png) no-repeat 0 0;
		text-align:center;
	}
	#headerBox {
		width:930px;
		margin: 0 auto;
		text-align:left;
	}
	#logoLink {
		float:left;
		height:30px;
		width:200px;
	}
	
	#header a, #header a:active {
		color:#eee;
		text-decoration:none;
	}
	#header a:hover {
		color:#f93; /* clik orange */
	}
	
	.logo {
		background:transparent url(../images/logo.png) no-repeat 0 0;
		height:18px;
		width:172px;
	}

	/* Search input hide/show */
	#searchInput .inputWrapper {
		display:none;
		margin-left:35px;
		margin-top:-3px;
	}
	#searchInput:hover .navItem {display:none}
	#searchInput:hover .inputWrapper {display:inline-block}
	
	#pageMessage {
		position:absolute;
		margin-left:795px;
		margin-top:42px;
		color:#f93 /*clik orange */
	}
	
		/* User Module */
		#userModule {
			float:right;
			font-size:60%;
			margin:10px 0 0 0;
			color:#EEEEEE;
			text-transform:uppercase;
			text-align:right;
			font-weight:bold;
		}
		#userModule ul {float:right}
		#userModule .menuItem {
			padding-left:10px;
			text-align:right;
			font-size:9px;
		}
		#userModule .menuItem:hover {
			background:url(../images/arrows.png) no-repeat;
		}
		#userModule .userMenuWrapper {
			float:left;
			position:absolute;
		}
		#userMenuForgot .userMenuWrapper {margin-top:12px}
		
		#userModule .userMenuLogin {width:185px}
		#userModule .userMenuLogin .clikButton {margin-top:5px}
		
		#userModule .userMenuLogin, #userModule .userMenu {display:none}
		#userModule:hover .userMenu {display:block}
		/*#userModule:hover #userWelcome {xdisplay:none}*/
	
		.clikButton {
			background:url(../images/clik-button.png) no-repeat;
			height:32px;
			width:32px;
			display:inline-block;
			cursor:pointer;
			border:none;
			color:transparent; /*Firefox fix, hides alt txt */
		}
			
		.inputWrapper {
			position:relative;	
			width:150px;
			height:20px;
			margin-bottom:3px;
		}
		.inputWrapper .leftCap, .inputWrapper .rightCap {
			background:url(../images/input-rounded-caps.png) no-repeat top left;
			height:20px;
			width:20px;
			position:absolute;
			display:block;
			left:0;
			top:0;
		}
		.clikIcon .leftCap {background-position:0 -20px}
		.searchIcon .leftCap {background-position:0 -40px}
		.passwordIcon .leftCap {background-position:0 -60px}
		.emailIcon .leftCap {background-position:0 -80px}
		
		.inputWrapper .rightCap {
			background-position: top right;
			width:12px;
			left:auto;
			right:0;
			top:0;
		}
		.inputWrapper .inputText {
			background:url(../images/input-rounded-repeat.png) repeat-x;
			border: none;
			position:absolute;
			left:20px;
			height:16px;
			font-size:11px;
			padding-top:3px;
			width:80%;
		}
	
	/* NAVIGATION - NEW */
	#nav {
		clear:left;
		float:left;
		list-style: none;
		padding: 0;
		margin: 45px 0 0 175px;
		width:700px;
		position:absolute;
		top:0;
		/*alernate way of centering
		position:relative;
		text-align:center;
		top:50px;
		width:50%;
		*/
	}
	#nav li {float:left;}
	#nav a {
		float:left;
		height:12px;
		margin-left:60px;
		background:transparent url(../images/nav-menu.png) no-repeat 0 0;
		cursor:pointer;
	}
	#nav #videos {	width:65px;}
	#nav #videos:hover,
	.sectionVideos #nav #videos {	background-position: 0 -13px}
	#nav #products {width:80px;	background-position: -65px 0}
	#nav #products:hover, 
	.sectionProducts #nav  #products{	background-position: -65px -13px}
	#nav #artists {	width:70px;	background-position: -149px 0}
	#nav #artists:hover, 
	.sectionArtists #nav #artists {		background-position: -149px -13px}
	#nav #search {	width:68px;	background-position: -217px 0}
	#nav #search:hover,
	.sectionSearch #nav #search {	background-position:-217px -13px}
	
	
	/* subnav2 - look at optimized subnav in _experimental */
	#mainTabs2 {
		float:right;
		clear:right;
		margin-right:37px;
		margin-top:-25px;
	}
	#subnav2 li {
		float:left;
		display:block;
		height:25px;
		margin-right:-10px;
		position:relative;
		background:url(../images/tabs-long2.png) no-repeat 0 0;
		cursor:pointer;
	}
	#subnav2 a, #subnav2 .label {
		display: block; 
		float: left;
		text-decoration:none;
	}
	#subnav2 .label {
		background:url(../images/tabs-long.png) no-repeat top right;
		height:18px; /* 26px - 7px, top padding */
		margin-left:10px;
		padding:7px 40px 0 0;
		color:#DDDDDD; /*lt gray */
		text-transform:uppercase;
		font-size:8px;
		font-weight:bold;
	}
	#subnav2 .label .bullet {background-position: 0 1px}
	
	/* Artists Page Tabs */
	.tabHome {z-index:100}
	.tabInfo {z-index:90}
	.tabVideos {z-index:80}
	.tabProducts {z-index:70}
	.tabPeople {z-index:60}
	.tabPlaces {z-index:50}
	
	#subnav2 .tabHome:hover, .pageHome #subnav2 .tabHome,
	#subnav2 .tabInfo:hover, .pageInfo #subnav2 .tabInfo,
	#subnav2 .tabVideos:hover, .pageVideos #subnav2 .tabVideos,
	#subnav2 .tabProducts:hover, .pageProducts #subnav2 .tabProducts,
	#subnav2 .tabPeople:hover, .pagePeople #subnav2 .tabPeople,
	#subnav2 .tabPlaces:hover, .pagePlaces #subnav2 .tabPlaces{
		z-index:110;
		background-position: 0 -26px;
		cursor:pointer;
	}
	#subnav2 .tabHome:hover .label, .pageHome #subnav2 .tabHome .label,
	#subnav2 .tabInfo:hover .label, .pageInfo #subnav2 .tabInfo .label,
	#subnav2 .tabVideos:hover .label, .pageVideos #subnav2 .tabVideos .label,
	#subnav2 .tabProducts:hover .label, .pageProducts #subnav2 .tabProducts .label,
	#subnav2 .tabPeople:hover .label, .pagePeople #subnav2 .tabPeople .label,
	#subnav2 .tabPlaces:hover .label, .pagePlaces #subnav2 .tabPlaces .label {
		color:#f93; /* clik orange */ 
		background-position: right -26px;
		cursor:pointer;
	}
	
	/* User Profile Page Tabs */
	.tabHome {z-index:100}
	.tabInfo {z-index:90}
	.tabVideos {z-index:80}
	.tabProducts {z-index:70}
	.tabPeople {z-index:60}
	.tabPlaces {z-index:50}
	
	#subnav2 .tabHome:hover, .pageHome #subnav2 .tabHome,
	#subnav2 .tabInfo:hover, .pageInfo #subnav2 .tabInfo,
	#subnav2 .tabVideos:hover, .pageVideos #subnav2 .tabVideos,
	#subnav2 .tabProducts:hover, .pageProducts #subnav2 .tabProducts,
	#subnav2 .tabPeople:hover, .pagePeople #subnav2 .tabPeople,
	#subnav2 .tabPlaces:hover, .pagePlaces #subnav2 .tabPlaces{
		z-index:110;
		background-position: 0 -26px;
		cursor:pointer;
	}
	#subnav2 .tabHome:hover .label, .pageHome #subnav2 .tabHome .label,
	#subnav2 .tabInfo:hover .label, .pageInfo #subnav2 .tabInfo .label,
	#subnav2 .tabVideos:hover .label, .pageVideos #subnav2 .tabVideos .label,
	#subnav2 .tabProducts:hover .label, .pageProducts #subnav2 .tabProducts .label,
	#subnav2 .tabPeople:hover .label, .pagePeople #subnav2 .tabPeople .label,
	#subnav2 .tabPlaces:hover .label, .pagePlaces #subnav2 .tabPlaces .label {
		color:#f93; /* clik orange */ 
		background-position: right -26px;
		cursor:pointer;
	}


	/* MAIN CONTENT */
	#title {
		margin-left:37px;
	}
	.oneColFixCtrHdr #mainContainer {
		background:#F9F9F9 url(../images/content-background.png) repeat-x 0 -1px; /*-1 shift to compensate for border */
		border:1px solid #626262; /* drk gray */
	}
	#mainContainer .tlCorner {
		float:left;
		margin:-1px 0 0 -1px;
		width:24px;
		height:250px;
		background:transparent url(../images/content-corners-b.png) no-repeat 0 0;
	}
	#mainContainer .trCorner {
		float:right;
		margin:-1px -1px 0 0;
		width:24px;
		height:250px;
		background:transparent url(../images/content-corners-b.png) no-repeat -24px 0;
	}
	/* simple single border on content */
	#mainContainer.simpleBorder {
		background:#F9F9f9 url(../images/content-background2.png) repeat-x 0 -1px; /*-1 shift to compensate for border */
	}
	#mainContainer.simpleBorder .tlCorner, 	#mainContainer.simpleBorder .trCorner {
		width:24px;
		height:24px;
		background:transparent url(../images/content-corners2.png) no-repeat 0 0;
	}
	#mainContainer.simpleBorder .trCorner {
		background:transparent url(../images/content-corners2.png) no-repeat -24px 0;
	}
	/*.simpleBorder #mainContent {padding:10px;}*/
	
	#mainContainer .bottom {
		width:100%;	/* gives layout in IE 7 */
		clear:both;
	}
	#mainContainer .blCorner, #mainContainer .brCorner {
		float:left;
		margin:0 0 -1px -1px;
		width:24px;
		height:14px;
		background:transparent url(../images/content-corners-b.png) no-repeat 0 -300px;
	}
	#mainContainer .brCorner {
		float:right;
		margin:0 -1px -1px 0;
		background-position:-24px -300px;
	}
	#mainContent {
		padding:20px;
		padding-bottom:0;
	}
	
	/* FOOTER */
	#footer {
		color:#CCCCCC; /* lt gray */
		font-size:75%;
		background:transparent url(../images/footer-background-24bit.png) no-repeat 0 0;
	}
	#footer #footerBox {
		position: absolute;
		bottom: 0;
		width: 930px;
		margin: 0 0 5px 9em;
	}
	#footer div {
		position: relative;
	}
	#footer a, #footerBox a:visited, #footerBox a:active {
		color: #ccc; /*lt gray */
		text-decoration: none;
	}
	#footer a:hover {
		color: #f93; /* clik orange */
	}
	#copyright {
		float: left;
	}	
	#flist2 { /*ul in foot w/ links */
		list-style: none;
		padding: 0;
		margin: 0;
		float: right;
		line-height: 0.9em;
	}
	#flist2 li {
		float: left;
		border-right: 1px solid #CCCCCC; /* lt gray */
		padding: 0 15px;
	}
	#flist2 li.last {
		border: 0 none;
		padding-right: 5px;
	}

	#footer-social {border-right:0 none !important; padding:0 !important}
	#footer-social a {float:left}
	.footer-social-icons {
		background:url(../images/footer-social-icons.png) no-repeat;
		cursor:pointer;
		margin-left:8px;
		margin-top:-3px;
		height:16px;
		width:16px;
		opacity:0.6;filter:alpha(opacity=60);
	}
	.footer-social-icons:hover {
		opacity:1.0;filter:alpha(opacity=100);
	}
	.footer-rss {}
	.footer-facebook {
		background-position:0 -32px;
	}
	.footer-twitter {
		background-position:0 -16px;
	}


/* ARROWS */
	.bullet, .arrowSmallL, .arrowSmallR{
		display:inline-block;
		margin-bottom:-1px;
		width:10px;
		height:10px;
		background:transparent url(../images/arrows.png) no-repeat 0 0;
	}
 	.arrowSmallL, .arrowSmallR {
		cursor:pointer;
		background-position:0 -10px;
	}
	.arrowSmallL {
		background-position:0 -20px;
	}
	.arrowMedL, .arrowMedR {
		display:inline-block;
		width:10px;
		height:11px;
		background:transparent url(../images/arrows.png) no-repeat 0 -30px;
		cursor:pointer;
	}
	.arrowMedL {background-position: 0 -41px}
	
	.arrowLargeL, .arrowLargeR, .arrowLL, .arrowLR {
		display:inline-block;
		width:20px;
		height:30px;
		background:transparent url(../images/arrows.png) no-repeat 0 -55px;
		cursor:pointer;
	}
	.arrowLargeL {background-position: 0 -85px}
	
	/* used for stand-alone (on picture viewer and other places) */
	.arrowLL, .arrowLR {
		background:transparent url(../images/arrowsLL2.png) no-repeat left center;
	}
	.arrowLR {
		background:transparent url(../images/arrowsLR2.png) no-repeat right center;
	}
		

/* FORMS */
	.form {}
	input, select, textarea, .inputTextarea {font-family:tahoma,arial,sans-serif; font-size:12px;}
	.form td {
		vertical-align:top;
		padding-bottom:4px;
	}
	.form label {
		color:#898989;
		display:inline-block;
		width:80px;
		text-align:right;
		padding-right:10px;
		clear:both;
	}
	.form label:after {
		content: ":";
	}
	.form label.required {
		font-weight:bold;
		color:#555555;
	}
	.form .info {color:#898989;margin-left:5px}
	
	.form .error label {color:#FF0000}
	.form p, .form .msgError {
		margin:0;
		margin-top:3px;
		padding-left:18px;
		/*background:url(../images/icon_error.gif) no-repeat;*/
		color:#FF0000; /*#f93; clik orange */
		font-weight:bold;
	}
	.form .msgError {
		margin-bottom:10px;
	}
	.form .inputText {
		width:180px;
	}
	/* top shadding on inputs*/
	.form .inputText, .form .inputTextarea {
		background:#FFFFFF url(../images/input-bg-gray.gif) repeat-x scroll center top;
		border:1px solid #CCCCCC;
		color:#333;
		font-size:11px;
		padding:1px 1px 1px 3px;
	}
	.form .inputText:focus, .form .inputTextarea:focus {
		background:#F4FBFD url(../images/input-bg-blue.gif) repeat-x scroll center top;
		border:1px solid #96CEE3;
		color:#000;
	}

	.form .example {
		color:#999;
		font-style:italic;
	}
	/* CUSTOM - Signup form */
	.form #passconf {
		margin-bottom: 5px;
	}
	.form #bdayM, .form #bdayD, .form #bdayY {
		width:2em;
	}
	.form #bdayY {
		width:3em;
	}
	.form #phone1, .form #phone2, .form #phone3 {
		width:2em;
	}
	.form #phone3 {
		width:3em;
	}
	
/* MAIN CONTENT */
	#mainTabs {
		float:right;
		margin-right:30px;
		margin-top:-30px;
		height:30px;
		cursor:pointer;
	}
	
	/*DEBUG
	.pageArtists #mainTabs {
		width:490px;
		background:transparent url(../images/tabs-artist.png) no-repeat 0 0;
	}
	 
	.pageArtists #mainTabs3 {
		float:right;
		clear:right;
		padding-right:25px;
		width:490px;
		height:25px;
		background:transparent url(../images/tabs-artist2.png) no-repeat 0 0;
	}
	.pageArtists #mainTabs3:hover {
		background-position:0 -26px;
	}

	.pageMyaccount #mainTabs {
		width:350px;
		background:transparent url(../images/tabs-myaccount.png) no-repeat 0 0;
	}*/
	
	/* TEXT EFFECTS */
	h1, h2, .billboardPanel .billboardMsg {
		font-family:Arial, Helvetica, sans-serif;
		font-size:250%;
		font-weight:normal;
		color:#F7941D; /* clik orange */
		margin-bottom:10px;
		/*font-variant:small-caps;*/
		word-spacing:-0.05em;
		letter-spacing:-0.05em;
		text-decoration:none;
	}
	h1 {
		margin-left:30px;
	}
	h2 {
		font-size:160%;
		margin-bottom:5px;
	}
	
	/* image title replacement */
	.dynamicTitle { /* dynamic font renderer */
		margin:0 0 5px 35px
	}
	.h1ImgUser {
		background-image:url(../images/h1-user.png);
		background-repeat:no-repeat;
		color:transparent;
		height:35px;
	}
	h1.titleMyAccount {		background-position: 0 0}
	h1.titleMyWishlist {	background-position: 0 -40px}
	h1.titleMyFavorites {	background-position: 0 -80px}
	h1.titleInviteFriends {	background-position: 0 -120px}
	h1.titleCompleteProfile {background-position: 0 -160px}
	
	.h2Img, .h2Big {
		background-image:url(../images/h2-titles.png);
		background-repeat:no-repeat;
		color:transparent;
		height:15px;
	}
	h2.titleTopProducts {	background-position: 0 0}
	h2.titleTopVideos {		background-position: 0 -15px}
	h2.titleComments {		background-position: 0 -30px}
	h2.titleNews {			background-position: 0 -45px}
	h2.titleFunFacts {		background-position: 0 -60px}
	h2.titleBio {			background-position: 0 -75px}
	h2.titleUpcomingShows {	background-position: 0 -90px}
	h2.titleAlbums {		background-position: 0 -105px}
	h2.titleContacts {		background-position: 0 -120px}
	h2.titleClik2Buy {		background-position: 0 -135px}
	h2.titleEmailaFriend {	background-position: 0 -150px}
	
	.h2Big {height:25px}
	h2.titleVideos {		background-position: 0 -185px; width:80px} /*165 */
	h2.titleProducts {		background-position: 0 -210px; width:100px}
	h2.titlePeople {		background-position: 0 -235px; width:80px}
	h2.titlePlaces {		background-position: 0 -260px; width:75px}
	h2.titleBrands {		background-position: 0 -285px; width:80px}
	h2.titleArtists {		background-position: 0 -310px; width:75px}
	
	
	.label {
		color:#F7941D; /* clik orange */
			/* clik orange? f93 or F7941D (slightly darker) */
		font-weight:bold;
	}
	
	
	/* PANEL OBJECTS */
	.panel {
		margin-bottom:20px;
	}
	.panel .panelBack {
		/*position:absolute;
		height:425px;
		width:170px; /* subtract 2x15px padding */
		margin:10px 0; /*compensates for rounded corners */
		padding:10px;
		border:1px solid #CCC;
		background:url(../images/transparent-pixel-lite.png) repeat;
		
		position:relative;
		border-radius:7px;
		-moz-border-radius:7px;
		-webkit-border-radius:7px;
	}
	.panel h2 {
		margin-left:10px;
		margin-bottom:10px;
		/*text-transform:uppercase;*/
	}
	.panel .buttons {margin-top:5px}
	
	.panelNarrow { /* 4 column layout */
		width:200px;
		height:425px;
	}
	.panelNarrow .panelBack, 
	.panelNarrow .panelBack .autoPadDiv {
		height:400px;
	}
	/* PanelWide (used with rounded corner js */
	.panelWide {
		height:400px;
		width:425px;
	}
	.panelWide .panelBack {
		height:350px;
	}
	/* PanelWide2 (uses clear png for background) */
	/* used on comments panels */
	.panelWide2 {
		height:250px;
		width:425px;
	}
	/*#mainContent .panelWide .panelBack .autoPadDiv {overflow:hidden}*/
	.panelWide2 .panelBack2 {
		height:240px;
		overflow:hidden;
		background-image:url(../images/panel-wide2.png);
		background-repeat:no-repeat;
		border:none;
		margin:10px 0; /*compensates for rounded corners */
		padding:10px;
	}
	.panelWide2 .scrollControls {
		position:relative;
		float:right;
	}
	
	/* used on all details pages */
	#rightPanel {
		float:right;
	}
	
	/* Scroll Views */
	.scrollViewport {
		position:relative;
		overflow:hidden;
		height:90%;
	}
	.scrollContainer {
		position:relative;
	}
	.scrollControls {
		position:absolute;
		bottom:10px;
		right:10px;
		height:30px;
		width:20px;
		margin-bottom:-5px;
	}
	.scrollControls .up, .scrollControls .down {
		height:15px;
		background:transparent url(../images/panel-controls.png) no-repeat 0 0;
	}
	.scrollControls .down {
		background-position: 0 -15px;
	}
	
	/* PANEL TEXT DECORATION */
		.album, .event, .news, .funFact, .comment {
			font-size:85%;
			/* make an hr below each event item (using border) */
			border-bottom:1px solid #888;
			padding-bottom:5px;
			margin-bottom:5px;
		}
		.album .title, .event .date, .news .title, .funFact .title, .comment .title,
		.album .link, .event .link, .news .link, .funFact .link, .comment .link {
			color:#f93; /* clik orange */
		}
		.album .title, .event .date, .news .title, .funFact .title, .comment .title {
			font-weight:bold;
		}
		.album .attrib, .event .attrib, .news .attrib, .funFacts .attrib, .comment .link  {
			color:#333; /* drk gray */
		}
		/* module specific styles */
		.comment .rating {float:right;}
		.comment .body {margin-left:60px;}
		.comment .count {margin:0 1px;}
		
		.album .image, .comment .image {float:left; margin-right:10px; width:50px; height:50px}
		.album .albumImg {width:50px;height:50px;} /* .comment .image img */

	/* RIGHT PANEL - P3 in Artists/Companies */
		#rightPanel .inputText {width:99%}
		#rightPanel #emailMsg {width:99%;height:150px}

/* ARTIST PAGE */
	.pageArtistsHome .counter {
		color:#555555;
		float:right;
		/*margin-top:-32px; - removed h2 in artists home */
	}
	
	.topList {
		float:left;
		width:200px;
		margin-right:10px;
	}
	.pageArtists #mainContainer {
		background:#f9f9f9 url(../images/artists/thescript-background.jpg) no-repeat right 20px;
	}
	.pageArtists #mainContent, .pageCompanies #mainContent { /*transparent overlay over background image */
		background:transparent url(../images/content-background-trans.png) repeat-x 0 -30px;
		/*min-height:580px;  THIS IS CRAZY - CAUSES PADDING BUGS IN IE !!!! */
	}
	
	/* Artist Info Page */
	.panelEvents, .panelAlbums {float:right}
	.panelAlbums {margin:0 20px}
	
	/* Module Comments */
	.commentEmpty {height:35px}
	.commentEmpty .image {
		background-image: url(../images/favicon.png);
		height:32px;
		width:32px;
	}
	#commentsContainer {height:215px; position:relative}
	#commentsBox a {text-decoration:none}
	#commentMessage {height:215px; width:99%}
	
/* DELETE */
	.pageArtists #commentsBox {/*height:280px; margin-bottom:0*/}
	.pageArtists #commentsBox .panelBack {/*height:230px*/}
	
	.pageHome #commentsBox {
		height:370px; /* was 345px w/ js box */
		float:left;
		width:50%;
		width:425px
	}
	.pageHome .spacer {height:100px} /* add margin above comments module */
	.pageHome #commentsContainer {height:290px}
	.pageHome #commentsBox #commentMessage {height:290px !important} /*override in-line style */
	

/* PRODUCT PAGE */
	.pageControls {
		float:right;
		margin: 20px 0 10px 0; /*DEBUG: the 10px bottom border needs to be FF only */
	}
	
	.productBox {
		float:left;
		width:99%; /* hacked for IE */
		/*margin: 0 -10px 0 5px; using new full width*/
		padding-left:11px; /* just when free standing */
	}
	.detailSection .productBox {width:101%; background:none; padding-left:0;}
	
	.productBox h2 {float:left;}
	.productBox .counter, .productBox2 .counter {
		color:#959595;
		font-size:80%;
		margin-top:5px;
		margin-right:15px;
		/* adds border under productBox title (h2) */
		border-bottom: 1px solid #888;
		padding-bottom:5px;
	}
	.productBox .categoryFilter {
		float:right;
		margin-top:-23px;
		margin-right:18px;
	}
	
	/* GENERIC CLIK COMPONENT BOX  - This is the magic */
	.product {
		float:left;
		height:87px;
		width:166px; /* minus 10px to compensate for 5px padding */
		margin:0 13px 13px 0;
		/*padding: 10px;*/
		background:transparent url(../images/image-background.png) no-repeat 0 0;
		color:#FFFFFF; /* white */
		text-align:center;
	}
	.product:hover {
		color:#FFFFFF; /* white */
	}
	.product .title, .product .title .white {
		font-weight:bold;
		color:#FFFFFF; /* white */
	}
	.product .title .t1 {
		color:#f93; /* clik orange */
	}
	.product .attr {
		color:#FFFFFF; /* white */
	}
	.product img {
		max-height:85px;
		margin-top:1px;
	}
	.product .label { /* used for remove wishlist */
		font-size:9px;
	}
	.product .controls {
		position:absolute;
		bottom:10px;
		right:10px;
	}
	/* to allow panel 2 to "float" over panel1 and image you have to use position:absolute for IE (ff doesn't care), 
	yet panel 1 has to be position relative (IE) to get the image to center.  I also had to add positioning (dimensions)
	to panel 1 to get the center to work 
	Additional Note: display has been changed to table-cell to support vertical-align:middle */
	.product .panel1 {display:table-cell; text-align:center; vertical-align:middle; height:87px; width:166px; position:relative}
	.product .panel2 {display:none; padding:10px; height:69px; position:relative;
		text-align:left;
		background:transparent url(../images/image-background.png) no-repeat 0 -87px}
	.product:hover .panel1 {cursor:pointer; position:absolute} /* diplay:none; */
	.product:hover .panel2 {display:block; cursor:pointer}
	/*.product a, .product a:active, .product a:hover{text-decoration:none}*/
	
	/* customizations for peopleBoxs */
	.product {margin-bottom:40px}
	.product .title2 {display:block; text-align:left; font-weight:bold}
	.product:hover .title2 {margin-top:2px}
	
	.brandsBox .product .title2, .realProductBox .product .title2 {display:none}
	.brandsBox .product, .realProductBox .product {margin-bottom:13px}
	
	.noImgBox .panel1 {display:none}
	.noImgBox .panel2 {display:block}
	
/* SEARCH RESULTS PAGE */
	.searchHeader {
		float:left;
		margin-bottom:20px;
		margin-left:7px;
		color:#555555;
	}
	.searchHeader .hl, .pageArtistsHome .counter { /*hl - highlight */
		color:#ffffff;
	}
	.searchHeader .icon {
		margin-left:10px;
	}
	.searchHeader a.objFilter {text-decoration:none; color:#666666}
	
/* VIDEO DETAIL PAGE (GENERNAL detailBox) */
	.pageVideoDetails #commentsBox {height:250px}
	.pageVideoDetails #commentsBox .panelBack {height:200px}
	
	.detailSection {
		clear:both;
		padding:15px 15px 15px;
		margin:-5px -5px 20px;
		border:1px solid #dddddd;
		background:transparent url(../images/content-background-trans.png) 0 -300px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
	}
	.pageVideosHome .categoryFilter {
		float:right;
		/* margin-top:-32px; note- removed h2 from page */
	}
	.pageVideosHome .detailSection {
		padding-right:0;
		padding-left:17px;
	}
	
	/*#detailBox {}
	.videoDetail {}*/
	.videoDetail .video {width:220px}
	.videoDetail .attributes {width:220px}
	.videoDetail .description .scrollControls {
		right:-15px !important;
	}
	.videoDetail .description {
		max-height:170px;
		position:relative;
	}
	.videoDetail .description .container  {
		max-height:170px;
		overflow:hidden;
		position:relative;
	}
	.videoDetail .video .thumbnail {
		width:200px;
		height:200px;
		position:relative;
		display:inline-block;
	}
	.videoDetail .video .thumbnail img {
		max-width:200px;
	}
	.videoDetail-real .thumbnail {height:auto !important;}
	
	.thumbnail .clikStart {
		background:url(../images/video-play-icon.png) no-repeat 0 0;
		height:50px;
		width:50px;
		_display:none;
		position:absolute;
		top:30%;
		left:75px;
		z-index:10;
	}
	.thumbnail:hover .clikStart {
		background:url(../images/video-start.png) no-repeat 0 0;
		height:40px;
		width:160px;
		position:absolute;
		top:40%;
		left:20px;
		z-index:10;
		cursor:pointer;
		display:block;
	}
	.btnPlayVideo {
		background:url(../images/btn-play-video.png) no-repeat 0 0;
		height:26px;
		width:130px;
		float:left;
		margin:10px 20px 0 0;
	}
	
	/* videoBox */
	.videoBox {position:relative}
	.videoBox .playIcon {
		background:url(../images/video-play-icon-sm.png) no-repeat 0 0;
		height:25px;
		width:25px;
		position:absolute;
		bottom:10px;
		right:15px;
		z-index:10;
		/*-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
		filter: alpha(opacity=70);
		opacity: .7;
		-moz-opacity:.7;*/
	}
	.videoBox:hover .playIcon {display:none}
	
	.videoDetail .video .title {
		clear:both;
	}
	.videoDetail .video .company {
		color:#959595;
		margin-top:5px;
	}
	.videoDetail .attrib {
		color: #777777;/*#ffffff;*/
		margin-bottom:10px;
		clear:left;
	}
	.videoDetail .buy .label {
		vertical-align:top
	}
	.videoDetail .ratingBox {
		margin:10px 0 0 0;
	}
	
	/* video thumbnail album flipper controls */
	.video .thumbnail .absolute {position:absolute}
	.video .thumbnail .arrowLL {
		top:0;
		left:-12px;
	}
	.video .thumbnail .arrowLR {
		top:0;
		right:-12px;
	}
	.video .thumbnail .arrowLL, 
	.video .thumbnail .arrowLR {
		cursor:pointer;
		height:99%;
		/*opacity:0.2;filter:alpha(opacity=20);-moz-opacity:0.2;*/
		position:absolute;
		width:25%;
		z-index:10;
	}
	/* IE Bug - causes entire page rendering problems
	.video .thumbnail .arrowLL:hover, .video .thumbnail .arrowLR:hover {
		opacity:0.9;filter:alpha(opacity=90);-moz-opacity:0.9;
	}*/
	
	/* TODO - Hack... need to find a way to deal with absolute position of thumbnail viewer */
	.productDetail .thumbnail, 
	.peopleDetail .thumbnail, 
	.placeDetail .thumbnail {
		height:200px;
	}
	.videoDetail, .productDetail, 
	.peopleDetail, .placeDetail {
		margin-bottom:15px;
	}
	
	/* Related Videos Section */ 
	.detailSection .relatedVideosTitle {
		margin: -15px 0 5px;
		/*color:#F7941D;
		font-weight:bold;*/
	}

	
	/* Product Affiliates */
/* Deprecated 1.1 2009-03-11 - we disabled lists of affiliates
	.affiliate {
		text-align:center;
	}
	.affiliate .item {
		height:30px;
		width:292px;
		padding-top:1px;
		background:transparent url(../images/affiliateItem.png) no-repeat 0 0;
		margin:5px auto;
		color:#FFFFFF;
		font-size:22px;
	}
	.affiliate .item:hover {
		background-position:0 -31px;
	}*/
	
/* PRODUCT PAGE */
	.pageProducts .searchHeader { /* actually affects Brands page */
		font-size:90%;
	}
	
/* BRANDS PAGE */
.brandsBox .counter {
	color:#FFFFFF;
	float:right;
	font-size:90%;
	margin-top:-35px;
	position:relative;
	right:20px;
	border-style:none;
}

/* SIGNUP PAGES */
	.pageSignup {}
	.pageSignup .column1 {
		float:left;
		display:inline-block;
		width:450px;
		margin-left:-23px;
	}
	.pageSignup .column2 {
		float:right;
		display:inline-block;
		width:450px;
	}
	#formCaptcha label {
		width:200px;
		text-align:left;
	}
	.signup2-text {
		height:100px;
		width:906px;
		background: transparent url(../images/signup2-text.png) 0 0;
	}
	 
/* HOMEPAGE */
	.pageHomepage {}
	.pageHomepage #mainContainer, .pageHomepage #mainContent {
		padding:0;
		background:none;
		border:none;
	}
	.pageHomepage .tlCorner, .pageHomepage .trCorner, .pageHomepage .bCorners {
		display:none
	}
	
	#moduleBar {
		margin:0 auto 20px;
		width:925px;
	}
	.module { /* add reflection */
		background:  url(../images/homepage/_reflection.jpg) bottom center no-repeat;
		margin-left:10px;
		height:346px;
		width:301px;
		float:left;
		display:block;
	}
	.module > img {
		height:260px;
		width:301px;
	}
	.module.first {
		margin-left:0;
	}
	.pageHomepage #header {
		margin-bottom:-59px;
	}
	.pageHomepage #footer { /* bring the footer glow above the reflection */
		z-index:10;
	}
	
	/* Component - Billboard (Scroll Container) */
		#billboard {
			width:935px;
			height:440px;
		}
		.billboard {
			margin:0 auto;
		}
		.scrollViewport {
			overflow:hidden;
			position:relative; /*needed for IE 7 */
		}
		.scrollContainer {}
		.scrollHorizontal {
			position:relative;
			width:30000px;
			top:0;
		}
		.scrollViewport .scrollHorizontal > div {float:left}
		
		/* billboard controls */
		.billboard > .controls {
			position:relative;
			top:42%;
			/*z-index:10;
			width:100%;*/
		}
		.billboard .controls .left, .billboard  .controls .right {
			position:absolute;
			cursor:pointer;
			margin-left:-30px;
		}
		.billboard .controls .right {
			right:0;
			margin-right:-30px;
		}
		
		.billboardPanel {
			/*display:block;*/
			width:935px;
			float:left;
			overflow:hidden;
		}
		.billboardPanel .billboardMsg {
			float:left;
			font-size:210%;
			margin-left:20px;
			width:320px;
		}
		.billboardPanel a:hover {text-decoration:none} /*Safarii 3 fix */
		.billboardPanel img {float:left}
		.billboardPanel img.artistBillboard {
			width:587px;
			height:324px;
		}
		/* homepage */
		.pageHomepage .billboard {margin-top:15px}
		#billboardContainer img.standard {
			width:935px;
			height:392px;
			margin-right:-4px;
		}
		
		/* artist pages */
		#billboardVideos {height:100px; margin-left:3px}
		#billboardVideos .controls {top:25%}
		#billboardVideos .controls .left{margin-left:-20px}
		#billboardVideos .controls .right{margin-right:-15px}
		
		
/* Theater - Splash */
	.pageTheaterSplash #footer {
		bottom:0;
	}
	.pageTheaterSplash #splashContainer {
		text-align:center;
		margin-top:100px;
	}

/* OVERLAY/POPUP */
	#overlayBase {
		z-index:200;
		background-color:#000;
		position:absolute;
		top:0;
		left:0;
		width:120%;
		height:2600px;
		opacity:0.7;filter:alpha(opacity=70);-moz-opacity:0.7;
	display:none;
		text-align:center;
	}
	#overlay {
		z-index:201;
		position:absolute;
		top:0;
		left:0;
	display:none;
		width:102%;
	}
	#overlay #signup {
		width:682px;
		height:300px;
		margin:130px auto;
		text-align:left;
	}
	#signup h1 {margin-left:10px}
	#signup .contentBox {
		padding:15px;
		height:290px;
		background:#ffffff url(../images/content-background2.png) 0 -40px;
		border:1px solid #000;
		border-radius:5px;
		-moz-border-radius:5px;
		-webkit-border-radius:5px;
	}
	#signup .contentBox .iconClose {
		float:right; cursor:pointer; margin-top:-15px; margin-right:-15px
	}
	#signup .column1 .contentBox, #signup .column2 .contentBox {
		background:none;
		height:230px;
		border:1px solid #777;
	}
	#signup .column1, #signup .column2 {float:left}
	#signup .column1 {width:450px;margin-left:0;margin-right:15px}
	#signup .column2 {width:185px}
	#signup .column2 .btnSubmit {float:right}
	#signup .column2 .userIcon {margin-left:0;margin-top:15px;width:150px}
	#signup .column1 #formCaptcha {margin-top:5px}
	

/* COMPONENTS */

	/* COMPONENT - Ratings */
	.ratingBox {
		display:block;
		height:15px;
	}
	.ratingBox .label {
		font-weight:bold;
	}
	.ratingBox div {
		float:left;
	}	
	.ratingBox .stars {
		height:15px;
		width:90px;
		background:transparent url(../images/rating-stars.png) no-repeat 0 0;
		cursor:pointer;
	}
	.ratingBox .starsSelected {
		background:transparent url(../images/rating-stars.png) no-repeat 0 -15px;
		cursor:pointer;
		height:15px;
	}
	
	.ratingBox .text {
		color:#959595;
		font-size:11px;
	}
	
	/* COMPONENT - Icons */
	.icon {
		height:20px;
		width:20px;
		display:inline-block;
		background:transparent url(../images/icons.png) no-repeat 0 0;
		margin-bottom:-5px;
	}
	.iconVideo		{background-position: 0 0}
	.iconProduct 	{background-position: 0 -20px}
	.iconPerson 	{background-position: 0 -40px}
	.iconWishlist 	{background-position: 0 -60px}
	.iconEmail 		{background-position: 0 -80px}
	.iconComment 	{background-position: 0 -100px}
	.iconBuy 		{background-position: 0 -120px}
	.iconSimilar	{background-position: 0 -140px}
	.iconThumbUp, .iconThumbUp2		{background-position: 0 -160px}
	.iconThumbDown, .iconThumbDown2	{background-position: 0 -180px}
	.iconPlaces		{background-position: 0 -200px}
	.iconClose		{background-position: 0 -220px}
	.iconFlag		{background-position: 0 -240px}
	.iconClik		{background-position: 0 -260px}
	.iconSearch		{background-position: 0 -280px}
	.iconTrash		{background-position: 0 -300px}
	.iconFavorite	{background-position: 0 -320px}
	.iconShare		{background-position: 0 -340px}
	.iconEmbed		{background-position: 0 -360px}
	
	a:hover .iconVideo, .iconVideo-sel		{background-position: -20px 0}
	a:hover .iconProduct, .iconProduct-sel	{background-position: -20px -20px}
	a:hover .iconPerson, .iconPerson-sel 	{background-position: -20px -40px}
	a:hover .iconWishlist  	{background-position: -20px -60px}
	a:hover .iconEmail 		{background-position: -20px -80px}
	a:hover .iconComment	{background-position: -20px -100px}
	a:hover .iconBuy 		{background-position: -20px -120px}
	.iconSimilar:hover		{background-position: -20px -140px}
	.iconThumbUp:hover, .iconThumbUp-sel 	{background-position: -20px -160px; cursor:pointer}
	.iconThumbDown:hover,.iconThumbDown-sel	{background-position: -20px -180px; cursor:pointer}
	a:hover .iconPlaces, .iconPlaces-sel	{background-position: -20px -200px; cursor:pointer}
	a:hover .iconFlag, .iconFlag-sel		{background-position: -20px -240px; cursor:pointer}
	a:hover .iconSearch, .iconSearch-sel	{background-position: -20px -280px; cursor:pointer}
	a:hover .iconTrash, .iconTrash-sel		{background-position: -20px -300px; cursor:pointer}
	a:hover .iconFavorite, .iconFavorite-sel{background-position: -20px -320px; cursor:pointer}
	a:hover .iconShare, .iconShare-sel		{background-position: -20px -340px; cursor:pointer}
	a:hover .iconEmbed, .iconEmbed-sel		{background-position: -20px -360px; cursor:pointer}
	
	/* IE fix - cursor must be specified on hover above */
	.iconThumbUp-sel, .iconThumbDown-sel, .iconFlag-sel, .iconVideo-sel, .iconProduct-sel, .iconPerson-sel	 {cursor:default}
	
	
	/* COMPONENT - Music Icons */
	.iconMusic {
		height:25px;
		width:25px;
		display:inline-block;
		background:transparent url(../images/icons-music.png) no-repeat 0 0;
	}
	.iconItunes 	{background-position: 0 0}
	.iconAmazon		{background-position: 0 -25px}
	.iconZune		{background-position: 0 -50px}
	
	.iconItunes:hover 	{background-position: -25px 0}
	.iconAmazon:hover	{background-position: -25px -25px}
	.iconZune:hover		{background-position: -25px -50px}
	
	/* COMPONENT - status icons */
	.iconStatus {
		height:16px;
		width:16px;
		background:transparent url(../images/icon-status.png) no-repeat 0 0;
		text-indent:20px;
	}
	.iconStatus.warning {background-position:0 -16px}
	.iconStatus.good {background-position:0 -32px}
	.iconStatus.info {background-position:0 -48px}
	
	/* COMPONENT - Buttons */
	.button {
		height:20px; /* should be 20px but padding removes it */
		width:80px;
		display:inline-block;
		background:transparent url(../images/buttons.png) no-repeat 0 0;
		cursor:pointer;
		border:none;
		text-indent:200px;
	}
	.btnBrowse			{width:80px; background-position: 0 0}
	.btnBrowse:hover	{background-position:-150px 0}
	.btnSubmit 			{width:80px; background-position: 0 -20px}
	.btnSubmit:hover	{background-position: -150px -20px}
	.btnSave	 		{width:113px; background-position: 0 -40px}
	.btnSave:hover		{background-position: -150px -40px}
	.btnUpdate	 		{width:129px; background-position: 0 -60px}
	.btnUpdate:hover	{background-position: -150px -60px}
	.btnSendInvite		{width:121px; background-position: 0 -80px}
	.btnSendInvite:hover{background-position: -150px -80px}
	.btnAddComment 		{width:121px; background-position: 0 -100px}
	.btnAddComment:hover{background-position: -150px -100px}
	.btnCancel			{width:80px; background-position: 0 -120px}
	.btnCancel:hover	{background-position:-150px -120px}
	
	.btnAddComment .label {color:transparent} /* hides text label, so it's exposed for iphone */
	
	/* COMPONENT - Toplist (Table Implementation) */
	.topListTbl {
		color:#ffffff !important;
		font-size:85%;
		width:100%;
	}
	.topListTbl th, .topListTbl td {
		border-bottom: 1px solid #555555;
		padding: 5px 0;
	}
	.topListTbl th {
		text-align:right;
		vertical-align:top;
		width:1em; /* width of a character*/
		padding-right:.5em;
	}
	.topListTbl td {
		color:#555555 !important; /* drk gray */
		vertical-align:top;
	}
	.topListTbl .label {
		color:#ffffff;
	}
	.topList a, .topList a:active, .topList a:visited {
		color:#555555;
		text-decoration:none;
	}
	.topList a:hover {
		color:#ffffff; /* clik orange #f93*/
	}
	
	/* COMPONENT - Select Rounded Corner Replacement */
		select.replaced {display:none}
		ul.selectRounded {
			/*margin: 0;
			padding: 0;*/
			height: 1.35em;
			width: 150px;
			border:1px solid #AAA;
			-moz-border-radius:10px;
			z-index:10;
			position:relative;
		}
		ul.selectRounded li {
			/*background: #cf5a5a;
			list-style: none;
			margin: 0;*/
			color: #000;
			cursor: pointer;
			display: none;
			font-size: 11px;
			line-height: 1.5em;
			margin-left: 7px;
			padding: 1px 5px;
			width: 84%;
		}
		ul.selectRounded li.selected {
			color: #000;
			display: block;
		}
		ul.selectOpen li {
			display: block;
		}
		ul.selectOpen li.selected {
			background: #f93;
		}
		ul.selectOpen li:hover,
		ul.selectOpen li.selected:hover {
			background: #f93;
			color: #fff;
		}
		/*	IE only styles?
			ul.selectReplacement:hover li,
			ul.selectOpen li {
				display: block;
			}
			ul.selectReplacement li.selected {
				color: #fff;
				display: block;
			}
			ul.selectReplacement:hover li.selected,
			ul.selectOpen li.selected {
				background: #9e0000;
				display: block;
			}
			ul.selectReplacement li:hover,
			ul.selectReplacement li.selectOpen,
			ul.selectReplacement li.selected:hover {
				background: #9e0000;
				color: #fff;
				cursor: pointer;
			}
		*/
	
/*@media screen and (-webkit-min-device-pixel-ratio:0) {*/
	/* Safari 3.0 and Chrome rules here */

	/* todo: this needs to be targeted at safari 3 only */
	/* remove text-shadow from bold fonts 
	#userModule, #subnav2 .label, .label,
	.album .title, .event .date, .news .title, .funFact .title, .comment .title { 
		text-shadow:#000000 0 0 0;
	}
}*/