 /* IMPORT THE BOXES */
 
 
  @import url(boxes.css);
   @import url(cbg_new.css); 
  
  /* ============================== */
  
  
 /* HTML ELEMENTS */
 
body { margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif; background-color: #ffffff; }

 h1 { margin: 0; padding: 0; font-size: .9em; }

 
 h4 { margin: 0; }

 /* =========================================== */
 
 
 
/*- UPPER TABS--------------------------- */ 
    #tabs { float: left; width: 784px; background: #FFFFFF; font-size: 93%; line-height: normal; border-bottom: 2px solid #cc0001; /* Red bar under the nav tabs */ }

		
    #tabs ul { margin: 0; padding: 0px 0px 0 142px; /*push the whole menu around...not the individual menu items*/ list-style: none; }

		
    #tabs li { display: inline; margin: 0; padding: 0; }

		
		
    #tabs a { float: left; background: url("../Graphics/tab_left.gif") no-repeat left top; margin: 0; padding: 0 2px 0 5px; /* pad the left side out */ text-decoration: none; font-size: .9em; width: 100px; /* Fix the tab width */ text-align: center; /* center the tab text */ }

		
    #tabs a span { float: left; display: block; background: url("../Graphics/tab_right.gif") no-repeat right top; padding: 0px 3px 2px 0px; /* Pad the tabs out, not much cause otherwise the 'on' version becomes visible*/ color: #000000; font-weight: bold; }

		
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #tabs a span { float: none; }

    /* End IE5-Mac hack */
	 
    #tabs a:hover span { color: #FFFFFF; }

		
    #tabs a:hover { background-position: 0% -19px; }

		
    #tabs a:hover span { background-position: 100% -19px; }

/* ======================================================================= */
/*- Lower Menu Tabs--------------------------- */ 
    #lowerTabs { float: left; background: #FFFFFF; font-size: 93%; line-height: normal; }

		
    #lowerTabs ul { margin: 0; padding: 0px 0px 0px 10px; /*push the whole menu around...not the individual menu items*/ list-style: none; }

		
    #lowerTabs li { display: inline; margin: 0; padding: 0; }

		
	#lowerTabs .current span { background-position: 100% -19px; color: #FFFFFF; }

	
	#lowerTabs .current a { background-position: 0% -19px; color: #FFFFFF; }

	
	
		
    #lowerTabs a { float: left; background: url("../Graphics/tab_left.gif") no-repeat left top; margin: 0; padding: 0 2px 0 5px; /* right padding adds space between the tabs */ text-decoration: none; font-size: .75em; color: #000000; }

		
    #lowerTabs a span { float: left; display: block; background: url("../Graphics/tab_right_longer.gif") no-repeat right top; padding: 0px 5px 2px 2px; /* Pad the tabs out enough not much cause otherwise the 'on' version displays weirdly*/ color: #000000; }

		
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #lowerTabs a span { float: none; }

    /* End IE5-Mac hack */
	 
    #lowerTabs a:hover span { color: #FFFFFF; }

		
    #lowerTabs a:hover { background-position: 0% -19px; }

		
    #lowerTabs a:hover span { background-position: 100% -19px; }

/* ======================================================================= */
/*  BLACK BAR AREA          */
#blackBar { background-image: url(../Graphics/black_bar.gif); background-repeat: no-repeat; width: 784px; height: 30px; border-top: 4px solid #000000; margin-top: 20px; /* This fixes the nav issue in FF, without it the blackbar sits too high */ }

#blackBarLarge { background-image: url(../Graphics/black_bar_large.gif); background-repeat: no-repeat; width: 784px; height: 30px; border-top: 4px solid #000000; margin-top: 20px; /* This fixes the nav issue in FF, without it the blackbar sits too high */ }

/* ======================================================================= */
/*  BREADCRUMB */
#breadcrumb  { border: solid; border-color: #ced6dd; border-width: 0px; height: 15px; position: relative; font-weight: bold; }

#breadcrumb a:hover { color: #FF7C01; }

.rootNode  { font-variant: small-caps; color: #CACACA; text-decoration: none; }

.pathSeparator  { font-weight: bold; color: #CACACA; }

.node  { font-variant: small-caps; color: #CACACA; text-decoration: none; }

.rootNode a:hover { text-decoration: underline; color: #FF7C01; }

.currentNode  { color: #000000; font-variant: small-caps; }

	
/* ======================================================================= */
/* ORANGE BAR */
.orangeBar { background-image: url(../Graphics/orange_bar.gif); background-repeat: no-repeat; width: 349px; height: 22px; }

.orangeBar a{ text-align: left; padding-left: 5px; padding-top: 3px; color: #FFFFFF; font-weight: bold; font-size: .8em; vertical-align: bottom; text-decoration: none; margin-top: 10px; margin-bottom: 10px; /*  space out the elements vertically */ }

.orangeArrow { /* For spacing the elements of the summary */ margin-right: 5px; margin-left: 2px; }

/* ========================================================================= */
/* SUBLINK AREA AND SEARCH BOX*/
.subLink{ width: 83px; padding-bottom: 5px; }

.subLink a { text-decoration: none; color: #ff7c01; font-size: .7em; }

.subLinkLarge{ width: 75px; padding-top: 5px; }

.subLinkLarge a { text-decoration: none; color: #000000; font-size: .7em; }

.subLinkLarge a:hover { color: #ffffff; }

.subLinkLargeFirst{ width: 80px; padding-left: 5px; padding-top: 5px; }

.subLinkLargeFirst a { text-decoration: none; color: #000000; font-size: .7em; }

.subLinkLargeFirst a:hover { color: #ffffff; }

.subSearchBox { color: #FFFFFF; font-size: .7em; font-weight: bold; text-align: right; padding-right: 3px; }

.subSearchBox input{ width: 90px; height: 12px; font-size: .76em; background-color: #BDBDBD; border: 1px solid #666666; padding-left: 5px; }

.subSearchBox select{ width: 75px; height: 15px; font-size: .9em; background-color: #BDBDBD; border: 1px solid #666666; margin-right: 2px; }

.searchGo a{ text-decoration: none; color: #cc0001; padding-left: 5px; }

/* ========================================================================= */
/*STYLE THE CONTENT ELEMENTS*/
div#header{ margin: 20px 0 0 0; }

div#container{ text-align: left; }

div#content p{ line-height: 1.4; }

div#navigation{ background: #FFFFFF; }

div#extra{ background: #FFFFFF; }

div#footer{ color: #FFFFFF; }

div#footer p{ margin: 0; padding: 5px 10px; }

div#footer a{ display: inline; padding: 0; color: #C6D5FD; text-decoration: none; }

/* ======================================================================= */
/* POSITIONING THE CONTENT ELEMENTS */
/*3 Column*/
/*div#header{ width: 784px; }

div#container{ width: 784px; margin: 0 auto; }

div#wrapper{ float: left; width: 784px; }

div#content{ margin: 0 150px 0 260px; width: 360px; }

div#navigation{ float: left; width: 260px; margin-left: -784px; }

div#extra{ float: left; width: 150px; margin-left: -150px; }

div#footer{ clear: left; width: 784px; }

*/
/* ======================================================================= */
/*2 Column*/
div#container{ width: 784px; margin: 0 auto; }

div#content{ /*float: left;*/ width: 655px; }

div#navigation{ float: right; width: 200px; }

div#extra{ float: right; /*clear: right;*/ width: 140px; }

div#adsExtra{ float: right; width: 125px; padding-top: 10px; /*padding-left: 10px;*/ }

div#footer{ clear: both; width: 100%; }

div#smallFooter { background-image: url(../Graphics/small_footer.gif); background-repeat: no-repeat; width: 653px; height: 20px; text-align: center; color: #000000; font-size: .7em; padding-top: 2px; }

div#smallFooter a{ color: #FFFFFF; text-decoration: none; }

div#smallFooter a:hover{ text-decoration: underline; }

/* ================================== */
/* REVIEW / ADD RATING SECTION */
.reviewHeading{ color: #000000; font-size: 0.9em; }

.reviewSubHeading{ color: #cccccc; font-size: 0.7em; }

.ratingResponseText { padding-left: 10px; font-size: 0.8em; }

.ratingResponseText a { color: #ff7c01; text-decoration: none; }

.ratingResponseText a:hover{ color: #000000; text-decoration: underline; }

/* ================================== */
/* RED RELATED ELEMENTS */
.orangeify { color: #FF7C01; font-weight: bold; }

td.orangeLine { border-bottom: 1px solid #FF6600; max-height: 1px; height: 1px; min-height: 1px; }

.redInfo { font-size: .6em; color: #cc0001; text-align: center; font-weight: bold; position: relative; bottom: -5px; }

.redInfo a { color: #cc0001; text-decoration: none; }

.redInfo a:hover{ text-decoration: underline; }

.table_orange_grad { background-image: url(../Graphics/table_orange_grad.gif); background-repeat: repeat-x; height: 16px; font-weight: bold; color: #FFFFFF; font-size: .7em; padding-left: 5px; }

.table_grey_grad { background-image: url(../Graphics/table_grey_grad.gif); background-repeat: repeat-x; height: 16px; font-weight: bold; color: #000000; font-size: .7em; padding-left: 5px; }

/* ============================================================ */
/* LOGIN PAGES  */
.loginBox { border: solid; border-width: 1px; border-color: #CCCCCC; background-color: #FFFFFF; border-top: 0px; border-bottom: 0px; font-size: 0.8em; color: #ABABAB; width: 310px; }

.loginBox a { color: #ff7c01; font-size: 0.8em; }

.loginBoxCheckBox { padding: 10px 0px 10px 6px; }

.loginBoxLabel { padding-left: 10px; }

.loginBoxTextBox { }

.loginBoxButton { border: 1px; padding: 1px; border-color: #c5ced5; background-color: #e6ecef; color: #000000; }

/* ============================================================ */
/* ARTICLES TEXT  */
.articleText { font-size: .77em; line-height: 1.5em; padding-top: 5px; padding-bottom: 5px; }

.articleText a { color: #000000; font-weight: bold; text-decoration: none; }

.articleText a:hover{ color: #ff7c01; text-decoration: underline; }

.articleText img { float: left; margin: 5px; border: 1px solid #808080; }

.articleImageFloatBox{ float: left; width: 200px; margin-right: 10px; }

.articleImageFloatBox img { margin-bottom: 5px; }

.articleHeaders { background-color: #ff7c01; color: #FFFFFF; font-weight: bold; padding: 2px; font-size: .9em; width: 100%; }

/* ============================================================ */
/* SCORE BOX RELATED ITEMS */
.scoreSpacer { height: 10px; border-bottom: 1px dashed #808080; }

.scoreLeft { background-image: url(../Graphics/scoreLeft.gif); background-repeat: no-repeat; width: 5px; height: 15px; }

.scoreRight { background-image: url(../Graphics/scoreRight.gif); background-repeat: no-repeat; width: 5px; height: 16px; }

.scoreLeftBest { background-image: url(../Graphics/score_best_left.gif); background-repeat: no-repeat; width: 6px; height: 16px; }

.scoreBestTitle { font-size: 1.2em; }

.scoreRightBest { background-image: url(../Graphics/score_best_right.gif); background-repeat: no-repeat; width: 6px; height: 16px; }

.scoreRed { background-image: url(../Graphics/scoreRed.gif); background-repeat: repeat-x; /* width: 6px;*/ height: 16px; }

.scoreGreen { background-image: url(../Graphics/scoreGreen.gif); background-repeat: repeat-x; /* width: 6px;*/ height: 16px; }

.scoreBlack { background-image: url(../Graphics/scoreBlack.gif); background-repeat: repeat-x; /* width: 4px;*/ height: 14px; }

.scoreOrangeStar { background-image: url(../Graphics/star_orange_header.gif); background-repeat: repeat-x; /* width: 6px;*/ height: 16px; }

.scoreBlackStar { background-image: url(../Graphics/star_orange_empty_header.gif); background-repeat: repeat-x; /* width: 4px;*/ height: 14px; }

.scoreTD  { background-image: url(../Graphics/rating_box.gif); background-repeat: no-repeat; width: 38px; height: 17px; font-weight: bold; color: #FFFFFF; text-align: center; margin-left: 10px; font-size: .7em; }

.scoreHeader { width: 30px; font-size: .7em; font-weight: bold; }

.scoreRating { padding-top: 4px; }

/* ====================================== */
/* DEALER LIST ITEMS */
 .DealersListTable { font-size: .7em; }

 .DealersListTable a{ color: #000000; text-decoration: none; font-weight: bold; }

.DealersListTable a:hover{ text-decoration: underline; color: #FF6600; }

 
 #DealerListInfoSummary { font-size: .7em; text-align: center; }

 
/* =================================== */
/* CAR LISTING ON THE SEARCH PAGES */
#searchNav a { font-size: .7em; font-weight: bold; text-decoration: none; float: right; color: #000000; }

.searchFor { font-weight: bold; font-size: .9em; color: #000000; }

.carListNavigation { width: 600px; border-top: 1px solid #CCCCCC; }

 #carListLeftNav a { color: #000000; font-weight: bold; float: left; text-decoration: none; font-size: .7em; }

        #carListRightNav  a { float: right; color: #000000; font-weight: bold; text-decoration: none; font-size: .7em; }

        #carListNumNav { float: inherit; text-align: center; font-size: .7em; }

        
/* ======================================= */
/*  GENERAL ITEMS */
.ratingsBox { background-image: url(../Graphics/rating_box.gif); background-repeat: no-repeat; width: 38px; height: 17px; display: inline; color: #FFFFFF; font-weight: bold; padding: 5px 30px 5px 10px; margin-left: 5px; }

.ratingsBox p { display: inline; position: absolute; left: 560px; top: 0px; }

.results { font-weight: bold; padding-left: 5px; }

.carModelTitle { padding-top: 8px; padding-bottom: 8px; }

.repaymentCalculator { font-size: .7em; }

.repaymentCalculator td { text-align: left; }

input.repayments{ width: 50px; margin-top: 5px; font-size: .9em; text-align: right; }

select.repayments { margin-top: 5px; width: 60px; font-size: .9em; }

.italicSmall { font-size: .7em; color: #666666; }

.scoreBar { float: right; padding-right: 15px; }

.expand { float: right; margin-right: 10px; }

/* ==== SIDE BAR COLOURS ======= */
/*
.side_bar_title { font-weight: bold; }

.side_bar_title a:link{ text-decoration: none; color: #000000; }

.side_bar_title a:visited{ text-decoration: none; color: #000000; }

.side_bar_title a:hover{ color: #FF3300; text-decoration: underline; }

.side_bar_title a:active { color: #000000; }

*/
/* ====================================== */
/*###############SIDE BAR TEST COLOURS##################  */
.side_bar_title { font-weight: bold; }

.side_bar_title a{ text-decoration: none; color: #000000; border-bottom: 0px dashed #000000; }

.side_bar_title a:visited{ text-decoration: none; color: #000000; }

.side_bar_title a:hover{ color: #000000; border-bottom: 1px solid #FF7C01; }

.side_bar_title a:active { color: #000000; }

/* ############################# */
.optionalExtras input { margin: 2px; padding: 0; height: 13px; }

.otherModels a { font-weight: bold; text-decoration: none; /*	color: #4b770c;*/ color: #FF4500; /* ORANGE LINKS */ }

.otherModels a:hover { text-decoration: underline; color: #799F43; /*	color: #FF4500;*/ }

.compare td{ border-bottom: 0px dashed #808080; font-size: .7em; }

.compare tr { border-bottom: 0px dashed #808080; border-collapse: collapse; }

.compare a  { color: #000000; text-decoration: none; }

.compare a:hover  { color: #FF7C01; }

.selectComparison { width: 80px; margin-right: 5px; background-color: #E6EFF8; font-size: .7em; margin-bottom: 5px; }

.smallText { font-size: .7em; }

.defaultTD img { border: 1px solid #FFFFFF; }

.selectedTD img { border: 1px solid #C13535; filter: alpha(opacity=50); -moz-opacity: .5; font-weight: bold; }

.highLightTD img { border: 1px solid #FF0000; }

.bestPoints { position: relative; margin-top: -2px; }

.prosCons{ color: #cc0001; font-weight: bold; font-size: 1.2em; }

.frmPrice { color: #000000; font-size: 11pt; font-weight: bold; text-align: right; background-color: #FCFCFC; border-style: none; }

.DisplayOnlyTextBox { font-weight: bold; font-size: 1.1em; color: #000000; border: 0px; width: 85px; }

.DisplayOnlyTextBoxTotal input{ font-weight: bold; font-size: 1.1em; width: 65px; border: 0; padding-top: 2px; height: 1.1em; /* Height has to be the same units as the font-size */ }

.dealerCountySelect select { font-size: .7em; border: 1px solid #d8d8d8; margin-left: 15px; }

 
.tabContactTable { font-size: .7em; }

.dealerBubbleText { font-size: .7em; }

.label { width: 100px; font-size: .7em; font-weight: bold; }

.frmSections { background-color: #F8F8F8; border-bottom: 1px solid #CCCCCC; font-size: .8em; padding-left: 5px; }

.searchInput select { width: 100px; border: 1px solid #B6B6B6; }

.searchInput input { width: 100px; border: 1px solid #B6B6B6; }

.searchInput textarea { width: 100px; border: 1px solid #B6B6B6; }

.curvedBG { background-image: url(../Graphics/border_bg.gif); background-repeat: no-repeat; width: 142px; height: 100px; padding-left: 12px; /* position the car image within the div */ padding-top: 13px; float: left; }

.curvedBG  a:hover { filter: alpha(opacity=50); -moz-opacity: .5; font-weight: bold; }

.listResultDetails { /*float:right; */ font-size: .7em; padding-top: 6px; }

.listResultDetails a{ color: #000000; font-weight: bold; text-decoration: none; }

.listResultDetails a:hover { color: #ff7c01; }

.listResultItems { }

.buttonSubmit { border: 1px solid #C5CED5; background-color: #E6ECEF; font-weight: bold; }

.reviewText  { text-align: justify; }

/* HOMEPAGE CURVED RECTANGLES */
.curved_rec_red_used { width: 212px; height: 163px; background-image: url(../Graphics/curved_rec_red_used.gif); background-repeat: no-repeat; margin-right: 5px; }

.curved_rec_red_new { width: 212px; height: 163px; background-image: url(../Graphics/curved_rec_red_new.gif); background-repeat: no-repeat; margin-right: 5px; }

.curved_rec_red_sell { width: 212px; height: 163px; background-image: url(../Graphics/curved_rec_red_sell.gif); background-repeat: no-repeat; margin-right: 5px; }

.curved_rec_grey { width: 212px; height: 148px; background-image: url(../Graphics/curved_rec_grey.gif); background-repeat: no-repeat; margin-right: 5px; }

.curved_rec_grey_small { width: 211px; height: 70px; background-image: url(../Graphics/curved_rec_grey_small.gif); background-repeat: no-repeat; margin-right: 5px; }

.whiteHeader { font-weight: bold; color: #ffffff; font-size: .9em; padding-left: 5px; padding-right: 5px; padding-top: 5px; }

.greyHeader { font-weight: bold; color: #000000; font-size: .9em; padding-left: 5px; padding-right: 5px; padding-top: 5px; }

.curved_rec_content { text-align: center; margin-top: 5px; color: #ffffff; }

.curved_rec_content select { color: #7e7e7e; font-size: .7em; width: 150px; margin-bottom: 5px; margin-left: 10px; }

.curved_rec_content img { vertical-align: middle; }

.curved_rec_content h1 { font-size: 1.2em; color: #ffffff; font-weight: bold; display: inline; }

.curved_rec_bottom { padding-left: 10px; padding-right: 10px; }

.curved_rec_bottom input { margin-right: 13px; }

.curved_rec_bottom a { font-size: .75em; color: #ffffff; text-decoration: none; margin-left: 5px; }

.curved_rec_go a{ display: inline; color: #ffffff; font-size: 1.1em; font-weight: bold; text-decoration: none; padding-left: 5px; }

.curved_rec_trackdays { background-image: url(../Graphics/curved_rec_trackdays.gif); background-repeat: no-repeat; width: 433px; height: 61px; }

.sell { margin-bottom: -5px; font-size: .8em; }

.sell a { text-decoration: none; color: #ffffff; }

.sellGrey { padding-bottom: 5px; padding-right: 5px; }

.sellGrey a{ font-size: .8em; color: #000000; text-decoration: none; }

.curved_rec_content_grey { color: #666666; padding-left: 3px; padding-right: 3px; }

.curved_rec_content_grey img { padding-left: 5px; }

.curved_rec_content_grey h1 { color: #848484; font-size: 1em; text-align: center; margin: 0; margin-top: 3px; margin-bottom: 5px; padding: 0; }

.curved_rec_content_grey select{ color: #7e7e7e; font-size: .7em; width: 135px; margin-bottom: 5px; margin-left: 10px; }

.curved_rec_content_grey input { color: #7e7e7e; font-size: .7em; width: 130px; margin-bottom: 5px; margin-left: 10px; }

.curved_rec_bottom_grey { float: right; margin-right: 5px; margin-top: -4px; }

.curved_rec_go_grey { display: inline; color: #666666; font-size: 1.2em; font-weight: bold; text-decoration: none; padding-left: 5px; }

.header { font-weight: bold; font-size: .9em; color: #666666; }

.white_header_text  { float: right; text-align: right; padding-right: 10px; padding-top: 20px; }

/* ================  ROWS    ============= */
.row1 { background-color: #eff3f6; border-bottom: 1px dashed #000000; margin-bottom: 5px; font-size: .8em; }

.row1 ul { margin-top: 5px; margin-left: 20px; padding: 0; }

.row1 li { list-style-image: url(../../Graphics/arrow_grey_small.gif); color: #666666; font-size: .9em; line-height: 1.5em; }

.row1 li a { font-weight: bold; color: #666666; text-decoration: none; }

.row2 { background-color: #ffffff; border-bottom: 1px dashed #000000; margin-bottom: 5px; font-size: .8em; }

.row2 ul { margin-top: 5px; margin-left: 20px; padding: 0; }

.row2 li { list-style-image: url(../../Graphics/arrow_grey_small.gif); color: #666666; font-size: .9em; line-height: 1.5em; }

.row2 li a { font-weight: bold; color: #666666; text-decoration: none; }

.boxesContainer ol { font-size: .7em; margin: 0; }

 li.topPicks { margin-left: 35px; color: #666666; }

.adverts { font-size: .7em; margin-top: 10px; }

.adMain a { color: #cf001a; font-weight: bold; text-decoration: underline; font-size: 1.1em; }

.adMain { font-size: 1em; }

.adLink a{ color: #2752a9; text-decoration: none; }

.compareButton { border: 1px solid #6c6c6c; background-color: #DFDFDF; font-weight: bold; height: 20px; font-size: .8em; margin-bottom: 5px; }

.compareDropDown { margin-bottom: 10px; }

.alsoViewedHeader  { font-weight: bold; font-size: .7em; }

.introText { font-size: .7em; }

.introText a{ color: #cc0001; text-decoration: none; font-weight: bold; }

.introText a:hover { text-decoration: underline; }

.bikeCalendar { border: 0px; }

.grey_arrow_list  { }

.grey_arrow_list ul{ list-style-image: url(../Graphics/arrow_grey.gif); margin: 0px; padding: 0px; padding-left: 30px; }

.grey_arrow_list li { margin: 0px; padding: 0px; }

.grey_arrow_list li a{ display: block; color: gray; text-decoration: none; font-weight: bold; font-size: .7em; padding: 0; margin: 0; height: 1em; }

.grey_arrow_list li a:hover{ color: #cc0001; }

.whiteTabHeader { height: 21px; text-align: center; font-size: .9em; color: #ffffff; text-decoration: none; }

.whiteTabHeader a { color: #ffffff; text-decoration: none; }

.goButton a{ color: #666666; text-decoration: none; }

.displayInline{ display: inline; }

.trackDays { font-size: .7em; }

.trackDayItems a { padding: 0px; color: #000000; text-decoration: none; }

.trackDayItems a:hover { padding: 0px; color: #cc0001; text-decoration: underline; }

.eventHoverPanel { background-image: url(../Graphics/event_detail_bg.gif); background-repeat: no-repeat; background-position: top left; padding: 10px; padding-top: 30px; border: 1px solid #cc0001; width: 200px; font-size: .7em; font-weight: bold; }

.PremiumRow { background-color: #d9e0e6; }
