@import url(color.css);

/*
--------------------------------------------------------
Title: 3mix (Project: Everest) - Main Style Sheet
Author: Bradford Dielman - www.braddielman.com
Last Updated: March 30, 2008
--------------------------------------------------------
*/

/*
--------------------------------------------------------
=GLOBAL RESET - Much thanks to Eric Meyer
--------------------------------------------------------
*/

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,
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-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

/*
--------------------------------------------------------
=GENERAL STYLES
--------------------------------------------------------
*/

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 62.5%;
	color: #fff;
	background: #161616;
}
body#fans #wrap a {
	color: #66ccff;
	text-decoration: none;
	}
body#artists #wrap a, body#advertisers #wrap a {
	color: #fdff44;
	text-decoration: none;
	}
#wrap #wrap-inner a:hover {
	text-decoration: underline;
	color: #f3f3f3;
	}

/*
--------------------------------------------------------
=LAYOUT
--------------------------------------------------------
*/

#wrap {
	text-align: left;
	}
#wrap-inner {
	width: 804px;
	margin: auto;
	padding-top: 2em;
	}
body#fans #content, body#artists #content, body#advertisers #content {
	float: left;
	width: 480px;
	margin: 0 0 2em 0;
	}
body#home content {
	float: none;
	width: 804px;
	}
#content-inner {
	padding: 1.8em;
	}
#sidebar {
	float: right;
	width: 300px;
	margin: 0 0 2em 0;
	}
#footer {
	clear: both;
	padding: 2em;
	}
#footer-inner{
	margin: auto;
	width: 804px;
	}
	
/*
--------------------------------------------------------
=MAIN NAVIGATION
--------------------------------------------------------
*/

#main-nav {
	overflow: hidden;
	}
#main-nav-inner {
	width: 804px;
	margin: auto;
}
#main-nav-inner ul {
	float: right;
	padding: 9px 0;
	}
#main-nav-inner li {
	float: left;
	padding-left: .8em;
	margin-left: .8em;
	}
#main-nav-inner li.begin {
	border: none;
	}
#main-nav-inner li a {
	display: block;
	font-size: 1.2em;
	font-weight: bold;
	text-transform: uppercase;
	text-decoration: none;
	}
body#home #home_nav a,
body#services #services_nav a,
body#work #work_nav a,
body#about #about_nav a,
body#contact #contact_nav a  {
	cursor: default;
	}

/*
--------------------------------------------------------
=HEADER AND LOGO
--------------------------------------------------------
*/

#logo {
	float: left;
	font-size: 3.6em;
	}
#logo h1 {
	width: 191px;
	height: 104px;
	margin-left: -20px;
	}
#logo a {
	text-indent: -5000px;
	border-style: none;
	display: block;
	width: 191px;
	height: 104px;
	overflow: hidden;
	}
#header {
	position: relative;
	width: 100%;
	height: 13.8em;
	}
#header-inner {
	width: 804px;
	margin: auto;
	height: 12.5em;
	}

/*
--------------------------------------------------------
=LOGIN FORM
--------------------------------------------------------
*/

form#login {
	position: relative;
	float: right;
	padding-top: 5px;
	}
form#login ul {
	padding: 10px;
	}
form#login li {
	text-align: right;
	padding-top: .3em;
	}
form#login label {
	text-align: right;
	font-size: 1.1em;
	}
form#login input.text {
	width: 16em;
	}
form#login input#email {
	margin-right: 22px;
	}
form#login legend {
	display: block;
	font-family: Georgia, Times, serif;
	font-size: 1.8em;
	text-transform: uppercase;
	line-height: 1em;
	padding: 5px 0;
	}
form#login a.openid_login_link {
	position: absolute;
	right: 0;
	top: 8px;
	text-decoration: none;
	padding: 5px;
	font-size: 1em;
	}
form#login a.openid_login_link img {
	padding: 0px 0 0 3px;
	}
form#login input.submit {
	padding-left: 2px;
	vertical-align: bottom;
	}
form#login li.extra {
	text-align: left;
	margin-left: 5.2em;
	}

form#login li.extra a {
	padding-right: 1em;
	}

/*
--------------------------------------------------------
=BANNER
--------------------------------------------------------
*/

#banner {
	height: 24em;
	margin-bottom: 2em;
	}
body#fans #banner h2 {
	text-indent: -5000px;
	height: 66px;
	width: 395px;
	}
body#home #banner h2 {
	text-indent: -5000px;
	height: 114px;
	width: 333px;
	}
body#artists #banner h2 {
	text-indent: -5000px;
	height: 66px;
	width: 361px;
	}
body#advertisers #banner h2 {
	text-indent: -5000px;
	height: 66px;
	width: 452px;
	}
#banner p {
	font-size: 1.2em;
	line-height: 1.5em;
	padding: 0 0 20px 18px;
	width: 350px;
	}
#banner a.signup {
	text-indent: -5000px;
	display: block;
	height: 28px;
	width: 144px;
	margin-left: 18px;
	}

/*
--------------------------------------------------------
=CONTENT AND SIDEBAR STYLES
--------------------------------------------------------
*/

#content #player-intro {
	height: 27em;
	}
#content #feature-list {
	width: 135px;
	float: right;
	padding-right: 20px;
	}
#content .features {
	position: relative;
	width: 135px;
	margin-bottom: 2em;
	padding: 10px;
	}
#content .player-skins {
	float: left;
	}
#content .player-skins a.download {
	text-indent: -5000px;
	display: block;
	height: 28px;
	width: 133px;
	margin: 1.8em 0;
	}
#content .first {
	padding-right: 1.8em;
	}
#sidebar #news, #sidebar #stats, #sidebar #fans {
	padding: 1.8em;
	margin-bottom: 2em;
	}
div#signup-fans, div#signup-artists, div#signup-advertisers {
	float: left;
	width: 250px;
	margin: 0 0 15em 0;
	}
div#signup-artists {
	margin-left: 2.4em;
	margin-right: 2.4em;
	}
div#signup-fans a.signup, div#signup-fans a.coming-soon, div#signup-artists a.signup, div#signup-artists a.coming-soon, div#signup-advertisers a.signup, div#signup-advertisers a.coming-soon {
	text-indent: -5000px;
	display: block;
	height: 28px;
	width: 144px;
	margin-left: 53px;
	}
div#signup-fans a.coming-soon,div#signup-artists a.coming-soon,div#signup-advertisers a.coming-soon {
	cursor: default;
	}
body#artists #signup-steps {
	margin-bottom: 2em;
	padding: 1em;
	}
div#signup-steps li {
	float: left;
	width: 250px;
	}
div#signup-steps ol {
	padding-bottom: 2em;
	}
div#signup-steps a.get-started {
	text-indent: -5000px;
	display: block;
	height: 28px;
	width: 172px;
	margin: 25px 0 20px 294px;
	}

/*
--------------------------------------------------------
=FOOTER STYLES
--------------------------------------------------------
*/

#footer div#copyright {
	float: left;
	padding: 1.8em;
	}
#footer a.brand {
	float: right;
	text-indent: -5000px;
	display: block;
	height: 33px;
	width: 149px;
	margin: 1.8em 1.8em 0 0;
	}
#footer ul {
	list-style-type: none;
	margin-bottom: 1.5em;
	}
#footer li {
	display: inline;
	padding-right: .6em;
	margin-right: .4em;
	}
#footer li.end {
	border-right: 0;
	}

/*
--------------------------------------------------------
=TYPOGRAPHY
--------------------------------------------------------
*/

h3 {
	font-family: Georgia, Times, serif;
	text-transform: uppercase;
	margin-bottom: .5em;
	}
#content h3 {
	font-size: 2.4em;
	}
div#signup-steps h2 {
	height: 0;
	text-indent: -5000px;
	}
div#signup-steps h3 {
	font-size: 1.8em;
	height: 12em;
	padding: 6px 0 6px 56px;
	}
div#signup-steps h4, div#signup-steps p {
	margin-left: 1em;
	}
#content h3, #content h4, #sidebar h3, #sidebar h4, div#signup-steps h3, div#signup-steps h4 {
	font-weight: 100;
	}
#content .features p {
	margin-bottom: 0;
	}
#content #popular-players h3 {
	margin-top: .8em;
	}
#content #popular-players li {
	line-height: 1.5em;
	}
#sidebar h3 {
	font-family: Georgia, Times, serif;
	font-size: 2em;
	text-transform: uppercase;
	margin-bottom: .8em;
	}
#sidebar #news h4, #content h4, div#signup-steps h4 {
	font-size: 1.2em;
	line-height: 1em;
	margin-bottom: .3em;
	padding-left: -.4em;
	font-weight: bold;
	}
#sidebar #news p, #content p {
	line-height: 1.4em;
	margin-bottom: 2em;
	}
#content #features p {
	margin-bottom: 2em;
	}
#sidebar #news a, #content a {
	margin-bottom: 2em;
	}
#content, #sidebar, #footer, div#signup-steps {
	font-size: 1.1em;
	}
#sidebar #fans li {
	line-height: 1.5em;
	}
p.more {
	margin-top: -1.8em;
	}
div#signup-fans h3, div#signup-artists h3, div#signup-advertisers h3 {
	padding: 20px 25px 0 20px;
	}
div#signup-fans p, div#signup-artists p, div#signup-advertisers p {
	padding: 0 20px 0 20px;
	}

	
/*
--------------------------------------------------------
=TABLES
--------------------------------------------------------
*/

#stats table {
	width: 100%;
	border-collapse: collapse;
	}
#stats th {
	display: none;
	}
#stats caption {
	font-family: Georgia, Times, serif;
	font-size: 2em;
	line-height: 1em;
	margin-bottom: .2em;
	text-transform: uppercase;
	}
#stats td {
	padding: 5px 8px;
	}
#stats td.stat {
	text-align: right;
	}
	
/*
--------------------------------------------------------
=SELF-CLEARING FLOATS (Method inspired by Dan Cederholm)
--------------------------------------------------------
*/

#header-inner:after, #logo:after, #content:after, div#signup-steps ol:after, #sidebar:after, #wrap:after, form#login ul:after, #player-intro:after, #footer:after, #footer div:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	}
	
/* self-clearing floats for IE6 */

* html #header, * html #header-inner, * html #logo, * html #content, * html div#signup-steps ol, * html #sidebar, * html #wrap, * html form#login, * html #player-intro, * html #footer, * html #footer div {
	height: 1%;
	}
	
/* self-clearing floats for IE7 */

*:first-child+html #header-inner, *:first-child+html #content, *:first-child+html div#signup-steps ol, *:first-child+html #sidebar, *:first-child+html #wrap, *:first-child+html form#login, *:first-child+html #player-intro, *:first-child+html #footer, *:first-child+html #footer div {
	min-height: 1px;
	}