td#videoChat { height:23px; width:35px; background: url("/new-images/profile/chat.gif") no-repeat; }/* CSS tutorial: http://www.w3schools.com/css/default.asp */
/* CSS2 reference: http://www.w3schools.com/css/css_reference.asp */

/* body: Feel free to change all of this, and also to add as much as you 
want to this. */
body {
	color:grey;
	background: white url('http://a213.ac-images.myspacecdn.com/images01/52/l_a19845fe6166f6f22b8a6720fe5f5314.jpg') fixed center repeat;
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
}

}
/* links: Feel free to change */
a {
	color: blue;
	cursor:pointer;
}

/* Uncomment and change the url to make a new background for the top menu */
td.menu {color:#999; 
/* background: #2e2e2e url('http://some-other-outside-site.com/directory/image.ext') top repeat-x; */
}

/* Here you can change the images beside the 
'add friend' and 'send message' links. */
td#addFriend {
	height:23px;
	width:35px;
/*	background: url("/images/icons/addFriend.gif") no-repeat; */
	background: url("/new-images/profile/add.gif") no-repeat;
}
td#sendMessage {
	height:23px;
	width:35px;
/*	background: url("/images/icons/sendMessage.gif") no-repeat; */
	background: url("/new-images/profile/send.gif") no-repeat;
}

 Personal Details HTML 
#personalDetailsTable td {
	font-size: 12px;
}
#personalDetailsTable td.personalDetailName {
	font-weight: bold;
}

/* Feel free to define each of these seperately. 'border' defines table border.
Changing margin-left, margin-top, overflow, or padding-top/left/right/bottom 
may result in an undesired look. #blog defines the blog cell, #images the image 
cell, etc. (#tracks, #logo and #artists define things specific to artist/label 
profiles.) .leftBox (caps are important) defines every cell to the left of the 
center of the page (.leftBox includes: user info, contact, music, best friends) 
*/
#blog,
#logo,
#friends,
#groups,
#comments,
.leftBox,
#videos,
#artists,
#player,
#images,
#tracks,
#commentAdded,
#tagAdded,
#about,
#userMenu {
	border: 1px solid black;
	margin-left: 13px;
	margin-top: 13px;
	overflow:hidden;
 	background: white; 
	padding-top: 0px;
	padding-left:3px;
	padding-right:3px;
	padding-bottom:3px;
}
/* This is a bug fix for IE, so the borders on video and images is not flush
to the bottom of the box */
#videos, #images {
	padding-bottom: 15px;
}
/* Padding on about box */
div#aboutInner {
	padding-left:10px;
}

/* These define the headers in each cell (currently defines the following 
text: "Contact", "Music", "Best Friends", "Blog", "About", "Images", "Friends", 
"Groups", "Videos", and "Comments", at the top of the table cells.) Tip - you 
can include a border-bottom definition to add a line below the header text. */

#blog h2,
#friends h2,
#groups h2,
#artists h2,
#logo h2,
#player h2,
#tracks h2,
#images h2,
#tagAdded h2,
#videos h2,
#comments h2,
#commentAdded h2,
.leftBox h2,
#about h2,
.commentHeader,
#userMenu h2 {
	font-size:18px;
	overflow: hidden;
	margin: 0 auto;
	text-align:center;
	color:#a33;
}

/* These are for styling the left boxes one by one */
#music {
}
#connect {
}
#bestFriends {
}
#vitals {
}

/* HipHopCrack Player */
/* HipHopCrack Player */
#profile-player {
	text-align:center;
	margin-top: 13px;
	width:480px;
	margin-left:13px;
}

/* No need to change these unless you know what you're doing */
.leftBox h2, #userMenu h2, .leftBox, #userMenu {
	width: 234px;
}
#blog, #friends, #artists, #logo, #player, #groups, #tagAdded, #comments, #about, #videos, #images, #tracks, #commentAdded {
	width:480px;
	padding:0px;
	padding-bottom:15px;
}
#player {
	height:410px;
	width: 500px;
	margin: 0 auto;
}
/* specific to profiles featuring a logo (artist/label) */
#logo {
	background-color:transparent;
	border:none;
	text-align:center;
}

/* If you changed the .leftBox width, you may be able to change the margin 
and padding values below. Feel free to experiment with the float and border 
values. */
img.avatarImage, div.moreUserInfo {
	float:left;
	margin:1px;
	padding:2px;
	border:2px ridge #333;
}


/* Defines the attributes of the box next to your avatar, including the text 
inside said box. */
div.moreUserInfo {color:#600; font-size:10px;font-style:italic; }

/* Defines the text in the same cell as, but underneath, the avatar. */
div.viewMy { clear:both;font-size:10px; }

/* Defines wether or not your user name will be shown. */
div.userDisplayName { display:none; }

/* Defines text in the same cell as, but above, the avatar. (your display 
name). You might not want to change 'margin-bottom'. */
div.mainDisplayName {
	color:black;
	font-family:arial, sans-serif;
	font-weight:bold;
	text-align:center;
	font-size:24px;
	margin-bottom:4px;
}

/* Defines the date of blogs. */
.blogDate {
	padding-top: 2px;
	font-size: 10px;
	padding-left:4px;
	font-style: italic;
	color: #000;
}

/* Defines the date of comments. */
.commentDate {
	font-size: 10px;
	font-style: italic;
	color: #000;
}

/* Defines the title of each blog post */
.blogHeader {
	color:#900;
	font-size: 14px;
	padding-top: 5px;
	padding-left:3px;
	border-bottom: 1px solid #999;
}

/* Defines the blog post contents */
.blogPost {
	padding:5px;
}

/* Defines links pointing to friends, and links pointing to images. 
Can be split (like everything else) */
a.friendLink, a.imageLink {
	color:#58a;
	font-weight:bold;
}


/* Defines the boxes containing your friends' avatars, and your 
uploaded images. Does not define the links or text within the boxes.*/
div.friendBox, div.imageBox {
	background-color:#ececec;
	border: 1px solid #999;
	padding:5px;
	float:left;
	margin:10px;
}

/* Defines the links in the Comments cell, Image page, Videos page, 
Groups page, Blog page, and Friends page, as well as the text in the 
Image captions. */
.commentLinks, .imageCaption, .imagePageLinks, .videosPageLinks, .groupsPageLinks, .commentPageLinks, .blogPageLinks, .friendsPageLinks {
	background-color:#ececec;
	border: 1px solid #999;
	padding:5px;
	margin:0 auto;
	text-align:center;
	clear:both;
	width:250px;
}

/* Defines the size and margin of the image caption box. */
.imageCaption {
	width:300px;
	margin:10px auto;
}

/* No need to change this */
#addComment, #addTag {
	padding:10px;
	text-align:center;
}

div.comment {
	padding: 5px;
	position: relative;
	clear: both;
	margin-bottom: 3px;
	margin-top:3px;

}

table.commentTable {
	border-bottom: 1px solid #ccc;
}

div.comment-avatar {
	height: 64px;
	width: 64px;
	float: left;
	margin-right: 5px;
	border: 1px solid black;
}
div.comment-user {
	font-weight:600;
}
div.comment-user a {
	color:#900;
}
div.comment-date {
	color: #666;
	margin: 3px;
	font-size: 9px;
	font-style: italic;
}
div.comment-comment {
	text-align: left;
	padding-left:52px;
}

div.comment-signature {
	clear:both;
	padding-top:3px;
	text-align: left;
	margin-top: 5px;
	border-top: 1px solid #ccc;
	padding-left:60px;
}

/* Currently only defines the color of text in the addComment fields */ 
#addComment input, #addComment textarea, #addTag input {
	color:black;
}

/* Defines error text. */
.errorMessage {
	text-align:center;
	margin:3px;
	color:#a00;
}

/* Change the background-color to suit the body background color or image. 
The rest really ought not be changed (unless you know what you're doing!) */ 
div.ratingBar {
	background-color:#ececec;
	border: 1px solid #999;
	padding:5px;
	width:96px;
	text-align:center;
	margin:5px auto;
	clear:both;
}


/* You ought not change this unless you know what you're doing! */
.star-rating {
	list-style:none;
	margin: 0px;
	padding:0px;
	width: 90px;
	height: 17px;
	position: relative;
	text-align:left;
	background: url('/new-images/profile/stars.png') top left repeat-x;		
}
.star-rating li {
	padding:0px;
	margin:0px;
	/* */
	float: left;
	/* */
}
.star-rating li a {
	display:block;
	width:18px;
	height: 17px;
	text-decoration: none;
	text-indent: -9000px;
	z-index: 20;
	position: absolute;
	padding: 0px;
}
.star-rating li a:hover {
	background: url('/new-images/profile/stars.png') left center;
	z-index: 2;
	left: 0px;
}
.star-rating a.one-star {
	left: 0px;
}
.star-rating a.one-star:hover {
	width:18px;
}
.star-rating a.two-stars {
	left:18px;
}
.star-rating a.two-stars:hover {
	width: 36px;
}
.star-rating a.three-stars:hover {
	width: 54px;
}
.star-rating a.three-stars {
	left: 36px;
}
.star-rating a.four-stars {
	left: 54px;
}	
.star-rating a.four-stars:hover {
	width: 72px;
}
.star-rating a.five-stars {
	left: 72px;
}
.star-rating a.five-stars:hover {
	width: 90px;
}
.star-rating li.current-rating{
	background: url('/new-images/profile/stars.png') left bottom;
	position: absolute;
	height: 17px;
	display: block;
	text-indent: -9000px;
	z-index: 1;
}


/* end of file */
