﻿body 
{
	background-color:white;
	font-family:'Trebuchet MS',Arial;
	color:#2D2D2D;
	font-size:12px;
	
}

img { border:0; }

a { color:#005aff; }

label { font-weight:bold; }


.selected { border:dashed 2px red; }

h1 { font-size:26pt; font-weight:normal; margin-bottom:2px; }
h2,h3, h4 { font-weight:normal; font-size:18pt; margin-bottom:2px; }
h3 { margin-top:0; margin-bottom:0; }
h4 { font-size:22pt; margin-top:18px; }
h5 { font-size:15pt; padding-top:20px; font-weight:normal; margin:0; }



#messageDisplay 
{
	padding:5px;
	margin:20px;
	border:dashed 1px #c0c0c0;
	background-color:#FFFFDD;
	text-align:center;
	
}

#logo { margin-left:40px; float:left; }

.clear { clear:both; }
.right {text-align:right; }


table { border-collapse:collapse; }

div.topControlContent 
{
	margin-top:15px;
	margin-left:40px;
	font-size:1.2em;
	float:left;
}


div.searchBox { float:right; margin-top:11px; font-size:1.2em; margin-right:5px; }
div.searchBox input.text { font-size:14px; width:200px; margin-left:10px; margin-right:5px; }
div.searchOptions { font-size:11px; margin-left:89px; padding-bottom:5px; }

input.text , textarea
{
	font-family:'Trebuchet MS',Arial;
	font-size:11px;
}


textarea { font-size:12px; width:300px; height:50px; }



div.centerbox {
	background-color:white;
	position:relative;
	width:980px;
	display: block;
    margin-left: auto;
    margin-right: auto
}


.center { text-align:center; }

div.r {
	background:url("../IMG/Layout/tr.png") no-repeat right top;
}
 
/* top-left corner and left side */
div.r div.r {

	background:url("../IMG/Layout/tl.png") no-repeat left top;
}
 
/* bottom-right corner and bottom side */
div.r div.r div.r {
	background:   url("../IMG/Layout/br.png") no-repeat right bottom;
}
 
/* bottom-left corner */
div.r div.r div.r div.rounded {
	background:   url("../IMG/Layout/bl.png") no-repeat left bottom;padding:5px;
}

#footer { font-size:8pt; color:#B2B2B2; text-align:center; margin-top:100px; padding-top:5px; margin-left:150px; margin-right:150px; border-top:solid 1px #e9e9e9; }
#footer a { color:#6c6c6c; }




table.mainContainer { width:100%; border-collapse:collapse; }
table.mainContainer tr td { vertical-align:top; }
table.mainContainer tr td.leftCol { width:300px; padding-right:10px; }
table.mainContainer tr td.rightCol { vertical-align:top; padding-left:10px; }


div.sidePanel { padding:1px !important; margin-top:10px; height:1550px;  }
div.sidePanel div { padding:5px 10px 5px 10px; }


div.contentBody { padding:10px; }
div.contentBodyAvatar { padding:10px 10px 10px 25px;  }

div.contentBodyAvatarSmall { padding:5px; width:450px; margin-left:20px;}



div.moreLink { text-align:right; padding-left:10px; font-size:110%; }


/************ DEFAULT ***********/
div.homeTitle { padding:0 20px 0 20px; }

div.homeTitle h1 { font-size:24pt; font-weight:bold; text-align:center; }
div.homeTitle h2 { text-align:center; margin-top:10px; }

div.homeSplash {text-align:center; }

div.homeSplash img { border-bottom:solid 1px #efefef; }

div.homeStart { text-align:right; padding-right:30px; }
img.barSplash { margin:20px 0 0px 0; }


table.feature tr td { vertical-align:top; }
table.feature tr td img { border:solid 4px black; margin-right:10px; }
table.feature tr td em { font-size:11px; display:block; text-align:center; }
table.feature tr td div.view { text-align:right; font-size:110%; }
div.featureArea { width:850px; margin:0 auto; padding-top:10px; }

/************ PROFILE ********/

div.userInfo { padding:10px !important; }
div.userInfo table { width:100%;  }
div.userInfo table tr td { vertical-align:middle; }
div.userInfo table tr td.userImage { width:52px; }
div.userInfo table tr td.userName { font-size:16pt;}


div.whitebar { background-color:White; margin-top:5px; }
div.splitter { height:4px; margin-top:10px; margin-bottom:10px; }

div.avatar { width:52px; height:52px; float:left; padding:0 !important; margin:0; }
div.avatarVerySmall { width:30px; height:30px; float:left; padding:0 !important; margin:0; }
div.avatarVerySmall img { border:solid 2px white; opacity:0.4;filter:alpha(opacity=40) }
div.avatarVerySmall img.selected { border:dashed 2px red; opacity:1;filter:alpha(opacity=100) }
div.avatarWide { width:60px; height:52px; float:left; padding:0 !important; margin:0; margin-top:15px; }
div.avatarWide img { cursor:pointer; }
div.avatarSmall { width:36px; height:34px; float:left; padding:0 !important; margin:0; }
div.avatarHolder { padding:0 0 0 15px !important; }




table.totalTable { width:100%; }
table.totalTable tr td { width:25%; }
table.totalTable tr td.middleTotal { border-left:dashed 1px #efefef; border-right:dashed 1px #efefef; }
table.totalTable tr td div { padding:0; text-align:center; }

table.totalTable tr td div.smallTopTotal { font-size:8pt; }
table.totalTable tr td div.bigTotal { font-size:14pt; font-weight:bold; }
table.totalTable tr td div.smallBottomTotal { font-size:8pt; }


div.extendedInfo p label { display:block; font-weight:bold; }
div.extendedInfo input { font-size:12px; font-family:'Trebuchet MS', Arial; width:130px; }
div.extendedInfo table { width:100%; }

div.extendedInfo table tr td.tweetThis img { text-align:left; padding-top:2px; padding-left:2px; }

div.featuredComparisonSidebar { text-align:center; }
div.featuredComparisonSidebar img
{
	border:solid 2px black;
}

div.featuredComparisonSidebar em { font-size:10px;font-style:normal; }

#staticReviewUserAverage { display:none; }


/************** USER PROFILE ************/

table.profileOptions  
{
	width:100%;
}

table.profileOptions tr td.profileOptionsChoice 
{
	vertical-align:middle;
	text-align:right;
	padding-right:10px;
}


/*********** WELCOME ***********/

div.reviewBoxSelf { text-align:center; padding-top:15px; }
div.reviewBox { float:left; width:120px; height:70px; text-align:center; }

div.findMore { text-align:right; padding-top:10px; padding-right:30px; }


/*********** REVIEW ***************/
img.nut { width:32px;height:32px; opacity:0.9;filter:alpha(opacity=90); position:relative;left:0px;top:-8px;cursor:e-resize; border:dashed 1px #c0c0c0;}

div.tracks { background-image:url(/IMG/Layout/trainTracks.png);width:524px;height:17px;margin:0 auto; }
div.trackHolder { padding-top:20px; height:120px; }

div.tracksHowto img { position:relative; left:62px; top:12px; }

table.questionText { width:524px;margin:0 auto; margin-bottom:15px; height:50px; }
table.questionText tr td { width:33%; font-size:12pt; vertical-align:bottom; padding:0 10px 0 10px; }
table.questionText tr td.first { text-align:left; padding-left:0; }
table.questionText tr td.middle { text-align:center; color:#7F7F7F; }
table.questionText tr td.last { text-align:right; color:#7F7F7F; padding-right:0; }

div.finishReview { text-align:right; padding-right:70px; }

.dNone { display:none; }


/*************** STATIC REVIEW ****************/

div.staticTrackHolder 
{
	padding-top:20px; height:120px;
}

div.staticTracks { background-image:url(/IMG/Layout/staticTracks.png);width:524px;height:27px;margin:0 auto; border:solid 1px #efefef; }

img.staticNut { width:32px;height:32px; opacity:0.8;filter:alpha(opacity=80); position:relative;left:0px;top:-3.5px; border:solid 1px #6c6c6c}

table.static tr td.middle { color:#2D2D2D; }
table.static tr td.last { color:#2D2D2D; }


div.staticTrackName { padding-left:76px; color:#A8A8A8; display:none; }



/********* POPUP *************/

div.tweetSubmit { text-align:right; width:310px; padding-top:5px; }
div.tweetTitle { font-size:14pt; font-weight:bold; }

table.tweetHeader { width:100%; }
table.tweetHeader tr td.logo { width:40px; }

div.bodyPadding { padding:20px; }


/********* FORM **********/


/****************** FORM HOLDER **************/

div.form { padding-top:10px; }

div.form p 
{
	margin:0; padding:5px 30px 15px 20px;
}

div.form label { float:left; display:block; width:120px; text-align:right; padding-right:15px; padding-top:3px; }

.centerAlign { text-align:center; }

div.form textarea { font-family:'Trebuchet MS',Arial; width:300px; height:60px; padding:4px; }
div.form textarea.error { background-color:#FCEBEA }

div.form p em 
{
	display:block;
	padding-left:135px; 
	font-style:normal;
	font-size:11px;
	color:#757575;
}

div.form p strong {display:block; }


div.form p.image img { padding-left:160px; }

div.form input { width:300px; padding:3px; }
div.form input.button { font-size:12px; }

div.form select { width:310px; padding:4px; height:100px; }
div.form select.oneline { width:310px; padding:4px; height:auto; }

div.form input.error 
{
	background-color:#FCEBEA;
}

div.form label.error  
{
	font-size:11px;
color:#C00005;
padding-left:135px;
text-align:left;
width:293px;	
float:none;
}

div.submit 
{
	width:500px; text-align:right; padding-top:10px;
}


div.form div.submit input.button { width:auto; }


/********* MESSAGE HOLDERS ***********/

#successDisplay { padding:10px; background-color:#CFE7FF; border:dashed 1px #0058B2; margin-right:20px; }


/************* LEADERBOARD *************/

table.leaderboard { width:100%; border-collapse:collapse; }
table.leaderboard tr td.image { width:35px; }
table.leaderboard thead tr td { border-bottom:solid 1px #c0c0c0; font-weight:bold; }
table.leaderboard tbody tr td { height:35px; vertical-align:middle; padding:6px 2px 6px 1px; border-bottom:dashed 1px #efefef; cursor:pointer; }
table.leaderboard tbody tr.highlight td { background-color:#E7F3FF; }

/********* COMPARISON ***********/

div.reviewCompare { text-align:center; padding:10px 5px 20px 5px; }
div.compareReview { text-align:right; padding-top:20px; }
div.compareReview a { font-size:14pt; }

/*********** TWITTER LOGIN **********/
div.twitterLogin { text-align:center; }


/************ TWITTER FOLLOW **********/
div.twitterFollow { text-align:right; }






/************ PROFILE UPDATES *************/
div.dismiss { text-align:right; }






/********** ADMIN **************/

table.userAlerts { width:100%; }
table.userAlerts thead { font-weight:bold; }


/************ ADVERT ************/

div.professionalLogo { text-align:center; }
div.professionalLink { text-align:right; }


img.logoProfessional { margin-top:20px; }





/******* SIMILARITY ********/

div.similarityPopup { width:500px; }


div.similarReviewSubmit { width:480px; text-align:right; }
#avatarComplete { display:none; }



/********** MAGIC MONKEY *********/


.width900 { width:500px; padding-top:30px; margin:0 auto; }

.startMagic { text-align:right; }





/************* JCARO ********************/

/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container {
    position: relative;
}

.jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
}

.jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-list li,
.jcarousel-item {
    float: left;
    list-style: none;
    /* We set the width/height explicitly. No width/height causes infinite loops. */
    width: 850px;
    height: 160px;
}

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
.jcarousel-next {
    z-index: 3;
    display: none;
}

.jcarousel-prev {
    z-index: 3;
    display: none;
}

