/* @override http://toyota-tsusho-dealership.local/stylesheets/level2.css */

/* Main Area Styles /---------------- */

#banner {
	height: 163px;
	background: url(../images/interface/banner-background.png) no-repeat;
	overflow: visible;
	position: relative; /*for position #page_banner_image*/
	z-index: 20;
}

#banner h2 {
	color: #333;
	margin-left: 15px;
	margin-top: 69px;
	font-weight: normal;
}

#page_banner_image {
	background: url(../images/banners/default.jpg) no-repeat top right;
	position: absolute;
	right: 0;
	width: 700px;
	height: 163px;
}

#main {
	background: white url(../images/interface/content-background-top.png) no-repeat;
	overflow: hidden;
	position: relative;
	z-index: 10;
	min-height: 200px;
}

#main_content {
	font-size: 120%;
	line-height: 1.6;
	padding-top: 10px;

	overflow: hidden;
}

#main_content h2 {
	margin-bottom: 15px;
}

#main_content h4 a,
#main_content h4 a:visited,
#main_content h5 a,
#main_content h5 a:visited{
	color: #333;
}

#main_content h3 {
	color: #cc0000;
	font-weight: normal;
	margin-bottom: 15px;
	font-size: 170%;
	line-height: 1.3;
}

#main_content h3 a,
#main_content h3 a:visited {color: #cc0000;}

#main_content > p:first-child {
	font-size: 170%;
}

.sub_content {
	background: url(../images/interface/sub-content-background-top.png) no-repeat;
	padding: 11px 8px 0 8px;
	width: 193px;
	overflow: hidden;
	margin: 0;
}

.sub_content_bottom {
	overflow: hidden;
	margin: 0;
	height: 11px;
	background: url(../images/interface/sub-content-background-bottom.png) no-repeat left top;
	margin-bottom: 10px;
}

.sub_content h4.section_header {
	background: url(../images/interface/header-arrow-down.png) no-repeat left center;
	color: black;
	height: 16px;
	line-height: 16px;
	margin: 0;
	padding: 0 0 0 25px;
	font-weight: bold;
	font-size: 90%;
}

.sub_content h3 {
	color: #cc0000;
	text-transform: uppercase;
	font-size: 100%;
	margin-top: 12px;
	text-indent: 2px;
}

.sub_content ul {
	margin-left: 2px;
	margin-top: 10px;
}

#main .sub_content ul li a,
#main .sub_content ul li a:visited {
	text-transform: uppercase;
	color: black;
	text-decoration: none;
	font-size: 90%;
}

#main .sub_content ul li.ctoc_current > a { /* Sorry IE. I really am :( */
	color: #ca0000;
	cursor: default;
}

#main .sub_content ul li a:hover {
	text-decoration: underline;
	color: black;
}

#main .sub_content ul li.ctoc_current a:hover {
	text-decoration: none;
	color: #ca0000;
}

#main .sub_content ul li {
	padding-left: 15px;
	margin: 7px 0;
	background: url(../images/interface/arrow-small-right.png) no-repeat left 0px;
}

#main .sub_content #meta-buttons {
	float:right;
}

#font-size-increase,
#font-size-decrease,
#print-page {
	float: left;
	width: 20px;
	height: 20px;
	background: url(../images/interface/meta-buttons.png) no-repeat;
	margin-left: 10px;
	overflow: hidden;
	text-indent: -1000px;
}

#font-size-increase {background-position: -23px 0px;}
#font-size-decrease {background-position: 0px 0px;}
#print-page {background-position: -51px 0px;}

#font-size-increase:hover {background-position: -23px -20px;}
#font-size-decrease:hover {background-position: 0px -20px;}
#print-page:hover {background-position: -51px -20px;}

#main_content ul li,
#main_content ol ul li {
	padding-left: 20px;
	background: url(../images/interface/arrow-small-right-active.png) no-repeat 5px 2px;
	line-height: 1.4;
	margin: 13px 0;
	zoom:1; /*has-layout required to get background images to appear on subsequent page loads*/
	list-style: none;
}

#main_content ol li {
	padding: 0;
	line-height: 1.4;
	margin: 13px 0 13px 20px;
	list-style: decimal;
	background: none;
}

#main_content ul,
#main_content ol {
	margin-bottom: 10px;
	overflow: hidden;
}

#main_content ul.related-documents {
	margin-top: 0;
	padding-top: 0;
}

#main_content ul.related-documents li {
	margin: 5px 0;
	background: none;
	padding: 0;
}

.top-container {
	padding-top: 20px;
	bottom: 0;
	background: white;
	overflow: hidden;
}

a.top,
#main_content a.top,
#main_content a.continue,
#main_content a.more,
#main_content a.news {
	background: url(../images/interface/arrow-right.png) no-repeat right top;
	line-height: 16px;
	padding-right: 20px;
	margin: 20px 0;
	zoom: 1; /*triggering has-layout prevents background image from being clipped.*/
}

a.top,
#main_content a.top,
#main_content a.top:visited {
	background: url(../images/interface/arrow-up.png) no-repeat right top;
	text-transform: lowercase;
	float:right;
	margin-top: 20px;
	color: #cc0000;
	text-decoration: none;
	font-weight: bold;
	font-size: 120%;
	margin-right: 10px;
}

#main_content a.back {
	background: url(../images/interface/arrow-left.png) no-repeat left top;
	padding-left: 20px;
	padding-right: 0;
}

#main_content a.more {
	padding-right: 25px;
	color: #ca0000;
	margin: 0;
}

#main_content a.continue:hover,
#main_content a.more:hover,
#main_content a.top:hover,
a.top:hover {
	background-position: right 100%;
	text-decoration: underline;
}

#main_content a.back:hover {
	background-position: left -16px;
}

#main_content table,
#main_content table th,
#main_content table tr,
#main_content table td {
	border-collapse: collapse;
	border: none;
	text-align: left;
}

#main_content table td,
#main_content table th {
	padding: 2px 4px 2px 0;

}

#main_content table th {
	color: #ca0000;
	padding-right: 20px;
	border-bottom: 1px dotted #ccc;
}

#main_content table td {

	border-bottom:  1px dotted #ccc;
	padding: 10px 4px 10px 0;

}

#main_content table.dataTable {
	width: 100%;
	clear: both;
	margin-top: 40px;
}

#main_content dl {
	margin-bottom: 10px;
}

#main_content dl dt {
	font-weight: bold;
}

#main_content dl dd {
	margin-bottom: 20px;
}

/* Showroom Nav /---------------- */

/* Top level links (bigger with big round background) */
#main #showroom-nav li {
	font-size: 13px;
	background: url(../images/interface/showroom-nav-background.png) no-repeat 0 2px;
	padding-top: 13px;
	padding-left: 20px;
}

/* Overrides li set above, as we cant use sibling selector (>). :'( */
#main #showroom-nav li li {
	font-size: 11px;
	padding: 0 0 0 15px;
	margin: 7px 0;
	background: url(../images/interface/arrow-small-right.png) no-repeat left 0px;

}

.section_68029 #main #showroom-nav > li.ctoc_current {
	background: url(../images/interface/showroom-nav-background-current.png) no-repeat 0 2px;
}

#main ul#showroom-nav li li li a{
	text-transform: capitalize;
}

#main ul#showroom-nav ul li.ctoc_current {
	background: url(../images/interface/arrow-small-down.png) no-repeat left -17px;
}

#main ul#showroom-nav ul li.ctoc_current.ctoc_level3 {
	background: url(../images/interface/arrow-small-selected-right.png) no-repeat left 3px;
}

/* Active Parent LI has different background */
#main ul#showroom-nav li.ctoc_active {
	background: url(../images/interface/showroom-nav-background-down.png) no-repeat;
}

#main ul#showroom-nav ul li.ctoc_active {
	background: url(../images/interface/arrow-small-down-only.png) no-repeat top left;
}

/* Subnav selected parent colours and overrides for their children. would be a lot easier with the child selector :( */
/* First, top level */
#main ul#showroom-nav li.ctoc_active a {color: #ca0000;}

#main ul#showroom-nav li a {color: black;}
#main ul#showroom-nav li.ctoc_active a,
#main ul#showroom-nav li.ctoc_current a {color: #ca0000;}

/* Second level */
#main ul#showroom-nav li.ctoc_active li a,
#main ul#showroom-nav li.ctoc_current li a {color: black;}
#main ul#showroom-nav li.ctoc_active li.ctoc_active a,
#main ul#showroom-nav li.ctoc_active li.ctoc_current a {color: #ca0000;}

/* Third level */
#main ul#showroom-nav li.ctoc_active li.ctoc_active li a,
#main ul#showroom-nav li.ctoc_active li.ctoc_current li a {color: black;}
#main ul#showroom-nav li.ctoc_active li.ctoc_active li.ctoc_active a,
#main ul#showroom-nav li.ctoc_active li.ctoc_active li.ctoc_current a {color: #ca0000;}

/* Fourth level */
#main ul#showroom-nav li.ctoc_active li.ctoc_active li.ctoc_active li a,
#main ul#showroom-nav li.ctoc_active li.ctoc_active li.ctoc_current li a {color: black;}
#main ul#showroom-nav li.ctoc_active li.ctoc_active li.ctoc_active li.ctoc_active a,
#main ul#showroom-nav li.ctoc_active li.ctoc_active li.ctoc_active li.ctoc_current a {color: #ca0000;}

/* Fifth level */
#main ul#showroom-nav li.ctoc_active li.ctoc_active li.ctoc_active li.ctoc_current li a,
#main ul#showroom-nav li.ctoc_active li.ctoc_active li.ctoc_active li.ctoc_active li a {color: black;}
#main ul#showroom-nav li.ctoc_active li.ctoc_active li.ctoc_active li.ctoc_active li.ctoc_active a,
#main ul#showroom-nav li.ctoc_active li.ctoc_active li.ctoc_active li.ctoc_active li.ctoc_current a {color: #ca0000;}

/* Level 2 Styles /---------------- */

.branch-brands img {
	margin-right: 20px;
	margin-top: 10px;
}

.results-count-info {
	margin-top: 15px;
	font-size: 90%;
}

.brand .logo-container {
	float: left;
	width: 170px;
	text-align: center;
	padding-top: 6px;
}

.grid_3 {overflow: hidden;}

.brand .content-container {
	float:right;
	width: 510px;
}

.brand .content-container h4 {
	margin-top: 0;
}

.brand {
	clear: both;
	overflow: hidden;
	margin-bottom: 20px;
}

.branch-brands .logo {
	float: left;
}

/* Accordion Styles /---------------- */

#network-accordion .accordion-toggle {
	margin: 0;
	padding: 0;
	line-height: 52px;
	border-top: 1px solid #c0c2c4;
	cursor: pointer;
	background: url(../images/interface/accordion-icons.png) no-repeat right top;
	zoom: 1; /* triggering haslayout for ie6 prevents cufon replaced text from getting messed up when accordion height changes. */
}

#network-accordion h3.active {
	background-position: right -52px;
}

#network-accordion .accordion-content h5 {
	margin: 0 0 10px 0;
}

#network-accordion .accordion-toggle:first-child {
	border-top: none;
}

.accordion-network-content {
	padding: 0 30px;
}

/* Directory Styles /---------------- */

#contact_form {
	padding-left: 20px;
}

#directory-search-bar {
	height: 30px;
	overflow:hidden;
	background: url(../images/interface/directory-search-bar-background.png) no-repeat;
	padding: 13px 10px 10px 15px;
	margin-bottom: 20px;
	line-height: 30px;
}

#directory-search-bar h3 {
	color: white;
	margin-bottom: 0;
	float:left;
	display: inline;
	width: auto;
}

#directory-search-bar select,
#directory-search-bar button {
	display: inline;
	margin-left: 10px;
}

/*h4.branch-name {
	padding-left: 20px;
	margin-bottom: 0;
	background: url(../images/interface/arrow-small-right.png) 0 8px no-repeat;
}*/

#main_content .branch-details h5,
#main_content .branch-brands h5 {
	font-size: 100%;
	font-weight: bold;
	color: #ca0000;
}

.errors {
	padding: 10px 20px 1px 20px;
	margin: 0 0 10px 10px;
	background: #eec2c2;
	width: 500px;
	border: 2px solid #e13232;
}

#main_content .errors h4 {
	margin: 0;
}

#main_content .errors ul li {background: none;}

#contact-form-header {
	background: url(../images/interface/directory-contact-header.png) no-repeat;
	width: 509px;
	height: 75px;
	text-indent: -1000em;
}

#contact_form p small {
	color: #666;
}

#contact_form  p big {
	font-size: 125%;
}

#contact_form button {
	background: url(../images/interface/submit-enquiry-button.png) no-repeat;
	text-indent: -1000em;
	width: 166px;
	height: 23px;
	border: 0;
	padding: 0;
	margin:10px 0;
	display: block;
	cursor: pointer;
}

/* Careers Area Styles /---------------- */

.career-position {
	border-top: 1px dotted #999;
	padding-top: 10px;
	margin-bottom: 30px;
	overflow: hidden;
	clear: both;
	width: 100%;
}

.career-position h4 a {
	padding-left: 50px;
	background: url(../images/interface/arrow-right-large.png) no-repeat 20px 1px;
}

.career-position .position-meta-container {
	width: 200px;
	margin-right: 10px;
	margin-left: 20px;
	float:left;
	color: #ca0000;
}

.career-position .position-meta-container div,
#career-position .position-meta-container div {
	margin-bottom: 8px;
}

#career-position .position-meta-container {
	color: #ca0000;
	margin-bottom: 15px;
}

.career-position .position-content-container {
	width: 440px;
	float:right;
}

.position-supporting-documents h4 {
	line-height: 1;
}

#main_content .position-supporting-documents ul li {
	background: none;
	padding: 0;
}

#main_content a.apply-now-button {
	display: block;
	text-indent: -1000em;
	width: 207px;
	height: 40px;
	overflow: hidden;
	margin-top: 15px;
	background: url(../images/interface/apply-now-button.png) no-repeat 0px -40px;
}

#main_content a.apply-now-button:hover {
	background-position: 0px 0px;
}


/* Showroom Styles /---------------- */

.showroom {
	width: 720px;
	overflow: hidden;
	border-bottom: 1px solid #e5e5e5;
	margin-bottom: 30px;
	padding-bottom: 20px;
}

.showroom:last-child {border: none;} /* Progressive enhancement :) */

.showroom .showroom-item {
	width: 220px;
	height: 210px;
	margin-right: 20px;
	float: left;
	overflow: hidden;
	background: white;
}

#main .showroom .showroom-item img {
	background: white;
}

#main .showroom .showroom-item a {
	float: right;
	text-align: right;
	line-height: 16px;
	background: white url(../images/interface/arrow-right.png) no-repeat right 0px;
	padding-right: 20px;
	font-weight: bold;
	color: #666;
	margin-top: 10px;
}

#main .showroom .showroom-item a:hover {
	background-position: right -48px;
}

#main .showroom .showroom-item a.thumbnail {
	border: 1px solid #e5e5e5;
	display: block;
	float: none;
	background: none;
	padding: 0;
	margin: 0;
	height: 160px;
}

#main .showroom .showroom-item a.thumbnail:hover {
	border-color: #CA0000;
}

.showroom-meta {
	float: right;
	width: 322px;
	margin: 0 0 15px 15px;
}

img.showroom-large-image {
}

#main a.contact {
	background: url(../images/interface/contact-button-background.png);
	width: 106px;
	height: 30px;
	line-height: 30px;
	float: left;
	color: #666;
	text-indent: 10px;
}

#main a.contact:hover {
	text-decoration: none;
	background-position: 0 -30px;
}

/* File Type Icons /---------------- */

.file-type-docx,
.file-type-doc {
	background: url(../images/icons/page_white_word.png) no-repeat left top;
	padding-left: 25px;

}

.file-type-pdf {
	background: url(../images/icons/page_white_acrobat.png) no-repeat left top;
	padding-left: 25px;
}

/* Brand Banners /---------------- */

/* Toyota */	.banner-Toyota #page_banner_image 			{background: url(../images/banners/toyota.jpg) no-repeat top right;}
/* Daihatsu */	.banner-Daihatsu #page_banner_image 		{background: url(../images/banners/daihatsu.jpg) no-repeat top right;}
/* Hino */		.banner-Hino #page_banner_image 			{background: url(../images/banners/hino.jpg) no-repeat top right;}
/* Massey Furgeson */	.banner-Massey #page_banner_image 	{background: url(../images/banners/massey.jpg) no-repeat top right;}
/* Yamaha */	.banner-Yamaha #page_banner_image 			{background: url(../images/banners/yamaha.jpg) no-repeat top right;}
/* Used */		.banner-Used #page_banner_image 			{background: url(../images/banners/used.jpg) no-repeat top right;}

/* Parts */		body.section_106008 #page_banner_image		{background: url(../images/banners/parts.jpg) no-repeat top right;}
/* Service */	body.section_106007 #page_banner_image		{background: url(../images/banners/service.jpg) no-repeat top right;}
/* News */	body.section_106009 #page_banner_image		{background: url(../images/banners/news.png) no-repeat top right;}
/* Specials */	body.section_106011 #page_banner_image		{background: url(../images/banners/specials.png) no-repeat top right;}


/* Job Application Form /---------------- */

#job-application-form fieldset {
	margin-left: 70px;
}

#job-application-form .field_row {
	overflow: hidden;
	clear: both;
	padding: 5px 0;
}

#job-application-form .field_row label {
	float: left;
	width: 160px;
	text-align: right;
	line-height: 25px;
}

#job-application-form .field_row .field_input {
	float:left;
	width: 220px;
	margin-left: 10px;
	display: inline;
}

#job-application-form legend {
	font-size: 150%;
	color: #333;
	padding: 35px 0 18px 0;
	display: block;
	overflow: hidden;
	width: 100%;
	clear: both;
}

#job-application-form span.required {
	color: #ca0000;
}

#job-application-form .radio-selector-group {
	margin-left: 50px;
}

#job-application-form .radio-selector-field {
	padding: 5px 0;
}

#job-application-form .radio-selector-field label {
	padding-left: 5px;
}


#job-application-form .radio-selector-item {
	margin-left: 24px;
	padding-bottom: 30px; /* to give room for validation message */
}

#job-application-form textarea {
	width: 356px;
	height: 250px;
	font-size: 100%;
	font-family: inherit;
	line-height: inherit;
	color: inherit;
	padding: 5px;
}

#job-application-form input[type=text],
#job-application-form input[type=file] {
	width: 270px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border: 1px solid #bdbdbe;
	padding: 3px 7px;
	background: #f3f4f5;
}

#job-application-form input.validation-failed {
	border: 1px solid #e43939;
}

#job-application-form input.validation-passed {
	border: 1px solid #98cd60;
	background: #ecf5e9;
}

#job-application-form input[type=text]:focus,
#job-application-form input[type=file]:focus,
#job-application-form input[type=text]:active,
#job-application-form input[type=file]:active {
	background: white;
	border: 1px solid #b6b6b6;
}

#job-application-form input[type=file] {
	width: 366px;
}

#job-application-form button {
	margin: 50px 0 0 70px;
	border: none;
	display: block;
	background: none;
	padding: none;
	cursor: pointer;
	text-indent: -1000em;
	width: 207px;
	height: 40px;
	overflow: hidden;
	background: url(../images/interface/submit-application-button.png) no-repeat 0px -40px;
}

#job-application-form button:hover {
	background-position: 0px 0px;
}

#job-application-form .support {
	color: #666;
	font-size: 80%;
	padding: 5px 0;
	margin: 0;
}

#job-application-form ul.field-errors {
	background: #f4c0c0;
	padding: 10px;
	width: 423px;
	margin-left: 70px;
	border: 1px solid #e43939;
	margin-bottom: 0;
}

#job-application-form ul.field-errors li {
	background: none;
}

#job-application-form .validation-advice {
	background:  url(../images/interface/arrow-up-red.png) no-repeat 5px 4px;
	padding-left: 30px;
	color: #9a2525;
	width: 500px;
}