/* Main building blocks */

body, html {
	padding: 0;
	margin: 0;
	line-height: 1.2;			/* line-height: needs to be set, avoid different interpretations by browsers */
	font-size: 0px;				/* Silly IE 6 Hack... */
	font-family: Calibri, Arial, Sans-Serif;		
								/* Linux fonts to be included */
	background-image: url('background_pixel.png'); 
}
div#wrapperDiv {				/* Centers the website and fixes the width */
	margin: 0px auto;
	width: 950px;				/* wrapperDiv.width = 950 */
	background: white url('border_left.png') repeat-y left;
}
div#headerDiv {					/* Contains headers, the right shadow and the top curved borders */
	height: 180px;
	background: white url('shadow_right.png') repeat-y right;
}
div#columnWrapperDiv {
	background: url('border_middle.png') repeat-y 78px 0px;
	width: 902px;
}
div#mainDiv {					/* Main content */
	float: right;
	font-size: 16px;
	padding: 0px 10px 10px 10px;
	width: 798px;				/* mainDiv.width = wrapperDiv.width - columnDiv.margin-left */
								/* 					image('border_middle.png').width - mainDiv.padding-left - mainDiv.padding-right - image('border_right.png').width */
}
div#footerDiv {					/* Footer */
	clear: both;
	height: 60px;
	text-align: center;
	background-color: white;
}
div#rightBorderDiv {		
	clear: both;
	background: url('border_right.png') repeat-y right;
}

/* Other parts in main content */
div#headerImgDiv img {
	margin: 8px 8px;
}
			
/* Shadows around the central content */
div#topShadowDiv, div#bottomShadowDiv {
	height: 31px;
}		
div#topleftShadowDiv, div#toprightShadowDiv, div#bottomleftShadowDiv, div#bottomrightShadowDiv {
	width: 33px;
	height: 31px;
}
div#topleftShadowDiv {
	float: left;
	background-image: url('shadow_topleft.png');
}
div#topShadowDiv {
	background: white url('shadow_top.png') repeat-x;
}
div#toprightShadowDiv {
	float: right;
	background-image: url('shadow_topright.png');
}
div#bottomleftShadowDiv {
	float: left;
	background-image: url('shadow_bottomleft.png');
}
div#bottomShadowDiv {
	clear: both;
	background: white url('shadow_bottom.png') repeat-x bottom;
}
div#bottomrightShadowDiv {
	float: right;
	background-image: url('shadow_bottomright.png');
}			
div#leftFooterShadowDiv {		/* Shadows in the footer */
	float: left;
	background: url('shadow_left.png') repeat-y;
	height: 60px;
	width: 18px;
}
div#rightFooterShadowDiv {
	float: right;
	background: url('shadow_right.png') repeat-y;
	height: 60px;
	width: 18px;
}


/* Header contents */
div#logoDiv {
	width: 261px; 				/* image('logo.png').width + 45 (to fix yellow line) */
	height: 180px;				/* headerDiv.height */
	background: url('shadow_left.png') repeat-y;
	float: left;
}
img#logoImg {
	margin-left: 45px;
	margin-top: 20px;
	border: none;
}
img#sloganImg {
	float: right;
	margin-right: 0px;
	margin-top: 40px;
}
div#linkDiv {
	float: right;
	margin-right: 40px;
	font-size: 16px;
	text-align: right;
}

/* Borders in header and bottomborderwrapper */
div#topBorderWrapperDiv {
	clear: both;
	width: 850px; 				/* mainDiv.width - columnDiv.margin-left - image('border_right.png').width + image('border_middle.png').width */
	height: 13px; 				/* image('border_topleft.png').height */
	margin-left: 78px; 			/* columnDiv.margin-left */
	padding-top: 30px;
	background-color: white;
}
div#bottomBorderWrapperDiv {
	clear: both;
	width: 850px; 				/* mainDiv.width - columnDiv.margin-left - image('border_right.png').width + image('border_middle.png').width */
	height: 13px; 				/* image('border_topleft.png').height */
	margin-left: 78px; 			/* columnDiv.margin-left */
}
div#topleftBorderDiv {
	float: left;
	/*margin-top: 28px;
	margin-left: 17px;*/
	width: 14px;
	height: 13px;
	background: url('border_topleft.png');
}
div#topBorderDiv {
	float: left;
	/*margin-top: 28px;*/ 			/* headerDiv.height - sloganImg.margin-top - image('border_topleft.png').height - sloganImg.height - redLineDiv.margin-top - redLineDiv.height (red line) */
	width: 802px;				/* columnDiv.margin-left - columnDiv.width - columnDiv.padding-left - columnDiv.padding-right - image('border_right.png').width */
								/* + image('border_middle.png').width - topleftBorderDiv.width - toprightBorderDiv.width */
	height: 5px;				/* image('border_top.png').height */
	background: url('border_top.png') repeat-x;
}
div#toprightBorderDiv {
	float: left;
	/*margin-top: 28px;*/ 			/* headerDiv.height - sloganImg.margin-top - image('border_topleft.png').height - sloganImg.height */
	width: 14px;
	height: 13px;
	background: url('border_topright.png');
}
div#bottomleftBorderDiv {
	float: left;
	display: inline;			/* Silly IE 6 Hack... */
	/*margin-left: 220px;*/ 		/* columnDiv.width + columnDiv.padding-left + columnDiv.padding-right */
	width: 14px;
	height: 13px;
	background: url('border_bottomleft.png');
}
div#bottomBorderDiv {
	float: left;
	background: url('border_bottom.png') repeat-x;
	width: 802px;				/* columnDiv.margin-left - columnDiv.width - columnDiv.padding-left - columnDiv.padding-right - image('border_right.png').width */
								/* + image('border_middle.png').width - topleftBorderDiv.width - toprightBorderDiv.width */
	height: 5px;				/* image('border_bottom.png').height */
	margin-top: 8px; 			/* image('border_topleft.png').height - image('border_top.png').height */
}
div#bottomrightBorderDiv {
	float: left;
	width: 14px;
	height: 13px;
	background: url('border_bottomright.png');
}

/* Red line in header */
div#redLineDiv {
	float: left;
	margin-top: 3px;
	/*margin-right: 42px;*/		/* image('border_right.png').width - image('border_middle.png').width */
	width: 647px; 				/* wrapperDiv.width - image('border_right.png').width - logoDiv.width + image('border_middle.png').width + 12 (width of yellow border) */
	height: 11px;
	background: url('redline_pixel.png');
}

/* Footnote text */
div#footNoteDiv {
	padding-top: 40px;
	font-size: 14px;
}
div#footNoteDiv a, div#linkDiv a {
	text-decoration: none;
	color: rgb(96,96,96);
}
div#footNoteDiv a:hover, div#linkDiv a:hover {
	color: black;
}
div#footNoteDiv {
	vertical-align: bottom;
	color: rgb(96,96,96);
}
div#mainDiv a.item {
	white-space: nowrap;
	font-size: 21px;
	line-height: 21px;
	color: black;
	text-align: center;
	padding: 30px 0px;
	display: block;
	margin-top: 10px;
	background: url('item.png') no-repeat;
	width: 190px;
	height: 183px;
	float: left;
	margin-left: 10px;
	overflow: hidden;
}
div#mainDiv a.item img {
	margin-top: 20px;
	border: none;
}
div#mainDiv a.item:hover {
	background: url('item.png') -190px 0px;
}
div#mainDiv a.item:hover img {
	border: none;
}

div#mainDiv div.itemDiv p {
	margin-left: 0;
	margin-right: 0;
	text-align: center;
	font-size: 21px;
	white-space: nowrap;
	margin-top: 25px;
	margin-bottom: 25px;
	display: block;
}
div.itemDiv ul {
	list-style:none;
	padding-left:15px;
	margin-left: 0;
}
div.itemDiv li a {
	color: black;
	padding: 3px 5px 4px 5px;
	width: 150px;
	display: block;
}
div.itemDiv li a:hover {
	padding: 3px 5px;
	border-bottom: 1px dotted gray;
	color: navy;
	background-color: rgb(255,215,0);/* #F0F0F0;*/
}
div#mainDiv a.item#first {
	margin-left: 2px;
}
div#infoDiv {
	clear: both;
	text-align: center;
	padding-top: 20px;
}