/* CSS Document */

* {
  margin:0;
  padding:0;
}

body,
html {
    margin:4px 0 0 0;
    padding:0;
    background:#fff;
    color:#3e4f57;
    font-size:12px;
	}

h1, h2, h3, h4 {color:#3e4f57;}	
.clearleft {clear:left;}
.clearboth {clear:both;}
.imgrep {display:block;position:relative;overflow:hidden;margin: 0 0 10px 0;padding:0;}
.imgrep span{position:absolute;top:0;left:0;width:100%;height:100%;background-repeat:no-repeat;}	
.fr {float:right;}
.collapsefix {height:1px;line-height:1px;}

#wrap {
	width:760px;
	margin:0px auto;
	padding:8px 0 0 0;
	background-image:url(/i/curveTopMain.gif);
	background-repeat:no-repeat;
	}
	
h1 
{
	font-size:20px;
	color:#3b5998;
	margin:15px 0 5px 0;
}

h2
{
	font-size:15px;
	margin:15px 0 5px 0;
}
/* Header */
.headerbg {
	width:760px;
	background-image:url(/i/sliceMain.gif);
	background-repeat:repeat-y;
}

.header {
	width:760px;
	height:100px;
	background-color:White;
	padding:0 0 0 -20px;
}

.headerheader, .headerfooter {
	width:760px;
	background-image:url(/i/sliceHeader.png);
	background-repeat:no-repeat;
	padding:6px 0 0 0;
}

.headerfooter 
{
	background-position:bottom;
	padding:0 0 6px 0;
}

a.logoPetrolHead {width:369px;height:57px;float:left;margin:20px 0px 0px 14px;cursor:hand;} 
a.logoPetrolHead span{background-image:url(/i/logoPetrolHead.gif);}

a.logoAutoTrader {width:146px;height:60px;float:right;margin:20px 10px 0px 0px;cursor:hand;} 
a.logoAutoTrader span{background-image:url(/i/logoAutoTrader.gif);}

/* Header End */


/* Main */
#main {
	width:720px;
	background-image:url(/i/sliceMain.gif);
	background-repeat:repeat-y;
	padding:0 20px 0 20px;
	}
	
/* Tabs */	
#tabs 
{
	height:32px;
	padding-top:28px;
	float:right;
	margin:3px 13px 0 0;
	background-image:url(/i/character.png);
	background-repeat:no-repeat;
	background-position:95% top;
}

	
#tabs ul {
	list-style: none;
	padding: 0;
}

#tabs a 
{
	text-decoration:none;
	height:28px;
	color:White;
	background-image:url(/i/tabCurveRight.png);
	background-repeat:no-repeat;
	background-position:right;
	padding:0 7px 0 0;
	display:block;
	cursor:hand;
}

#tabs li {
	float: left;
	margin: 0;
	height:28px;
	background-image:url(/i/tabCurveLeft.png);
	background-repeat:no-repeat;
	padding-left: 7px;
	margin:0 0 0 5px;
} 

#tabs a span
{
	background-image:url(/i/tabSlice.png);
	background-repeat:repeat-x;
	height:28px;
	display:block;
	padding:7px 0 0 0;
} 

/* Tabs End*/

.contentheader {
	width:720px;
	background-image:url(/i/curveTopPanel.png);
	background-repeat:no-repeat;
	padding:7px 0 0 0;
	position:relative;
	top:-7px;
}
.contentfooter {
	width:720px;
	background-image:url(/i/curveBottomPanel.png);
	background-repeat:no-repeat;
	background-position:bottom;
	margin:0 0 20px 0;
}
.content {
	width:680px;
	background-image:url(/i/slicePanel.png);
	background-repeat:repeat-y;
	padding:20px 20px 20px 20px;

}
	
#mainBottom 
{
	width:760px;
	height:8px;
	background-image:url(/i/curveBottomMain.gif);
	background-repeat:no-repeat;
	}
	
#autotraderpromofooter 
{
}

#autotraderpromofooter h3 
{
	float:left;
	font-size:1.5em;
	font-weight:bold;
}

#autotraderpromofooter a.visitautotrader 
{
	font-size:1.5em;
	color:Red;
	float:right;
}

#autotraderpromofooter .col, #autotraderpromofooter .collast
{
	margin:10px 10px 0 0;
	width:128px;
	float:left;
}

#autotraderpromofooter .col a, #autotraderpromofooter .collast a
{
	background-image:url(/i/arrow.gif);
	background-repeat:no-repeat;
	background-position:center right ;
	padding:0 13px 0 0;
}


#autotraderpromofooter .collast
{
	margin:10px 0 0 0;
}

#autotraderpromofooter .col h4, #autotraderpromofooter .collast h4
{
	padding:80px 0 0 0;
	background-repeat:no-repeat;
	margin:0 0 8px 0;
	font-weight:bold;
}

#autotraderpromofooter .col h4.superminis {background-image:url(/i/carSuperminis.jpg);}
#autotraderpromofooter .col h4.saloons {background-image:url(/i/carSaloons.jpg);}
#autotraderpromofooter .col h4.hatchbacks {background-image:url(/i/carHatchbacks.jpg);}
#autotraderpromofooter .col h4.sports {background-image:url(/i/carSports.jpg);}
#autotraderpromofooter .collast h4.suvs {background-image:url(/i/carSuvs.jpg);}

#autotraderpromofooter .col a, #autotraderpromofooter .collast a
{
	color:#008cc6;
}
/* Main End */	

#footer {
	text-align:center;
	color:#506591;
	}

#footer li
{
 display:inline;
 margin:0 5px 0 5px;	
}

h2.thinkYouKnow {width:311px;height:86px;margin:0 0 20px 0;} 
h2.thinkYouKnow span{background-image:url(/i/titleThinkYouKnow.gif);}

#takeQuiz 
{
	width:311px;
	float:left;
}	

#takeQuiz p {
	font-size:1.2em;
	line-height:1.2em;
	margin:0 0 1.2em 0;
	}	

div.scheduled 
{
	font-size:1.2em;
	line-height:1.2em;
	margin:0 0 1.2em 0;
}
	
div.takeQuizCol {float:right;width:301px;
}

div.takeQuizCar {width:301px;height:192px;float:right;} 
div.takeQuizCar span{background-image:url(/i/carMain.jpg);}


#frontpageOverallScores, #frontpageMonthlyScores, #challengeFriends
{
	float:left;
	width:217px;
	margin:0 14px 0 0;
}

#challengeFriends
{
	margin:0 0 0 0;
}

div.titleOverallHighScores {width:201px;height:24px;} 
div.titleOverallHighScores span{background-image:url(/i/titleOverall.gif);}

div.titleMonthlyHighScores {width:213px;height:24px;} 
div.titleMonthlyHighScores span{background-image:url(/i/titleMonthly.gif);}

div.titleChallengeFriends {width:185px;height:24px;} 
div.titleChallengeFriends span{background-image:url(/i/titleChallenge.gif);}

#challengeFriends 
{
	margin:0 0 0 0;
}
/* Buttons */	

a.takeQuizBtn {width:275px;height:58px;float:right;margin:20px 0 0 0;cursor:hand;} 
a.takeQuizBtn span{background-image:url(/i/btnTakeQuiz.gif);}
	
a.inviteFriendsBtn {width:204px;height:34px;margin-top:16px;cursor:hand;} 
a.inviteFriendsBtn span{background-image:url(/i/btnChallenge.gif);}


/* Buttons End */			

/*score panels*/

.minitabs
{
	height:21px;
	float:right;
	margin:0 11px -1px 0;
}

.minitabs ul
{
	list-style: none;
	padding:0;
	margin:0;
}

.minitabs li a
{
	text-decoration:none;
	height:21px;
	display:block;
	color:White;
	background-image:url(/i/tabCurveRightScores.gif);
	background-repeat:no-repeat;
	background-position:right;
	padding:0 3px 0 0;
	cursor:hand;
}

.minitabs li.current a
{
	background-image:url(/i/tabCurveRightScoresOn.gif);
	color:#008cc6;
}

.minitabs li a:hover
{
	text-decoration:none;
}

.minitabs li
{
	float: left;
	height:21px;
	background-image:url(/i/tabCurveLeftScores.gif);
	background-repeat:no-repeat;
	padding-left: 3px;
	margin:0 0 0 3px;
} 

.minitabs li.current
{
	background-image:url(/i/tabCurveLeftScoresOn.gif);
}

.minitabs li a span
{
	background-image:url(/i/tabSliceScores.gif);
	background-repeat:repeat-x;
	height:18px;
	display:block;
	padding:3px 3px 0 3px;
} 

.minitabs li.current a span
{
	background-image:url(/i/tabSliceScoresOn.gif);
}


.miniscoretableheader {
	width:216px;
	background-image:url(/i/curveTopScoresPanel.gif);
	background-repeat:no-repeat;
	padding:3px 0 0 0;
}
.miniscoretablefooter {
	width:216px;
	background-image:url(/i/curveBottomScoresPanel.gif);
	background-repeat:no-repeat;
	background-position:bottom;
	padding:0 0 3px 0;
	margin:-10px 0 10px 0;
}
.miniscoretable {
	width:198px;
	background-image:url(/i/sliceScoresPanel.gif);
	background-repeat:repeat-y;
	padding:9px 9px 9px 9px;
}

.miniscoretable ul {
	width:100%;
	background-color:#dddddd;
}

.miniscoretable ul li 
{
	width:100%;
	background-color:#fff;
	margin:0 0 1px 0;
	height:25px;
	padding:0px;
}

.miniscoretable ul li img 
{
	float:left;
	margin:0 0 0 0;
}

.miniscoretable ul li span.score 
{
	float:right;
	background-color:#b1babf;
	width:32px;
	height:19px;
	text-align:center;
	padding:6px 0 0 0;
	color:White;
	font-weight:bold;
}

.miniscoretable ul li span.user 
{
	float:left;
	padding:5px 0 0 5px;
	font-weight:bold;
	color:#285ea6;
}

.miniscoretable ul li.last {
	margin:0 0 0 0;
}

a.viewhighscores 
{
	color:#008cc6;
	float:right;
}

/*large score table - same mini-tabs used*/



.largescoretableheader {
	width:462px;
	background-image:url(/i/curveTopLeaderboard.gif);
	background-repeat:no-repeat;
	padding:4px 0 0 0;
}
.largescoretablefooter {
	width:462px;
	background-image:url(/i/curveBottomLeaderboard.gif);
	background-repeat:no-repeat;
	background-position:bottom;
	padding:0 0 4px 0;
	margin:-5px 0 10px 0;
}
.largescoretable {
	width:446px;
	background-image:url(/i/sliceLeaderboard.gif);
	background-repeat:repeat-y;
	padding:9px 9px 9px 9px;
}

.largescoretable ul {
	width:100%;
	background-color:#dddddd;
}

.largescoretable ul li 
{
	width:100%;
	background-color:#fff;
	margin:0 0 1px 0;
	height:59px;
	padding:0px;
	list-style-type:none;
}

.largescoretable ul li img 
{
	float:left;
	margin:0 0 0 0;
	width:59px;
	height:59px;
}

.largescoretable ul li span.pos 
{
	float:left;
	background-color:#06b72c;
	width:59px;
	height:40px;
	text-align:center;
	padding:19px 0 0 0;
	margin:0 1px 0 0;
	color:White;
	font-weight:bold;
}
.largescoretable ul li span.score 
{
	float:right;
	background-color:#b1babf;
	width:59px;
	height:40px;
	text-align:center;
	padding:19px 0 0 0;
	color:White;
	font-weight:bold;
}
.largescoretable ul li span.user 
{
	float:left;
	padding:19px 0 0 5px;
	font-weight:bold;
	color:#285ea6;
}


.largescoretable ul li.last {
	margin:0 0 0 0;
}

/*end of score panels*/
	

/*Questions Page*/

.questions h2
{
	font-size:2em;
	font-style:italic;
	margin:0 0 20px 0;
}

.questionheader {
	width:674px;
	background-image:url(/i/curveTopQuestions.gif);
	background-repeat:no-repeat;
	padding:5px 0 0 0;
}

.questionfooter {
	width:674px;
	background-image:url(/i/curveBottomQuestions.gif);
	background-repeat:no-repeat;
	background-position:bottom;
	padding:0 0 5px 0;
	margin:0 0 20px 0;
	
}
.question {
	width:634px;
	background-image:url(/i/sliceQuestions.gif);
	background-repeat:repeat-y;
	padding:20px 20px 20px 20px;
}

.question h3 
{
	font-size:1.4em;
	line-height:1.4em;
	margin:10px 0 10px 0;
}

.question li
{
	margin:0 0 10px 0;
}

.question li input
{
	margin:0 10px 0 0;
}

.MyAccount {}
.MyAccount h2 
{
	color:#3b5998;
	font-size:15px;
	margin:10px 0 10px 0;
}

.MyAccount table.Quizzes {width:400px;}
.MyAccount table.Quizzes th.Quiz {width:150px; font-size:13px; font-weight:bold; padding-left:3px;}
.MyAccount table.Quizzes th.DateCompleted {width:130px; font-size:13px; font-weight:bold; padding-left:3px;}
.MyAccount table.Quizzes th.DatePaid {width:65px; font-size:13px; font-weight:bold; padding-left:3px;}
.MyAccount table.Quizzes td {padding:4px;}
.MyAccount table.Quizzes .alt td {padding:4px; background-color:#d0d9e2;}

.PayPal h2 
{
	color:#3b5998;
	font-size:15px;
	margin:10px 0 10px 0;
}

.PayPal p {margin-bottom:10px;}

.nextButton
{
	margin:0 0 0 0;
	float:right;
}

.progressbar
{
	width:633px;
	height:18px;
	background-image:url(/i/progressBar.gif);
	background-repeat:no-repeat;
	padding:20px 20px 20px 20px;
	margin:-5px 0 -5px 0;
}	

.progressbar .togo
{
	float:left;
	background-image:url(/i/arrowGrey.gif);
	background-repeat:repeat-x;
	width:0px;
	height:17px;
	background-position:center;
}

.progressbar .symbol 
{
	float:left;
	background-image:url(/i/car.gif);
	background-repeat:no-repeat;
	width:51px;
	height:17px;
	margin:0 5px 0 5px;
}
.progressbar .progress
{
	float:left;
	background-image:url(/i/arrowGreen.gif);
	background-repeat:repeat-x;
	width:0px;
	height:17px;
	background-position:center;
}

/*Questions Page End*/

/*Results Page*/

#Results h2 
{
	font-size:20px;
}

#Results
{
	line-height:22px;
	width:100%;
}

#Results p
{
	margin:0 0 0px 0;
	width:100%;
}

.picColumn input
{
	margin:0 0 10px 0;
}

#Results .submitScoreButton
{
	margin:0 0 10px 0;
}

#Results #textColumn
{
	width:400px;
	float:left;
	margin:0 0 0 0;
	text-align:center;
}

#Results #textColumn H2 span
{
	color:#06b72c;
	line-height:1.4em;
}

#Results #textColumn img 
{
	margin:20px 0 0 0;
}

#Results .picColumn /*has to be class as moved to server side object*/
{
	width:269px;
	float:right;
}


.fullStatementButton
{
	margin:20px 0 0 0;
	float:right;
}

/*End of Results*/

/*misc pages*/
#contentpage
{
	padding:0 0px 0px 16px;
}

#contentpage h1
{
	margin:0 0 10px 0;
}

#contentpage p
{
	line-height:22px;
	margin:15px 0 15px 0px;
}

#contentpage ol
{
	margin:0 0 0 30px;
}

#contentpage li
{
	line-height:22px;
}
/*end of misc*/

/*leader board */

#leaderboard h2 
{
	font-size:20px;
}

#leaderboard
{
	width:100%;
}

#leaderboard p
{
	margin:0 0 0px 0;
	width:100%;
}

#leaderboard .leftColumn
{
	width:169px;
	float:left;
	margin:0 0 0 0;
}

#leaderboard .leftColumn a
{
	color:#008cc6;
	font-weight:bold;
	font-size:12px;
	line-height:20px;
	padding:0 15px 0 0;
	background-image:url(/i/arrow.gif);
	background-repeat:no-repeat;
	background-position:center right ;
}

#leaderboard .leftColumn p
{
	margin:10px 0 0 0;
	color:#008cc6;
	font-weight:bold;
	font-size:12px;
	line-height:20px;
}

#leaderboard .leftColumn li
{
	margin:0 0 0 20px;
} 
#leaderboard .rightColumn 
{
	width:462px;
	float:right;
	margin:0 38px 0 0;
}

#leaderboard .leaderboardNav
{
	clear:both;
}

#leaderboard .navNext a
{
	display:block;
	width:17px;
	height:19px;
	background-image:url(/i/right.gif);
	background-repeat:no-repeat;
}

#leaderboard .navNext span, #leaderboard .navPrev span
{
	display:none;
}

#leaderboard .navPrev a
{
	display:block;
	width:17px;
	height:19px;
	background-image:url(/i/left.gif);
	background-repeat:no-repeat;
}

.tabcontent
{
	
}
/* end of leaderboard*/

/*Challenge Friends*/

.challengefriendsheader {
	width:462px;
	background-image:url(/i/curveTopLeaderboard.gif);
	background-repeat:no-repeat;
	padding:4px 0 0 0;
}
.challengefriendsfooter {
	width:462px;
	background-image:url(/i/curveBottomLeaderboard.gif);
	background-repeat:no-repeat;
	background-position:bottom;
	padding:0 0 4px 0;
	margin:0 0 10px 0;
}
.challengefriendstable {
	width:446px;
	background-image:url(/i/sliceLeaderboard.gif);
	background-repeat:repeat-y;
	padding:9px 9px 9px 9px;
}

.challengefriendstable input
{
	width:410px;
	margin:5px 10px 10px 10px;
	padding:0 5px 0 5px;
}

.challengefriendstable textarea
{
	width:410px;
	height:100px;
	margin:5px 10px 0 10px;
	padding:0 5px 0 5px;
}

.challengefriendstable label, .challengefriendstable span
{
	margin:0 0 0 10px;
}

.challengeButton
{
	margin:10px 0 0 260px;
}
/*end of challenge friends*/

/*login/join page*/

#loginjoinpage 
{
	
}

#loginjoinpage H2
{
	margin:0 0 10px 0;
}

#loginjoinpage input
{
	width:264px;
	margin:5px 0px 10px 0px;
	padding:0 5px 0 5px;
}

#loginjoinpage .loginpanel
{
	width:330px;
	float:left;
}

#loginjoinpage .joinpanel
{
	width:330px;
	float:left;
	margin:0 10px 0 0;
}

#loginjoinpage h2
{
	font-size:2em;
	font-style:italic;
	margin:0 0 30px 0;
}

#loginjoinpage label, #loginjoinpage span
{
	margin:0 0 0 0px;
}

#loginjoinpage .joinButton, #loginjoinpage .loginButton
{
	float:right;
	margin:10px 25px 0 0;
}
/*end of login/join page*/

.miniboxheader {
	width:302px;
	background-image:url(/i/curveTop300.gif);
	background-repeat:no-repeat;
	padding:4px 0 0 0;
}
.miniboxfooter {
	width:302px;
	background-image:url(/i/curveBottom300.gif);
	background-repeat:no-repeat;
	background-position:bottom;
	padding:0 0 4px 0;
	margin:-10px 0 10px 0;
}
.miniboxcontent {
	width:284px;
	background-image:url(/i/slice300.gif);
	background-repeat:repeat-y;
	padding:9px 9px 9px 9px;
}

/*Quizzes Page*/

.quizzestableheader {
	width:462px;
	background-image:url(/i/curveTopLeaderboard.gif);
	background-repeat:no-repeat;
	padding:4px 0 0 0;
}
.quizzestablefooter {
	width:462px;
	background-image:url(/i/curveBottomLeaderboard.gif);
	background-repeat:no-repeat;
	background-position:bottom;
	padding:0 0 4px 0;
	margin:-5px 0 10px 0;
}
.quizzestable {
	width:446px;
	background-image:url(/i/sliceLeaderboard.gif);
	background-repeat:repeat-y;
	padding:9px 9px 9px 9px;
}

.quizzestable ul {
	width:100%;
	background-color:#dddddd;
}

.quizzestable ul li 
{
	width:100%;
	background-color:#fff;
	margin:0 0 1px 0;
	height:59px;
	padding:0px;
	list-style-type:none;
}

.quizzestable ul li a
{
	color:White;
}
.quizzestable ul li span.status 
{
	float:left;
	background-color:#06b72c;
	width:59px;
	height:40px;
	text-align:center;
	padding:19px 0 0 0;
	margin:0 1px 0 0;
	color:White;
	font-weight:bold;
}

.quizzestable ul li span.name 
{
	float:left;
	padding:19px 0 0 5px;
	font-weight:bold;
	color:#285ea6;
}


.quizzestable ul li.last {
	margin:0 0 0 0;
}

/* end of quizzes*/