/***

	Color Palette
	***************************************
	Grey text: 	#616161
	Black bg:	#1D1815
	Grey meta text: #8a8f92
	Blue link text: #146aac

***/

/* CSS reset courtesy of meyerweb.com */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* Typography ----------------------------------------------------------------- */
body {font-size: 62.5%; line-height: 1.4em; font-family: HelveticaNeue, Helvetica, Arial, sans-serif; color: #616161; background: #E6E6E6 url(images/top-bg-image_02.png) top repeat-x;}

h1 {font-size: 3.0em; line-height: 1.4em; font-weight: bold; margin-bottom: 23px;}
h2 {font-size: 1.3em; line-height: 1.4em; font-weight: bold; margin-bottom: 3px;}
h3 {font-size: 2.0em; line-height: 1.4em; font-weight: bold;}
h4 {font-size: 1.3em; line-height: 1.4em; font-weight: bold;}

p {margin-bottom: 26px; font-size: 1.4em; line-height: 1.5em;}
ul,
ol {margin-bottom: 18px;}
li {margin: 0 0 10px 13px; padding: 0 0 3px 10px; font-size: 1.4em; line-height: 1.5em;}
li p {font-size: inherit;}
ul li {list-style-image: url(images/bullet.png);}
ol li {list-style: decimal; margin-left: 30px;}	
a {text-decoration: none; color: #146aac;}
a:hover {text-decoration: underline;}
a:visited {color: #146aac;}

/* Layout ----------------------------------------------------------------- */
.container {width: 785px; margin-left: auto; margin-right: auto; padding: 0 25px;}
.containerwide {width: 848px; margin-left: auto; margin-right: auto; padding: 0;}
#header {position: relative; color: #61a4d4; height: 45px;}

ul.nav {margin: 0;}
.nav li {float: left; margin: 6px 0 0 0; padding: 0; color: #4e473d; font-size: 1.1em; background: transparent url(images/nav-pipe.png) center right no-repeat; list-style-image: none;}
.nav li.last {background: none;}
.nav li.logo {background: none;}
.nav li.logo a {padding: 0 17px 0 0;}
.nav a {display: block; color: #ffec44; padding: 9px 17px 7px 15px; }
.nav span {display: block; color: #61a4d4; padding: 9px 17px 7px 15px; }
 
.crumbs {font-size: 1.1em; font-weight: bold; margin-bottom: 0; color: #8a8f92;}
.pagination {clear: both; color: #146aac;}

#header {width: 835px; padding-left: 0; padding-right: 0;}
#header a.ourtwitter {position: absolute; top: 10px; right: 5px;}

#usertools {position: absolute; top: 0; right: 0;}
#content {padding: 15px 0 28px 0;}
#main {margin-top: 15px; padding-top: 20px; padding-bottom: 20px; border: 7px solid #dcdbda; background: #fff;}
#main.fade {position: relative; border-top: 0; background: #fff url(images/bg-fade.png) top repeat-x;}
#main.fade h1 {text-align: center;}
#main.fade .lborder,
#main.fade .rborder {position: absolute; top: 0; left: -7px; width: 7px; height: 331px; background: transparent url(images/bg-fade-border.png) no-repeat;}
#main.fade .rborder {left: auto; right: -7px;}
#footer {clear: both; height: 88px; background: #1D1815;}
#footer .container {position: relative; width: 835px; padding-left: 0; padding-right: 0;}
#footer a.ourtwitter {position: absolute; top: 10px; right: 5px;}

.col {float: left;}
.twocol #alpha {width: 405px; padding-right: 43px;}
.twocol #beta {width: 300px; padding: 0;}

#alpha h2 {color: #000;}
#alpha strong {color: #000; margin-bottom: 26px;}

/* Pages ----------------------------------------------------------------- */

/* HOME PAGE */
body#homepage {background-image: url(images/top-bg-image_01.jpg);}
#homepage #banner-bg {height: 323px; background: transparent url(images/mid-bg2.jpg) top center no-repeat;}
#homepage #banner {position: relative;}
#homepage #banner #logo {position: absolute; top: 38px; left: 0;}
#homepage #banner #headline {position: absolute; top: 195px; left: 0;}
#homepage a#submitartist {position: absolute; top: 195px; right: 0; display: block; width: 304px; height: 73px; background: transparent url(images/sumbit-artist-sprite.png) 0px 0px; text-indent: -9999px;}
#homepage a#submitartist:hover {background-position: 0 73px;}
#homepage #main {padding-bottom: 0;}
/* #homepage #content .alert {margin-left: -32px; margin-right: -32px;} */
#homepage #alpha {border: 1px solid #e1e1e1; border-width: 0 1px 0 0;}
#homepage #alpha li {margin-bottom: 0;}
#homepage #alpha ul {margin-bottom: 11px;}
#homepage #alpha p {margin-bottom: 16px;}
#homepage #beta {padding-left: 36px;}

/* ARTIST HUB PAGE */
#artisthubpage #main {padding-left: 34px; padding-right: 34px;}
#artisthubpage .capsule {float: left;}
#artisthubpage .alert {margin-bottom: 36px;}

/* ARTIST ARCHIVE PAGE */
#artistarchpage #main {padding-left: 34px; padding-right: 34px;}
#artistarchpage .capsule {float: left;}
#artistarchpage .alert {margin-bottom: 36px;}

/* ARTIST PAGE */
#artistpage #main {position: relative;}
#artistpage h1 {margin-bottom: 4px; color: #000;}
#artistpage h1 .meta {font-size: .35em; color: #8a8f92; font-weight: normal;}
#artistpage .profile {float: left; margin-bottom: 30px;}
#artistpage .player {float: left; margin-left: 12px; border: 1px solid #DDDDDB;}
#artistpage #cols {clear: both;}
#artistpage #alpha {width: 442px; clear: both; margin-top: 10px;}
#artistpage #alpha h3 {margin-bottom: 10px; color: #000;}
#artistpage #sharethis {position: absolute; top: 55px; right: 59px;}
#artistpage #sharethis a {margin-left: 20px;}
#artistpage #sharethis img {vertical-align: middle;}
#artistpage #reviews {position: relative;}
#artistpage #reviews h3 {font-size: 14px;}
#artistpage #reviewlink {position: absolute; top: 19px; right: 0;}
#artistpage #artistimage {float: left; position: relative; width: 280px; height: 280px; overflow: hidden;}
#artistpage img.profile {display: block;}
#artistpage #vote {position: absolute; bottom: 0; left: 0; width: 280px; height: 38px; background: url(/images/bg-rating.png);}

#vote {color: #fff; font-size: 11px;}
#vote #ratingmsg {position: absolute; left: 15px; bottom: 10px; font-size: 11px;}
#vote #stars {position: absolute; left: 91px; bottom: 6px;}
#vote #overallrating {position: absolute; right: 15px; bottom: 10px;}

.small.email {background: transparent url(/images/email-icon-small.png) no-repeat center left; padding-left: 20px; padding-top: 5px; padding-bottom: 5px;}
.small.twitter {background: transparent url(/images/twitter-icon-small.png) no-repeat center left; padding-left: 20px; padding-top: 5px; padding-bottom: 5px;}
.small.facebook {background: transparent url(/images/fb-icon-small.png) no-repeat center left; padding-left: 20px; padding-top: 5px; padding-bottom: 5px;}
.small.downloadlink {background: transparent url(/images/download-icon-small.png) no-repeat center left; padding-left: 26px; padding-top: 5px; padding-bottom: 5px;}

#reviewlist {margin-bottom: 35px;}
#reviewlist .review {clear: both; background: #fdfdfb; color: #2e2e2e;}
#reviewlist .review.odd {background: #e0edef;}
#reviewlist .review .reviewnum {width: 68px; float: left; padding-top: 25px; text-align: center; font-size: 25px; font-weight: bold;}
#reviewlist .review .reviewnum a {color: #94b1b5;}
#reviewlist .review .reviewnum a:hover {color: #65949a; text-decoration: none;}
#reviewlist .review .reviewbody {float: left; width: 334px; background: #fff; padding: 16px 20px;}
#reviewlist .review.odd .reviewbody {background: #f1f7fb;}
#reviewlist .review .reviewbody .meta {color: #cdcdcd; margin-bottom: 8px;}
#reviewlist .review .reviewbody .meta .name {color: #616161; font-weight: bold;}
#reviewlist .review .reviewbody .meta .date {color: #606060;}
#reviewlist .review a.review-comment {float: right; margin-right: 10px;}

/* STATIC PAGES */
#staticpage #beta {padding-left: 36px;}

/* SUBMIT ARTIST PAGE */
#submitpage #alpha {width: 244px;}
#submitpage #beta {width: 453px;}

/* Widgets */
.widget-fa-sidebar .imgoverlay {width: 300px; margin-bottom: 15px;}
.widget-fa-sidebar .imgoverlay a:hover {text-decoration: none;}
.widget-fa-sidebar .morelink {text-align: right; font-size: 1.2em;}
.widget-fa-sidebar .imgoverlay {position: relative;}
.widget-fa-sidebar .imgoverlay .genre {position: absolute; bottom: 5px; right: 10px; font-weight: normal;}

/* Bad */

.player {width: 455px; margin-bottom: 20px; padding: 21px 18px; border: 1px solid #e7e7e7;}
.player .cover {float: left; margin-bottom: 15px;}
.player .albuminfo {float: left; height: 110px; width: 335px; position: relative;}
.player .albuminfo h2 {position: absolute; top: 34px; left: 15px;}
.player .albuminfo h3 {position: absolute; top: 54px; left: 15px;}
.player .albuminfo .mediaplayer {position: absolute; top: 87px; left: 15px;}
.player .playlistcontainer {clear: both; height: 112px; width: 453px; overflow: hidden;}
.player .playlist {clear: both; margin: 0;}
.player .playlist li {padding: 0; list-style-image: none; margin: 0; border-top: 1px solid #dddddb;}
.player .playlist li.last {border-bottom: 1px solid #dddddb;}
.player .playlist li a.track {float: left; display: block; width: 390px; padding: 4px 9px 4px 10px; color: #000; font-weight: bold;}
.player .playlist li a img {vertical-align: middle; padding-right: 10px;}
.player .playlist li a.track:hover,
.player .playlist li.active a.track {text-decoration: none;}
.player .playlist li.hovering {background: #faf8e6 !important;}
.player .playlist li.odd {background-color: #f4f4f2;}
.player .playlist li a.twittertrack {float: left; padding: 10px 0 3px 0;} 

/* Good */
/*
.player {width: 455px; margin-bottom: 20px; padding: 21px 18px; border: 1px solid #e7e7e7;}
.player .cover {float: left; margin-bottom: 15px;}
.player .albuminfo {float: left; height: 110px; width: 335px; position: relative;}
.player .albuminfo h2 {position: absolute; top: 34px; left: 15px;}
.player .albuminfo h3 {position: absolute; top: 54px; left: 15px;}
.player .albuminfo .mediaplayer {position: absolute; top: 87px; left: 15px;}
.player .playlistcontainer {clear: both; height: 112px; width: 453px; overflow: hidden;}
.player .playlist {clear: both; margin: 0;}
.player .playlist li {padding: 0; list-style-image: none; margin: 0;}
.player .playlist li.last {border-bottom: 1px solid #dddddb;}
.player .playlist li a {display: block; width: 100%; padding: 4px 9px 4px 10px; color: #000; font-weight: bold; border-top: 1px solid #dddddb;}
.player .playlist li a img {vertical-align: middle; padding-right: 10px;}
.player .playlist li a:hover,
.player .playlist li.active a {text-decoration: none; background: #faf8e6 !important;}
.player .playlist li.odd a {background-color: #f4f4f2;}
*/

/* Common ----------------------------------------------------------------- */
.clear {clear: both;}
.last {margin-right: 0 !important;}
.hide {display: none;}
.center {text-align: center;}
.right {float: right;}

/* Artist Capsules */
.capsule img {margin-bottom: 11px;}
.capsule .meta {font-size: 1.1em; color: #8a8f92;}

.capsule.lg {width: 235px; margin-right: 40px;}
.capsule.sm {width: 135px; height: 210px; overflow: hidden; margin-right: 27px;}

/* Image Overlays */
.imgoverlay {position: relative;}
.imgoverlay span.overlay {position: absolute; bottom: 0; left: 0; width: 100%; padding: 7px 0; background: black; background: transparent url(images/transparent-60.png) repeat;}
.imgoverlay strong {padding: 0 10px; font-size: 1.3em;}
.imgoverlay a {font-weight: bold; color: #fff;}
.imgoverlay a:hover span.overlay {border: 1px solid #ffea00; border-width: 1px 0 0 0;}

/* Buttons */
a.signupnow {display: block; width: 182px; height: 32px; background: transparent url(images/button-singupnow-sprite.png) 0px 0px; text-indent: -9999px;}
a.signupnow:hover {background-position: 0 32px;}
a.joinnow {display: block; width: 153px; height: 32px; background: transparent url(images/button-joinnow-sprite.png) 0px 0px; text-indent: -9999px;}
a.joinnow:hover {background-position: 0 32px;}
a.seeall {display: block; width: 243px; height: 30px; background: transparent url(images/button-seeall-sprite.png) 0px 0px; text-indent: -9999px;}
a.seeall:hover {background-position: 0 33px;}
a.ourtwitter {display: block; width: 118px; height: 24px; background: transparent url(images/100K-twitter-button-sprite.png) 0px 0px; text-indent: -9999px;}
a.ourtwitter:hover {background-position: 0 22px;}

.bigbutton a {display: block; padding: 12px 0 12px 21px; background: #fcfbe9; margin-bottom: 10px; font-size: 1.8em; border: 1px solid #dcdede; font-weight: bold;}
.bigbutton a img {vertical-align: middle; padding-right: 17px;}
.bigbutton a:hover {border-color: #fff; text-decoration: none;}

/* Alerts */
.alert {padding: 10px 20px; text-align: center; color: #000; border: 1px solid #c9d8e2; background: #d8dfe4;}
.alert a,
.alert a:visited {color: #501065;}
.alert p {margin-bottom: 0; font-size: 1.2em;}
.confirm {background-color: #f2f0c0; border-color: #d9d8ac; font-weight: bold; margin-bottom: 10px;}

.error {text-align: left; margin-bottom: 20px; padding: 10px 20px; background-color: #f2f0c0; color: #000; border-color: #d9d8ac; font-weight: bold;}
.error h1 {font-size: 1.6em; line-height: 1.3em; margin-bottom: 10px; text-align: left !important;}
.error ul,
.error p {margin-bottom: 0;}
.error li {margin-bottom: 0; margin-left: 14px;}

/* Tabs */
.ui-tabs {zoom: 1;}
.ui-tabs .ui-tabs-hide {display: none;}
.ui-tabs .ui-tabs-nav { list-style: none; position: relative; padding: .2em 0 0; margin-bottom: 29px;}
.ui-tabs .ui-tabs-nav li { position: relative; float: left; list-style: none; margin: 0 10px -1px 0; padding: 0; border: 1px solid #bfeaef; line-height: 1.0em; font-size: 13px;}
.ui-tabs .ui-tabs-nav li a { float: left; text-decoration: none; padding: 7px 20px 8px 20px; background: #eaf3f9; color: #000; font-weight: bold;}
.ui-tabs .ui-tabs-nav li a:hover {background: #e0edef;}
.ui-tabs .ui-tabs-nav li.ui-tabs-selected { padding-bottom: 1px; border-bottom-width: 0; background: #fff; z-index: 10;}
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, 
.ui-tabs .ui-tabs-nav li.ui-state-disabled a, 
.ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; background: #fff;}
.ui-tabs .ui-tabs-nav li a, 
.ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
.ui-tabs .ui-tabs-panel { padding: 20px 0; display: block; border-top: 1px solid #bfeaef; background: none; }
.ui-tabs .ui-tabs-hide { display: none !important; }

/* Forms */
form {font-size: 1.2em;}
fieldset {background: #deecf4; padding: 20px;}
label {float: left; clear: left; font-size: 1.3em; font-weight: bold; color: #000; margin-bottom: 18px; padding-top: 9px;}
input.text,
textarea {float: right; border: 1px solid #b1b5b5; background: #f0f0f0; width: 237px; padding: 3px; margin-bottom: 16px; margin-top: 3px; font-family: HelveticaNeue, Helvetica, Arial, sans-serif; font-size: 1.0em;}
textarea {height: 80px;}
input.checkbox {margin-bottom: 16px;}
select {float: right; border: 1px solid #b1b5b5; padding: 3px; margin-bottom: 16px; margin-top: 3px;}
input.button {clear: both; float: right; margin-top: 3px; margin-bottom: 16px;} /* margin-top: 17px;} */

form div {clear: both;}
form div label {width: 95px; text-align: right;}
form label span {font-size: 12px; color: #929699; padding-left: 10px; font-weight: normal;}

/* Multiline forms have labels above the form fields */
.multiline form div label {width: 348px; text-align: left;}
.multiline form input.text,
.multiline form textarea {width: 348px; float: none;}
.multiline.modal #msgcontent {padding-bottom: 5px; padding-left: 20px;}
.multiline .header {margin-bottom: 15px;}

#signupform form div label {width: 106px; font-size: 1.2em;}
#signupform input.text {width: 226px;}
#signupform #year {float: left; margin-right: 3px;}
#signupform #month {float: left; margin-right: 3px; margin-left: 11px;}
#signupform #day {float: left; margin-right: 3px;}
#signupform #gender {float: left; margin-left: 11px;}
#signupform .checkbox {margin-left: 81px; margin-right: 8px;}
#signupform .button {float: right; margin-bottom: 16px;}

#signinform .helper {float: left; font-size: 1.0em; margin: 11px 0 0 50px;}

#saform label {font-size: 1.2em;}
#saform input.button {margin-top: 20px;}

#subscribeform div label {width: 60px;}
#subscribeform input.text {width: 265px;}

#reviewform {background: #f1f7fb; padding: 26px 26px; position: relative;}
#reviewform label {margin-bottom: 7px; float: none; font-size: 1.2em;}
#reviewform input.text,
#reviewform textarea {margin-bottom: 27px; padding: 7px 5px; width: 378px; background: #fff; float: none;}
#reviewform textarea {height: 70px; margin-bottom: 12px;}
#reviewform .required {position: absolute; bottom: 52px; left: 53px; font-size: 11px; color: #000;}
#reviewform .asterisk {font-size: 30px; position: absolute; bottom: 44px; left: 35px; color: #000;}

#saform textarea {width: 405px; height: 40px;}
#saform label.multiline {margin-bottom: 5px;}

/* Modals */
.modal {width: 401px; background: #fff;}
.modal .header {height: 45px; margin-bottom: 25px; background: #000 url(images/top-bg-image_01.jpg) repeat-x;}
.modal h2 {font-size: 1.6em; padding: 13px 20px; color: #fff;}
.modal #msgcontent {padding: 0 25px 5px 25px;}
.modal .footer {clear: both; color: #000; font-weight: bold; font-size: 1.3em; padding: 16px 25px 19px 25px; margin-bottom: 0;border-top: 1px solid #ededed; text-align: center;}
.modal .footer.fineprint {font-weight: normal; text-align: right; font-size: 1.0em;}

#video.modal {background: #000;}
#video.modal #msgcontent {padding: 13px;}

/* Colorbox ----------------------------------------------------------------- */
/* Default styles */
#colorbox, #modalBackgroundOverlay, #modalWrap{position:absolute; top:0; left:0; z-index:9999;}
#modalBackgroundOverlay{position:fixed; width:100%; height:100%;}
#colorbox{overflow:hidden; padding:1px; margin-top:-1px; margin-left:-1px;}/*padding fixes a ghosting issue in IE7, the negative margin compensates */
	#modalWrap{width:9000px; height:9000px;}
		#modalContent, #borderTopLeft, #borderTopCenter, #borderTopRight, #borderBottomLeft, #borderBottomCenter, #borderBottomRight, #borderMiddleLeft, #borderMiddleRight {float:left; height:0; width:0; overflow:hidden;}
		#borderMiddleLeft, #borderBottomLeft{clear:left;}
		#modalContent{position:relative; overflow:visible;}
			#contentTitle{margin:0;}
			#modalClose, #contentPrevious, #contentNext{outline:none; cursor:pointer; border:0; margin:0;}
			#modalLoadedContent{overflow:auto; width:0; height:0;}
			#modalLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
			#modalLoadedContent embed{display:block; border:0;}/* Display:block removes the line-height gap embedded content */
			#modalLoadingOverlay{position:absolute; width:100%; height:100%; top:0; left:0;}

#modalBackgroundOverlay{background:#000;}

/* Custom Styles */
	
#colorbox{}
	#modalContent{margin-top:150px;}
		#modalLoadedContent{}
			#contentTitle{position:absolute; top:-20px; left:0; color:#fff;}
			#contentCurrent{display:none;}
			#contentPrevious{position:absolute; top:50%; left:10px; margin-top:-41px; background:url(images/controls.png) top left no-repeat; width:38px; height:81px; text-indent:-9999px;}
			#contentPrevious:hover, #contentPrevious.hover{background-position:bottom left;}
			#contentNext{position:absolute; top:50%; right:10px; margin-top:-41px; background:url(images/controls.png) top right no-repeat; width:38px; height:81px; text-indent:-9999px;}
			#contentNext:hover, #contentNext.hover{background-position:bottom right;}
		#modalLoadingOverlay{background:url(images/loading.gif) center center no-repeat #000;}
		#modalClose{position:absolute; top:-14px; right:7px; display:block; background:url(images/modal-close.png) no-repeat; width:27px; height:27px; text-indent:-9999px;}
		#modalClose:hover, #modalClose.hover{}
		
/* jqModal base Styling courtesy of;
	Brice Burgess <bhb@iceburg.net> */

/* The Window's CSS z-index value is respected (takes priority). If none is supplied,
	the Window's z-index value will be set to 3000 by default (via jqModal.js). */
	
.jqmWindow {
    display: none;
    
    position: fixed;
    top: 17%;
    left: 50%;
    
    margin-left: -300px;
    width: 600px;
    
    background-color: #EEE;
    color: #333;
    border: 1px solid black;
    padding: 12px;
}

.jqmOverlay { background-color: #000; }

/* Background iframe styling for IE6. Prevents ActiveX bleed-through (<select> form elements, etc.) */
* iframe.jqm {position:absolute;top:0;left:0;z-index:-1;
	width: expression(this.parentNode.offsetWidth+'px');
	height: expression(this.parentNode.offsetHeight+'px');
}

/* Fixed posistioning emulation for IE6
     Star selector used to hide definition from browsers other than IE6
     For valid CSS, use a conditional include instead */
* html .jqmWindow {
     position: absolute;
     top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px');
}

/* IE Fixes ----------------------------------------------------------------- */

/* IE 6 'fixes' \*/
* html img, * html div, * html #submitartist, * html .imgoverlay span {behavior: url(images/iepngfix.htc);}

/* IE 7 'fixes' */
*:first-child+html .imgoverlay span {behavior: url(images/iepngfix.htc);}
*:first-child+html .mediaplayer {z-index: 0;}