/* CSS OM ALLE MARGINS AAN TE PASSEN VAN ELEMENTEN DIE PER BROWSER ANDERS ZIJN */
:link,:visited { text-decoration:none }
ul,ol { list-style:none }
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input,dl,dt,dd
{ margin:0; padding:0 }
a img,:link img,:visited img { border:none }
address { font-style:normal }
div.print { display: none; }

/* OVERIGE CSS */
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #666666;
	background-attachment: fixed;
	background-image: url(../images/bg_body.jpg);
	background-repeat: repeat-x;
	background-position: left top;
	background-color: #B6B7B1;
}

/* CONTAINER */
#container {
	display: block;
	width: 975px;
	margin-left: 10px;
}

/* CONTAINER > TOP */
#top {
	display: block;
	width: 975px;
	margin-top: 20px;
	/*height: 65px;*/
}

/* CONTAINER > TOP > LOGO */
#logo {
	display: block;
	width: 275px;
	height: 65px;
	float: left;
	clear: right;
	padding: 0;
	
	/*background-color: #FF0000;*/
}

#logo img {
}

/* CONTAINER > TOP > QUICKNAV */
#quicknav {
	display: block;
	width: 105px;
	height: 25px;
	float: left;
	clear: right;
	font-size: 12px;
	font-weight: bold;
	padding-top: 15px;
	
	/*background-color: #00FF00;*/
}

#quicknav select {
	border: 1px solid #666666;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	color: #666666;
	margin-left: 0px;
	margin-top: 5px;
}

/* CONTAINER > TOP > EXPLAIN */
#explain {
	display: block;
	float: left;
	clear: right;
	width: 445px;
	background-image: url(../images/bg_explain.gif);
	background-repeat: no-repeat;
	background-position: bottom;
	color: #FFFFFF;
	font-size: 12px;
	margin-top: 0px;
	
	/*background-color: #0000FF;*/
}

#explain div.content {
	background-image: url(../images/bg_explain_content.gif);
	background-repeat: no-repeat;
	padding: 8px;
}

#explain h1 {
	font-size: 15px;
	font-weight: bold;
	margin-bottom: 5px;
}

/* CONTAINER > TOP > LEGEND */
#legend {
	display: block;
	float: left;
	clear: right;
	width: 150px;
	text-align: right;
	padding: 0px;
	
	/*background-color: #FFFF00;*/
}

#legend img {
	margin-bottom: 2px;
}

/* CONTAINER > MATRIX */
#matrix {
	padding-top: 15px;
}

#matrix table {
	border-collapse: collapse;
	border-spacing: 2px;
}

#matrix table thead tr th {
	font-size: 14px;
	font-weight: bold;
	color: #000000;
	text-align: center;
	background-repeat: no-repeat;
	background-position: right;
	width: 132px;
	height: 38px;
	line-height: 38px;
	vertical-align: middle;
	padding: 0;
}

#matrix table tr th.year {
	font-size: 12px;
	background-image: url(../images/bg_yearhead.gif);
	background-position: left;
	width: 49px;
	line-height: 12px;
}

#matrix table tr th.light {
	background-image: url(../images/bg_countryhead_light.gif);
}

#matrix table tr th.dark {
	background-image: url(../images/bg_countryhead_dark.gif);
}

div.years {
	width: 49px;
	float:left;
	clear: right;
}

div.jarenTop,
div.jaren {
	height: 60px;
	background-color: #89B4C2;
	background-image: url(../images/bg_year.gif);
	width: 49px;
	text-align: center;
	font-weight: bold;
	color: #000000;
	/*border-top: 1px solid #FFFFFF;
	border-right: 1px solid #EEEEEE;*/
	font-size: 12px;
}

div.items_light,
div.items_dark {
	 width: 130px;
	 position: relative;
	 float:left;
	 clear: right;
	 margin-left: 2px;
	 z-index: 1;
}

div.items_light {
	background-color: #FFFFFF;
	background-image: url(../images/bg_item_light.gif);
}

div.items_dark {
	background-color: #CCCCCC;
	background-image: url(../images/bg_item_dark.gif);
}

div.jarenMatrix {
	height: 60px;
}

/* CONTAINER > BOTTOM */
#bottom {
}

/* CONTAINER > BOTTOM > MATRIX_FOOTER */
#matrix_footer {
	display: block;
	width: 100%;
	height: 8px;
}

#matrix_footer div.footer_year {
	width: 49px;
	float:left;
	clear: right;
	background-image: url(../images/bg_bottom_year.gif);
	background-repeat: no-repeat;
}

#matrix_footer div.footer_dark,
#matrix_footer div.footer_light {
	width: 130px;
	float:left;
	clear: right;
	background-repeat: no-repeat;
	margin-left: 2px;
}

#matrix_footer div.footer_light {
	background-image: url(../images/bg_bottom_item_light.gif);
}

#matrix_footer div.footer_dark {
	background-image: url(../images/bg_bottom_item_dark.gif);
}

/* CONTAINER > BOTTOM > FOOTER */
#footer {
	margin-bottom: 25px;
}

/* CLEAR DIV */
div.clear {
	width: 100%;
	height: 1px;
	line-height: 1px;
	font-size: 1px;
	clear: both;
}

div.item {
	position: absolute;
	display: block;
	width: 130px;
	/*border: 1px solid #330033;*/
	z-index: 100;
	/*background-color: #FFFFFF;*/
}

div.multipleItem {
	position: absolute;
	display: block;
	z-index: 50;
	text-align: center;
}

div.matrix {
	/*overflow: auto;*/
	height: 700px;
	position: relative;
	margin-top: 0px;
	width: 975px;
}

div.sandnourishment {
	color: #FFFFFF;
}

div.floodevent {
	color: #FFFFFF;
}

div.humanresponse {
	color: #FFFFFF;
}

/* GREY BOX */
#GB_window {
	top: 10px;
	left: 0px;
	position: absolute;
	background: #89B4C2;
	border: 2px solid #89B4C2;
	border-bottom: 0;
	overflow: auto;
	width: 400px;
	height: 460px;
	z-index: 150;
}

#GB_frame {
	border: 0;
	overflow: auto;
	width: 100%;
	height: 500px;
	background-color: #FFFFFF;
}

#GB_caption {
	font: 12px bold helvetica, verdana, sans-serif;
	font-weight: bold;
	color: #fff;
	background: #89B4C2;
	padding: 2px 0 2px 5px;
	margin: 0;
	text-align: left;
}

#GB_window img {
	position: absolute;
	top: 2px;
	right: 5px;
	cursor: pointer;
}

.top-left, .top-right, .bottom-left, .bottom-right { 
	height: 5px;
	font-size: 2px;
}

div.floodevent .top-left, div.floodevent .top-right, div.floodevent .bottom-left, div.floodevent .bottom-right { 
	background-image: url(../images/bg_item_flood.gif);
}

div.sandnourishment .top-left, div.sandnourishment .top-right, div.sandnourishment .bottom-left, div.sandnourishment .bottom-right { 
	background-image: url(../images/bg_item_works.gif);
}

div.humanresponse .top-left, div.humanresponse .top-right, div.humanresponse .bottom-left, div.humanresponse .bottom-right { 
	background-image: url(../images/bg_item_laws.gif);
}

.top-left, .bottom-left { 
	margin-right: 5px;
}

.top-right, .bottom-right { 
	margin-left: 5px;
	margin-top: -5px;
}

.top-right {
	background-position: 100% 0;
}

.bottom-left  { 
	background-position: 0 -5px;
}

.bottom-right { 
	background-position: 100% -5px;
}

.inside {
	color: #FFFFFF;
	padding-left: 5px;
	padding-right: 5px;
	min-height: 25px;
	height: auto !important;
	height: 25px
}

.inside a,
.inside a:link,
.inside a:hover {
	color: #FFFFFF;
	text-decoration: underline;
}

.inside a:hover {
	text-decoration: underline;
}

.inside img {
	float: left;
	margin-right: 4px;
}

.inside img.multi {
	float: none;
}

div.floodevent .inside {
	background-image: url(../images/bg_item_flood_content.gif);
	border-left: 1px solid #88B3C2;
	border-right: 1px solid #88B3C2;
}

div.sandnourishment .inside {
	background-image: url(../images/bg_item_works_content.gif);
	border-left: 1px solid #B57B35;
	border-right: 1px solid #B57B35;
}

div.humanresponse .inside  {
	background-image: url(../images/bg_item_laws_content.gif);
	border-left: 1px solid #89B3C1;
	border-right: 1px solid #89B3C1;
}

div.mapDiv {
	background-image: url(../images/bg_tip_onderkant_leeg.gif);
	background-position: bottom;
	background-repeat: no-repeat;
	padding-bottom: 11px; /* 40px */
	width: 250px;
	z-index: 250;
}

div.mapDivMirror {
	background-image: url(../images/bg_tip_onderkant_leeg.gif);
	background-position: bottom;
	background-repeat: no-repeat;
	padding-bottom: 11px; /* 40px */
	width: 250px;
	z-index: 250;
}

div.mapDiv div.mapDivContent,
div.mapDivMirror div.mapDivContent {
	display: block;
	width: 230px;
	background-image: url(../images/bg_tip_bovenkant.gif);
	background-position: top;
	background-repeat: no-repeat;
	padding: 10px;
	position: relative;
	z-index: 250;
}

div.mapDiv div.mapDivContent div.mapDivClose,
div.mapDivMirror div.mapDivContent div.mapDivClose {
	position: absolute;
	top: 5px;
	right: 5px;
	display: block;
	height: 9px;
	width: 9px;
	cursor: pointer;
	background-image: url(../images/close1.gif);
	background-repeat: no-repeat;
}

div.mapDiv div.mapDivContent h3,
div.mapDivMirror div.mapDivContent h3 {
	color: #FFFFFF;
	font-weight: bold;
	font-size: 12px;
	margin-bottom: 5px;
}

div.mapDiv div.mapDivContent h3 a,
div.mapDiv div.mapDivContent h3 a:link,
div.mapDivMirror div.mapDivContent h3 a,
div.mapDivMirror div.mapDivContent h3 a:link {
	text-decoration: none;
}

div.mapDiv div.mapDivContent h3 a:hover,
div.mapDivMirror div.mapDivContent h3 a:hover {
	text-decoration: underline;
}

div.mapDiv div.mapDivContent p,
div.mapDiv div.mapDivContent ul,
div.mapDivMirror div.mapDivContent p,
div.mapDivMirror div.mapDivContent ul {
	margin-top: 3px;
	color: #FFFFFF;
	line-height: 1.3em;
}

div.mapDiv div.mapDivContent ul li,
div.mapDivMirror div.mapDivContent ul li {
	padding: 2px 0px;
}

div.mapDiv div.mapDivContent a,
div.mapDiv div.mapDivContent a:link,
div.mapDiv div.mapDivContent a:hover,
div.mapDivMirror div.mapDivContent a,
div.mapDivMirror div.mapDivContent a:link,
div.mapDivMirror div.mapDivContent a:hover  {
	color: #FFFFFF;
	text-decoration: underline;
}