/**********************************************************************************
 * 
 * Deze code is met veel plezier geschreven, getest en met trots 
 * opgeleverd door Ben Peachey en Michel Dokter van Vije Internetproducties.
 *
 * Laatste update: 18 november 2007
 * 
 * Voor vragen kunt u contact opnemen per e-mail (aron@vije.nl) of per 
 * telefoon (074-2673400).
 *
 * Meer informatie over Vije Internetproducties vindt u op http://www.vije.nl
 *
 **********************************************************************************/
 
/*---------------------------------------------------------------------------------
	Stylesheet for Minder Drank Meer Scoren
	----------------------------------------
	To avoid the IE box bugs:
	IE padding bug: make sure you never set both 'width' and 'padding'
		in the same element. Instead use padding or margins in a child/parent ellement 
	
	IE float bug: always set position:relative; for floats
--------------------------------------------------------------------------------*/

/***********************************************************************************
 * STYLE RESETS
 **********************************************************************************/
	body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
		margin:0;
		padding:0;
	}
	em {
	font-style: italic!important;
	}
	p {
	margin-bottom:15px;
	}
	table {
		border-collapse:collapse;
		border-spacing:0;
	}
	
	fieldset,img { 
		border:0;
	}
	
	address,caption,cite,code,dfn,em,th,var {
		font-style:normal;
		font-weight:normal;
	}
	
	ol,ul {
		list-style:inside;
	}
	
	caption,th {
		text-align:left;
		overflow: 
	}
	
	h1,h2,h3,h4,h5,h6 {
		font-family: Arial, Helvetica, sans-serif;
		font-size:100%;
		font-weight:bold;
		color: #008fd4;
	}
	
	abbr,acronym { 
		border:0;
	} 
 
/***********************************************************************************
 * GENERIEKE STYLES
 **********************************************************************************/
	body {
		text-align: center;	/* workaround for centering #container using auto margins */
	}
	body,tr,td,th,li {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 12px;
	}
	
	h1 {
		font-size:14pt;
		margin: 0 0 10px 0 ;
	}
	
	h2 {
		font-size: 12px;
	}

	h3 {
		font-size: 10px;
	}
	
	hr {
			border:0px solid #008ec8;
			height: 1px;
			color:#008ec8;				/* for IE */
			background-color:#008ec8;	/* for Opera and Mozilla */
			margin:0;
			width:100%;
		}
	a:link {
		text-decoration:none;
		color: #008fd4;
		}
	a:visited {
		text-decoration:none;
		color: #008fd4;
		}
	a:hover {
		text-decoration:underline;
		color: #008fd4;
	}
/***********************************************************************************
 * GLOBALE LAYOUT
 **********************************************************************************/
	div#wrapper {
		width: 910px;
		margin: 0 auto;	/* auto centering */
	}
	
	div#wrapper #container {
		width: 910px;
		height: 555px;
		margin-top: 50px;
		position:relative;
	}


/*login
----------------------------------------*/
	
	#login {
		position: absolute;
		top: -115px;
		margin-top: -50px;
		height: 115px;
		width: 340px;
		right: 13px;
		color: #fff;
		background: #008EC8;
		z-index: 5;
		overflow: visible;
	}
	
	#login #loginForm {
		margin: 20px 20px 0;
	}
	
	#login a.loginLink {
		position: absolute;
		background: #008EC8;
		color: #fff;
		display: block;
		height: 25px;
		line-height: 20px;
		width: 200px;
		text-align: center;
		bottom: -25px;
		right: 0px;
		outline: 0;
		}
	
	#login #loginForm div.label {
		clear: both;
		float: left;
		width: 120px;
		margin-bottom: 2px;
	}
	#login #loginForm div.field {
		float: left;
		margin-bottom: 2px;
	}
	#login #loginForm input.submit {
		clear: both;
		margin-top: 5px;
	}
	

/*sidebar
----------------------------------------*/
	#sidebar {
		float: left;
		position: relative;
		width: 287px;
		height: 320px;
		background: url(/img/foto_kids.gif);
		background-repeat: no-repeat;
	}

		#mdms_logo {
			position: relative;
			left: 14px;
			margin-top: -46px;
			overflow: hidden;
		}
		
	/* agenda
	--------------------*/
		#agenda {
			position: relative;
			top: 230px;
			height: 220px;
			background: url(/img/agenda_bg.gif);
			background-repeat: no-repeat;
			overflow:hidden;
		}
	
		#agenda div#agendawrapper {
			width:255px;
			color:#008ec8;
			position:relative;
			top:52px;
			margin: 0 10px;
		}

		#agenda .agendalink {
			font-size: 10px;
			font-weight: bold;
			color: #008fd4;
		}
		
		#agenda .agendaitem {
			font-size: 10px;
		}
		#agenda div#agendawrapper  hr{
		margin: 5px 0;
		}


	/* random images
	--------------------*/
	#random_images {
				position:relative;
				float: left;
				margin: 0;
				padding: 0;
				top: 10px;
				height: 90px;
				width: 280px;
			}

/* besloten sidebar
----------------------------------------*/
	body.besloten #sidebar {
		height: auto;
		width: 297px;
		padding-bottom: 25px;
		background: #CDEAFC url(/img/besloten_side_kids.jpg) no-repeat center 45px;
	}
	
	body.besloten #sidebar .bottom_bg {
		position: absolute;
		width: 297px;
		height: 13px;
		bottom: -13px;
		background: url(/img/besloten_side_bottom.gif) no-repeat;
	}

	body.besloten #mdms_logo {
		margin-top: 0;
	}

	body.besloten #sidebar #besloten {
		margin-top: 100px;
		position: relative;
		padding-bottom: 40px;
		background: #CDEAFC url(/img/besloten_side_menu_bg.gif) no-repeat center bottom;
	}

	body.besloten #sidebar #besloten h1 {
		background: url(/img/besloten_side_head.gif) no-repeat;
		text-indent: -9000px;
		height: 42px;
		width: 261px;
	}

	body.besloten #sidebar #besloten h4 {
		margin: 4px 0;
	}

	body.besloten #sidebar #besloten .inner {
		padding-left: 17px;
	}

	body.besloten #sidebar #besloten ul {
		color: #008FD4;
	}

	body.besloten #sidebar #besloten ul li.spacer {
		list-style-type: none;
		height: 20px;
		width: 100%;
	}

	body.besloten #sidebar #besloten a.logout.button {
		display: block;
		text-indent: -9000px;
		background: url(/img/besloten_side_logout.jpg) no-repeat top left;
		border: 0;
		bottom: 48px;
		margin-top: 30px;
		width: 141px;
		height: 24px;
		line-height: 24px;
		outline: 0;
	}


/* menu
----------------------------------------*/
	#menu_holder {
		float: right;
		position:relative;
		width: 620px;
	}

	#menu_holder b{
		position:relative;
		left:-9000px;
	}

		#menu ul {
			float:left;
			position:relative;
		}
		
		#menu ul {
			display:inline;
		}

		#menu ul li {
			display: block;
			float: left;
			position:relative;
		}

		#menu li a{
			display: block;
			background-color: #FFF;
			margin: 0 1px;
			text-decoration:none;
		}
		
		div#menu_holder div#menu a.currentMenuItem{
			background-color:#CE9;
		}
		
		#menu_holder #menu li a:hover{
			background-color:#df1;
		}

		#menu li a {
			height: 48px;
		}
	
		#menu li a#menu_item_01{	/* MDMS */
			background: url(/img/menu_01.gif) no-repeat;
			width:218px;
			position:relative;
			top:0px;
			/* right:208px;*/
		}
		#menu li a#menu_item_02{	/* Nieuws */
			background: url(/img/menu_02.gif) no-repeat;
			width:71px;
			position:relative;
			/* left:85px;*/
		}
		#menu li a#menu_item_03{	/* Mijn Gemeente */
			background: url(/img/menu_03.gif) no-repeat;
			width:117;
		}
		#menu li a#menu_item_04{	/* Downloads */
			background: url(/img/menu_04.gif) no-repeat;
			width:92;
		}
		#menu li a#menu_item_05{	/* Algemeen */
			background: url(/img/menu_05.gif) no-repeat;
			width:99;
		}

	/* submenu
	--------------------*/
		
		#submenu {
			float:left;
			position:relative;
			line-height: 21px;
		}
	
		div#submenu ul {
			display:inline;
		}

		div#submenu ul li {
			display: block;
			float: left;
			position:relative;
			margin: 0 2px;		
		}

		div#submenu ul li a{
			font-weight:bold;
			font-size:8pt;
			text-decoration:none;
			color:#073;
		}

		div#submenu a:hover{
			color:#6B6;
		}

		div#submenu a.currentMenuItem{
			text-decoration:none;
			color:#bd8; /* #CE9 */
		}
		
		#submenu.parent_01{
			left:20px;
		}
		#submenu.parent_02{
			left:90px;
		}
		#submenu.parent_03{
			left:300px;
		}
		#submenu.parent_04{
			float:right;
			right:120px;
		}
		#submenu.parent_05{
			float:right;
			right:35px;
		}


/* content
----------------------------------------*/
	#content {
		margin-top: 20px;
		float: left;
		position: relative;
		top: 0px;
		width: 400px;
		left: 10px;
		background-color:#FFF;
		z-index:2;
	}
	
	body.besloten #content {
		width: 600px;
	}
		
	#content_rechts {
		margin-top: 20px;
		float: right;
		position: relative;
		width: 160px;
		right: 30px;
	}

		#adressen li{
			list-style:disc outside;
		}
/* Sitemap */
	ul#sortable_menu, ul#sortable_menu ul {
		list-style: disc;
		margin: 0;
		margin-bottom: 10px;
	  	margin-left: 20px;
		padding: 0;
	}
	ul#sortable_menu li a, ul#sortable_menu ul li a {
		
		font-family: Arial, Helvetica, sans-serif;
		font-size: 14px;
		color: #000000;
		text-decoration: none;
	}
	

/* footer
----------------------------------------*/
	#footer {
		position:relative;
		float:right;
		margin-right: 10px;
		top: -143px;
		width: 600px;
		height:260px;
	}
#flessen {
	position: relative;
	top: -2px;
}

/***********************************************************************************
 * MODULE- EN PAGINA SPECIFIEKE LAYOUT
 **********************************************************************************/
	#nieuwsContainer ul{
		list-style: disc outside;
		left:20px;
		position:relative;
	}
	#nieuwsContainer hr{
		margin:12px 0 ;
	}
	
	/****( Notities )**********************************/
    #notities {
		margin-top: 20px;
		}
		#notities table {
			margin-top: 20px;
			}
			#notities table th {
				background-color: #008EC8;
				color: #fff;
				text-align: left;
				font-size: 9pt;
				padding: 2px 10px;
				}
				#notities table th.datum {
					}
				#notities table th.auteur {
					}
				#notities table th.titel {
					}
				
			#notities table tr.comment_row td {
				background-color: #CDEAFC;
				padding: 2px 10px;
				}
				#notities table tr.hover td {
					background-color: #5EB5E6;
					cursor: pointer;
					}
			#notities table tr.comment_row_content td {
				background-color: #CDEAFC;
				}
				#notities table tr.comment_row_content td div.comment_files {
					float: right;
					width: 180px;
					margin-left: 10px;
					margin-bottom: 10px;
					padding: 10px;
					}
					#notities table tr.comment_row_content td div.comment_files a {
						}
					#notities table tr.comment_row_content td div.comment_files strong {
						display: block;
						margin-bottom: 5px;
						}
				#notities table tr.comment_row_content td div.comment_content {
					padding: 10px;
					background: #E8F3F9;
					}
					
    /****( Notities Form )******************************/
	form#comment_form {
		margin-top: 20px;
		background-color: #CDEAFC;
		padding-bottom: 10px;
		position: relative;
		height: 190px;
		}
		form#comment_form h3 {
			background-color: #008EC8;
			color: #fff;
			padding: 4px;
			padding-left: 10px;
			position: relative;
			margin-bottom: 10px;
			}
			form#comment_form h3 span {
				display: block;
				position: absolute;
				right: 10px;
				top: 4px;
				color: #fff;
				}
				form#comment_form h3 span a {
					color: #fff;
					}
		form#comment_form p {
			margin: 0;
			padding: 0;
			margin-bottom: 4px;
			padding-left: 10px;
			}
		form#comment_form label {
			display: block;
			}
			form#comment_form p#comment_content_p label {
				}
		form#comment_form input.text, form#comment_form textarea {
			background-color: #fff;
			width: 200px;
			}
		form#comment_form textarea {
			width: 260px;
			height: 150px;
			}
		form#comment_form p#comment_content_p {
			position: absolute;
			right: 10px;
			top: 35px;
			}
			form#comment_form p#comment_content_p label {
				width: 80px;
				float: left;
				}

/***********************************************************************************
 * MODIFIERS
 **********************************************************************************/
 
 	.float-left { float: left; }
	.float-right { float: right; }
	.position-relative { position: relative; }
	.spacer { clear: both; } 
	.nowrap { white-space: nowrap; } 
	.uppercase { text-transform: uppercase; }
	.bold { font-weight: bold;}
	input.button {	cursor: pointer;}