/*... colors ...
#C4BEC9 - light purple
#9D94A7 - medium purple
#574E5F - dark purple    */

@import url("tools.css");
@import url("typo.css");

body {
	background-color: #FFFFFF;
	color:white;
	margin: 0px;
    text-align: center; 
	background:url(/images/bg_white_new.gif);background-repeat:repeat-y;background-position:center 0px;
	}

table {
	color: white;
	/*font-size: 17px; - control basic fontsize in typo.css */ }

.signup .textbox {
	width: 300px; }

#bodycontainer {
	background-image: url(/images/bodybg.jpg);
	background-repeat: repeat-x;
	background-color: #BEBEBE;
	width: 1000px;
	margin: 0 auto;
	text-align: left; }
	
	#sizeacontainer {
	background-image: url(/images/bodybg.jpg);
	background-repeat: repeat-x;
	background-color: #BEBEBE;
	width: 1000px;
	margin: 0 auto;
	text-align: left; }

#header {
	background-image: url(/images/headerbg.jpg);
	background-repeat: repeat-x;
	background-position: bottom left;
	height: 157px;
	position: relative;
	top: 0px;
	overflow: auto;}

#headerlogo {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 10;}

#collage {
	position: absolute;
	top: 0px;
	right: 0px;}

#header a,
#header a:active,
#header a:link,
#header a:visited {
	color: #FFFFFF;
	background:transparent;
	text-decoration:none;}

#header a:hover {
	color:orange;
	text-decoration:underline; }

#headerNav {
	position: absolute;
	top: 10px;
	right: 15px;
	font-size:1.1em; }
	
#headerNav ul {
	padding-left: 0;
	display: inline; }

#headerNav ul li {
	padding: 0px 5px 0px 8px;
	margin:0;
	border-left: 1px solid #FFFFFF;
	list-style: none;
	display: inline; }
		
#headerNav ul li.first {
	border-left: none;
	list-style: none;
	display: inline; }

/* shoping cart content */
#shopHeaderNav {
	position: absolute;
	top: 22px;
	right:5px;
	font-size:1.0em;
	padding:1px 4px;
	border:1px solid #999999;
	font-weight:bold;
	white-space:nowrap; }
/**/	

#headersearch {
	position: absolute;
	top: 60px;
	right: 15px; }

#headerbuttons {
	position: absolute;
	width: 100%;
	height: 32px;
	left: 0px;
	top: 108px;
	background-image: url(/images/buttonbg.jpg);
	background-repeat: repeat-x;
	background-position: bottom left;
	line-height: 1;
	font-size: 1.25em; }

#headerbuttons ul {
	list-style: none;
	float: right;
	padding: 0;
	margin: 0; }

#headerbuttons li {
	float: left;
	margin:0;
	padding: 0 25px 0 3px;
	color: white;
	background: url(/images/buttonsep.jpg) no-repeat right bottom;
	height: 32px; }

#headerbuttons a {
	text-decoration: none;
    color: white;
	background:none;
    position: relative;
    top: 5px; }

#headerbuttons a:hover {
	text-decoration: underline; }

#searchbutton {
	position: relative;
	top: 6px;
	left: 4px; }

#mainbody {
	position: relative;
	background-image: url(/images/mainbodyheader.jpg);
	background-repeat: repeat-x;
	top: 0px;
	/*overflow: auto;*/
	overflow: hidden;
	width: 100%; }
	
	
#sabody {
	position: relative;
	background-color:#C0C0C0;
	top: 0px;
	/*overflow: auto;*/
	overflow: hidden;
	width: 100%; 
	height:5000px;
	}

/*... 3 Column Grid - as on Home Page .................*/
#homeColumns {
	overflow:hidden;	
	margin-bottom:90px;
	display:block; }

#leftcolumn {
	float: left;
	width: 265px;
	overflow: auto; }

#rightcolumn {
	float: left;
	width: 270px;
	overflow: auto; }

#dividercolumn {
	float: left;
	margin-top: 40px;
	background-image: url(/images/divider.png);
	background-repeat: no-repeat;
	width: 23px;
	height: 400px; }

#homeColumns #centercolumn {
	float: left;
	margin: 0px 0px 10px 0px;
	overflow: auto;
	min-height: 200px;
	width: 425px; }

#centercolumn {
	float: left;
	margin: 10px 0px 50px 0px;
	overflow: auto;
	min-height: 200px;
	width: 425px; }

/*... One column full width page .....................*/
#singlecolumn {
	margin-bottom: 50px;
	overflow: auto;
	min-height: 200px; }

#singleTitle {
	float:left; 
	padding: 14px 0px 0px 50px;
	font-size: 17px; 
	color: white; }


/*... General Page Layout ......................*/
#expandedcolumn {
	margin: 0px 20px 110px 25px;
	/*overflow: auto;
	min-height: 200px;*/ }
	
#sacolumn {
	background-color:#ffffff;
	margin: 0px 20px 110px 25px;
	/*overflow: auto;
	min-height: 200px;*/ }

	
	
#centerdiv {
	color:#CCCCCC;
	padding: 20px 20px;
	background: #000000;
	/* overflow: auto;*/
}


#centerdiv p {
	margin-top: 0;
}

#centerdiv a,
#centerdiv a:active,
#centerdiv a:link {
	color: #9999FF;
	/*background: #000000;*/ }

#centerdiv a:visited {
	color: #CCCCFF; }

#centerdiv a:hover {
	color: #orange; }

#legaldiv {
	color: white;
	padding: 20px 20px 20px 20px;
	background: #000000; }

#legaldiv a,
#legaldiv a:active,
#legaldiv a:link {
	color: #FFFF99;
	background: #000000; }

#legaldiv a:visited {
	color: #FFFFCC;
	background: #000000; }

#legaldiv a:hover {
	color: #FFCCCC;
	background: #000000; }

#legaldiv p {
	margin: 20px 10px 0 10px; }

#legaldiv ul li {
	margin: 20px 10px 0 10px;
	list-style:none; }

#legaldiv ul li ul li {
	margin: 20px 10px 0 50px;
	list-style: none; }

body.signup div.colThirds {
	width:30%;
	margin:0;
	padding:0 1px;
	float:left;
	overflow:hidden;
	border-left:1px solid #BEBEBE;
}

/*... Home Page Boxes / Sidebar Boxes............*/

/*... Login Form box ...*/

#login {
	background-image: url(/images/leftbg.jpg);
	background-repeat: repeat-x;
	font-size: 15px;
	height: 126px;
	padding-left: 10px;
	padding-top: 20px; }

#login .submit {
	color: #fff;
	background-image: url(/images/button.gif);
	border: none;
	width: 83px;
	height: 27px; }

#login table {
	font-size: 14px; }

#login table td {
	padding:2px 0; }

#login table td a,
#login table td a:active,
#login table td a:link,
#login table td a:visited {
 	font-size:.8em;
	color:#FFFFFF;
	background:transparent; }

#login table td a:hover {
 	color:#CC6600;
	background:transparent; }


/*... Redemption form - sidebar .....*/
#redemption {
	background-image: url(/images/redemptionbg.png);
	background-repeat: repeat-x;
	background-position: top left;
	width: 269px;
	height: 161px;
	margin-top: 60px; }

#redemption .text {
	padding-top: 48px;
	font-size: 14px;
	padding-left: 8px;
	color: white; }

#redemption input {
	padding-right: 2px; }

#redemption input .gfxButton { 
	padding-left:2px;
	text-align: center;
	vertical-align:bottom; }


/*... FEATURED BAND on Home Page.........*/
#artistheader {
	background-image: url(/images/purplebar.png); 
	background-repeat: no-repeat; 
	color:white;
	font-weight:bold;
	padding-left: 20px;
	height: 28px;
	clear:both; }

#artistheader .text {
	position: relative;
	top: 3px; }

#featuredartist {
	background-color: black;
	width: 425px; }

div.artistPhoto {text-align:center;}

div#featuredartist div.artistPhoto img { 
border:none;
max-height:250px;
max-width:420px;}

#featuredartist img {
	border: solid 1px; }

/* setting colors to default for artist info -cwc 09-14 */
#featuredartistinfo {
	padding: 10px;
	overflow: auto;
	margin-bottom: 10px;
 }

#featuredartistinfo a {
	background:none; }

/*... Left Column Info Boxes ........................*/
.leftbox {
	width:232px;
	margin: 0px 0px 2em 15px;
}

.leftboxheader {
	background-image: url(/images/leftbar.png); 
	background-repeat: no-repeat; 
	width:232px;
	height:32px; }

.leftboxtext {
	color: white;
	position: relative; 
	top: 4px; }
	
a.newArtist,
a:active.newArtist,
a:link.newArtist,
a:visited.newArtist {
	background-color:#FFFFFF;
	color:#663366; }	
	
a:hover.newArtist {
	background-color:#FFFFFF;
	color: orange; }	


/*.. Left Column info box 
.... fixed height with scrollable content  ........... */
.scrollbox {
	overflow: auto;
	height: 230px;
	background-color: white;
	color: black;
	border-bottom: 1px solid #666;
}
	
html {scrollbar-base-color: #716E75;}

/* .scrollbox table not used? - cwc
.scrollbox table {
	color: black;
	border-collapse: collapse;
	font-size: 14px;
	width:auto;
}

.scrollbox tr{
	border-bottom: solid 2px grey;}

.scrollbox td{
	padding:1px 2px; }


*/		
.scrollbox .topArtist {
	width:94%;
	/*width:auto;
	padding-left:2px;*/}	
	
.scrollbox .topArtist img {
	padding:2px;}	


/* Artists list in info box 
.. based on search result list -cwc */
/*div.searchresults {
	padding: 0;
	margin:0;
	width:75%;
	float:right;
	margin:0 20px; }
*/
div.scrollbox ul.artistList {
	width:92%;
	margin:0 auto;
	padding:0;
	list-style:none;
	font-size: 1em; }

div.scrollbox ul.artistList li {
	list-style: none;
	width:92%;
	padding:0.5em 0 0 5px;
	margin:0 0 0 0;
	overflow:hidden;
	border-bottom: #666 solid 1px;
	display:block; }

div.scrollbox ul.artistList li a {
	margin:0;
	padding:0;}

div.scrollbox ul.artistList li img {
	padding-left:4px;
	padding-bottom:4px; }

/* specific pieces of individual search results */
div.scrollbox ul.artistList li a.photo {
	display:block;
	width:110px;
	float:left; }

div.scrollbox ul.artistList li h3 {
	padding: 0 0 0 15%;
	margin: 0;
	font-size: 1em;
	line-height: 1.4;}
	
div.scrollbox ul.artistList li a,
div.scrollbox ul.artistList li a:active,
div.scrollbox ul.artistList li a:link {
	color:#663366;
	background:#FFF;}
	
div.scrollbox ul.artistList li a:visited {
	color: #663399;}

div.scrollbox ul.artistList li a:hover {
	color:#660033;}

div.scrollbox ul.artistList li span.location {
	display:block;}


/*... Right column nav boxes ......................*/
.navBox {
	background-image: url(/images/navBox_bg-btm.gif);
	background-position: left bottom;
	width: 252px;
	margin-left:8px;
	margin-top:1em; }
.navBox h2 {
	color:#FFFFFF;
	text-align:center;
	background:url(/images/navBox_bg-top.jpg) no-repeat;
	font-weight:normal;
	padding-top:4px; }
.navBox .boxContent	{
	padding: 0 10px 5px 10px;}
.navBox .boxContent p {
	padding-bottom: 0px;
	margin-bottom:10px; }


/*... General Page Parts ......................*/

/* centerheader Holds the Page Title */
#centerheader {
	clear: both;
	height:41px; }

/* surrounds album information */
#musicAlbumContainer {
	overflow: auto;
	height: 130px;
	width: 100%; }

/* stats below player *//* stats below player */
#stats {
	overflow: auto;	
	padding:7px;
	background:#000000; }
	
.downloads {
	overflow: auto;	
	padding:3px 5px;
	background: #16001A;
	border:1px solid #666666;
	text-align:right; }

/* div.button creates CONTENT TITLE Buttons ..........*/
div.button {
	color:white;
	height:41px;
	width:155px;
	float:left;
	background: url(/images/buttonbg.png) no-repeat; }

.buttonoff {
	background-image: url(/images/buttonbgoff.png); 
	background-repeat: no-repeat; 
	color:white;
	height:41px;
	width:155px;
	float:left; }

.buttontext { 
  position: relative; 
  top: 13px;
  padding-right: 6px;
  z-index: 100; }

.buttontext a{
  text-decoration: none;
  color: white; }

.togList dt {
  cursor: pointer; cursor: text;
  text-decoration: underline; }

.togList dd {
  padding-bottom: 10px;
  margin-left: 10px; }

.hilite {
 background-color: yellow; }

/*... bigger box for content that needs to be scrolled
... Took of the scrolling overflow:auto - don't need it. ....*/

.largescrollbox {
  overflow: auto;
  height: 300px; 
  border: solid 1px #EEE; 
  text-align: justify;
  padding: 5px; }

/*... Footer ..............................*/

#footer {
	clear: both;
/*	position: absolute; changing position because it doesn't update when javascript hides-shows areas of the page */
	position: relative;
	width: 1000px;
	bottom: 0px; }

#footerbar {
	background-image: url(/images/footer_bar.png);
	background-repeat: repeat-x;
	background-position: bottom left;
	bottom: 0px;
	height: 63px;
	width: 100%;
	position:relative;
	right: 165px;
	text-align:left;
	font: 11px Verdana, Arial, Helvetica, sans-serif;  }

#footerbar .copyright {
	position:relative;
	top:0;
	right:0;
	display:block;
	padding:40px 0 0 185px; }

#footerbar .copyright a,
#footerbar .copyright a:active,
#footerbar .copyright a:link,
#footerbar .copyright a:visited {
	color: #9999FF;
	background:transparent; }

#footerbar .copyright a:hover {
	color:orange; }
	
#footerlogo {
  position: absolute;
  right: 0px;
  bottom: 0px;
  background-image: url(/images/footer_logo.png);
  background-repeat: no-repeat;
  width: 165px;
  height: 155px; }

/*... end Footer ...*/

/*... Form List Elements ...*/
ul.formList {
	list-style:none;}

ul.formList li {
	list-style:none;
	clear:both; }

ul.formList ul {
	list-style:none;
	margin:0;
	padding:0; }

ul.formList ul li {
	list-style:none;
	margin-left:0;
	padding-left:0; }


div#password_change {
	cursor:pointer;
	text-decoration:underline;
	color:#9999FF;
	margin-left:15%;
	padding-left:5px;
}

/*Data Grid Table  */
table.dataGrid {
	background:#CCCCCC;
	color:#000;
	border:1px solid #584A68;
	/*width: 99%;*/
	width: 100%;
	text-align:left; }

table.dataGrid th {
	color: #FFFFFF;
	background: #584A68;
	padding:5px 2%;
	white-space:nowrap; }

table.dataGrid th.model, table.dataGrid td.model {
	text-align: left;
	width: 50px; }
table.dataGrid th.name, table.dataGrid td.name{
	text-align: left;
	padding-left:10px; }
table.dataGrid th.price, table.dataGrid td.price {
	text-align:right;
	width:50px; }
table.dataGrid th.quantity, table.dataGrid td.quantity {
	text-align: center; white-space: nowrap;
	width:50px; }
table.dataGrid th.cost, table.dataGrid td.cost {
	text-align:right; font: bold;
	width:50px;}
table.dataGrid th.remove, table.dataGrid td.remove {
	text-align:center;
	width:60px;}
#centerdiv table.dataGrid td.remove a { 
	background:none;}

table.dataGrid td {
	padding:5px 1%;
	border-right: 1px solid #000;
	text-align:left; }

table.dataGrid strong {}

table.dataGrid tr.row {}
table.dataGrid tr.altRow td {
	background:#DDD; }

.dataGrid td.money,
.dataGrid th.money {
	text-align:right;
	padding-right:10px; }

.dataGrid td.checkbox,
.dataGrid th.checkbox {
	text-align:center; }

/* dataGrid link styles */
.dataGrid a,
.dataGrid a:active,
.dataGrid a:link,
.dataGrid a:visited {
	color: #663366;
	background:transparent;
	text-decoration:underline;}

.dataGrid a:hover {
	color:orange;
	text-decoration:underline; }
	
#centerdiv table.dataGrid th a,
#centerdiv table.dataGrid th a:active,
#centerdiv table.dataGrid th a:link,
#centerdiv table.dataGrid th a:visited {
	color: #CCCCFF;
	background:transparent;
	text-decoration:underline;}

#centerdiv table.dataGrid th a:hover {
	color:orange;
	text-decoration:underline; }
	
#centerdiv table.dataGrid td a img,
#centerdiv table.dataGrid td a:active img,
#centerdiv table.dataGrid td a:link img,
#centerdiv table.dataGrid td a:visited img {
	background:#DDDDDD;
	/*background:none;*/
	padding:2px 3px;
	text-decoration:underline;}

#centerdiv table.dataGrid td a:hover img {
	background:#FFFFFF;
	border:1px solid #330033;
	padding:1px 2px;
	text-decoration:underline; }
	
.shoppingCart td.cost {
	text-align:right; }
	
.shoppingCart td.price {
	text-align:right; }

.notice {
	font-weight:bold;	
	border:1px solid #3A2E4D;
	background-color:#C5B6C7;
	color:#3A2E4D;
	padding:5px;
	margin-bottom:15px;
	margin-top:5px; }
	
.welcomeTxt {
	padding-left:10px;
	padding-top:5px;
	font-weight:bold;	}	
	
body.confirmPage div#confirmNav {
	/*float:right;*/	}	
	
body.confirmPage div#confirmNav ul {
	list-style-type: none;	}
	
body.confirmPage div.confirmationSection {
	width:100%;
	/*width:40%;
	border:1px solid #99FF99;*/}		
	
body.confirmPage #ArtistSection,
body.confirmPage #UserSection,
body.confirmPage #AddressSection	{
	/*float: left;*/ }
	
form#register label {	
	color:#B4AAB9;
	width:15%;
	float:left;
	text-align:right;
	padding-right:5px;
	white-space: nowrap; }	
	
.trackChoice {
	color:#C0A9D3;
	padding-left:15px;
	font-size: 1.35em; }		
	
.trackLink {
	font-size: 1.15em; }			
	
.trackChoice, .trackLink, .pageLink {
	font-weight:bold; }	

span.errorText { font-weight:bold; color:#CD669A; white-space:nowrap; margin-bottom:8px; }
/*removed float:right; not displaying well in IE7 -cwc */
input.texterror { font-weight:bold; color:#CD669A; }

div.error {
	border:solid 1px #990000;
	padding:5px;
	font-weight:bold;
	color:#FF0000;
	background:#241C33;
	margin-bottom: 1em; }

.codeBox {
	border:1px solid #333333;
	background:#FFFFFF;
	padding:5px;
	color: #000000;
	font: 12px "Courier New", Courier, monospace;}
	
.welcomeUser {
	font-weight:bold;
	padding: 15px 0 0 15px;
	margin-bottom:30px; }
	
.smTxt {
	font-size:10px; }