@charset "utf-8";

/*	PROJECTNAAM STYLES
	Author:	Name, Netvlies
	----------------------------------------------------*/

/*	Table of contents
	=RESETS
	=FIXES
	=BOX MODEL
	=HOMEPAGE
	=TEMPLATE 1
 	----------------------------------------------------*/

/*	=RESETS
	----------------------------------------------------*/
	* { margin: 0; padding: 0; outline: 0; }
	img { border: 0; }
	body { background: #fff url(../img/backgrounds/background_home.jpg) fixed center top; text-align: center; font-size: 12px; font-family: Arial, Helvetica, sans-serif; }
	body.agenda { background: url(../img/backgrounds/background_1.jpg) fixed center top; }
	
/*	=FIXES
	----------------------------------------------------*/
	.clr { overflow: hidden; height: 100%; }
	
	
/*	=BOX MODEL
	----------------------------------------------------*/
	#page-box { position: relative; width: 870px; ; background: #fff; margin: 0 auto; text-align: left;  }
	#page-box.home { background: none; }
	#header { position: relative; width: 870px; height: 117px; background: #fff; }
	#logo { margin-left: 20px; }
	#people { position: absolute; top: 17px; right: 20px; color: #33ff33; }
	#people a { color: #009900; text-decoration: none; }
	#address { position: absolute; top: 39px; right: 20px; color: #009900; }
	#address span { color: #33ff33; }
		
	#col-a, #col-b, #col-c, #col-d, #col-e, #col-f{ float: left; } 
	#col-a { width: 130px; padding: 25px 40px 7px 20px;  }
	#col-b, #col-c, #col-e{ padding: 25px 20px 37px 20px; }
	#col-b { width: 430px; }
	#col-b h1 { font-size: 18px; color: #009900; }
	#col-c { width: 170px;  }
	#col-d { width: 700px; padding: 25px 20px 7px 0; overflow: hidden; }
	#col-d-innerbox { background: url(../img/col-f_bg.gif); margin-bottom: 20px;  }
	#col-e { width: 110px; }

/*	=NAV MAIN
	----------------------------------------------------*/
	#nav-main { padding: 9px 0 0 20px; height: 44px; list-style: none; background: #fff url(../img/nav-main_bg.gif) no-repeat left bottom; }
	#nav-main.home { background: #fff url(../img/nav-main_home_bg.gif) no-repeat left bottom; }
	#nav-main li { display: block; float: left; padding: 0 0 0 7px; background: url(../img/nav-main_divider.gif) no-repeat left; }
	#nav-main li.first { padding: 0; background: none; }
	#nav-main li a { display: block; float: left; overflow: hidden; height: 15px; }
	#nav-main li.sel a img { margin-top: -15px; }

/*	=NAV SUB
	----------------------------------------------------*/
	#nav-sub  { list-style: none; }
	#nav-sub li, #nav-sub li a { font-size: 13px; line-height: 20px; color: #006600; text-decoration: none; }
	#nav-sub li.sel, #nav-sub li.sel a { color: #00cc00; text-decoration: none; }
	#nav-sub li a:hover { text-decoration: underline; }
	
/*	=CONTENT BOX
	----------------------------------------------------*/
	#content-box { background: #fff; }
	#content-box h1 { margin-bottom: 20px; }

/*	=HOMEPAGE
	----------------------------------------------------*/	
	#home-col-a, #home-col-b, #home-col-c { float: left; padding: 0 20px;  background: #fff; }
	#home-col-a { width: 310px; overflow: hidden; }
	#home-col-b { position: relative; width: 310px; left: -20px; }
	#home-col-c { position: absolute; width: 170px; right: 0px;  }

	.project-item { line-height: 18px; padding: 20px 0; background: url(../img/stripes_bg.gif) repeat-x top; }
	.project-item.first { padding: 0 0 20px 0; background: none; }
	.project-item h2, .project-item h2 a { font-size: 18px; line-height: 22px; color: #009900; margin-top: 15px; }
	.project-item h2 a { text-decoration: none; }
	.project-item a { color: #00ff00 }
	
	.agenda-item { line-height: 18px; padding: 20px 0; border-top: 10px solid #00ff00; }
	.agenda-item.first { padding: 0 0 20px 0; border: none; }
	.agenda-item h2 { font-size: 12px; color: #009900; }
	.agenda-item h3 { font-size: 12px; color: #00cc00; }
	.agenda-item a { color: #00ff00 }
	
/*	=TEMPLATE 
	----------------------------------------------------*/	
	.case-vsl { margin-top: 20px; }
	.case-vsl.first { margin: 0; }
	
	.overview { display: block; float: left; margin: 0 0 20px 20px; }
	.overview.first  { margin: 0 0 20px 0; padding: 0; clear: left; }
	
	#work-detail-vsl { position: relative; float: left; display: inline; width: 470px; margin-left: 40px; }
	#work-detail-vsl img.vsl { margin: 20px 20px 0 20px; }
	#work-detail-vsl img.vsl.first { margin-top: 0; }
	#work-detail-vsl .nav-prev { position: absolute; top: 0px; left: 0px; }
	#work-detail-vsl .nav-next { position: absolute; top: 0px; right: 0px; }
	
	#work-detail-info { background: #fff; float: left; width: 170px; margin-left: 20px; }
	#work-detail-info h1 { line-height: 18px; margin-top: 2px; font-size: 12px; color: #006600; }
	#work-detail-info h2 { font-size: 12px; color: #33cc00; }
	#work-detail-info h3 { font-size: 12px; color: #000000; }
	#work-detail-info .user-content h1 { margin:0 !important; font-size: 12px; color: #006600; }
	
	#col-b.agenda h1 { font-size: 24px; color: #000; }
	#col-b.agenda h2 { font-size: 12px; color: #000; line-height: 18px; font-weight: normal; }
	#agenda-recent h2 { color: #00cc00; font-size: 14px; }
	#agenda-recent ul { list-style: none; margin-top: 18px; }
	#agenda-recent ul li { line-height: 18px; margin-bottom: 18px; }
	#agenda-recent ul li a { font-size: 12px; color: #000; text-decoration: none; }
	#agenda-recent ul li a strong { color: #00cc00; }
	
	#agenda-archive h2 { color: #00cc00; font-size: 14px; }
	#agenda-archive h3 { margin-top: 18px; color: #000; font-size: 12px; }
	#agenda-archive h3 a { text-decoration: none; color: #000; } 
	#agenda-archive ul { list-style: none; line-height: 18px; }
	#agenda-archive ul li a { font-size: 12px; line-height: 18px; color: #000; text-decoration: none; }
	#agenda-archive ul li a span { color: #009900; }
	
	#route .user-content { line-height: 18px; }
	#route .user-content h2 { font-size: 12px; line-height: 18px; color: #009900; margin: 20px 0 0 0; }
	
	#frm-contact { width: 370px; }
	#frm-contact fieldset { border: none; }
	#frm-contact #iwant label.iwant {padding: 3px 0; display: block; float: left; width: 72px; }
	#frm-contact #iwant ul { float: left; width: 292px; }
	#frm-contact #iwant ul li { padding: 4px 0; line-height: 15px; }
	#frm-contact #iwant ul label { width: 250px; margin-left: 18px; }
	#frm-contact #iwant input.radio { float: left; height: 15px; }
	
	#frm-contact ul { list-style: none; }
	#frm-contact ul li { padding: 4px 0; overflow: hidden; height: 100%; }
	#frm-contact ul li label { display: block; float: left; width: 75px; }
	#frm-contact input.text { float: right; border: 1px solid #ccc; width: 292px; }
	#frm-contact textarea { float: right; border: 1px solid #ccc; width: 292px; height: 100px; }
	
	#frm-contact input.submit { float: right; border: none; background: #00ff00; color: #000; }
	
	#contact-adress {  font-size: 12px; line-height: 18px; }
	#contact-adress h1 { font-size: 12px; line-height: 18px; color: #009900; margin: 0; }

/*	=FOOTER
	----------------------------------------------------*/
	#footer { font-size: 0; position: absolute; bottom: 0px; background: #fff; height: 13px; clear:both; }
	#footer img { margin-left: 271px; padding: 0; border: 0; outline: none; }