.az-navigation ul {
	list-style: none;
	display: flex;
	gap: 10px;
}

.az-navigation li {
	cursor: pointer;
}

.az-navigation li a {
	text-decoration: none;
}

.az-navigation li a.active {
	font-weight: bold;
}


/* Container für die Karten */
#az-results.cards-container {
	/*
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	justify-content: flex-start;
	*/
}

/* Einzelne Karte */
#az-results .card {
	background-color: var(--white);
	border: 1px solid var(--slateblue30);
	border-radius: none;
	width: 100%;
	padding: 20px;
	height: 100%;
	position: relative;
	overflow: hidden;
}
#az-results .card:hover {
	border: 1px solid var(--slateblue);
}

/* Kartenüberschrift */
#az-results .card h3 {
	font-size: 1.25em;
	color: #003366;
	margin-bottom: 10px;
	hyphens: auto;
	hyphenate-limit-chars: auto 3;
	hyphenate-limit-lines: 4;
}

/* Kartentext */
#az-results .card p {
	font-size: 0.95em;
	color: #666;
	margin-bottom: 20px;
}
/* Hintergrund-Logo */
#az-results .card .card-background-logo {
	position: absolute;
	top: 20px;
	right: 20px;
	margin: 0;
	height: calc(100% - 40px);
	width: auto;
	max-width: calc(100% - 40px);
	object-fit: contain;
	object-position: right center;
	filter: grayscale(100%);
	opacity: 0.1;
	z-index: 1;
	pointer-events: none;
	-webkit-transition: var(--transition-normal);
	-moz-transition: var(--transition-normal);
	-o-transition: var(--transition-normal);
	-ms-transition: var(--transition-normal);
	transition: var(--transition-normal);
}

#az-results .card:hover .card-background-logo {
	filter: grayscale(0%);
	opacity: 0.25;
}

#az-results .card .card-top i {
	width: 40px;
	display: inline-block;
}

/* Vordergrund-Content */
#az-results .card .card-top {
	position: relative;
	z-index: 2;
}
/* Details-Button */
#az-results .details-button {
	text-decoration: none;
	background-color: #003366;
	color: white;
	padding: 10px 15px;
	text-align: center;
	border-radius: 3px;
	font-size: 0.9em;
	display: inline-block;
}

#az-results .details-button:hover {
	background-color: #005b99;
}
/* Flexbox Container für Suchfeld und Kategorie-Select */
/*
.search-filter-container {
	display: flex;
	gap: 15px;
	margin-bottom: 20px;
}
*/

/* Suchfeld Styling */
/*
.a-z-filter-container .search-input {
	flex: 1;
	padding: 10px 15px;
	font-size: 1rem;
	border: 1px solid #ccc;
	border-radius: 5px;
	box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1);
}
*/
.a-z-filter-container .search-input,
.a-z-filter-container .select {
	width:100%;
	height: 60px;
	background: var(--slateblue20);
	border: none;
	padding: 14px 5px;
	font-size:var(--text-font-size-small);
	line-height: var(--text-font-line-height-small);
	vertical-align: top;
	display: inline-block;
	color: var(--slateblue-hover-dark) !important;
	border-radius: none;
}
.a-z-filter-container .search-input::placeholder {
	color: var(--slateblue-hover-dark);
}

/* Kategorie-Select Styling */
/*
.a-z-filter-container .category-select {
	width: 250px;
	background: var(--blue);
	color: var(--black60) !important;
}
*/




.a-z-filter-container .select-hidden {
  display: none;
  visibility: hidden;
}

.a-z-filter-container .select {
  cursor: pointer;
  display: inline-block;
  position: relative;
}

.a-z-filter-container .select-styled {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: none;
  color: var(--slateblue-hover-dark);
  -moz-transition: all 0.2s ease-in;
  -o-transition: all 0.2s ease-in;
  -webkit-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in;
  padding: 14px 5px;
	font-size:var(--text-font-size-small);
	line-height: var(--text-font-line-height-small);
}
.a-z-filter-container .select-styled:after {
  content: "";
  width: 0;
  height: 0;
  border: 7px solid transparent;
  border-color: var(--slateblue-hover-dark) transparent transparent transparent;
  position: absolute;
  top: 26px;
  right: 12px;
}
.a-z-filter-container .select-styled:hover {
	color:var(--slateblue-hover-dark);
	background-color: var(--slateblue10);
}
.a-z-filter-container .select-styled:active,
.a-z-filter-container .select-styled.active {
  color:var(--slateblue-hover-dark);
	background-color: var(--slateblue10);

}
.a-z-filter-container .select-styled:active:after,
.a-z-filter-container .select-styled.active:after {
	top: 17px;
	right: 12px;
	border-color: transparent transparent var(--white); transparent;
}

.a-z-filter-container .select-options {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  z-index: 999;
  margin: 0;
  padding: 0;
  list-style: none;
  background-color: var(--slateblue10);
  color: var(--slateblue-hover-dark);
}
.a-z-filter-container .select-options li {
  margin: 0;
  padding: 14px 5px;
	font-size:var(--text-font-size-small);
	line-height: var(--text-font-line-height-small);
  text-indent: 15px;
  border-top: 1px solid var(--black20);
  -moz-transition: all 0.15s ease-in;
  -o-transition: all 0.15s ease-in;
  -webkit-transition: all 0.15s ease-in;
  transition: all 0.15s ease-in;
}
.a-z-filter-container .select-options li:hover,
.a-z-filter-container .select-options li.is-selected {
	color: var(--black);
	background: var(--lightgray-hover);
}
.a-z-filter-container .select-options li[rel="hide"] {
  display: none;
}









/* Flexbox für die A-Z Navigation */
.az-navigation ul {
	display: flex;
	gap: 5px; /* Abstand von 5px nach rechts */
	flex-wrap: wrap;
	background-color: none;
	padding: 0px;
	border-radius: 0px;
	margin-bottom: 0px;
}

.az-navigation li {
	list-style: none;
}

.az-navigation li a {
	width:50px;
	display: inline-block;
	padding: 12px 0px;
	background-color: var(--slateblue20);
	color: var(--slateblue-hover-dark);
	border: 1px solid var(--slateblue);
	border-radius: 0px;
	position: relative;
	font-size: var(--text-font-size-small);
	text-decoration: none;
	text-align: center;
	transition: background-color 0.3s ease;
}

.az-navigation li a:hover {
	background-color: var(--slateblue-hover-dark);
	color: var(--white);
}

/* Anzahl der Beiträge im kleinen Kasten oben rechts */
.az-navigation li a .post-count {
	position: absolute;
	top: -2px;
	right: -2px;
	background-color: var(--slateblue);
	color: var(--white);
	font-size: 0.7rem;
	padding: 1px 3px;
	border-radius: 0;
	line-height: 1;
	min-width: 20px;
	text-align: center;
}



/* Styling für die Akkordeon-Container */
.accordion-container {
	margin-top: 50px;
}

.accordion-item {
	/*
	border: 1px solid #ddd;
	border-radius: 5px;
	*/
	border:none;
	margin-bottom: 20px;
	overflow: hidden;
}

.accordion-header {
	background-color: var(--lightgray);
	padding: var(--mp-xs);
	cursor: pointer;
	position: relative;
	font-size:var(--text-font-size);
	line-height:var(--text-font-line-height);
	-webkit-font-smoothing: antialiased;
	text-transform: uppercase;
}
.accordion-content {
	display: none;
	padding: var(--mp-xs);
	background-color: var(--white);
	border: 1px solid var(--lightgray-hover);
}

/* Optional: Styling für geöffneten Akkordeon-Header */
.accordion-header.active {
	background-color: var(--lightgray-hover);
}


.dienstleistung-content h1{
	color: #111
}

.accordion-header{
	display: flex;
	align-items: center;
	transition: all 0.4s ease-in-out;
	justify-content: space-between;
}

.accordion-header .ac-icon{
	
	transition: all 0.4s ease-in-out;
}
.accordion-header .ac-icon svg{
	display: block;
}
.accordion-header.active .ac-icon{
	transform: rotate(180deg);
	transition: all 0.4s ease-in-out;
}


/* =============================================
###
================================================ */
@media (max-width: 767px) {

}

/* =============================================
###
================================================ */
@media (min-width: 768px) {


}


/* =============================================
###
================================================ */
@media (min-width: 992px) {
	.az-navigation li a {
		width:62px;
		padding: 15px 0px;
		font-size: var(--text-font-size);
	}
	.a-z-filter-container .search-input,
	.a-z-filter-container .select,
	.a-z-filter-container .select-styled,
	.a-z-filter-container .select-options li {
		padding: 14px 12px;
		font-size:var(--text-font-size);
		line-height: var(--text-font-line-height);
	}
}

/* =============================================
###
================================================ */
@media (min-width: 1200px) {


}


