/*
Theme Name: SYSTƎME D
Theme URI: https://www.systeme-d.com/
Author: Système D
Author URI: https://www.systeme-d.com/
Text Domain: SYSD
*/




.FreightBig_Pro_Light {
	font-family: freight-big-pro, serif;
	font-weight: 300;
	font-style: normal;
}

.FreightBig_Pro_Book {
	font-family: freight-big-pro, serif;
	font-weight: 400;
	font-style: normal;
}

.FreightBig_Pro_Book_Italic {
font-family: freight-big-pro, serif;
font-weight: 400;
font-style: italic;
}

.FreightBig_Pro_Medium {
	font-family: freight-big-pro, serif;
	font-weight: 500;
	font-style: normal;
}

.FreightBig_Pro_Medium_Italic {
	font-family: freight-big-pro, serif;
	font-weight: 500;
	font-style: italic;
}

.FreightBig_Pro_Semibold {
	font-family: freight-big-pro, serif;
	font-weight: 600;
	font-style: normal;
}

.FreightBig_Pro_Semibold_Italic {
	font-family: freight-big-pro, serif;
	font-weight: 600;
	font-style: italic;
}

.FreightDisp_Pro_Bold {
	font-family: freight-display-pro, serif;
	font-weight: 700;
	font-style: normal;
}

.FreightDisp_Pro_Bold_Italic {
	font-family: freight-display-pro, serif;
	font-weight: 700;
	font-style: italic;
}

.FreightDisp_Pro_Book {
	font-family: freight-display-pro, serif;
	font-weight: 400;
	font-style: normal;
}

.FreightDisp_Pro_Book_Italic {
	font-family: freight-display-pro, serif;
	font-weight: 400;
	font-style: italic;
}

a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,
caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline
}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
	display: block
}

body {
	line-height: 1;
}

ol,
ul {
	list-style: none
}

xxxblockquote,
xxxq {
	quotes: none
}

xxxblockquote:after,
xxxblockquote:before,
xxxq:after,
xxxq:before {
	content: '';
	content: none
}

q {
	quotes: "“" "”" "‘" "’";
}
q::before {
		content: open-quote;
}
q::after {
		content: close-quote;
}




*,
:after,
:before {
	-webkit-box-sizing: border-box;
	box-sizing: border-box
}

body {
	font-family: proxima-nova, Helvetica, Arial, sans-serif;
	height: 100%;
	background: #fff;
	font-size: 18px;
	line-height: 1.4;
	color: #444;
	font-weight: 300;
	font-style: normal;
}

h1 {
	margin-bottom: 20px;
	font-size: 28px
}

h2 {
	margin-bottom: 20px;
	font-size: 22px
}

h3 {
	margin-bottom: 15px;
	font-size: 20px
}

p { margin-bottom: 20px }

a {
	border-bottom: 1px solid;
	text-decoration: none;
	-webkit-transition: all .2s ease-in;
	transition: all .2s ease-in;
	text-decoration: none;
	border-bottom-width: 1px!important;
	border-bottom-style: solid
}

small {
	display: block;
	font-size: 0.9em;
	font-weight: 200
}

small.footnote {
	margin-top: -10px;
	margin-bottom: 20px;
	display: block;
	font-weight: 300;
	text-align: center
}

.btn {
	padding: 5px 10px;
	display: inline-block;
	border: 2px solid;
	border-radius: 3px;
	font-size: 18px;
	-webkit-transition: all .2s ease-in;
	transition: all .2s ease-in
}

strong { font-weight: 600 }

.upper { text-transform: uppercase }

.center { text-align: center }

.hidden { visibility: hidden }

.flex {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex
}

body.page-homepage .nav-item.homenav,
body.page-portfolio .nav-item.portfolionav,
body.page-diensten .nav-item.dienstennav,
body.page-contact .nav-item.contactnav,
body.single-project .nav-item.portfolionav {
	background-color: blue;
	color:#fff
}


@media screen and (min-width:671px) {
	.nav-main {
		height: 100vh;
		position: fixed;
		width: 20%
	}
	.content {
		padding-left: 20%
	}
}

@media all and (device-width:768px) and (device-height:1024px) and (orientation:portrait) {
	.nav-main {
		height: 926px
	}
}

@media all and (device-width:768px) and (device-height:1024px) and (orientation:landscape) {
	.nav-main {
		height: 670px
	}
}

@media all and (device-width:736px) and (orientation:landscape) {
	.nav-main {
		height: 306px
	}
}

.nav-main {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 300;
	background: #fff
}

.nav-main a {
	border-bottom: 0
}

.nav-main .nav-item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	color: #fff;
	-webkit-transition: background .2s ease-in;
	transition: background .2s ease-in
}

.nav-main .nav-item:first-child {
	background: #fff
}

.nav-main .nav-item:first-child:hover {
	background: blue;
	color:#fff;
}

.nav-main .nav-item:nth-child(2) {
	background: #fff
}

.nav-main .nav-item:nth-child(2):hover {
	background: blue;
	color:#fff;
}

.nav-main .nav-item:nth-child(3) {
	background: #fff
}

.nav-main .nav-item:nth-child(3):hover {
	background: blue;
	color:#fff;
}

.nav-main .nav-item:nth-child(4) {
	background: #fff
}

.nav-main .nav-item:nth-child(4):hover {
	background: blue;
	color:#fff;
}

.nav-main .nav-item span {
	width: 100%;
	display: block;
	text-align: center
}

@media screen and (max-width:670px) {
	.nav-main .nav-item {
		height: 60px
	}
	.nav-main .nav-item:nth-child(4) {
	/*	-webkit-box-flex: 1.4;
		-ms-flex: 1.4;
		flex: 1.4;
	*/
		border-bottom: 2px solid #000!important;
	}
	.nav-main .nav-item:not(:last-child) {
		border-right: 2px solid #000;
	}
	.nav-main {
		border-right: none!important
	}
	.nav-main .nav-item {
		font-size: 1.4em!important;
	}
}

@media screen and (min-width:671px) {
	.nav-main {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column
	}
	.nav-main .nav-item {
		width: 100%
	}
	.nav-main .nav-item:not(:last-child) {
		border-bottom: 4px solid rgba(255, 255, 255, .2)
	}
}

.projectbanner {
	overflow: hidden;
	background: no-repeat;
	background-position: center center;
	background-size: cover
}

.social {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	border: 2px solid #fff
}

.social .social-link {
	width:33.333%;
	min-height: 70px;
	display: inline-block;
	background: #fff no-repeat 50% 50%;
	background-size: auto 20px;
	border: 2px solid #fff;
	text-indent: -9999em;
	-webkit-transition: background-color .2s ease-in;
	transition: background-color .2s ease-in
}

body.page-contact .social {
	max-width: 132px;
}

@media screen and (max-width:1100px) {
	body.page-contact .social {
		margin: 0 auto;
	}
}

@media screen and (min-width: 1100px) {
	.adreskol1 {
		padding-top:10px;
		float: left;
		margin-right: 2em
	}
	body.page-contact .adreskol2 {
		padding-top:10px;
		float:left;
		margin-right: 2em
	}
	body.page-contact .social {
		width: 132px;
	}
}


body.page-contact .social .social-link {
	min-height: 40px;
	background-size: auto 20px;
	border-radius: 50%;
	height: 40px;
	width: 40px;
}



.social .social-link.twitter {
	background-image: url(_img/X.svg)
}

.social .social-link.facebook {
	background-image: url(_img/facebook.svg)
}

.social .social-link.linkedin {
	background-image: url(_img/linkedin.svg)
}

.social .social-link.instagram {
	background-image: url(_img/instagram-zw.svg)
}


.social .social-link.twitter:hover {
	background-image: url(_img/X_w.svg)
}

.social .social-link.facebook:hover {
	background-image: url(_img/facebook_w.svg)
}

.social .social-link.linkedin:hover {
	background-image: url(_img/linkedin_w.svg)
}

.social .social-link.instagram:hover {
	background-image: url(_img/instagram_w.svg)
}


.social .social-link:hover {
	background-color: blue!important;
}



blockquote {
	width: 100%;
	padding: 40px 0;
	text-align: center;
	font-weight: 100;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center
}

blockquote.homepagequotes {
		width: 100%!important;
		padding: 40px 0!important;
		text-align: center;
		font-weight: 100;
		display: -webkit-box!important;
		display: -ms-flexbox!important;
		display: initial!important;
		-webkit-box-align: initial!important;
		-ms-flex-align: initial!important;
		align-items: initial!important;
}

blockquote span {
	margin: 0 auto;
	width: 80%;
	max-width: 800px;
	display: block;
	font-family: freight-big-pro, serif;
	font-weight: 500;
	font-style: normal;
	font-size: 2em!important;
	line-height: 1.18em
}



blockquote cite {
	margin-top: 10px;
	display: block;
	font-size: 15px;
	font-weight: normal!important;
	font-family: proxima-nova, Helvetica, Arial, sans-serif;
	line-height: 1.2;
}


.projectURL {
	width: 100%;

	text-align: center;
	font-weight: 100;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	border-top:1px solid #444;
	border-bottom: 1px solid #444;
	margin-bottom: 70px
}

.projectURL span {
	margin: 0 auto;
	width: 100%;
	max-width: 800px;
	display: block;
	font-family: freight-big-pro, serif;
	font-weight: 500;
	font-style: normal;
	font-size: 1.7em!important;
	line-height: 1.18em
}

.projectURL span a.weblink {
	padding: 26px 0 26px 0;
	text-decoration: none!important;
	border-bottom: none!important;
	display: block
}

.projectURL:hover {
	border-top:1px solid #fff;
	border-bottom: 1px solid #fff;
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;
}

@media screen and (max-width:901px) {
	.projectURL:hover {
		border-top:1px solid #444!important;
		border-bottom: 1px solid #444!important;
		border-left: 1px solid #444!important;
		border-right: 1px solid #444!important;
	}
}

blockquote span cite.servicecite {
	font-weight: 100!important
}


.caption {
	background: #444;
	text-transform: uppercase;
	color: #fff
}

.caption h1,
.caption h2 {
	margin: 0;
	font-size: 14px;
	font-weight: 300
}

.caption.portfoliolist h2 {
	font-size: 15px;
	font-weight: 400
}

.caption span {
	margin-left: 8px;
	font-size: 14px;
	font-weight: 100;
	color: #000
}

@media screen and (max-width:670px) {
	.caption {
		padding: 20px
	}
	.caption span {
		margin-right: 1em;
		font-size: 0.5em;
	}
	blockquote span {
		font-size: 1.6em!important;
		width: 90%
	}
}

@media screen and (min-width:671px) {
	.caption {
		padding: 30px
	}
}

.video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 25px;
	height: 0
}

.video-container embed,
.video-container iframe,
.video-container object {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%
}

.home,
.page-homepage {
	background: #fff
}

.home .projectbanner,
.page-homepage .projectbanner {
	background-position: center 40%
}

.home blockquote,
.page-homepage blockquote,
.page-contact blockquote,
.page-diensten blockquote {
	color: #000;
	background-color: #fff;
}

.home .nieuws-item,
.page-homepage .nieuws-item,
.page-contact .nieuws-item,
.page-diensten .nieuws-item {
	display: block;
	border: none;
	color: #000
}

.home .nieuws-item small,
.page-homepage .nieuws-item small,
.page-contact .nieuws-item small,
.page-diensten .nieuws-item small {
	color: #000
}

.home .nieuws-item:first-child,
.page-homepage .nieuws-item:first-child,
.page-contact .nieuws-item:first-child,
.page-diensten .nieuws-item:first-child{
	background: #fff
}

.home .nieuws-item:first-child:hover,
.page-homepage .nieuws-item:first-child:hover,
.page-contact .nieuws-item:first-child:hover,
.page-diensten .nieuws-item:first-child:hover {
	background: #fff
}

.home .nieuws-item:last-child,
.page-homepage .nieuws-item:last-child,
.page-contact .nieuws-item:last-child,
.page-diensten .nieuws-item:last-child {
	background: #fff
}

.home .nieuws-item:last-child:hover,
.page-homepage .nieuws-item:last-child:hover,
.page-contact .nieuws-item:last-child:hover,
.page-diensten .nieuws-item:last-child:hover {
	background: #fff
}

.home .nieuws-item span,
.page-homepage .nieuws-item span,
.page-contact .nieuws-item span,
.page-diensten .nieuws-item span{
	margin-left: 8px
}

@media screen and (max-width:670px) {
	.home .projectbanner,
	.page-homepage .projectbanner,
	.page-contact .projectbanner,
	.page-diensten .projectbanner {
		height: 250px
	}
	.home .nieuws-item,
	.page-homepage .nieuws-item,
	.page-contact .nieuws-item,
	.page-diensten .nieuws-item {
		padding: 20px
	}
}

@media screen and (min-width:671px) {
	.home .projectbanner,
	.page-homepage .projectbanner,
	.page-contact .projectbanner,
	.page-diensten .projectbanner {
		height: 550px
	}
	.home .recent,
	.page-homepage .recent,
	.page-contact .recent,
	.page-diensten .recent {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex
	}
	.home .nieuws-item,
	.page-homepage .nieuws-item,
	.page-contact .nieuws-item,
	.page-diensten .nieuws-item {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		padding: 30px
	}
}

.nieuws-item.googlemap {
	padding: 0!important
}

.work,
.page-portfolio {
	background: #fff
}

.work .project,
.page-portfolio .project {
	border-bottom: 2px solid #dbdede;
}

.work .project img,
.page-portfolio .project img {
	width: 100%;
	height: auto;
	display: block
}

.work .project .caption,
.page-portfolio .project .caption {
	padding: 15px;
	position: relative;
	overflow: hidden
}

.page-portfolio .project .caption {
	letter-spacing: 0
}

.work .project .caption span,
.page-portfolio .project .caption span {
	display: block;
	position: absolute;
	right: -80px;
	top: 15px;
	-webkit-transition: right .1s ease-in;
	transition: right .1s ease-in
}

.work .project:hover .caption span,
.page-portfolio .project:hover .caption span {
	right: 15px
}

@media screen and (max-width:900px) {
	.work .project,
	.page-portfolio .project {
		display: block
	}
}

@media screen and (min-width:901px) {
	.work .content,
	.page-portfolio .content {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap
	}
	.work .project,
	.page-portfolio .project {
		width: 50%;
		display: inline-block
	}
	.work .project:nth-child(odd),
	.page-portfolio .project:nth-child(odd) {
		border-right:1px solid #dbdede
	}
	.work .project:nth-child(even),
	.page-portfolio .project:nth-child(even) {
		border-left: 1px solid #dbdede
	}
}

.single-project .detail {

}

.project-detail .intro blockquote,
.single-project .intro blockquote {
	background-color: #f2f2f2;
	color: #000
}

.project-detail .intro .projectbanner,
.single-project .intro .projectbanner {
	background-color: #f2f2f2;
	overflow: hidden;
}

.project-detail .detail,
.single-project .detail {
	background: #f2f2f2
}

.project-detail .detail-content ,
.single-project .detail-content {
	background: #f2f2f2
}

.project-detail .detail-content blockquote,
.single-project .detail-content blockquote {
	margin: 30px 0;
	border-top: 1px solid;
	border-bottom: 1px solid
}

.project-detail .detail-images img,
.single-project .detail-images img {
	width: 100%;
	display: block;
	height: auto;
}

.project-detail .detail-images img:not(:last-child),
.single-project .detail-images img:not(:last-child) {
	margin-bottom: 20px
}

.project-detail .controls,
.single-project .controls {
	height: 50px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	/* background: #fff; */
	position: fixed;
	z-index: 11;
	bottom: 0;
	width: 80%;
	font-weight: bold;
	font-size: 20px;
	line-height: 1;
}



@media screen and (max-width:670px) {
	.project-detail .controls, .single-project .controls {
		width: 100%;
	}
}



.project-detail .controls .back,
.project-detail .controls .next,
.single-project .controls .back,
.single-project .controls .next,
.project-detail .controls a,
.single-project .controls a {
	padding: 17px 20px;
	-webkit-box-flex: 0;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: inline-block;
	border-bottom: none;
	text-transform: uppercase;
	font-size: 14px;
	color: #000;
	-webkit-transition: background .2s ease-in;
	transition: background .2s ease-in;
	background-color: #fff;
}


.single-project .controls a:first-child {
	padding: 17px 24px 17px 16px;
}
.single-project .controls a:nth-child(2),
.single-project .controls a[rel="prev"] {
	padding: 17px 16px 17px 24px;
}

.single-project .controls a[rel="prev"] {
	margin-left: auto;
}



.project-detail .controls .back:hover,
.project-detail .controls .next:hover,
.single-project .controls .back:hover,
.single-project .controls .next:hover,
.project-detail .controls a:hover,
.single-project .controls a:hover {
	background: blue;
	color:#fff;
}

/*
.project-detail .controls .back,
.single-project .controls .back {
	border-right: 4px solid rgba(255, 255, 255, .4)
}

.project-detail .controls .next,
.single-project .controls .next {
	border-left: 4px solid rgba(255, 255, 255, .4)
}
*/

@media screen and (max-width:670px) {
	.project-detail .detail-content,
	.single-project .detail-content {
		padding: 20px 20px 0
	}
	.project-detail .detail-images,
	.single-project .detail-images {
		padding: 20px
	}
}

@media screen and (min-width:671px) {
	.project-detail .detail-content,
	.single-project .detail-content {
		padding: 30px 30px 0
	}
	.project-detail .detail-images,
	.single-project .detail-images {
		padding: 30px
	}
}

@media screen and (max-width:900px) {
	.project-detail .intro .projectbanner,
	.single-project .intro .projectbanner {
		height: 250px
	}
	.project-detail .detail-content blockquote,
	.single-project .detail-content blockquote {
		border-color: #000;
	}
	.project-detail .intro blockquote,
	.single-project .intro blockquote  {
		border-top:2px solid #000;
		border-bottom:2px solid #000;
	}
}

@media screen and (min-width:901px) {
	.project-detail .intro,
	.single-project .intro {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		border-bottom:2px solid #000
	}

	#stickthis {
		z-index: 9
	}
	.xxxproject-detail .intro.fixer,
	.xxxsingle-project .intro.fixer {
		position: fixed;
		top: 60px;
		border-bottom: none;
		width: 80%;
	}

	.project-detail .intro .projectbanner,
	.single-project .intro .projectbanner {
		height: 300px
	}
	.project-detail .intro blockquote,
	.single-project .intro blockquote {
		min-height: 200px
	}
	.project-detail .intro .projectbanner,
	.project-detail .intro blockquote,
	.single-project .intro .projectbanner,
	.single-project .intro blockquote {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1
	}
	.project-detail .detail,
	.single-project .detail {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex
	}

	.xxxproject-detail .detail.fixer,
	.xxxsingle-project .detail.fixer {
		position: absolute;
		top: 360px;
		border-top: 2px solid #000;
	}




	.project-detail .detail-content,
	.single-project .detail-content {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		background: #444;
		color: #fff;
		min-height: calc(100vh - 335px);
	}
	.project-detail .detail-content blockquote,
	.single-project .detail-content blockquote {
		border-color: rgba(255, 255, 255, .4)
	}
	.project-detail .detail-content a,
	.single-project .detail-content a  {
		color: #f8f0df
	}
	.project-detail .detail-images,
	.single-project .detail-images {
		-webkit-box-flex: 2;
		-ms-flex: 2;
		flex: 2
	}
}



.scrollgo1 {

}

.scrollgo2 {
	margin-top: 0;
	padding-top: 2em;
}


.about {
	background: #fff
}

.about .about-intro .projectbanner {
	background-position: center 25%
}

.about .about-intro .description {
	background-color: #78b5b6;
	background: linear-gradient(76deg, #78b5b6, #559c9d);
	color: #fff
}

.about .about-intro .description a {
	color: #f8f0df
}

.about .about-press .press {
	background-color: #594157;
	background: linear-gradient(210deg, #594157, #825f7f);
	color: #fff
}

.about .about-press .press ul {
	margin-left: 30px;
	list-style: disc
}

.about .about-press .press ul li {
	margin-bottom: 5px
}

.about .about-press .press a {
	border: none;
	color: #fff
}

.about .about-press .projectbanner {
	background-position: center 0
}

.about blockquote:first-of-type {
	color: #f8f0df;
	background-color: #444;
	background: linear-gradient(40deg, #444, #606060)
}

.about blockquote:nth-of-type(2) {
	color: #fff;
	background-color: #78b5b6;
	background: linear-gradient(120deg, #78b5b6, #559c9d)
}

@media screen and (max-width:670px) {
	.about .projectbanner {
		height: 250px
	}
	.about .description,
	.about .press {
		padding: 20px
	}
}

@media screen and (min-width:671px) {
	.about .description,
	.about .press {
		padding: 40px
	}
}

@media screen and (min-width:671px) and (max-width:900px) {
	.about .projectbanner {
		height: 350px
	}
}

@media screen and (min-width:901px) {
	.about .about-intro,
	.about .about-press {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex
	}
	.about .description,
	.about .press,
	.about .projectbanner {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1
	}
}


.nav-main .nav-item {
	font-family: freight-big-pro, serif;
	font-weight: 300;
	font-style: normal;
	font-size: 2em;
	letter-spacing: 1px;
	text-transform: lowercase
}

.nav-main .nav-item:first-child {
	background: #fff;
	color: #000;
	border-bottom: 2px solid #000!important;
}

.nav-main .nav-item:nth-child(2) {
	background: #fff;
	color: #000;
	border-bottom: 2px solid #000!important;
}
.nav-main .nav-item:nth-child(3) {
	background: #fff;
	color: #000;
	border-bottom: 2px solid #000!important;
}
.nav-main .nav-item:nth-child(4) {
	background: #fff;
	color: #000;
}
.home .projectbanner,
.page-homepage .projectbanner {
	background-image: none;
	background-position: center 40%;
	text-align: center;
	overflow: hidden;
	background-color: #f2f2f2
}
.home .projectbanner img,
.page-homepage .projectbanner img {
	width: 90%;
	transform: rotate(-2deg);
	margin-top: 2em;
	height: auto;
}
.project {
	overflow: hidden;
	text-align: center;
	background-color: #f2f2f2
}
.project img {
	width: 80%!important;
	margin-top: 2em;
	margin: 1.5em auto 1.5em auto
}





.nav-main {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 300;
	background: #fff;
	border-right: 2px solid #000;
}
.caption {
	background: #fff;
	text-transform: uppercase;
	color: #000;
	font-size: 24px!important;
	letter-spacing:1px;
	border-top:none;
}

.tickercaption {
	border-top:2px solid #000;
	border-bottom: 2px solid #000;
}

.tickercaption404 {
	border-bottom: 2px solid #000;
}

.tickercaptionSYSD {
	border-top:none;
	border-bottom: 2px solid #000;
}


.caption h1 {
	font-size: 1.2em;
	line-height: 1;
	font-weight: 500
}

.caption span {
	margin-left: 8px;
	margin-right: 1.1em;
	font-weight: 100;
	color: #000;
	font-size:0.5em;
	letter-spacing: 0.5px;
}

.caption.portfolio h2 {
	text-transform: none;
}

@media screen and (min-width: 671px) {
	.caption {
			padding: 16px 30px;
	}
	.caption.fixer {
			position: fixed;
			z-index: 10;
			top: 0;
			width: 100%;
	}
}

.caption.fixer {
	font-family: freight-big-pro, serif;
	font-weight: 500;
	font-style: normal;
	text-transform: lowercase;
	font-size: 2em!important;
}

.caption.fixer.borderbottom {
	border-bottom: 2px solid #000;
}



.home .nieuws-item small,
.page-contact .nieuws-item small ,
.page-diensten .nieuws-item small {
	color: #000;
}



.page-diensten .nieuws-item.een,
.page-diensten .nieuws-item.twee,
.page-diensten .nieuws-item.drie {
	min-width: 280px!important
}




.page-diensten .nieuws-item.een {
	border-right:2px solid #000;
	border-top: 2px solid #000;
}
.page-diensten .nieuws-item.twee {
	border-right:2px solid #000;
	border-top: 2px solid #000;
}
.page-diensten .nieuws-item.drie {
	border-right:2px solid #000;
	border-top: 2px solid #000;
}
.page-diensten .nieuws-item.vier {
	border-right:2px solid #000;
	border-top: 2px solid #000;
}
.page-diensten .nieuws-item.vijf {
	border-right:2px solid #000;
	border-top: 2px solid #000;
}



@media screen and (min-width: 1063px) {
	.page-diensten .nieuws-item.een {
		border-right: 2px solid #000;
		border-top: none;
	}
	.page-diensten .nieuws-item.twee {
		border-right: 2px solid #000;
		border-top: none;
	}
	.page-diensten .nieuws-item.drie {
		border-right: none;
		border-top: none;
	}
	.page-diensten .nieuws-item.vier {
		border-right: 2px solid #000;
		border-top: none;
	}
	.page-diensten .nieuws-item.vijf {
		border-right: none;
		border-top: none;
	}
}


@media screen and (max-width: 1062px) {
	.page-diensten .nieuws-item.een {
		border-right: 2px solid #000;
		border-top: none;
	}
	.page-diensten .nieuws-item.twee {
		border-right: none;
		border-top: none;
	}
	.page-diensten .nieuws-item.drie {
		border-right: none;
		border-top: 2px solid #000;
	}
	.page-diensten .nieuws-item.vier {
		border-right: 2px solid #000;
		border-top: none;
	}
	.page-diensten .nieuws-item.vijf {
		border-right: none;
		border-top: none;
	}
}





@media screen and (max-width: 715px) {
	.page-diensten .nieuws-item.een {
		border-right:none;
		border-top: none;
	}
	.page-diensten .nieuws-item.twee {
		border-right:none;
		border-top: 2px solid #000;
	}
	.page-diensten .nieuws-item.drie {
		border-right:none;
		border-top: 2px solid #000;
	}
	.page-diensten .nieuws-item.vier {
		border-right:none;
		border-top: none;
	}
	.page-diensten .nieuws-item.vijf {
		border-right:none;
		border-top: 2px solid #000;
	}
}








@media screen and (min-width: 671px) {
	.home .nieuws-item:first-child,
	.page-contact .nieuws-item:first-child {
		background: #fff;
		border-right: 2px solid #000;
	}
}







.home .nieuws-item:last-child,
.page-contact .nieuws-item:last-child ,
.page-diensten .nieuws-item:last-child {
	background: #fff;
}
.home .nieuws-item,
.page-contact .nieuws-item ,
.page-diensten .nieuws-item {
	display: block;
	border: none;
	color: #000;
	width: 100%;
}
.home .recent,
.page-contact .recent ,
.page-diensten .recent {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	border-bottom: 2px solid #000;
	flex-flow: row wrap;
}
.home blockquote,
.page-contact blockquote ,
.page-diensten blockquote {
	color: #000;
	background: #fff;
	border-bottom: 2px solid #000;
}



a {
	border-bottom: 2px solid;
	text-decoration: none;
	color: #000;
	-webkit-transition: all .2s ease-in;
	transition: all .2s ease-in;
}
.home {
	background: #fff;
}
.social {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}


.nieuws-item.chatbox {
	background-color: #fff!important
}



.TickerNews{
		width: 100%;

}
.ti_wrapper{
		width: 100%;
		position: relative;
		overflow: hidden;
}
.ti_slide{
		width: 30000px;
		position: relative;
		left: 0;
		top: 0;
		white-space: nowrap
}
.ti_content{
		width: 9000px;
		position: relative;
		float:left;
}
.ti_news{
		float:left;
}
.ti_news a {
		display: block;
		margin-right: 10px;
		color:black;
		text-decoration: none;
}

.ti_news b {
	font-size: 0.95em;
	font-weight: inherit;
}

.ti_news span {
	font-weight: 300;
	font-size: 0.65em
}


.detail-content {
	position: relative
}

.page-diensten .tickercaption,
.page-contact .tickercaption {
	border-top: none;
}

.recent.noborder {
	border-top:none;
}

@media screen and (min-width: 1100px) {
	.adreskol1 {
		float: left;
		margin-right: 2em
	}
}

@media screen and (max-width: 1100px) {
	div.wpforms-container-full .wpforms-form .wpforms-one-half,
	div.wpforms-container-full .wpforms-form .wpforms-three-sixths,
	div.wpforms-container-full .wpforms-form .wpforms-two-fourths {
		width: 100%!important;
		float: none!important;
		margin-left: 0!important;
	}
	.adreskol1,
	.adreskol2 {
		text-align: center
	}
}

#tawk_5fd89d58df060f156a8d3cd0 {
	text-align: center
}

.newsul li {
	border-bottom:1px solid #000
}

.nieuws-item.stripes {
	background-image: linear-gradient(135deg, blue 10%, white 10%, white 50%, blue 50%, blue 60%, white 60%, white 100%)!important;
	background-size: 14.14px 14.14px!important;
}

.testimonialswiper,
.testimonialswiper .swiper-wrapper ,
.testimonialswiper .swiper-slide {
	background-color: #fff!important
}

.testimonialswiper .swiper-pagination {
	position: static;
}

.testimonialswiper .swiper-pagination .swiper-pagination-bullet {
	cursor: pointer
}

div.wpforms-container-full .wpforms-form .wpforms-field-label {
	font-weight: 400!important;
}

.anderetoplevels {display: none;}


#wpforms-646 {
	display: none;
}

.domtoggler {
	padding: 10px 14px;
	background-color: #ededed;
	display: inline-block;
	text-decoration: none;
	border: none;
	margin-bottom: 1em
}
.domtoggler:hover {
	background-color: blue;
	color:#fff
}

blockquote.noborder {
	border-bottom: none!important;
}

.nieuws-item h2 {
	font-family: freight-big-pro, serif;
	font-weight: 500;
	font-style: normal;
	font-size: 2em;
	line-height: 1.1em
}

blockquote.project_header_quote span{
	font-family: proxima-nova, Helvetica, Arial, sans-serif!important;
	font-family: freight-big-pro, serif!important;
	font-weight: 300!important;
	font-size: 1.5em!important;
	line-height: 1.4!important;
	font-style: normal;
	color: rgba(0,0,0,0.3);
}


@media screen and (max-width:670px) {
	a.weblink {
		color:#444!important;
	}
}

/* Slideshow container */
.slideshow-container {
	position: relative;
	background: #fff;

}

.homeblockquotecontainer {
	border-bottom: 2px solid #000;
	padding: 40px;
}
/* Slides */
.mySlides {
	display: none;
	text-align: center;
}

.mySlides:first-child {
	display: block;
}



/* Next & previous buttons */
.prev, .next {
	cursor: pointer;
	position: absolute;
	top: -40px;
	width: auto;
	color: #000;
	font-weight: bold;
	font-size: 20px;
	line-height: 1;
	user-select: none;
	text-decoration: none;
	border:none;
}

.prev {
	position: absolute;
	left: -40px;
	padding: 12px 20px 12px 6px;
}

/* Position the "next button" to the right */
.next {
	position: absolute;
	right: -40px;
	padding: 12px 6px 12px 20px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
	background-color: blue;
	color: white;
}



/* The dot/bullet/indicator container */
.dot-container {
	text-align: center;
	padding: 12px;
}
/* The dots/bullets/indicators */
.dot {
	cursor: pointer;
	height: 10px;
	width: 10px;
	margin: 0 2px;
	background-color: #bbb;
	border-radius: 50%;
	display: inline-block;
	transition: background-color 0.6s ease;
}

/* Add a background color to the active dot/circle */
.active, .dot:hover {
	background-color: blue;
}

.caption.fixer.borderbottom {
	border-bottom: 2px solid #000
}


div.wpforms-container-full .wpforms-form label.wpforms-error {
	color: #ff0000!important;
}


.wpforms-container input,
.wpforms-container textarea {
	background-clip: padding-box;
	border: 2px solid blue!important;
	color:blue!important;
	box-shadow: none!important;
	border-radius: 0!important;
	background: transparent!important;
	outline: none!important;
}

button.wpforms-submit {
	border: 2px solid blue!important;
	background-color: blue!important;
	color:#fff!important
}

button.wpforms-submit:hover {
	border: 2px solid #009a00!important;
	background-color: #009a00!important;
	color:#fff!important
}

@media screen and (max-width: 901px) {
	#stickthis {
		display: flex!important;
		flex-direction: column!important;
	}
	#stickthis .detail-images {
		order: 1!important;
	}
	.project-detail .detail-content, .single-project .detail-content {
		order: 2!important;
	}

}