/* standard styles */
html {
  /*
  background:red !important;
  */
}
html,body {
  width:100%;
  height:100%;
  background: white;
}
body {
  font:75% Arial;
  margin:0 0px;
  min-width:980px;
}
img {
  border:0;
  display:block;
}
h2{
  font-size:120%;
	margin:-2px 0 0.3em 0px;
}
h3{
  font-size:100%;
	margin:0 0 0.2em 0px;
	line-height:120%;
}
h4{
  font-size:100%;
	margin:0 0 0.2em 0px;
	line-height:120%;
}
p{
	margin:0 0 1.7em 0;
}
.screen-reader {
  position:absolute;
  left:-999em;
}
#skip {
  min-height:17px;
  display:block;
  line-height:140%;
  padding:0;
  margin:0;
}
.text-small {
	font-size:90%;
}
a {
 color:#000;
}
a:hover {
 color:#000;
}
img.left {
  float:left;
  margin:0 10px 10px 0;
}
img.right {
  float:right;
  margin:0 0 10px 10px;
}
span.readon{
  position:absolute;
  width:15px;
  text-indent:-999em;
  background:url(../_images/readon-double-arrow.gif) 3px 7px no-repeat;
}



/* framework */
#framework {
  margin:auto auto;
  text-align:center;
  width:915px;
  position:relative;
  /**padding-top:1px;**/
  height:600px;
}

#content-framework {
	width:690px;
	position:absolute;
	left:240px;
	top:120px;
	text-align:left;
  line-height:160%;
}
#content-framework h1,
#case-teasers h2 {
	width:460px;
	margin:-10px 0px 10px 5px;
  position:relative;
  font-family:Georgia,Arial;
  font-size:250%;
  font-style:italic;
  font-weight:normal;
  line-height:90%;
  color:#000;
}
#case-teasers h2{
  margin-left:-5px !important;
}

#content-framework ul {
  margin:0 0 10px 0;
  padding:0;
  list-style:none;
}
#content-framework ul li{
  background:url(../_images/nav-sub-bullet.gif) 0 6px no-repeat;
  padding:0 0 0 10px;
  margin:0 0 2px 0;
  display:block;
}
#content {
  width:460px;
  padding:0 10px 10px 10px;
  margin-bottom:40px;
  background:url(../_images/content-corners-bottom.gif) no-repeat 0 100%;
  min-height:250px;
}



/* secondary content */
#secondary-content {
	position:absolute;
	width:210px;
	left:490px;
  min-height:100px;
	top:0px;
  background:url(../_images/corner-tr.gif) no-repeat 100% 0;
}
#secondary-content h2{
  margin:0 0 10px 0;
  padding:0;
}
#h2-bekijk-ook {
  text-indent:-999em;
  height:17px;
  width:74px;
  background:url(../_images/h2-bekijk-ook.png);
}
#h2-gerelateerde-projecten {
  text-indent:-999em;
  height:17px;
  width:166px;
  background:url(../_images/h2-gerelateerde-projecten.png);
}
#secondary-content div{
  background:url(../_images/corner-br.gif) no-repeat 100% 100%;
  padding:10px 0 1px 0;
}
#secondary-content div div{
  margin:0;
  padding:0;
  background:none;
}
#secondary-content ul{
	margin:0;
	padding:0;
	list-style:none;
}
#secondary-content li{
	margin-bottom:5px;
}

/* logo */
#logo {
  top:17px;
  left:50%;
  width:201px;
  height:34px;
  margin-left:-102px;
  position:absolute;

}
#logo img{
  float:left;
}


#nav {
  position:absolute;
  left:250px;
  top:99px;
  text-align:left;
}

#nav.new {
  left: 15px;
}

#nav ul{
  list-style:none;
  margin:0;
  padding:0;
  display:inline;
  clear:none !important;
}
#nav li {
  display:inline !important;
}
#nav a{
  display:block;
  background:url(../_images/navigation.png) no-repeat;
  height:17px;
  text-indent:-999em;
  margin-right:18px;
  display:block;
  float:left;
  overflow:hidden;
}

.en #nav a{
  display:block;
  background:url(../_images/navigation_en.png) no-repeat;
  height:17px;
  text-indent:-999em;
  margin-right:15px;
  display:block;
  float:left;
  overflow:hidden;
}

#nav #nav-sub {
  position:absolute;
	left:-225px;
	top:41px;
  background:url(../_images/corner-tl.gif) no-repeat;
  width:205px;
}

#nav #nav-sub ul {
  background:url(../_images/corner-bl.gif) 0 100% no-repeat;
  margin-top:25px;
  padding:15px 0 5px 14px;
  display:block;
}
#nav #nav-sub ul a,
#nav #nav-sub ul .self,
#nav #nav-sub ul .ancestor{
  display:block;
  float:none;
  background:url(../_images/nav-sub-bullet.gif) 3px 8px no-repeat;
  height:auto;
  width:100% !important;
  text-indent:0;
  padding:3px 0 5px 12px !important;
  margin:0px 0 0px 0;
  color:#595959;
  text-decoration:none;
}



#nav #nav-sub ul a.self,
#nav #nav-sub ul a:hover{
  text-decoration:underline;
}
#nav #nav-sub ul .ancestor{
  background:url(../_images/nav-sub-ancestor-bullet.gif) 1px 9px no-repeat !important;
  color:#000;
}
#nav #nav-sub ul ul{
  margin-top:0px;
  padding:3px 0 3px 11px;
  background:none;
}
#nav #nav-sub ul ul a,
#nav #nav-sub ul ul .self,
#nav #nav-sub ul ul .ancestor{
  font-size:95%;
  padding:2px 0 4px 8px !important;
  background:url(../_images/nav-sub-sub-bullet.gif) 0px 8px no-repeat;
}




#nav #nav-sub .active {
  width:211px !important;
}
#nav #nav-sub .active a.activeLink {
  background:url(../_images/nav-sub-bullet.gif) 3px 8px no-repeat #FCE1E7;
  width:199px !important;
  margin-right:-20px;
  color:#000;
}
#nav #nav-sub .inactive a {
  background-color:transparent !important;
}
#nav #nav-sub .active div.foldout {
  position:absolute;
  margin-left:211px;
  margin:40px 0 0 211px;
  background-color:#FCE1E7;
  top:0;
  width:210px;
  padding:10px 0 11px 0;
  min-height:120px;
}
#nav #nav-sub .active div.foldout ul a {
  width:auto !important;
  padding-left:12px !important;
  padding-right:14px;
  background:url(../_images/nav-sub-bullet.gif) 3px 8px no-repeat;
  font-size:100%; 
  
}
#nav #nav-sub .active div.foldout .active {
  width:199px !important;
}
#nav #nav-sub .active div.foldout .active a.activeLink{
  background-color:#FDF0F3;
  padding-left:12px !important;
  margin-right:0;
  width:auto !important;
  color:#000;
} 
#nav #nav-sub .active div.foldout div {
  width:210px;
}
#nav #nav-sub .active div.foldout .active li {
  float:left;
  height:6em;
  width:215px !important;
  clear:none !important;
  margin:0 10px 0 0 !important;
}
#nav #nav-sub .active div.foldout .active ul li a{
  padding:0 !important;
  background-position:65px 4px !important;
  margin:0 !important;
  color:#595959;
}

#nav #nav-sub .active div.foldout .active li img {
  width:58px;
  height:58px;
  margin:0 15px 5px 0;
  float:left;
}

#nav #nav-sub .inactive div.foldout {
  display:none;
}
#nav #nav-sub .active div.foldout div.foldout{
  margin:0 0 0 198px;
  background-color:#FDF0F3;
  width:470px;
}

#nav #nav-sub .active div.foldout div.foldout div{
  width:470px;
}

#nav #nav-sub .active div.foldout a.projects-more,
#nav #nav-sub .active div.foldout a.projects-less {
  clear:both;
  width:100px !important;
  display:block;
  background:url(../_images/arrow-down-double.gif) 0px 7px no-repeat !important;
  padding:0 0 0 12px;
  margin:0 0 0 12px;
  color:#595959;
}

#nav #nav-sub .active div.foldout a.projects-less {
  background:url(../_images/arrow-up-double.gif) 0px 7px no-repeat !important;
}




#nav-sub h2 {
  display:inline;
}
#nav-sub h2 a{
  position:absolute;
  margin:10px 0 0 16px;
  background:url(../_images/navigation.png) no-repeat;
  height:17px;
  text-indent:-999em;
}


/*initialize*/
#nav-home a{
  width:41px;
  background-position:0 0;
}
#nav-home a:hover{
  background-position:0 -17px;
}
#nav-profiel a,
#nav #h2-profiel a{
  width:48px;
  background-position:-56px 0;
}
#nav-profiel a:hover,
#nav-profiel a.self,
#nav-profiel a.ancestor,
#nav #h2-profiel a:hover{
  background-position:-56px -17px;
}
#nav-portfolio a,
#nav #h2-portfolio a{
  width:63px;
  background-position:-119px 0;
}
#nav-portfolio a:hover,
#nav-portfolio a.self,
#nav-portfolio a.ancestor,
#nav #h2-portfolio a:hover{
  background-position:-119px -17px;
}
#nav-nieuws a,
#nav #h2-nieuws a{
  width:52px;
  background-position:-197px 0;
}
#nav-nieuws a:hover,
#nav-nieuws a.self,
#nav-nieuws a.ancestor,
#nav #h2-nieuws a:hover{
  background-position:-197px -17px;
}
#nav-werken a,
#nav #h2-werken a{
  width:54px;
  background-position:-264px 0;
}
#nav-werken a:hover,
#nav-werken a.self,
#nav-werken a.ancestor,
#nav #h2-werken a:hover{
  background-position:-264px -17px;
}
#nav-contact a,
#nav #h2-contact a{
  width:57px;
  background-position:-333px 0;
}
#nav-contact a:hover,
#nav-contact a.self,
#nav-contact a.ancestor,
#nav #h2-contact a:hover{
  background-position:-333px -17px;
}

#nav-english a,
#nav #h2-english a{
  width:57px;
  background-position:-400px 0;
}
#nav-english a:hover,
#nav-english a.self,
#nav-english a.ancestor,
#nav #h2-english a:hover{
  background-position:-400px -17px;
}

/* English navigation */
.en #nav-home a{
  width:41px;
  background-position:0 0;
}
.en #nav-home a:hover{
  background-position:0 -17px;
}
.en #nav-profiel a,
.en #nav #h2-profiel a{
  width:48px;
  background-position:-56px 0;
}
.en #nav-profiel a:hover,
.en #nav-profiel a.self,
.en #nav-profiel a.ancestor,
.en #nav #h2-profiel a:hover{
  background-position:-56px -17px;
}
.en #nav-portfolio a,
.en #nav #h2-portfolio a{
  width:63px;
  background-position:-119px 0;
}
.en #nav-portfolio a:hover,
.en #nav-portfolio a.self,
.en #nav-portfolio a.ancestor,
.en #nav #h2-portfolio a:hover{
  background-position:-119px -17px;
}

.en #nav-werken a,
.en #nav #h2-werken a{
  width:34px;
  background-position:-194px 0;
}
.en #nav-werken a:hover,
.en #nav-werken a.self,
.en #nav-werken a.ancestor,
.en #nav #h2-werken a:hover{
  background-position:-194px -17px;
}
.en #nav-contact a,
.en #nav #h2-contact a{
  width:57px;
  background-position:-243px 0;
}
.en #nav-contact a:hover,
.en #nav-contact a.self,
.en #nav-contact a.ancestor,
.en #nav #h2-contact a:hover{
  background-position:-243px -17px;
}

.en #nav-language a,
.en #nav #h2-language a{
  width:57px;
  background-position:-313px 0;
}

.en #nav-language a:hover,
.en #nav-language a.self,
.en #nav-language a.ancestor,
.en #nav #h2-language a:hover{
  background-position:-313px -17px;
}

/* for flash replacement */
object {
  display:block;
}
.print-header {
  display:none;
}
.flash-header {
  display:block;
}
#skip {
	min-height:17px;
}










/* navigation */
#nav {
  z-index:2;
}


/* projects */
#nav div#nav-projects{
	display:block;
  margin:4px 0 4px 0px;
  overflow:hidden;
  position:relative;
  width:190px;
  height:85px;
  background:rgb(252,225,231);
  z-index:200;
}
#nav div#nav-projects ul{
	margin:0 !important;
  padding:20px 0px 0px 20px;
  position:absolute;
  height:auto;
}
#nav div#nav-projects ul li{
  float:left;
  width:90px;
  clear:none;
  padding:0;
  margin:0 8px 0 0;
  height:10em;
}
#nav div#nav-projects ul li a{
  padding:0 !important;
  margin:0;
  background:none !important;
}
#nav div#nav-projects ul li a:hover{
  text-decoration:underline;
}
#nav div#nav-projects ul li img{
  width:78px;
  height:78px;
  margin-bottom:3px;
}






/* homepage specific */
.page-home {
	margin:0 0;
  background:none;
}
.page-home #framework {
	margin:auto auto;
	text-align:center;
	width:auto;
  background:url(../_images/home-content-corners-top.gif) 50% 520px no-repeat;
}
.page-home #content-framework {
	width:856px;
  background:url(../_images/home-content-corners-bottom.gif) 0 100% no-repeat;
  left:50%;
	top:520px;
	text-align:left;
  margin-left:-432px;
  display:inline-block;
  padding-left:8px;
  padding-bottom:20px;  
}
.page-home #content-framework a{
  text-decoration:none;
  display:block;
  color:#595959;
}
.page-home #content-framework a:hover{
  text-decoration:underline;
  color:#000;
}
.page-home #content-framework p{
  margin:0 0 10px 0;
}

.page-home #content-framework p a{
  float:left;
}
.page-home #content-framework li {


}


.page-home #content-framework:after {
	content: "."; 
	display: block; 
	height: 0;
	visibility:hidden;
	clear: both;
}

#news {
  display:inline;
}
#news h3{
  font-size:130%;
  margin:0 !important;
}
.news-row {

}
#news .item {
  float:left;
  width:200px;
  margin:20px 0 0 10px;
}

#vacancies,#about {
  float:right;
  width:200px;
  margin:20px 10px 0 0;
}
#vacancies {
  padding-bottom:10px;
}
#vacancies h2,#about h2{
  font-size:130%;
  margin:0 !important;
}
.news-row-double {

  clear:both;
}





#project-comparisons {
  height:480px;
}

#project-comparisons object{
   margin:auto auto; 
   width:100%;
   height:100%;
}
#project-comparisons img{
   margin:auto auto; 
}
#project-comparisons .alternate-content{
   margin:auto auto; 
   width:856px;
   margin-top:80px;
   height:380px;
   overflow:auto;
}
#project-comparisons h2 {
  margin-bottom:20px;
}

/*
        'blue': 'F2F6FA',
      'green':  'F5FAF3',
      'yellow': 'FFFCE0',
      'pink':   'FDF0F3'
*/
#project-comparisons ul {
  margin:0 0 0 0;
  padding:0;
  list-style:none;
  text-align:left;
}
#project-comparisons ul li {
  float:left;
  width:400px;
  margin:0 10px 10px 0;
  padding:5px;
  background:#FFFCE0;
}
#project-comparisons ul li.odd {
}

#project-comparisons ul li.even {
  clear:left;
}
#project-comparisons ul li li{
  background:url(../_images/nav-sub-bullet.gif) 0 6px no-repeat;
  padding:0 0 0 10px;
  margin:10px 10px 2px 0;
  display:block;
  width:auto;
  clear:none;
  height:auto;
}


/* logo */
.page-home #logo {

}

.page-home #nav {
  left:50%;
  top:482px;
  margin-left:-170px;
}

/*portfolio page specifiek*/
.page-portfolio #content-framework {
	background:url(../_images/corner-tr.gif) no-repeat 100% 0;
}
.page-portfolio #content{
   width:auto;
   background:url(../_images/page-portfolio-content-corners-bottom.gif) no-repeat 0 100%;
} 
.page-portfolio #content:after {
	content: "."; 
	display: block; 
	height: 0;
	visibility:hidden;
	clear: both;
}
.case-teasers-row {
  clear:both;
}
#case-teasers div div {
  width:300px;
  margin-right:10px;
  float:left;
}
#case-teasers img {
  width:300px;
  height:170px;
  margin-bottom:10px;
}
#case-teasers h3 {
  font-size:130%;
}
#case-teasers a {
  color:#595959;
  text-decoration:none;
}
#case-teasers a:hover {
  color:#000;
  text-decoration:underline;
}





/*portfolio page specifiek*/
.page-portfolio #content{
   width:100%;
} 
.page-portfolio #content p{
  width:485px;
}
.portfolio-category-row {
  clear:both;
  position:relative;
  margin-bottom:40px;
  padding-bottom:150px;
}
.portfolio-category-row:after {
	content: "."; 
	display: block; 
	height: 0;
	visibility:hidden;
	clear: both;
}
.portfolio-category {
  float:left;
  width:150px;
  margin-right:12px;
}
.portfolio-category h2{
  margin-right:-5px;
  min-height:35px;
}
.portfolio-category ul{
  list-style:none;
  margin:-10px 0 25px 0;
  padding:0;
}
.portfolio-category li {
  margin-bottom:0.4em;
  
}
.portfolio-category img{
  position:absolute;
  clear:both;
  bottom:0;
}


/* project page specific */
.page-project #content-framework {
	z-index:2;
	background:url(../_images/corner-tr.gif) no-repeat 100% 0;
	left:665px;
	width:275px;
}
.page-project #content-framework h1 {
	width:auto;
  margin-left:10px;
}
.page-project #content,
.page-project #secondary-content {
	width:auto;
	float:none;
	margin:0 10px 0 12px;
  padding:0;
  position:static;
  background:none;
}
.page-project #content,
.page-project #secondary-content,
.page-project #content-framework h1 {
  width:253px;
}
.page-project #content-framework.wide #content,
.page-project #content-framework.wide #secondary-content,
.page-project #content-framework.wide #content-framework h1 {
  width:auto;
}
#project-corner-br {
  background:url(../_images/corner-br.gif) no-repeat 100% 100%;
  height:10px;
}
.page-project #secondary-content div {
  background:none;
}
.page-project #content{
/*
  background:url(../_images/corner-br.gif) no-repeat 100% 100%;
  */
}

.page-project #content {
	margin-bottom:2em;
}
.page-project #content-framework.small {

}
#project-visuals {
  width:415px;
	position:absolute;
  overflow-x:hidden;
	left:250px;
	min-height:600px;
	top:134px;
  background:rgb(252,225,231);
}
#project-visuals img{
  margin: auto auto;
  margin-bottom:20px;
  border:0;
}
#project-visuals.freestanding img{
  border:0;
}
table.project-specs {
	border-collapse:collapse;
	margin-right:-10px;
	position:relative;
}
table.project-specs caption{
	display:none;
}
table.project-specs th {
	white-space:nowrap;
	text-align:left;
}
table.project-specs th,table.project-specs td{
	padding:0 0.5em 0.4em 0;
	vertical-align:top;
}



/*employees page specifiek*/
.page-employees #content-framework {
	background:url(../_images/corner-tr.gif) no-repeat 100% 0;
}
.page-employees #content{
   width:100%;
   background:url(../_images/page-portfolio-content-corners-bottom.gif) no-repeat 0 100%;
} 
.page-employees #content:after {
	content: "."; 
	display: block; 
	height: 0;
	visibility:hidden;
	clear: both;
}
.page-employees #content p{
  width:485px;
}
.page-employees .employees-column {
  width:33%;
  float:left;
}
/* v-card microformat !*/
.vcard {
  margin:0 15px 15px 0;
  position:relative;
  min-height:75px;
}
div.vcard:after {
	content: "."; 
	display: block; 
	height: 0;
	visibility:hidden;
	clear: both;
}
.page-employees .vcard .org,
.page-employees .vcard .adr{
  display:none;
}

.vcard img {
  position:absolute;
  left:0;
  top:0;
  width:50px;
  height:50px;
}
.vcard span,
.vcard div,
.vcard a {
  padding-left:60px;
  display:block;
  width:150px;
}


/* EN-site specific */
table#awards{
  width: 100%;
}

#awards td{
  vertical-align: top;
}

#content-framework ul.portfoliolist{
  width: 515px;
  clear: both;
}

#content.portfoliolist {
	width: 100%;
}

.portfoliolist h2{
  clear: both;
}

#content-framework ul.portfoliolist li{
  background: none;
  padding: 0;
  margin: 0 10px 0 0;
  width: 150px;
  float: left;
}

#content-framework ul.portfoliolist li p a{
  text-decoration: none;
}

#content-framework ul.portfoliolist li p a:hover{
  text-decoration: underline;
}


.page-content.en .portfolio-category-row img {
	margin-top: 40px;
}

.awards{
   border-collapse:collapse;
   padding:0;
   margin:0 0 1em 0;
}   
.awards th{
	text-align:left;
	padding:0 5px 4px 0;
	vertical-align:top;
}
.awards td {
	padding:0 0 4px 0;
	vertical-align:top;
}

/*#nav li#nav-wij a{
  background: url(../_images/wij.png);
  width: 20px;
  height: 13px;
}

#nav li#nav-denken-en-doen a{
  background: url(../_images/denken_doen.png);
  width: 96px;
  height: 13px;
}

#nav li#nav-het-werk a{
  background: url(../_images/het_werk.png);
  width: 56px;
  height: 13px;
}*/

#nav li#nav-wij a{
  background: url(../_images/wij_underline.png);
  width: 20px;
  height: 13px;
}

#nav li#nav-denken-en-doen a{
  background: url(../_images/denken_doen_underline.png);
  width: 96px;
  height: 13px;
  margin-right: 22px;
}

#nav li#nav-het-werk a{
  background: url(../_images/het_werk_underline.png);
  width: 56px;
  height: 13px;
}