﻿/** 
 * SilverStripe Black Candy Theme
 * http://www.silverstripe.com
 *
 * Main Layout File
 */
 
/* Misc Styles and defaults 
-------------------------------------------- */

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 {
border:0 none;
font-family:inherit;
font-style:inherit;
font-weight:inherit;
margin:0;
outline-color:-moz-use-text-color;
outline-style:none;
outline-width:0;
padding:0;
}

body {
	color: white;
	font: 11px Arial, Helvetica, sans-serif;
	padding: 0px !important;
	margin: 0px !important;
	background-image: url('../images/bg-gradient.jpg');
	background-repeat: repeat-x;
	background-color: #001832;
}

a {

	text-decoration: none;
	color: #F9E282;
}

a:hover {
	text-decoration: none;
	color: #FEC618;
}


iframe {

} 
img {
	
	border: 0 transparent none;	
}

#BgImage {
	background: transparent url('../images/bkg.jpg') no-repeat center top;
	width: 100%;
	height:100%;
	margin:  0;
	padding: 0;
	widows: inherit;
	position:relative;
	
}

.iframeFix {
	background-color:#001832;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}

.clear{
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
	}

/* CONTAINER
----------------------------------------- */
#Container { 
	width: 910px;
	margin: 0 auto;
	padding-top: 10px;

}

#Layout {
	margin-top:20px;;
	padding:0;
	background-image:url('../images/content-bkg.jpg');
	background-repeat:repeat-y;
	height: 100% !important;
	z-index:0 !important;
	position:relative;
}
#Content {
	margin: 0;
	width: 510px;
	text-align: left;
	float:left;
	padding: 0 16px 0 16px;
	border-left: 1px #BEAA1B solid;
	border-right: 1px #BEAA1B solid;
	min-height:200px;
	overflow:hidden;

	
}
/* HEADER
----------------------------------------- */
#Header {
	width: 100%;
	height: 90px;
	overflow: hidden;
	position:relative;
	clear: both;
}
 	
	
	
#SearchBar {
	position:absolute;
	top: 55px;
	right: 0px;
	background-image:url('../images/search-bkg.jpg');
	background-repeat:no-repeat;
	width: 323px;
	height: 30px;
	padding-top:5px;

}

#searchfieldText {
	background-color:transparent;
	border:none;
	float:left;
	color:white;
	padding-left:10px;
}

.searchbtn {
	background:transparent url('../images/search-icon.jpg') no-repeat;
	width:23px;
	height:24px;
	border:none;
	float:left
}
	
#DealerLogo {
	position:absolute;
	top: 20px;
	left: 0px;
}

#BrandLogo {
	position:absolute;
	height:74px;
	top: 0px;
	right: 0px;
}

.nav {
	position:absolute;
	height:30px;
	right: 125px;
	top: 10px;
}
ul.navigation {
	list-style: none;
	margin:0;
	padding:0;
}

ul.navigation li {
	float: left;
	margin-right: 20px;
}

ul.navigation li a {
	color:white;	
	text-transform:uppercase;
	font-size: 10px;
	font-weight:bold;
	font-family:Arial, Helvetica, sans-serif;
	text-decoration:none;
	display:block;
	padding:5px;

}

ul.navigation li a:hover {
	color: #0D3451;
	background-color:#FDC820;
	display:block;
	padding:5px;
}



/* Feature Section
----------------------------------------- */
#FeatureSection {
	width:100%;
	clear:both;
	height:323px;
	position:relative;
}
#TopLeftSection {
	float:left;	
	width:183px;
	height:320px;
	margin-right:16px;
}

#TopRightSection {
	float:left;	
	width:183px;
	height:320px;
	padding:0;
}


#Middle {
	width:512px;
	height:320px;
	float:left;
	position:relative;
	margin-right:16px;

}

#flash {
	width:512px;
	height:310px;
	position:absolute;
	z-index:2;

}	

/* BREADCRUMBS
-------------------------------------------- */
#Breadcrumbs { 
 	color: #B7C0C5;
	text-align: left;
	font-size: 0.9em; 
	margin: 0px 5px 10px 0;
}
	#Breadcrumbs p {
		margin: 0;
	}


/* SIDEBAR
-------------------------------------- */
#LeftSidebar {
	width: 183px;
	float: left;
}
	#LeftSidebar .rounded {
	margin-bottom:20px;

}
	#contact-bkg {
	background:transparent url('../images/contact-link.jpg') no-repeat;
}

	
	
	
	/* SIDEBAR
-------------------------------------- */
#RightSidebar { 
 	width: 183px; 
	float: right;  
	margin:0px;
	padding: 0px;
	font-size:0px;
	position:relative;
}
	#RightSidebar .rounded{
	padding-left: 10px;
	margin-bottom:10px;
	
}

	#RightSidebar a {
		font-style: normal;
	}
	
	

	
	#tag {
	 position:absolute;
	 top: 10px;
	 left: 60px;
	 z-index:999 !important;
	}
	
	
	
/*Top Right Links*/

.box { 
	margin:0;
	padding: 0 10px 10px 10px;
	height:75px;
	border:1px  #BEAA1B solid;
}
.boxitem {
	clear:both;
	padding-top: 10px;
	overflow:hidden;
}
 .box img.floatright {
	float: right;
}

.box .strong {
	font-size: 14px;
	font-weight:bold;
	float:left;
	margin-bottom: 10px;
}


/* SEARCH RESULTS STYLES
------------------------------------------------ */
ul#SearchResults {
	margin: 10px 0;
}
	ul#SearchResults li {
		list-style: none;
		margin: 5px 0;
		font-size: 1em;
	}

/* SEARCH FORM 
-----------------------------------------------*/
html #SearchForm_SearchForm {
	float: right;
	width: 240px;
	margin: 5px;
}
html #SearchForm_SearchForm .middleColumn {
	float: left;
	width: 164px;
	margin: 0 5px 0 0;
	padding: 2px;
	background-color: #51a9df;
	
}
	html #SearchForm_SearchForm .middleColumn input.text {
		width: 160px;
		border: none;
		color: #666;
	}
html #SearchForm_SearchForm #SearchForm_SearchForm_action_results {
	float: left;
	margin-top: 2px;
}



#FooterContainer {
	width: 100%;
	background-color: #001832;
	margin-top:15px;
	position:relative;
}

#FooterContainer #copyright {
	width: 890px;
	margin: 0 auto;
	padding-top: 10px;
	padding: 10px;
	position:relative;
	text-align:right;
}

#FooterContent {
	width: 890px;
	margin: 0 auto;
	padding-top: 10px;
	background: #2A7B9B;
	padding: 10px;
	height:35px;
	position:relative;

	
	}
  	#FooterContent p { 
		color: #fff;
		font-size: 1.1em;
		text-align:center;
	}
  		#FooterContainer a { 
	   		color: #fff; 
	   		text-decoration: none;
		}
			#FooterContainer a:hover {
				color: #001832;
				text-decoration: none;
			}
			
/************************
SITEMAP
************************/
#sitemap-list {padding:0 0 0 10px; margin:0; list-style:none; font-weight:bold; line-height:150%} /*1st level list*/
#sitemap-list li {padding:10px; margin-top:10px; font-size:13px; background:#041F3C;} /*1st level items*/
 
#sitemap-list ul {margin:5px 10px 5px 10px; padding:5px 10px; font-weight:normal; background:#0B395B;} /*2nd level lists*/
#sitemap-list li li {padding:0; margin:0; list-style:none; font-weight:bold; font-size:11px; line-height:18px; background:none} /*2nd level items*/
 
#sitemap-list ul ul {margin-left:10px;padding:5px 10px;  background:#fff;} /*3rd level lists*/
#sitemap-list li li li {font-size:11px; font-weight:normal;} /*3rd level items*/

/* COMMENTS
---------------------------------------- */
#CommentHolder ul {
	list-style: none;
	margin: 20px 0;
}
#PageComments li {
	margin: 5px 0;
	padding: 1px;
	width: 88%;
}
	#PageComments li.odd {
	background: #BED3A9 none no-repeat;
	padding-left: 10px;
	padding-right: 10px;
	border-bottom: 2px solid #BCE4FE;
	border-bottom-color: #006600;
}
	#PageComments li.even {
	padding-right: 10px;
	padding-left: 10px;
	background: #FFFFFF none no-repeat;
}

		#PageComments li.odd p.info {
	color: #333333;
	font-weight: bold;
}

		.actionLinks li {
		   display: inline;
		   border-right: 1px solid;
		}
			.actionLinks li a {
				padding-right: 3px;
				font-size: 10px;
			}
   			.actionLinks li.last {
      			border-right: none;
   			}

.commentrss {
	background: transparent url(../images/feed-icon-14x14.png) no-repeat;
	padding-left: 20px;
	font-size: 1.1em;
	line-height: 1.6em;
}
#PageCommentsPagination p {
	text-align: center;
	font-size: 1.2em;
}
#PageComments p {
	font-size: 1em;
}
	#PageComments p.info {
		color: #999;
		margin: 0px;
		padding: 0;
		line-height: 1em;
		font-size: 0.9em;
	}
	
	
/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/flyoutt.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
/* common styling */
.quicktab {height:150px; float:left;}
/* root element for accordion. decorated with rounded borders and gradient background image */
/* root element for tabs  */
ul.tabs { 
	list-style:none; 
	margin:0 !important; 
	padding:0;
	float:left;
}

/* single tab */
ul.tabs li { 
	text-indent:0;
	padding:0;
	margin:0 !important;
	list-style-image:none !important; 
}

/* link inside the tab. uses a background image */
ul.tabs a { 
	font-size:11px;
	display:block;
	height: 30px;  
	line-height:30px;
	width: 95px;
	text-decoration:none;
	color:#fff;
	padding:0px;
	margin:0px;	
	top:1px;
	text-indent:5px;
}

ul.tabs a:active {
	outline:none;		
}

/* when mouse enters the tab move the background image */
ul.tabs a:hover {
	color:#fff;	
	background-color:#0D3451;
}

/* active tab uses a class name "current". it's highlight is also done by moving the background image. */
ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a {
	background-color:#001832;
	background-image: url('../images/quicktab.jpg');
	background-repeat:repeat-y;		
	cursor:default !important; 
	color:#fff !important;
	outline: none;
}

/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */


/* width 1 */
ul.tabs a.w1 			{ background-position: -519px 0; width:134px; }
ul.tabs a.w1:hover 	{ background-position: -519px -31px; }
ul.tabs a.w1.current { background-position: -519px -62px; }

/* width 2 */
ul.tabs a.w2 			{ background-position: -366px -0px; width:154px; }
ul.tabs a.w2:hover 	{ background-position: -366px -31px; }
ul.tabs a.w2.current { background-position: -366px -62px; }


/* width 3 */
ul.tabs a.w3 			{ background-position: -193px -0px; width:174px; }
ul.tabs a.w3:hover 	{ background-position: -193px -31px; }
ul.tabs a.w3.current { background-position: -193px -62px; }

/* width 4 */
ul.tabs a.w4 			{ background-position: -0px -0px; width:194px; }
ul.tabs a.w4:hover 	{ background-position: -0px -31px; }
ul.tabs a.w4.current { background-position: -0px -62px; }


/* initially all panes are hidden */ 
div.panes div.pane {
	display:none;
	
}

/* initially all panes are hidden */ 
#panes {
float: left;
background:#0D3451;
height:170px;
width: 148px;
color:white;
padding:5px;
}

