@font-face {
	font-family: 'barmenomedium';
	src: url('fonts/barmeno-webfont.eot');
	src: url('fonts/barmeno-webfont.eot?#iefix') format('embedded-opentype'),
		 url('fonts/barmeno-webfont.woff') format('woff'),
		 url('fonts/barmeno-webfont.ttf') format('truetype'),
		 url('fonts/barmeno-webfont.svg#barmenomedium') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'barmenoroman';
	src: url('fonts/barmeno-roman-webfont.eot');
	src: url('fonts/barmeno-roman-webfont.eot?#iefix') format('embedded-opentype'),
		 url('fonts/barmeno-roman-webfont.woff') format('woff'),
		 url('fonts/barmeno-roman-webfont.ttf') format('truetype'),
		 url('fonts/barmeno-roman-webfont.svg#barmenoroman') format('svg');
	font-weight: normal;
	font-style: normal;
}


/* ====== site css ====== */

html, body {
	height: 100%;
	padding: 0;
	margin: 0;
}

body {
	background: #888888;
	font-family: 'Arial';
	font-weight: normal;
	line-height: 22px;
	font-size: 14px;
	width: 100%;
}

h1 {
	font-family: 'barmenomedium', Arial, sans-serif;
	font-weight: normal;
	line-height: 42px;
	font-size: 37px;
	color: #11445d;
	margin: 10px 0;
	clear: both;
	float: left;
	width: 100%;
}

h2 {
	font-family: 'barmenomedium', Arial, sans-serif;
	font-weight: normal;
	margin: 10px 0 5px;
	line-height: 26px;
	font-size: 22px;
	color: #11445d;
	width: 100%;
	clear: both;
	float: left;
}

h3 {
	font-family: 'barmenomedium', Arial, sans-serif;
	font-weight: normal;
	margin: 10px 0 5px;
	color: #11445d;
	width: 100%;
	clear: both;
	float: left;
}

a {
	color: #111;
}

a:hover {
	color: #16bac4;
}

img {
	border: 0;
}

.divlinker {
	cursor: pointer;
}

.clearfix {
	clear: both;
	width: 100%;
}


/* ====== structuur ====== */

#sitewrapper { min-height: 100%; }
#sitewrapper-padding { padding-bottom: 140px; }

.wrapper {
	background: none;
	margin: auto;
}

#header {
	background: #888 url('../img/bg_header.png') repeat-x top center;
}

	#header .wrapper {
		position: relative;
		background: none;
		padding: 20px 0;
		height: 110px;
		width: 920px;
	}

	#header .wrapper .logo {
		position: absolute;
		top: 30px;
		left: 0;
	}

	#header .wrapper .winkelwagen {
		border-bottom-right-radius: 6px;
		border-bottom-left-radius: 6px;
		background: #033957;
		position: absolute;
		padding: 10px 15px;
		line-height: 16px;
		font-size: 12px;
		color: #4d8cab;
		width: 180px;
		right: 0;
		top: 0;
	}

		#header .wrapper .winkelwagen .top {
			border-bottom: 1px solid #061b26;
			line-height: 17px;
			text-align: right;
			padding: 0 0 10px;
			font-size: 11px;
		}

			#header .wrapper .winkelwagen .top .right {
				float: right;
				width: 100px;
			}

			#header .wrapper .winkelwagen .top .icon {
				margin: 0 0 0 10px;
				display: block;
				height: 17px;
				float: right;
				width: 18px;
			}

			#header .wrapper .winkelwagen .top .facebook { background: url('../img/icons/social_facebook.png') center center no-repeat; }
			#header .wrapper .winkelwagen .top .twitter { background: url('../img/icons/social_twitter.png') center center no-repeat; }
			#header .wrapper .winkelwagen .top .linkedin { background: url('../img/icons/social_linkedin.png') center center no-repeat; }

		#header .wrapper .winkelwagen .bottom {
			background: url('../img/bg_shopping_bottom.png') no-repeat right 10px;
			border-top: 1px solid #426b81;
			padding: 8px 20px 0 40px;
		}

			#header .wrapper .winkelwagen .bottom a {
				text-decoration: none;
				color: #4d8cab;
			}

			#header .wrapper .winkelwagen .bottom a span {
				color: #fff;
			}

				#header .wrapper .winkelwagen .bottom a:hover span { text-decoration: underline; }

	#header .wrapper ul {
		position: absolute;
		padding: 0;
		bottom: 0;
		margin: 0;
		right: 0;
	}

		#header .wrapper ul li {
			background: url('../img/bg_menu.png') bottom right no-repeat;
			padding: 8px 12px;
			list-style: none;
			height: 20px;
			float: left;
			margin: 0;
		}

			#header .wrapper ul li a {
				text-decoration: none;
				font-weight: bold;
				color: #aaa;
			}

			#header .wrapper ul li a:hover { color: #fff; }
			#header .wrapper ul li a.active { color: #5ebeee; }

#slider {
	background: #cacaca;
}

	#slider .wrapper {
		position: relative;
		margin: 0 auto;
		height: 350px;
		width: 960px;
	}

		#slider .slide_txt {
			padding: 35px 0 0 30px;
			position: relative;
			display: table;
			height: 280px;
			z-index: 99;
			width: 350px;
			float: left;
		}

			#slider .slide_txt div {
				vertical-align: middle;
				display: table-cell;
				height: 280px;
				width: 350px;
			}

			#slider .slide_txt h2 {
				font-family: 'barmenomedium', Arial, sans-serif;
				font-weight: normal;
				line-height: 42px;
				font-size: 37px;
				color: #11445d;
				margin: 10px 0;
				clear: both;
				float: left;
				width: 100%;
			}

		#slider .slide_img {
			margin-right: 15px;
			position: absolute;
			right: 0;
			top: 0;
		}

#topcontent {
	background: #cacaca;
}

	#topcontent .wrapper {
		overflow: hidden;
		margin: 0 auto;
		padding: 20px;
		width: 920px;
	}

		#topcontent .wrapper h1 {
			margin: 0;
		}

		#topcontent .wrapper h2 {
			margin: 0;
		}

		#topcontent .wrapper h3 {
			margin: 0;
		}

#content {
	background: url('../img/bg_content.png');
}

#content .shade {
	background: url('../img/bg_content_shade.png') top center no-repeat;
	height: 100%;
	width: 100%;
}

	#content .wrapper {
		padding: 30px 20px 50px;
		width: 920px;
	}

		#content .wrapper ul.products {
			background: url('../img/bg_productlist.png');
			position: relative; z-index: 9;
			padding: 25px 0 15px;
			overflow: hidden;
			width: 100%;
			clear: both;
			margin: 0;
		}

			#content .wrapper ul.products input[type="radio"] {
				position: absolute;
				z-index: -3;
				top: 0;
			}

			#content .wrapper ul.products li {
				font-family: 'barmenoroman', Arial, sans-serif;
				text-shadow: -1px -1px 1px #fff;
				position: relative;
				text-align: center;
				font-weight: bold;
				list-style: none;
				font-size: 18px;
				cursor: pointer;
				color: #033957;
				margin: 0 6px;
				height: 330px;
				width: 140px;
				float: left;
				padding: 0;
			}

				#content .wrapper ul.products li a, #content .wrapper ul.products li span.spacer {
					background-repeat: no-repeat;
					background-position: center;
					cursor: pointer;
					margin: 0 0 18px;
					display: block;
					height: 250px;
					width: 140px;
				}

				#content .wrapper ul.products li span.btn {
					background: #005584 url('../img/bg_btn.png') bottom repeat-x;
					text-shadow: -1px -1px 1px #003956;
					font-family: Arial, sans-serif;
					border: 1px solid #005584;
					top: 225px; left: 50%;
					margin-left: -60px;
					position: absolute;
					border-radius: 5px;
					padding: 4px 10px;
					font-size: 13px;
					width: 100px;
					color: #fff;
				}

					#content .wrapper ul.products li:hover span.btn {
						background: #005584 url('../img/bg_btn-hover.png') bottom repeat-x;
					}

		#content .wrapper ul.products_home {
			background: url('../img/bg_productlist.png');
			border-bottom: 1px dotted #fff;
			position: relative; z-index: 9;
			padding: 0 0 15px;
			margin-top: -40px;
			overflow: hidden;
			width: 920px;
			clear: both;
			margin: 0;
		}

			#content .wrapper ul.products_home li {
				font-family: 'barmenoroman', Arial, sans-serif;
				text-shadow: -1px -1px 1px #444;
				position: relative;
				text-align: center;
				font-weight: bold;
				list-style: none;
				font-size: 18px;
				height: 330px;
				margin: 0 6px;
				width: 140px;
				clear: none;
				float: left;
				color: #fff;
				padding: 0;
			}

				#content .wrapper ul.products_home li a {
					background-repeat: no-repeat;
					background-position: center;
					margin: 0 0 18px;
					display: block;
					height: 250px;
					width: 140px;
				}

				#content .wrapper ul.products_home li span.korting_15 {
					background: url('../img/15p_korting.png') top left no-repeat;
					height: 58px;
					width: 76px;
					position: absolute;
					top: 0; left: 0;
				}

		#content .wrapper ul {
			margin: 10px 0;
			clear: both;
			padding: 0;
		}

			#content .wrapper ul li {
				list-style-type: disc;
				margin: 0 0 0 20px;
				clear: both;
				padding: 0;
			}

#subcontent {
	background: #888888;
}

#subcontent.subcontent_home {
	margin-top: -155px;
	padding-top: 100px;
}

	#subcontent .wrapper {
		overflow: hidden;
		padding: 0 20px;
		width: 920px;
		color: #fff;
	}

		#subcontent .wrapper .quote {
			background: #b6b6b6 url('../img/bg_quote.png');
			margin: 30px 28px 30px 0;
			text-align: center;
			height: 110px;
			padding: 20px;
			width: 290px;
			float: left;
		}

			#subcontent .wrapper .quote h2 {
				font-family: 'barmenoroman', Arial, sans-serif;
				font-weight: normal;
				line-height: 26px;
				margin: 0 0 10px;
				font-size: 22px;
			}

			#subcontent .wrapper .quote h4 {
				font-family: 'barmenoroman', Arial, sans-serif;
				font-weight: normal;
				line-height: 22px;
				margin: 5px 0 0;
				font-size: 18px;
				color: #11445d;
			}

		#subcontent .wrapper ul.projecten_gallery {
			overflow: hidden;
			margin: 30px 0 0;
			width: 561px;
			float: left;
			padding: 0;
		}

			#subcontent .wrapper ul.projecten_gallery li {
				border: 3px solid #cacaca;
				margin: 0 15px 0 0;
				list-style: none;
				float: left;
			}

			#subcontent .wrapper ul.projecten_gallery li:hover {
				border: 3px solid #f5f5f5;
			}

			#subcontent .wrapper ul.projecten_gallery li img {
				display: block;
			}

#footer {
	margin-top: -140px; /* negative value of footer height */
	background: #033957;
	height: 140px;
}

	#footer .wrapper {
		background: none;
		font-size: 11px;
		padding: 20px;
		height: 100px;
		width: 920px;
		color: #fff;
	}

	#footer .wrapper strong {
		font-size: 13px;
	}

	#footer .wrapper p {
		margin: 0;
	}

	#footer .wrapper a {
		text-decoration: none;
		color: #fff;
	}

		#footer .wrapper a:hover {
			text-decoration: underline;
		}

	#footer .wrapper .left {
		width: 560px;
		float: left;
	}

		#footer .wrapper .left ul {
			margin: 5px 0 0;
			float: left;
			clear: both;
			padding: 0;
		}

			#footer .wrapper .left ul li {
				border-right: 1px solid #fff;
				line-height: 14px;
				list-style: none;
				padding: 0 7px;
				height: 14px;
				float: left;
				margin: 0;
			}

	#footer .wrapper .right {
		text-align: right;
		width: 360px;
		float: right;
	}

		#footer .wrapper .right ul {
			margin: 5px 0 0;
			float: right;
			clear: both;
			padding: 0;
		}

			#footer .wrapper .right ul li {
				border-right: 1px solid #fff;
				line-height: 14px;
				list-style: none;
				padding: 0 5px;
				height: 14px;
				float: left;
				margin: 0;
			}

#map {
	box-shadow: 0 1px 2px rgba(0,0,0,0.2);
	border: 3px solid #fff;
	height: 350px;
	width: 914px;

}

/* melding */

#notification {
	margin: 0 0 20px;
	width: 920px;
}

	#notification.succes {
		border: 1px dotted #2cb43d;
		background-color: #def8e1;
		color: #2cb43d;
	}

	#notification.error {
		background-color: #FFA6A6;
	}

	.topbar {
		padding: 12px 15px;
		text-align: left;
		overflow: hidden;
		margin: auto;
	}

		.topbar ul {
			padding-bottom: 0;
			margin-bottom: 0;
		}

.melding {
	padding: 10px;
	height: 30px;
}
	.melding.nok {
		background-color: #FFF0F0;
	}
	.melding.ok {
		background-color: #def8e1;
	}


/* page css */

.productinfo {
	border: 1px solid #005584;
	margin-bottom: 30px;
	border-radius: 3px;
	background: #fff;
	margin: 20px 0 0;
	width: 480px;
	float: left;
	clear: left;
}

	.productinfo h2 {
		background: #005584 url('../img/bg_btn.png') top repeat-x;
		text-shadow: -1px -1px 1px #003956;
		padding: 8px 15px 10px;
		width: 450px;
		color: #fff;
		margin: 0;
	}

	.productinfo h3 {
		margin: 25px 0 10px;
		padding: 0 15px;
	}

	.productinfo textarea {
		border: 1px solid #ccc;
		background: #eee;
		margin: 5px 0 0;
		width: 438px;
		padding: 5px;
	}

	.productinfo input {
		border: 1px solid #ccc;
		background: #eee;
		padding: 5px;
		width: 120px;
		color: #444;
	}

	.productinfo select {
		border: 1px solid #ccc;
		background: #eee;
		padding: 5px;
		width: 300px;
		color: #444;
	}

		.productinfo select.small {
			width: 143px;
		}

	.productinfo ul.info {
		border-bottom: 1px dotted #ddd;
		border-top: 1px dotted #ddd;
		padding: 5px 0 0;
		width: 480px;
		float: left;
		margin: 0;
	}

		.productinfo ul.info li {
			border-bottom: 1px dotted #ddd;
			padding: 10px 15px;
			list-style: none;
			margin: 0;
		}

			.productinfo ul.info li label {
				padding-top: 3px;
				display: block;
				width: 150px;
				float: left;
			}

.sidebar {
	text-align: justify;
	margin-bottom: 30px;
	float: right;
	width: 400px;
}

	.sidebar h2 {
		line-height: 26px;
		margin: 10px 0 0;
		font-size: 22px;
	}

	ul.gallery {
		padding: 0;
		margin: 0;
	}

		ul.gallery li {
			margin: 0 10px 10px 0;
			list-style: none;
			float: left;
			padding: 0;
		}

			ul.gallery li img {
				border: 3px solid #ccc;
				display: block;
				width: 120px;
				margin: 0;
			}

				ul.gallery li img:hover {
					border: 3px solid #033957;
				}

	.totaalprijs {
		background: #005584;
		border-radius: 3px;
		text-align: right;
		margin: 20px 0 0;
		padding: 10px;
		width: 378px;
		color: #fff;
		clear: both;
		float: left;
	}

		.totaalprijs p {
			margin: 0;
		}

		.totaalprijs h3 {
			margin: 5px 0 15px;
			font-weight: bold;
			font-size: 24px;
			color: #fff;
		}

		.totaalprijs .bestel {
			font-family: 'barmenoroman', Arial, sans-serif;
			text-decoration: none;
			background: #fff;
			border-radius: 3px;
			font-weight: bold;
			font-size: 24px;
			display: block;
			color: #005584;
			padding: 20px;
			float: right;
		}

			.totaalprijs .bestel:hover {
				background: #006fa7;
				color: #fff;
			}


/* referentiepagina */

.referentie_txt {
	width: 400px; margin: 60px 0 0; padding: 0; float: right;
}

/*.referentie_img {
	width: 494px; padding: 0; margin: 0; overflow: hidden; text-align: left; float: left;
}*/

#content .projecten_gallery {
	overflow: hidden;
	padding: 10px 0;
	width: 920px;
	margin: 0;
}

	#content .projecten_gallery li {
		box-shadow: 0 1px 2px rgba(0,0,0,.2);
		margin: 0 10px 11px 0;
		list-style: none;
		float: left;
		padding: 0;
	}

		#content .projecten_gallery li:hover {
			box-shadow: 0 1px 2px rgba(0,0,0,.6);
		}

		#content .projecten_gallery li a {
			border: 3px solid #fff;
			overflow: hidden;
			display: block;
		}

			#content .projecten_gallery li a img {
				display: block;
			}



/* melding */

#melding {
	margin: 0 0 10px;
	width: 902px;
	padding: 8px;
}

	.succes { color: #4F8A10; border: 1px solid #4F8A10; background-color: #DFF2BF; }
	.error { color: #D8000C; border: 1px solid #D8000C; background-color: #FFBABA; }


/* contactformulier */

.contact_left {
	width: 330px; float: left;
}

.contact_right {
	width: 585px; float: left;
}

#contactform {
	overflow: hidden;
	margin: 10px 0 0;
	clear: both;
	padding: 0;
}

#contactform input[type="text"], #contactform textarea {
	font-family: 'Arial', Helvetica, sans-serif;
	font-size: 13px; color: #444;
	border: 1px solid #ccc;
	margin: 0 8px 8px 0;
	border-radius: 2px;
	padding: 5px 7px;
	width: 300px;
	height: 19px;
}

#contactform textarea {
	height: 171px;
	width: 574px;
	padding: 7px;
}

	#contactform input[type="text"]:hover, #contactform textarea:hover {
		border: 1px solid #bbb;
	}

		#contactform input[type="text"]:focus, #contactform textarea:focus {
			border: 1px solid #888;
		}


/* --- gallery --- */

.page_img {
	box-shadow: 0 1px 2px rgba(0,0,0,0.3);
	border: 3px solid #fff;
	height: 250px;
	width: 394px;
	float: left;
}

	.page_img img {
		height: 250px;
		width: 394px;
	}

#content .wrapper ul.galleryList {
	float: left;
	padding: 0;
	margin: 0;
}

	#content .wrapper ul.galleryList li {
		box-shadow: 0 1px 2px rgba(0,0,0,.2);
		margin: 0 10px 10px 0;
		list-style: none;
		clear: none;
		float: left;
		padding: 0;
	}

		#content .wrapper ul.galleryList li:hover {
			box-shadow: 0 1px 2px rgba(0,0,0,.6);
		}

		#content .wrapper ul.galleryList li a {
			border: 3px solid #fff;
			overflow: hidden;
			display: block;
		}

			#content .wrapper ul.galleryList li a img {
				display: block;
			}

.ref_txt {
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
	border: 3px solid #fff;
	margin: 0 10px 10px 0;
	background: #033957;
	padding: 5px 20px;
	height: 284px;
	width: 254px;
	color: #fff;
	clear: both;
	float: left;
}

	a.page_gallery {
		box-shadow: 0 1px 2px rgba(0,0,0,.2);
		border: 3px solid #fff;
		margin: 0 10px 10px 0;
		list-style: none;
		display: block;
		float: left;
		padding: 0;
	}

		a.page_gallery:hover {
			box-shadow: 0 1px 2px rgba(0,0,0,.6);
		}

		a.page_gallery.alt {
			margin-right: 0;
		}

		a.page_gallery img {
			display: block;
		}

.youtube {
	box-shadow: 0 1px 2px rgba(0,0,0,0.3);
	border: 3px solid #fff;
	text-align: justify;
	overflow: hidden;
	height: 264px;
	width: 396px;
	float: right;
	padding: 0;
	margin: 0;
}


/* --- winkelwagen --- */

table.product_items {
	border: 1px solid #005584;
	border-radius: 3px;
	margin: 0 0 20px;
	width: 920px;
	padding: 0;
}

	table.product_items tr {
		height: 20px;
	}

		table.product_items tr th {
			font-weight: bold;
		}

		table.product_items tr th, table.product_items tr td {
			text-align: left;
			padding: 10px;
			height: 20px;
		}

		table.product_items tr th {
			background: #005584 url('../img/bg_btn.png') top repeat-x;
			text-shadow: -1px -1px 1px #003956;
			color: #fff;
		}

		table.product_items tr td {
			border-top: 1px solid #ccc;
			background: #fff;
		}

		.updateCart {
			margin: 3px 5px -2px;
			display: block;
			height: 15px;
			width: 15px;
			float: left;
		}

			.updateCart.plus { background: url('../img/icons/plus.png') top left; }
			.updateCart.min { background: url('../img/icons/min.png') top left; }
			.updateCart.delete { background: url('../img/icons/delete.png') top left; }

			.updateCart:hover { background-position: bottom left; }

/* login */

table.login_form {
	border: 1px solid #005584;
	border-radius: 3px;
	margin: 20px 0;
	width: 920px;
	clear: left;
	padding: 0;
}

	table.login_form tr {
		height: 20px;
	}

		table.login_form tr th {
			font-weight: bold;
		}

		table.login_form tr th, table.login_form tr td {
			text-align: left;
			padding: 10px;
			height: 20px;
		}

		table.login_form tr th {
			background: #005584 url('../img/bg_btn.png') top repeat-x;
			text-shadow: -1px -1px 1px #003956;
			color: #fff;
		}

		table.login_form tr td {
			border-top: 1px solid #ccc;
			background: #fff;
		}

		table.login_form tr td.grey {
			background: #e5e5e5;
		}


/* shopping cart */

#stap_1, #stap_2, #stap_3, #stap_4, #stap_5 {
	background: #afaaaa url('../img/bg_bar.png') top repeat-x;
	text-shadow: -1px -1px 0 #aaa;
	border: 1px solid #aaa;
	padding: 10px;
	width: 898px;
	color: #fff;
	clear: left;
	margin: 0;
}

#stap_1 {
	border-top-right-radius: 3px;
	border-top-left-radius: 3px;
	margin: 20px 0 0;
}

#stap_2 {
	border-bottom-right-radius: 3px;
	border-bottom-left-radius: 3px;
}

#stappen_content {
	border: 1px solid #aaa;
	background: #fff;
	padding: 20px;
}

	#stappen_content table {
		width: 880px;
		margin: 0;
	}

	#stappen_content table td p {
		margin: 0;
	}

.accordionContent table {
	border: 1px solid #005584;
	border-radius: 3px;
	margin: 20px 0;
	width: 920px;
	clear: left;
	padding: 0;
}

	.accordionContent table tr {
		height: 20px;
	}

		.accordionContent table tr th {
			font-weight: bold;
		}

		.accordionContent table tr th, .accordionContent table tr td {
			text-align: left;
			padding: 10px;
			height: 20px;
		}

		.accordionContent table tr th {
			background: #005584 url('../img/bg_btn.png') top repeat-x;
			text-shadow: -1px -1px 1px #003956;
			color: #fff;
		}

		.accordionContent table tr td {
			border-top: 1px solid #ccc;
			background: #fff;
		}

		.accordionContent table tr td.grey {
			background: #e5e5e5;
		}


/* ====== webshop css ====== */

input, textarea {
	font-family: 'Arial', sans-serif;
	border: 1px solid #ccc;
	border-radius: 2px;
	line-height: 18px;
	font-size: 13px;
}

textarea {
	resize: vertical;
}

.clear { clear:both;}

#webshop {
	background: url('../img/bg_content.png');
}

#webshop a {
	color: #333;
}

#webshop a.underline {
	text-decoration: underline;
	color: #333;
}

#webshop .shade {
	background: url('../img/bg_content_shade.png') top center no-repeat;
	height: 100%;
	width: 100%;
}

#webshop .wrapper {
	padding: 20px;
	width: 920px;
}

#webshop .wrapper ul.projecten_gallery {
	margin: 10px -10px 0;
	width: 940px;
	padding: 0;
}

	#webshop .wrapper ul.projecten_gallery li {
		box-shadow: 0 1px 2px rgba(0,0,0,.2);
		border: 1px solid #fff;
		background: #fff;
		list-style: none;
		margin: 5px;
		padding: 3px;
		float: left;
	}

	#webshop .wrapper ul.projecten_gallery li:hover {
		box-shadow: 0 1px 2px rgba(0,0,0,.6);
	}

	#webshop .wrapper ul.projecten_gallery li img {
		display: block;
	}

ul.stappen {
	position: relative;
	overflow: hidden;
	height: 43px;
	width: 922px;
	z-index: 2;
	padding: 0;
	margin: 0;
}

	ul.stappen li {
		border-right: 1px solid #ddd;
		border-left: 1px solid #ddd;
		border-top: 1px solid #ddd;
		position: relative;
		margin: 0 5px 0 0;
		list-style: none;
		background: #eee;
		font-size: 13px;
		height: 20px;
		padding: 10px;
		color: #888;
		float: left;
		opacity: .6;
	}

		ul.stappen li.active {
			border-bottom: 1px solid #fff;
			border-right: 1px solid #ccc;
			border-left: 1px solid #ccc;
			border-top: 1px solid #ccc;
			margin-bottom: -1px;
			background: #fff;
			padding: 10px;
			height: 20px;
			z-index: 2;
			opacity: 1;
		}

		ul.stappen li.done {
			border-right: 1px dotted #2cb43d;
			border-left: 1px dotted #2cb43d;
			border-top: 1px dotted #2cb43d;
			background: #def8e1;
			height: 40px;
			opacity: 1;
			padding: 0;
		}

			ul.stappen li.active span {
				background: none;
				color: #111;
			}

			ul.stappen li.done span {
				padding: 10px 30px 10px 10px;
				background: none;
				color: #257126;
			}

	ul.stappen li.alt {
		margin: 0;
	}

		ul.stappen li img {
			display: none;
		}

		ul.stappen li.done img {
			position: absolute;
			display: block;
			right: 8px;
			top: 13px;
		}

		ul.stappen li span {
			display: block;
		}

		ul.stappen li:last-child span {
			padding-right: 8px;
		}

	ul.stappen a {
		text-decoration: none;
	}


ul.gegevens {
	border-bottom: 1px dotted #bbb;
	margin: 20px 0;
	clear: both;
	padding: 0;
}

	ul.gegevens li {
		border-top: 1px dotted #bbb;
		list-style: none;
		padding: 10px;
		margin: 0;
	}

		ul.gegevens li .left {
			width: 440px;
			float: left;
		}

		ul.gegevens li .left label,
		ul.gegevens li .right label
		{
			display: inline-block;
			width: 150px;
		}

div.stappen_content {
	box-shadow: 0 0 5px #fff;
	border: 1px solid #ccc;
	background: #fff;
	margin: -2px 0 0;
	padding: 19px;
	width: 880px;
}

	div.stappen_content label p {
		margin: 0;
	}

	div.stappen_content label p.small small {
		line-height: 14px;
	}

#login.hidden, #wachtwoord-vergeten.hidden, #registreren.hidden {
	display: none;
}

#login h2, #wachtwoord-vergeten h2, #registreren h2 {
	margin: 0 0 15px;
}

	div.stappen_content .verzend {
		border: 1px dotted #ccc;
		margin: 0 0 10px;
		padding: 10px;
		width: 413px;
		float: left;
	}

	.productoverzicht {
		border: 1px solid #ccc;
		background: #ffffff;
		margin: 0 0 20px;
		padding: 10px;
		width: 920px;
		float: left;
	}

	div.stappen_content .productoverzicht {
		border: 1px dotted #ccc;
		width: 880px;
		margin: 0;
	}

		.productoverzicht th {
			text-align: left;
			background: #f8f8f8;
			padding: 10px;
		}

			.productoverzicht th.right {
				text-align: right;
			}

		.productoverzicht td {
			border-top: 1px dotted #bbb;
			padding: 10px;
		}

	div.stappen_content .block {
		border: 1px dotted #bbb;
		margin: 0 0 0 20px;
		padding: 50px 20px;
		text-align: center;
		font-size: 18px;
		display: block;
		width: 230px;
		height: 40px;
		float: left;
	}

	div.stappen_content .block small {
		font-size: 11px;
	}

	div.stappen_content ul.producten_lijst {
		margin: 10px 0 0;
		padding: 0;
	}

		div.stappen_content ul.producten_lijst li {
			margin: 0 5px 10px 0;
			text-align: center;
			list-style: none;
			opacity: .75;
			float: left;
			padding: 0;
			width: 16%;
			position: relative;
		}

		div.stappen_content ul.producten_lijst li span.korting_15 {
			background: url('../img/15p_korting.png') top left no-repeat;
			height: 58px;
			width: 76px;
			position: absolute;
			top: 0; left: 0;
		}

		div.stappen_content ul.producten_lijst li.alt {
			margin: 0;
		}

			div.stappen_content ul.producten_lijst li span {
				margin: 0 0 10px;
				display: block;
				height: 252px;
				width: 142px;
			}

				div.stappen_content ul.producten_lijst li:hover {
					opacity: 1;
				}

	div.stappen_content ul.product_galerij {
		width: 142px;
		float: left;
		padding: 0;
		margin: 0;
	}

		div.stappen_content ul.product_galerij li {
			margin: 0 10px 10px 0;
			list-style: none;
			height: 66px;
			width: 66px;
			float: left;
			padding: 0;
		}

		div.stappen_content ul.product_galerij li.alt {
			margin: 0 0 10px 0;
		}

			div.stappen_content ul.product_galerij li img {
				border: 1px solid #ccc;
				background: #f5f5f5;
				display: block;
				height: 64px;
				width: 64px;
			}

	div.stappen_content .content_left {
		padding: 0 10px 0 0;
		width: 140px;
		float: left;
	}

	div.stappen_content .content_middle {
		border: 1px solid #ccc;
		margin: 0 15px 0 10px;
		font-size: 13px;
		padding: 10px;
		width: 480px;
		float: left;
	}

	div.stappen_content .content_both {
		border: 1px solid #ccc;
		padding: 10px;
		width: 698px;
		float: right;
		margin: 0;
	}

	div.stappen_content .content_both_btns {
		width: 730px;
		float: right;
		margin: 0;
	}

	div.stappen_content .content_middle ul.info {
		border-top: 1px dotted #ccc;
	}

		/* -------- INFO UL -------- */

		ul.info {
			border-top: 1px dotted #ccc;
			clear: both;
			padding: 0;
			margin: 0;
		}

			ul.info li {
				border-bottom: 1px dotted #ccc;
				background: #f8f8f8;
				min-height: 26px;
				list-style: none;
				padding: 7px 10px;
				clear: both;
				margin: 0;
			}

			ul.info li.alt {
				background: #fff;
			}

				ul.info li div.info-icon {
					margin: 0;
					padding: 5px 0 5px 10px;
					position: relative;
					color: #666666;
					float: right;
					cursor: help;
				}

					ul.info li div.info-icon div.answer-arrow {
						background: url('../img/icons/info-arrow.png') top left no-repeat;
						right: 18px; top: 3px;
						position: absolute;
						display: none;
						height: 11px;
						z-index: 99;
						width: 6px;
						padding: 0;
					}

					ul.info li div.info-icon div.answer {
						box-shadow: 0 3px 6px rgba(0,0,0,0.1);
						border: 1px solid #ccc;
						right: 23px; top: -7px;
						padding: 14px 14px 0;
						border-radius: 2px;
						position: absolute;
						background: #fff;
						display: none;
						width: 400px;
						z-index: 98;
					}

						ul.info li div.info-icon div.answer ul {
							margin: 0 0 15px 15px;
							padding: 0;
						}

							ul.info li div.info-icon div.answer ul li {
								background: none; border: 0;
								list-style: disc;
								padding: 0;
								margin: 0;
							}
						ul.info li div.info-icon div.answer ul.galerij {
							width: 100%;
							padding: 0;
							margin: 0;
						}

							ul.info li div.info-icon div.answer ul.galerij li {
								margin: 0 10px 10px 0;
								list-style: none;
								height: 66px;
								width: 66px;
								float: left;
								padding: 0;
								clear: none;
							}

								ul.info li div.info-icon div.answer ul.galerij li img {
									border: 1px solid #ccc;
									background: #f5f5f5;
									display: block;
									height: 64px;
									width: 64px;
								}

					ul.info li div.info-icon:hover div.answer-arrow, ul.info li div.info-icon:hover div.answer {
						display: block;
					}

				ul.info li .answer p:first-child {
					margin-top: 0;
				}

				ul.info li small p {
					padding: 0;
					margin: 0;
				}

				ul.info li.notification {
					background: url('../img/icons/warning.png') 10px 8px no-repeat;
					padding-left: 34px;
					line-height: 18px;
					font-size: 11px;
				}

				ul.info li.extra {
					line-height: 18px;
					font-size: 11px;
					padding: 1px 10px;
					color: #222;
				}

				ul.info li.notification p {
					margin: 0;
				}

				ul.info li label {
					padding: 2px 0 0;
					width: 135px;
					color: #666;
					float: left;
				}

				ul.info li div.col {
					padding: 2px 0 0;
					width: 200px;
					color: #666;
					float: left;
				}

				ul.info li div.col.width-5 {
					width: 100px;
				}

				ul.info li div.col.width1-5 {
					padding: 2px 0 0;
					width: 300px;
					color: #666;
					float: left;
				}

				ul.info li div.col.width2 {
					padding: 2px 0 0;
					width: 400px;
					color: #666;
					float: left;
				}

				ul.info li div.col.width2-5 {
					padding: 2px 0 0;
					width: 500px;
					color: #666;
					float: left;
				}

				ul.info li div.col.width3 {
					padding: 2px 0 0;
					width: 600px;
					color: #666;
					float: left;
				}

					ul.info li div h3 {
						margin: 0;
					}

				ul.info li div.right {
					text-align: right;
					float: right;
				}

				ul.info li .info_request {
					float: left;
					width: 520px;
				}

				ul.info li input[type="text"], ul.info li input[type="password"] {
					margin-right: 10px;
					padding: 3px;
					width: 201px;
					color: #666;
					float: left;
				}

					ul.info li input[type="text"].small {
						padding: 3px;
						float: left;
						width: 89px;
						margin: 0;
					}

				ul.info li select {
					border: 1px solid #ccc;
					padding: 1px 2px 2px;
					border-radius: 2px;
					font-size: 14px;
					width: 209px;
					color: #666;
					float: left;
				}

					ul.info li select.small {
						float: left;
						padding: 3px;
						width: 99px;
					}

				ul.info li textarea {
					padding: 5px;
					width: 298px;
					float: left;
				}

				ul.info li input[type="radio"] {
					margin: 3px 10px 0 0;
					float: left;
				}

		/* -------- INFO UL -------- */

		table.info {
			color: rgb(102, 102, 102);
			margin: 20px 0 0;
			width: 100%;
			padding: 0;
			border: 0;
		}

			table.info tr {
				padding: 0;
				margin: 0;
			}

				table.info tr td {
					border-bottom: 1px dotted #ccc;
					padding: 10px;
				}

				table.info tr td h3 {
					margin: 0;
				}

				table.info tr.alt td {
					background: #f8f8f8;
				}

		/* -------- END -------- */

		ul.info li textarea.edit_opmaak_eigen {
			margin-left: -10px;
			margin-top: -5px;
			min-height: 43px;
			height: 43px;
			width: 322px;
		}

		ul.info li textarea.edit_opmaak_printenco {
			margin-right: -10px;
			margin-left: -10px;
			margin-top: -5px;
			width: 468px;
		}

		.wetransfer {
			border: 1px dotted #bbb;
			margin: -5px -10px 0 10px;
			background: #f5f5f5;
			display: block;
			padding: 17px;
			height: 19px;
			float: left;
		}

			.wetransfer:hover {
				border: 1px dotted #888;
				background: #e5e5e5;
			}

	div.stappen_content .content_right {
		border: 1px solid #ccc;
		padding: 10px;
		width: 180px;
		float: right;
		clear: right;
	}

		div.stappen_content .content_right ul.info {
			padding: 0;
			margin: 0;
		}

			div.stappen_content .content_right ul.info strong {
				font-size: 14px;
			}

			div.stappen_content .content_right ul.info li {
				border-bottom: 1px dotted #ccc;
				overflow: hidden;
				list-style: none;
				font-size: 13px;
				padding: 10px 5px;
				margin: 0;
			}

			div.stappen_content .content_right ul.info li.prod_price {
				font-size: 22px;
				font-weight: bold;
				color: #257126;
				text-align:right;
				position:relative;
			}

			div.stappen_content .content_right ul.info li.prod_price span {
				font-size: 10px;
				line-height: 12px;
				display: inline-block;
			}

#webshop #show_success {
	margin: 10px 0 0 10px;
	text-align: center;
	display: none;
}

	#webshop #show_success a {
		text-decoration: underline;
		color: #FFF;
	}

	#webshop #show_success a:hover {
		text-decoration: none;
	}


/* ====== buttons ====== */

#webshop a.btn, #webshop div.btn, #content a.btn, #content span.btn, #subcontent a.btn {
	font-family: 'Open Sans Semibold', sans-serif;
	padding: 7px 20px 8px;
	text-decoration: none;
	border-radius: 2px;
	line-height: 18px;
	margin-top: 10px;
	font-size: 14px;
	cursor: pointer;
	display: block;
	float: left;
	color: #fff;
}

	#content span.btn {
		padding: 7px 10px 8px;
		margin: -45px 0 20px 8px;
	}

#webshop input.btn {
	font-family: 'Open Sans Semibold', sans-serif;
	padding: 6px 20px 6px;
	border-radius: 2px;
	line-height: 18px;
	margin-top: 10px;
	font-size: 14px;
	cursor: pointer;
	display: block;
	float: left;
	color: #fff;
}

	.btn.blue {
		background: #0070a9 url('../img/bg_btn.png') bottom repeat-x;
		box-shadow: inset 0 1px 0 #4a99c2;
		text-shadow: 0 1px 0 #14395d;
		border: 1px solid #005584;
	}

		.btn.blue:hover {
			background: #0070a9 url('../img/bg_btn-hover.png') bottom repeat-x;
			border: 1px solid #00477a;
		}

	.btn.grey {
		background: #d3d3d3 url('../img/bg_btn_grey.png') bottom repeat-x;
		box-shadow: inset 0 1px 0 #f4f4f4;
		text-shadow: 0 1px 0 #828282;
		border: 1px solid #a4a4a4;
	}

	#subcontent .btn.grey {
		border: 1px solid #777777;
		margin-bottom: 20px;
		display: none;
	}

		.btn.grey:hover {
			background: #c5c5c5 url('../img/bg_btn_grey-hover.png') bottom repeat-x;
			border: 1px solid #666666;
		}

	.btn.done {
		background: #439044 url('../img/bg_btn_done.png') bottom repeat-x;
		box-shadow: inset 0 1px 0 #75c075;
		text-shadow: 0 1px 0 #257126;
		border: 1px solid #257126;
	}

		.btn.done a, #content .btn.done a, span.btn a {
			color: #fff;
		}

	#webshop .btn.left, #content .btn.left, #subcontent .btn.left {
		margin-right: 10px;
		float: left;
	}

	#webshop .btn.right, #content .btn.right, #subcontent .btn.right {
		margin-left: 10px;
		float: right;
	}

	/** DISCOUNT **/
.discount_label {
	font-family: 'barmenoroman', Arial, sans-serif;
	text-shadow: -1px -1px 1px #444;
	background: url('../img/label.png') center center no-repeat;
	color: white;
	font-size: 13px;
	line-height: 13px;
	text-align: center;
	position: absolute;
	width: 65px;
	height: 67px;
}
.discount_label strong {
	margin-top: 16px;
	font-size: 16px;
	line-height: 16px;
	display: inline-block;
	color: white;
}