/* reset browser styles: Copyright (c) 2006, Yahoo! Inc. All rights reserved. Code licensed under the BSD License: http://developer.yahoo.net/yui/license.txt version: 0.10.0 */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td { margin: 0; padding: 0; }
table { border-collapse:collapse; border-spacing:0; }
fieldset, img { border:0; }
address,caption,cite,code,dfn,th,var { font-style:normal; font-weight:normal; }
ol,ul { list-style:none; }
caption,th { text-align:left; }
h1,h2,h3,h4,h5,h6 { font-size:100%; }
q:before,q:after { content:''; }

/* algemeen html */
body { background: #fff url("/images/bg.header.gif") repeat-x 0 90px; font: 13px Arial; }
#stickyfooterwrap { width: 975px; margin: 0 auto; }

	@media screen and (min-width: 1400px) {
		body { font-size: 15px; }
		#stickyfooterwrap { width: 1350px; }
	}
	@media screen and (max-width: 1010px) {
		#stickyfooterwrap { width: 90%; margin: 0 5%; }
	}

/* header */
#header { overflow: hidden; margin-bottom: 30px; }

a#logo { float: left; display: block; width: 350px; height: 72px; margin: 8px 0 0 8px; }

div#contactdetails { float: right; width: 300px; height: 72px; margin-top: 18px; text-align: right; color: #555; font-size: 15px; line-height: 22px; }
div#contactdetails a { color: #555; text-decoration: none; }

	@media screen and (max-width: 800px) {
		span.openingsHours { display: none; }
	}

	@media screen and (max-width: 750px) {
		div#contactdetails { font-size: 15px; width: 190px; }
	}
	@media screen and (max-width: 650px) {
		div#contactdetails { height: 35px; }
	}

	@media screen and (max-width: 650px) {
		div#contactdetails { text-align: left; width: 100%; margin-top: 50px; }
		div#contactdetails br { display: none; }
		div#contactdetails a { float: right; }
	}

a#hamburger { display: none; }
ol#compactNavigation { display: none; }
	@media screen and (max-width: 650px) {
		a#hamburger { display: block; position: absolute; top: 25px; right: 25px; width: 26px; height: 26px; z-index: 2; background: #94d555 url("/images/img.hamburger.png") no-repeat center center; text-indent: -9000px; outline: none; }

		ol#compactNavigation { display: none; position: absolute; top: 50px; right: 25px; width: 300px; z-index: 2; background: #94d555; border-bottom: 2px solid #72b82e; }
		ol#compactNavigation li { margin-bottom: 3px; margin-left: 8px; }
		ol#compactNavigation li li { margin-left: 30px; }
		ol#compactNavigation li:last-of-type { margin-bottom: 0; }
		ol#compactNavigation a { display: block; padding: 8px 10px; color: #fff; text-decoration: none; font-weight: bold; }
		ol#compactNavigation a:hover { background: #72b82e; }
	}

/* navigatie in de header */
div#centerednavigation { float: left; width: 100%; overflow: hidden; position: relative; margin-top: 15px; }
ol#navigation { float: left; clear: left; position: relative; left: 50%; text-align: center; }
ol#navigation li { display: block; float: left; padding: 0 8px; position: relative; right: 50%; background: transparent url("/images/bg.navigation.border.gif") no-repeat left 7px; }
ol#navigation li.first { padding-left: 0; background-image: none; }

	@media screen and (max-width: 650px) {
		div#centerednavigation { display: none; }
	}

ol#navigation li a { color: #555; font-weight: bold; text-decoration: none; text-transform: lowercase; }
ol#navigation li a:hover { text-decoration: underline; }
ol#navigation li a.active { text-decoration: underline; }
ol#navigation li.focus a { color: #94d555/*9ccd68*/; }

/* navigatie links */
div#services { float: left; width: 204px; margin: 0 8px; }
div#services ol li { display: block; width: 100%; margin-bottom: 21px; }
div#services ol li.active { background: transparent url("/images/bg.dienstenbrigade.png") no-repeat 0 -387px; }

div#services ol li a { display: block; font-size: 15px; color: #555; text-decoration: none; padding-left: 12px; letter-spacing: 2px; height: 26px; line-height: 26px; background: transparent url("/images/bg.dienstenbrigade.png") no-repeat 0 -333px; }
div#services ol li a:hover { background: transparent url("/images/bg.dienstenbrigade.png") no-repeat 0 -360px; }
div#services ol li.active a { background-image: none; }
div#services ol li.active a:hover { background-image: none; }

div#services ol li ol { margin: 10px 0 -8px 0; }
div#services ol li ol li { background-image: none; margin: 2px 0; border-bottom: 1px dotted #555; }
div#services ol li ol li.last { border-bottom: 0; }

div#services ol li.active ol li a { color: #000; font-size: 13px; letter-spacing: 1px; text-transform: lowercase; background-image: none; }
div#services ol li.active ol li a:hover { background-image: none; }

div#services ol li.active ol li ol { margin: 10px 0 0 25px; padding-left: 0; }
div#services ol li.active ol li ol li { border-bottom: 0; border-top: 1px dotted #555; }

div#services img { margin-top: 12px; }

	@media screen and (max-width: 650px) {
		div#services { display: none; }
	}

div#socials { margin: 25px 15px; }
div#socials a { margin: 0 15px; }

/* content */
#main { line-height: 135%; text-align: justify; margin: 0 260px; overflow: hidden; }

	@media screen and (max-width: 1010px) {
		#main { margin-right: 0; }
	}
	@media screen and (max-width: 650px) {
		#main { margin-left: 0; }
	}

/* secondary */
#secondary { float: right; margin-left: 26px; border-left: 1px dotted #555; padding-left: 10px; width: 178px; }

	@media screen and (max-width: 1010px) {
		#secondary { clear: both; border-left: 0; float: left; width: 100%; overflow: hidden; padding-left: 0; margin-left: 0; width: 204px; }
	}
	@media screen and (max-width: 650px) {
		#secondary { display: none; }
	}

a#newClient, a#newColleague, a#forColleagues { display: block; width: 110px; font-size: 13px; font-weight: bold; color: #555; text-decoration: none; padding: 13px 8px 0 60px; text-align: center; letter-spacing: 1px; line-height: 125%; margin-bottom: 30px; }
a#newClient { height: 47px; background: transparent url("/images/bg.dienstenbrigade.png") no-repeat 0 top; }
a#newClient:hover { background-position: 0 -62px; }
a#newColleague { padding-top: 11px; height: 49px; background: transparent url("/images/bg.dienstenbrigade.png") no-repeat 0 -124px; }
a#newColleague:hover { background-position: 0 -184px; }
a#forColleagues { padding-left: 45px; width: 125px; height: 31px; margin-bottom: 0; background: transparent url("/images/bg.dienstenbrigade.png") no-repeat 0 -244px; }
a#forColleagues:hover { background-position: 0 -288px; }

#secondary address { display: block; width: 100%; text-align: center; letter-spacing: 1px; line-height: 125%; margin-bottom: 30px; }
#secondary address a { color: #000; text-decoration: none; }

	@media screen and (max-width: 1010px) {
		#secondary > * { margin-top: 25px; }
	}

/* sticky footer */
html, body { height: 100%; }
div#stickyfooterwrap { min-height: 100%; }
div#nogeenstickyfooterwrap { overflow: auto; padding-bottom: 160px; }
body:before { content:""; height:100%; float:left; width:0; margin-top:-32767px;} /* om de footer te laten sticken in Opera, zie http://www.cssstickyfooter.com */

div#footer { position: relative; margin-top: -160px; height: 160px; clear: both; background: transparent url("/images/bg.footer.png") repeat-x center 7px; }
div#footer > a { position: absolute; top: 105px; left: 50%; margin-left: -490px; width: 65px; height: 41px; text-indent: -9000px; background: transparent url("/images/img.aurealis.png") no-repeat; }
div#footersocials { margin: 25px 15px; padding: 115px 0 0 200px; display: none; }
div#footersocials a { margin: 0 15px; }

	@media screen and (max-width: 1010px) {
		div#footer a { left: 15px; margin-left: 0; }
	}
	@media screen and (max-width: 650px) {
		div#footersocials { display: block; }
	}
	@media screen and (max-width: 500px) {
		div#footersocials { padding-left: 0; }
		div#footer > a { display: none; }
	}

/* from mysite! */
#main h1 { font-size: 16px; color: #94d555/*a1cf67*/; font-weight: bold; margin: 5px 0 10px 0; letter-spacing: 1px; clear: both; }
#main h2 { font-size: 14px; font-weight: bold; margin: 5px 0; clear: both; width: 100%; }
#main h3 { font-weight: bold; margin: 5px 0; clear: both; width: 100%; }
#main address { display: block; width: 100%; font-style: italic; }
#main p { display: block; width: 100%; margin-bottom: 8px; clear: both; }
#main strong { font-weight: bold; }
#main em { font-style: italic; }
#main strike { text-decoration: line-through; }
#main u { text-decoration: underline; }
#main a { color: #09acef; text-decoration: underline; }
#main ul { /*list-style-image: url("/images/userstyles/li.gif");*/ list-style-type: disc; list-style-position: outside; margin-bottom: 5px; }
#main ul li { margin-left: 22px; }
#main ol { list-style-type: decimal; list-style-position: outside; margin-bottom: 5px; }
#main ol li { margin-left: 22px; }
#main blockquote { width: 100%; padding: 5px 40px; background: transparent url("/images/userstyles/blockquote.png") no-repeat left top; box-sizing: border-box; }
#main table { margin-bottom: 5px; clear: both; width: 100%; }
#main thead {  }
#main thead tr {  }
#main thead tr th { font-weight: bold; }
#main tbody {  }
#main tbody tr {  }
#main tbody tr th { font-weight: bold; }
#main tbody tr td {  }
#main table caption { font-style: italic; }

/* images */
ul#images { list-style: none; margin-top: 25px; overflow: hidden; }
ul#images li { margin: 0 8px 0 0; float: left; border: 1px solid #555; padding: 2px; }
ul#images a { display: block; overflow: hidden; width: 120px; height: 129px; text-decoration: none; line-height: 100%; }
ul#images img { display: block; width: 120px; height: 129px; }

ul#galleryImages { list-style: none; margin-top: 25px; width: 100%; clear: both; overflow: hidden; }
ul#galleryImages li { margin: 0 8px 0 0; float: left; border: 1px solid #555; padding: 2px; }
ul#galleryImages a { display: block; overflow: hidden; width: 120px; height: 129px; text-decoration: none; line-height: 100%; }
ul#galleryImages img { display: block; width: 120px; height: 129px; }

/* Form klasse */
form.niceform { margin: 15px 0 0 0; width: 100%; overflow: auto; }
form.niceform div.niceentry { margin-bottom: 16px; float: left; clear: both; width: 100%; }
form.niceform div.niceentry label { display: block; float: left; font-weight: normal; }
form.niceform div.niceentry input { display: block; width: 95%; float: left; clear: both; }
form.niceform div.niceentry textarea { display: block; width: 95%; float: left; clear: both; }
form.niceform div.niceentry select { display: block; width: 95%; float: left; clear: both; }
form.niceform div.niceentry span.pseudolabel { display: block; width: 95%; float: left; }
form.niceform div.niceentry span.niceinfo { display: none; float: left; width: 95%; padding-bottom: 5px; font-style: italic; color: #884f22; clear: both; }
form.niceform div.niceentry img { float: right; display: none; clear: right; }
form.niceform div.checkbox input { width: auto !important; clear: left; float: left; margin-bottom: 3px;}
form.niceform div.checkbox label { float: left; margin: 0 0 3px 5px; width: 90% !important; font-weight: normal; }
form.niceform div.nicebutton { margin: 10px 0; float: left; clear: both; }
form.niceform div.nicebutton button { }
form.niceform div.niceerror label { color: #ff0000; }
form.niceform div.niceerror input { color: #ff0000; }
form.niceform div.niceerror select { color: #ff0000; }
form.niceform div.niceerror span.niceerrormessage { display: block; clear: both; float: left; width: 90%; font-size: 100%; color: #ff0000; padding-left: 21px; background: transparent url("/images/icon.error.png") no-repeat; min-height: 16px; }
form.niceform div.niceerror span.niceinfo { color: #ff0000; }

form.niceform fieldset { padding: 15px; border: 1px dotted #000; width: 465px; }
form.niceform fieldset div.niceentry input { width: 450px; }
form.niceform fieldset div.niceentry textarea { width: 450px; }
form.niceform fieldset div.niceentry select { width: 450px; }
form.niceform fieldset div.niceentry span.pseudolabel { width: 450px; }
form.niceform fieldset div.niceentry span.niceinfo { width: 450px; }

form div { clear: both; }

	@media screen and (max-width: 550px) {
		form.niceform div.niceentry { width: 95%; }
		form.niceform div.niceentry input { width: 100%; }
		form.niceform div.niceentry textarea { width: 100%; }
		form.niceform div.niceentry select { width: 100%; }
		form.niceform div.niceentry span.pseudolabel { width: 100%; }
		form.niceform div.niceentry span.niceinfo { width: 100%; }
		form.niceform div.niceerror span.niceerrormessage { width: 90%; }
	}

/* contact */
div#contactform {  }
div#contactdata { margin: 25px 0 55px 0; }

p#confirmbot { color: #800; border: 1px solid #800; padding: 5px 5px 5px 40px; background: url('/images/icon.error.png') no-repeat 10px 9px; width: 80%; font-style: italic; }

/* flashMessage */
div#flashMessage { float: left; clear: both; width: 97%; margin-bottom: 15px; border: 1px solid #baba45; font-weight: bold; background: #fbfba9 url("/images/icon.tick.png") no-repeat 10px 10px; box-sizing: border-box; }
div#flashMessage span { display: block; margin: 10px 16px 10px 35px; }

/* proprietary extra's */
#main blockquote { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
div#flashMessage { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }

/* Aurealis Picture Viewer */
div#apv { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; opacity: 0.4; z-index: 8; }

div#apvHeader { display: none; position: fixed; left: 0; bottom: 4%; width: 100%; border: 2px solid #fff; border-left: 0px; border-right: 0px; height: 30px; background-color: #333; z-index: 10; }
	div#apvNavigation { position: absolute; top: 0; left: 50%; height: 100%; width: 300px; margin-left: -150px; overflow: hidden; }
	div#apvNavigation a { display: block; width: 30px; height: 20px; margin: 5px 10px; text-indent: -9000px; overflow: hidden; }
	div#apvNavigation a.inactive { opacity: 0.2; cursor: default; }
	div#apvNavigation span { display: block; float: left; width: 180px; margin: 0 10px; color: #fff; font-size: 15px; text-align: center; padding-top: 4px; }
	a#apvPrev {float: left; background: transparent url("/images/apv/navigation.png") no-repeat center -60px; }
	a#apvNext { float: right; background: transparent url("/images/apv/navigation.png") no-repeat center -30px; }
	div#apvClose { position: absolute; top: 0; right: 50px; width: 30px; height: 100%; }
	a#apvCloseLink { display: block; width: 30px; height: 30px; margin: 0; text-indent: -9000px; background: transparent url("/images/apv/navigation.png") no-repeat center 4px; }
div#apvImage { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; text-align: center; z-index: 9; }
	img#apvActiveImage { border: 9px solid #fff; margin-top: 1%; border-bottom: 35px solid #fff; background: #fff; }
	div#apvImage span { color: #000; margin-top: -30px; }

/* Aurealis Google Maps Viewer */
div.aurealisgooglemapsviewer { display: block; width: 98%; height: 250px; border: 1px solid #000; margin: 45px 0; }
div.aurealisgooglemapsviewer a { text-decoration: none !important; }

div#agv { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; opacity: 0.4; z-index: 8; }

div#agvHeader { display: none; position: fixed; left: 0; bottom: 4%; width: 100%; border: 2px solid #fff; border-left: 0px; border-right: 0px; height: 30px; background-color: #333; z-index: 10; }
	div#agvClose { position: absolute; top: 0; right: 50px; width: 30px; height: 100%; }
	a#agvCloseLink { display: block; width: 30px; height: 30px; margin: 0; text-indent: -9000px; background: transparent url("/images/apv/navigation.png") no-repeat center 4px; }
div#agvMaps { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9; }
	div#agvMap { border: 9px solid #fff; margin: 1% 75px; background: #fff; }