/******************************************
DEM
CSS : Eefje Ferwerda
E-mail: eferwerda@lautenbagreclame.nl
WWW: http://www.lautenbag.nl
---------------------------------------
CSS bestand vrijgegeven onder C.C. licentie:
http://creativecommons.org/licenses/by-sa/2.0/nl/
******************************************/

:-moz-any-link:focus {outline: none;}
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, font, img, ins, kbd, q, s, samp,
sub, sup, tt, var, dd, dl, dt, li, ol, ul, form, fieldset, input, textarea, label, 
table, legend, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	font-family: inherit;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	text-align: left;}

img, a img, :link img, :visited img {border: 0;}
div.clear {clear: both; width: 100%; height: 0px;}

/*LAYOUT
**************************************************/
div#site{
	background: transparent;
	}

body {
		font: normal 12px lucida, sans-serif, tahoma, arial;
		background: #ccc url("img/bg_container.jpg") center top repeat-y;
		}

a:link{
	color: #003772;
	text-decoration: none;
}

a:visited{
	color: #003772;
	text-decoration: none;
}

a:hover{
	color: #e3001a;
	text-decoration: none;
}

a:active{
	color: #e3001a;
	text-decoration: none;
}

div#top{
  height: 210px;
  width: 100%;
  background: #cccccc;
  position: fixed;
  }

div#main{
  width: 100%;
  }

div#bottom{
  clear: both;
  background: #cccccc;
  margin: 0 auto;	
  height: 0px;
  }

div#header{
  width: 960px;
  height: 210px;
  margin: 0 auto;
  margin-bottom: -5px;
  }

div#container{
  width: 960px;
  margin: 0 auto;
}

div#footer{
	clear: both;
  width: 960px;
  margin: 0 auto;
  height: 0px;
  margin-top: -15px;
  }

div#headerimg{
  width: 960px;
  height: 210px;
  float: left;
  display: inline;
  }

div#menu{
  width: 800px;
  height: 32px;
  float: left;
  display: block;
  clear: left;
  margin: 0px 0 0 -85px;
  position: fixed;
  background: #fff;
  }
  
div#content{
  float: right;
  display: inline;
  width:750px;
  margin-top: 210px;
  margin-bottom: 225px;  
  }

div#sidebar{
  float:left;
  display: inline;
  width:190px;
  margin-left: 10px;
  padding-bottom: 15px;
  margin-top: 205px;
  position: fixed;
  }

/*menu horizontaal
**************************************************/
div#menu ul#menu {
	float: left;
	display: inline;
}

div#menu ul#menu li{
	float: left;
	display: block;
	font-size: 13px;
	text-transform: uppercase;
	background-color: #e3001a;
	margin-right: 40px;
	cursor: pointer;
}

div#menu ul#menu li a{
	padding: 8px 18px 6px 18px;
}

div#menu ul#menu li:hover{
	background: #003772;
}

div#menu ul#menu li a{
display: block;
}


div#menu ul#menu li a:link{
	display: block;
	color: #fff;
}

div#menu ul#menu li a:visited{
	display: block;
	color: #fff;
}

div#menu ul#menu li a:hover{
	display: block;
	color: #fff;
}

div#menu ul#menu li a:active{
	display: block;
	color: #fff;
}

/*menu verticaal
**************************************************/
div#sidebar ul#menuverticaal {
	float: right;
	display: inline;
	margin-top: 50px;
	margin-right: -1px;
}

div#sidebar ul#menuverticaal li{
	float: right;
	display: block;
	clear: both;
	font-size: 12px;
	text-transform: uppercase;
	background-color: #fff;
	margin-top: 6px;
	margin-right: 0px;
	cursor: pointer;
	width: 160px;
}

div#sidebar ul#menuverticaal li a{
	padding: 8px 0px 6px 10px;
}

div#sidebar ul#menuverticaal li a{
	display: block;
}

div#sidebar ul#menuverticaal li:hover {
	border-left: 5px solid #e3001a;
}

div#sidebar ul#menuverticaal li a:link{
	display: block;
}

div#sidebar ul#menuverticaal li a:visited{
	display: block;
}

div#sidebar ul#menuverticaal li a:hover{
	display: block;
}

div#sidebar ul#menuverticaal li a:active{
	display: block;
}

/*Typhography
**************************************************/
h1 {
	font-weight: 600;
	font-size: 16px;
	color: #003772;
}

h2 {
	font-weight: 600;
	font-size: 14px;
	color: #e3001a;
}


h3 {
	font-weight: 600;
	font-size: 13px;
	color: #000;
	margin-top: 10px;
}

h4 {
	font-weight: 600;
	font-size: 12px;
	color: #e3001a;
}

h5 {
	font-weight: 600;
	font-size: 12px;
	color: #000;
}

h6 {
	clear: left;
	font-weight: 500;
	font-size: 10px;
	color: #000;
	margin-bottom: 5px;
}

p {
	line-height: 18px;
	margin-bottom: 10px;
}

ul {
	margin-bottom: 10px;
}
li {
	font: normal 12px lucida, sans-serif, tahoma, arial;
	line-height: 18px;
	list-style-position: inside;
}
	
	
/*content
**************************************************/
div#text {
	width: 650px;
	clear: left;
	float: left;
	display: inline;
	margin: 80px 0 0 30px;
}

/*pennen
**************************************************/
div.kleuren {
	float: left;
	display: inline;
	margin: -40px 0 0 100px;
	}

div.kleur {
	float: left;
	display: inline;
	margin-left: 15px;
	}

img#penafbeelding {
	float: left;
	display: inline;
	margin-bottom: 15px;
}

table#penneninfo {
	float: left;
	display: inline;
	width: 666px;
	border: 1px solid #000;
	border-bottom: 0px;
	border-right: 0px;
	clear: left;
	border-collapse: collapse;
	border-spacing: 0px;
	font-size: 11px;
	line-height: 13px;
	margin-top: 15px;
	margin-bottom: 5px;
}

table#penneninfo td{
	width: 122px;
	height: 10px;
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
	float: left;
	display: inline;
	padding: 5px 0px 5px 10px;
}

div#box {
	float: left;
	display: inline;
	width: 668px;
	background: light blue;
	border-bottom: 1px solid #757474;
	margin-top: 20px;
	margin-bottom: 10px;
}

div#box p {
	clear: left;
}

div.lichtgrijs {
	float: left;
	display: inline;
}

input {
	margin-left: 8px;
	float: left;
	display: inline;
	clear: left;
}

input#aantal-prijs {
	margin: -2px 5px 0px -2px;
}


div#bestelknop {
	float: right;
	display: inline;
	margin-bottom: 5px;
	/*margin-top: -10px;*/
}

div#bestelknop input.bestelknop{
	clear: none;
	float: left;
	display: inline;
	font-size: 13px;
	text-transform: uppercase;
	color: #fff;
	background-color: #e3001a;
	margin: 0 0 0 10px;
	cursor: pointer;
	border: none;
	padding: 10px 5px 6px 5px;
}

div#bestelknop input.bestelknop:link{
	color: #fff;
}

div#bestelknop input.bestelknop:visited{
	color: #fff;
}

div#bestelknop input.bestelknop:hover{
	color: #fff;
	background-color: #003772;
}

div#bestelknop input.bestelknop:active{
	color: #fff;
	background-color: #003772;
}


div#bestelknop a:link{
	color: #fff;
}

div#bestelknop a:visited{
	color: #fff;
}

div#bestelknop a:hover{
	color: #fff;
}

div#bestelknop a:active{
	color: #fff;
}


/*Contactformulier
**************************************************/

div#formulier {
	margin-top: 0px;
	padding-right: 30px;
	padding-top: 15px;
	width: 580px;
	float: left;
	display: inline;
	clear: none;
	}

div#formulier h2{
	margin-bottom: 5px;
}
	
form#formulier{
	margin: 0px 0 0px 0px;
	width: 585px;
	line-height: 16px;
	height: 368px;
	}

form#formulier div label{
	width: 80px;
	float: left;
	display: inline;
	}

form#formulier input{
	clear: none;
	float: left;
	display: inline;
	width: 180px;
	margin: 0px 25px 10px 0px;
	}
	
input.single{
	float: right;
	display: inline;
	width: 150px;
	}

form#formulier textarea{
	clear: none;
	float: left;
	display: inline;
	width: 475px;
	height: 80px;
	margin: 0px 0px 10px 0px;
	}

form#formulier input.knop{
	height: 28px;
  width: 28px;
  text-align: center;
  color: #fff;
  background-color: transparent;
  border: none;
 	float: left;
  display: inline;
  margin: 0px 0 10px 80px;
  height: 30px;
  width: 60px;
  background-color: #e3001a;
  cursor: pointer;
 	}

div.clearform {
	clear: both;
}

sup{
		color: #e30000;
}

/*bestelformulier
**************************************************/

div#bestelformulier {
	margin-top: 0px;
	padding-right: 30px;
	padding-top: 15px;
	width: 600px;
	float: left;
	display: inline;
	clear: none;
	}

div#bestelformulier h3{
	margin-bottom: 5px;
}
	
form#bestelformulier{
	margin: 0px 0 0px 0px;
	width: 650px;
	line-height: 16px;
	height: 368px;
	}

form#bestelformulier div label{
	width: 90px;
	float: left;
	display: inline;
	}
	
form#bestelformulier div label.captcha{
	width: 275px;
	float: left;
	display: inline;
	}

form#bestelformulier input{
	clear: none;
	float: left;
	display: inline;
	width: 180px;
	margin: 0px 25px 10px 0px;
	}
	
input.single{
	float: right;
	display: inline;
	width: 150px;
	}

form#bestelformulier textarea{
	clear: none;
	float: left;
	display: inline;
	width: 475px;
	height: 80px;
	margin: 0px 0px 10px 0px;
	}

form#bestelformulier input.knop{
	height: 28px;
  width: 28px;
  text-align: center;
  color: #fff;
  background-color: transparent;
  border: none;
 	float: left;
  display: inline;
  margin: 0px 0 10px 90px;
  height: 30px;
  width: 70px;
  background-color: #e3001a;
  cursor: pointer;
 	}

div.clearform {
	clear: both;
}

sup{
		color: #e30000;
}


div#aantal_drukkleuren {
	width: 50px;
	float: left;
	display: inline;
	margin-right: 20px;
	margin-left: 25px;
	background: transparent;
}

div#aantal_drukkleuren input{
	margin-top: 0px;
	margin-left: -25px;
	float: left;
	display: inline;
	background: transparent;
	padding: 0px;
	position: absolute;
}

input#upload {
	text-align: center;
}

/*KLEUREN
**************************************************/

div.invulkleur {
	width: 30px;
	height: 30px;
	background: #ccc url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.wit {
	width: 30px;
	height: 30px;
	background: #f5f5f5 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.PMSyellowC {
	width: 30px;
	height: 30px;
	background: #ffe100 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.PMS186 {
	width: 30px;
	height: 30px;
	background: #cc092f url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.PMS072 {
	width: 30px;
	height: 30px;
	background: #001ca8 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.PMS292 {
	width: 30px;
	height: 30px;
	background: #5eb0e5 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.PMS364 {
	width: 30px;
	height: 30px;
	background: #417630 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.PMS360 {
	width: 30px;
	height: 30px;
	background: #5cc151 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.zwart {
	width: 30px;
	height: 30px;
	background: #000 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.PMS380 {
	width: 30px;
	height: 30px;
	background: #d7e241 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.PMS7434 {
	width: 30px;
	height: 30px;
	background: #9a3056 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.PMS2748 {
	width: 30px;
	height: 30px;
	background: #00257b url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.PMS341 {
	width: 30px;
	height: 30px;
	background: #007c5a url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.PMS407 {
	width: 30px;
	height: 30px;
	background: #b6aca7 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

/***kleuren in hex classes***/

div.ffe100 {
	width: 30px;
	height: 30px;
	background: #ffe100 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.cc092f {
	width: 30px;
	height: 30px;
	background: #cc092f url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.001ca8 {
	width: 30px;
	height: 30px;
	background: #001ca8 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.5eb0e5 {
	width: 30px;
	height: 30px;
	background: #5eb0e5 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.417630 {
	width: 30px;
	height: 30px;
	background: #417630 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.5cc151 {
	width: 30px;
	height: 30px;
	background: #5cc151 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}


div.d7e241 {
	width: 30px;
	height: 30px;
	background: #d7e241 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.9a3056 {
	width: 30px;
	height: 30px;
	background: #9a3056 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.00257b {
	width: 30px;
	height: 30px;
	background: #00257b url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.007c5a {
	width: 30px;
	height: 30px;
	background: #007c5a url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.b6aca7 {
	width: 30px;
	height: 30px;
	background: #b6aca7 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

/***kleuren in kleur***/

div.wit {
	width: 30px;
	height: 30px;
	background: #f5f5f5 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.zwart {
	width: 30px;
	height: 30px;
	background: #000 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.grijs {
	width: 30px;
	height: 30px;
	background: #BDBFCC url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.blauw {
	width: 30px;
	height: 30px;
	background: #0A50A1 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.donkerblauw {
	width: 30px;
	height: 30px;
	background: #2C3A83 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.roodbruin {
	width: 30px;
	height: 30px;
	background: #C94F44 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.oranje {
	width: 30px;
	height: 30px;
	background: #FF8400 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.groen {
	width: 30px;
	height: 30px;
	background: #008631 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.zeegroen {
	width: 30px;
	height: 30px;
	background: #14C6D8 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.geel {
	width: 30px;
	height: 30px;
	background: #F6D200 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.donkergrijs {
	width: 30px;
	height: 30px;
	background: #666666 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.paars {
	width: 30px;
	height: 30px;
	background: #971888 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.roze {
	width: 30px;
	height: 30px;
	background: #F668B2 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.rood {
	width: 30px;
	height: 30px;
	background: #FF0000 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.lichtgroen {
	width: 30px;
	height: 30px;
	background: #50EA36 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.lichtblauw {
	width: 30px;
	height: 30px;
	background: #74D5FE url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}

div.bruin {
	width: 30px;
	height: 30px;
	background: #713A00 url("img/kleuren.gif") center top no-repeat;
	float: left;
	display: inline;
	margin-bottom: 2px;
}


