/*
Theme: Theme
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          **/
/**                                  **/
/** ******************************** **/

body, html {
	padding: 0;
	margin: 0;
}

/* Aanpassing Mentrum */
.breadcrumbcontainer {
	text-align: right;
    margin: 20px 20px;
}
.bgtransparent { background-color: transparent !important; } 




.slinger-container {
	width: 800px;
	height: 360px;
	position: absolute;
	left: -515px;
	top: 225px;
	transform: rotate(-25deg) scale(0.6);
	z-index: -1;
}



.slinger {
	position: absolute;
	top: 125px;
	left: -50px;
	background-repeat: repeat-x;
	background-size: 2031px auto;
	width: 2031px;
	height: 81px;
}




.slingertext {
	background-image: url("images/slinger.png");
	animation: bgScrollRight 30s linear infinite;
	transform: rotate(8deg);
}

.slingersterren {
	background-image: url("images/slinger2.png");
	animation: bgScrollLeft 30s linear infinite;
	transform: rotate(-8deg);
}

@keyframes bgScrollLeft {
	from { background-position: 0 0; }
	to { background-position: -2031px 0; }
}

@keyframes bgScrollRight {
	from { background-position: 0 0; }
	to { background-position: 2031px 0; }
}





.grote-slinger-container {
	width: 100%;
	max-width: 100vw;
	padding: 0;
	margin: 0;
	height: 600px;
	/* aspect-ratio: 4/1; */
	position: absolute;
	left: 0;
	z-index: 1;
	overflow: hidden;
	margin-top: -150px;
}


.slinger-spacer {
	width: 100%;
	max-width: 100vw;
	padding: 0;
	margin: 0;
	height: 300px;
}

.grote-slinger-container div {
	position: absolute;
	top: 0;
	left: calc((-3046px + 100vw) / 4);
	/* left: -25%; */
}

.grote-slinger-container .slinger {
	top: 225px;
	background-size: 3046px auto;
	width: 3046px;
	height: 118px;
}

.grote-slinger-container .slingertext {
	background-image: url("images/slinger.png");
	animation: bgScrollRight2 30s linear infinite;
	transform: rotate(8deg);
}

.grote-slinger-container .slingersterren {
	background-image: url("images/slinger2.png");
	animation: bgScrollLeft2 30s linear infinite;
	transform: rotate(-8deg);
}

@keyframes bgScrollLeft2 {
	from { background-position: 0 0; }
	to { background-position: -3046px 0; }
}

@keyframes bgScrollRight2 {
	from { background-position: 0 0; }
	to { background-position: 3046px 0; }
}




@media (max-width: 1199.98px) {
	.slinger-container {
		left: -480px;
		top: 180px;
		transform: rotate(-25deg) scale(0.5);
	}
}

@media (max-width: 991.98px) {
	.slinger-container {
		left: -485px;
		top: 145px;
		transform: rotate(-25deg) scale(0.4);
	}
}

@media (max-width: 767.98px) {
	.slinger-container {
		left: -459px;
		top: 50px;
		transform: rotate(-22deg) scale(0.3);
	}


	.grote-slinger-container div {
		top: 60px;
		left: -290px;
		transform: scale(0.4);
	}

	.slinger-spacer {
		height: 0;
	}
}

@media (max-width: 575.98px) {

}