
/* ############################################################
	FILTER
############################################################ */

/* Resets */
.mdl210-form input:focus, .mdl210-form input:active,
.mdl210-form select:focus, .mdl210-form select:active {
	outline: none;
}


/* Formular */
.mdl210-form fieldset {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
}
@media screen and (min-width: 992px) {
	.mdl210-form fieldset {
		flex-direction: row;
	}
}


/* Allgemeines */
.mdl210-form .form-group {
	position: relative;
	display: flex;
	margin: 0;
	padding: 0;
}
	.mdl210-form .form-group:first-of-type {
		margin-bottom: 20px;
	}
@media screen and (min-width: 992px) {
	.mdl210-form .form-group {
		width: calc((7 * var(--col-width-1)) + (6 * var(--gap)));
	}
	.mdl210-form .form-group:first-of-type {
		width: calc((5 * var(--col-width-1)) + (4 * var(--gap)));
		margin-right: var(--gap);
	}
}
@media screen and (min-width: 1200px) {
	.mdl210-form .form-group {
		width: calc((8 * var(--col-width-1)) + (7 * var(--gap)));
	}
	.mdl210-form .form-group:first-of-type {
		width: calc((4 * var(--col-width-1)) + (3 * var(--gap)));
		margin-bottom: 0;
	}
}


/* Text: Volltextsuche */
.mdl210-form input {
	position: relative;
	width: 100%;
	height: 60px;
	padding: 17px 59px 15px 20px;
	border: none;
	border-radius: 5px;
	background-color: var(--main-color-white);
	font-family: "Gilroy";
	font-style: normal;
	font-weight: 400;
	font-size: 1rem; /* 16px */
	line-height: 1.5;
	letter-spacing: 0.32px;
	color: var(--main-color-1);
	-webkit-appearance: none;
	appearance: none;
}
.mdl210-form input::placeholder /* Standard (Chrome, Edge, Safari, Firefox modern) */ {
	color: var(--main-color-1);
	opacity: 1; /* wichtig für Firefox */
}
.mdl210-form input::-webkit-input-placeholder /* ältere WebKit/Blink-Varianten (Safari/Chrome) */ {
	color: var(--main-color-1);
	opacity: 1; /* wichtig für Firefox */
}
.mdl210-form input::-moz-placeholder /* Firefox (ältere Varianten) */ {
	color: var(--main-color-1);
	opacity: 1; /* wichtig für Firefox */
}
@media screen and (min-width: 1200px) {
	.mdl210-form input {
		height: 75px;
		padding: 26px 73px 21px 25px;
		font-size: 1.25rem; /* 20px */
		letter-spacing: 0.4px;
	}
}


/* Dropdown: Bereich */
.select2-container {
	width: 100%;
}
.select2-container .select2-selection--single {
	height: 60px;
	padding: 17px 54px 15px 20px;
	border-radius: 5px !important;
	background-color: var(--main-color-white);
	font-family: "Gilroy";
	font-style: normal;
	font-weight: 700;
	font-size: 1rem; /* 16px */
	line-height: 1.5;
	letter-spacing: 0.32px;
	color: var(--main-color-1);
}
.select2-container .select2-selection--single .select2-selection__rendered {
	padding: 0;
}
.select2-dropdown {
	z-index: 5;
	top: 2px;
	padding-top: 11px;
	padding-bottom: 11px;
	border: none;
	border-radius: 5px !important;
	background-color: var(--main-color-white);
}
.select2-results__option {
	overflow: hidden;
	padding: 0 20px;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: "Gilroy";
	font-style: normal;
	font-weight: 400;
	font-size: 1rem; /* 16px */
	line-height: 1.5;
	letter-spacing: 0.32px;
	color: var(--main-color-1);
}
.select2-container--default .select2-selection--single {
	border: none;
	border-radius: 5px !important;
	background-color: var(--main-color-white);
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
	color: var(--main-color-1);
}
.select2-container--default .select2-selection--single .select2-selection__clear {
	display: none;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
	top: 28px;
	right: 20px;
	width: 14px;
	height: 9px;
	background-image: url("../../lkw/Images/Elemente/Form_Dropdown_Blau.svg");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	transition: all 300ms var(--cubic-bezier);
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow {
	transform: rotate(180deg);
}
.select2-container--default .select2-results > .select2-results__options {
	max-height: 390px;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
	background-color: transparent;
	color: var(--main-color-7);
}
.select2-container--default .select2-results__option[aria-selected=true], .select2-container--default .select2-results__option--highlighted[aria-selected=true] {
	background-color: transparent;
	font-weight: 700;
	color: var(--main-color-1);
}
@media screen and (min-width: 992px) {
	.select2-container--default:hover .select2-selection--single .select2-selection__arrow {
		background-image: url("../../lkw/Images/Elemente/Form_Dropdown_Rot.svg");
	}
}
@media screen and (min-width: 1200px) {
	.select2-container {
		width: calc((4 * var(--col-width-1)) + (3 * var(--gap)));
	}
	.select2-container .select2-selection--single {
		height: 75px;
		padding: 26px 67px 21px 25px;
		font-size: 1.25rem; /* 20px */
		letter-spacing: 0.4px;
	}
	.select2-dropdown {
		padding-top: 15px;
		padding-bottom: 15px;
	}
	.select2-results__option {
		padding: 0 25px;
		font-size: 1.25rem; /* 20px */
		letter-spacing: 0.4px;
	}
	.select2-container--default .select2-selection--single .select2-selection__arrow {
		top: 35px;
		right: 25px;
		width: 17px;
		height: 11px;
	}
}


/* Button: Suche */
.mdl210-form button.search-button {
	display: inline-block;
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 0;
	width: 59px;
	height: 60px;
	border: none;
	border-radius: 0;
	background-color: transparent;
	background-image: url("../../lkw/Images/Elemente/Form_Search_Blau.svg");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 19px 19px;
	font-size: 0;
	line-height: 0;
	letter-spacing: normal;
}
@media screen and (min-width: 992px) {
	.mdl210-form button.search-button {
		transition: all 300ms var(--cubic-bezier);
	}
	.mdl210-form button.search-button:hover {
		background-image: url("../../lkw/Images/Elemente/Form_Search_Rot.svg");
	}
}
@media screen and (min-width: 1200px) {
	.mdl210-form button.search-button {
		width: 73px;
		height: 75px;
		background-size: 23px 23px;
	}
}


/* ############################################################
	ANSPRECHPARTNER/TEAM
############################################################ */

/* Allgemein */
.mdl210-modul-box {
	position: relative;
	width: 100%;
}


/* Foto */
.mdl210-modul-box .picture-wrapper {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 1 / 0.68;
	/* border-top-left-radius: 10px;
	border-top-right-radius: 10px; */
	overflow: hidden;
}
	.mdl210-modul-box .picture-wrapper img {
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center center;
	}


/* Text */
.mdl210-modul-box .content-wrapper {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	width: 100%;
	padding: 23px 23px 36px 23px;
}
	.mdl210-modul-box .content-wrapper h3 {
		font-size: 1.5rem; /* 24px */
		line-height: 1.25;
		letter-spacing: 0.48px;
	}
	.mdl210-modul-box .content-wrapper p {
		margin-bottom: 0;
	}
	.mdl210-modul-box .content-wrapper p.funktion-paragraph {
		margin-top: 9px;
	}
	.mdl210-modul-box .content-wrapper p.funktion-paragraph + p.action-paragraph {
		margin-top: 23px;
	}
	.mdl210-modul-box .content-wrapper > .action-paragraph:last-of-type a.link-btn {
		margin-bottom: 0;
	}
	.mdl210-modul-box .content-wrapper a.link-btn {
		margin-right: 0;
	}
@media screen and (min-width: 1200px) {
	.mdl210-modul-box .content-wrapper {
		padding: 23px 30px 42px 30px;
		font-size: 1.0625rem; /* 17px */
		letter-spacing: 0.34px;
	}
		.mdl210-modul-box .content-wrapper p.funktion-paragraph {
			margin-top: 3px;
		}
		.mdl210-modul-box .content-wrapper p.funktion-paragraph + p.action-paragraph {
			margin-top: 30px;
		}
}


/* ############################################################
	RASTER
############################################################ */

/* Rastersystem */
.mdl210-modul-box {
	display: inline-flex;
	flex-wrap: wrap;
	width: 100%;
}
	.mdl210-modul-box > .flex-item {
		position: relative;
		margin: var(--gap) var(--gap) 0 0;
		border-radius: 10px;
		background-color: var(--main-color-5);
		overflow: hidden;
	}
@media screen and (max-width: 767.98px) {
	.mdl210-modul-box > .flex-item {
		width: 100%;
		margin-top: 35px;
		margin-right: 0;
	}
	.mdl210-modul-box > .flex-item:nth-child(-n+1) {
		margin-top: 0;
	}
}
@media screen and (min-width: 768px) and (max-width: 991.98px) {
	.mdl210-modul-box > .flex-item {
		width: calc(1/2*100% - (1 - 1/2)*var(--gap));
		margin-top: var(--gap);
	}
	.mdl210-modul-box > .flex-item:nth-child(2n),
	.mdl210-modul-box > .flex-item:last-child {
		margin-right: 0;
	}
	.mdl210-modul-box > .flex-item:nth-child(-n+2) {
		margin-top: 0;
	}
}
@media screen and (min-width: 992px) and (max-width: 1599.98px) {
	.mdl210-modul-box > .flex-item {
		width: calc(1/3*100% - (1 - 1/3)*var(--gap));
		margin-top: var(--gap);
	}
	.mdl210-modul-box > .flex-item:nth-child(3n),
	.mdl210-modul-box > .flex-item:last-child {
		margin-right: 0;
	}
	.mdl210-modul-box > .flex-item:nth-child(-n+3) {
		margin-top: 0;
	}
}
@media screen and (min-width: 1600px) {
	.mdl210-modul-box > .flex-item {
		width: calc(1/4*100% - (1 - 1/4)*var(--gap));
		margin-top: var(--gap);
	}
	.mdl210-modul-box > .flex-item:nth-child(4n),
	.mdl210-modul-box > .flex-item:last-child {
		margin-right: 0;
	}
	.mdl210-modul-box > .flex-item:nth-child(-n+4) {
		margin-top: 0;
	}
}

