/**
  * Standaard-stylesheet voor Roveron
  *
  * @copyright 2009 Slik BV  * @version $Id$
  */


/*******************************************************************************************

		RESETCODE VOOR BROWSER COMPATIBILITEIT 
		reset.css - by Eric Meyer | v1.0 | 20080212

*******************************************************************************************/

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,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,q:before, q:after {	content: ''; content: none; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }
h1 span, h2 span { display: none;}
input { border: none; }
.clear { clear: both;}

/*******************************************************************************************

		STANDAARD STYLING

*******************************************************************************************/

body { 
	background: #E6E7EB;
	font-family: Arial, Verdana;
	font-size: 11px; }

a { color: #8596B1; text-decoration: none; }
a:hover { color: #5F6F8A; text-decoration: none; }
h1 { font-size: 20px; text-transform: uppercase; }
h2 { font-size: 18px; }
h3 { font-size: 16px; }
h4 { font-size: 14px; }
p { line-height: 18px; }

blockquote { color: #5F6F8A; font-style: italic; }
input, textarea, select { 
	font-family: Arial, Verdana;
	font-size: 11px;
	width: 300px;
	border: 1px solid #C7C8CC;
	padding: 4px; }
select { width: 310px; }
textarea { width: 100%; }
input.button { 
	background: url(../gfx/button.gif) no-repeat;
	width: 142px;
	display: block;
	color: white;
	font-weight: bold;
	margin: 10px 0 0 -5px;
	border: none;
	cursor: pointer;
	padding-bottom: 16px;
	height: 45px; }
	input.button:hover { background-position: 0 -45px; }
span.required { 
	font-family: georgia;
	color: red;
	padding-left: 3px;
	font-size: 14px; }
select, textarea {  }
label { display: block; padding: 5px 0 5px 0; }
.redborder { border: 1px solid #D74343; }
.none { display: none; }
 
/*******************************************************************************************

		HEADER 

*******************************************************************************************/

#header { 
	height: 136px;
	background: url(../gfx/header_bg.gif) repeat-x; }
body#vervolg #header {
	height: 245px;
	background: url(../gfx/header_vervolg_bg.gif) repeat-x; }
	body#vervolg #header.en { height: 170px; }
	#headerContainer { 
		width: 960px; 
		margin: 0 auto;
		position: relative; }
	body#vervolg #headerContainer {
		width: 100%;
		background: url(../gfx/headerContainer_vervolg_bg.gif) no-repeat center;
		display: block;
		height: 245px; }
		body#vervolg #headerContainer.en {
			height: 180px;
			background: url(../gfx/headerContainer_vervolg_bg_en.gif) no-repeat center; }
		body#vervolg #headerContainer .content { 
			margin: 0 auto;
			width: 960px; }
		#headerContainer .logo {
			float: left;
			margin-left: 20px;
			margin-top: 38px;
			background: url(../gfx/logo.gif) no-repeat;
			width: 249px;
			height: 97px; }
			#headerContainer .logo a { display: block; width: 250px; height: 40px; }
			.logo span { display: none; }
		#vervolg #headerContainer .logo { background: url(../gfx/logo_vervolg.gif) no-repeat; }
			#vervolg #headerContainer #en.logo { background: url(../gfx/logo_vervolg_en.gif) no-repeat; }
		#headerContainer ul#metanavigation { 
			width: 650px;
			float: right;
			padding-top: 23px; }
		body#vervolg #headerContainer ul#metanavigation { padding-top: 76px; }
			#headerContainer ul#metanavigation li { 
				float: right;
				padding-left: 33px; }
				#headerContainer ul#metanavigation li#nl { padding: 2px 0 0 10px; }
				#headerContainer ul#metanavigation li#en { padding-top: 2px; }
				#headerContainer ul#metanavigation li a { 
					color: #496CA1;
					font-size: 16px;
					text-transform: uppercase;
					font-weight: bolder; }
					#headerContainer ul#metanavigation li a.current { color: #B23B00; }
				body#vervolg #headerContainer ul#metanavigation li a { color: white; }
					#headerContainer ul#metanavigation li a:hover { color: #B23B00; } 
					body#vervolg #headerContainer ul#metanavigation li a:hover { color: #C7C8CC; } 
				body#vervolg #headerContainer ul#metanavigation li a.current { color: #C8D4E7; }
					
/*******************************************************************************************

		NAVIGATION 

*******************************************************************************************/
	.noscript { background: white; }
	.noscript ul { background: #496ca1; width: 100%; height: 32px; }					
	.noscript ul li { display: inline; }					
		.noscript ul li a { 
			display: block; 
			float: left; 
			padding: 10px; 
			background: #496ca1;
			color: white;
			font-weight: bold;  }
	.noscript h1 { padding: 10px; }
	.noscript p { padding: 10px; }
	ul#navigation { 
		background: url(../gfx/navigation.gif) no-repeat;
		width: 932px;
		height: 72px;
		padding: 1px 8px 14px 20px; }
	#vervolg ul#navigation { 
		position: absolute;
		bottom: 0;
		margin-top: 22px; }
		/* Navigation level 1 */
		ul#navigation li { 
			float: left;
			display: block;
			height: 66px;
			padding: 20px 20px 0 20px;
			width: 191px; }
			/* Navigation hover */
			ul#navigation li:hover, ul#navigation li.hover  { 
				background: url(../gfx/navigation_hover.gif) no-repeat;
				cursor: pointer; }
			ul#navigation li.current { 
				background: url(../gfx/navigation_active.gif) no-repeat;
				cursor: pointer; }
				/* #mainContainer ul#navigation li:hover a, #mainContainer ul#navigation li.hover a {
					color: #496CA1; } */
				/* Navigation titel */
				ul#navigation li a span  {
					font-size: 16px;
					text-transform: uppercase;
					font-weight: bold;
					color: #B23B00;}
			/* Navigation level 2 */
			ul#navigation li ul { 
				padding-top: 10px; }
				ul#navigation li ul li { 
					display: inline;
					border: none;
					float: none;
					padding: 0; }
					ul#navigation li ul li:hover, 
					ul#navigation li ul li.hover { background: none; }
					ul#navigation li ul li a { color: #09133B; }
					ul#navigation li ul li.current { background: none; }

/*******************************************************************************************

		MAIN 

*******************************************************************************************/

#main { 
	background: #496CA1;
	color: white; }
	body#vervolg #main { color: black; }
	body#vervolg.en #main { padding-bottom: 30px; }
	#mainContainer { 
		position: relative;
		width: 960px; 
		margin: 0 auto; }
	body#vervolg #mainContainer { 
		width: 922px;
		padding: 23px 15px 0 23px; }
		#mainContainer .intro { 
			float: left;
			padding-left: 20px;
			width: 449px; }
			.intro h4 { 
				margin: 25px 0 25px 0;
				background: url(../gfx/slogan.gif) no-repeat;
				width: 436px;
				height: 58px; }
				.intro h4.en { 
					background: url(../gfx/en_slogan.gif) no-repeat;
					height: 64px; }
				.intro h4 span { display: none; }
			.intro p { padding: 0 0 25px 0 ; }
			.intro a { color: #BCD1F0; } 
		#mainContainer .slideshow { 
			position: absolute;
			right: 0;
			top: -80px;
			width: 492px;
			height: 318px; }
	body#vervolg #main { background: #E6E7EB; }
		body#vervolg #mainContainer { 
			background: white;
			border-left: 1px solid #C7C8CC;
			border-right: 1px solid #C7C8CC; }
		#mainContainerBottom {
			margin: 0 auto;
			background: url(../gfx/mainContainer_bottom.gif) no-repeat;
			width: 960px;
			height: 11px; }
			
	/* Categorieën */
	#mainContainer .categorie {
		float: left;
		width: 416px;
		height: 127px;
		margin-left: 20px;
		color: white;
		padding: 0 25px 17px 0;
		background: url(../gfx/categorie.jpg) no-repeat; }
		#mainContainer .categorie.trekveer { background: url(../gfx/veren/categorie_trekveer.jpg) no-repeat; }
		#mainContainer .categorie.drukveer { background: url(../gfx/veren/categorie_drukveer.jpg) no-repeat; }
		#mainContainer .categorie.bladveren { background: url(../gfx/veren/categorie_bladveer.jpg) no-repeat; }
		#mainContainer .categorie.torsieveren { background: url(../gfx/veren/categorie_torsieveren.jpg) no-repeat; }
		#mainContainer .categorie.schotelveren { background: url(../gfx/veren/categorie_schotelveren.jpg) no-repeat; }
		#mainContainer .categorie.stempelveren { background: url(../gfx/veren/categorie_stempelveren.jpg) no-repeat; }
		#mainContainer .categorie.rolveren { background: url(../gfx/veren/categorie_rolveren.jpg) no-repeat; }
		#mainContainer .categorie.draadveer { background: url(../gfx/veren/categorie_draadveer.jpg) no-repeat; }
		#mainContainer .categorie.bufferveren { background: url(../gfx/veren/categorie_bufferveren.jpg) no-repeat; }
		#mainContainer .categorie.antiknikveren { background: url(../gfx/veren/categorie_antiknikveren.jpg) no-repeat; }
		#mainContainer .categorie.manchetveren { background: url(../gfx/veren/categorie.jpg) no-repeat; }
		
		#mainContainer .categorie.trekveer, #mainContainer .categorie.drukveer, #mainContainer .categorie.bladveren, 	#mainContainer .categorie.torsieveren, #mainContainer .categorie.schotelveren, #mainContainer .categorie.stempelveren, #mainContainer .categorie.rolveren, #mainContainer .categorie.draadveer, #mainContainer .categorie.bufferveren, #mainContainer .categorie.antiknikveren, #mainContainer .categorie.manchetveren { width: 446px; padding-right: 15px; margin: 0; }
		
		.categorie .info { 
			width: 212px; 
			height: 92px;
			padding: 14px 13px 15px 13px;
			float: right; }
		.categorie .info h1 { 
			color: white; 
			font-size: 14px; 
			text-transform: uppercase;
			padding-bottom: 5px; }
		.categorie .info p {
			color: white;
			padding-bottom: 5px; }
		.categorie .info em {
			font-style: normal;
			color: #FF7C3A;
			padding-left: 10px;
			background: url(../gfx/arrow_white.gif) no-repeat 0 5px; }
			.categorie .info em:hover { color: #EC6D2D; }
		.categorie .info h1 a { color: white; background: none; padding: 0; }
			.categorie .info h1 a:hover { color: white; }
	
	/* Detail */
	#content { 
		width: 551px;
		padding: 0 26px 20px 0;
		float: left; }
		#content ul { padding-left: 25px; }
			#content ul li { list-style-type: disc; padding: 3px 0 3px 0; }
		#content h1 { 
			background: url(../gfx/titel.jpg) no-repeat;
			color: white;
			width: 531px;
			height: 51px;
			padding: 26px 0 15px 21px; }
			#content h1.trekveer { background: url(../gfx/veren/titel_trekveer.jpg) no-repeat; }
			#content h1.drukveer { background: url(../gfx/veren/titel_drukveer.jpg) no-repeat; }
			#content h1.bladveren { background: url(../gfx/veren/titel_bladveer.jpg) no-repeat; }
			#content h1.torsieveren { background: url(../gfx/veren/titel_torsieveren.jpg) no-repeat; }
			#content h1.schotelveren { background: url(../gfx/veren/titel_schotelveren.jpg) no-repeat; }
			#content h1.stempelveren { background: url(../gfx/veren/titel_stempelveren.jpg) no-repeat; }
			#content h1.rolveren { background: url(../gfx/veren/titel_rolveren.jpg) no-repeat; }
			#content h1.draadveer { background: url(../gfx/veren/titel_draadveer.jpg) no-repeat; }
			#content h1.bufferveren { background: url(../gfx/veren/titel_bufferveren.jpg) no-repeat; }
			#content h1.antiknikveren { background: url(../gfx/veren/titel_antiknikveren.jpg) no-repeat; }
		#content h3 { 
			text-transform: uppercase; 
			font-size: 20px; 
			padding-bottom: 15px;
			color: #496CA1; }
		#content h2 { font-size: 16px; }
		/* table */
		#content table { width: 100%; }
		#content td, #content th { border: 1px solid #C7C8CC; padding: 5px;}
		#content th { background: #E6E7EB; font-size: 12px; color: #496CA1; }
		/* definition list */
		#content dl dt, #content dl dd { border-bottom: 1px solid #ddd; padding: 4px 0; }
		#content dl dt { font-weight: bold; display: block; width: 100px; float: left; }
	#sidebar { 
		margin-top: -23px;
		width: 339px;
		float: right; }
		#sidebar .sidebarTop {
			background: url(../gfx/sidebar_top.gif) no-repeat;
			width: 339px;
			height: 29px; }
		#sidebar .sidebarMid {
			background: url(../gfx/sidebar_mid.gif) no-repeat;
			width: 339px;
			height: 37px; }
		#sidebar .sidebarBottom {
			background: url(../gfx/sidebar_bottom.gif) no-repeat;
			width: 339px;
			height: 20px; }
		#sidebar .content {
			border-right: 1px solid #C7C8CC;
			padding: 17px 15px 17px 0; }
			#sidebar .content h4 { 
				color: #09133B;
				font-size: 14px;
				text-transform: uppercase; }
			#sidebar .content ul li {
				padding-top: 10px; }
				#sidebar .content ul.download li {
					background: url(../gfx/icon_pdf.gif) no-repeat 0 0;
					padding: 3px 0 15px 30px; }
				#sidebar .content ul.navigation { padding-bottom: 10px; }
					#sidebar .content ul.navigation li {
						background: url(../gfx/arrow_darkblue.gif) no-repeat 0 15px;
						padding-left: 15px; }
						#sidebar .content ul.navigation li a { line-height: 16px; }
					#sidebar .content div.left { float: left; width: 130px; }
					#sidebar .content div.right { float: left; width: 170px; }
			#sidebar .content a.button {
				font-size: 14px;
				text-transform: uppercase;
				color: white;
				display: block;
				background: url(../gfx/sidebar_button.gif) no-repeat;
				width: 303px;
				height: 31px;
				margin-top: 5px;
				padding: 12px 0 0 20px; }
				#sidebar .content a:hover.button { 
					background-position: 0 -45px; }
					
		/* Service */
		
		.service {
			background: #EBEEF3;
			float: left;
			width: 178px;
			border: 1px solid #C7C8CC;
			padding: 20px;
			margin: 0 10px 15px 0; }
			.service h1 { 
				color: #496CA1;
				padding-bottom: 10px;
				border-bottom: 1px solid #C7C8CC; }
			.service ul { 
				height: 250px;
				padding-top: 10px; }
				.service ul li, #footerContainer .service ul li { 
					border-bottom: 1px solid #C7C8CC;
					height: 35px;
					background: url(../gfx/vink.gif) no-repeat 0 10px;
					padding: 10px 0 5px 25px; }
				.service ul li strong { color: #B23B00; }
				.service ul li.indent { 
					margin: -10px 0 0 8px;
					width: 150px;
					padding: 5px 0 5px 25px;
					background: url(../gfx/arrow_darkblue.gif) no-repeat 0 15px; }
					
		/* FAQ */
		
		#content.faq { padding-left: 15px; width: 535px; }
		#content.faq p { padding: 10px 0 10px 0; }
		#content.faq h2 { text-transform: uppercase; line-height: 30px; color: #09133B; padding-top: 22px; }
		
		.content h2 { padding-bottom: 20px; text-transform: uppercase; }
		
		ul.faqOverzicht, ul.toepassingsOverzicht {
			font-size: 12px;
			float: left;
			width: 295px;
			padding: 0 10px 20px 0; }
			ul.toepassingsOverzicht { width: 600px; }
			ul.faqOverzicht li, ul.toepassingsOverzicht li { 
				background: url(../gfx/arrow_darkblue.gif) no-repeat 0 5px;
				line-height: 15px; 
				padding: 0px 0px 5px 20px; }
			ul.faqOverzicht h4, ul.toepassingsOverzicht h4 { text-transform: uppercase; line-height: 30px; color: #09133B; padding-bottom: 10px; }

/*******************************************************************************************

		FOOTER 

*******************************************************************************************/

#footer { 
	border-top: 1px solid #4B526F;
	background: #E6E7EB url(../gfx/footer_bg.gif) repeat-x; }
	body#vervolg #footer { border: none; }
	body#vervolg #footerContainer { padding-left: 43px; }
	#footerContainer { 
		background: #E6E7EB;	
		width: 920px; 
		margin: 0 auto;
		padding: 35px 0 35px 40px; }
		body#en #footerContainer { 
			width: 1000px;
			padding-left: 77px; }
		#footerContainer ul { width: 455px; float: left; }
			#footerContainer h2 { 
				color: #8596B1;
				text-transform: uppercase;
				font-size: 14px;
				padding-bottom: 5px; }
			#footerContainer ul li { 
				background: url(../gfx/arrow.gif) no-repeat 0 5px;
				padding: 0 0 5px 15px; }
				#footerContainer ul li.noArrow { background: none }
				#footerContainer ul li.all { background: url(../gfx/arrow_darkblue.gif) no-repeat 0 5px; }
					#footerContainer ul li.all a { font-weight: bold; }
		#footerContainer ul.vragen { padding-left: 5px; }
		#footer #footerContainer .service ul { 
				width: 175px; }	
				#footer #footerContainer .service  { padding-right: 28px; } 
		#footerContainer ul.klanten { 
			border: 1px solid #dcdddf;
			margin-right: 20px;
			width: 435px;
			min-height: 110px; }
			#footerContainer ul.klanten li { background: none; }	
				#footerContainer ul.klanten li h2 { padding-top: 15px; }
				#footerContainer ul.klanten li img { padding: 0 18px 20px 0; }
		
		
		
		
				
