/***********************************************
 * STICHTING BEELDARCHIEF VALKENBURG - GENERAL *
 ***********************************************/

* { padding: 0px 0px;
		margin: 0px 0px; }

html { /* background: url("../images/background.png") repeat left top; */ }
html, body {  }

body {	/* voor elementen die niet binnen de div staan */
	font-family: Trebuchet MS;
	font-size: 14px;
	color: #676767;
	max-width: 940px;
	margin: 0px auto;
}

#container { /* DIT IS VOOR IE */
	/* position: relative;*/
	min-height: 100%;
  height: auto !important; /* voor moderne browsers */
  height: 100%; /* voor IE */
	margin-top: 0px; margin-right: auto;
	margin-bottom: 0px; margin-left: auto;
	width: 940px; /*  height: 880px; */
}

/***********/

h1 {
	color: #3598fe;
	font-size: 20px;
	font-weight: normal;
	border: 0px solid red;
	padding: 0px 0px 7px 0px;
}

/***********/



/***********
 * HEADER
***********/

#header {
	background: url("../images/header.png") no-repeat left top;
	height: 150px;
	margin-left: 1px;
	/* padding-left: 10px; */
}
	#logo {
		background: url("../images/valkenburglogo.png") no-repeat left top;
		width: 83px;
		height: 81px;
		position: relative;
		top: 10px;
		left: 40px;
	}
	#hoofdMenu {
		/* background: url("../images/menuitemback.png") repeat left top; */
		position: absolute;
		top: 118px;
		_top: 113px;
		/* width: 100%;*/
		height: 31px;
		_height: 36px;
		clear: both;
		/* filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/menuitemback.png',sizingMethod='scale'); */
	}

	#hoofdMenu a { /* font-size: 15px; */ color: white; text-decoration: none; font-weight: bold; padding-right: 3px; padding-left: 0px;}
	#hoofdMenu .menubacknor a {  color: white; }
	#hoofdMenu .menubackact a,
	#hoofdMenu .menubackactIE6 a {  color: #5aa5f8;}

				/************************ MENU -> IE 6 SPECIFIC; TRANSPARENCY SOLUTION ****/
				.menuImgLeftIE6 {	margin-bottom: 1px;	}

				.menuImgRightIE6 { margin-bottom: 1px; margin-right: 7px;	}

				.menubacknorIE6 {
					background: url("../images/menuitemnorback_ie6.png") repeat-x left top;
					height: 36px;
					position: relative;
					top: -8px;
					padding-top: 5px;
					padding-bottom: 7px;
				}
				.menubackactIE6 {
					background: url("../images/menuitemactback_ie6.png") repeat-x left top;
					height: 36px;
					position: relative;
					top: -8px;
					padding-top: 5px;
					padding-bottom: 7px;
				}
				/************************* MENU -> OTHER THAN IE 6 *************************/

				.menubacknor {
					background: url("../images/menuitemback.png") repeat-x left top;
					padding-top: 5px;
					padding-left: 10px;
					padding-bottom: 7px;
					height: 31px; /* IE7 */
					position: relative;
				}
				.menubacknorround {
					background: url("../images/menuitemnorright.png") no-repeat left top;
					/* width: 5px; */
					height: 31px;
					padding-top: 5px;
					padding-left: 9px;
					padding-bottom: 7px;
					position: relative;
				}

				.menubackact {
					background: url("../images/menuitembackact.png") repeat-x left top;
					padding-top: 5px;
					padding-left: 10px;
					padding-bottom: 7px;
					height: 31px; /* IE7 */
					position: relative;
				}
				.menubackactround {
					background: url("../images/menuitemactright.png") no-repeat left top;
					/* width: 9px; */
					height: 31px;
					padding-top: 5px;
					padding-left: 9px;
					padding-bottom: 7px;
					position: relative;
				}

/***********
 * BANNER
***********/

#banner {
/*	background: url("../images/banner.png") no-repeat left top; */
	width: 936px;
	height: 109px;
	margin-left: 1px;
}
#banner #bordertext { /* kan evt. opgelost worden met Gheaders, voorals nog niet nodig. Dan wel display weer aanzetten */
	display: none;
}

/***********
 * MAIN
***********/

#main {
	padding-top: 2px;
	max-width: 1000px;

}

	#navbalk {
		background: url("../images/navbalk.jpg") no-repeat left top;
		height: 29px;
		_height: 46px;
		*height: 29px;
		padding-top: 16px;
		padding-left: 30px;
		padding-bottom: 0px;
	}

	#mainback { /* display: none; */
		/* clear: both; */
		/* background: url("../images/mainback.jpg") repeat-y left top; */
		background-color: #efefef;
		border-left: 1px solid #999999;
		border-right: 1px solid #999999;
		width: 935px;
	}

/* *** POSITIONS *** */


#left {
	float:left;
	width: 600px;	_width: 600px;
	padding: 20px 0px 0px 27px;
}

#right {
	float: right;
	display: inline;
	width: 247px;
	_width: 277px;
	padding-top: 20px;
	padding-right: 30px;
}

#center {
	min-height: 100%;
	display: block;
  padding-left: 215px;
  padding-right: 215px;
	background-color: #efefef;
		/* float: mid-column; */
}

#clearing {
	clear: both;
}

/* *** INHOUD LINKS *** */


#normalcontent { /* normale inhoud elementen linksboven */
}

#bottomcontent { /* speciale inhoud elementen linksonder; plugins zoals fotodisplay */ }

#left h1 {height: 20px;}
#left p {/*border: 1px dashed red; */ padding-bottom: 10px;}

/* *** INHOUD RECHTS *** */

#rightcontent { display: none;
		padding-bottom: 1px;
		/* background: url("../images/pi-bottom.jpg") no-repeat left bottom; */
		/* rechter inhoudblok normaal */
	}			#Arightcontent-top {
					background: url("../images/pi-top.jpg") no-repeat left top;
				}

				#rightcontent p {
					_position: relative;
					_top: -14px; /* _margin-top: -14px; */
					padding-top: -10px;
					line-height: 16px;
					/* border: 1px solid red; */
				}
				#rightcontent .bodytext {
					/* background: url("../images/pi-bottom.jpg") no-repeat left bottom;  */ }

				#rightcontent-top {
					background: url("../images/pi-top.jpg") no-repeat left top;
				}
				#rightcontent-inhoud {
					font-size: 12px;
							 border-left: 1px solid #999;
					border-right: 1px solid #999;
					padding-left: 20px;
					padding-right: 20px;
					padding-top: 0px;
					padding-bottom: 9px;
					margin-top: 0px;

					/* border: 1px solid red;
					overflow: hidden; */
					/* _margin-top: -15px; */

				}
				#rightcontent-bottom {
					background: url("../images/pi-bottom.jpg") no-repeat left top;
					padding-bottom: 0px;
					_position: relative;
					_top: -14px;
				}

				#rightcontent .csc-header { height: 20px;}

				#rightcontent  h1 {
					position: relative;
					top: -18px;
					left: -5px;
					/*left: 15px;*/
					height: 10px;
					/*width: 100px;*/ display: inline;
					background-color: #efefef;
					font-size: 15px;
					font-weight: bold;
					color: #6a6a6a;
					margin-left: 0px;
					padding-left: 5px;
					padding-right: 5px;
					margin-bottom: 0px;
					padding-bottom: 0px;
					/* border-bottom: 1px dashed #999; */
				}
				#rightcontent .csc-firstHeader {/* background-color:  #efefef; */}


/* *** PLUGIN RECHTS: BORDERTJES met thumbfoto *** */

#pluginrechts { /* display: none; */
		/* border: 1px solid red; */
		padding-top: 14px;
		padding-bottom: 5px;
		_width: 247px;
		border: 0px solid red;
	}			#pi-top {
					background: url("../images/pi-top.jpg") no-repeat left top;
				}
				#pi-titel {
					background-color: #efefef;
					margin-left: 15px;
					padding-left: 5px;
					padding-right: 5px;
					font-size: 15px;
					font-weight: bold;
					color: #6a6a6a;
				}
				#pi-inhoud {
					padding-top: 3px;
					padding-left: 10px;
					padding-right: 10px;
					font-size: 12px;
					border-left: 1px solid #999;
					border-right: 1px solid #999;
				}
				#pi-bottom {
					background: url("../images/pi-bottom.jpg") no-repeat left top;
				}
				#pi-meerlink {
					background-color: #efefef;
					color: #5aa5f8;
					margin-left: 175px;
					padding-left: 5px;
					padding-right: 5px;
					font-size: 12px;
				}
				#pi-meerlink a {color: #5aa5f8; text-decoration: none;}
				
				#pi-bestellenshortlink {
					background-color: #efefef;
					color: #5aa5f8;
					margin-left: 100px;
					padding-left: 5px;
					padding-right: 5px;
					font-size: 12px;
				}
				#pi-bestellenshortlink a {color: #5aa5f8; text-decoration: none;}

				/* *** PI-RANDOM : Willekeurige selectie *** */
				#pi-random { /* display: none; */
					padding-left: 10px;
					padding-right: 10px;
					padding-top: 10px;
					padding-bottom: 10px;
				}
					#pi-random-row {

					}
						.pi-random-image { /* */float: left; padding-right: 10px; width: 100px; height: 65px; border: 0px; /* border: 1px dashed #676767; */}
						.pi-random-imagetext { color: #5aa5f8; width: 100px; _width: 90px; line-height: 15px;}
						.pi-random-imagetext .title { font-weight: bold; display: block; padding-top: 3px;}
						.pi-random-imagetext .text { font-weight: normal; display: block;}

					#pi-random-divider {
						padding-top: 16px; padding-bottom: 16px;
						_padding-top: 8px; _padding-bottom: 8px;
					}

					#pi-random-divider hr{border:0;height:1px;color:#ccc;background:#ccc;}



/***********
 * FOOTER
***********/


#bottom {
clear: both;
height: 87px;
	background: url("../images/bottom.jpg") no-repeat left bottom;
}

#footer {
	clear: both;
	font-size: 12px;
}
#footer a {
	color:#3598fe;
	text-decoration: none;
}



/* *** HACK TESTS..... *** */

	#rightcontentblok {
	/* float:right; */
	position:absolute;
	top:350px;
	right:20px;
	width:172px;
	padding:10px;
	background-color:#eee;
	border:1px dashed #999;
	line-height:17px;
/* Again, the ugly brilliant hack. */
	voice-family: "\"}\"";
	voice-family:inherit;
	width:150px;
	}
/* Again, "be nice to Opera 5". */
body>#rightcontentblok {width:150px;}

/* *** HACK TESTS..... END *** */



/**********************************
 * PLUGIN FOTO'S EN E.D.
 **********************************/

/***** THUMBNAILS PER CATEGORIE / ZOEKEN *****/

#categorie-zoeken {
	/* border: 1px solid red; */
	width: 600px;
}
#thumb-overzicht {
	width: 600px;
}

#thumb-overzicht .thumbs {
	width: 190px;
	height: 210px;
	float: left;
	text-align: center;
}
/*
.thumbs .aaaaaaack {
	margin: 2px;
	padding: 10px;
	border: 1px solid red;
	background-color: #DDD;
	display: block;
	width: 192px;
	height: 212px;
	text-align: center;
}*/
.thumbs .back {
	background-color: #DDD;
	display: block;
	width: 175px;
	height: 175px;
	line-height: 175px;
	text-align: center;
	vertical-align: middle;
}

.thumbs .back .image {
	border: 1px solid #DDD;
	/* _line-height: 175px; */
	margin: auto;
	position: relative;
	/* display: table-cell; */
}

.thumbs .back .image img{
	position: relative;
	vertical-align:middle;
	margin: auto;
	padding:auto;
}

#thumb-overzicht .thumbs .naam a{ text-decoration: none; color: #5aa5f8;
	/* position: relative;
	left: 20px; */
}



/***** AFBEELDING TONEN *****/

#afbeeldinginfo {
	width: 900px;
	float: left;
	}

		#afbeeldinginfo #foto {
			float: left;
			width: 500px;
		}
		#afbeeldinginfo img {
		border: 0px;
		}

		#afbeeldinginfo #datatable { /* tabel */
			float: left;
			width: 390px;
			margin-left: 10px;
		}

			#afbeeldinginfo #datatable .row {
				width: 385px;
				clear: both;
			}

				#afbeeldinginfo #datatable .row .description { /* linker cel */
					position: relative;
					display: block;
					/*left: 550px;*/
					width: 120px;
					float: left;

				}

				#afbeeldinginfo #datatable .row #data,
				#afbeeldinginfo #datatable .row .data { /* rechter cel */
					font-weight: bold;
					position: relative;
					width: 260px;
					float: right;
				}

		#afbeeldinginfo #datatable .row .spacer { /* nodig indien tekst over meerdere regels is verspreid */
			clear: both;
		}

		#afbeeldinginfo #datatable #bestel { /* winkelwagentje */
			position: relative;
			top: 20px;
			left: 22px;
		}

/****** WINKELMANDJE *****/

#winkelmandje {
	font-family: Trebuchet MS;
	font-size: 12px;
}

	#winkelmandje #datatable { width: 570px; }

	#winkelmandje #datatable #descriptionrow {
		position: relative;
		border: 1px solid #676767;
		font-weight: bold;
		width: 570px;
	}

	#winkelmandje #datatable .itemrow {
		width: 570px;
		position: relative;
		border-bottom: 1px solid #676767;
		border-left: 1px solid #676767;
		border-right: 1px solid #676767;
		height: 17px;
		padding-bottom: 1px;
	}

	#winkelmandje #datatable #subtotaalrow {
		position: relative;
		width: 570px;
		padding-top: 10px;
	}

	#winkelmandje #datatable #totaalrow {
		position: relative;
		font-weight: bold;
		width: 525px;
		border-top: 2px solid #676767;
	}

	#winkelmandje #datatable #bestelrow {
		position: relative;
		width: 550px;
		left: 430px;
		*left: 405px;
		_left: 405px;
		padding: 10px;
	}

	/* ** VELDEN van winkelmandje ** */
	#winkelmandje #datatable #descriptionrow .titel,
	#winkelmandje #datatable .itemrow .titel {
		position: absolute;
		width: 165px;
		height: 17px;
		overflow: hidden;
		margin-left: 10px;
		_overflow: visible;
		_position: relative;
		_width: 195px;
		_top: 0px;
		_left: 2px;
		_float: left;
	}
	#winkelmandje #datatable #descriptionrow .documentnummer,
	#winkelmandje #datatable .itemrow .documentnummer {
		position: absolute;
		width: 120px;
		left: 190px;
	}
	#winkelmandje #datatable #descriptionrow .collectie,
	#winkelmandje #datatable .itemrow .collectie {
		position: relative;
		width: 175px;
		left: 305px;
		_left: 105px;
	}
	#winkelmandje #datatable #descriptionrow .prijs,
	#winkelmandje #datatable .itemrow .prijs,
	#winkelmandje #datatable #subtotaalrow .prijs,
	#winkelmandje #datatable #totaalrow .prijs
	 {
		position: absolute;
		width: 75px;
		left: 480px;
	}
	#winkelmandje #datatable #subtotaalrow .prijs,
	#winkelmandje #datatable #totaalrow .prijs {
		position: absolute;
		left: 480px;
	}

	#winkelmandje #datatable #descriptionrow .verwijderen,
	#winkelmandje #datatable .itemrow .verwijderen {
		position: absolute;
		width: 20px;
		left: 530px;
	}

	.verwijderen a{
		color: red;
		font-weight: bold;
		text-decoration: none;
	}

	/****** BESTELLEN *****/

#bestellen {
	}

	#bestellen #toelichting {
	}

	#bestellen form {
	}

	#bestellen form .row {
	}

	#bestellen #datatable {
		font-family: Trebuchet MS;
		font-size: 14px;
	}

	#bestellen #datatable .itemrow {
		height: 18px; line-height: 18px;
		position: relative;
	}/* IE7 */
	#bestellen #datatable form .itemrow {
	}


	#bestellen #datatable .itemrow .description {
		font-weight: bold;
		width: 200px;
	}/* IE7 */#bestellen #datatableform .itemrow .description {
		font-weight: bold;
	}

	#bestellen #datatable .itemrow .inputfield {
		position: absolute;
		left: 200px;
		font-weight: bold;
		width: 200px;
	}/* IE& */#bestellen #datatable form .itemrow .inputfield {
		position: absolute;
		left: 200px;
		font-weight: bold;
		width: 200px;
	}

	
	#mandjeshortbestellink a { 		color: #5aa5f8;
					font-size: 12px;
					text-decoration: none;
					};