/**
 * Styles for the My Page.
 */

/**
 * Element class selectors, i.e. "dl.info"
 */

/* Container in friends overlay */

#friendsContainer {
	position: relative;
}

#friendsContainer .friendsContent {
	position: relative;
}

#friendsContainer .friends {
	position: relative;
	max-height: 280px;
	height: auto !important;
	height: 280px;
	/*overflow-y: scroll;*/
	overflow: auto;
	margin-top: 10px;
	text-align: left;
}

#friendsContainer .flowingSection div.contents {
	padding-bottom: 0;
}

#friendsContainer ul li.content .asl {
	margin-left: 10px;
}

#friendsContainer ul li.content .comment {
	margin-left: 30px;
}

#friendsContainer ul li.content .actions {
	float: right;
}

/* Welcome sound */
div.sound {
	background: transparent url('../../i/icon-sprite.png?5790') 0 -780px no-repeat;
	width: 30px;
	height: 25px;
	margin: -4px 0 0 10px;
}

/* Container for the suite flash */
div.suiteContainer {
	height: 510px;
}

/* Header with name, add friend etc */
div.userHeader h2 {
	float: left;
	width: 190px;
	background: transparent url('../../i/makeover/user/nickplate_sprite.png?5796') 0 bottom no-repeat;
	height: 27px;
	padding: 12px 62px 0 13px;
	margin: 0 0 -8px -7px;
	position: relative;
	top: -8px;
}
div.userHeader h2.superstar {
	background-position: 0 0;
	padding-bottom: 18px;
	padding-top: 22px;
	top: -18px;
	margin-bottom: -14px;
}

div.userHeader .publicProfile {
	float: right;
	margin-left: 10px;
	margin-top: 6px;
	width: 345px;
}

div.userHeader .addFriend {
	float: right;
	font-weight:bold;
}

/* trivia styling */
.triviaSprite dt {
	clear: left;
}
.triviaSprite .trivia,
.triviaSprite .about {
	padding-top: 0;
}

/* about me styling */
#aboutme div.crossLinkBoxWide {
	padding-left:16px; padding-right:16px;
	width: 591px;
}
#aboutme .wrapper {
	background-color: #fff;
	margin-top: 35px;
	margin-bottom: 10px;
	padding-bottom: 20px;
}
#aboutme {
	position: relative;
	margin: 36px 0 0;
}
#aboutmeHead {
	position: relative;
	top: -20px;
}
#aboutme .topDecoration,
#aboutme .bottomDecoration,
.hrDecoration {
	background: transparent url('../../i/makeover/user/decoration.png?5739') 0 0 no-repeat;
}
#aboutme .topDecoration,
#aboutme .bottomDecoration {
	z-index: 1;
	position: absolute;
}
#aboutme .topDecoration {
	left:-15px;
	top:-43px;
	height: 177px;
	width: 640px;
}
#aboutme .bottomDecoration {
	bottom: -5px;
	left: 276px;
	height: 20px;
	width: 77px;
	background-position: 0 -182px;
}
#aboutme .noContentsMessage {
	padding: 80px 0 100px;
}
.flowingSection .hrDecoration {
	width: 195px;
	height: 53px;
	bottom: -10px;
	right: -16px;
	background-position: 0 -208px;
}
#aboutme .editLink {
	position: absolute;
	top: 26px;
	right: 23px;
	z-index: 2;
}

/* ie6/7 hacks */
#aboutmeHead {
	*top: -22px;
	*line-height: 20px;
}
#aboutme .editLink {
	*top: 15px;
}
#aboutme div.crossLinkBoxWide {
	*padding-top: 37px;
}

dl.quickFacts dt {
	display: block;
	color: #540049;
	font-style: italic;
}

dl.quickFacts dd {
	display: block;
	margin-bottom: 4px;
}

/* Edit presentation form */
form#presentationform dl dt,
form#presentationform dl dd {
	float: left;
}
form#presentationform dl dt { margin-right:10px; font-weight:bold; }
form#presentationform dl dd .swfObject { height:0 !important; }
form#presentationform dl label { width:auto; float:left; clear:none; }
form#presentationform dl dt label  {
	width: auto;
	margin: 0;
}

form#presentationform .controller em { font-style:normal; font-weight:bold; }

form#presentationform dt.becomeSuperstar {
	text-align: center;
	width: 100%;
}
form#presentationform dt.becomeSuperstar div {
	background: transparent url('../../i/user/superstar_plate.png?5739') no-repeat 0 0;
	height: 172px;
	width: 489px;
	margin: 0 auto;
	padding-top: 46px;
}
form#presentationform dt.becomeSuperstar div em {
	display: block;
	font-style: normal;
	margin-top: 30px;
}
form#presentationform dt.becomeSuperstar div a {
	font-size: 18px;
	font-style: normal;
	color: #000;
	margin-top: 31px;
	margin-left: 12px;
	display: block;
	font-weight:normal;
}

.imageBank ul.pagination { background-image: none; }
.imageBank ul.pagination li.active { background-image: none; }

dl.userInfoList {
	width: auto;
	float: left;
}

#friendsSection ul .order-3,
#friendsSection ul .order-4,
#friendsSection ul .order-5,
#lastVisitors ul .order-3,
#lastVisitors ul .order-4 { display: block; }