html
{
	border: none;
	overflow: auto;
	overflow-y: scroll;
	height: 100%;
	width: 100%;
}

body
{
	background-color: #F8F8FF; /*#F5F5F5;*/ /*#DBDBDB;*/
	color: #000000;
	height: 100%;
	width: 100%;
	margin: 0px;
	padding: 0px;
	border: none;
}

body, td, input, select, textarea
{
	font: 8pt Lucida Sans Unicode, Trebuchet MS, Verdana, Tahoma, Arial, Helvetica;
}

#fixed
{
	visibility: hidden; /*maakt #fixed onzichtbaar en dus doorklikbaar, maar houdt positionering en z-index wel vast */
	position: fixed;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	z-index: 100;
}

#fixed *
{
       visibility: visible; /*maakt alle elementen BINNEN #fixed wel zichtbaar (head, menu, enz) */
}

#contentBody
{
	z-index:600;
}

/* default hyperlink */
/*a:link 
{
	color: #7F8285;
	font-weight:normal;
	text-decoration: none;
}

a:visited 
{
	font-style: normal;
	color: #7F8285;
	font-weight:normal;
	text-decoration: none;
}
a:hover 
{
	color: #65BA53;
	font-weight: normal; 
	text-decoration: underline;
}
a:active
{
	font-style: normal;
	color: #37CE62;
	cursor: progress;
}*/

/*SelectObjectControl: link stays active, do not change cursor*/
a.pd-selectobject:active
{
	cursor: auto;
}

/* page header */
#head
{
	position: absolute;
	left: 0px;
	top: 15px;
	z-index: 100;
	min-width: 935px;
	width: 95%;
	height: 88px;
	background-color: #000000;
	background-position: right top;
	background-repeat: no-repeat;
	background-image: url(Suselbeek/headEdge.gif);
	background-position: right top;
	cursor: default;
}

#headBorder
{
	position: absolute;
	padding-left: 10px;
	left: 0px;
	top: 0px;
	z-index: 300;
	min-width: 800px;
	/*width: 77%;*/
	width: 90%;
	height: 15px;
	padding-right: 10px;
	background-color: #65BA53;
	background-image: url(Suselbeek/headBorderEdge.gif);
	background-position: right top;
	background-repeat: no-repeat;
	cursor: default;
}

#menu
{
	position: absolute;
	left: 0px;
	top: 103px;
	z-index: 600;
	/*width: 77%;*/
	width: 90%;
	min-width: 800px;
	height: 31px;
	background-color: #83C88F;
	cursor: default;
	color : #FFFFFF;
	font-size: 12pt;
	margin: 0px; 
	padding-left: 10px;
	padding-bottom: 0px;
	padding-top: 0px; 
	padding-right: 0px;
	font-family: Arial;
	vertical-align: middle;
	border-bottom: solid 2px white;
	list-style-type: none; 
	list-style-image: none; 
}

#menu li
{
	float: right;
	/*top: 103px;
	top: 0px;*/
	z-index: 175;
	width: 110px;
	height: 27px;
}

#menu li a
{
	display: block;
	/*background-color: #83C88F;*/
	background-image: url(Suselbeek/tabBorder.gif);
	background-position: right top;
	background-repeat: no-repeat;
	width: 100px;
	height: 100%;
	padding-left: 20px;
	padding-top: 4px;
	padding-bottom: 0px;
	z-index: 800;
}

#menu li a:hover
{
	/*background-color: #65BA53;*/
	background-image: url(Suselbeek/tabBorder_hover.gif);
}

#menu li#menuLast a
{
	background-color: #83C88F;
	background-image: url(Suselbeek/tabEdge.gif);
}

#menu li#menuLast a:hover
{
	background-color: #65BA53;
	background-image: url(Suselbeek/tabEdge_hover.gif);
}

#menu li a, a.notSelected
{
	color : #FFFFFF;
	font-family: Arial;
	text-decoration: none;
}

#menu li.selected a
{
	/*background-color: #65BA53;*/
	background-image: url(Suselbeek/tabBorder_hover.gif);
}

#menu li#menuLast.selected a
{
	background-color: #65BA53;
	background-image: url(Suselbeek/tabEdge_hover.gif);
}

/* logo in page header */
#logo
{
	display: block;
	float: left;
	margin-left: 10px;
	width: 253px;
	height: 86px;
	background-image: url(Suselbeek/Logo.png);
	background-repeat: no-repeat;
	text-decoration: none;
}

/* Top area of navigation bar */
div#navBarTop
{
	position: absolute;
	background-color: #AEB0B3;
	left: 0px;
	top: 0px;
	/*width: 152px;*/
	width: 174px;
	height: 21px;
	color: black;
	background-image: url(Suselbeek/navBarTopEdge.gif);
	background-position: right top;
	background-repeat: no-repeat;
	border-top: 1px solid #C4C6C8
	cursor: default;
}

/* navigation bar */
div#navBar
{
	position: fixed;
	z-index: 50;
	background-color: #AEB0B3;
	left: 0px;
	top: 145px;
	width: 174px;
	height: 100%;
	color: black;
	padding-top: 72px;
	padding-bottom: 44px;
	cursor: default;
}

img#navBarPhotoDefault
{
	z-index: 50;
	position: absolute;
	left: 87px;
	top: 166px;
	width: 380px;
	height: 403px;
	color: black;
	cursor: default;
	padding-bottom: 130px;
}

img#navBarPhotoAssortiment
{
	z-index: 50;
	position: absolute;
	left: 106px;
	top: 166px;
	width: 444px;
	height: 249px;
	color: black;
	overflow: auto;
	cursor: default;
}

iframe#navBarMap
{
	z-index: 55;
	position: absolute;
	left: 106px;
	top: 166px;
	/*width: 380px;
	height: 256px;
	overflow: auto;*/
	border: 0px;
	cursor: default;
	/*border: Solid 3px White;*/
}

a#navBarMapLink
{
	z-index: 50;
	position: absolute;
	padding-left: 240px;
	padding-top: 430px;
}

img#navBarMapBackground
{
	border: 0px;
	z-index: 50;
	position: absolute;
	left: 100px;
	top: 160px;
}

img#birdview
{
	border: 0px;
	z-index: 50;
	position: absolute;
	left: 100px;
	top: 560px;
}

.leftcell
{
	padding-left : 30px;
}

img#navBarPhotoLinks
{
	z-index: 50;
	position: absolute;
	left: 63px;
	top: 166px;
	width: 258px;
	height: 403px;
	color: black;
	overflow: auto;
	cursor: default;
	padding-bottom: 130px;
}

img#navBarPhotoBedrijf
{
	z-index: 50;
	position: absolute;
	left: 60px;
	top: 166px;
	width: 217px;
	height: 180px;
	cursor: default;
}

img#navBarPhotoBedrijf2
{
	z-index: 50;
	position: absolute;
	left: 290px;
	top: 166px;
	width: 217px;
	height: 180px;
	cursor: default;
}

div#navbarTextBedrijf
{
	background-image: url(Suselbeek/text_Background.gif);
	background-position: left top;
	background-repeat: no-repeat;
	z-index: 50;
	position: absolute;
	left: 60px;
	top: 359px;
	width: 217px;
	height: 270px;
	cursor: default;
	color: White;
	padding-left: 10px;
	padding-top: 20px;
	font-size: 11px;
	font-weight:bold;
}



img#navBarPhotoDeur_Pyropenta
{
	z-index: 50;
	position: absolute;
	left: 60px;
	top: 166px;
	width: 161px;
	height: 403px;
	cursor: default;
}

img#navBarPhotoDeur_doorBig
{
	z-index: 50;
	position: absolute;
	left: 290px;
	top: 166px;
	width: 161px;
	height: 403px;
	cursor: default;
}

.bigtitle
{
	display: block;
	position: absolute;
	left: 480px;
	z-index: 50;
	cursor: default;
	padding-left: 30px;
	padding-top: 80px;
	color: #65BA53;
	font-weight: bold;
	font-family: Arial;
	letter-spacing: -2px;
	width: 425px;
}

.bigtitleblack
{
	display: block;
	position: absolute;
	left: 480px;
	z-index: 50;
	cursor: default;
	padding-left: 30px;
	padding-top: 80px;
	color: #65BA53;
	font-weight: bold;
	font-family: Arial;
	letter-spacing: -2px;
	width: 400px;
}

.subtitle
{
	position: absolute;
	/*display: block;*/
	cursor: default;
	color: #65BA53;
	font-weight: bold;
	font-family: Arial;
	font-size: 10pt
}

.subtitleblack
{
	position: absolute;
	/*display: block;*/
	cursor: default;
	color: #000000;
	font-weight: bold;
	font-family: Arial;
	font-size: 10pt
}

.title
{
	display: block;
	cursor: default;
	color: #65BA53;
	font-weight: bold;
	font-family: Arial;
	font-size: 11pt
}

.normal
{
	display: block;
	cursor: default;
	/*color: #7F8285;*/
	color: #000000;
	font-family: Arial;
	font-size: 11pt;
	z-index: 600;

}

.normal a
{
	z-index: 600;
}


span a
{
	color: #000000;
	cursor: pointer;
	text-decoration: none;
}

span a:hover
{
	color: #65BA53;
	cursor: pointer;
	text-decoration: underline;
}


.largetitle
{
	display: block;
	cursor: default;
	color: #65BA53;
	font-weight: bold;
	font-family: Arial;
	font-size: 12pt
}

.large
{
	display: block;
	cursor: default;
	color: #000000;
	font-family: Arial;
	font-size: 12pt
}

#downloads a, .links a
{
	display: block;
	font-family: Arial;
	font-size: 11pt;
	z-index: 100;
}

#labelDefault
{
	padding-left: 80px;
	top: 100px;
	font-size: 36pt;
}

#labelDefault2a
{
	top: 400px;
	left: 560px;
	font-size: 36pt;
}

#labelDefault2b
{
	top: 400px;
	left: 740px;
	font-size: 36pt;
}

#labelAssortiment
{
	padding-left: 80px;
	top: 100px;
	font-size: 36pt;
}

#labelContact
{
	top: 100px;
	font-size: 36pt;
	/*padding-left: 70px;*/
	padding-left: 80px;
}

#labelLinks
{
	top: 100px;
	font-size: 36pt;
	/*padding-left: 0px;*/
	padding-left: 80px;
}

#labelDownloads
{
	top: 100px;
	font-size: 36pt;
	padding-left: 80px;
}

#labelBedrijf
{
	top: 100px;
	font-size: 36pt;
	/*font-size: 50pt;*/
	padding-left: 80px;
}

#tekstBedrijf
{
	padding-left: 140px;
	padding-top: 350px;
	left: 200px;
	width: 580px;
}

#labelGallerie
{
	top: 100px;
	font-size: 36pt;
	/*font-size: 50pt;*/
	padding-left: 80px;
}

#tekstGallerie
{
	padding-left: 140px;
	padding-top: 200px;
	left: 200px;
	width: 580px;
}

#tekstDownloads
{
	padding-left: 440px;
	padding-top: 200px;
	left: 200px;
	width: 580px;
}

#tekstBedrijf2
{
	padding-left: 140px;
	padding-top: 15px;
	left: 200px;
	width: 580px;
	padding-bottom: 130px;
}

#labelDeur
{
	top: 100px;
	/*font-size: 35pt;*/
	font-size: 25pt;
}

#tekstDeur
{
	margin-left: 345px;
	padding-top: 250px;
	width: 400px;
	z-index: 600;
}

#tekstDeur2
{
	margin-left: 345px;
	margin-top: 300px;
	width: 400px;
}

img.doorpicture
{
	padding-bottom: 130px;
}

a.model
{
	display: block;
	color: #000000;
	cursor: pointer;
	text-decoration: none;
	padding-top: 5px;
	z-index: 600;
}

a.model:hover
{
	color: #65BA53;
	cursor: pointer;
}

#slogan span
{
	padding-left: 50px;
	color: White;
	font-size: 15pt;
	font-family: Arial;
	font-weight: bold;
}

#slogan
{
	position: relative;
	margin-top: 30px;
}

#contact
{
	padding-left: 390px;
	padding-top: 220px;
	padding-bottom: 300px;
}

.adres
{
	float: left;
}

#downloads
{
	padding-left: 400px;
	padding-top: 200px;
	width: 400px;
	padding-bottom: 50px;
}

#vacatures
{
	padding-left: 330px;
	padding-top: 200px;
	width: 450px;
	margin-bottom: 120px;
}

#vacatures div
{
}

#adresdata
{
	padding-left: 15px;
}

#links1
{
	position: absolute;
	margin-left: 200px;
	padding-top: 250px;
	width: 200px;

}

#links2
{
	position: absolute;
	margin-left: 400px;
	padding-top: 250px;
	width: 200px;

}

#links3
{
	position: absolute;
	margin-left: 600px;
	padding-top: 250px;
	width: 200px;

}

.links a
{
	color: #000000;
	cursor: pointer;
	text-decoration: none;
	margin-left: 30px;
	padding-top: 5px;
}

.links a:hover
{
	color: #65BA53;
	cursor: pointer;
	text-decoration: underline;
}

.adresData
{
	float: left;
	padding-left: 15px;
}

#downloads a
{
	/*color: #7F8285;*/
	color: Black;
	position: relative;
	display: block;
	height: 48px;
	/*float: left;*/
	padding-left: 30px;
	padding-top: 2px;
	background-image: url(Suselbeek/logo_gray3.gif);
	background-position: left top;
	background-repeat: no-repeat;
	margin-right: 20px;
	cursor: pointer;
	text-decoration: none;
}
#buttonlinks a
{
	/*color: #7F8285;*/
	color: Black;
	position: relative;
	display: block;
	height: 48px;
	padding-left: 30px;
	padding-top: 2px;
	background-image: url(Suselbeek/logo_gray3.gif);
	background-position: left top;
	background-repeat: no-repeat;
	margin-right: 20px;
	cursor: pointer;
	text-decoration: none;
}

#buttonlinks a:hover
{
	color: #65BA53;
	position: relative;
	display: block;
	height: 48px;
	/*float: left;*/
	padding-left: 30px;
	padding-top: 2px;
	background-image: url(Suselbeek/logo3.gif);
	background-position: left top;
	background-repeat: no-repeat;
	margin-right: 20px;
	text-decoration: none;
}

/*#downloads a:active 
{
	color: #7F8285;
	position: relative;
	display: block;
	height: 48px;
	float: left;
	padding-left: 30px;
	padding-top: 2px;
	background-image: url(Suselbeek/logo_gray3.gif);
	background-position: left top;
	background-repeat: no-repeat;
	margin-right: 20px;
	cursor: pointer;
}
#downloads a:visited
{
	color: #7F8285;
	position: relative;
	display: block;
	height: 48px;
	float: left;
	padding-left: 30px;
	padding-top: 2px;
	background-image: url(Suselbeek/logo_gray3.gif);
	background-position: left top;
	background-repeat: no-repeat;
	margin-right: 20px;
	cursor: pointer;
}*/

#downloads a:hover
{
	color: #65BA53;
	position: relative;
	display: block;
	height: 48px;
	/*float: left;*/
	padding-left: 30px;
	padding-top: 2px;
	background-image: url(Suselbeek/logo3.gif);
	background-position: left top;
	background-repeat: no-repeat;
	margin-right: 20px;
	text-decoration: none;
}

.doortitle
{
	display: block;
	z-index: 50;
	overflow: auto;
	cursor: pointer;
	padding-left: 0px;
	padding-top: 0px;
	font-size: 10pt;
	/*color: #65BA53;*/
	color: #000000;
	font-weight: bold;
	font-family: Arial;
}

.pyropenta
{
	display: block;
	z-index: 50;
	overflow: auto;
	cursor: pointer;
	padding-left: 0px;
	padding-top: 0px;
	font-size: 10pt;
	/*color: #65BA53;*/
	color: Red;
	font-weight: bold;
	font-family: Arial;
}

a.doorlink
{
	z-index: 50;
	display: block;
	width: 100%;
	height: 100%;
	text-decoration: none;
	border: none, 0px;
	background-color: transparent;
}

#tekstBedrijf
{
	padding-top: 300px;
	left: 200px;
	width: 600px;
}

.door
{
	float: left;
	width: 132px;
	margin-bottom: 20px;
	z-index: 50;
}

.door img
{
	border: 0px
}

#doors
{
	position: absolute;
	left: 190px;
	z-index: 50;
	top: 450px;
	padding-bottom: 130px;
}

#chapterDefault
{
	width: 380px;
	height: 403px;
}

#chapterAssortiment
{
	width: 546px;
	height: 368px;
}

/* navigation bar section title */
div#navBar p
{
	text-align: center;
	font-weight: bold;
	margin-left: 4px;
	margin-right: 4px;
	margin-top: 4px;
	margin-bottom: 4px;
	padding-bottom: 2px;
	color: #545454;
	border-bottom: 1px solid #808080;
}

/* collapsed navigation bar */
div#navBar.side
{
	left: -150px;
	padding-right: 10px;
}

/* overlayed navigation bar (navigation bar overlaps div.content element) */
div#navBar.overlay
{
	left: 0px;
}

/* navigation item list in navigation bar */
ul#navigation
{
	list-style: none;
	margin: 0px;
	padding-left: 0px;
	white-space: nowrap;
}

/* navigation item */
ul#navigation li
{
	display: block;
	padding: 0px 2px 0px 2px;
	white-space: nowrap;
}

/* hyperlink in navigation item */
ul#navigation li a
{
	display: block;
	padding: 2px 8px 0px 4px;
	margin: 0px;
	vertical-align: middle;
	height: 20px;
	white-space: nowrap;
}

/* default hyperlink decoration in navigation item list */
ul#navigation a:link, ul#navigation a:visited
{
	text-decoration:none;
}

/* default text color in navigation item list */
ul#navigation, ul#navigation a:link, ul#navigation a:visited, ul#navigation li a:active, ul#navigation li a:hover, ul#navigation hr
{
	color: Black;
}

/* currently selected navigation item (navigation item that represents the currently displayed object) */
ul#navigation li a.selected
{
	background-image: url(Suselbeek/nav.selected.png);
	background-repeat: repeat-x;
	text-decoration:none;
}

/* mouse over on navigation item */
ul#navigation li a:hover
{
	background-image: url(Suselbeek/nav.png);
	background-repeat: repeat-x;
	text-decoration:none;
}

/* clicked on, or tab-selected navigation item */
ul#navigation li a:active
{
	background-image: url(Suselbeek/nav.selected.png);
	background-repeat: repeat-x;
	text-decoration:none;
}

/* action item list in navigation bar */
ul#actions
{
	list-style-type: square;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 20px;
	padding-left: 0px;
	padding-right: 4px;
	color: #545454;
}

/* action item */
ul#actions li
{
	margin-bottom: 4px;
}

/* default hyperlink decoration in action item list */
ul#actions a, ul#actions a:link, ul#actions a:visited, ul#actions a:active, ul#actions a:hover
{
	color: #ffffff;
}

/* inactive tip text block in navigation bar (tip text for currently displayed object) */
#navTip
{
	display: block;
	margin: 20px 4px 0px 4px;
	background-color: #F6F6F6;
	background-image: url(Suselbeek/tip.inactive.png);
	background-repeat: no-repeat;
	border: 1px solid darkgray;
	padding: 4px;
	padding-left: 24px;
	color: Black;
	cursor: default;
}


/* active tip text block in navigation bar (tip text for currently selected ui control) */
#navTip.active
{
	display: block;
	margin: 20px 4px 0px 4px;
	background-color: #F7F7EF;
	background-image: url(Suselbeek/tip.png);
	background-repeat: no-repeat;
	border: 1px solid darkgray;
	padding: 4px;
	padding-left: 24px;
	color: Black;
	cursor: default;
}

/* hidden items; hidden tip text block */
.hide, #navTip.hide
{
	display: none;
}

/* error message block */
.error
{
	display: block;
	position: relative;
	background: #ffffff; 
	border: 2px solid #FF0000;
	padding: 4px;
	padding-left: 24px;
	font-weight: bold;
	color: #FF0000;
	/*background-image: url(../GetResource.aspx?Type=ProData.Web.UI&Name=Web.UI.Exception.gif);*/
	background-position: 4px 4px;
	background-repeat: no-repeat;
	cursor: default;
}

/* error text, not in error message block */
.text-error, .pd-text-error
{
	font-weight: bold;
	color: #FF0000;
}

/* filter block */
.pd-filter
{
	float: left;	
	overflow: visible;
	position: relative;
	border: none;
	margin: 0px 6px 6px 0px;
	padding: 10px 6px 12px 64px;
	background-color: Transparent;
	background-image: none;
}

/* icon in filter block */
.pd-filter .pd-rp-bg
{
	position: absolute;
	z-index: 1;
	left: 10px;
	top: 10px;
	width: 48px;
	height: 48px;
	background-image: url(Suselbeek/Find.png);
	background-repeat: no-repeat;
}

/* container block for scanner thumbnail */
span.thumb-ct
{
	display: block;
	float: left;
	margin-right: 20px;
	margin-bottom: 20px;
	overflow: visible;
}

/* scanner thumbnail round panel */
div.thumb
{
	position: relative;
	overflow: visible;
}

/* document name in scanner thumbnail */
div.thumb .displayname
{
	display: block;
}	

/* pagecount for document (in scanner thumbnail) */
.pagecount
{
	color: Gray;
}
/* pagecount for document (in document list) */
.doclist .pagecount
{
	display: block;
	margin-bottom: 4px;
}

/* marker checkbox in scanner thumbnail */
div.thumb .marker
{
	position: absolute;
	right: 12px;
}
/* actual thumbnail image in scanner thumnail */
div.thumb a.img
{
	display: block;
	text-align: center;
}
/* document image (thumbnail image in scanner thumbail, or document image in document list) */
div.thumb img, img.doc
{
	display: block;
	clear: both;
	background-color: #ffffff;
	border: 1px solid #a5a5a5;
}
/* document image in document list */
.doclist img.doc
{
	margin-bottom: 10px;
}

/* content block in round panels */
.pd-rp-cnt
{
	position: relative;
	z-index: 1;
}

/* content block in scanner thumbnail round panel */
div.thumb .pd-rp-cnt
{
	/* padding is placed on .pd-rp-cnt. instead of directly on the thumb, because of IE6 */
	padding: 10px 14px 12px 12px;
}


/*
Structure of pd-rp-* elmements (ProData.RoundPanel)

|---------------------------------------------------------------------------------------|
| img	.									|									.	img	|
|........									|									........|
|											|											|
|											|											|
|											|											|
|					lt						|					rt						|
|											|											|
|											|											|
|											|											|
|---------------------------------------------------------------------------------------|
|											|											|
|											|											|
|											|											|
|					lb						|					rb						|
|											|											|
|											|											|
|											|											|
|........									|									........|
| img	.									|									.	img	|
|---------------------------------------------------------------------------------------|

The lt, rt, lb and rb elements represent an entire quarter of a round panel. 

The lt, rt, lb and rb elements have a width and height of 50%, but the overflow is hidden.
This means they will always fit exactly a quarter of a round panel, even if borders and
padding are applied. A round panel can have any size: the lt, rt, lb and rt elements will
stretch and together they fill the entire round panel.


		|-----------------------------------------------------------------------|
	 	|			lt h					|					rt h			| 	
|-------|-----------------------------------|-----------------------------------|-------|
|		|									|									|		|
|		|									|									|		|
|		|									|									|		|
| lt v	|			lt c					|					rt c			| rt v	|
|		|									|									|		|
|		|									|									|		|
|		|									|									|		|
|---------------------------------------------------------------------------------------|
|		|									|									|		|
|		|									|									|		|
|		|									|									|		|
| lb v	|			lb c					|					rb c			| rb v	|
|		|									|									|		|
|		|									|									|		|
|		|									|									|		|
|-------|-----------------------------------------------------------------------|-------|
	 	|			lb h					|					rb h			| 
		|-----------------------------------------------------------------------|

The h, v and c elements are positioned inside lt, rt, lb and rb.
The v elements strech to fill the entire vertical borders. They need to have a fixed width.
The h elements strech to fill the entire horizontal borders. They need to have a fixed height.


|---------------------------------------------------------------------------------------|
|																						|
|																						|
|		|-----------|																	|
|		|	bg		|																	|
|		|-----------|																	|
|																						|
|																						|
|																						|
|																						|
|																						|
|																						|
|																						|
|																						|
|																						|
|																						|
|																						|
|																						|
|																						|
|																						|
|---------------------------------------------------------------------------------------|

The bg element can be positioned anywhere over or behind the other elements, to display
a backbround water mark or foreground icon.


|---------------------------------------------------------------------------------------|
|																						|
|		|-----------------------------------------------------------------------|		|
|		|																		|		|
|		|																		|		|
|		|																		|		|
|		|																		|		|
|		|																		|		|
|		|																		|		|
|		|																		|		|
|		|								cnt										|		|
|		|																		|		|
|		|																		|		|
|		|																		|		|
|		|																		|		|
|		|																		|		|
|		|																		|		|
|		|																		|		|
|		|-----------------------------------------------------------------------|		|
|																						|
|---------------------------------------------------------------------------------------|

The cnt element would normally be positioned over the four c elements, and contains the
content of the round panel.

*/



/* width of vertical borders in round panels */
.pd-rp-lt .pd-rp-v, .pd-rp-rt .pd-rp-v, .pd-rp-lb .pd-rp-v, .pd-rp-rb .pd-rp-v
{
	width: 28px;
}
/* height of horizontal borders in round panels */
.pd-rp-lt .pd-rp-h, .pd-rp-rt .pd-rp-h, .pd-rp-lb .pd-rp-h, .pd-rp-rb .pd-rp-h
{
	height: 28px;
}
/* postion elements to the right of the left border in round panels */
.pd-rp-lt .pd-rp-h, .pd-rp-lt .pd-rp-c, .pd-rp-lb .pd-rp-h, .pd-rp-lb .pd-rp-c
{
	left: 28px;
}
/* position elements below the top border in round panels */
.pd-rp-lt .pd-rp-v, .pd-rp-lt .pd-rp-c, .pd-rp-rt .pd-rp-v, .pd-rp-rt .pd-rp-c
{
	top: 28px;
}
/* position elements to the left of the right border in round panels */
.pd-rp-rt .pd-rp-h, .pd-rp-rt .pd-rp-c, .pd-rp-rb .pd-rp-h, .pd-rp-rb .pd-rp-c
{
	right: 28px;
}
/* position elements above the bottom border in round panels */
.pd-rp-lb .pd-rp-v, .pd-rp-lb .pd-rp-c, .pd-rp-rb .pd-rp-v, .pd-rp-rb .pd-rp-c
{
	bottom: 28px;
}


/* left top edge in round panels */
.pd-rp-lt
{
	background-image: url(Suselbeek/glass-lt.png);
}
/* right top edge in round panels */
.pd-rp-rt
{
	background-image: url(Suselbeek/glass-rt.png);
}
/* left bottom edge in round panels */
.pd-rp-lb
{
	background-image: url(Suselbeek/glass-lb.png);
}
/* right bottom edge in round panels */
.pd-rp-rb
{
	background-image: url(Suselbeek/glass-rb.png);
}


/* top horizontal border of round panels */
.pd-rp-lt .pd-rp-h, .pd-rp-rt .pd-rp-h
{
	background-image: url(Suselbeek/glass-th.png);
}
/* right vertical border in round panels */
.pd-rp-rt .pd-rp-v, .pd-rp-rb .pd-rp-v
{
	background-image: url(Suselbeek/glass-rv.png);
}
/* bottom horizontal border in round panels */
.pd-rp-lb .pd-rp-h, .pd-rp-rb .pd-rp-h
{
	background-image: url(Suselbeek/glass-bh.png);
}
/* left vertical border in round panels */
.pd-rp-lt .pd-rp-v, .pd-rp-lb .pd-rp-v
{
	background-image: url(Suselbeek/glass-lv.png);
}


/* background, except edge and borders, in round panels */
.pd-rp-lt .pd-rp-c, .pd-rp-rt .pd-rp-c, .pd-rp-lb .pd-rp-c, .pd-rp-rb .pd-rp-c
{
	background-image: url(Suselbeek/glass-c.png);
}




/* left top edge in mouse over thumbnail round panels */
div.thumb:hover .pd-rp-lt
{
	background-image: url(Suselbeek/glass3-lt.png);
}
/* right top edge in mouse over thumbnail round panels */
div.thumb:hover .pd-rp-rt
{
	background-image: url(Suselbeek/glass3-rt.png);
}
/* left bottom edge in mouse over thumbnail round panels */
div.thumb:hover .pd-rp-lb
{
	background-image: url(Suselbeek/glass3-lb.png);
}
/* right bottom edge in mouse over thumbnail round panels */
div.thumb:hover .pd-rp-rb
{
	background-image: url(Suselbeek/glass3-rb.png);
}


/* top horizontal border of mouse over thumbnail round panels */
div.thumb:hover .pd-rp-lt .pd-rp-h, div.thumb:hover .pd-rp-rt .pd-rp-h
{
	background-image: url(Suselbeek/glass3-th.png);
}
/* right vertical border in mouse over thumbnail round panels */
div.thumb:hover .pd-rp-rt .pd-rp-v, div.thumb:hover .pd-rp-rb .pd-rp-v
{
	background-image: url(Suselbeek/glass3-rv.png);
}
/* bottom horizontal border in mouse over thumbnail round panels */
div.thumb:hover .pd-rp-lb .pd-rp-h, div.thumb:hover .pd-rp-rb .pd-rp-h
{
	background-image: url(Suselbeek/glass3-bh.png);
}
/* left vertical border in mouse over thumbnail round panels */
div.thumb:hover .pd-rp-lt .pd-rp-v, div.thumb:hover .pd-rp-lb .pd-rp-v
{
	background-image: url(Suselbeek/glass3-lv.png);
}


/* background, except edge and borders, in mouse over thumbnail round panels */
div.thumb:hover .pd-rp-lt .pd-rp-c, div.thumb:hover .pd-rp-rt .pd-rp-c, div.thumb:hover .pd-rp-lb .pd-rp-c, div.thumb:hover .pd-rp-rb .pd-rp-c
{
	background-image: url(Suselbeek/glass3-c.png);
}



/* page content, with padding to reserve space for fixed navigation bar */
div#content
{
	vertical-align: top;
	padding-top: 76px;
	padding-right: 15px;
	padding-left: 170px;
	/*padding-left: 170px;*/
	padding-bottom: 30px;
}
/* page content, without padding, for hidden or overlayed navigation bar */
div#content.full
{
	padding-left: 20px;
}

/* hidden element to set input focus just before the first form element */
input#contentFocus
{
	position: absolute;
	left: -100px;
	top: -100px;
	width: 0px;
	height: 0px;
}

/* div's that need to be positioned below previous elements */
div#clear
{
	clear: both;
}


/* page footer */
div#footBorder
{
	position: absolute;
	z-index: 800;
	left: 0px;
	bottom: 50px;
	min-width: 886px;
	width: 90%;
	height: 11px;
	background-color: #65BA53;
	background-image: url(Suselbeek/footBorderEdge.gif);
	background-position: right top;
	background-repeat: no-repeat;
}

div#foot
{
	position: absolute;
	z-index: 800;
	left: 0px;
	bottom: 0px;
	min-width: 935px;
	width: 95%;
	height: 50px;
	background-color: #000000; /*baddae*/
	background-image: url(Suselbeek/footEdge.gif);
	background-position: right top;
	background-repeat: no-repeat;
	/*background-image: url(Suselbeek/ftBack.gif);
	border-bottom: 1px solid #8BA083;*/
	/*border-top: 10px solid #65BA53;*/
}

#Footer
{
	z-index: 800;
}

div#certificate
{
	position: absolute;
	z-index: 100;
	left: 10px;
	bottom: 0px;
	width: 229px;
	height: 49px;
	background-color: #000000; /*baddae*/
	background-image: url(Suselbeek/certificate_new.png);
	background-position: right top;
	background-repeat: no-repeat;
}

div.controls /* use class selector, because id is composed by server control */
{
	height: 30px;
	background-image: url(Suselbeek/ftSep.gif);
	background-repeat: no-repeat;
	float: right;
	text-align: right;
	padding-left: 50px;
}

div.controls input, div.controls button
{
	margin-right: 8px;
	margin-top: 4px;
}

/*span.title
{
	font-weight: bold;
	color: #545454;
}*/

hr
{
	height: 1px;
	color: #30B356;
	border-width: 1px;
}

input.pd-format-text, input.pd-format-numeric, input.pd-format-decimal, input.pd-format-dateTime, input.pd-format-guid, textarea.pd-rows-00
{
	height: 16px;
	padding: 1px 2px 0px 3px;
	margin-top: -2px;
}
select
{
	margin-top: -2px;
	margin-bottom: -2px;
}
textarea, div.edit
{
	padding: 0px 2px 0px 3px;
	margin-top: -2px;
}

.pd-list td input.pd-format-text, .pd-list td input.pd-format-numeric, .pd-list td input.pd-format-decimal, .pd-list td input.pd-format-dateTime, .pd-list td input.pd-format-guid, textarea.pd-rows-00,
.pd-list td select, .pd-list td textarea, .pd-list td div.edit
{
	margin-top: 0px;
}

.pd-list td .pd-form td input.pd-format-text, .pd-list td .pd-form td input.pd-format-numeric, .pd-list td .pd-form td input.pd-format-decimal, .pd-list td .pd-form td input.pd-format-dateTime, .pd-list td .pd-form td input.pd-format-guid, textarea.pd-rows-00,
.pd-list td .pd-form td select, .pd-list td .pd-form td textarea, .pd-list td .pd-form td div.edit
{
	margin-top: -2px;
}


div.edit
{
	position: relative;
	height: auto;
	min-height: 16px;
	overflow: visible;
	overflow-x: hidden;
}
div.edit p
{
	margin: 0px;
}

input.pd-format-text, input.pd-format-numeric, input.pd-format-decimal, input.pd-format-dateTime, input.pd-format-guid, textarea, select, div.edit
{
	background-color: #ffffff; 
	border-right: #7f9db9 1px solid;
	border-top: #7f9db9 1px solid;
	border-left: #7f9db9 1px solid;
	border-bottom: #7f9db9 1px solid;
}

input.pd-disabled, textArea.pd-disabled, select.pd-disabled, div.edit.pd-disabled
{
	color: #aca899;
	background-color: #F5F5F5;
	border-right: #c9c7ba 1px solid;
	border-top: #c9c7ba 1px solid;
	border-left: #c9c7ba 1px solid;
	border-bottom: #c9c7ba 1px solid;
}

.pd-form
{
	margin-bottom: 10px;
}
.pd-filter .pd-form
{
	margin-bottom: 0px;
}
.pd-filter
{
	margin-bottom: 10px;
}
.pd-form td
{
	padding: 2px 8px 1px 4px;
	height: 20px;
	border-bottom: 1px solid #E8E8E8;
}

.pd-filter .pd-form td
{
	border-bottom: 1px solid #DCEAEE;
}

.pd-form-section td
{
	padding-top: 10px;
	padding-bottom: 4px;
	vertical-align: top;
	cursor: default;
	color: #696969;
	font-weight: bold;
	border-bottom: none;
}

.pd-form-section td span
{
	display: block;
	width: 100%;
	height: 100%;
	border-bottom: 1px solid #30B356;
	padding-bottom: 0px;
	margin-bottom: 4px;
}

.pd-form-header
{
	display: block;
	position: relative;
	width: 95%;
	padding: 2px;
	margin-bottom: 10px;
	font-weight: bold;
	color: #000000;
	background-color: #E2E2E2;
	border-bottom: 1px solid #808080;
}

.pd-list
{
	border: 1px solid #808080;
	border-collapse: collapse;
	margin-bottom: 10px;
}

.pd-list td
{
	padding: 2px 8px 2px 4px;
}

.pd-list .pd-form
{
	margin: 0px;
}

.pd-list-header
{
	background-color: #C9E2C0;
	color: black;
	font-weight: normal;
	vertical-align: bottom;
}

.pd-list-header td
{
	padding-bottom: 4px;
	background-image: url(Suselbeek/DataListHeader.png);
	background-repeat: repeat-x;
}

.pd-list-header td .pd-checkbox input
{
	margin-top: -1px;
	margin-left: 1px;
}

.pd-list-item
{
	color: Black;
	background: white;
}
.pd-list-item.pd-alt
{
	color: black;
	background: whitesmoke;
}
.pd-list-item.pd-selected
{
	background: gray;
	color: black;
}

/* ???
table.pd-list tr td
{
	height: 0px;
}
*/

.pd-list-item td
{
	border-top: 1px solid #DCDCDC;
	border-right: 1px dashed #D8D8D8;
}
.pd-list-groupheader, .pd-list-grouptotal
{
	background: #EAEAEA;
	color: Black;
	font-weight: bold;
}
.pd-list-groupheader td, .pd-list-grouptotal td, .pd-list-endtotal td
{
	border-top: 1px solid gray;
	border-bottom: 1px solid gray;
	border-right: 1px dashed #DCDCDC;
}

.pd-list-footer
{
	background: gainsboro;
	color: Black;
}

.pd-list-endtotal
{
	background: gainsboro;
	color: black;
	font-weight: bold;
}
.pd-list-pager
{
	background: gainsboro;
	color: black;
}

/* Prevent padding while in a grouping list on pd-list-item (only allow padding on the group headers)*/
.pd-list-item td.pd-first,
{
	padding-left: 4px;
}

.pd-list-header td.pd-list-section, .pd-list-item td.pd-list-section, .pd-list-groupheader td.pd-list-section, .pd-list-grouptotal td.pd-list-section, .pd-list-endtotal td.pd-list-section
{
	border-left: 2px solid gray;
}

.pd-list tr td .pd-form tr td
{
	padding: 2px 8px 2px 4px;
	height: 20px;
	border-bottom: none;
	border-top: none;
	border-right: none;
}