@charset "utf-8";
/* CSS Document */

body, html
{
	font-family: "museo-slab",serif;
margin:0;
	padding:0;
	height:100%;
}

.fail
{
	    background-color: #ffffff;
    border: solid 3px #cc0033;
    padding: 5px;
    margin-top: 10px;
    margin-bottom: 10px;
}

#headertop
{
	width:100%;
	height:85px;
	background-color: rgba(255, 255, 255, 1);
	position:relative;
	z-index:100;
	-webkit-box-shadow: 0px 2px 6px 0px rgba(50, 50, 50, 0.37);
	-moz-box-shadow:    0px 2px 6px 0px rgba(50, 50, 50, 0.37);
	box-shadow:         0px 2px 6px 0px rgba(50, 50, 50, 0.37);
			-webkit-transition: -webkit-transform 0.2s ease-in;
    -moz-transition: -moz-transition 0.2s ease-in;
    -o-transition: -o-transition 0.2s ease-in;
    transition: margin .2s;
}

.front #headertop
{
	position:absolute;
	background-color: rgba(255, 255, 255, 0.9);
}

#header
{
	width:950px;
	margin:auto;
}

#logo
{
	float:left;
	width:119px;
	margin-top:7px;
	margin-right:50px;
}

p a
{
	text-decoration:underline;
}

input.error, .errorborder, textarea.error {
    background: #f8dbdb;
    border: solid 1px;
    border-color: #e77776 !important;
}
.error {
    color: #db1313;
}

#menu
{
	float:left;
}

ul.menu
{
	margin:0px;
}

ul.menu li
{
	display:inline-block;
}


ul.menu li a
{
	color:#333333;
	font-size:16px;
	display:block;
	height:85px;
	line-height:85px;
	border-top: 3px solid rgba(181, 188, 0, 0);
	-webkit-transition: border 0.5s ease;
	-moz-transition: border 0.5s ease;
	-o-transition: border 0.5s ease;
	transition: border 0.5s ease;
	padding-left:20px;
	padding-right:20px;
	width:100%;

	
}


ul.menu li a:hover
{
	color:#b5bc00;
	border-top: 3px solid rgba(181, 188, 0, 0.9);
	-webkit-transition: border 0.5s ease;
	-moz-transition: border 0.5s ease;
	-o-transition: border 0.5s ease;
	transition: border 0.5s ease;

	
}

#content
{
	width:950px;
	margin:auto;
	padding-top:50px;

}

#wrapper
{
	min-height:100%;
   position:relative;
}


.project
{
	float:left;
	vertical-align:top;
	width:310px;
	margin-right:10px;
	margin-bottom:10px;
	position:relative;
	z-index:1;
	overflow:hidden;
}


.projecthover
{
	width:310px;
	height:200px;
	background-image:url('../images/projecten/hover.png');
	position:absolute;
	top:0px;
	left:-310px;
	z-index:100;
	-webkit-transition: left 0.5s ease;
	-moz-transition: left 0.5s ease;
	-o-transition: left 0.5s ease;
	transition: left 0.5s ease;
}


.project:hover .projecthover
{
	left:0px;
	-webkit-transition: left 0.5s ease;
	-moz-transition: left 0.5s ease;
	-o-transition: left 0.5s ease;
	transition: left 0.5s ease;
}


.project img
{
	margin:0px;
	vertical-align:middle;
}

.project:nth-child(3n+3)
{
	margin-right:0px;
}

.project .projectnaam
{
	width:100%;
	height:40px;
	line-height:40px;
	text-align:center;
	background-color:rgba(255,255,255,0.8);
	position:absolute;
	bottom:0px;
	z-index:101;
}

#jquery-fullsizable {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  z-index: 999;
}
#jquery-fullsizable.fullsized_spinner {
  background-image: url(data:image/gif;base64,R0lGODlhEAAQAPIAAAAAAP///zw8PLy8vP///5ycnHx8fGxsbCH+GkNyZWF0ZWQgd2l0aCBhamF4bG9hZC5pbmZvACH5BAAKAAAAIf8LTkVUU0NBUEUyLjADAQAAACwAAAAAEAAQAAADMwi63P4wyklrE2MIOggZnAdOmGYJRbExwroUmcG2LmDEwnHQLVsYOd2mBzkYDAdKa+dIAAAh+QQACgABACwAAAAAEAAQAAADNAi63P5OjCEgG4QMu7DmikRxQlFUYDEZIGBMRVsaqHwctXXf7WEYB4Ag1xjihkMZsiUkKhIAIfkEAAoAAgAsAAAAABAAEAAAAzYIujIjK8pByJDMlFYvBoVjHA70GU7xSUJhmKtwHPAKzLO9HMaoKwJZ7Rf8AYPDDzKpZBqfvwQAIfkEAAoAAwAsAAAAABAAEAAAAzMIumIlK8oyhpHsnFZfhYumCYUhDAQxRIdhHBGqRoKw0R8DYlJd8z0fMDgsGo/IpHI5TAAAIfkEAAoABAAsAAAAABAAEAAAAzIIunInK0rnZBTwGPNMgQwmdsNgXGJUlIWEuR5oWUIpz8pAEAMe6TwfwyYsGo/IpFKSAAAh+QQACgAFACwAAAAAEAAQAAADMwi6IMKQORfjdOe82p4wGccc4CEuQradylesojEMBgsUc2G7sDX3lQGBMLAJibufbSlKAAAh+QQACgAGACwAAAAAEAAQAAADMgi63P7wCRHZnFVdmgHu2nFwlWCI3WGc3TSWhUFGxTAUkGCbtgENBMJAEJsxgMLWzpEAACH5BAAKAAcALAAAAAAQABAAAAMyCLrc/jDKSatlQtScKdceCAjDII7HcQ4EMTCpyrCuUBjCYRgHVtqlAiB1YhiCnlsRkAAAOwAAAAAAAAAAAA==);
  background-position: 50% 50%;
  background-repeat: no-repeat;
}
#jquery-fullsizable #fullsized_image_holder img {
  display: block;
  margin: 0 auto;
}

#thumbs a
{
	float:left;
	margin-right:5px;
	margin-bottom:5px;
}

#thumbs a:nth-child(3n+3) {
    margin-right: 0px;
}

#contentlinks
{
	width:325px;
	float:left;
	margin-right:50px;
	margin-bottom:100px;

}

#contentrechts
{
	width:575px;
	float:right;
	margin-bottom:100px;
}

.headerpic
{
	margin-bottom:30px;
}

#thumbs
{
	margin-bottom:30px;
}

.not-front h1
{
	text-shadow:none;
	color:#333333;
	font-size:32px;
	font-weight:500;
}

.not-front h2
{
	border-bottom:solid 1px #e3e2e3;
	padding-bottom:30px;
	margin-bottom:30px;
	text-shadow:none;
	color:#777777;
	font-size:24px;
	font-weight:500;
}

.basic h1
{
	border-bottom:solid 1px #e3e2e3;
	padding-bottom:30px;
	margin-bottom:30px;
}

.not-front p
{
	color:#333333;
	font-size:14px;
	text-shadow:none;
	font-weight:300;
	line-height:20px;
	margin-bottom:20px;
}

.not-front p.quote
{
	background-color:#f6f6f6;
	border-left:solid 3px #b5bc00;
	padding-left:20px;
	padding-top:15px;
	padding-bottom:15px;
	padding-right:20px;
}

p.leftheader
{
	font-weight:700;
	font-size:14px;
	margin-bottom:0px;
	padding-bottom:0px;
}

.clear
{
	clear:both;
}

.row p
{
	margin-top:0px;
	padding-top:0px;
	margin-bottom:0px;
	padding-bottom:0px;
}

.row
{
	border-bottom:solid 1px #e3e2e3;
	padding-top:15px;
	padding-bottom:15px;
}

p.header
{
	font-size:16px;
	font-weight:700;
	background-color:#f6f6f6;
	padding:5px;
	margin:0px;
}

#fullsized_go_prev, #fullsized_go_next, #fullsized_close, #fullsized_fullscreen {
      position: absolute;
      top: 50%;
      display: block;
        height: 63px;
    width: 63px;
      
    }
    #fullsized_go_prev {
      left: 25px;
    }
    #fullsized_go_next {
      right: 25px;
    }
	
	#fullsized_go_next
	{
		    background-image: url('../images/slideright.png');
	}
	
	#fullsized_go_prev
	{
		    background-image: url('../images/slideleft.png');
	}
	
	#fullsized_close
	{
		    background-image: url('../images/close.png');
	}
	
    #fullsized_close {
      top: 0;
      right: 0;
    }
    #fullsized_fullscreen {
      top: 0;
      right: 40px;
	  display:none !important;
    
    }
    :fullscreen #fullsized_fullscreen { background-color: #000000; }
    :-webkit-full-screen #fullsized_fullscreen { background-color: #000000; }
    :-moz-full-screen #fullsized_fullscreen { background-color: #000000; }


#content
{
	  padding-bottom:60px;
}

#button
{
	float:right;
}

a.ghostproject
{
	color:#333333;
	display:block;
	font-size:17px;
	width:225px;
	height:44px;
	border:solid 1px #333333;
	text-align:center;
	line-height:44px;
	background:none;
	margin-top:22px;
}	

input
{
	width:325px;
	height:40px;
	line-height:40px;
	margin-bottom:10px;
	padding-left:10px;
	font-family: "museo-slab",serif;
	font-size:13px;
}

textarea
{
	width:325px;
	height:200px;
	padding:10px;
	font-size:13px;
	margin-bottom:10px;
	font-family: "museo-slab",serif;
}

#footer
{
	width:100%;
	height:50px;
	line-height:50px;
	background-color:#f6f6f6;
	border-top:solid 3px #b5bc00;
	color:#333333;
	text-align:center;
	width:100%;
	position:absolute;
	bottom:0;
	left:0;
}

.peer_icon
{
	 margin-top: -50px;
}

body.contact
{
	background-image:url('../images/bg_contact.jpg');
	background-size:cover;
}


body.weetu
{
	background-image:url('../images/luchtfoto.jpg');
	background-size:cover;
}

#contact
{
	width:325px;
	margin:auto;
}

.contact h1
{
	    font-size: 49px;
    margin-bottom: 30px !important;
}

input[type=submit]
{
	background-color:#b86024;
	border:none;
	color:#ffffff;
	font-family: "museo-slab",serif;
}

.da-thumbs {
	padding:0px;
	margin:0px;
}

.da-thumbs li {
float: left;
    vertical-align: top;
    width: 465px;
    margin-right: 20px;
    margin-bottom: 15px;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

#thumbs .da-thumbs li
{
    width: 105px;
    margin-right: 5px;
    margin-bottom: 5px;
    padding: 0px;
    height: 105px;
    vertical-align: top;
    overflow: visible;
    list-style: none;
}

#thumbs .da-thumbs li a
{
	height:105px;
}

.da-thumbs li:nth-child(2n+2), #thumbs .da-thumbs li:nth-child(3n+3)
{
	margin-right:0px;
}

.da-thumbs li a {
	display: block;
	position: relative;
	border:none;
}
.da-thumbs li a {
	overflow: hidden;
	
}
.da-thumbs li a div {
	position: absolute;
	background: #333;
	background: rgba(181,188,0,0.6);
	width: 100%;
	height: 100%;
}


#da-thumbs li a p
{
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background-color: rgba(255,255,255,0.8);
    position: absolute;
    bottom: 0px;
    z-index: 101;
	text-shadow:none;
	color:#333333;
	margin:0px;
	font-size:16px;
}

#andereprojecten, #andereprojecten2
{
	margin-top:0px;
	margin-bottom:30px;
}

#andereprojecten .da-thumbs li 
{
	width:178px;
	margin-right:15px;
	margin-bottom:0px;
}

#andereprojecten2 .da-thumbs li
{
	width:325px;
}

#andereprojecten #da-thumbs li a p
{
	font-size:12px;
	height: 43px;
    line-height: 16px;
	padding-top:3px;
}

#andereprojecten .da-thumbs li:nth-child(5n+5)
{
	margin-right:0px;
}

#andereprojecten .da-thumbs li  img, #andereprojecten2 .da-thumbs li  img
{
	width:100%;
	height:auto;
}

#headermobile
{
	display:none;
}

.mobilehandler
{
	display:none;
}


@media screen and (min-width: 768px) {
	
	#headermobile
{
	display:none !important; 
}

.mobilehandler
{
	display:none !important;
}
}


@media screen and (max-width: 767px) {
	
	#header
	{
		width:95%;
	}
	
	#content
	{
		width:100%;
	}
	
	#menu, #button
	{
		display:none;
	}
	
	
	
	#contentrechts, #contentlinks
	{
		width:95%;
		float:none;
		margin:auto;
	}
	
	#contentrechts img, #contentlinks img
	{
		width:100%;
		height:auto;
	}
	
	#footer
	{
		height: 65px;
    line-height: 30px;
	}
	
	#content
	{
		padding-bottom:100px;
	}
	
	#andereprojecten .da-thumbs li
	{
		width:47%;
	}
	
	.da-thumbs li:nth-child(2n+2), #thumbs .da-thumbs li:nth-child(3n+3)
	{
		margin-right:5px;
	}
	
	.da-thumbs li
	{
		float:none;
		display:inline-block;
	
	}
	
	.projecten .da-thumbs li
	{
		width:95%;
		height:auto;
		margin-right:0px;
		margin:auto;
		display:block;
		margin-bottom:10px;
	}
	
	.projecten .da-thumbs li img
	{
		width:100%;
		height:auto;
	}
	
	#headermobile
	{
		position: fixed;
		right: 0px;
		background-color: #F3F3F3;
		height: 100%;
		width:170px;
		z-index: 10000;
			-webkit-transition: -webkit-transform 0.2s ease-in;
    -moz-transition: -moz-transition 0.2s ease-in;
    -o-transition: -o-transition 0.2s ease-in;
    transition: margin .2s;
	}
	
	#headermobile ul, #headermobile ul li
	{
		list-style:none;
		    padding: 10px;
    
	}
	
	 #headermobile ul li
	 {
		 border-bottom: solid 1px #dddddd;
	 }
	
	.mobilehandler > div {
    background-color: #666666;
    border-radius: 2px;
    height: 6px;
    margin-bottom: 6px;
    width: 30px;
}

	.mobilehandler
	{
			float: right;
		margin-right: 20px;
		margin-top: 20px;
		cursor:pointer;
		display:block;
	}
	
	#wrapper
	{
		width:100%;
		-webkit-transition: -webkit-transform 0.2s ease-in;
    -moz-transition: -moz-transition 0.2s ease-in;
    -o-transition: -o-transition 0.2s ease-in;
    transition: margin .2s;
	}
	
	#contact
	{
		width:95%;
		margin:auto;
	}
	
	#content input, #content textarea
	{
		width:100%;
	}
	
	body.weetu
	{
		background:none;
	}
	
	#andereprojecten
	{
		width:95%;
		margin:auto;
	}
	
	#andereprojecten .da-thumbs li
	{
		margin-right:5px;
	}
	
	

	
}

@media screen and (max-width: 320px) {
	
	#thumbs .da-thumbs li
	{
		width:30%;
		height:auto;
		max-width:150px;
	}
	
	#thumbs .da-thumbs li a
	{
		height:auto;
	}
	
	#andereprojecten .da-thumbs li
	{
		width:100%;
		display:block;
	}
	
	
}