/* reset
-----------------------*/
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; }
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 { cellspacing: 0; border-collapse: collapse; border-spacing: 0; }

/* floats
-----------------------*/
.fl	{ float: left; }
.fr	{ float: right; }
.cb	{ clear: both; }

	/* -- body layout -- */
	body {margin:0 auto; padding:0; text-align:center; background: #000 url(../uploads/image/bg-body.jpg) repeat-x}
	
	/* -- main classes -- */
	.clear {clear:both}
	img {border:0}
	#main-wrapper {width:100%; height:100%; background: url(../uploads/image/bg-wrapper.jpg) center top no-repeat}
	#main-container {width:938px; height:100%; margin:0 auto; text-align:center}
		
	/* -- header -- */
	
		/* -- logo -- */
		#logo {width:244px; height:93px; float:left;}
		
		/* navigation */
		#navigation {width:620px; height:93px; float:left; border: =1px solid red; margin:0 0 0 71px; }
		#navigation ul {margin:0; padding:0}
		#navigation li {list-style: none; float:left; font-size:11px; color:#fff; width: 100px; }
		#navigation li a {padding:0 30px 0 30px; line-height: 93px; float:left; text-decoration: none; text-transform: uppercase; color: #fff; width: 60px;}
		#navigation li a:hover {background: #EF1C23;
								text-shadow: 1px -1px 0px #750404;
								background: rgb(237,80,83); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2VkNTA1MyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZjFjMjMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  rgba(237,80,83,1) 1%, rgba(239,28,35,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(237,80,83,1)), color-stop(100%,rgba(239,28,35,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(237,80,83,1) 1%,rgba(239,28,35,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(237,80,83,1) 1%,rgba(239,28,35,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(237,80,83,1) 1%,rgba(239,28,35,1) 100%); /* IE10+ */
background: linear-gradient(top,  rgba(237,80,83,1) 1%,rgba(239,28,35,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ed5053', endColorstr='#ef1c23',GradientType=0 ); /* IE6-8 */

								}
		
	/* -- content -- */
	#content {width:938px; height:100%; background:url(../uploads/image/bg-content.jpg) repeat-y; clear:both; color:#000; text-align:left; /* ie6 only */ _margin-top:-4px;}
	#content-left {width:448px; height:100%; float:left;}
	#content-right {width:486px; height:100%; float:left; color:#EF1C23}
	
		/* -- content-right */
		#slider {width:487px; height:354px; background-color:#000}
		.half {width:50%; height:100%; float:left;}
		.half-txt {float:left; margin:0px; padding:15px; font-size:12px; line-height:22px}
		
			/* -- slider -- */
			#slider-spacer {width:487px; height:290px;}
			#slider-txt {width:487px; height:64px; background-color:#000; filter: alpha(opacity=70); -moz-opacity: 0.7; -khtml-opacity: 0.7; opacity: 0.7}
	
	#customers				{ font-family: Arial, Helvetica, sans-serif; width:320px; border-collapse:collapse; background:white; }
	#customers td, 
	#customers th			{ font-size: 1em; border:1px solid #c0c0c0; padding:5px 7px 5px 7px;line-height: 20px;}
	#customers th img		{ text-align: center;}
	
		
	/* footer */
	#footer {width:934px; height:32px; float:left; margin-top:5px;}
	.footer-half {width:50%; height:100%; float:left; text-align:left}
	.footer-half-ar {width:50%; height:100%; float:left; text-align:right}
	.footer-half a {font-size:9px; text-transform:uppercase; color:#EF1C23; text-decoration:none; line-height:32px; text-align:left}
	.footer-half a:hover {color:#FFF; text-decoration:none}
	.footer-half-txt {float:left; margin:0px; padding:15px; font-size:12px;}
	
	/* -- text layout --*/
	p, a, h1, h2, h3, td, #navigation li, .s3sliderImage span, span {font-family:Arial, Helvetica, sans-serif; font-weight:100;}
	p {margin:15px; font-size:12px; line-height:22px}
	td, table, tr {margin:15px; font-size:12px; line-height:22px}
	h1 {margin:15px; padding:0; font-size:17px; color:#EF1C23}
	h2 {margin: 0; margin-left:15px; line-height:64px; padding:0; font-size:30px; color:#FFF; text-transform:uppercase}
	h3 {margin:15px; padding:0; font-size:15px; color:#EF1C23}
	strong {font-weight:900 !important;}
	.credits {font-size:9px; text-transform:uppercase; color:#FFF; text-decoration:none; line-height:32px; margin:0}
	
	/* -- slider -- */
	#s3slider {width:487px; height:354px; position: relative; overflow:hidden; margin:0; padding:0}
	#s3sliderContent {width:487px; /*position: absolute;*/ top: 0; margin:0; padding:0}
	.s3sliderImage {float: left; position: relative; display: none;}
	.s3sliderImage span {position: absolute; left: 0;
	 margin:0px; padding:15px; line-height:24px; font-size:30px; color:#FFF; text-transform:uppercase ;
	 width: 487px; background-color: #000;
	 filter: alpha(opacity=70); -moz-opacity: 0.7; -khtml-opacity: 0.7; opacity: 0.7; 
	 display: none; bottom: 0;}
	 
	 /* -- contactformulier -- */
	 /* contactformulier*/
#contactformulier					{ margin: 0 0 0 20px; font-family: Arial;}
#contactformulier span.large		{ display: block; position: absolute; top: 0; right: 0; width: 238px; height: 50px; clear: both; font-size: 11px; margin: 0 0 10px 0; padding: 6px 6px 6px 12px; background: url('/files/12/images/new/info-label_large.jpg'); }
#contactformulier span.medium		{ display: block; position: absolute; top: 0; right: 0; width: 238px; height: 32px; clear: both; font-size: 11px; margin: 0 0 10px 0; padding: 6px 6px 6px 12px; background: url('/files/12/images/new/info-label_medium.jpg'); }	
#contactformulier span.small		{ display: block; position: absolute; top: 0; right: 0; width: 238px; height: 18px; clear: both; font-size: 11px; margin: 0 0 10px 0; padding: 6px 6px 6px 12px; background: url('/files/12/images/new/info-label_small.jpg'); }
#contactformulier div.row			{ clear: both; padding: 0; margin: 6px 0; min-height: 22px; position: relative; width: 884px; }
#contactformulier form 				{ border: none; margin: 0; font-size: 12px;  }	
#contactformulier label 			{ display: block; width: 150px; height: 22px; line-height: 22px; float: left; }
#contactformulier label.auto		{ display: block; width: auto; padding: 0 15px; height: 22px; line-height: 22px; float: left; }
#contactformulier input 			{ font-family: arial; display: block; width: 240px; height: 22px; line-height: 22px; float: left; padding: 0 6px; background: #f8f8f8; border: 1px solid #b8b8b8; color: #575757; }
#contactformulier input.button		{ display: block; height: 40px; width: 200px; cursor: pointer; text-decoration: none; text-align: center; line-height: 40px; color: #fff; border: none;
									  background: #EF1C23;
									  text-shadow: 1px -1px 0px #750404;
									  background: rgb(237,80,83); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2VkNTA1MyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZjFjMjMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  rgba(237,80,83,1) 1%, rgba(239,28,35,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(237,80,83,1)), color-stop(100%,rgba(239,28,35,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(237,80,83,1) 1%,rgba(239,28,35,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(237,80,83,1) 1%,rgba(239,28,35,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(237,80,83,1) 1%,rgba(239,28,35,1) 100%); /* IE10+ */
background: linear-gradient(top,  rgba(237,80,83,1) 1%,rgba(239,28,35,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ed5053', endColorstr='#ef1c23',GradientType=0 ); /* IE6-8 */

 									}
#contactformulier select			{ margin: 2px 0; }	
#contactformulier textarea			{ display: block; width: 233px; padding: 10px; height: 150px; background: #f8f8f8; border: 1px solid #b8b8b8; color: #575757; resize: none; }
#form label.required 				{ color: #e02213; background: url('/files/71/images/error.jpg') right center no-repeat; }


/* listview
----------------------- */
.listview								{ display: block; width: 418px; margin: 0 5px; padding: 0 0 50px 0; }
.listview > li.item						{ display: block; width: 418px; height: 110px; margin: 0; padding: 0; margin: 0 10px 0 10px; padding: 0 0 8px 0; background: url(/files/71/images/shadow-list-item.png) bottom no-repeat; }
.listview > li.item a					{ display: block; width: 418px; height: 110px; margin: 0; padding: 0; background: #fcfcfc; text-decoration: none; }
.listview > li.item a:hover				{ background: #FFF url(/files/71/images/hover-list-item.png) right top no-repeat; }
.listview > li.active a					{ background: #FFF url(/files/71/images/hover-list-item.png) right top no-repeat; }
.listview > li.item .thumb				{ width: 90px; height: 90px; overflow: hidden; border-right: 1px solid #ededed; margin: 10px; padding: 0 10px 0 0; }
.listview > li.item .thumb img			{ }
.listview > li.item .content			{ display: block; width: 250px; height: 80px; margin: 15px 0 20px 15px; }
.listview > li.item .content .title		{ display: block; width: 250px; min-height: 30px; line-height: 30px; color: #323232; font-size: 12px; font-weight: bold; margin: 0; padding: 0; }
.listview > li.item .content .label		{ display: block; width: 50px; float: left; font-size: 11px; line-height: 20px; height: 20px; color: #323232; }
.listview > li.item .content .value		{ display: block; width: 200px; float: left; font-size: 11px; line-height: 20px; height: 20px; color: #323232; }

/* productview
----------------------- */
.productview						{ }
.productview h1						{ }
.productview .thumb					{ margin: 0 15px; }
.productview .description			{ }
.productview .description p			{ color: #323232; margin: 20px 0 0 0; font-size: 11px; line-height: 20px; }	
.productview .description .label	{ display: block; width: 50px; float: left; font-size: 11px; line-height: 20px; height: 20px; color: #323232; }
.productview .description .value	{ display: block; width: 200px; float: left; font-size: 11px; line-height: 20px; height: 20px; color: #323232; }

/* filter
----------------------- */
#buttons			{ margin: 0 15px 20px 15px; padding: 0;  }
#buttons a			{ font-size: 11px; padding: 0 10px 0 0; color: #323232; margin: 0; }
#buttons a.current	{ font-weight: bold; }

/* merken
----------------------- */
ul.merken				{ display: table; margin: 0 20px; }
ul.merken li			{ margin: 0 10px 10px 0; height: 85px; width: 170px; border: 1px solid #ccc; padding: 0 10px; text-align: center; background: #fff; float: left; display: table-cell; vertical-align: middle;  }
ul.merken li img		{ width: 170px; display: table-cell; vertical-align: middle; padding: 20px 0;  }
ul.merken li img.square	{ width: 80px; }