/* ---------------------------------------------------

Color Ref: #3C2A95 - Green
Color Ref: #EEEEEE - Light Grey
Color Ref: #000000 - Black
Color Ref: #FFFFFF - White

/* ---------------------------------------------------- Layout Div's --- */


html, body {
	height: 100%; margin: 0; padding: 0; 
}
body {
	 text-align: left; font: 77%/180% Arial, Helvetica, sans-serif; color: #333333; background: #FFFFFF url("../images/bg_container2.gif") no-repeat fixed center top;
}


/* ---------------------------------------------------- Fonts --- */

#content p {
	font-size: 13px;
	line-height: 180%;
}
#content strong {
	font-size: 14px;
}
#mainFooter p {
	font-size: 12px;
}
#content ul li {
	font-size: 13px	
}
h1 {
	font-size: 130%; 
}
h2 {
	font-size: 130%;
}
h3 {
	font-size: 110%;
}
h4 {
	font-size: 105%
}


/* ---------------------------------------------------- Layout Div's --- */

#siteWrapper {
	width: 770px; height: 100%; margin: 0px auto 0px auto; padding: 0px;
}
#header {
	width: 770px; height: 140px; margin: 0px; padding: 0px;
}
#contentWrapper {
	width: 770px; margin: 0px; padding: 0px; 
}
#subColumn {
	width: 200px; margin: 0px; padding: 0px; float: left; border: none;
}
#mainColumn {
	width: 570px; margin: 0px; padding: 0px; float: left;
}
#location {
	margin: 40px 40px 10px 40px; padding: 10px; border: 1px solid #CCCCCC; color: #333333;
}
#content {
	margin: 40px 50px 40px 50px;
}
#contentsubColumnMain {
	margin: 30px 0px 30px 0px;
}
#contentSubColumnLeft {
	margin: 0px 20px 0px 0px; float: left; width: 215px; 
}
#contentSubColumnRight {
	margin: 0px 0px 0px 20px; float: left; width: 215px; 
}
#contentSubColumnClear {
	clear: both; margin: 0px; line-height: 0px;
}
.horizRule {
	margin-top: 40px; margin-bottom: 30px; height: 10px; border-top: 1px solid #3C2A95;
}
#imageLinks {
	margin: 0px; padding: 20px 0px 20px 0px; color: #FFFFFF; background: #4B972B
}
#otherInformation {
	margin: 0px; padding: 10px 0px 10px 20px; color: #000000; 
}
#footer {
	margin: 40px 0px 20px 0px; padding: 10px; border-top: 1px solid #3C2A95; color: #666666;
}
#mainFooter {
	width: 770px; clear: both; margin: 0px auto 0px auto; padding: 20px 0px 40px 0px; border-top: 1px solid #3C2A95; background: #FFFFFF url("../images/logo_bottom.gif") no-repeat 586px 30px;
}



/* ---------------------------------------------------- Link styling --- */



#content a {
	color: #3C2A95; text-decoration: underline
}
#content a:hover {
	color: #000000; text-decoration: none
}

#mainFooter a {
	color: #3C2A95; text-decoration: underline
}
#mainFooter a:hover {
	color: #666666; text-decoration: none
}

#content a.button {
	display: block; padding-left: 25px; font-size: 15px; font-weight: bold; background: #3C2A95 url("../images/bg_rnd_btn.gif") no-repeat left top; margin-bottom: 8px; width: 175px; color: #FFFFFF; line-height: 25px; height: 25px; text-decoration: none
}
#content a.button:hover {
	text-decoration: underline; color: #FFFFFF
}

#content a.map {
	display: block; padding-left: 25px; background: #3C2A95 url("../images/bg_map_btn.gif") no-repeat left top; margin-bottom: 8px; width: 175px; color: #FFFFFF; line-height: 25px; height: 25px; text-decoration: none
}
#content a.map:hover {
	text-decoration: underline; color: #FFFFFF
}

#content a.PDF {
	color: #3C2A95; padding-left: 20px; font-weight: bold; background: url("../images/pdf.gif") no-repeat left center;
}
#content a.PDF:hover {
	color: #000000;
}


#content a.flash {
	color: #3C2A95; padding-left: 20px; font-weight: bold; background: url("../images/flash.gif") no-repeat left center;
}
#content a.flash:hover {
	color: #000000;
}

#otherInformation a {
	color: #3C2A95; text-decoration: underline
}
#otherInformation a:hover {
	color: #000000; text-decoration: none
}

#location a {
	color: #3C2A95; text-decoration: underline;
}
#location a:hover {
	color: #333333; text-decoration: none
}


/* ---------------------------------------------------- typography styling --- */

h1 {
	font-weight: bold; margin-bottom: 30px; color: #000000; 
}
h2 {
	font-weight: bold; margin-bottom: 30px; margin-top: 30px; color: #3C2A95;
}
h3 {
	font-weight: bold; margin-bottom: 30px; margin-top: 30px; color: #333333
}
#otherInformation p {
	text-align: justify;
}
#location p {
	padding: 0px; margin-top: 5px; margin-bottom: 5px; line-height: 0px; font-size: 12px;
}
#footer p {
	padding: 0px;
}
#mainFooter p {
	padding: 0px 20px 0px 20px; line-height: 180%; color: #666666;
}

/* ------------------------------------------------------ other styling --- */

#content ul#basicList {
	list-style: none;
	margin: 0px;
	padding: 0px;
}
#content ul#basicList li {
	background: url("../images/list_item.gif") no-repeat 0px 50%;
	margin-left: 20px;
	padding: 6px 10px 6px 20px;
	font-weight: bold;
}


/* ------------------------------------------------------ header --- */

#header h1 {
	margin: 0px; padding: 23px 0px 10px 30px; font: normal 22px/32px Arial, Helvetica, Verdana, sans-serif; color: #FFFFFF; text-align: left
}
#header h1 a {
	color: #3C2A95; text-decoration: none;
}
#header h1 a:hover {
	color: #FFFFFF; text-decoration: none
}
.wheelCylinder {
	background: #333333 url("../images/wheel_cylinder2.jpg") no-repeat left top;
}
.masterCylinder {
	background: #333333 url("../images/master_cylinders.jpg") no-repeat left top;
}
.clutchCylinder {
	background: #333333 url("../images/clutch_slave.jpg") no-repeat left top;
}
.discs {
	background: #333333 url("../images/discs.jpg") no-repeat left top;
}
.pads {
	background: #333333 url("../images/brake_pads.jpg") no-repeat left top;
}
.caliper {
	background: #333333 url("../images/brake_caliper.jpg") no-repeat left top;
}
.caliper2 {
	background: #333333 url("../images/brake_caliper2.jpg") no-repeat left top;
}
.drums {
	background: #333333 url("../images/drums.jpg") no-repeat left top;
}
.contact {
	background: #333333 url("../images/contact.jpg") no-repeat left top;
}
.suppliers {
	background: #333333 url("../images/master_cylinders.jpg") no-repeat left top;
}
.budweg {
	background: #333333 url("../images/budweg.jpg") no-repeat left top;
}
.bremtech {
	background: #333333 url("../images/bremtech.jpg") no-repeat left top;
}
.roulunds {
	background: #333333 url("../images/roulunds.jpg") no-repeat left top;
}
.sachs {
	background: #333333 url("../images/sachs.jpg") no-repeat left top;
}
.noFlash {
	background-color: #CC0000;
}


/* ------------------------------------------------------ technical abbreviations table --- */


table#techAbbrev, table#accessKeyTable {
	margin-top: 30px;
	margin-bottom: 30px;
}
table#techAbbrev thead tr, table#accessKeyTable thead tr {
	background: #3C2A95; color: #FFFFFF; font-size: 14px; font-weight: bold;
}
table#techAbbrev thead th, table#accessKeyTable thead th {
	padding: 0.5em;
	white-space: nowrap;
}
table#techAbbrev tr, table#accessKeyTable td {
	background-color: #EBEBEB;
}
table#techAbbrev tr.odd, table#accessKeyTable tr.odd{
	background-color: #DBDBDB;
}
table#techAbbrev td, th, table#accessKeyTable td{
	/*border: 1px dotted #CCCCCC;*/
}
table#techAbbrev tbody td, table#accessKeyTable tbody td {
	padding: 0.5em;
}


/* ------------------------------------------------------ other styling --- */

.red {
	color: #FF0000;
}
.green {
	color: #3C2A95;
}
.blue {
	color: #0099CC;
}
.yellow {
	color: #FFCC00;
}
img.imageLeft {
	padding: 0px 20px 0px 0px;
}
img.imageRight {
	padding: 0px 20px 0px 0px;
}
.defaultSample {
	font-size: 13px;
}
.mediumSample {
	font-size: 15px;
}
.largeSample {
	font-size: 17px;
}
acronym {
	cursor: help;
}


/* ------------------------------------------------------ feature box  --- */


#featureBox {
	margin: 20px 0px 20px 0px; padding: 20px; /*border: 1px solid #999999;*/ color: #333333;
}
#featureBox h2 {
	font-weight: bold; margin-bottom: 20px; margin-top: 0px;
}
#featureBox p {
	line-height: 180%;
	margin-bottom: 0px
}
h2.important {
	background: url("../images/important.gif") no-repeat left center;
	padding-left: 30px;
}
h2.information {
	background: url("../images/information.gif") no-repeat left center;
	padding-left: 30px;
}
h2.pdfInformation {
	background: url("../images/pdfinformation.gif") no-repeat left center;
	padding-left: 30px;
}


/* ------- feature box Interest class --- */

.featureBoxInterest {
	border: 1px solid #FFCC00; background: #FFFAE6;
}
.featureBoxInterest H2 {
	color: #333333;
}

/* ------- feature box Information class --- */

.featureBoxInformation {
	border: 1px solid #40C1FF; background: #ECF9FF;
}
.featureBoxInformation H2 {
	color: #333333;
}

/* ------- feature box pdfInformation class --- */

.featureBoxpdfInformation {
	border: 1px solid #FF0000; background: #FFFFFF;
}
.featureBoxpdfInformation H2 {
	color: #000000;
}


/* --------------------------------------------------- upper navigation styles --- */


#upperNavigation {
	width: 770px; height: 60px; padding: 28px 0px 0px 0px; font: normal 13px/1em Verdana, Arial, Helvetica, sans-serif; text-align: right; background: #FFFFFF url("../images/logo_top.gif") no-repeat left center; color: #333333;
}
#upperNavigation em {
	text-decoration: underline; font-style: normal
}
#upperNavigation a:hover {
	color: #3C2A95; text-decoration: underline
}
#upperNavigation a {
	color: #333333; text-decoration: none
}



/* --------------------------------------------------- main navigation styles --- */



#mainNavigation {
	width: 100%; margin: 0px; padding: 0px; float: left; background: #3C2A95 url("../images/bg_mainnav.gif") repeat-x left top;
}
.navigation {
	margin: 0px; padding: 0px 0px 0px 200px; 
}




/* --------------------------------------------------- drop down styling --- */

ul#navMenu {
  margin: 0; border: none; padding: 0; width: 570px; /*For KHTML*/ font-size: 13px; line-height: 22px;
}

ul#navMenu a.active {
	color: #666666 !important; background: #FFFFFF !important;
}

ul#navMenu em {
	text-decoration: underline; font-style: normal;
}

ul#navMenu ul {
  	margin: 0px; padding: 0px; width: 150px; list-style: none; display: none; position: absolute; top: 36px; left: 0px; height: 100%;
}

ul#navMenu li {
  	margin: 0px; padding: 0px; float: left; display: inline; list-style: none; position: relative; list-style-type: none; width: auto;
}

ul#navMenu ul li {
	float: none display: block !important; display: auto; height: 100%; width: 100%; /*For IE*/
}

/* Root Menu */
ul#navMenu a {
	padding: 7px 11px 7px 11px; color: #FFFFFF; text-decoration: none; float: left; height: auto !important; height: 100%;
	background-image: url("../images/nav_separator.gif"); background-repeat: no-repeat; background-position: right center;
}

/* Root Menu Hover Persistence */
ul#navMenu a:hover,
ul#navMenu li:hover a,
ul#navMenu li.iehover a,
ul#navMenu li:hover li a:hover,
ul#navMenu li:hover li:hover a,
ul#navMenu li.iehover li a:hover,
ul#navMenu li.iehover li.iehover a {
	background-color: #366B1F; background-image: none; color: #FFFFFF;
}


/* 2nd Menu */
ul#navMenu li:hover li a,
ul#navMenu li.iehover li a {
	display: block; float: none; background: #3C2A95; border-top: 1px solid #FFF; color: #FFFFFF;
}

/* 2nd Menu Hover Persistence */
ul#navMenu li:hover li a:hover,
ul#navMenu li:hover li:hover a,
ul#navMenu li.iehover li a:hover,
ul#navMenu li.iehover li.iehover a {
	float: none;
	margin: 0px;
  	background: #366B1F;
  	color: #FFF;
}

/* 3rd Menu */
ul#navMenu li:hover li:hover li a,
ul#navMenu li.iehover li.iehover li a {
 	background: #3C2A95;
  	color: #FFF;
	border-left: 1px solid #FFFFFF;
}

/* 3rd Menu Hover Persistence */
ul#navMenu li:hover li:hover li a:hover,
ul#navMenu li:hover li:hover li:hover a,
ul#navMenu li.iehover li.iehover li a:hover,
ul#navMenu li.iehover li.iehover li.iehover a {
  	background: #366B1F;
  	color: #FFF;
}

ul#navMenu ul ul {
  	display: none; position: absolute; top: 0px; left: 150px; margin: 0px; 
}

/* Do Not Move - Must Come Before display:block for Gecko */
ul#navMenu li:hover ul ul,
ul#navMenu li.iehover ul ul {
  	display: none;
}

ul#navMenu li:hover ul,
ul#navMenu ul li:hover ul,
ul#navMenu li.iehover ul,
ul#navMenu ul li.iehover ul {
  	display: block;
}


 --------------------------------------- sitemap first (main) level --- */

ul#sitemap {
	margin: 10px 0; list-style-type: none; background: url("../img/dot_vertical.gif") repeat-y 3px 0px; padding: 0;
}
ul#sitemap li { 
	margin-bottom: 10px; 
}
ul#sitemap li a {
	background: url("../img/bullet.gif") no-repeat 0 4px; padding-left: 15px;
}
ul#sitemap li a.open, ul#sitemap li li a.open, ul#sitemap li li li a.open { 
	background: url("../img/bullet_open.gif") no-repeat left center; 
}
	
/* --------------------------------------- sitemap second (sub) level --- */

ul#sitemap ul {
	margin: 10px 0 0 0; padding: 0; list-style-type: none;
}	
ul#sitemap li li { 
	background: url("../img/dot_horizontal.gif") no-repeat 2px 12px; 
}
ul#sitemap li li a {
	padding: 0 0 0 60px; background: url("../img/bullet.gif") no-repeat 50px;
}
	
/* --------------------------------------- sitemap third (sub) level --- */

ul#sitemap ul ul { 
	background: url("../img/dot_vertical.gif") repeat-y 60px 0; 
}
ul#sitemap li li li { 
	background: url("../img/dot_horizontal.gif") no-repeat 60px; 
}
ul#sitemap li li li a {
	padding: 0 0 0 125px; background: url("../img/bullet.gif") no-repeat 110px;
}


/* ------------------------------------------------------ for testing purposes only  --- */

.supplyContent {
	font-weight: bold;
	color: #FF6600;
	text-decoration: underline;
}