* { margin: 0; padding: 0; }
img { border: none; }
.clear { clear: both; }
a { outline: none; color: #005faf; text-decoration: none; }
a.underline { text-decoration: underline; }
a.underline:hover { text-decoration: none; }
body { font: 10px "Lucida Grande", Lucida, Verdana, sans-serif; color: #6e7073; line-height: 1.3em; }

#splash-canvas { width: 947px; height: 513px; margin: 0px auto; margin-top: 56px; background: url(../images/splash.jpg) no-repeat; position: relative; }
#splash-canvas a#fr, #splash-canvas a#nl, #splash-canvas a#en { display: block; width: 25px; height: 11px; top: 169px; text-indent: -5000px; position: absolute; }
#splash-canvas a#fr:hover { background-position: -1px -12px; }
#splash-canvas a#fr { left: 463px; background: url(../images/fr-splash.jpg) no-repeat; }
#splash-canvas a#nl:hover { background-position: 1px -11px; }
#splash-canvas a#nl { top: 168px; left: 500px; background: url(../images/nl-splash.jpg) no-repeat; }
#splash-canvas a#en:hover { background-position: 0 -12px; }
#splash-canvas a#en { top: 169px; left: 539px; background: url(../images/en-splash.jpg) no-repeat; }

#canvas { width: 956px; margin: 0px auto; }

/* @group flash */
#flash { padding: 7px; font-weight: bold; border: 1px solid #ccc; margin-top: 5px; }
#flash.good { border-color: #9c9; color: #060; background-color: #E2F9E3; }
#flash.bad { border-color: #c99; color: #fff; background-color: #cc0000 ; }
/* @end */

/* @group top */
#top { height: 56px; position: relative; }
#lgs { position: absolute; width: 61px; height: 6px; right: 13px; bottom: 9px; overflow: hidden; }
#lgs a { display: block; float: left; text-indent: -5000px; height: 6px; }
#lgs a:hover, #lgs a.selected { background-position: 0 0; }
a#fr { width: 21px; background: url(../images/fr.jpg) no-repeat 0 -6px; }
a#nl { width: 22px; background: url(../images/nl.jpg) no-repeat 0 -6px; }
a#en { width: 18px; background: url(../images/en.jpg) no-repeat 0 -6px; }
/* @end */

/* @group middle */
#middle { height: 350px; }
/* @group nav */
#nav { width: 155px; height: 100%; background-color: #cdced3; margin-right: 1px; float: left; }
#nav ul, ul.subnav { margin-top: 51px; list-style-type: none; float: right; }
#nav ul li { width: 134px; background-color: #005faf; margin-bottom: 3px; }
#nav ul li.jobs { margin-top: 66px; }
#nav ul li a { height: 23px; width: 134px; display: block; text-indent: -5000px; }
#nav ul li a.one-fr { background: url(../images/nav/01_fr.jpg) no-repeat 0 0; }
#nav ul li a.one-en { background: url(../images/nav/01_en.jpg) no-repeat 0 0; }
#nav ul li a.one-nl { background: url(../images/nav/01_nl.jpg) no-repeat 0 0; }
#nav ul li a.two-fr { background: url(../images/nav/02_fr.jpg) no-repeat 0 0; }
#nav ul li a.two-en { background: url(../images/nav/02_en.jpg) no-repeat 0 0; }
#nav ul li a.two-nl { background: url(../images/nav/02_nl.jpg) no-repeat 0 0; }
#nav ul li a.three-fr { background: url(../images/nav/03_fr.jpg) no-repeat 0 0; }
#nav ul li a.three-en { background: url(../images/nav/03_en.jpg) no-repeat 0 0; }
#nav ul li a.three-nl { background: url(../images/nav/03_nl.jpg) no-repeat 0 0; }
#nav ul li a.four-fr { background: url(../images/nav/04_fr.jpg) no-repeat 0 0; }
#nav ul li a.four-en { background: url(../images/nav/04_en.jpg) no-repeat 0 0; }
#nav ul li a.four-nl { background: url(../images/nav/04_nl.jpg) no-repeat 0 0; }
#nav ul li a.five-fr { background: url(../images/nav/05_fr.jpg) no-repeat 0 0; }
#nav ul li a.five-en { background: url(../images/nav/05_en.jpg) no-repeat 0 0; }
#nav ul li a.five-nl { background: url(../images/nav/05_nl.jpg) no-repeat 0 0; }
#nav ul li a.six-fr { background: url(../images/nav/06_fr.jpg) no-repeat 0 0; }
#nav ul li a.six-en { background: url(../images/nav/06_en.jpg) no-repeat 0 0; }
#nav ul li a.six-nl { background: url(../images/nav/06_nl.jpg) no-repeat 0 0; }
#nav ul li a.seven-fr { background: url(../images/nav/07_fr.jpg) no-repeat 0 0; }
#nav ul li a.seven-en { background: url(../images/nav/07_en.jpg) no-repeat 0 0; }
#nav ul li a.seven-nl { background: url(../images/nav/07_nl.jpg) no-repeat 0 0; }
#nav ul li a:hover, #nav ul li a.selected { background-position: 0 -23px; }
#nav ul li ul { float: none; margin-top: 0; background-color: #cdced3; border-top: 1px solid #d9dade; width: 100%; }
#nav ul li ul li { margin-bottom: 0; background-color: #cdced3; }

ul.subnav li a,
#nav ul li ul li a {
    display: block;
    height: 16px;
    line-height: 16px;
    text-indent: 6px;
    border-bottom: 1px solid #d9dade;
    text-decoration: none;
    color: #949594;
}

#nav ul li ul li.nl a {
    text-indent: 2px;
}

ul.subnav li a.selected,
ul.subnav li a:hover,
#nav ul li ul li a.selected,
#nav ul li ul li a:hover {
    background-color: #B4B3B3;
    color: #4D4E4C;
}

ul.subnav { border-top: 1px solid #d9dade; width: 92%; }
/* @end */

/* @group content */
#content { width: 790px; height: 100%; float: left; background: url(../images/bg-content.jpg) no-repeat; }
#text { margin-top: 51px; margin-left: 65px; width: 495px; text-align: justify; }

.approval-text { float: left; }
#approval-scroll { float: left; overflow: auto; height: 100%; width: 610px; }

#login-zone { float: right; width: 209px; height: 100%; background: url(../images/bg-login-zone.gif) repeat-y; }
#login-zone .text { margin-top: 51px; padding-left: 22px; }
#login-zone .text h2 { font-size: 10px; font-weight: normal; color: #000; letter-spacing: 0.08em; margin-bottom: 19px; }
#login-zone .text h2.en, #login-zone .text h2.nl { /*margin-bottom: 10px;*/ }
#login-zone .text p { margin-bottom: 0; }
#login-zone input { margin-bottom: 9px; border: none; padding: 1px; }

ul.approval-list { list-style-type: none; color: #000; margin-bottom: 13px; margin-top: 3px; }
ul.approval-list.with-link li { margin-bottom: 4px; }
ul.approval-list.with-link li a { color: #000; }
ul.approval-list.with-link li a:hover { text-decoration: none; }
ul.approval-list-left { float: left; margin-right: 10px; }
ul.approval-list-right { float: left; color: #818286; }

a#connect-btn { display: block; text-indent: -5000px; width: 88px; height: 28px; background: url(../images/btn-connect.jpg) no-repeat; margin-top: 5px; }
a#connect-btn.connect-btn-clicked { background-position: 0 -28px; }

#text.contact { width: 675px; }
#text.contact label { width: 90px; display: block; float: left; height: 17px; line-height: 17px; margin-bottom: 5px; }
#text.contact label#comment-label { width: 90px; }
#text.contact input { width: 223px; height: 17px; margin-right: 50px; border: none; float: left; display: block; margin-bottom: 5px; }
#text.contact textarea { width: 223px; height: 55px; border: 0; float: left; }
#text.contact input#contact-submit-btn { /*margin-left: 273px;*/ margin-left: 90px; margin-top: 5px; margin-bottom: 7px; height: 19px; background-color: #005faf; padding-bottom: 2px; color: #FFF; width: 85px; }

#mandatory-fields-mention { /*margin-left: 273px;*/ /*margin-left: 90px;*/ top: 8px; left: -35px; position: relative; }

#reference-categories,
#reference-list { 
    width: 123px;	
    border-right: 2px solid #f3f3f3; 
    height: 100%; 
    float: left; 
    background-color: #cdced3;
}
#reference-categories { overflow: auto; }
#reference-list { 
    width: 215px;
    overflow: auto;
}

#reference-list-scroll {
    overflow: auto;
    margin-top: 51px;
    overflow: auto;
    height: 299px;
}

#reference-list-scroll ul.subnav {
    margin-top: 0;
}

#reference-categories.clients { width: 203px; }
#reference-list.clients { width: 135px; }
#reference-description { overflow:auto; background-color: #e2e1e6; height: 100%; width: 448px; float: left; }
#reference-description-text { padding: 8px 10px 22px 14px; position: relative; }
#reference-description h1 { color: #3a82bd; font-size: 14px; font-weight: bold; margin-bottom: 30px; width: 190px; }
#reference-description h2 { color: #2d2b2c; font-size: 10px; font-weight: bold; margin-bottom: 0px; }
#reference-description p { margin-bottom: 10px; width: 190px; }
#reference-image-canvas { width: 222px; height: 318px; position: absolute; top: 8px; right: 10px; }
#reference-image-placeholder { position: absolute; left: 0; bottom: 16px; width: 222px; height: 302px; overflow: hidden; }
#reference-image-placeholder img { position: absolute; left: 0; bottom: 0; }
#reference-pic-nav { height: 10px; position: absolute; left: 0; bottom: 0; /*background-color: blue;*/ }
#reference-pic-nav img { float: left; }

/*h1 { font-size: 10px; color: #000; margin-bottom: 2px; }*/
h1 { color: #05A; font-size: 15px; font-weight: normal; margin-bottom: 10px; }
h2.approval { font-size: 10px; font-weight: bold; }
.inactive { color: #FF0000; }
p { margin-bottom: 10px; }
strong.black { font-weight: normal; color: #000; }
strong.black a { color: #000; }
.error { font-weight: bold; color: #F00; }
.mandatory { font-weight: bold; color: #3e86cb; }

.row { margin-bottom: 7px; }
.row label { float: left; margin-right: 10px; width: 65px; line-height: 15px; }
.row input.title { border: none; height: 16px; width: 150px; }
.row textarea { width: 150px; border: none; }

#linked-documents { width: 175px; }
/* @end */

#sub-middle { height: 6px; margin-bottom: 76px; }
#sub-middle div { float: left; height: 1px; margin-top: 5px; background-color: #e7e7e9; overflow: hidden; }
#sub-middle .nav { width: 155px; margin-right: 1px; background-color: #80b0d8; }
#sub-middle .content { width: 790px; }
/* @end */

/* @group bottom */
#bottom { height: 75px; background: url(../images/logo-herpain.jpg) no-repeat right bottom; }

#bottom-title { height: 20px; }
#bottom-title div { float: left; }
#bottom-title a { display: block; text-indent: -5000px; }
#bottom-title .left { width: 57px; }
#bottom-title .left a { background: url(../images/slideshow-arrow-left.gif) no-repeat; width: 10px; }
#bottom-title .center { width: 371px; }
#bottom-title .center.fr { background: url(../images/realisations-fr.jpg) no-repeat; }
#bottom-title .center.en { background: url(../images/realisations-en.jpg) no-repeat; }
#bottom-title .center.nl { background: url(../images/realisations-nl.jpg) no-repeat; }
#bottom-title .right { width: 10px; }
#bottom-title .right a { background: url(../images/slideshow-arrow-right.gif) no-repeat; width: 10px; }

#gallery .thumb { width: 46px; height: 46px; float: left; margin-right: 10px; }

.document-details { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px dotted ; border-color: #9c9da1; }
/* @end */

#footer { margin-top: 25px; text-align: right; font-size: 9px; color: #ccc; margin-right: 15px;}
#footer a { color: #ccc; }

#banner-realty { position: absolute; top: 510px; left: 15px; }

#inputSubmit { -webkit-box-shadow:5px 5px 5px rgba(0,0,0,.4); background-image: -webkit-gradient(linear, 0% 0%, 0% 65%, from(#7382BD), to(#004285)); background-image: -moz-linear-gradient(0% 50% 90deg,#004285, #7382BD); -moz-box-shadow:5px 5px 5px rgba(0,0,0,.4); float: right; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; background-color: #05A; border: none; padding:5px; font-size:12px; width:100px; color:#FFF; }
#inputFile {  }
