@import url('/typo3conf/ext/stadt_lindenberg/Resources/Public/Css/styles.css');

.cb-kontaktbox-wrap {
	--bs-gutter-x: 1.5rem;
	--bs-gutter-y: 0;
	padding-right: calc(var(--bs-gutter-x) * .5);
	padding-left: calc(var(--bs-gutter-x) * .5);
}

.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap {
	padding: 20px;
}

.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-telefon,
.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-email {
	position: relative;
}

.cb-kontaktbox-wrap .cb-kontaktbox-beschreibung-wrap {
	padding: 10px 20px;
}

.cb-kontaktbox-beschreibung-wrap .cb-infobox-titel {
	color: var(--weiss);
	font-size: 32px;
	font-weight: 600;
	margin-bottom: 30px;
}

.cb-kontaktbox-wrap .col-12.col-xxl-8 {
	border-radius: var(--borderradius);
}

.cb-kontaktbox-wrap img {
	border-radius: var(--borderradius);
}

.cb-kontaktbox-wrap .cb-kontaktbox-beschreibung-wrap .cb-kontaktbox-beschreibung {
	color: var(--weiss);
	font-size: 24px;
}

.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-name {
	color: var(--schwarz);
	font-size: 32px;
	font-weight: 600;
	margin-top: 30px;
	margin-bottom: 20px;
}

#contentdunkel .cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-name,
#contentdunkel .cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-position,
#contentdunkel .cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-telefon a,
#contentdunkel .cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-email a {
	color: var(--weiss);
}

.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-position {
	color: var(--schwarz);
	font-size: 24px;
	font-weight: 300;
	margin-bottom: 45px;
}

.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-telefon {
	margin-bottom: 30px;
}

.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-telefon a,
.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-email a {
	color: var(--schwarz);
	font-size: 24px;
	font-weight: 300;
	margin-left: 60px;
	z-index: 9;
}

.cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-telefon span,
.cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-email span {
	background: var(--gelb);
	border-radius: var(--borderradius);
	font-size: 24px;
	margin-right: 15px;
	padding: 10px;
	position: absolute;
	transition: all 0.5s ease;
}

.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-item {
	display: inline-flex;
	position: relative;
}

.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-telefon:hover .cb-kontaktbox-daten-item span,
.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-email:hover .cb-kontaktbox-daten-item span {
	padding-right: 100%;
}

@media (max-width: 1399.98px) {
	.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap {
		padding: 0;
	}

	.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-name {
		margin-top: 20px;
		margin-bottom: 0;
	}

	.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-position {
		margin-bottom: 25px;
		margin-left: 0;
	}
}

@media (max-width: 575.98px) {
	.cb-kontaktbox-beschreibung-wrap .cb-infobox-titel {
		font-size: 24px;
		margin-bottom: 24px;
	}

	.cb-kontaktbox-wrap .cb-kontaktbox-beschreibung-wrap .cb-kontaktbox-beschreibung,
	.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-position,
	.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-telefon a,
	.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-email a {
		font-size: 18px;
		font-weight: 300;
	}

	.cb-kontaktbox-wrap .cb-kontaktbox-daten-wrap .cb-kontaktbox-daten-name {
		font-size: 24px;
	}
}