/*

	All the non-default styles unique to this site.
	-----------------------------------------------

	@file 		style.css
	@version 	1.0
	@author 	Paul Hachmang

	Copyright (c) 2009 Paul Hachmang

*/

/********************************************************************************************************/
/*********************************************[ Wrappers ]***********************************************/
/********************************************************************************************************/
.wrapper{width: 980px; margin: 0 auto;}

/*header*/
.header .wrapper{margin:0 auto; font-size: 14px;}
.header .tagline{padding: 24px 10px 0;}

/*header+footer*/
.wrapper .row{width: 100%; overflow: hidden;}
.wrapper .row img{display: block;}
.wrapper .row .col1{width:207px; float:left;}
.wrapper .row .col2{width:411px; float:left;}
.wrapper .row .col3{width:362px; float:left;}


h1{}
h1 a{display: block;}
h1 a img{display: block;}

.main .wrapper{background: #fff; width: 980px; padding: 0px; margin: 0 auto; overflow: auto}
.breadcrumb{margin-bottom: 1em;}

/* Supernav */
.navigation .wrapper { background: #004785; }


#nav{height: 25px;padding:0 30px; margin: 0; text-transform: uppercase;}

/* ALL LEVELS  */ /* Style consistent throughout all nav levels */
#nav, #nav ul{list-style-type: none;}
#nav li { position:relative; text-align:left; padding: 0; margin: 0 10px 0 0; vertical-align: bottom;}
#nav li.over { z-index:99; }
#nav li.here { z-index:100; } /* to prevent the li separator from showing through on mouseover on li */
#nav a,
#nav a:hover { display:block; text-decoration:none; color: #fff; }
#nav span { display:block; /*cursor:pointer;*/ }
#nav a { line-height:1.3em; }


/* 1ST LEVEL */
#nav li { float:left; background:url(../img/nav/nav_icon.png) 10px 8px no-repeat; }
#nav li.here { margin-left:-1px; background:url(../img/nav/nav_icon_selected.png) 10px 8px no-repeat;}
#nav a { float:left; padding:0 14px 0 25px; line-height:25px; }
#nav li.over a {  }


/* 1ST LEVEL RESET */
#nav ul li,
#nav ul li.here { float:none; height:auto;  margin:0;}
#nav ul a,
#nav ul a:hover { float:none; padding:0; line-height:1.3em; }
#nav ul li.over a,
#nav ul li.over a:hover,
#nav ul a,
#nav li.here li { font-weight:normal; }


/* 2ND LEVEL */
#nav ul { position:absolute; width:189px; top:25px; left:-10000px; padding-bottom:3px; padding-top:8px; margin: 0; background:url(../img/nav/nav3_bg.png) 0 3px no-repeat; }
#nav ul ul  { border-top:0;   left:100px; top:13px;}

/* Show menu */
#nav li.over ul { left:-1px; }
#nav li.over ul ul { left:-10000px; }
#nav li.over ul li.over ul { left:100px; }

#nav ul li { background:url(../img/nav/nav2_li_bg.png) repeat-y; padding:0px 2px; width:100%; }
#nav ul li.here{background:url(../img/nav/nav2_li_bg.png) repeat-y; padding:0px 2px; }
#nav ul li a { background:; }
#nav ul li a:hover { color: #000; }
#nav li.over ul a,
#nav ul li.here a,
#nav ul li a,
#nav ul li a:hover {  }
#nav ul span,
#nav ul li.last li span { padding:5px 15px; background:url(../img/nav/nav2_link_bg.png) repeat-x 0 100%; }
#nav ul li.last span,
#nav ul li.last li.last span { background:none; }
#nav ul li.last { background:url(../img/nav/nav2_last_li_bg.png) no-repeat 0 100%; padding-bottom:3px; }

#nav ul li.parent a,
#nav ul li.parent li.parent a { background-image:url(../img/nav/nav2_parent_arrow.png); background-position:100% 100%; background-repeat:no-repeat; }
#nav ul li.parent li a,
#nav ul li.parent li.parent li a { background-image:none; }


/* 3RD+ LEVEL */
/* Cursors */
#nav li.parent a,
#nav li.parent li.parent a,
#nav li.parent li.parent li.parent a { cursor:default; }

#nav li.parent li a,
#nav li.parent li.parent li a,
#nav li.parent li.parent li.parent li a { cursor:pointer; }

/* Show menu */
#nav ul ul ul { left:-10000px; }
#nav li.over ul li.over ul ul { left:-10000px;}
#nav li.over ul li.over ul li.over ul { left:100px; }



/********************************************************************************************************/
/**********************************************[ Pages ]*************************************************/
/********************************************************************************************************/
/*cols*/
.twocol{ background: url(../img/twocol_bgbottom.png) left bottom no-repeat; margin: 10px 0;}
.twocol .inner{width: 100%; overflow:  hidden; background: url(../img/twocol_bgtop.png) top left no-repeat; position: relative;}
.twocol .col1{width: 455px; float: left; padding: 15px;}
.twocol .col2{width: 485px; float: right; position: relative;}
.twocol .col2 .text{padding:15px;}

.threecol{ background: url(../img/threecol_bgbottom.png) left bottom no-repeat; margin: 10px 0;}
.threecol .inner{width: 100%; overflow:  hidden; background: url(../img/threecol_bgtop.png) top left no-repeat; position: relative;}
.threecol .col1{width: 330px;  margin-right: 10px; float: left; padding: 15px; position: relative;}
.threecol .col2{width: 270px; float: left; padding: 15px; position: relative;}
.threecol .col2 .projecten_container{height:435px;}
.threecol .col3{width: 270px; float: right; padding: 15px; }

.fourcol-one{background: url(../img/fourcol-one_bgbottom.png) left bottom no-repeat; margin: 10px 0;}
.fourcol-one .inner{width: 100%; overflow:  hidden; background: url(../img/fourcol-one_bgtop.png) top left no-repeat;}
.fourcol-one .col1{width: 455px; float: left; padding: 15px; position: relative;}
.fourcol-one .col2{width: 455px; float: right; padding: 15px; position: relative;}
.fourcol-one .col2 .projecten_container{height:435px;}

.fourcol-two{background: url(../img/fourcol-two_bgbottom.png) left bottom no-repeat; margin: 10px 0;}
.fourcol-two .inner{width: 100%; overflow:  hidden; background: url(../img/fourcol-two_bgtop.png) top left no-repeat;}
.fourcol-two .col3{width: 455px; float: left; padding: 15px; position: relative;}
.fourcol-two .col4{width: 485px; float: right; position: relative;}

.twocol .col2,
.twocol .col2 a,
.twocol .col2 h2,
.twocol .col2 h3,
.threecol .col2,
.threecol .col2 a,
.threecol .col2 h2,
.threecol .col2 h3,
.threecol .col3,
.threecol .col3 a,
.threecol .col3 h2,
.threecol .col3 h3,
.fourcol-one .col2,
.fourcol-one .col2 a,
.fourcol-one .col2 h2,
.fourcol-one .col2 h3,
.fourcol-two .col3,
.fourcol-two .col3 a,
.fourcol-two .col3 h2,
.fourcol-two .col3 h3{color: #fff;}
.fourcol-two .col3 h2, .fourcol-one .col2 h2{height: 28px;}

/*youtube player*/
.ytplayer{width: 455px;  height: 284px; margin: 0 0 1em 0;}
#videos{margin-bottom: 0;}
#videos a.selected{color: #ed1b2e;}

/*projectencaroussel*/
#projecten {position: relative;}
#projecten .project{display: none; position: absolute; top:0; left: 20px;}
#projecten .project img{display: block; margin: 0 0 1em 0;}
#projecten .selected{}
#projecten .beschrijving{height: 56px; overflow: hidden;}
#projecten.small .beschrijving{height: 154px;}


#vorige{position: absolute; left: -5px; top: 200px; width: 25px; height: 25px; text-indent: -9999px; background: url(../img/minus.png) left top no-repeat}
#volgende{position: absolute; right: -5px; top: 200px; width: 25px; height: 25px; text-indent: -9999px; background: url(../img/plus.png) left top no-repeat}

/*imgoverlay*/
.imgoverlay img{display: block;}
.imgoverlay .top{position: absolute; top: 0; left: 0; background: url(../img/img_overlay_top.png) top left no-repeat; width: 100%; height: 21px;}
.imgoverlay .bottom{position: absolute; bottom: 0; left: 0; background: url(../img/img_overlay_bottom.png) bottom left no-repeat; width: 100%; height: 21px;}

/*nieuws recent*/
.nieuws {position:relative;}
#nieuws_container{overflow: hidden; width: 100%;}
.nieuws .item, .certificeringen .item{background: #fff; padding: 2px 5px 10px 5px; overflow: hidden; margin:0 0 20px 0; width: 445px; position: relative;}
.certificeringen .item{padding-bottom:0px;}
.nieuws .item h3, .certificeringen .item h3{text-transform: inherit; font-size: 11px;}
.nieuws .item h3 a, .certificeringen .item h3 a{color: #000; text-decoration: none;}
.nieuws .item h3 a:hover, .certificeringen .item h3 a:hover{text-decoration: underline;}
.nieuws .item img, .certificeringen .item img{ margin: 3px 0 0 0;}
.nieuws .item p{margin:0;}
.nieuws .item .read_more{position: absolute; text-indent: -9999px; width: 25px; height: 25px; background: url(../img/plus.png) left top no-repeat; right:0px; bottom: 0px; }

.nieuws .item .left, .certificeringen .item .left{width: 80px; float:left; text-align:center;}
.nieuws .item .right, .certificeringen .item .right{width: 360px; float:right;}
.nieuws .item .entrydate{font-style: italic;}

#vorige_knop{position: absolute; bottom:-40px; left:-18px; width: 25px; height: 25px; text-indent: -9999px; background: url(../img/minus.png) left top no-repeat}
#volgende_knop{position: absolute; bottom:-40px; right:-18px; width: 25px; height: 25px; text-indent: -9999px; background: url(../img/plus.png) left top no-repeat}


.nieuws #vorige_knop.disabled, .nieuws #volgende_knop.disabled{opacity:0.4; filter: alpha(opacity = 50);}

/*nieuws bekijk*/
.entry_date{position: absolute; bottom: 20px; left: 20px; font-style: italic;}

/*nieuws rightcol */
.threecol .col3 img{margin: 0 0 1em 0;}
.threecol .col3 .read_more{position: absolute; bottom: -5px; right: 20px; width: 25px; height: 25px; text-indent: -9999px; background: url(../img/plus.png) left top no-repeat}


/*contact*/
#google-map{height: 400px;}


/********************************************************************************************************/
/**********************************************[ Footer ]************************************************/
/********************************************************************************************************/
.footer .wrapper{}

.footer ul{list-style-type: none;}
.footer ul li{float: left; margin-right: 10px; font-size: 12px;}
.footer ul li a{font-weight: bold; }
.footer ul li a:hover{text-decoration: none;}

.footer ul li li{float: inherit; margin:0; font-size: 11px;}
.footer ul li li a{font-weight: normal; text-decoration: none; }
.footer ul li li a:hover{text-decoration: underline;}

.footer ul ul ul{padding: 0 0 0 10px;}

.copyright{margin:0 auto; width: 950px; text-align: left; font-size: 11px;  line-height: 22px; margin-bottom: 100px; }
.copyright span{background: #81b445; padding: 0 4px;}