/* common */

* { margin: 0; padding: 0; font-size: 12px; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; color: #522B00; }
html, body { height: 100%; }

body, input, select, textarea { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 12px; }
img { border: 0; }
a { color: #336600; text-decoration: none; font-weight: bold; }
a:hover { color: #EF0019; text-decoration:none; }

table caption {
	text-align: left;
}

label {
		font-weight: bold;		
}
body { 
	background-color: #FFFFFF;
	background-image: url("images/bg_body.jpg");
	background-repeat: repeat-x;
	margin: 0; padding: 0;
}
h2 {
	margin-top: 5px;
	font-size: 17px;
	font-weight:bold;
}
h3 {
	font-size: 14px;
	font-weight:bold;
}
h5 {
	font-size: 12px;
	font-weight:bold;
}
input {
	border: solid 1px #999999;
}

input.foutveld {
	border: solid 2px #F00;
}
.verderlink{
		padding: 0px;
		margin: 0px;
		float:right;
		border: none;
		font-size:11px;
		color: #336600;
		background-color: transparent;
	}
	
.warning {
	color: #EF0019;
	font-weight:bold;
}

/* header */	
	#header {
	padding:0px;
  	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: auto;
	margin-right: auto;
	width: 992px;
	height: 155px;
	background-image: url("images/bg_header.jpg");
	background-repeat: no-repeat;
	}
	#logobar{
	background-image: url("images/logo.png");
	background-repeat: no-repeat;
	margin-left: -37px;
	height:222px;
	position:relative;
	z-index:1;
	}
	/* searchform */

	#searchbox {
		margin: 112px 23px 0px 0px;
		padding: 0px 0px 0px 0px;
		float: right;
	}
	#searchbox .searchfield{
		padding: 0px;
		margin: 0px 8px 0px 0px;;
		border: none;
		width:182px;
		height: 20px;
		background-color:#FFF;
	}
	#searchbox .searchbutton{
		margin: 0px;
		padding:0px;
		border: none;
		background-color:#FFF;
		height: 20px;
		width: 61px;
		font-weight:bold;
		vertical-align: middle; 
		*vertical-align: text-bottom;
	}


	#topnavbar{
	width:100%;
	height:18px;
	background-color:#522B00;
	}
	#nav{
	padding:0px 0px 0px 8px;
  	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: auto;
	margin-right: auto;
	width: 992px;
	position:relative;
	z-index:2;
	}
	#topmenu {
	margin: 0px;
	padding: 0px 0px 0px 336px;
	float: left;
	}	
	#topmenu li {
	list-style-type: none;
	font-weight: normal;
	display: inline;
	margin: 0px;
	font-size: 11px;
	color: #EEB027;
	}
	#topmenu li a {
	color: #EEB027;
	font-weight: normal;
	}
	#topmenu li a:hover {
	color: #EE0019;
	}
	#topmenuright {
	margin: 0px 28px 0px 0px;
	float:right;
	padding: 0px;
	}	
	#topmenuright li {
	list-style-type: none;
	font-weight: normal;
	display: inline;
	margin: auto;
	font-size: 11px;
	color: #FFFFFF;
	}
	#topmenuright li a {
	color: #FFFFFF;
	font-weight: normal;
	}
	#topmenuright li a:hover {
	color: #EE0019;
	}
/* main container */	
	#main_container {
	padding:0px;
  	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: auto;
	margin-right: auto;
	background-color:#FFFFFF;
	width: 992px;
	min-height: 100%;
  	height:auto !important; /* for modern browsers */
  	height:100%; /* this is for IE*/
	background-image: url("images/bg_main_container.jpg");
	background-repeat: no-repeat;
	/* border: solid 1px #3F0; */
	}

/* containers */
	#content_container{
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		float: left;
	}
	#center_content{
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		width: 428px;
		float: left;
		/*border: solid 1px #909;*/
	}
	#center_content h2 {
		margin-bottom: 18px;
	}
	#myorders{
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		width: 662px;
		float: left;
		/* border: solid 1px #909; */
		text-align: left;
	}
	
/* producten */	

	.prod_box_thumb {
		padding: 0px;
		margin: 0px;
		float: left;
		width: 208px;
		height: 254px;
		background-image: url("images/bg_prod_thumb.png");
		background-repeat: no-repeat;
	}
	.prod_box_thumb:hover {
		background: url("images/bg_prod_thumb_hover.png");
		background-repeat: no-repeat;
		cursor: pointer;
	}
	.prod_box_lijst {
		padding: 0px;
		margin: 0px;
		width: 412px;
		height: 254px;
		background-image: url("images/bg_prod_lijst.png");
		background-repeat: no-repeat;
	}
	.prod_admin_edit {
		clear:both;
	}
	.prod_box_groot {
		padding: 0px 20px 0px 20px;
		margin: 0px;
		width: 365px;
		height: 374px;
		background-image: url("images/bg_prod_groot.png");
		background-repeat: no-repeat;
		text-align: center;
		position:relative;
		z-index:4;
	}
	.prod_container {
		padding: 2px;
		margin: 0px;
		float: left;
		width: 194px;
		height: auto;
	}
	.prod_container:hover {
		cursor: pointer;
	}
	.prod_new {
		width:110px;
		height: 70px;
		float: left;
		background: url("images/label_nieuw.png");
		background-repeat: no-repeat;
		position:absolute;
		z-index:5;
	}
	.prod_new_groot {
		width:165px;
		height: 98px;
		background: url("images/label_nieuw_groot.png");
		background-repeat: no-repeat;
		position:absolute;
		z-index:5;
	}
	.prod_info {
		padding: 190px 0px 0px 18px;
		margin: 0px;
		width: 170px;
		text-align: left;
		font-size:11px;
		position:relative;
		z-index:6;
	}
	.prod_info_groot {
		padding: 0px 10px 0px 13px;
		margin: 0px;
		width: 336px;
		height: 21px;
		text-align:left;
		background-color:#BFE97A;
		font-size:11px;
		position:relative;
		z-index:6;
	}
	.prod_info_groot h5{
		float:left;
	}
	
	.prod_info input {
		padding: 0px;
		xmargin-top: -10px;
		margin-right: 0px;
		float:right;
		border: 0;
		font-size:11px;
		color: #336600;
		background-color: transparent;
		}
		
	.prod_info input.toon {
		padding: 0px;
		margin-top: 8px;
		margin-right: 0px;
		float:right;
		border: 0;
		font-size:11px;
		color: #336600;
		background-color: transparent;
		}
	.prod_info input:hover {
			background-color:#C9EC8E;
		}
	.prod_info h5{
		font-size:12px;
	}
	.prod_img {
		padding-top: 12px;
		width: 194px;
		height: 179px;
		text-align: center;
		position:absolute;
		z-index:4;
	}
	.prod_img a {
		width: 194px;
		height: 179px;
		display: block;
		border: 0;
	}
	
	
	.prod_img_groot {
		padding-top: 8px;
		width: 326px;
		height: 326px;
		text-align: center;
	}
	.prod_bestelinfo_container {
		padding: 15px 0px 0px 0px;
		margin-left: 26px;
		width: 180px;
		height: auto;
		float: left;
		text-align: left;
		font-size:11px;
	}
	.prod_bestelinfogroot_container {
		padding: 18px 19px 0px 15px;
		margin: 18px 0px 0px 0px;
		width: 182px;
		height: 374px;
		background-image: url(images/bg_bestelinfo_groot.jpg);
		background-repeat:no-repeat;
		float: left;
		text-align: left;
		font-size:11px;
	}
	
	.prod_bestelinfo_container select, .prod_bestelinfogroot_container select {
		width: 167px;
		margin-bottom: 6px;
		}
	.bestelknop {
		padding-right: 2px;
		padding-left: 2px;
		height: 31px;
		width: 170px;
		border: solid 1px #D5D5D5;
		color: #336600;
		font-weight: bold;
		background-image:url(images/bg_bestelknop.gif);
		background-repeat:repeat-x;		
	}
	.bestelknop2 {
		margin-top: 5px;
		padding-right: 2px;
		padding-left: 2px;
		height: 31px;
		width: 170px;
		border: solid 1px #D5D5D5;
		color: #336600;
		font-weight: normal;
		background-color: #FFF;
	}
	.bestelknop:hover, .bestelknop2:hover {
		border: solid 1px #BFE97A;
	}
	.bestelknop_container {
		margin: 0px;
		padding: 20px 0px 5px 0px;
	}	
	#cart_container {
		padding:10px 0px 0px 0px;
  		margin-top: 0px;
		margin-bottom: 0px;
		margin-left: auto;
		margin-right: auto;
		width: 992px;
		height: 98px;	
		}
		#cart {
		padding: 0px;
		margin: 0px  28px 0px 0px;
		float: right;
		width: 166px;
		font-weight: bold;
		line-height:15px;
		}
		#cart a {
		font-size: 10px;
		}
		#right_content {
		padding: 0px;
		margin 0px;
		width: 235px;
		float: left;
		}
		#right_content p{
			color: #836647;
		}
		.placeholder {
			height: 18px;
		}
		.placeholder2 {
			height: 45px;
		}
		
/* afrekenen*/

	#steps {
		margin: 5px 12px 5px 0px;;
		float:right;
	}
	.kopsteps {
	margin-top: 5px;
	margin-bottom: 5px;
	display: block;
	float:left;
	font-size: 17px;
	font-weight:bold;
	}
	.formdivider {
		padding:0px;
		margin: 0px;
		width: 367px;
		background-image:url(images/divider_wit.gif);
		background-repeat:repeat-x;
	}
	#checkoutform, #aanmeldform {
		margin:0px 0px 10px 0px;
		padding: 28px 23px 23px 23px;
		width:357px;
		float: left;
		min-height: 249px;
		height: auto;
		background-image:url(images/bg_form.png);
		background-repeat:no-repeat;
		border: solid 1px #E2E2E2;	
	}
	#aanmeldform input, #aanmeldform select {
		width: 208px;
		margin-top: 2px;
		margin-bottom: 2px;
	}
	#aanmeldform label {
		display: block;
		width: 150px;
		font-weight: normal;		
	}
	#aanmeldform input.checkbox {
		width: auto;
		padding: 0px;
		margin: 2px 5px 2px 0px;
		border: solid 1px;
		text-align:left;
	}

/* datatable */
#myorders .datatable, .checkouttable {
		border-top: 1px solid #BFE97A;
		border-collapse: collapse;
		margin-left:auto; 
		margin-right:auto;
}

#myorders .datatable tr, .checkouttable tr {
		border-bottom: 1px solid #BFE97A;
	
}
#myorders .datatable td, .checkouttable td {
		border-bottom: 1px solid #BFE97A;
		padding: 4px;
		text-align: left;
    	vertical-align: top;
		background-color: #FFFFFF;
}
#myorders .datatable th {
		font-weight: bold;
		color: #522B00;
		text-align: left;
		padding: 4px;
        border: 1px solid #FFF;
	    background-color: #BFE97A;
}
.checkouttable caption {
		font-size: 14px;
		font-weight: bold;
		text-align: left;
}
#myorders .datatable caption {
		font-size: 17px;
		font-weight: bold;
		text-align: left;
		margin-top: 5px;
		padding-bottom: 18px;
}
#myorders .datatable tr.altrow {
		background-color: #E9EEF5;
		color: #000000;
}
		
			
/* about */

	#about_container {
		padding: 26px 22px 23px 46px;
		margin: 0px 0px 20px 0px;
		width: 328px;
		text-align: left;
		border: solid 1px #DFF4BC;
	}
	#about_container li {
		list-style-type:square;
		list-style-position:inside;
		margin-bottom:5px;
	}
	

/* menu right */
	#menu_right{
	float:left;
	padding:0px;
	width: 211px;
	margin: 0px 0px 0px 92px;
	height:auto;
	}
	.prodnavlist li {
	list-style-image:url(images/navlist_bullet.gif);
	font-weight: bold;
	margin-left: 18px;
	margin-top: 1px;
	padding:2px 0px 0px 0px;
	font-size: 11px;
	color: #522B00;
	}
	.prodnavlist li a {
	padding: 0px;
	font-weight: bold;
	display:block;
	height: 18px;
	color: #522B00;
	}
	.prodnavlist li.active a {
	color: #8ED021; 
	}
	.prodnavlist li.active a:hover {
	text-decoration: none; 
	}
	.prodnavlist li.nieuw a {
	color: #EF0019; 
	}
	
	.navlist li {
	list-style-type:none;
	margin-left: 0px;
	margin-top: 1px;
	padding:2px 0px 0px 0px;
	font-size: 11px;
	font-weight: normal;
	color: #522B00;
	}
	.navlist li a {
	padding: 0px;
	display:block;
	height: 18px;
	color: #522B00;
	font-weight: normal;
	}
	
	.navlist li.active a {
	color: #8ED021;
	}
	#menu_right li a:hover {
	color: #EE0019;
	}
/* footer */	
	#footer {
	padding: 0px;
  	margin-top: 20px;
	margin-bottom: 0px;
	margin-left: auto;
	margin-right: auto;
	clear: both;
	width: 992px;
	height: 46px;
	bottom:0px;
	background-image: url("images/bg_footer.gif");
	background-repeat: repeat-x;
	}
	#footernav {
	margin: 0px;
	padding:11px 0px 0px;
	}
	#footernav li {
	list-style-type: none;
	float: left;
	margin: 0px 8px 0px 0px;
	font-size: 11px;
	color: #ED0019;
	}
	#footernav li a {
	padding: 0px;
	color: #EF0019;
	font-weight: normal;
	}
	#footernav li a:hover {
	text-decoration: underline;
	}
	#copyright{
	color: #ED0019;
	height:46px;
	float:right;
	vertical-align: middle; 
	*vertical-align: text-bottom;
	}
/* (?) popup properties */
a.info{
    position:relative; /*this is the key*/
    z-index:24; background-color:red; 
    color:#000;
    text-decoration:none;
    font-size: 11px;
    font-weight: normal;
	cursor: hand;
}
a.info:hover{z-index:90; background-color:#ff0}

a.info span{display: none}

a.info:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    z-index: 90;
    top:2em; left:1em; width:25em;
    border:1px solid #0cf;
    background-color:#cff; color:#000;
    text-align: left
}