/* 
Menubalk geel: f99b1c = CMYK: 0, 46, 100, 0 (#FF8A00)
(menu tekst: opacity 80%, afbeelding: opacity 33%)
Donker geel tekst: 7d491b = CMYK: 0, 50, 80, 60  (#663314)
*/
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,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;outline:0;background:transparent;vertical-align:baseline;margin:0;padding:0}html{overflow-y:auto}img{display:inline-block}
h1,h2,h3,h4,h5,h6,strong,b,dt,th{font-weight:700}
ul, ol {list-style-type:none;list-style-position:outside;}
.content ul, .content ol {margin:0 0 0 20px;}
.content ul {list-style-type:disc;}
.content ol {list-style-type:decimal;}
.content p {margin: 10px 0}

/* default styles */
html {font-size: 0.95em; line-height:1.3}
* {color: #000;font-family:Arial,sans-serif;font-size: 1.0em}

/* debug */
#debug {position: absolute; z-index: 10; top:0; right:0; background-color:white; margin: 10px 10px 0 0; padding: 5px; border:3px dotted red; opacity:0.8}

/* header / background */
.header {position:relative;height:180px;background:url('/img/bg_header.jpg') no-repeat 50% 0%;}
.bgHeaderFilter {width:100%;height:100%;background-color:#fc9;opacity:0.5;}
.bgMenu {position:absolute;bottom:0;left:0;background-color:#FF8A00;height:30px;width:100%;opacity:0.8}
.bgLogo {position:relative;width:400px;height:368px;right:400px;top:180px;margin:0 auto;background:url('/img/bg_logo.png') no-repeat;opacity:0.15}

.bgHeaderLogo {height:150px;background:no-repeat 50% 0%;}
.bgHeaderLogo img {position:absolute;top:20px;right:20px}

/*container styles*/
.container {position:relative;top:-180px;width:900px;min-width:150px;margin:0 auto}
.container h1 {margin-bottom:10px}

/*menu*/
.menu {height:30px;line-height:30px;text-align:justify;padding:0px; margin-bottom: 100px; text-transform: lowercase}
.menu li {display:inline; line-height:30px; position:relative}
.menu a {display:inline-block;text-decoration:none}
.menu li.active > a, .menu li.open, .menu a:hover {color:#663314}

/*submenu*/
.menu ul {display:none;position:absolute;background-color:#fff;top:23px;left:0;width:200px}
.menu ul a {display:block;}
/*.menu .active > ul, */
.menu .open > ul {display:block}
.menu ul li {display:block;height:24px;line-height:24px;}

/* subsubmenu */
.menu ul li > ul { position:absolute;left:100px; top:-20px;}

/*contentwrapper */
.wrapper { overflow:hidden;}

/*content*/
.content, .gallery {padding:0px;overflow:hidden;}
.content {float:left; width:52%; text-align:justify;}
.only .content { width:900px;}
.profiel .content { width:75%;float:right}
.projecten .content { width:39%;float:right}
.projecten6 .content { width:68%;float:right}
.quality .content { width:82%}
.project .content { width:39%;}
.form .content {width: 45%; float:right}

.switch .content {float:right}
.switch.profiel .content {float:left}
.switch.projecten .content {float:left;}
.switch.projecten6 .content { float:left}
.switch.form .content {float:left}

/*gallery*/
.gallery img {width:180px;margin: 0 8px 15px;float:inherit}
.gallery { width:45%; float: right; margin-top:33px}
.gallery img.first {clear:left;}
.profiel .gallery { float:left; width:22%}
.profiel .gallery img {width:180px;}
.projecten .gallery { float:left;width:58%}
.projecten .gallery img {width:120px;margin: 0 5px 10px}
.projecten6 .gallery { float:left;width:29%}
.projecten6 .gallery img {width:120px;margin: 0 5px 10px}
.project .gallery { width:58%}
.project .gallery img {width:90px;margin:0 5px 9px;float:right; clear:right;cursor:pointer}
.project .gallery img.big {float:left; clear:none; width:400px; margin:0;cursor:default}
.quality .gallery { float:right;width:15%}
.quality .gallery img {width:120px;margin: 0 5px 10px}
.form .gallery {float:left; width:50%;}

.switch .gallery {float:left}
.switch.profiel .gallery {float:right}
.switch.projecten .gallery {float:right;}
.switch.projecten .gallery img.first {clear:right;}
.switch.projecten6 .gallery { float:right;width:29%}
.switch.projecten6 .gallery img {width:120px;margin: 0 5px 10px}
.switch.form {float:right;}

a.back { color: #666; text-decoration:none; position: absolute; bottom:5px;left:0px}
a:hover.back {color:#000;}

/*project*/
dl {text-align: left}
dt { font-weight:normal; font-style:italic;}
dd { margin-bottom:10px;}

/* forms */
.zend_form textarea {width: 400px; height: 200px}
.zend_form dt { display:block; width: 150px; float:left; clear:left}
.zend_form dd {overflow:hidden;clear:right;}
.errors li { color: red; }
.success { color: #080; border: 3px double #080; padding: 5px; }

.gallery textarea { width: 280px;}