html, body {
	width: 100%;
	background: #ffffff url(/images/body_bg2.gif) repeat-y center top;
	color: #000000;
}


#container {
	width: 1002px;
	margin: auto;
}

	#page-header {
		height: 105px;
		background: #FFFFFF url(/images/header_BE_Done.jpg) no-repeat top left;
		text-align: right;
		vertical-align: bottom;
	}
	
		#page-header-wrapper {
			position: relative;
			width: auto;
			height: 100%;
		}
	
		div#logo {
			position: absolute;
			top: 10px;
			left: 20px;
		}
		
		div#userMenu {
			height: 24px;
			padding: 0px 0px 0px 0px;
			color: #000000;
			/*font-weight: bold;*/
			position: absolute; 
			top: 0px;
			right: 0px; 
		}

			div#userMenu a {
				color: #000000;
				/*font-weight: bold;*/
				text-decoration: none;
			}
			
			div#userMenu a:hover {
				color: #3878CF;
				/*font-weight: bold;*/
				text-decoration: underline;
			}

a.tabLink {
	font-family: Verdana, "MS Sans Serif", sans-serif;
	font-size: 10px;
	font-weight:bold;
	color: #FFFFFF;
	margin: 11px 5px 0px 4px;
	text-decoration: none;
	text-transform: uppercase;
	white-space: nowrap;
}

.tabIdle {
	background-repeat: repeat-x;
	background-image: url(/images/tabStripeOff.gif);
}

.tabActive {
	background-repeat: repeat-x;
	background-image: url(/images/tabStripeOn.gif);
}

div.tabProdOn {
	width: 120px;
	height: 16px;
	margin-right: 3px;
	border: 1px solid;
	border-color: #8AA5D0 #8AA5D0 #FFFFFF #8AA5D0;
	float: left;
	text-align: center;
	font-weight: bold;
	cursor: pointer;
}

div.tabProdOff {
	width: 120px;
	height: 16px;
	margin-right: 3px;
	border: 1px solid;
	border-color: #8AA5D0 #8AA5D0 #8AA5D0 #8AA5D0;
	background: url('/images/tabProdViewOff.gif') repeat-x;
	float: left;
	text-align: center;
	font-weight: bold;
	cursor: pointer;
}

td#userMenu { color: #FFFFFF; }
td#userMenu a { color: #FFFFFF; }

.tabProdContentOn {
	display: table;
	visibility: visible;
	min-height: 50px;
	height: 50px;
	padding: 0px;
	clear: both;
	border-bottom: 1px solid #8AA5D0;
	overflow: hidden;
}

.tabProdContentOff {
	display: none;
	visibility: hidden;
	clear: both;
}

ul.specBrowser {
	list-style-image: url('/images/arrow_3.gif');
	margin-top: 0px;
	position: relative;
	left: 10px;
}

ul.specBrowser li {
	position: relative;
	left: -10px;
}

ul.specBrowser a:hover {
/*	background: #FFFFFF url('/images/li_bg.gif') repeat-y;	*/
	position: relative;
	left: 2px;
}

ul.specChosen {
/*	list-style-image: url('/images/remove.gif'); */
	list-style: none;
	margin-top: 0px;
	margin-bottom: 0px;
	position: relative;
	left: -10px;
}

ul.specChosen li {
	position: relative;
	left: -10px;
}

a.rem {
	color: #33CCFF;
	text-decoration: underline;
}

hr.specBrowser {
	width: 120px;
	height: 1px;
	margin: 15px 0px 15px 0px;
	background-color: #BBC3D3;
	border-bottom: 0px solid #BBC3D3;
}

div#toolTip {
	width: 350px;
	height: 200px;
	position: absolute;
	top: 32px;
	right: 20px;
	padding: 3px;
/*	background-color: #FEFBCE;	*/
	background-color: #FFFFFF;
	border: 1px solid #000000;
	color: #000000;
	z-index: 10000;
	
}

div.showTip {
	display: block;
	visibility: visible;
	position:relative;
	z-index: 10000;
}

div.hideTip {
	display: none;
	visibility: hidden;
}

td.header {
	height: 22px;
	background: url('/images/bg_header_gh.gif') repeat-x;
	text-align: left;
}

td.header2 {
	height: 22px;
	background: url('/images/footer_bg.gif') repeat-x;
	text-align: left;
	color: #333333;
}

/* --- Laag voor het vergroten van thumbnails --- */

div#photoLayer {
	position:absolute;
	top:50px;
	left:50%;
	width:1000px;
	margin-left:-500px;
	text-align:center;
	z-index:20;
}

div#photoLayer img {
	margin-right:auto;
	margin-left:auto;
	text-align:center;
	display:block;
	clear:both;
}

div#photoLayer img#photoLayerPhoto {
	border: 8px solid #cccccc;
}

div#photoLayer img#photoLayerPhoto.noborder {
	border:0px none;
}

.visible {
	display: block;
	visibility:visible;
}

.invisible {
	display: none;
	visibility:hidden;
}

.module {

	border:1px solid #DADADA;

	padding:12px;

	background-image: url(/images/moduleBg.gif);

	background-repeat:repeat-x;

	font-family: Verdana, Arial;

	font-size:10px;

	color:#333333;

	vertical-align:top;

	margin-right: 3px;
}
.Gradientbox       {border:1px solid #DADADA;padding:12px;	background-image: url(/images/moduleBg.gif);	background-repeat:repeat-x;}

.subcat {background-color: #fffff; height:20px; border-bottom: 1px #9CC7F7 dotted;}
.subcat td {padding: 0;}

.subcatOver {background-color: #E7EBF8; height:20px; border-bottom: 1px #9CC7F7 dotted; cursor:pointer;}

.MenuRight {background-color: #fffff; height:20px; border-top: 1px #9CC7F7 dotted; font-weight:bold;}
.MenuRightOver {background-color: #E7EBF8; height:20px; border-top: 1px #9CC7F7 dotted;font-weight:bold;cursor:pointer;}
	#Layer1 {
	position:absolute;
	left:4px;
	top:2px;
	width:393px;
	height:58px;
	z-index:1001;
}

.rightMenuDocs li a	{
	display: block;
}

/* <= End: SpecBrowser Horizontal <= */
/* <==== End: Shop classes ================================================< */

table.products-table {
    width: 100%;
    margin: 0 auto;
    border-spacing: 6px 6px; /* Equivalent of cellspacing attribute of table tag, doesn't work in IE? */
}

table.products-table td.product {
    width: 200px;
    min-height: 120px;
    border: 1px solid #cccccc;
    -moz-border-radius: 6px;
}

able.products-table {
    width: 100%;
    margin: 0 auto;
}

table.products-table td.product {
    width: 210px;
    min-height: 120px;
    border: 1px solid #cccccc;
    -moz-border-radius: 6px;
}

table.products-table tr.product-row-footer td {border-bottom: 1px solid #999999;}

div.product-box-container {
    position: relative;
    width: 100%;
    height: auto;
    min-height: 100%;
}

    table.product-box {width: 100%; height: auto;}
    table.product-box td, table.product-box th {padding: 3px; font-size: 11px;}
    table.product-box tr.header th h2 a {font-size: 13px; font-weight: bold; text-decoration: none; color: #435073; !important;}
    table.product-box td.price {text-align: left; font-size: 12px; font-weight: bold;}

    div.stamp {
        position: absolute; /* The parent element in the DOM must have position: relative. */
        bottom: 0;
        left: -12px;
        z-index: 10;
        width: 50px;
        height: 50px;
        background: transparent url("/media/img/brievenbus_ok.gif") no-repeat top left;
    }
    
    div.stamp-small {
        position: absolute; /* The parent element in the DOM must have position: relative. */
        bottom: 0;
        z-index: 10;
        width: 25px;
        height: 25px;
        background: transparent url("/media/img/brievenbus_ok_small.gif") no-repeat top left;
    }

/* >==== Start: Global class library ======================================> */
.error {color: red;}
.empty {font-size: 1px !important; line-height: 1px !important;}
.hover {cursor: pointer !important;}
.full-width {width: 100%;}
.auto-width {width: auto;}
.auto-margin {margin-left: auto; margin-right: auto;}
.no-border {border: none !important;}

.block {display: block !important;}
.inline {display: inline !important;}
.visible {display: block !important; visibility: visible !important;}
.hidden {display: none !important; visibility: hidden !important;}
.relative {display: relative !important;}
.absolute {display: absolute !important;}

.left {text-align: left !important;}
.right {text-align: right !important;}
.center {text-align: center !important;}

.vtop {vertical-align: top !important;}
.vmiddle {vertical-align: middle !important;}
.vbottom {vertical-align: bottom !important;}

.float-left {float: left !important;}
.float-right {float: right !important;}
.clear-right {clear: right !important;}
.clear-both {clear: both !important;}

.italic {font-style: italic !important;}
.bold {font-weight: bold !important;}
.small-caps {font-variant:small-caps !important;}
.uppercase {text-transform: uppercase !important;}
.lowercase {text-transform: lowercase !important;}
.wrap {white-space: normal !important;}
.nowrap {white-space: nowrap !important;}
.underline {text-decoration: underline !important;}

.x-small {width: 50px;}
.small {width: 100px;}
.medium {width: 150px;}
.large {width: 200px;}
.x-large {width: 250px;}

.input-button {width: 100px; height: 18px;}
.input-upload {border: 1px solid black;}
/* <==== End: Global class library ========================================< */


/* >==== Start: CoolMenu ==================================================> */
#divMenu {position: relative; left: -1px;}
/* CoolMenus 4 - default styles - do not edit */
.clCMAbs {position: absolute; visibility: hidden; left: 0; top: 0;}
/* CoolMenus 4 - default styles - end */

/* Style for the background-bar */
.clBar{position: absolute; width: 10px; height: 18px; background-color: #ffffff;}

/* Styles for level 0 */
.clLevel0, .clLevel0over {position: absolute; padding: 2px; font-size: 11px; font-weight: bold; text-align: center; z-index: -1;}
.clLevel0 {width: auto; color: #000000; background-image: url(/media/img/moduleBg0.gif);}
.clLevel0over {padding: 2px; background-image: url(/media/img/moduleBg1.gif); color: #ff6600; cursor: pointer;}
.clLevel0border {position: absolute; visibility: hidden; border-left: 1px solid #999999;}

/*Styles for level 1*/
.clLevel1, .clLevel1over {position: absolute; padding: 2px; font-size: 11px; font-weight: normal;}
.clLevel1 {background-color: #ffe7d6; color: #000000;}
.clLevel1over {background-color: #ffb584; color: #000000; cursor: pointer; font-weight: bold}
.clLevel1border {position: absolute; visibility: hidden;}

/*Styles for level 2*/
.clLevel2, .clLevel2over {position:absolute; padding:2px; font-size:11px; font-weight:normal}
.clLevel2 {background-color: #DFDFFF; color: navy;}
.clLevel2over {background-color: white; color: navy; cursor: pointer; font-weight: bold}
.clLevel2border {position: absolute; visibility: hidden; border: 1px solid #999999;}
/* <==== End: CoolMenu ====================================================< */


.top10 td {
	padding: 3px;
	border-bottom: 1px dashed #BBC3D3;
}

.top10 a {
	text-decoration: none;
}

.order-table td {
	padding: 4px;
}

#prodImage {
	width: auto !important;
	height: auto !important;
}

.prodlist_product .prodlist_image {
	height: 150px;
}
