
/* ################################################################################# */
/*                                                                                   */
/*                                     BODY                                          */
/*                                                                                   */
/* ################################################################################# */

* {
	margin: 			0;
	padding: 			0;
}

html, body {
	height: 			100%;
}

html {
	font-size: 			100%;
	overflow-y:			scroll;	/* laat altijd de linker scrollbalk zien in FireFox */
}

body {
	background:			url(../images/pattern_grijs.jpg);
	color: 				#000000;
	font-family:		Georgia;
	font-size: 			62.5%; /* standaard font grootte is nu 10px, dus 1.2em = 12px */
	line-height: 		140%;
	text-align: 		center; 
	
}

/* ################################################################################# */
/*                                                                                   */
/*                                  CONTAINER                                        */
/*                                                                                   */
/* ################################################################################# */

#container {
	min-height: 		100%;
	height: 			auto !important;
	height: 			100%;
	margin: 			0 auto -60px; /* the bottom margin is the negative value of the footer's height */
}

html>body #container {
	height: 			auto;
}
			
#wrapper {
	margin:				0 auto;
	text-align: 		left; 
	width: 				900px;
}

#footer, #footerclearer {
	height:				60px;
	margin:				0 auto;
	width:				900px;
}

#footer {
	background:			url(../images/bg_footer.gif) top left repeat-x;
	color:				#0099FF;
	text-align:			right;
}

/* ################################################################################# */
/*                                                                                   */
/*                               DEFAULT  TAGS                                       */
/*                                                                                   */
/* ################################################################################# */

h1 {
	font-size:			1.7em;
	font-style:			italic;
	margin:				9px 0 6px 0;
}

h2 {
	color:				#FFFFFF;
	font-size:			1.4em;
	font-style:			italic;
	margin:				1.25em 0 0.25em 0;
}

h3 {
	color:				#0099FF;
	font-size:			1.2em;
	line-height:		1.2em;
	margin:				1em 0 1em 0;
}

p {
	font-size:			1.2em;
	line-height:		1.5em;
	margin:				0 0 1em 0;
}

img {
	border: 			0;
}

a {
	color:				#0099FF;
	text-decoration:	underline;
}

a:hover {
	background:			#EC0B8D;
	color:				#FFFFFF;
	text-decoration:	underline;
}

ul {
	list-style: 		none;
	margin: 			0;
	padding: 			0;
}

ol {
	margin: 			0 0 0 20px;
	padding: 			0;
}

li {
	font-size:			1.2em;
	padding-bottom:		5px;
}

ol li p {
	margin:				-1em 0 1em 0;
}

table, th, td {
	font-size:			1.2em;
	padding:			3px;
}

input, select, textarea {
	background:			#E6E6E6;
	border:				1px solid #CCCCCC;
	font-family:		Georgia;
	font-size:			1em;
	padding:			2px;
	width:				200px;
}

.wit {
	color:				#FFFFFF;
}


/* ################################################################################# */
/*                                                                                   */
/*                                   	BOXEN		                                 */
/*                                                                                   */
/* ################################################################################# */
 
/* BOX: VIDEO */
#video {
	padding:			0 20px 0 20px;
}

#video h1 {
	color:				#0099FF;	
	padding:			0 0 10px 0;
}

/* BOX: CONTAINER */
#boxen {
	margin:				-20px 20px 40px 20px;
}

#inzetten {
	margin:				0 20px;
}

.over, .werk, .diensten, .downloads {
	margin-top:			30px;
	height:				149px;
	width:				170px;
}

.over, .diensten {
	float:				left;
}

.werk, .downloads {
	float:				right;
}
.over h2, .werk h2, .diensten h2, .downloads h2, .inzet_mid  h2,
.over p, .werk p, .diensten p, .downloads p, .inzet_mid  p,
.over ul, .werk ul, .diensten ul, .downloads ul, .inzet_mid  ul  {
	margin-left:		15px;
	margin-right:		15px;
}

/* BOX: WIJ & WERK */
.overover, .overwerk {
	height:				25px;
	margin-top:			-30px;
	padding-top:		5px;
	position:			relative;
	z-index:			10;
}

.boxtop {
	height:				15px;
	margin-bottom:		-15px;
	position:			relative;
	z-index:			10;
}

.boxtop  a:hover {
	background:			none;
}

.overover a, .overwerk a {
	color:				#000000;
	font-style:			italic;
	text-decoration:	none;
}

.overover a:hover, .overwerk a:hover {
	background:			none;
	color:				#000000;
	text-decoration:	none;
}

.pics {
	height:  			149px;  
    width:   			170px;  
    padding: 	  		0;  
    margin:  			0;
}

/* BOX: DIENSTEN & DOWNLOADS */
.diensten a, .downloads a {
	color:				#000000;
	text-decoration:	none 
}

.diensten a:hover, .downloads a:hover {
	background:			#FFFFFF;
	color:				#EC0B8D;
	text-decoration:	none 
}

/* BOX: INZET */

.inzet {
	width:				170px;
}

.inzet_top {
	background: 		url(../images/bg_inzet_top.gif) left top no-repeat;
	height:				30px;
	margin:				20px 0 0 0;
}

.inzet_mid {
	background: 		url(../images/bg_inzet_mid.gif) left top repeat-y;
	margin:				-20px 0 -15px 0;
	min-height: 		150px;
	height: 			auto !important;
	height: 			150px;
}

.inzet_bot {
	 background: 		url(../images/bg_inzet_bottom.gif) left top no-repeat;
	 height:			15px;
}


.inzet_mid h2 {
	color:				#EC0B8D;
}


/* BOX: ACHTERGROND*/
.overover {
	background:			url(../images/bg_overover.jpg) top left no-repeat;
}

.overwerk {
	background:			url(../images/bg_overwerk.jpg) top left no-repeat;
}

.diensten {
	background:			url(../images/bg_diensten.gif) top left no-repeat;
}

.downloads {
	background:			url(../images/bg_downloads.gif) top left no-repeat;
}

/* ################################################################################# */
/*                                                                                   */
/*                                   HEADER			                                 */
/*                                                                                   */
/* ################################################################################# */

#header {
	background:			url(../images/bg_header.jpg) bottom left no-repeat;
	height:				130px;
}

#logo {
	float:				left;
	padding-top:		20px;
	padding-left:		90px;
}

/* ################################################################################# */
/*                                                                                   */
/*                                   TAGCLOUD		                                 */
/*                                                                                   */
/* ################################################################################# */

#tagCloud {
	color:				#FFFFFF;
	float:				right;
	font-style:			italic;
	line-height:		2em;
	padding:			5px 10px 5px 10px;
	text-align:			center;
	width:				450px;
	word-spacing:		10px;
}

#tagCloud a {
	color:				#FFFFFF;
	text-decoration:	none;
}

#tagCloud a:hover {
	background:			#FFFFFF;
	color:				#EC0B8D;
	text-decoration:	none;
}

.tag0 {
	font-size:			1.2em;
}

.tag1 {
	font-size:			1.3em;
}

.tag2 {
	font-size:			1.5em;
}

.tag3 {
	font-size:			1.7em;
}

.tag4 {
	font-size:			1.9em;
}

.tag5 {
	font-size:			2.1em;
}

/* ################################################################################# */
/*                                                                                   */
/*                                   ZOEKBALK		                                 */
/*                                                                                   */
/* ################################################################################# */

#breadcrumb {
	float:				left;
	margin:				-35px 0 0 0;
	padding:			8px 0 0 20px;
}

/* ################################################################################# */
/*                                                                                   */
/*                                   ZOEKBALK		                                 */
/*                                                                                   */
/* ################################################################################# */


#zoekbalk {
	background:			url(../images/bg_zoekbalk.gif) 640px top no-repeat;
	height:				35px;
	text-align:			right;
	width:				900px;
}

.zoeken, .zoekveld, .zoekbutton {
	float:				right;
	margin-right:		4px;
	margin-top:			7px;
}

.zoeken p {
	font-size:			1.4em;
}

#zoekbalk input {
	width:				150px;
}

#zoekbalk input.submit {
	height:				18px;
	padding:			0;
	width:				20px;
}

/* ################################################################################# */
/*                                                                                   */
/*                                 BODYCONTENT		                                 */
/*                                                                                   */
/* ################################################################################# */

#content {
	background:			url(../images/bg_content.gif) top center repeat-y;
	clear:				both;
}

#content-top, #content-bottom {
	background-color:	#FFFFFF;
	height:				20px;
}

#content-middle {
	background:			url(../images/bg_content.gif);
	clear:				both;
}

#col-left {
	background:			url(../images/bg_over_werk.jpg) 20px 10px no-repeat;
	float:				left;
	width:				420px;
}

#col-right {
	float:				left;
	width:				480px;
}


#contentbox {
	padding:			10px 20px;
}

#contentbox img {
	margin:				0 20px 20px 20px;
}

#contentbox li {
	background:			url(../images/bullit_roze.jpg) 15px 3px no-repeat;
	padding-left:		27px;
}

#contentbox ol li {
	background:			none;
}

#contentbox li.submenu {
	background:			url(../images/bullit_blauw.jpg) 30px 3px no-repeat;
	padding-left:		42px;
}

#contentbox .imglijst img {
	margin:				0 20px 5px 0;
}

#contentbox .imglijst .frame_small {
	margin:				-75px 0 0 0;
	z-index:			10;
}

#contentbox .imglijst .frame_small a:hover {
	background:			none;
}

.sitemap {
	margin:				0 0 20px 0;
}

/* ################################################################################# */
/*                                                                                   */
/*                                   	BLOG		                                 */
/*                                                                                   */
/* ################################################################################# */

/* header/logo blog-pagina */
.box-quibblog {
	clear:				both;
	height:				35px;
	margin:				0 0 30px 0;
	padding:			0 20px;
}

.box-quibblog-links {
	float:				left;
	margin:				-10px 0 0 -40px;
	width:				155px;
}

.box-quibblog-rechts {
	float:				right;
	margin:				-10px -40px 0 0;
	padding:			5px 0 0 0;
}

.box-quibblog-rechts a:hover {
	background:			none;
}

#contentbox .bookmarks img {
	margin:				0 5px 0 0;
}

#contentbox .bookmarks a:hover {
	background:			none;
}

.box-header {
	clear:				both;
	height:				60px;
	margin:				0 0 30px 0;
}

.box-header h1 {
	border-bottom:		1px dotted #0099FF;
	margin:				2px 0;
	padding:			0 0 8px 0;
	text-align:			left;
	width:				390px;
}


.box-blog-links-datum {
	background:			#FFFFFF url(../images/bg_datum.jpg) top left no-repeat;
	float:				left;
	height:				55px;
	text-align:			left;
	width:				50px;
}

.box-blog-rechts-datum {
	background:			#FFFFFF url(../images/bg_datum_rechts.jpg) top right no-repeat;
	float:				right;
	height:				55px;
	text-align:			right;
	width:				50px;
}

.box-blog-links-datum-maand, .box-blog-links-datum-dag {
	color:				#FFFFFF;
	text-align:			center;
	width:				40px;
}

.box-blog-rechts-datum-maand, .box-blog-rechts-datum-dag {
	color:				#FFFFFF;
	text-align:			center;
	padding-left:		9px;
	width:				40px;
}

.box-blog-links-datum-maand, .box-blog-rechts-datum-maand {
	font-size:			1.1em;
	padding-top:		2px;	
	height:				11px;
}


.box-blog-rechts-datum-dag, .box-blog-links-datum-dag {
	font-size:			1.6em;
	font-weight:		bold;
	padding-top:		2px;
	padding-bottom:		5px;
}


.box-blog-links-titel {
	float:				left;
	text-align:			left;
}

.box-blog-rechts-titel {
	float:				left;
	text-align:			right;
}

.box-blog-links-titel p {
	color:				#999999;
	float:				left;
	font-size:			1.1em;
	text-align:			left;
}

.box-blog-rechts-titel p {
	color:				#999999;
	float:				left;
	font-size:			1.1em;
	text-align:			right;
}

.blog-links-artikel, .blog-rechts-artikel {
	margin:				-20px 0 0 0;
}

#contentbox .blog-links-foto img {
	float:				left;
	margin:				0 20px 20px 0;
}

#contentbox .blog-rechts-foto img {
	float:				right;
	margin:				0 0 20px 20px;
}

.blog-links-artikel .bookmarksbalk {
	 background: 		url(../images/bg_bookmarks.gif) left top no-repeat;
	 clear:				both;
	 padding:			20px;
}

.blog-rechts-artikel .bookmarksbalk_r {
	 background: 		url(../images/bg_bookmarks_r.gif) left top no-repeat;
	 clear:				both;
	 padding:			20px;
}

.reactie_top {
	 background: 		url(../images/reactie_top.gif) left 5px no-repeat;
	 padding:			0 0 0 45px;
	 height:			30px;
}

.reactie_mid {
	 background: 		url(../images/reactie_mid.gif) left top repeat-y;
	 padding:			0 0 0 20px;
}

.reactie_bot {
	 background: 		url(../images/reactie_bottom.gif) left top no-repeat;
	 height:			15px;
	 margin:			-20px 0 30px 0;
}

.archief_top {
	 background: 		url(../images/bg_boxblog_top.gif) left top no-repeat;
	 height:			30px;
	 margin:			20px 0 -20px 0;
}

.archief_mid {
	 background: 		url(../images/bg_boxblog_mid.gif) left top repeat-y;
	 padding:			0 20px;
}

.archief_mid h2 {
	color:				#EC0B8D;
}

.archief_bot {
	 background: 		url(../images/bg_boxblog_bottom.gif) left top no-repeat;
	 height:			15px;
}




/*formulieren*/
.verzendbutton {
	background:			none;
	border:				0;
	float:				left;
	height:				46px;
	padding:			15px 0 0 0;
	width:				134px;
}

/* ################################################################################# */
/*                                                                                   */
/*                                   FOOTER  		                                 */
/*                                                                                   */
/* ################################################################################# */

#footer .logolinks  {
	float:				left;
	margin:				28px 0 0 10px;
}

#footer .footerlinks a {
	border-left:		1px solid #0099FF;
	color:				#EC0B8D;
	padding:			0 10px;
	text-decoration:	none;
}

#footer .footerlinks a:hover {
	background:			#0099FF;
	color:				#FFFFFF;
	text-decoration:	none;
}

#footer ul {
 	list-style: 		none;
	padding:			35px 0 0 0;
}

#footer ul li {
	display:			inline;
	color:				#FFFFFF;
	line-height:		1em;
}

#footer ul li.first a {
	border-left:		none;
}

#footer ul li.active a {
	color:				#0099FF;
	text-decoration:	none;
}



