/*@import url(custom-styles.css);*/

body {background:url(../images/bgr.jpg) left top repeat-x #fff; font-family:Verdana, Geneva, sans-serif; font-size:11px;}
h3 {font-size:17px; color:#000; font-weight:normal;}

#wrap {width:966px; margin:auto;}


/* TOP
---------------------------------------------- */
#topSegment {float:left; width:960px; padding:0 3px;}

a#logo {float:left; width:179px; height:38px; display:block; padding-top:18px;}
a#logo h1 {background:url(../images/logo.gif) 0 0 no-repeat; width:179px; height:38px; text-indent:-9999px;}

.rightTop {float:right; width:auto; padding-bottom:15px;}

ul#topNav {float:right; width:auto;}
ul#topNav li {float:left; width:auto; list-style-type:none; color:#bcbcbc; font-size:10px; padding:16px 0 0 0;}
ul#topNav li a {color:#6c6c6c; padding:0 10px; float:left;}
ul#topNav li.searchBox {padding:12px 0 0 3px;}
ul#topNav li fieldset {background:url(../images/search-field.gif) 0 0 no-repeat; width:289px; height:22px;}
ul#topNav li fieldset input.searchField {background:none; border:0; padding:4px 7px; width:265px; color:#959595;}
ul#topNav li fieldset input.searchButton {background:none; border:0; text-indent:-9999px;}

ul#mainNav {float:right; width:320px; clear:both; padding-top:4px;}
ul#mainNav li {float:left; width:auto; list-style-type:none;}
ul#mainNav li a {display:block; float:left; width:80px; height:84px; background-position:0 0px; background-repeat:no-repeat; text-indent:-9999px;}
ul#mainNav li a.navUitleg {background-image:url(../images/nav-uitleg.png);}
ul#mainNav li a.navPlaatsProject {background-image:url(../images/nav-plaats-project.png);}
ul#mainNav li a.navZoekProject {background-image:url(../images/nav-zoek-project.png);}
ul#mainNav li a.navShop {background-image:url(../images/nav-shop.png);}
ul#mainNav li a.navQA {background-image:url(../images/nav-qa.png);}
ul#mainNav li a:hover {background-position:0 -84px;}

/* CONTENT
---------------------------------------------- */

/* Home content */
#homeHead {float:left; width:500px; height:350px; position:relative;}
.homeBox1 {position:absolute; right:84px; top:46px; width:346px; height:257px; background:url(../images/home-box-1.png) left top no-repeat;}
.homeBox2 {position:absolute; left:84px; top:44px; width:349px; height:268px; background:url(../images/home-box-2.png) left top no-repeat;}
.homeBox1 h2, .homeBox1 ol li, .homeBox2 h2, .homeBox2 ol li {text-indent:-9999px; list-style-type:none;}

#categoryLinks{ float: left; width: 450px; height: 350px; margin-left: 0px; padding-top: 20px; }
    #categoryLinks .linkBox { height: 52px; width: 165px; margin: 37px 0 0 40px; float: left; text-align: center;}
    #categoryLinks .linkBox a {height: 52px; display: block; font-size: 14px; font-weight: bold; background-position: top left; background-repeat: none; text-indent: -9999px}
    #categoryLinks .linkBox h2 {overflow: hidden; text-indent: -999px}
    
#homeCarousel {float:left; width:966px; padding:15px 0 0 0;}
.homeCarouselHolder {display:block; position:relative; padding:20px 0;}

.seenOn {clear: both; float: left; width: 966px; height: 50px; margin: 10px 0 0; padding: 10px 0; border-bottom: 1px solid #D5D5D5; border-top: 1px solid #D5D5D5; vertical-align: middle; overflow: hidden; }
    .seenOn span {font-size: 12px; height: 50px; line-height: 50px; float: left; margin-right: 30px; font-style: italic; font-weight: bold; color: #999999}
    .seenOn a {height: 50px; display: inline; margin:0 15px;}
    .seenOn img {max-height: 50px; vertical-align: middle}

.pressBox{margin: 20px 20px 0 20px; float: left; clear: both}
    .pressBox p img {float: left; margin: 0 10px 5px 0}
    .pressBox h4 {font-size: 16px;}

/* Inner pages content */
.pageTitle {float:left; width:946px; background:url(../images/title-bullet-yellow.gif) 4px 6px no-repeat; padding:0 0 10px 20px; font-size:18px; color:#000;}

#mainBoxHolder {float:left; width:960px; padding:0 3px; background:url(../images/box-bgr.gif) 3px top repeat-y; margin-bottom:50px; position:relative;}
.mainBoxInner {float:left; width:960px; padding:0 0 10px 0; background:url(../images/box-bottom.gif) left bottom no-repeat;}
.mainBox {float:left; width:960px; min-height:100px; background:url(../images/box-top.gif) left top no-repeat; position:relative;}
a.boxButton {position:absolute; text-indent:-9999px; display:block; right:20px; bottom:-40px; width:72px; height:84px; }
a.continueButton {background:url(../images/button-continue.png) 0 0 no-repeat;}
a.finishButton {background:url(../images/button-finish.png) 0 0 no-repeat;}

a.boxButton:hover {background-position:0 -84px;}
ul.regPath {position:absolute; top:19px; right:21px; width:auto; padding-right:4px; height:50px; background:url(../images/steps-bgr.gif) right 1px no-repeat;}
ul.regPath li {font-size:18px; color:#fff; float:left; padding:0 0 0 15px; width:16px; text-align:right;}
ul.regPath li.currentStep {color: #FF0080}
ul.regPath li.regPathTitle {width:auto; color:#000;}
ul.regPath li a {color:#000;}

.mainBox h2 {margin:20px 0 0 20px; background:url(../images/title-left-bgr.gif) 0 0 no-repeat #f0f0f0; height:21px; line-height:21px; vertical-align:middle; font-size:12px; color:#ff0080; font-weight:normal; width:150px; padding-left:10px;}
.mainBox h2 span {display:block; width:auto; background:url(../images/title-right-bgr.gif) right top no-repeat; padding-right:10px; height:21px; line-height:21px;}
.mainBox p {padding:20px; border-top:#e8e7e7 solid 1px; line-height:16px;}
.mainBox h2.categoryTitle{font-weight: bold; font-size: 14px; background:none;width:400px; margin:0px; padding:5px 5px 5px 2px}

ul.chooseProjectList {margin:20px;}
ul.chooseProjectList li {padding:2px 0;}

.leftColumn {float:left; width:680px; padding:20px 0 20px 20px;}
.postProjectBox {float:left; width:680px;}
.postProjectBox h4 {float:left; width:670px; background:url(../images/title-left-bgr.gif) 0 0 no-repeat #f0f0f0; height:21px; line-height:21px; font-size:12px; color:#ff0080; font-weight:normal; padding-left:10px; position:relative;}
.postProjectBox h4 span {position:absolute; top:0; right:0; background:url(../images/title-right-bgr.gif) right top no-repeat; padding-right:10px; height:21px; line-height:21px; color:#d2d2d2;}
.postProjectBox h4 span a {font-weight:normal;}

.postProjectBox h5 {font-size:14px; font-weight:normal; padding:15px 0 0 10px; clear:both;}
.postProjectBox p {border:0; border-bottom:#e8e7e7 solid 1px; color:#838383;}

.postProjectBox ul {padding:10px 0 0 35px;}
.postProjectBox ul li {list-style-type:disc; color:#838383; padding:0 0 2px 0;}

.postProjectBox fieldset {padding:20px 10px;}
.postProjectBox fieldset input.fieldWide {width:510px; padding:4px 2px; border:#d4d2d2 solid 1px;}
.postProjectBox fieldset textarea {width:510px; height:100px; padding:4px 2px; border:#d4d2d2 solid 1px; overflow:auto;}
ul.fileTypeBox {float:left; width:350px; padding:0;}
ul.fileTypeBox li {float:left; width:70px; padding:4px 0; list-style-type:none;}
ul.fileTypeBox li input {margin-right:5px;}
p.addFileType {float:left; width:220px; border:0; padding:0;}
p.addFileType input {width:70px; padding:4px 2px; border:#d4d2d2 solid 1px;}
.postProjectBox fieldset input.fileUploadField {float:left;}
.postProjectBox fieldset ol {float:left; clear:right; padding-left:25px;}
.postProjectBox fieldset ol li {width:300px; border-bottom:#e3e2e2 solid 1px; list-style-position:inside; position:relative; padding-bottom:4px;}
.postProjectBox fieldset ol li a.removeFile {position:absolute; top:2px; right:0; font-size:10px;}

ul.priceBox {width:322px; padding:0; padding-top:25px; clear:both;}
ul.priceBox li {float:left; width:322px; position:relative; list-style-type:none;}
ul.priceBox li p {float:left; width:180px; text-align:right; padding:0; border:0; line-height:22px; color:#333333;}
ul.priceBox li p span {margin:0 0 0 5px; color:#a0a0a0;}
ul.priceBox li input {float:right; margin:3px 0; padding:2px; border:#d4d2d2 solid 1px; color:#696969; width:132px;}
ul.priceBox li input.noEditField {border:#fff solid 1px;}
ul.priceBox li.totalPriceRow {border-top:#e3e2e2 solid 1px;}
ul.priceBox li.totalPriceRow input {font-weight:bold; color:#333333;}

.priceIconBox {position:absolute; top:-15px; right:-120px; width:103px; height:105px; background-position:0 0; background-repeat:no-repeat;}
.priceLow {background-image:url(../images/icon-below-min.png);}
.priceAverage {background-image:url(../images/icon-average.png);}
.priceGood {background-image:url(../images/icon-good.png);}
.priceExcellent {background-image:url(../images/icon-excellent.png);}

.rightColumn {float:right; width:200px; padding:70px 20px 40px 0;}
.rightColumn p {border:0; padding:0; padding-bottom:10px; color:#838383; line-height:16px;}
ul.priceSideBox {width:200px; padding-top:25px; clear:both;}
ul.priceSideBox li {float:left; width:200px; position:relative;}
ul.priceSideBox li p {float:left; width:160px; text-align:right; padding:0; border:0; line-height:22px; color:#333333;}
ul.priceSideBox li span {float:right; margin:3px 0; padding:2px; color:#696969; width:32px;}
ul.priceSideBox li p span {margin:0 0 0 5px; color:#a0a0a0; float:none; padding:0; width:auto;}
ul.priceSideBox li.totalPriceRow {border-top:#e3e2e2 solid 1px;}
ul.priceSideBox li.totalPriceRow span {font-weight:bold; color:#333333;}
.rightColumn fieldset {padding:10px 0;}


.projectOverviewBox {float:left; width:920px; padding:20px;}
.projectInfo {float:left; width:290px; border-right:#e8e7e7 solid 1px;}
.projectInfo h5 {font-size:13px; color:#038ca0;}
.projectInfo h5 span {font-weight:normal; color:#838383;}
.projectInfo ul {padding:10px 0;}
.projectInfo ul li {padding-bottom:2px; color:#838383;}
.projectInfo ul li b {display:inline-block; width:180px; color:#343434;}

.projectInfoTxt {float:right; width:615px; }
.projectInfoTxt h5 {font-size:13px; color:#038ca0;}
.projectInfoTxt p {padding:10px 0; border:0; color:#838383; height: auto;}

.projectMidBoxes {float:left; width:920px; clear:both; padding:20px 0 10px 0;}
.projectMidTxt {float:left; width:285px; padding-right:20px;}
.projectMidTxt h5 {font-size:13px; color:#ff0080;}
.projectMidTxt p {padding:10px 0; border:0; color:#838383; height: auto;}

.recentProjectsHolder {float:left; width:920px; padding:20px; border-top:#e8e7e7 solid 1px;}
.recentProjectsHolder h5 {font-size:13px; color:#038ca0;}
.projectCarouselHolder {display:block; position:relative; padding:20px 0;}
a.seeAll {margin-left:32px;}

.recentProjectsFull {float:left; width:940px; padding:20px 0 0 20px;}
.fullProjectCarouselBox {float:left; width:213px; border:#e8e7e7 solid 1px; padding-bottom:20px; margin:0 20px 20px 0;}
.fullProjectCarouselBox h5 {font-size:10px; background:url(../images/avatar.gif) 12px 11px no-repeat; color:#838383; padding:10px 0 10px 70px; font-weight:normal;}
.fullProjectCarouselBox h5 a {color:#038ca0; font-weight:bold; font-size:11px;}
.fullProjectCarouselBox images {border:#e8e7e7 solid 1px;}


.projectListHolder {float:left; width:920px; padding:20px; border-top:#e8e7e7 solid 1px;}
.projectListHolder h5 {font-size:12px; background:url(../images/avatar.gif) 0 2px no-repeat; color:#038ca0; padding:0 0 20px 58px; font-weight:normal;}

.projectPostList {float:left; width:680px; padding-right:20px; border-right:#e8e7e7 solid 1px;}
.projectPostBox {float:left; width:680px; padding:20px 0 10px 0; border-top:#e8e7e7 dotted 1px;}
.imageRatingBox {float:left; width:245px; position:relative;}
.imageRatingBox fieldset {padding:5px 0 7px 10px; background:#f4f4f4; margin-top:5px; position:relative;}
.imageRatingBox fieldset label {float:left;}
.commentBox {float:right; width:400px; padding:0 20px 0 7px; margin-bottom:10px; background:url(../images/comment-arrow.gif) 0 12px no-repeat;}
.commentBox p {padding:10px 10px 15px 10px; width:400px; border:0; background:#efefef; font-size:10px; height: auto;}
.commentBox p b {color:#ff0080; font-size:11px; display:block; padding-bottom:5px;}
.commentBox p.commentReply {padding-left:30px; width:380px; border-top:#d9d9d9 dotted 1px; background:#f5fbd6;}
.commentBox p.commentReply b {color:#038ca0;}

.sideCarouselHolder {float:right; width:200px;}

#catBox {float: left; width: 900px; margin: 10px 0 0 40px;}
    #infoCol{ background-color: #E8E8E8; float: left; width: 400px; border: 2px solid #E0E0E0; padding-bottom: 20px;}
        #infoCol h2 {font-size: 16px; color:#555555; width: auto; background: none; font-weight: bold; float: left; margin: 17px 20px 20px 10px;}
        #infoCol .price {font-size: 14px; font-weight: bold; background-color: #FFFFFF; border: 2px solid #B0B0B0; padding: 5px; float: right; margin-top: 12px;}
        #infoCol .stepInfo { clear: both;  border: 2px solid #B0B0B0; padding: 10px; margin: 0 10px 20px 10px; font-size: 14px;}
        
        #infoCol .linkBlue a {line-height: 40px; font-size: 16px; font-weight: bold; width: 170px;text-align: center; height: 40px; display: block; color: #0091D4;
                    float: left;margin-left: 10px;}
        

        #infoCol .linkBoxPink a,
        #infoCol .linkBoxGray a {line-height: 40px; font-size: 16px; font-weight: bold;  border: 2px solid #B0B0B0; width: 170px; text-align: center; height: 40px; display: block;
                                -moz-border-radius: 10px; -webkit-border-radius: 10px;}
        #infoCol .linkBoxGray a{background-color:#F5F5F5; float: left; color: #656565; margin-left: 10px;}
        #infoCol .linkBoxPink a {color: #FFFFFF; background-color: #FF0080; float: right;}

        #infoCol .linkBoxPink a:hover,
        #infoCol .linkBoxGray a:hover { text-decoration: none; border-color: #646464}

    #csCol {width: 430px; float: left; margin-left: 27px; padding-bottom: 20px;}
        #csCol h2{margin: 20px 0 45px 10px; color: #656565; font-weight: bold; float: left; text-align: center; background: none; width: 400px; font-size: 16px;}
        #csCol .imageHolder {float: left; border: 2px solid #E0E0E0; width: 183px; height: 110px; margin: 15px 0 0 18px; padding: 4px; overflow: hidden;}
        #csCol .imageHolder img {width: 176px;}

#customerWord {background:url(../images/bgr.jpg) 0 -90px repeat-x #fff; clear: both; margin: 1px;}
#customerWord p {margin-left: 10px; padding-bottom: 5px; font-weight: bold; font-size: 14px;}
#customerWord table{width: 900px; margin-left: 20px;}
#customerWord table td {width: 290px; padding: 5px;}
        /* Stats box */
.statsHodler {float:left; width:950px; height:30px; padding:0 3px 0 13px; background:url(../images/stats-bgr-left.gif) 3px 0 no-repeat;}
.statsHodler p {float:left; width:950px; height:30px; font-size:10px; line-height:30px; background:url(../images/stats-bgr-right.gif) right top no-repeat #e8e8e8; text-align:center; color:#cfcfcf;}
.statsHodler p b {color:#818181; font-weight:normal;}
.statsHodler p i {color:#ff0080; font-style:normal;}

/* FOOTER
---------------------------------------------- */

#footer {float:left; width:960px; padding:20px 3px;}

ul#footerNav {float:left; width:auto;}
ul#footerNav li {float:left; color:#363636; width:160px; list-style-type:none; line-height:15px;}
ul#footerNav li a {color:#838383; display:block;}
#footer p {float:right; width:auto; text-align:right; color:#838383; font-size:10px; line-height:15px;}
#footer p b {color:#363636; display:block; padding-bottom:15px;}
#footer p i {color:#bdbdbd;}
#footer p a {color:#ff0080;}