/*
Style Responsive
Version: 1.0
Theme_URI: https://www.lemon.nl
Date: 12/2024
Author: Roeland ten Holder | Lemon
Author URI: roeland@lemon.nl
*/

/** ******************************** **/
/**      _____                       **/
/**    _(  _  )__________________    **/
/**   ( | (___)     | ____ |  _  |   **/
/**   |_|_______|_|_|______|_| |_|   **/
/**                                  **/
/**            www.lemon.nl          **/
/**                                  **/
/** ******************************** **/


/* Responsive menu */
.navbar-toggler {
	/* display: none; */
	/* position: fixed; */
	/* padding: 10px 9px; */
	/* right: 16px; */

	position: relative;
	border: 0;
	top: 16px;
	z-index: +2;
	width: 40px;
	height: 40px;
	border-radius: 0;
	background-color: transparent;
	transition: all 0.2s;
}

.navbar-toggler span.text {
    display: block;
    position: absolute;
    top: 11px;
    left: 33px;
}

/* Closed show hamhurger */
.navbar-toggler:focus {
	box-shadow: none;
}

.navbar-toggler-inner,
.navbar-toggler-inner::before,
.navbar-toggler-inner::after {
	display: block;
	width: 20px;
	height: 2px;
	background-color: var(--black);
	border-radius: 0;
	position: absolute;
	transition-property: transform;
	transition-duration: 0.15s;
	transition-timing-function: ease;
}
.navbar-toggler-inner::before 									{ content: " "; top: -5px; }
.navbar-toggler-inner::after 									{ content: " "; bottom: -5px; }

/* Opened show X */
.navbar-toggler:not(.collapsed) .navbar-toggler-inner 			{ transform: rotate(45deg); }
.navbar-toggler:not(.collapsed) .navbar-toggler-inner::before 	{ opacity: 0; }
.navbar-toggler:not(.collapsed) .navbar-toggler-inner::after 	{ transform: rotate(-90deg); bottom: 0; }


.has-show-filter-button {
	display: none;
}


/************* RESPONSIVE *************/
.desktop 		{ display: block; }
.desktop-inline { display: inline-block; }
.mobile,
.mobile-inline	{ display: none; }


@media (max-width: 1221.98px) {
	.max1200 {
		display: none;
	}

	.navbar-nav > li > a {
		display: inline-block;
		margin: 0 25px 0 0;
	}
}


/* Bootstrap Breakpoint - Large devices (desktops, 992px and up) */
@media (max-width: 991.98px) {

	.hero {
		position: relative;
		display: inline-block;
	}

	.hero .hero-left,
	.hero .hero-right {
		width: 100%;
		min-width: 100%;
	}
}

/* Bootstrap Breakpoint - Medium devices (tablets, 768px and up) */
@media (max-width: 767.98px) {

	.desktop,
	.desktop-inline	{ display: none; }
	.mobile 		{ display: block; }
	.mobile-inline 	{ display: inline-block; }

	h1, .h1								{ font-size: 60px; }
	h2, .h2								{ font-size: 60px; }
	.hero h1, .hero h3					{ font-size: 36px; }
	h3, .h3 							{ font-size: 17px; }
	.portfolio-content h3 				{ font-size: 20px; }
	h4, .h4 							{ font-size: 17px; }
	.quote h4, blockquote				{ font-size: 37px; }

	.tijdlijn-card .bol 				{ font-size: 34px; }
	.number								{ font-size: 68px; }
	.number-prefix						{ font-size: 56px; }
	.number-suffix 						{ font-size: 56px; }

	/* half */
	.contentpadding-sm		{ padding-top: calc(var(--quartmargin) / 2); 	padding-bottom: calc(var(--quartmargin) / 2); }			/* 0.125 */
	.contentpadding 		{ padding-top: calc(var(--quartmargin) * 1); 	padding-bottom: calc(var(--quartmargin) * 1); }			/* 0.250 */
	.contentpadding-md		{ padding-top: calc(var(--quartmargin) * 1.5); 	padding-bottom: calc(var(--quartmargin) * 1.5); }		/* 0.375 */
	.contentpadding-lg		{ padding-top: calc(var(--quartmargin) * 2); 	padding-bottom: calc(var(--quartmargin) * 2); }			/* 0.500 */
	.contentpadding-xl		{ padding-top: calc(var(--quartmargin) * 2.5); 	padding-bottom: calc(var(--quartmargin) * 2.5); }		/* 0.625 */
	.contentpadding-xxl		{ padding-top: calc(var(--quartmargin) * 3); 	padding-bottom: calc(var(--quartmargin) * 3); }			/* 0.750 */
	.contentpadding-xxxl	{ padding-top: calc(var(--quartmargin) * 3.5); 	padding-bottom: calc(var(--quartmargin) * 3.5); }		/* 0.875 */
	.contentpadding-xxxxl	{ padding-top: calc(var(--quartmargin) * 4); 	padding-bottom: calc(var(--quartmargin) * 4); }			/* 1.000 */

	.tops-sm				{ margin-top: calc(var(--quartmargin) / 2); }			/* 0.125 */
	.tops					{ margin-top: calc(var(--quartmargin) * 1); }			/* 0.250 */
	.tops-md 				{ margin-top: calc(var(--quartmargin) * 1.5); }			/* 0.375 */
	.tops-lg				{ margin-top: calc(var(--quartmargin) * 2); }			/* 0.500 */
	.tops-xl				{ margin-top: calc(var(--quartmargin) * 2.5); }			/* 0.625 */
	.tops-xxl				{ margin-top: calc(var(--quartmargin) * 3); }			/* 0.750 */
	.tops-xxxl				{ margin-top: calc(var(--quartmargin) * 3.5); }			/* 0.875 */
	.tops-xxxxl				{ margin-top: calc(var(--quartmargin) * 4); }			/* 1.000 */
	
	.bottoms-sm				{ margin-bottom: calc(var(--quartmargin) / 2); }		/* 0.125 */
	.bottoms				{ margin-bottom: calc(var(--quartmargin) * 1); }		/* 0.250 */
	.bottoms-md 			{ margin-bottom: calc(var(--quartmargin) * 1.5); }		/* 0.375 */
	.bottoms-lg				{ margin-bottom: calc(var(--quartmargin) * 2); }		/* 0.500 */
	.bottoms-xl				{ margin-bottom: calc(var(--quartmargin) * 2.5); }		/* 0.625 */
	.bottoms-xxl			{ margin-bottom: calc(var(--quartmargin) * 3); }		/* 0.750 */
	.bottoms-xxxl			{ margin-bottom: calc(var(--quartmargin) * 3.5); }		/* 0.875 */
	.bottoms-xxxxl			{ margin-bottom: calc(var(--quartmargin) * 4); }		/* 1.000 */


	.headercontainer .logo img {
		max-width: 190px;
		margin: 20px 10px 20px 0px;
	}

	/* Responsive menu */
	.navbar-toggler {
		/* display: none; */
		/* position: fixed; */
		/* padding: 10px 9px; */
		/* right: 16px; */

		position: absolute;
		border: 0;
		top: 32px;
		right: 16px;
		z-index: +2;
		width: 40px;
		height: 40px;
		border-radius: 0;
		background-color: transparent;
		transition: all 0.2s;
	}

	.navbar-toggler span.text {
		display: none;
	}

	.navbar-toggler-inner,
	.navbar-toggler-inner::before,
	.navbar-toggler-inner::after {
		display: block;
		width: 30px;
		height: 3px;
		background-color: var(--black);
		border-radius: 0;
		position: absolute;
		transition-property: transform;
		transition-duration: 0.15s;
		transition-timing-function: ease;
	}
	.navbar-toggler-inner::before 									{ content: " "; top: -9px; }
	.navbar-toggler-inner::after 									{ content: " "; bottom: -9px; }


	#primary-menu {
		margin-top: 0;
		margin-bottom: 15px;
	}

	.navbar-nav {
		background-color: var(--white);
	}

	.navbar-nav li {
		border-bottom: 1px solid rgba(0, 0, 0, 0.4);
	}
	
	.navbar-nav li a {
		padding-top: 14px;
		padding-bottom: 14px;

		display: block;
		margin: 0 1px;

	}
	
	.navbar-nav li.has-language a {
		text-indent: -9999px;
		background-image: url('images/flags/nl.png');
		background-position: calc(var(--bs-gutter-x)* .5) 20px;
		background-repeat: no-repeat;
		background-size: 24px 24px;
	}

	.navbar-nav li.has-language.en a {
		background-image: url('images/flags/en.png');
	}

	.navbar-nav li .sub-menu {
		pointer-events: none !important;
	}

	.navbar-nav li:hover .sub-menu {
		display: none !important;
	}


	
	.navbar-nav li:hover {
		background-color: var(--darkblue-hover);
	}

	.navbar-nav li a:hover {
		color: var(--white);
	}

	.navbar-nav li .sub-menu {
		position: relative;
		opacity: 1;
		display: inline-block;
		display: none;
		max-width: 100%;
		width: 100%;
	}



	.navbar-nav li:hover .sub-menu li a span,
	.navbar-nav li .sub-menu span {
		display: none;
	}



	.top-menu {
		float: none;
		position: absolute;
		right: 70px;
		top: 1px;
	}










	.has-news {
		margin-top: 40px;
	}

	.mobile-tag-relative {
		position: relative;
		top: 0;
	}

	.mobile-tops {
		margin-top: 35px;
	}


	.portfolio-logo {
		max-width: 100%;
		display: inline-block;
		margin: 0 0 30px 0;
		padding-bottom: 10px;
	}

	.portfolio-summary {
		text-align: left;
	}


	.left-news-line {
		height: unset;
	}

	.footer .logo {
		display: block;
	}

	.search-results #searchbox, #searchbox.open {
		margin-bottom: 45px;
	}



	.container.header {
		padding-top: 90px;
		padding-bottom: 160px;
	}
	.photo-col-5 {
		width: 100%;
		
	}
	.photo-col-7 {
		width: 100%;
		min-height: 400px;
	}
	.photocontainer .photo-col:nth-of-type(2) .photo-content,
	.photocontainer .photo-col:nth-of-type(1) .photo-content {
		padding-right: 30px;
		padding-left: 30px;
		float: unset;
	}



	

}

/* Bootstrap Breakpoint - Small devices (landscape phones, 576px and up) */
@media (max-width: 575.98px) {
	.archive .facetwp-facet 			{ font-size: 20px; line-height: 1.25em ;}
	.max1200 {
		display: inline-block;
	}

	.logo img {
		display: inline-block;
		max-width: 300px;
	}

	.archive .facetwp-facet {
		margin-bottom: 25px;
	}
	.has-show-filter-button {
		display: flex;
	}
	.has-filters {
		display: none;
	}


}