@charset "UTF-8";
/* CSS Document */

/* reset values for browser consistency, thanks to Eric Meyer: http://meyerweb.com/eric/tools/css/reset/ */

.clear {
	clear: both;
	height: 0;
	line-height: 0;
	font-size: 1px;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
:focus {
	outline: 0;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
table {
	border-collapse: separate;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

html {
	background-color: #f2f2f2;
}

body{
	/*background: #f1f1f1 url(../images/design/body-bg.gif) repeat-x top left;*/
	font-family: Arial, Helvetica, sans-serif;
	font-size: 62.5%;
	text-align: center;
	margin: 0px;
	padding: 0px;
	background-color: #f2f2f2;
}


h1 {
	font-size: 2em;
	line-height: 1.2em;
	font-family: Lucida Grande, Arial, Verdana, Helvetica;
	color: #264367;
	font-weight: bold;
	margin: 0 0 5px 0;
}

h1.bigpad {
	margin: 0 0 15px 0;
}

h2 {
	font-size: 1.2em;
	line-height: 1.7em;
	font-family: Lucida Grande, Arial, Verdana, Helvetica;
	color: #c6842a;
}


#wrapper{
	width: 100%;
	margin: 0 auto;
	text-align: center;
	background: #F7F7F7 url(../images/design/body-bg.gif) repeat-x bottom left;
	padding: 0 0 15px 0;
}

#body {
	width: 1000px;
	text-align: left;
	margin: 0 auto;
}


#header{
	height: 120px;
	width: 100%;
	text-align: center;
	background-color: #004168;
}

#header h1{
	color: #ffffff;
	font-size: 1.5em;
	font-weight: normal;
	float: left;
}

#header #header-images {
	width: 1000px;
	margin: 0 auto;
	height: 120px;
}

#header #logo{
	margin: 40px 0 0 0;
	float: left;
}

#header #klein-woordje{
	margin: 35px 0 0 180px;
	float: left;
}

#header #stuur-door{
	float: left;
	margin: 70px 0 0 135px;
}

#navigation {
	text-align: center;
	font-size: 1.4em;
	background: url(../images/design/navigation-bg.gif) repeat-x top left;
	width: 100%;
	padding: 15px 0 0 0;
}

	#navigation ul {
	}

	#navigation li {
		display: inline;
		border-right: 1px solid #264367;
		padding: 4px 0 4px 0;
		overflow: hidden;
	}
	
	#navigation li:hover {
		background-color: #c4d4e3;
	}
	
#navigation {
	line-height: 25px;/*2.8em*/
	padding: 0;
}

	#navigation ul li a{
		display: inline;
	}
	
	#navigation ul li:hover {
		background-color: #c4d4e3;
	}

	#navigation ul ul a.active {
		background: none;
	}
	
	/* items rechts niet veranderen */
	#navigation ul li ul { /* gigantische witte blok met eerste submenu */
		clear: both;
		z-index: -10;
		left: 10px;
		display: block;
		position: absolute;
		overflow: hidden;
		background-color: #b1c7da;
		padding: 0 0 0 0;
		margin: 12px 0 0 0;
		width: 215px;
		text-align: left;
	}
	#navigation ul li ul.blockBorder {
		border-left: 1px solid #264367;
	}	
	#navigation ul li ul li { /* submenu element */
			display: block;
			clear: both;
			padding: 0; /* padding-left geen effect */
			margin: 0;	
		overflow: hidden;
		display: inline;
		border: 0;
	}
	
	#navigation ul li ul li:hover { /* submenu element */
			display: block;
		display: inline;
			clear: both;	
			background-color: #c4d4e3;
	}
	
	#navigation ul li ul li a { /* submenu link */
		/*width: 100%;*/
		padding: 0;
		/*font-size: 1.1em;
		font-weight: normal;*/
		line-height: 2em;
		display:block;
		clear: both;
		padding: 0 15px;
		overflow: visible;
	}
	
	#navigation ul li ul li a:hover {
		background-color: #c4d4e3;
	}

	#navigation ul li ul.active-submenu{
			z-index: 20;
	}
	#navigation ul li ul.inactive-submenu{
			z-index: 10;
	}

	
	#navigation li.last {
		border-right: none;
	}
	
	#navigation li a {
		color: #264367;
		text-decoration: none;
		padding: 10px 20px 10px 20px;
		display: block;
		height: 25px;
	}
	
		#navigation li a.active {
			color: #ffffff;
		}

#leftcol {
	width: 470px;
	float: left;
	margin: 10px 0 0 0;
}

#send-message {
	width: 100%;
	height: 230px;
	position: relative;
}

#message-adds {
	float: right;
	margin: 15px 0 0 20px;
	height: 250px;
	width: 150px;	
	position: relative;
}

	#teller {
		background: url(../images/design/teller.png) no-repeat top left;
		float: right;
		width: 137px;
		height: 114px;
		z-index: 999;
		position: absolute;
		margin: 0 0 0 15px;
		background-position: 0 0;
	}
	
	#teller:hover {
		background-position: -144px 0;
		cursor: pointer;
	}
	
		#teller-1 {
			width: 120px;
			height: 40px;
			margin: 5px 0 0 8px;
		}
		
		#teller-2 {
			width: 130px;
			height: 100px;
			margin: -70px 0 0 10px;
			z-index: 1000;
			position: absolute;
		}
			
			#teller-2 a {
				cursor: pointer;
			}
	
	#tellfriend {
		margin: -20px 0 0 0px;
		width: 150px;
		height: 120px;
		background: url(../images/design/tell-a-friend.gif) no-repeat top left;
		float: right;
		background-position: 15px 0;
		position: relative;
		top: 110px;
	}
	
	#tellfriend:hover {
		background-position: -139px 0;
	}

#berichtenticker {
	margin: 10px 0 10px 0;
}

#phara img {
	float: left;
}

#phara-2 {
	float: right;
	width: 300px;
	margin: 20px 0 0 0;
}

	#phara-2 p, .small-text p {
		color: #797979;
		font-size: 1.3em;
		line-height: 1.4em;
	}
	
	#phara-2 a {
		color: #264367;
		text-decoration: underline;
		font-size: 1.3em;
	}

	.small-text a {
		color: #264367;
		text-decoration: underline;
		font-size: 1em;
	}
	
	.small-text img {
		margin: 0 10px 0 0;
	}

#schrijf-postit {
		background: url(../images/design/berichtje-schrijven-2.gif) no-repeat; 
		padding: 7px 0 0 0;
		position: absolute;
		float: left;
		margin: -5px 10px 0 0;
		width: 318px;
		height: 237px;
		z-index: 10;
		clear: both;
	}
	
		#schrijf-postit-content {
			padding: 0 0 25px 0;
			width: 245px;
		}
		
			textarea{
				color: #264367;
				background: none;
				border: none;
				padding: 5px;
				height: 110px;
				width: 240px;
				margin: 40px 0 0 30px;
				font-family: Arial, Helvetica, sans-serif;
				font-size: 1.4em;
				overflow: hidden;
			}
			
			input.button{
				background: url(../images/design/button.gif) no-repeat top left;
				text-align: center;
				padding: 4px 14px;
				font-weight: bold;
				font-size: 1.2em;
				border: 0;
				clear: both;
				margin: 15px 0 0 80px;
				cursor: pointer;
				width: 142px;
				height: 24px;
			}

#rightcol {
	background: url(../images/design/paper.jpg) no-repeat top left;
	width: 520px;
	height: 560px;
	float: right;
	margin: 10px 0 0 0;
}

#rightcol-long {
	background: url(../images/design/paper_fade.gif) no-repeat top left;
	width: 520px;
	min-height: 560px;
	float: right;
	margin: 10px 0 0 0;
}

#content {
	margin: 60px 0 0 110px;
	width: 370px;
}

#activities {
	margin: -5px 0 0 0px;
	width: 137px;
	height: 94px;
	background: url(../images/design/activities_hover.gif) no-repeat top left;
	float: right;
}

#activities:hover {
	background-position: -139px 0;
}

#activities2 {
	margin: -4px 0 0 0px;
	width: 137px;
	height: 94px;
	background: url(../images/design/activities_hover2.gif) no-repeat top left;
	float: right;
}

#activities2:hover {
	background-position: -139px 0;
}

	#rightcol p, #rightcol-long p {
		color: #797979;
		font-size: 1.3em;
		line-height: 1.4em;
		margin: 0 0 15px 0;
	}

	#rightcol a, #rightcol-long a {
		color: #c6842a;
		text-decoration: underline;
	}
	
	#testimonial {
		margin: 10px 0 0 0;
		width: 370px;
	}
	
	#testimonial img {
		float: left;
	}
	
	#testimonial #text {
		float: right;
		width: 210px;
	}

p.blue {
	color: #264367 !important;
}

#footer {
	width: 100%;
	height: 105px;
	background: url(../images/design/footer-links.gif) no-repeat bottom center;
	text-align: center;
	color: #909eb0;
	font-size: 1.1em;
	margin: 5px 0 0 0;
	line-height: 1.3em;
}

	#footer a {
		color: #909eb0;
	}


/**********************************************************************************************************************************************/
/* LEES ALLE BERICHTJES ***********************************************************************************************************************/

#all-messages .date {
	color: #264367;
	font-weight: bold;
	float: left;
	margin-right: 4px;
}

#all-messages .message-container {
	padding: 10px 0 5px 0;
	margin: 5px 0 5px 0;
	border-top: 1px solid #f7db9f;
	border-bottom: 1px solid #f7db9f;
	width: 380px;
	float: left;
	overflow: hidden;
}

#all-messages .message {
	margin-bottom: 10px;
	padding: 5px;
}

	#all-messages .message.even {
		background: url(../images/design/background-messages.png);
	}

#all-messages p {
	text-align: justify;
	margin-bottom: 0;
}

/**********************************************************************************************************************************************/
/* PAGINATION *********************************************************************************************************************************/

.pagination {
	width: 380px;
	margin: 0 0 0 0;
	font-family: Lucida Grande, Arial, Verdana, Helvetica;
}

.pagination h5 {
	float: left;
	width: 100%;
	font-size: 1em;
	padding: 5px 0 5px 0;
	color: #264367;
}

.pagination .page-links {
	text-align: right;
	width: 100%;
	margin: 0 0 0 0;
	float: right;
}

.pagination a {
	font-size: 1em;
	text-decoration: none !important;
	display: inline-block;
	text-align: center;
	padding: 3px;
}

	.pagination a.active {
		font-weight: bold;
		text-decoration: underline !important;
	}
	
	.pagination a:hover {
		background-color: #f7db9f;
	}
	
	
/**********************************************************************************************************************************************/
/* INSPIREER UW VRIENDEN FORM *****************************************************************************************************************/

h4 {
	font-size: 1.2em;
	font-weight: bold;
	margin: 20px 0 10px 0;
}

#friend-form {
	margin: 0 0 25px 0;
}

#friend-form label {
	width: 100px;
	display: block;
}

#friend-form .textfield {
	border: 1px solid #888888;
	width: 180px;
}

#friend-form .error {
	background-color: #FFEDCC;
}

#friend-form .ul-tellfriend, #friend-form .ul-tellfriend2 {
	margin: 5px 0 20px 15px;
	list-style: none;
	font-size: 1em;
}

.ul-tellfriend label, .ul-tellfriend2 label {
	display: block;
	font-size: 1.2em;
	color: #797979;
	float: left;
	padding: 3px 0 0 0;
}

	.ul-tellfriend li, .ul-tellfriend2 li {
		margin: 0 0 10px 0;
		height: 15px;
	}
	
.addfriend {
	background: url(../images/design/13.png) no-repeat center left;
	font-size: 1.2em;
	padding: 5px 0 5px 25px;
	float: left;
}

#friend-form input.bg {
	float: right;
	border: 1px solid #dda93e;
	background-color: #ffe7be;
	font-family: Arial;
	font-size: 1.2em;
	color: #264367;
	cursor: pointer;
	outline: none;
	margin: 0 0 5px 0;
}

#friend-form input.bg:hover {
	background-color: #ffb215;
}

#postit-success-div2 {
	font-size: 0.9em;
	line-height: 1.3em;
}

#postit-success-div2 a {
	color: #264367;
}

#content ul {
	color: #797979;
	font-size: 1.3em;
	line-height: 1.4em;
	list-style: disc;
	padding: 0 0 0 15px;
}

#content li {
	margin: 0 0 15px 0;
}