/* Suggestune - Sat, 04 Sep 2010 19:35:25 -0700 */
/* ------------------------------ [ suggestune.css ] ------------------------------ */
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;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: 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;
}

/* FONTS 

10 	 77
11 	85
12 	93 (was 93)
13 	100
14 	108 (was 107)
15 	116 (was 114)
16 	123.1 (was 122)
17 	131 (was 129)
18 	138.5 (was 136)
19 	146.5 (was 144)
20 	153.9 (was 152)
21 	161.6 (was 159)
22 	167
23 	174
24 	182
25 	189
26 	197

*/

body{
	font:13px/1.231 arial,helvetica,clean,sans-serif;
	*font-size:small;
	*font:x-small;
}

select,input,button,textarea,button{
	font:99% arial,helvetica,clean,sans-serif;
}

table{
	font-size:inherit;
	font:100%;
}
pre,code,kbd,samp,tt{
	font-family:monospace;
	*font-size:108%;
	line-height:100%;
}

/* Wrapper */
body {
	background-color:#000;
  padding:0;
  margin:0;
}	

body .wrapper {
  background-color: #282828;
	margin: 0px auto;
	width:1200px;
}

h1 {
	font-size:182%;
	font-family: Times,serif;
	color:#e7e7dd;
	font-weight:lighter;
	padding:3px 0 0px 13px;
	margin-bottom:5px;
}

h2 {
	font-size:182%;
	font-family: Times,serif;
	color:#808082;
	color:#eee;
	font-weight:lighter;
	margin:26px 0 16px 13px;
}

/* Layout */
.wrapper #sub {
  width:312px;	
  float:left;
}

.wrapper #main {
  float:right;
  width:888px;
}

.clear {
	clear:both;
}

/* Header */
h1 em {
	display:none;
}

#header h1 {
	height:44px;
	width:283px;
	margin:0px 0 0 5px;
	background: url("../img/logo.png") 0px 0px no-repeat;
}

/* Artist Search */
#pageHeader {
	background-color:#e7e7dd;
  height:60px;
  border-bottom: 4px solid #bdbeb6;
}
#pageHeader label {
	text-align:center;
	display:block;
}

#pageHeader label em {
  display:none;
}

#pageHeader input{
  font-size:174%;
	border:1px solid #d4d4ca;
  height:30px;
  width:492px;
  font-style:italic;
	margin:12px 0;
	color:#606060;
	padding:0;
}

#pageHeader #search {
	width:30px;
	position:absolute;
	top:0;
	left:0;
}
/* Main Content */
#main {
	background:#e7e7dd url("../img/maintop.png") 0px 0px no-repeat;
}

/* Summary */
#summary {
  margin:0 0 0 32px;
  position: relative;
}
#summary h2 {
  color:#000;
}

#summary h2 em{
  color:#606060;
  font-style:normal;
}

#summary h2 small {
  font-size:77%;
  font-family:arial;
  color:#606060;
  margin-left:10px;
}
#summary h2 small b {
  font-weight:bold;
}
#summary #ctrl_list {
	position:absolute;
	top:0px;
	right:30px;
}

/* Post List */
#postlist li{
 	position:relative;
  background:#fff;
  margin:0 13px 13px 13px;
  padding:23px;
  font-family:arial;
  -moz-border-radius: 1em;
  border-radius: 1em;

}


#triangle {
	position:absolute;
	top:60px;
	left:-36px;
	width:0; 
	height:0; 
	border-left: 20px solid transparent; 
	/*border-right: 40px solid transparent;*/
	border-top: 20px solid #fff;
	border-bottom: 0;
}

#ctrl_post a span, #ctrl_list a span {
	display:none;
}
#ctrl_post a, #ctrl_list a {
	display:block;
	height:30px;
	width:30px;
	float:left;
	margin:0 4px 0 0;
}

a.share {
	background: url("../img/email_grey_ns.png") 0px 0px no-repeat;
}

a.shuffle {
	background: url("../img/shuffle_grey_ns.png") 0px 0px no-repeat;
}

a.serenade {
	background: url("../img/heart_grey_ns.png") 0px 0px no-repeat;
}

a.share:hover {
	background: url("../img/email_grey.png") 0px 0px no-repeat;
}

a.shuffle:hover {
	background: url("../img/shuffle_grey.png") 0px 0px no-repeat;
}

a.serenade:hover {
	background: url("../img/heart_grey.png") 0px 0px no-repeat;
}

#postlist li h3 {
	font-size:110%;
	color:#000;
	margin-bottom:5px;
}

#postlist li h3 a:link{
  font-size:146.5%;
}

#postlist li a:link{
  color:#283d52;
}

#postlist li p {
  font-size:85%;
  color:#606060;
  margin-bottom:15px;
}

#postlist #ctrl_post {
	font-size:65%;
	position:absolute;
	top:30px;
	right:30px;
}

/* Left Hand Count */
#sub {
	position:relative;
	/*background: url("../img/subtop.png") 0px 0px no-repeat;*/
}

#sub dl dt{
  display:none;
}

#sub dl dd{
	font-size:123.1%;
	color:#000;
	text-align:center;
  position:absolute;
  top:18px;
  right:70px;
  font-family:arial;
  height:40px;
  width:37px; 
  background:url("../img/chat.png") 0px 0px no-repeat;
  padding:2px;
}

/* Sub Nav Similar And Summary List */
#sub a {
	color:#7bbdfa;
  font-weight:normal;
	text-decoration:none;
}
#sub a:link, #playlist a:visited, {
	color:#7bbdfa;
}

#sub a:hover {
	color:#fff;
}
#sub a:active {
	color:#7bbdfa;
}

#playlist, #similar {
	font-family:arial;
	font-weight:normal;	
}

/* Play List */
#playlist {
	margin:0 0 0 4px;

	/*
	border-left:2px solid #3e3e3e;
	border-right:2px solid #3e3e3e;
	*/
	/*border-bottom:2px solid #3e3e3e;*/
  width:300px;
  height:300px;
  overflow:auto;

	color:#bababa;
	scrollbar-face-color: #595959;
	scrollbar-highlight-color: #7f7f7f;
	scrollbar-shadow-color: #7f7f7f;
	scrollbar-3dlight-color: #7f7f7f;
	scrollbar-arrow-color: #7f7f7f;
	scrollbar-track-color: #262626;
	scrollbar-darkshadow-color: #7f7f7f
	
}
/*
::-webkit-scrollbar {
    width: 13px;
    height: 13px;
}
*/

#playlist li:first-child{
	background: url("../img/list_bg.png") 0px 0px repeat;
}

#playlist li{
  width:265px;
  height:52px;
  border-bottom:1px solid #3e3e3e;
  padding:5px 0 4px 10px;
}

/* Similar List */
#similar {
	margin:0 0 0px 35px;
  list-style:circle;
}

#similar li {
	margin-bottom:5px;
}

/* Artist Bio */
#artistBio {
	margin:0 10px;
  color:#fff;
}

#artistBio img {
  float:left;
  margin:0 10px;	
}
artistBio p {
  margin-left: 3px;
  color:#fff;
  font-size:66%;
}

/* Footer */
#footer {
	text-align:center;
	color:#fff;
	padding:10px;
}