/**
 * @author       ecomplexx, www.ecomplexx.com
 * @version      $Revision: 34 $ 
 * @date         $Date: 2009-10-09 15:32:41 +0200 (Fr, 09 Okt 2009) $
 */

/* -- Clearfix ------------------------------------------------------------- */
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}


/* -- Basic styles --------------------------------------------------------- */
body {
	background: #d0d2d6 url(../images/background.jpg) left top repeat-x;
	color: #666;
	font: 12px/16px Arial, sans-serif;
	margin: 0;
	padding: 0;
}
body#iframe { background: #fff none; }

a {
	color: #666;
	cursor: pointer;
	}
	a:hover { text-decoration: underline; }

.arrow {
	background: url(../images/arrow_small_gray.png) left 0.45em no-repeat;
	padding-left: 10px;
}


#wrap {
	margin: 0 auto;
	position: relative;
	width: 960px;
	z-index: 10;
}

#header {
	height: 106px;
	position: relative;
}

#logo {
	position: absolute;
	right: 20px;
	top: 47px;
}

#claim {
	left: 20px;
	position: absolute;
	top: 65px;
}

.shadow-234 li,
.shadow-502 li,
.shadow-718 li {
	background: url(../images/arrow_small_red.png) left 0.55em no-repeat;
	margin-bottom: 0.55em;
	padding-left: 12px;
	}

#fancybox-title { text-align: left; }
	
/* -- Meta-Navigation ------------------------------------------------------ */
#nav-meta-container {
	background-color: #e2e3e6;
	margin: 0 4px;
	padding: 0 8px;	
	}

	#nav-meta-container li {
		float: left;
		padding: 7px 10px 7px 7px;
	}

#nav-meta { float: right; }

#nav-meta-sections {
	float: left;
	background: url(../images/nav_meta_sections_right.png) right top no-repeat;
	padding-right: 2px;
	}

	#nav-meta-sections li {
		background: url(../images/nav_meta_sections.png) left top no-repeat;
		}
		li#section-start               { background-image: none; }
		li#section-about               { background-position: 0 0; }
		li#section-about.active        { background-position: 0 -40px; }
		li#section-industry            { background-position: 0 -80px; }
		li#section-industry.active     { background-position: 0 -120px; }
		li#section-professional        { background-position: 0 -160px; }
		li#section-professional.active { background-position: 0 -200px; }
		li#section-diy                 { background-position: 0 -240px; }
		li#section-diy.active          { background-position: 0 -280px; }


/* -- Main Navigation ------------------------------------------------------ */	
#title {
	background: #bd0823 url(../images/title_background.png) 0 -70px no-repeat;
	height: 30px;
	}

	#title h1 {
		color: #fff;
		float: left;
		font-weight: bold;
		line-height: 30px;
		padding-left: 15px;
		text-transform: uppercase;
	}

#nav-top ul {
	background: url(../images/nav_top_background.png) top left no-repeat;
	width: 100%;
	}
	
	#nav-top ul li {
		background: url(../images/nav_top_right.png) top right no-repeat;
		float: left;
		line-height: 30px;
		padding: 0 15px;
		text-transform: uppercase;
		}
		
		#nav-top li.active a {
			color: #E31937;
		}
		
		#nav-top ul li a { font-weight: bold; }


/* -- Left Navigation ------------------------------------------------------ */	
#nav-left {
	width: 208px;
	margin-right: 8px;
	float: left;
	}

	#nav-left li {
		font-weight: bold;
		background: #e5e6e9 url(../images/title_background.png) 0 0 no-repeat;
		}

		#nav-left li.productnav { background-position: 0 -420px; }
		#nav-left li.productnav span { float: left; }
		#nav-left li.productnav a { float: right; }
	
		#nav-left li a {
			background: url(../images/arrow_large_gray.png) 5px 9px no-repeat;
			padding: 5px 10px 5px 20px;
			display: block;
			}
			
			#nav-left li a dfn {
				display: block;
				font-size: 11px;
			}

		#nav-left li ul {
			background: #fff;
			padding: 15px;
			}
			#nav-left li ul ul { padding: 0 0 5px 15px; }

		#nav-left li li {
			line-height: 20px;
			font-weight: normal;
			background: none;
			margin-left: 0;
			}

			#nav-left li li a {
				background: none;
				line-height: 20px;
				padding: 3px 0 3px 0;
				height: auto;
			}

		#nav-left li.active {
			background-position: 0 -70px;
			background-color: #BE0823;
			}
			
			#nav-left li.active li.active{
				background: none;
			}
		
			#nav-left li.active a {
				color: #fff;
				background: url(../images/arrow_large_white.png) 5px 9px no-repeat;
			}
	
			#nav-left li.active li a,
			#nav-left li.active li.active li a {
				color: #666;
				background: none;
			}
			#nav-left li.active li.active a,
			#nav-left li.active li.active li.active a { color: #e31937; }
			
	#nav-left small {
		display: block;
		font-size: 12px;
		line-height: 14px;
		margin: 15px 7px 0;
	}
	
	#nav-left .guided-nav li li a, #nav-left .guided-nav li li { line-height: 14px; }
	#nav-left .guided-nav li ul { padding-top: 10px; padding-bottom: 10px; }		
	
	
/* -- Search --------------------------------------------------------------- */
	.default-value { color: #666; }
	
	#search,
	#dealerlocator {
		display: block;
		float: right;
		padding: 5px 15px 0px 15px;
		}
		
		#search label,
		#dealerlocator label {
			display: none; /* Shown via JS */
		}
		
		#search input,
		#dealerlocator input {
			font-size: 11px;
			line-height: 11px;
		}
		
		#search .query,
		#dealerlocator .query {
			border: 1px solid #b4b4b4;
			float: left;
			margin-right: 5px;
			padding: 2px 5px;
			width: 182px;
		}
		
		#search .submit,
		#dealerlocator .submit {
			background: #fff url(../images/search_button.png) center center no-repeat;
			border: 0 none;
			height: 19px;
			margin: 0;
			overflow: hidden;
			padding: 0;
			text-indent: -200px;
			width: 20px;
			cursor: pointer;
		}


/* -- Dealer locator ------------------------------------------------------- */
#dealerlocator {
	float: none;
	padding: 5px 0;
	}

	#dealerlocator .query { width: 160px; }


/* -- Content -------------------------------------------------------------- */
#breadcrumb {
	margin: 17px 0;
	padding: 0 4px;
	}
	
	#breadcrumb li { display: inline-block;	}
	#breadcrumb span {
		margin: 0 5px;
		font-weight: bold;
	}
	
	#breadcrumb a { margin: 0 5px; }
	#breadcrumb a.home { margin: 0 5px 0 0; }


h2#welcome {
	color: #7b7e83;
	font-size: 20px;
	font-weight: normal;
	height: 50px;
	line-height: 50px;
	padding: 0 4px;
	margin: 0;
	text-align: right;
}

#content {
	width: 502px;
	float: left;
	margin-right: 8px;
}

#home #content, #content-wide-all {
	width: auto;
	float: none;
	margin-right: 0;
	}
	#home #content a { color: #666; }

#content-wide {
	width: 718px;
	float: left;
	margin-right: 8px;
}

#content-wide-nav {
	width: 734px;
	float: left;
}

#content .arrow,
#sidebar .arrow {
	background: url(../images/arrow_small_red.png) left center no-repeat;
	color: #e31937;
}

#content a,
#sidebar a {
	color: #e31937;
}
	
#sidebar {
	width: 234px;
	float: left;
}
#sidebar .shadow-234-bottom { /*margin-bottom: 1em;*/ }


/* -- Footer --------------------------------------------------------------- */
#footer {
	border-top: 1px solid #b5b7bb;
	line-height:11px;
	margin-top: 50px;
	padding: 15px 0 30px;
	}

	#footer span { text-transform: uppercase; }
	
	#footer ul {
		float: right;
		margin-right: -10px;
	}

		#footer ul li {
			border-left: 1px solid #666;
			float: left;
			padding: 0 10px;
		}
		#footer ul li.first { border-left: 0 none; }


/* -- International Landing Page ------------------------------------------- */
#international h2,
#international h3 {
	background: #e5e6e9 url(../images/title_background.png) 0 0 no-repeat;
	font-size: 12px;
	font-weight: bold;
	line-height: 30px;
	padding: 0 10px;
	margin: 0;
}

#continent-sections {
	float: left;
	background: url(../images/international_meta_sections_right.png) right top no-repeat transparent;
	padding-right: 2px;
}

#continent-container li {
	float: left;
	padding: 11px 25px 7px 12px;
}

#content #continent-sections .arrow{
	background-image: url(../images/arrow_small_gray.png);
		font-weight: bold;
}


#continent-container {
	margin: 0px;
	padding-left: 3px;
	background: url(../images/shadow_960_top.png) no-repeat bottom left transparent;
}
	#continent-sections li {
		background: url(../images/international_meta_sections.png) no-repeat scroll left top transparent;
	}
	
	#continent-sections li.active{
		background-position: 0px -46px;
	}

#continents {
	padding: 18px 0 28px;
	background: #f1f1f1 url(../images/international.jpg) 0 0 no-repeat;
	height: 606px;
	}
	
	#continents .countrylist div {
		width: 178px;
		float: left;
		margin-left: 10px;
	}
	#continents div.first { margin-left: 0; }
	
	ul.countries li {
		background: #fff;
		padding: 5px 8px;
		margin-bottom: 5px; 
		}
		
		ul.countries li img {
			margin-top: 3px;
			float: left;
		}
		
	ul.languages { margin-left: 25px; }
		
		ul.languages li {
			padding: 0;
			/* margin-bottom: 0; */
		}

	* html #international h2,
	* html ul.countries li,
	*:first-child+html ul.countries li { zoom:1; }

	* html ul.languages,
	*:first-child+html ul.languages {
		margin-left: 5px;
		float: left;
	}

		
		
		
/* -- Shadows -------------------------------------------------------------- */
.shadow-960-top    { width: 960px; height: 4px; background: url(../images/shadow_960_top.png) left top no-repeat; }
.shadow-960        { padding: 0 4px; background: url(../images/shadow_960.png) left top repeat-y; }
.shadow-960-bottom { width: 960px; height: 4px; background: url(../images/shadow_960_bottom.png) left top no-repeat; }

.shadow-718-top    { width: 718px; height: 4px; background: url(../images/shadow_718_top.png) left top no-repeat; }
.shadow-718        { padding: 0 4px; background: url(../images/shadow_718.png) left top repeat-y; }
.shadow-718-bottom { width: 718px; height: 4px; background: url(../images/shadow_718_bottom.png) left top no-repeat; }

.shadow-734-top    { width: 734px; height: 4px; background: url(../images/shadow_734_top.png) left top no-repeat; }
.shadow-734        { padding: 0 4px; background: url(../images/shadow_734.png) left top repeat-y; }
.shadow-734-bottom { width: 734px; height: 4px; background: url(../images/shadow_734_bottom.png) left top no-repeat; }

.shadow-734-statement-top    { width: 734px; height: 4px; background: url(../images/shadow_734_top.png) left top no-repeat; }
.shadow-734-statement        { padding: 0 4px; background: url(../images/shadow_734.png) left top repeat-y; }
.shadow-734-statement-bottom { width: 734px; height: 4px; background: url(../images/shadow_734_bottom.png) left top no-repeat; }

/*
.shadow-708-top    { width: 708px; height: 4px; background: url(../images/shadow_708_top.png) left top no-repeat; }
.shadow-708        { padding: 0 4px; background: url(../images/shadow_708.png) left top repeat-y; }
.shadow-708-bottom { width: 708px; height: 4px; background: url(../images/shadow_708_bottom.png) left top no-repeat; }
*/

.shadow-502-top    { width: 502px; height: 4px; background: url(../images/shadow_502_top.png) left top no-repeat; }
.shadow-502        { padding: 0 4px; background: url(../images/shadow_502.png) left top repeat-y; }
.shadow-502-bottom { width: 502px; height: 4px; background: url(../images/shadow_502_bottom.png) left top no-repeat; }

.shadow-492-top    { width: 492px; height: 4px; background: url(../images/shadow_492_top.png) left top no-repeat; }
.shadow-492        { padding: 0 4px; background: url(../images/shadow_492.png) left top repeat-y; }
.shadow-492-bottom { width: 492px; height: 4px; background: url(../images/shadow_492_bottom.png) left top no-repeat; }

.shadow-234-top    { width: 234px; height: 4px; background: url(../images/shadow_234_top.png) left top no-repeat; }
.shadow-234        { padding: 0 4px; background: url(../images/shadow_234.png) left top repeat-y; }
.shadow-234-bottom { width: 234px; height: 4px; background: url(../images/shadow_234_bottom.png) left top no-repeat; }
/*
.shadow-240-top    { width: 240px; height: 4px; background: url(../images/shadow_240_top.png) left top no-repeat; }
.shadow-240        { padding: 0 4px; background: url(../images/shadow_240.png) left top repeat-y; }
.shadow-240-bottom { width: 240px; height: 4px; background: url(../images/shadow_240_bottom.png) left top no-repeat; }
*/

.shadow-208-top    { width: 208px; height: 4px; background: url(../images/shadow_208_top.png) left top no-repeat; }
.shadow-208        { padding: 0 4px; background: url(../images/shadow_208.png) left top repeat-y; }
.shadow-208-bottom { width: 208px; height: 4px; background: url(../images/shadow_208_bottom.png) left top no-repeat; }