/*
Style Responsive
Version: 1.0
Theme_URI: https://www.lemon.nl
Date: 05/2025
Author: Roeland ten Holder | Lemon
Author URI: roeland@lemon.nl
*/

/** ******************************** **/
/**      _____                       **/
/**    _(  _  )__________________    **/
/**   ( | (___)     | ____ |  _  |   **/
/**   |_|_______|_|_|______|_| |_|   **/
/**                                  **/
/**            www.lemon.nl          **/
/**                                  **/
/** ******************************** **/

/************* RESPONSIVE *************/
.desktop 		{ display: block; }
.desktop-inline { display: inline-block; }
.mobile,
.mobile-inline	{ display: none; }


.navbar-toggler {
	display: none;
	padding: 0 10px;
	border: 0;
	position: fixed;
	top: 35px;
	right: 10px;
	color: var(--yellow);
	z-index: +2;
	font-size: 30px;
	width: 60px;
	height: 60px;
	border-radius: 30px;
	background-color: transparent;
	transition: all 0.2s;
}

.navbar-toggler:focus {
	box-shadow: none;
}

@media (max-width: 1221.98px) {
	.plant_element {
		background-position: 150px -90px;
	}
}


/* Bootstrap Breakpoint - Large devices (desktops, 992px and up) */
@media (max-width: 991.98px) {
	.desktop,
	.desktop-inline	{ display: none; }
	.mobile 		{ display: block; }
	.mobile-inline 	{ display: inline-block; }

	.plant_element {
		background-position: 240px -90px;
	}

	#mainmenu {
		position: fixed;
		top: 0px;
		padding-top: 13px;
		left: 0;
		width: 100%;
		z-index: +1;
		background-color: var(--white);
	}

	.navbar-toggler {
		display: unset;
	}

	.navbar-toggler .open 	{ display: inline-block; }
	.navbar-toggler .close 	{ display: none; }
	.navbar-toggler[aria-expanded="true"] .open { display: none; }
	.navbar-toggler[aria-expanded="true"] .close { display: inline-block; }

	.navbar-nav {
		padding-top: 32px;
		padding-bottom: 2px;
	}

	.navbar-nav li:not(.btn) {
		border-bottom: 1px solid rgba(255,214,54,1);
		border-radius: 0;
		text-align: left;
		padding: 0;
	}
	
	.navbar-nav li:not(.btn) a {
		padding-top: 14px;
		padding-bottom: 14px;
		padding-right: 6px;
		padding-left: 6px;
		display: block;
		margin: 0 25px;
		border-radius: 0;
		text-align: left;
	}

	.navbar-nav li.btn {
		padding-top: 14px;
		padding-bottom: 14px;
		margin: 15px 30px;
		text-align: center;

	}

	.navbar-nav li a {
		font-size: 16px;
	}



	body .navbar-toggler.scroll1,
	body .navbar-toggler.scroll2 {
		color: var(--blue);
		background-color: rgba(40,40,106,0.5);
		transition: all 0.2s;
	}

	body .navbar-toggler[aria-expanded="true"].scroll1,
	body .navbar-toggler[aria-expanded="true"].scroll2 {
		background-color: transparent;
	}


}

/* Bootstrap Breakpoint - Medium devices (tablets, 768px and up) */
@media (max-width: 767.98px) {

	.contentpadding-sm	{ padding-top: 	 calc(var(--quartermargin) / 2); 	padding-bottom: calc(var(--quartermargin) / 2); }
	.contentpadding		{ padding-top: 	 var(--quartermargin); 	padding-bottom: var(--quartermargin); }
	.contentpadding-md 	{ padding-top: 	 var(--halfmargin); 	padding-bottom: var(--halfmargin); }
	.contentpadding-lg	{ padding-top: 	 calc(var(--quartermargin) * 3); 	padding-bottom: calc(var(--quartermargin) * 3); }
	.contentpadding-xl	{ padding-top: 	 var(--fullmargin); 	padding-bottom: var(--fullmargin); }
	.contentpadding-xxl	{ padding-top: 	 calc(var(--quartermargin) * 5); 	padding-bottom: calc(var(--quartermargin) * 5); }
	.contentpadding-xxxl	{ padding-top: 	 calc(var(--halfmargin) * 3); 	padding-bottom: calc(var(--halfmargin) * 3); }
	.contentpadding-xxxxl	{ padding-top: 	 calc(var(--quartermargin) * 7); 	padding-bottom: calc(var(--quartermargin) * 7); }

	.tops-sm			{ margin-top: 	 calc(var(--quartermargin) / 2) !important; }
	.tops				{ margin-top: 	 var(--quartermargin) !important; }
	.tops-md 			{ margin-top: 	 var(--halfmargin) !important; }
	.tops-lg			{ margin-top: 	 calc(var(--quartermargin) * 3) !important; }
	.tops-xl			{ margin-top: 	 var(--fullmargin) !important; }
	.tops-xxl			{ margin-top: 	 calc(var(--quartermargin) * 5) !important; }
	.tops-xxxl			{ margin-top: 	 calc(var(--halfmargin) * 3) !important; }
	.tops-xxxxl			{ margin-top: 	 calc(var(--quartermargin) * 7) !important; }
	
	.bottoms-sm			{ margin-bottom: calc(var(--quartermargin) / 2) !important; }
	.bottoms			{ margin-bottom: var(--quartermargin) !important; }
	.bottoms-md 		{ margin-bottom: var(--halfmargin) !important; }
	.bottoms-lg			{ margin-bottom: calc(var(--quartermargin) * 3) !important; }
	.bottoms-xl			{ margin-bottom: var(--fullmargin) !important; }
	.bottoms-xxl		{ margin-bottom: calc(var(--quartermargin) * 5) !important; }
	.bottoms-xxxl		{ margin-bottom: calc(var(--halfmargin) * 3) !important; }
	.bottoms-xxxxl		{ margin-bottom: calc(var(--quartermargin) * 7) !important; }


	/************** LIJF ***************/

	.lijf {
		width: 100%;
	}

	.zone {
		margin: 1px auto;
		text-align: center !important;
	}

	.zone1 { width: 56px; height: 69px; margin-top: 25px; margin-bottom: 10px; }
	.zone2 { width: 200px; height: 69px; }
	.zone3 { width: 152px; height: 69px; }
	.zone4 { width: 120px; height: 69px; }
	.zone5 { width: 152px; height: 69px; }
	.zone6 { width: 136px; height: 69px; }
	.zone7 { width: 80px; height: 280px; }
	.zone8 { width: 144px; height: 69px; }

	.feedback {
		margin: 4px;
		padding: 2px 12px 0;
		width: calc(100% - 8px) !important;
		border-radius: 15px;
		height: calc(100% - 8px);
		letter-spacing: -0.05em;
	}


}

/* Bootstrap Breakpoint - Small devices (landscape phones, 576px and up) */
@media (max-width: 575.98px) {


}
