/*
Theme Name: Kapstudio 2024
Theme URI: http://www.webandnet.nl
Author: C.P.M. Bastiaansen
Author URI: http://www.webandnet.nl/
Description: Template voor Kapstudio.nl op basis van het ontwerp gemaakt door CAPAZ
Version: 2026.1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/


/* @import url('css/bootstrap.min.css'); */

@font-face {
    font-family: 'MarkerFeltWide';
    src: url('fonts/MarkerFeltWide/markerfeltwide.eot');
    src: url('fonts/MarkerFeltWide/markerfeltwide.eot') format('embedded-opentype'),
         url('fonts/MarkerFeltWide/markerfeltwide.woff2') format('woff2'),
         url('fonts/MarkerFeltWide/markerfeltwide.woff') format('woff'),
         url('fonts/MarkerFeltWide/markerfeltwide.ttf') format('truetype'),
         url('fonts/MarkerFeltWide/markerfeltwide.svg#markerfeltwide') format('svg');
		
}

@font-face {
    font-family: 'HelveticaNeue-Bold';
    src: url('fonts/HelveticaNeue-Bold/helveticaneue-bold.eot');
    src: url('fonts/HelveticaNeue-Bold/helveticaneue-bold.eot') format('embedded-opentype'),
         url('fonts/HelveticaNeue-Bold/helveticaneue-bold.woff2') format('woff2'),
         url('fonts/HelveticaNeue-Bold/helveticaneue-bold.woff') format('woff'),
         url('fonts/HelveticaNeue-Bold/helveticaneue-bold.ttf') format('truetype'),
         url('fonts/HelveticaNeue-Bold/helveticaneue-bold.svg#helveticaneue-bold') format('svg');
		
}

@font-face {
    font-family: 'HelveticaNeue-BoldCondensed';
    src: url('fonts/HelveticaNeue-BoldCondensed/helveticaneue-boldcondensed.eot');
    src: url('fonts/HelveticaNeue-BoldCondensed/helveticaneue-boldcondensed.eot') format('embedded-opentype'),
         url('fonts/HelveticaNeue-BoldCondensed/helveticaneue-boldcondensed.woff2') format('woff2'),
         url('fonts/HelveticaNeue-BoldCondensed/helveticaneue-boldcondensed.woff') format('woff'),
         url('fonts/HelveticaNeue-BoldCondensed/helveticaneue-boldcondensed.ttf') format('truetype'),
         url('fonts/HelveticaNeue-BoldCondensed/helveticaneue-boldcondensed.svg#helveticaneue-boldcondensed') format('svg');
		
}

@font-face {
    font-family: 'HelveticaNeueLight';
    src: url('fonts/HelveticaNeue-Light/HelveticaNeueLight.eot');
    src: url('fonts/HelveticaNeue-Light/HelveticaNeueLight.eot') format('embedded-opentype'),
         url('fonts/HelveticaNeue-Light/HelveticaNeueLight.woff2') format('woff2'),
         url('fonts/HelveticaNeue-Light/HelveticaNeueLight.woff') format('woff'),
         url('fonts/HelveticaNeue-Light/HelveticaNeueLight.ttf') format('truetype'),
         url('fonts/HelveticaNeue-Light/HelveticaNeueLight.svg#HelveticaNeueLight') format('svg');
		
}

@font-face {
    font-family: 'HelveticaNeueCondensedBlack';
    src: url('fonts/HelveticaNeue-CondensedBlack/helveticaneue-condensedblack.eot');
    src: url('fonts/HelveticaNeue-CondensedBlack/helveticaneue-condensedblack.eot') format('embedded-opentype'),
         url('fonts/HelveticaNeue-CondensedBlack/helveticaneue-condensedblack.woff2') format('woff2'),
         url('fonts/HelveticaNeue-CondensedBlack/helveticaneue-condensedblack.woff') format('woff'),
         url('fonts/HelveticaNeue-CondensedBlack/helveticaneue-condensedblack.ttf') format('truetype'),
         url('fonts/HelveticaNeue-CondensedBlack/helveticaneue-condensedblack.svg#HelveticaNeueCondensedBlack') format('svg');
}

@font-face {
    font-family: 'HelveticaNeueRegular';
    src: url('fonts/HelveticaNeue/helveticaneue.eot');
    src: url('fonts/HelveticaNeue/helveticaneue.eot') format('embedded-opentype'),
         url('fonts/HelveticaNeue/helveticaneue.woff2') format('woff2'),
         url('fonts/HelveticaNeue/helveticaneue.woff') format('woff'),
         url('fonts/HelveticaNeue/helveticaneue.ttf') format('truetype'),
         url('fonts/HelveticaNeue/helveticaneue.svg#HelveticaNeueRegular') format('svg');
}


/* ---- ANIMATIONS ---- */
@keyframes fadeInAnimation {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes fadeInImageAnimation {
	0% {
		opacity: .3;
	}

	100% {
		opacity: 1;
	}
}

@keyframes fadeInUpAnimation {
	0% {
		top: 5%;
		opacity: .5;
	}

	100% {
		top: 0;
		opacity: 1;
	}
}

@keyframes fadeInLeftToRightAnimation {
	0% {
		left: -50px;
		opacity: .5;
	}

	100% {
		left: 0;
		opacity: 1;
	}
}

@keyframes fadeInRightToLeftAnimation {
	0% {
		right: -50px;
		opacity: .5;
	}

	100% {
		right: 0;
		opacity: 1;
	}
}




/* ==+ ALGEMENE OPMAAK === */
html {
	scroll-behavior: smooth;
}

html,
body {
	height: 100%;
	width: 100%;
	background-color: #F2F2F0;
}

body {
	background-color: #F2F2F0;
	font-family: 'HelveticaNeueLight';
	font-size: 22px;
	line-height: 26px;
	color: #555555;
}

		.container {
			max-width: 1920px!important;
		}

a {
	color: #59574d;
	outline: 0;
	text-decoration: none;
	transition: all .2s ease-in-out;
}

a:hover, a:active, a:focus {
	outline: 0 none!important; 
}

a:hover {
	color: #FFFFFF;
	text-decoration: none;
	transition: all .2s ease-in-out;
}

:hover,
:focus {
	text-decoration: none;
	transition: all .2s ease-in-out;
}

a.read-more {
	position: relative;
	display: block;
	left: 0;
	top: 30px;
}

p {
	margin-bottom: 1em;
}

.brand-text {
	font-family: 'HelveticaNeue-Bold';
	position: absolute;
	top: 5px;
	left: 0;
	color: #aca899;
	font-size: 16px;
}

#studio-kap-en-berk {
	position: relative;
	top: -150px;
}

strong {
	font-family: 'HelveticaNeue-Bold', sans-serif;
}

@media (max-width: 767px) {
	.brand-text {
		text-transform: lowercase;
	}
}




/* ---- HOMEPAGE CAROUSEL ---- */
#fp-slider-wrapper {
	position: relative;
	height: 100vh;
	width: 100vw;
	padding: 0 30px;
	margin-top: 400px;
	margin-bottom: 70px;
}

	#fp-slider-to-content-arrow-down-wrapper {
		position: absolute;
		display: flex;
		flex-direction: row;
		justify-content: center;
		bottom: 0;
		left: 0;
		height: 80px;
		width: 100%;
		z-index: 100000;
	}

			#fp-slider-to-content-arrow-down-wrapper a.fp-slider-to-content-arrow-down:after {
				position: relative;
				display: block;
				content: '';
				height: 20px;
				width: 40px;
				background-image: url('images/arrows/KapenBerk - Projects header - Arrow down.svg');
				background-position: top center;
				background-repeat: no-repeat;
				background-size: contain;
			}


			

#fp-slider-wrapper #myCarousel ,
#fp-slider-wrapper .carousel-inner {
	position: relative;
	height: 100%;
	width: 100%;
}

#fp-slider-wrapper #myCarousel .carousel-inner .carousel-item {
	position: absolute;
	top: 0;
	left: 0;
	height: 100vh;
	width: 100vw;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

#fp-slider-wrapper #myCarousel .carousel-inner .carousel-item img {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	object-fit: cover;
	object-position: center;
}

			/* CHANGE SPEED OF FADING IMAGES CAROUSEL HOMEPAGE */
			#fp-slider-wrapper .carousel-fade .carousel-item {
				transition-duration: 1s;
				transition-property: opacity;
			   }






/* ---- BRAND ---- */
#brand-wrapper {
	position: fixed;
	top: 0;
	left: 0;
	height: auto; /* 400px; */
	max-height: 450px;
	/* padding-bottom: calc( 25% + 70px ); */
	width: 100%;
	/* max-width: 1920px; */
	padding-top: 70px;
	z-index: 0;
}

#brand-wrapper::before {
	display: block;
	content: ''; 
	padding-top: calc( 25% + 70px );
}

/*

#brand-wrapper::before {
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	content: '';
	height: 0;
	padding-top: calc( 25% + 70px );
	width: 100%;
	background-image: url('images/logos/Logo KapStudio.svg');
	background-size: 40% auto;
	background-position: center;
	background-repeat: no-repeat;
	animation: fadeInAnimation 3s;
}
*/



#brand-wrapper .brand-container {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	max-height: 450px;
	width: 100%;
	/* max-width: 1920px; */
	background-image: url('images/logos/Logo KapStudio.svg');
	background-size: clamp( 250px, 40%, 750px) auto;
	background-position: 50% calc( 50% + 35px );
	background-repeat: no-repeat;
	animation: fadeInAnimation 3s;
}












			/* ---- HEADER ---- */
			#header-wrapper {
				position: fixed;
				display: flex;
				flex-direction: row;
				top: 0;
				left: 0;
				width: 100%;
				height: auto; /* 200px; */
				padding: 0 15px;
				z-index: 25000000;
			}

			#header-wrapper::after {
				position: absolute;
				top: 0;
				left: 0;
				display: block;
				content: '';
				height: 100%;
				width: 100%;
				opacity: 0;
				transition: all .5s ease-in-out;
				z-index: 10;
			}

#header-wrapper.drop-background::after {
	/* background: linear-gradient( to bottom, rgba( 0, 0, 0, 0.4), rgba( 0, 0, 0, 0)); */
	background-color: #F2F2F0; /* #FFFFFF; */
	transition: all .5s ease-in-out;
	opacity: 1;
}

#header-wrapper .main-menu-container {
	position: relative;
	width: 100%;
	z-index: 250;
}

#header-wrapper .main-menu-container ul {
	position: relative;
	display: flex;
	flex-basis: 100%;
	flex-flow: row nowrap;
	top: 0;
	left: 0;
	height: 70px; /* 60px; */
	margin-bottom: 0; /* 10px; */
	width: 100%;
}

#header-wrapper .main-menu-container ul li {
	position: relative;
	display: flex;
	flex-flow: column nowrap;
	flex: 1 1 100%;
	margin-right: 30px;
}

#header-wrapper .main-menu-container ul li:last-child {
	margin-right: inherit;
}

#header-wrapper .main-menu-container ul li a {
	font-family: 'HelveticaNeue-Bold';
	font-size: 20px;
	color: #555555;
	text-transform: lowercase;
	line-height: 68px; /* 60px; */
	/* border-bottom: 0 none; /* 1px solid rgba( 255, 255, 255, 0.7); */
	border-bottom: 2px solid #555555;
	transition: all .2s ease-in-out;
}

#header-wrapper .main-menu-container ul li a:hover,
#header-wrapper .main-menu-container ul li a:focus {
	/* 
	color: rgba( 255, 255, 255, 1);
	border-bottom: 1px solid rgba( 255, 255, 255, 1);
	*/
	color: #555555;
	border-bottom: 2px solid #555555;
	text-decoration: none;
	transition: all .2s ease-in-out;
}



			/* ---- START SITE ---- */


			/* === MAIN-MENU-TOP === */
			.navbar-toggle {
				border: 0 none!important;
				z-index: 10000;
			}

			.navbar-toggle .icon-bar {
				background-color: #FFFFFF!important;
			}

			.navbar.navbar-static-top {
				margin-bottom: 0;
			}

			li.menu-item-64 {
				visibility: hidden;
			}

			/* === MAIN-MENU-BOTTOM === */

			.main-menu-bottom li.menu-item-64 {
				display: none;
			}

			.main-menu-bottom {
				background-color: transparent;
				border-top: 0 none;
				color: #FFFEFA;
				z-index: 0;
			}

			.main-menu-bottom.front-page {
				background-color: transparent;
				background-image: url(images/backgrounds/bg_main-nav_home.png);
				background-position: bottom left;
				background-repeat: repeat-x;
				border-top: 0 none;
				opacity: 1;
			}

			.main-menu-bottom.pages {
				background-color: transparent;
				background-image: url(images/backgrounds/bg_main-nav_pages.png);
				background-position: bottom left;
				background-repeat: repeat-x;
				border-top: 0 none;
				color: #FFFEFA;
				margin: 0 30px;
			}


			.main-nav-container {
				position: fixed;
				bottom: 0;
				width: 100%;
				z-index: 30000;
			}

			.navbar.main-menu-bottom {
				min-height: 200px;
				z-index: 0;
			}

			.navbar.main-menu-bottom .container {
				padding-left: 0;
				padding-right: 0;
			}

			.single-page .main-nav-bottom ul {
				padding-left: 30px;
				padding-right: 30px;
			}

			.nav-bar-inverse {
				background-color: transparent;
			}

			.main-menu-bottom ul {
				position: relative;
				bottom: 25px;
				padding: 0 15px;
				width: 100%;
			}

			.main-menu-bottom.pages ul {
				padding: 0!important;
			}

			.main-menu-bottom.single-page ul {
				padding: 0 15px!important;
			}

			.main-menu-bottom li a {
				font-family: 'HelveticaNeue-Bold';
				font-size: 20px;
				font-weight: normal;
				text-transform: lowercase;
				line-height: 0;
				opacity: 1.0;
				padding-left: 0;
				color: rgba(255, 255, 255, 0.7)!important;
				border-top: 2px solid rgba(255, 255, 255, 0.7)!important;
			}

			.main-menu-bottom li a:hover {
				color: rgba(255, 255, 255, 1.0)!important;
				background-color: transparent!important;
				border-top: 2px solid rgba(255, 255, 255, 1.0)!important;
			}

			.main-menu-bottom li.active a,
			.main-menu-bottom li.current-menu-parent a {
				color: rgba(255, 255, 255, 1.0)!important;
				background-color: transparent!important;
				border-top: 2px solid rgba(255, 255, 255, 1.0)!important;
			}

			.main-menu-bottom li:last-child {
				margin-right: 0;
			}


			.pages .main-nav-bottom {
				padding-left: 0;
				padding-right: 0;
			}


/* ---- SITE-WRAPPER ---- */
#site-wrapper {
	position: relative;
	display: table;
	height: 100%;
	width: 100%;
	/*
	background-color: #F2F2F0;
	*/
	background: linear-gradient(to bottom, transparent 0, transparent 100vh, #F2F2F0 100vh, #F2F2F0 100%);
}

			/* === HOMEPAGINA === */
			.logo-home {
			/*	display: block;
				height: 470px;
				overflow: hidden;
				background-image: url(images/logos/logo_desktop.png); */
				background-image: url(images/logos/logo_desktop_Kap_en_Berk.png);
				background-position: right top;
				background-repeat: no-repeat;
				background-size: auto;
				min-height: 470px;
				overflow: hidden;
			}

			.intro-text {
				font-family: 'HelveticaNeueLight';
				font-size: 18px;
				line-height: 22px;
				padding-top: 30px;
				padding-bottom: 14px;
			}

			.intro-text p {
				text-indent: 20px;
				color: #59574d;
			}

			/* === CATERGORY === */
			.category.box {
				margin-bottom: 100px;
				z-index: 100;
				padding: 15px 15px 0;
			}

			.category-item {
				font-family: 'HelveticaNeueLight';
				margin: 0 0 30px 0;
				overflow: hidden;
			}

			.category-item a {
				color: #848071;
			}

			.category-item a:hover,
			.category-item a:focus,
			.category-item a:visited {
				color: #848071;
			}

			.category-item .date-actueel {
				margin-bottom: 20px;
			}

			.category-item table {
				width: 100%!important;
			}

			.category-item h2 {
				font-family: 'HelveticaNeue-Bold';
				font-size: 20px;
				color: #59574d!important;
				line-height: normal;
				margin-top: 0;
			}

			.category-item img {
				width: 100%;
				max-width: 100%;
				height: auto;
				padding: 0;
			}


			.category .item-text {
				position: relative;
				background-color: rgba(255, 255, 255, 0.85);
				height: auto;
				min-height: 100%;
				margin-bottom: -984px;
				padding: 15px 15px 999px 15px;
			}



			/* === CATEGORIE --> PAGE-TITLE == */
			.page-title {
				height: 50px;
				line-height: 50px;
				color: #FFFFFF;
				font-size: 100%;
				margin-top: -10px;
			}


			/* === PROJECTEN === */
			.row.projecten,
			.row.interieur,
			.row.maatwerk,
			.row.architectuur {
			/*	margin: 0 0 100px 0; */
				margin-bottom: 0;
				margin-left: 0;
				margin-right: 0;
				padding-bottom: 100px;
			}

			.project-item,
			.interieur-item,
			.maatwerk-item,
			.architectuur-item {
			/*	margin-bottom: 15px; */
				padding: 15px;
			}

			.projecten .thumb,
			.interieur .thumb,
			.maatwerk .thumb,
			.architectuur .thumb {
				margin-bottom: 5px; /* 10px; */
				padding: 0 0 55.56% 0;
				background-size: cover;
				outline: 1px solid #aca899;
			}

			.project-item:hover .thumb,
			.interieur-item:hover .thumb,
			.maatwerk-item:hover .thumb,
			.architectuur-item:hover .thumb {
				outline: 1px solid #ffffff;
				cursor: pointer;
			}

			.project-item:hover a,
			.interieur-item:hover a,
			.maatwerk-item:hover a,
			.architectuur-item:hover a {
				color: #ffffff;
				cursor: pointer;
			}

			.projecten .title,
			.interieur .title,
			.maatwerk .title,
			.architectuur .title {
				/*height: 30px;*/
				font-size: 16px; /* NIEUW, moet eigenlijk 18px zijn */
				padding: 0;
			}


			.project-item img {
				max-width: 100%;
				height: auto;
			}



			/* ---- PAGES ---- */
			#page-wrapper {
				padding: 100px 0;
			}



			/* ---- CATEGORIES ---- */

			/* ---- CATEGORY ---- */
			#category-wrapper {
				padding: 100px 15px;
			}

#category-wrapper a:hover,
#category-wrapper a:focus {
	text-decoration: none;
}

#category-wrapper a #category-single-item-wrapper .category-single-item-thumbnail-container {
	position: relative;
	height: 0;
	padding-top: 56.25%;
	margin-bottom: 5px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
	transition: all .3s ease-in-out;
}

#category-wrapper a #category-single-item-wrapper .category-single-item-thumbnail-container img {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	object-fit: cover;
	object-position: center;
	transition: all .3s ease-in-out;
}

#category-wrapper a:hover #category-single-item-wrapper .category-single-item-thumbnail-container img {
	transform: scale(1.1);
	overflow: hidden;
	transition: all .3s ease-in-out;
}

/*
#category-wrapper a #category-single-item-wrapper .category-single-item-thumbnail-container::before {
	display: block;
	content: '';
	padding-top: 56.25%;
	outline: 1px solid rgba( 255, 255, 255, 0);
	overflow: hidden;
	transition: all .2s ease-in-out;
}

#category-wrapper a #category-single-item-wrapper:hover .category-single-item-thumbnail-container::before,
#category-wrapper a #category-single-item-wrapper:focus .category-single-item-thumbnail-container::before {
	transform: scale(1.2);
	outline: 1px solid rgba( 255, 255, 255, 1);
	transition: all .2s ease-in-out;
}
*/

#category-wrapper a #category-single-item-wrapper #category-single-item-content-wrapper .category-single-item-title-container h3 {
	font-family: 'HelveticaNeueRegular';
	font-size: 16px; /* NIEUW, moet eigenlijk 18px zijn */
	color: #555555;
	font-weight: normal;
	text-transform: lowercase;
	padding: 0;
	margin-bottom: 35px;
	transition: all .2s ease-in-out;
}

#category-wrapper a #category-single-item-wrapper:hover #category-single-item-content-wrapper .category-single-item-title-container h3,
#category-wrapper a #category-single-item-wrapper:focus #category-single-item-content-wrapper .category-single-item-title-container h3 {
	color: #555555;
	text-decoration: none;
	border: 0 none;
	transition: all .2s ease-in-out;
}



/* ---- CATEGORY --> ACTUEEL ---- */
#category-actueel-wrapper {
	padding: 100px 15px;
}

#category-actueel-wrapper #category-actueel-single-item-wrapper {
	margin-bottom: 35px;
}

#category-actueel-wrapper #category-actueel-single-item-wrapper .category-actueel-single-item-thumbnail-container {
	position: relative;
	height: 0;
	padding-top: 56.25%;
	margin-bottom: 5px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: hidden;
}

#category-actueel-wrapper #category-actueel-single-item-wrapper .category-actueel-single-item-thumbnail-container img {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	object-fit: cover;
	object-position: center;
	overflow: hidden;
	transition: all .3s ease-in-out;
}

#category-actueel-wrapper #category-actueel-single-item-wrapper:hover .category-actueel-single-item-thumbnail-container img {
	transform: scale( 1.1 );
	overflow: hidden;
	transition: all .3s ease-in-out;
}

			

#category-actueel-wrapper #category-actueel-single-item-wrapper #category-actueel-single-item-content-wrapper {
	font-family: 'HelveticaNeueRegular';
	font-size: 16px; /* NIEUW, moet eigenlijk 18px zijn */
	color: #555555;
	font-weight: normal;
	padding: 0;
	margin-bottom: 15px;
	transition: all .2s ease-in-out;
}

#category-actueel-wrapper #category-actueel-single-item-wrapper #category-actueel-single-item-content-wrapper {
	margin-bottom: 0;
}

#category-actueel-wrapper a:hover #category-actueel-single-item-wrapper #category-actueel-single-item-content-wrapper,
#category-actueel-wrapper a:focus #category-actueel-single-item-wrapper #category-actueel-single-item-content-wrapper {
	color: #555555;
	text-decoration: none;
	border: 0 none;
	outline: none;
	transition: all .2s ease-in-out;
}

			#category-actueel-wrapper #category-actueel-single-item-wrapper #category-actueel-single-item-content-wrapper .category-actueel-single-item-title-container_ {
				font-family: 'HelveticaNeueRegular';
				font-size: 16px; /* NIEUW, moet eigenlijk 18px zijn */
				color: #59574E;
				font-weight: normal;
				text-transform: lowercase;
				padding: 0;
				margin-bottom: 35px;
				transition: all .2s ease-in-out;
			}

			#category-actueel-wrapper a:hover #category-actueel-single-item-wrapper #category-actueel-single-item-content-wrapper .category-actueel-single-item-title-container_,
			#category-actueel-wrapper a:hover #category-actueel-single-item-wrapper #category-actueel-single-item-content-wrapper .category-actueel-single-item-title-container_ {
				color: #ffffff;
				text-decoration: none!important;
				border: 0 none!important;
				transition: all .2s ease-in-out;
			}














			/* === SINGLE === */
			/* --> Project
			/* --> Architectuur
			*/
			.single-project,
			.single-architectuur,
			.single-interieur,
			.single-maatwerk {
				height: 100%;
				width: 100%;
				padding: 15px;
			}

			.project-slider,
			.architectuur-slider,
			.interieur-slider {
				height: 100%;
				min-height: 100%;
				max-height: 100%;
				min-height: 100%;
				max-height: 100%;
			}

				@media (max-width: 767px) {
					.project-slider,
					.architectuur-slider,
					.interieur-slider {
			/*				height: 50vh;
						min-height: auto;
						max-height: 50%; */
					}
				}

			.project-slider #slider,
			.architectuur-slider #slider,
			.interieur-slider #slider {
				width: 100%;
				min-width: 100%;
				max-width: 100%;
				max-height: 100%;
				height: 100%;
				padding-bottom: 135px; 
			}

				@media (max-width: 767px) {
					.project-slider #slider,
					.architectuur-slider #slider,
					.interieur-slider #slider {
						padding-bottom: 10px;
					}
				}

			.project-slider #carousel-bounding-box,
			.architectuur-slider #carousel-bounding-box,
			.interieur-slider #carousel-bounding-box {
				height: 100%;
				min-height: 100%;
				max-height: 100%;
				min-width: 100%;
				max-width: 100%;
				padding: 0;
			}

			.project-slider #myCarousel,
			.architectuur-slider #myCarousel,
			.interieur-slider #myCarousel {
				height: 100%;
				min-height: 100%;
				max-height: 100%;
				min-width: 100%;
				max-width: 100%;
			}

			.project-slider .carousel-inner,
			.architectuur-slider .carousel-inner,
			.interieur-slider .carousel-inner {
			/*	position: relative;
				top: 0; */
				height: 100%;
				max-height: 100%;
				width: auto;
				max-width: 100%;
			}

			.project-slider .carousel-inner > .item,
			.architectuur-slider .carousel-inner > .item,
			.interieur-slider .carousel-inner > .item {
				height: 100%;
				min-height: 100%;
				max-height: 100%;
				width: 100%;
				min-width: 100%;
				max-width: 100%;
				background-position: center;
				background-repeat: no-repeat;
				background-size: cover;

			}

			.project-slider .thumbs-slider,
			.architectuur-slider .thumbs-slider,
			.interieur-slider .thumbs-slider {
				clear: both;
				position: fixed;
				display: block;
				bottom: 75px;
				left: 0;
				margin: 0;
				padding: 0 30px;
				height: 55px;
				list-style: none;
				width: 100%;
				z-index: 1002;
			}

			.single-project #slider-thumbs ol,
			.single-architectuur #slider-thumbs ol,
			.single-interieur #slider-thumbs ol {
				display: table;
				position: inherit;
				bottom: 0;
				width: auto;
				overflow: hidden;
				max-height: 55px;
				left: inherit;
				margin-left: inherit;
				text-align: inherit;
				z-index: 1000;
			}




			.button-back-to {
			/*	padding: 0; */
			}

			.button-back-to a {
				display: block;
				height: 50px;
				width: auto;
				text-indent: -9999px;
				background-image: url(images/buttons/btn_back.png);
				background-size: auto 55px;
				background-repeat: no-repeat;
				background-position: left center;
			}

			.project-title {
				margin-left: 0; /* 15px */
				color: #59574d;
			}

			#counter {
				margin-left: 0; /* 15px */
				color: #59574d;
			}



			.single-text {
				color: #FFFFFF;
			}



			/* === INTEREUR === */
			.interieur {
				margin-bottom: 100px;
			}

			.interieur-item img {
				max-width: 100%;
				height: auto;
			}

			.subject-text-button-show,
			.subject-text-button-hide {
				font-family: 'HelveticaNeueLight';
				font-size: 18px;
				text-transform: lowercase;
				display: block;
				position: absolute;
				bottom: 0;
				right: 0;
				height: 26px;
				line-height: 26px;
				width: 32%;
				padding: 0 10px;
				background-color: rgba(255, 255, 255, 0.8);
				z-index: 2002;
				color: #848071;
			}

			a:hover .subject-text-button-show,
			a:focus .subject-text-button-show ,
			a:hover .subject-text-button-hide,
			a:focus .subject-text-button-hide {
				color: #59574d;
			}

			#block {
				font-family: 'HelveticaNeueLight';
				font-size: 18px;
				position: absolute;
				bottom: 0;
				right: 0;
				height: 100%;
				width: 50%;
				padding: 15px 15px 36px 15px;
				background-color: rgba(255, 255, 255, .8);
				z-index: 2001
			}

			#block p {
				color: #59574d;
			}

			#slider-thumbs li {
				display: inline-block;
				margin: 0 10px 0 0;
				border-radius: inherit;
				border: 1px solid #59574d;
				height: 55px;
				width: 85px;
				cursor: pointer;
			}

			#slider-thumbs li.active {
				background-color: transparent;
				height: 55px;
				width: 85px;
				position: relative;
				top: 0;
				border: 1px solid #ffffff;
			}


			#slider-thumbs li img.img-responsive {
			/*	height: 50px; */
				width: 100%;
				max-width: 100%;
				max-height: 100%;
			}



			/* ============ FINISH SCROLL HERE 
			*/
			#thumbs-bwd > span.glyphicon, #thumbs-fwd > span.glyphicon {
				bottom: inherit!important;
				top: inherit!important;
				position: inherit!important;
			}

			#thumbs-bwd {
				clear: both;
				float: left;
				position: relative;
				display: inline-block;
				height: 100%;
			/*	width: 30px; */
				vertical-align: middle;
				z-index: 4000;
				cursor: pointer;
			}

			#thumbs-bwd .arrow-backward {
				height: 100%;
				width: 100%;
				background-image: url(images/arrows/thumbs_arrow_left.png);
				background-repeat: no-repeat;
				background-position: left center;
			}

			#thumbs-fwd .arrow-forward {
				height: 100%;
				width: 100%;
				background-image: url(images/arrows/thumbs_arrow_right.png);
				background-repeat: no-repeat;
				background-position: right center;
			}

			#thumbs-bwd.col-xs-1,
			#thumbs-fwd.col-xs-1 {
				padding-left: 0;
				padding-right: 0;
			}

			#scroll-thumbs-wrapper {
				position: relative;
				float: left;
				padding-left: 0;
				padding-right: 0;
			}

			#scroll-thumbs-wrapper.col-xs-9 {
				padding-left: 0;
				padding-right: 0;
			}

			#thumbs-fwd {
				position: relative;
				float: left;
				height: 100%;
			/*	width: 30px; */
				vertical-align: middle;
				text-align: center;
				z-index: 4000;
				cursor: pointer;
			}

				#thumbs-bwd > span.glyphicon,
				#thumbs-fwd > span.glyphicon {
					position: absolute;
					top: 50%;
					bottom: 50%;
				}

			#slider-thumbs {
				position: relative;
				height: 55px;
				overflow: hidden;
				padding: 0 30px 0 0;
			}

			.scroll-thumbs {
				height: 75px;
				width: 100%;
				overflow-x: scroll;
				overflow-y: hidden;

			}

			.scroll-thumbs::-webkit-scrollbar { 
				width: 0 !important ;
			}

			.scroll-thumbs ol {
				white-space: nowrap;
			}


			.scroll-thumbs ol li {
				display: inline-block;
			}


			.scroll-thumbs::-webkit-scrollbar {
				display: none;
			}

			.counter {
				height: 55px;
			}


/* ---- FOOTER ---- */
#footer-wrapper {
	position: relative;
	font-family: 'HelveticaNeueLight';
	font-size: clamp( 20px, 1.0416667vw, 20px);
	text-transform: lowercase;
	line-height: 30px;
	height: auto;
	min-height: 300px;
	padding: 70px 0;
	background-color: #FFFFFF;
}


#footer-wrapper h3 {
	position: relative;
	visibility: hidden;
	font-family: 'HelveticaNeue-Bold';
	font-size: 20px;
	line-height: 30px;
	margin-bottom: 0; /* 20px; */
}

#footer-wrapper a[href^="tel:"]:hover {
	color: #555555;
	text-decoration: none;
}

#footer-wrapper #custom_post_widget-3046 h3,
#footer-wrapper #custom_post_widget-3048 h3 {
	display: none;
}

#footer-wrapper strong {
	position: relative;
	/* font-family: 'HelveticaNeue-Bold'; */
	font-family: 'HelveticaNeueRegular';
	font-weight: 600;
	margin-bottom: 0; /* 20px; */
}

#footer-wrapper .footer-position-3-container h3 {
	visibility: hidden;
}

#footer-wrapper .footer-position-4-container h3 {
	visibility: hidden;
}

#footer-wrapper .footer-position-5-container img {
	position: relative;
	float: right;
	max-width: 375px;
}

#footer-wrapper #custom_post_widget-3046 figure {
	margin-bottom: 0;
}

#footer-wrapper .footer-position-6-container #custom_post_widget-3048 h3,
#footer-wrapper .footer-position-6-container #custom_post_widget-3050 h3{
	visibility: hidden;
}

			#footer-wrapper a.facebook {
				font-size: 0;
				display: inline-block;
			}

			#footer-wrapper a.facebook:hover,
			#footer-wrapper a.facebook:focus {
				color: #000000;
			}

			#footer-wrapper a.facebook::before {
				display: inline-block;
				font-family: 'Fontawesome';
				font-size: 26px;
				content: '\f082';
			}

			#footer-wrapper a.instagram {
				font-size: 0;
				display: inline-block;
				margin: 0 7px;
			}

			#footer-wrapper a.instagram:hover,
			#footer-wrapper a.instagram:focus {
				color: #000000;
			}

			#footer-wrapper a.instagram::before {
				display: inline-block;
				font-family: 'Fontawesome';
				font-size: 26px;
				content: '\f16d';
			}

			#footer-wrapper a.linkedin {
				font-size: 0;
				display: inline-block;
			}

			#footer-wrapper a.linkedin:hover,
			#footer-wrapper a.linkedin:focus {
				color: #000000;
			}

			#footer-wrapper a.linkedin::before {
				display: inline-block;
				font-family: 'Fontawesome';
				font-size: 26px;
				content: '\f08c';
			}


#footer-copyright-wrapper,
#footer-copyright-wrapper a {
	font-family: 'HelveticaNeue-Light';
	font-size: 16px;
	color: #555555;
	margin-top: 60px;
	transition: all .3s ease-in-out;
}

#footer-copyright-wrapper a:hover {
	border-bottom: 1px solid #555555;
	transition: all .3s ease-in-out;
}

#footer-copyright-wrapper .footer-copyright-container {
	text-align: left;
}

#footer-copyright-wrapper .footer-design-text-container {
	text-align: right;
}





@media (max-width: 767px) {
	body {
		font-size: 16px;
		line-height: 20px;
	}
	
	#brand-wrapper {
		height: 270px;
		padding-bottom: inherit;
		z-index: 0;
	}
	
	#brand-wrapper .brand-container {
		background-size: 70% auto;
		background-position: center calc( 50% + 35px );
		animation: fadeInAnimation 3s;
	}


	/* ---- HEADER ---- */
	#header-wrapper {
		position: fixed;
		width: 100%;
		height: 60px;
		background-color: #FFFFFF!important;
		z-index: 1500;
	}


	/* ---- HEADER --> PAYOFF ---- */
	#header-wrapper #main-mobile-menu-payoff-wrapper {
		position: relative;
		display: flex;
		flex-direction: row;
		align-items: center;
		height: 60px;
		font-family: 'HelveticaNeue-Bold';
		color: #555555;
		font-size: 16px;
		line-height: 20px;
		z-index: 100;
	}


	/* ---- HEADER --> PANCAKE ---- */
	#header-wrapper #main-mobile-menu-pancake-wrapper {
		position: relative;
		height: 60px;
		width: 100%;
		background-image: url('images/icons/KepenBerk\ -\ Menu\ pancake.svg');
		background-position: right center;
		background-size: 30px auto;
		background-repeat: no-repeat;
		z-index: 100;
	}


	/* ---- MAIN MOBILE MENU ---- */
	.main-mobile-menu-container {
		position: absolute;
		top: 0;
		left: 0;
		height: 100vh;
		width: 100vw;
		padding: 60px 0;
		background-color: #FFFFFF;
		z-index: -10px;
		visibility: hidden;
		transition: all .5s ease-in-out;
	}

	.main-mobile-menu-container.open {
		z-index: 10;
		visibility: visible;
		transition: all .5s ease-in-out;
	}

				.main-mobile-menu-container ul li {
					height: 60px;
					line-height: 60px;
					padding: 0 30px;
					border-bottom: 1px solid #59574d;
				}

				.main-mobile-menu-container ul li:first-child {
					border-top: 1px solid #59574d;
				}

	.main-mobile-menu-container ul li a {
		font-family: 'HelveticaNeueRegular';
		font-size: 18px;
		letter-spacing: 1px;
		color: #555555;
		text-transform: lowercase;
	}

	.main-mobile-menu-container ul li.current-menu-item a,
	.main-mobile-menu-container ul li a:hover,
	.main-mobile-menu-container ul li a:focus {
		color: #777777;
		text-decoration: none;
	}
	
	
	
	/* ---- FRONTPAGE --> SLIDER ---- */
	#fp-slider-wrapper {
		padding: 0;
		margin-top: 210px!important;
	}
	
	#fp-slider-wrapper #myCarousel .carousel-inner .carousel-item {
		height: 100%;
		width: 100%;
	}





				/* ---- FRONTPAGE ---- */
				#fp-slider-wrapper { 
					height: 250px;
					margin-bottom: 35px;
				}

				#fp-slider-wrapper #fp-slider-logo-wrapper {
					display: none;
					height: 250px;
				}

				#fp-slider-to-content-arrow-down-wrapper {
					display: none;
				}



	/* ---- SITE ---- */
	#site-wrapper {
		padding: 60px 0 60px 0;
	}
	
	body.home #site-wrapper {
		margin-top: 70px;
        padding: 0 0 60px 0;
        background: linear-gradient(to bottom, transparent 0, transparent 300px, #F2F2F0 300px, #F2F2F0 100%);
    }
	
	
	

				/* ---- PAGES ---- */
				#page-wrapper {
					padding: 35px 0;
				}


	/* ---- CATEGORIES ---- */
	#category-wrapper {
		padding: 35px 0;
	}
	
	#category-wrapper a #category-single-item-wrapper .category-single-item-thumbnail-container {
		position: relative;
		height: 0;
		padding-top: 75%;
	}

				#category-wrapper > div > div > div {
					padding: 0;
				}

				#category-wrapper > div > div > div > a > div > div {
					margin: 0;
				}

				#category-single-item-wrapper {
					position: relative;
					/* left: -30px;
					width: calc( 100vw + 15px );  */
				}

	#category-wrapper a #category-single-item-wrapper {
		border-bottom: 2px solid #8f8975;
		padding: 0;

	}

				#category-wrapper a #category-single-item-wrapper.first {
					border-top: 2px solid #8f8975;
				}

				#category-wrapper a #category-single-item-wrapper .category-single-item-thumbnail-container {
					margin: 0 -15px;
				}

				#category-wrapper a #category-single-item-wrapper .category-single-item-thumbnail-container::before {
					padding-top: 62.5%;
				}

				#category-wrapper a #category-single-item-wrapper #category-single-item-content-wrapper {
					position: relative;
					padding: 5px 0;
				}

				#category-wrapper a #category-single-item-wrapper #category-single-item-content-wrapper .category-single-item-title-container h3 {
					margin-bottom: 0;
				}


				/* ---- CATEGORIES --> ACTUEEL ---- */
				#category-actueel-wrapper {
					padding: 35px 0;
				}

				#category-actueel-wrapper > div > div > div {
					padding: 0;
				}

				#category-actueel-wrapper > div > div > div > a > div > div {
					margin: 0;
				}

				#category-actueel-single-item-wrapper {
					position: relative;
				}

				#category-actueel-wrapper #category-actueel-single-item-wrapper {
					border-bottom: 2px solid #8f8975;
					padding: 1px 0;
					margin-bottom: 0;
				}

				#category-actueel-wrapper #category-actueel-single-item-wrapper.first {
					border-top: 2px solid #8f8975;
				}

	#category-actueel-wrapper #category-actueel-single-item-wrapper .category-actueel-single-item-thumbnail-container {
		margin: 0 -15px;
	}
	
	#category-actueel-wrapper #category-actueel-single-item-wrapper .category-actueel-single-item-thumbnail-container {
		height: 0;
		padding-top: 75%;
	}

				#category-actueel-wrapper #category-actueel-single-item-wrapper .category-actueel-single-item-thumbnail-container::before {
					padding-top: 62.5%;
				}

				#category-actueel-wrapper #category-actueel-single-item-content-wrapper .category-actueel-single-item-date-container {
					font-size: 12px;
				}

				#category-actueel-wrapper #category-actueel-single-item-wrapper #category-actueel-single-item-content-wrapper .category-actueel-single-item-date-container {
					display: none;
				}

				#category-actueel-wrapper #category-actueel-single-item-wrapper #category-actueel-single-item-content-wrapper {
					position: relative;
					padding: 5px 0;
					font-size: 14px;
				}

				#category-actueel-wrapper #category-actueel-single-item-wrapper #category-actueel-single-item-content-wrapper p {
					margin-bottom: 0;
				}

				#category-actueel-wrapper #category-actueel-single-item-wrapper #category-actueel-single-item-content-wrapper .category-actueel-single-item-title-container {
					margin-bottom: 0;
				}

				#category-actueel-wrapper #category-actueel-single-item-wrapper #category-actueel-single-item-content-wrapper .category-actueel-single-item-title-container .category-actueel-single-item-content a {
					font-size: 16px;
					line-height: 20px;
				}





	/* ---- FOOTER ---- */
	#footer-wrapper {
		font-size: 16px;
		line-height: 20px;
	}

	#footer-wrapper h3 {
		font-size: 16px;
		line-height: 20px;
		margin-bottom: 16px;
	}
	
	#footer-wrapper .footer-position-3-container h3 {
		display: none;
	}
	
	#footer-wrapper .footer-position-3-container #custom_post_widget-3046 h3 {
		display: none;
		visibility: inherit;
		margin-bottom: 0;
	}
	
	#footer-wrapper .footer-position-3-container #custom_post_widget-3050 {
		margin-top: 60px;
	}

	#footer-wrapper .footer-position-5-container {
		text-align: right;
	}
	
	#footer-wrapper .footer-position-5-container img {
		max-width: 115px;
	}
	
	
	/* ---- FOOTER --> LOGO ---- */
	#footer-wrapper .footer-position-5-container a {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		text-align: center;
		margin: 0 0 60px 0;
	}
	
	#footer-wrapper .footer-position-5-container img {
		display: block;
		max-width: 70%;
	}
	
	
	/* ---- FOOTER --> COPYRIGHT ---- */
	#footer-copyright-wrapper {
		margin: 60px 0;
	}
	
	#footer-copyright-wrapper, 
	#footer-copyright-wrapper a {
		font-size: 14px;
	}
	
	#footer-copyright-wrapper .footer-copyright-container {
		text-align: center;
		margin: 30px 0 0 0;
	}

	#footer-copyright-wrapper .footer-design-text-container {
		text-align: center;
		margin: 0 0 15px 0;
	}
	
	#footer-copyright-wrapper .footer-design-text-container span {
		display: block;
		width: 100%;
		margin: 5px 0;
	}

}

			@media (min-width: 768px) and (max-width: 979px) {
				.main-menu-bottom.single-page {
					background-color: transparent;
					background-image: url(images/backgrounds/bg_main-nav_pages.png);
					background-position: bottom left;
					background-repeat: repeat-x;
					border-top: 0 none;
					color: #FFFEFA;
					margin: 0 30px;
				}

				.main-menu-bottom.single-page .navbar-collapse {
					margin-right: -15px;
				}

				.main-menu-bottom.single-page ul {
					margin: 0 -30px 0 -15px!important; 
					padding-right: 0!important;
				}

				.main-menu-bottom.single-page ul li:nth-child(2) {
					padding-left: 0;
				}

				.main-menu-bottom.single-page ul li:last-child {
					padding-right: 0;
				}


				.main-menu-bottom li a {
					font-size: 16px;
				}

				.single-project {
					height: 75vh;
					padding-top: 0;
				}

				.single-project #slider {
					padding-left: 15px;
					padding-right: 15px;
					padding-bottom: 80px;
				}


				.single-project .carousel-control {
					display: none;
				}

				.single-project .backbutton-mobile {
					display: inline-block;
					width: 20px;
					height: 45px;
					text-indent: -9999px;
					background-image: url(images/arrows/arrow_back_mobile.png);
					background-position: center;
					background-repeat: no-repeat;
				}

				.single-project-title,
				.single-project-title a {
					font-family: 'HelveticaNeue-Bold';
					font-size: 18px;
					color: #ffffff;
					line-height: 45px;
					padding: 0;
				}

				.single-project-title a:hover {
					text-decoration: none;
				}

				#scroll-thumbs-wrapper {
					padding-left: 0;
					padding-right: 0;
				}

				#slider-thumbs {
					padding: 0;
				}

				.project-slider .thumbs-slider,
				.architectuur-slider .thumbs-slider,
				.interieur-slider .thumbs-slider,
				.maatwerk-slider .thumbs-slider {
					clear: both;
					position: relative;
					display: block;
					left: inherit;
					margin: 85px 0 0 0;
					padding: 0;
					height: 55px;
					list-style: none;
					width: 100%;
					z-index: 1002;
				}


				#block,
				.subject-text-button-show, 
				.subject-text-button-hide {
					width: 42%;
				}

				.single-text {
					padding: 0 15px 120px;
				}

				.single-text p {
					font-family: 'HelveticaNeueLight';
					font-size: 18px;
					line-height: 24px;
					color: #ffffff;
				}

				.single-text h4 {
					font-family: 'HelveticaNeue-Bold';
					font-size: 20px;
					line-height: 24px;
					margin-bottom: 20px;
					color: #ffffff;
				}

				.category.box {
					padding-bottom: 100px!important;
					margin-bottom: 0!important;
				}

				.img-right {
					right: inherit;
					margin-right: -15px;
				}

				.img-left {
					left: 0;
					margin-left: -15px;
				}
			}

@media only screen
  and (min-width: 768px) 
  and (max-width: 1200px) 
  and (orientation: portrait) {
	#brand-wrapper {
		height: 400px;
	}
	  
	#brand-wrapper .brand-container {
		background-size: 55% auto;
	}
	  
	#site-wrapper {
		background: linear-gradient(to bottom, transparent 0, transparent 400px, #F2F2F0 400px, #F2F2F0 100%);
	  }
	  
	#fp-slider-wrapper {
	  margin-top: 400px;
	}
	  
	#fp-slider-wrapper,
	#fp-slider-wrapper #myCarousel,
	#fp-slider-wrapper #myCarousel .carousel-inner,
	#fp-slider-wrapper #myCarousel .carousel-inner .carousel-item {
		height: 600px;
		width: 100%;
	}
	  
	  #footer-wrapper .footer-position-3-container h3 {
		  visibility: inherit;
	  }
	  
	  #footer-wrapper .footer-position-5-container {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		margin-bottom: 60px;
	  }
	  
	  #footer-wrapper .footer-position-6-container h3 {
		  visibility: hidden;
	  }
	  
	#footer-copyright-wrapper .footer-copyright-container {
		text-align: right;
	}

	#footer-copyright-wrapper .footer-design-text-container {
		text-align: left;
	}
}