/*   
Theme Name: HNO Praxen Superstyle 2026
Theme URI: http://www.jareksierpinski.de
Description: Ein Theme fuer alle Praxen
Author: Jarek Akara
Author URI: http://www.jareksierpinski.de
*/

:root {
	--schriftfarbe: #003766;
	--dunkelblau: #003766;
	--hellblau: #a7cce8;
	--lichtblau: #d8ebf8;
	--footerfarbe: #a7cce8;
	--kontrast: #003766;
	--weiss: #ffffff;
	--font: 'Jost', Arial, Verdana, sans-serif;
	--shadow: 0 0 5px 2px rgba(0, 0, 0, .2);
}


/* =Layout GLOBAL -------------------------------------------------------------- */

body {
	color: var(--schriftfarbe);
	font-family: var(--font);
	font-size: 100%;
	line-height: 1.4em;
	font-weight: normal;
	background-color: var(--weiss);
}

#mobilenav,
#navi-mb {
	display: none;
}

sup {
	position: relative;
	font-size: 55%;
	line-height: 0;
	vertical-align: baseline;
	top: -.7em;
}

a {
	color: var(--dunkelblau);
	text-decoration: none;
	transition: all .3s ease-out;
}

.entry p a {
	border-bottom: 1px solid transparent;
	border-color: var(--dunkelblau);
}

#main .entry p a:hover {
	color: var(--hellblau)
}

#headerspace {
	transition: all .2s ease-out;
}

.wp-block-columns {
	width: 100%;
}

#main .wp-block-columns {
	align-items: baseline;
}

#footer .wp-block-columns {
	margin-bottom: 0 !important;
}

strong {
	font-weight: 600;
}

.button,
.wp-block-button {
	display: inline-block;
	background-color: var(--hellblau);
	color: var(--dunkelblau);
	border: none;
	font-size: 1.1em;
	padding: .6em 1.5em;
	border-radius: .4em;
	cursor: pointer;
	transition: all .3s ease-out;
	margin-bottom: .5em !important;
	font-family: var(--font);
}

.is-style-bck-brightblue .wp-block-button {
	background-color: #fff;
}

.wp-block-button a:hover {
	background: transparent !important;
	color: #fff !important;
}

.button:hover,
.wp-block-button:hover {
	color: #fff;
	background-color: var(--dunkelblau);
	box-shadow: var(--shadow);
}

.button:hover a,
.wp-block-button:hover a {
	color: #fff;
}

.wp-block-buttons.is-content-justification-center {
	text-align: center;
}

/* POPUP -------------------------------------------------------------- */
#popup {
	position: fixed;
	max-width: 92%;
	width: 100%;
	box-sizing: border-box;
	top: 48%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	z-index: 200000;
	background-color: var(--dunkelblau);
	padding: 1.5em;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.52);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.52);
	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.52);
	border-radius: .7em;
}

.popinner {
	padding: 2em;
	background-color: #fff;
	min-height: 50vh;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.popclose {
	background: url(images/close-white.svg) no-repeat center center;
	width: 1em;
	height: 1em;
	background-size: contain;
	position: absolute;
	right: 1.5em;
	top: 1.5em;
	cursor: pointer;
}

#popup h2.popheader {
	color: #fff;
	font-size: 1.5em;
	line-height: 1.4em;
	text-align: center;
	padding-bottom: 1em;
}

.is-style-bck-darkblue {
	background-color: var(--dunkelblau);
	color: var(--weiss);
}

.is-style-bck-brightblue {
	background-color: var(--hellblau);
	color: var(--dunkelblau);

}

.is-style-bck-white {
	background-color: #fff;
	color: var(--dunkelblau);

}

.is-style-bck-darkblue,
.is-style-bck-white,
.is-style-bck-brightblue {
	width: calc(100vw - 14px);
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: calc(-50vw + 6px);
	margin-right: calc(-50vw + 6px);
	padding-bottom: 4em;
}

/* WRAPPER -------------------------------------------------------------- */

.wrapper,
.is-style-breit {
	width: 100%;
	max-width: 1800px;
	padding-left: 3.2%;
	padding-right: 3.2%;
	box-sizing: border-box;
	margin: auto;
	text-align: left;
}

.is-style-schmalbreit {
	width: 100%;
	max-width: 1200px;
	margin: auto;

	box-sizing: border-box;
}

.slidewrapper {
	width: 100%;
	max-width: 1400px;
	box-sizing: border-box;
	margin: auto;
	text-align: left;
}

.inwrapper,
.intopfooter {
	max-width: 875px;
	width: 100%;
	box-sizing: border-box;
	margin: auto;
	text-align: left;
}

/* HEADER -------------------------------------------------------------- */

#header {
	position: fixed;
	top: 0px;
	right: 0px;
	left: 0px;
	height: auto;
	background-color: var(--weiss);
	z-index: 50000;
	transition: all .3s ease-out;
	font-size: 1.35em;
	padding-top: 1.2em;
	min-height: 60px;
	box-sizing: border-box;
}

.h-holder,
.hd-holder {
	display: flex;
	width: 100%;
}

.hd-1 {
	flex-basis: 40%;
}

.hd-2 {
	flex-basis: 60%;
	text-align: right;
}

.hd-2 figure {
	display: inline-block;
	margin-left: 1em;
}

.hd-2 p.phone {
	display: inline-block;
	vertical-align: top;
	padding: .4em 0;
	background: url(images/phone.svg) no-repeat left center;
	background-size: 1.3em auto;
	padding-left: 1.7em;
}

.hd-2 p.phone:hover {
	animation: hideshow 1s ease infinite;
}

@keyframes hideshow {
	0% {
		background-size: 1.3em
	}

	50% {
		background-size: 1em;
	}

	100% {
		background-size: 1.3em
	}
}

.hd-2 .docto {
	margin-right: .5em;
	margin-left: 1.1em;
}

#header .hd-2 img {
	height: 1.8em;
}

.scrolled h2#logo {
	margin-bottom: .4em
}

body.scrolled #header {
	padding-top: 0.4em;

}

.scrolled #navi {
	border: none;
}

h2#logo {
	margin-right: 10%;
	margin-top: 0.2em;
	margin-bottom: .3em;
}

h2#logo a {
	display: block;
	box-sizing: border-box;
}

h2#logo img {
	transition: all .2s ease-out;
	max-width: 475px;
	width: 100%;
	height: auto;
}

.entry h3 {
	padding-bottom: 1em;
	padding-top: 1em;
	font-size: 1.5em;
	line-height: 1.2em;
}

#main .entry hr {
	border-top: 1px solid transparent;
	border-color: var(--dunkelblau);
}

.hd-widget {
	transition: all .2s ease-out;
	max-height: 3em;
	overflow: hidden;
}

.scrolled .hd-widget {
	max-height: 0;
}

.scrolled h2#logo img {
	max-width: 300px;
}

.scrolled h2#logo {}

/* MENU NAVI -------------------------------------------------------------- */

#navi {
	border-top: 1px solid transparent;
	border-color: var(--dunkelblau);
	width: 100%;
	padding-top: .9em;
	margin-top: .55em;
	text-align: center;
	letter-spacing: .01em;
	transition: all .3s ease-out;
	font-size: 1.1em;
	font-weight: 400;
}

body.scrolled #navi {
	padding-top: .6em;
	padding-bottom: 0;
}

#navi ul {
	list-style: none;
	margin: 0;
	padding-left: 0;

}

#navi ul li {
	display: inline-block;
	vertical-align: top;
	position: relative;
	text-decoration: none;
	margin: 0 3.8%;
	transition-duration: 0.5s;
	padding-bottom: 1em;
}

#navi a {
	display: inline-block;
	vertical-align: top;
	padding-bottom: .1em;
	border-bottom: 2px solid transparent;
}

#navi li:hover,
#navi li:focus-within {
	cursor: pointer;
}

#navi ul li ul {
	font-size: 18px;
	min-width: 15em;
	text-align: left;
	background: var(--dunkelblau);
	visibility: hidden;
	opacity: 0;
	margin: 0;
	position: absolute;
	padding-top: 1em;
	padding-bottom: .5em;
	margin-top: 1em;
	left: -1em;
	height: 0;
	overflow: hidden;
	transition: opacity .3s ease-out;

}

#navi ul li ul.sub-menu:before {
	content: ' ';
	position: absolute;
	top: -14px;
	left: 2em;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 8.5px 14.7px 8.5px;
	border-color: transparent transparent #003766 transparent;
	transform: rotate(0deg);
}

#navi ul li ul li {
	clear: both;
	width: 100%;
	box-sizing: border-box;
	padding-bottom: .1em;
	padding-top: .1em;
	padding-left: 1em;
	padding-right: 1em;
	margin-left: 0;
}

#navi ul li ul li a {
	color: #fff;
	border-bottom: 1px solid transparent;
}

#navi ul li ul li a:hover {
	color: var(--hellblau);
	border-color: var(--hellblau);
}

.scrolled #navi ul li ul {
	padding-top: .65em;
}

#navi ul li:hover>ul,
#navi ul li:focus-within>ul,
#navi ul li ul:hover,
#navi ul li ul:focus {
	visibility: visible;
	opacity: 1;
	overflow: visible;
	height: auto;
}


#navi ul li ul li:last-child {
	padding-bottom: .6em;
}

#navi ul li ul li:hover {}

#navi li:hover>a,
#navi ul ul :hover>a,
#navi ul a.mPS2id-highlight {
	border-bottom: .05em solid transparent;
	border-color: var(--dunkelblau);
}

#navi ul li.current_page_item>a,
#navi ul li.current_page_ancestor>a,
#navi ul li.current-menu-ancestor>a,
#navi ul li.current-menu-item>a,
#navi ul li.current-menu-parent>a {
	border-bottom: .1em solid transparent;
	border-color: var(--dunkelblau);
}

* html #navi ul li.current_page_item a,
* html #navi ul li.current_page_ancestor a,
* html #navi ul li.current-menu-ancestor a,
* html #navi ul li.current-menu-item a,
* html #navi ul li.current-menu-parent a,
* html #navi ul li a:hover {}


/* HEADINGS ÃœBERSCHRIFTEN -------------------------------------------------------------- */


h1.pagetitle {
	display: none;
}

#main .entry h2 {
	margin-top: 1em;
	font-size: 2.25em;
	line-height: 1.3em;
}

#main .entry h2.is-style-bigspace {
	margin-top: 0;
	padding-top: 2.5em;
	padding-bottom: 2.5em;
}

/* MAIN -------------------------------------------------------------- */

#main {
	font-size: 1.4em;
	line-height: 1.42em;
	box-sizing: border-box;
	background-color: var(--lichtblau);
	padding-top: 4em;
}

.entry {
	word-wrap: break-word;
	hyphens: auto;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	overflow-wrap: anywhere;
}

.entry p {
	padding-bottom: 1.5em;
}

.entry ul {
	padding-left: 1em;
	margin-bottom: 1.4em;
	list-style-type: square;
	line-height: 1.3em;
}

.entry ul li {
	padding-bottom: .2em;
}


/* BILDERSLIDER ALLE -------------------------------------------------------------- */

#bildslider {
	margin-bottom: 3em;
	overflow: hidden;
}

#bildslider .swiper-slide {
	padding-bottom: 51.8%;
	background-size: cover;
	position: relative;
}

#bildslider a {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 57%;
	left: 0;
	background: rgb(0, 0, 0);
	background: linear-gradient(90deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.3) 52%, rgba(0, 0, 0, 0) 100%);
}

#bildslider .swiper-slide h2.caption {
	position: absolute;
	color: var(--weiss);
	bottom: 12%;
	left: 0;
	font-size: 1em;
	padding-left: 10%;
	text-align: left;
	font-weight: 400;
}

#bildslider .swiper-slide h2.caption i {
	font-size: .85em;
	display: block;
	padding-top: .3em;
}

#bildslider .swiper-pagination {
	text-align: right;
	display: inline-block;
	width: auto;
	right: .8em;
	bottom: .7em;
}

#main .swiper-pagination-bullet {
	width: .5em;
	height: .5em;
	margin-left: .2em;
	margin-right: .2em;
	background-color: var(--weiss);
	border: 1px solid transparent;
	opacity: 1;
}

#main .swiper-pagination-bullet-active {
	background-color: var(--dunkelblau);
}

#main .imgswiper .swiper-pagination {
	left: 10px;
	bottom: 10px;
	width: auto !important;
}

#main .imgswiper {
	margin-bottom: 2em;
}

.imgswiper .caption {
	position: absolute;
	z-index: 3;
	font-size: .8em;
	padding: .2em 1em;
	background-color: rgba(255, 255, 255, 0.8);
	color: var(--schriftfarbe);
}

.topswiper .swiper-pagination {
	text-align: left;
}
.topswiper .flexi {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
align-content: flex-end;
}
.topswiper .fixinfo {
	flex-basis: auto;
	min-height: 11em;
	margin-bottom: 5%;
}

.topswiper .jslice {
	position: relative;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.topswiper img.slideimg {
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
	width: 100%;
}

.topswiper .jslice:has(.caption) img.slideimg {
	width: 75%;
}

.topswiper .jslice:has(.fixinfo) img.slideimg {
	width: 70%;
	aspect-ratio: 2;
	object-fit: cover;
	object-position: top center;
}

.topswiper .fixinfo .inner {
	text-align: left;
	display: inline-block;
	float: right;
}

.topswiper .fixinfo .inner p {
	padding-bottom: .5em;
}

.topswiper .caption {
	text-align: center;
	width: 60%;
	min-width: 28em;
	background-color: var(--weiss);
	padding: 2em 2.4em;
	box-sizing: border-box;
	align-self: end;
}

.topswiper .caption p {
	padding-bottom: 0;
	font-size: 1.6em;
	line-height: 1.3em;
}

.topswiper .fixinfo a {
	border: none;
}


.wp-block-lazyblock-slider {
	margin-bottom: 3.2em;
}

/* Kacheln -------------------------------------------------------------- */

.angebotkachel .a-foto {
	background-color: var(--hellblau);
	position: relative;
	width: 100%;
	overflow: hidden;
}

.angebotkachel .a-foto:hover {
	background-color: transparent;
}

.angebotkachel .a-foto img {
	aspect-ratio: 3/2;
	width: 100%;
	object-fit: cover;
	filter: grayscale(100%);
	transition: all 0.5s ease;
}

.blende {
	mix-blend-mode: multiply;
	background-color: var(--hellblau);
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	transition: opacity .3s ease-out;
}

.angebotkachel a:hover .blende {
	opacity: 0;
}

.angebotkachel a:hover img {
	-webkit-filter: grayscale(0%);
	-moz-filter: grayscale(0%);
	filter: grayscale(0%);
}

.angebotkachel h3 {
	font-size: 1.55em;
	padding-top: 1em;
	padding-bottom: 1em;
	text-align: center;
}

.cl-leistungen {
	gap: 4%;
	padding-bottom: 4%
}

.cl-team {
	gap: 5%;
	padding-bottom: 5%;
	justify-content: space-between;
	justify-content: space-evenly;
	text-align: center;
}


.cl-team .wp-block-column {
	display: flex;
}

.home .cl-team .wp-block-column {
	flex-basis: 40%;
}

.wp-block-lazyblock-teamperson {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.teamkachel {
	max-width: 400px;
	width: 100%;
	flex: 1;
	margin-bottom: 3em;
	display: flex;
	flex-direction: column;
}

.teamkachel:has(a) {
	margin-bottom: 7em;
}


.teamkachel .a-foto {
	position: relative;
	width: 100%;
	padding-bottom: 120%;
	overflow: hidden;
	background-color: var(--hellblau);
	background-size: cover;
}

.teamkachel .a-foto img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	min-height: 100%;
	min-width: 100%;
	height: 100%;
	opacity: 0;
}

.teamkachel h3 {
	font-size: 1.3em;
	line-height: 1.3em;
	padding-top: 1.3em;
	padding-bottom: 1.3em;
	background-color: #fff;
	margin-left: 5%;
	margin-right: 5%;
}

.teamkachel .a-titel {
	width: 100%;
	background-color: #fff;
}

.cl-team .spacer {
	height: 0;
	width: 0;
}

.teamkachel .subteam {
	border-top: 1px solid transparent;
	border-color: var(--dunkelblau);
	margin-left: 7%;
	margin-bottom: 8%;
	margin-right: 7%;
	padding-top: 7%;
}
.teamkachel a {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	text-align: center;
	align-items: center;
}
.teamkachel .button {
	position: absolute;
	bottom: -4.5em;
}

.is-style-bck-white .teamkachel .button {
	bottom: -3em;
}

.is-style-bck-white .cl-team {
	padding-bottom: 0;
}

.standorte .wp-block-columns {
	gap: 1em;
}

.standorte strong:last-of-type {
	display: inline-block;
	padding-bottom: .4em;
}

.standorte .wp-block-column {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding-bottom: 1em;
}

.praxis .wp-block-columns {
	gap: 10%;
}

.portraitblock,
.serviceblock {
	padding-bottom: 5em;
}

.portraittext {
	background-color: #fff;
	padding: 4% 7%;
	padding-top: 4.8%;
	box-sizing: border-box;
	margin-bottom: 2em;
	margin-top: 6%;
	padding-left: 8%;
}

.serviceblock .portraittext {
	margin-top: 30%;
	position: relative;
	z-index: 1;
}

.serviceblock img {
	width: 300%;
	max-width: 220% !important;
	aspect-ratio: 3/2;
	object-fit: cover;
}

.serviceblock .wp-block-lazyblock-sliderinner {
	width: 300%;
	max-width: 220% !important;
}

.portraitblock .wp-block-image {
	text-align: right;
}

.portraitblock .wp-block-image img {
	width: 80%;
	position: relative;
	margin-right: -6%;
}

.portraitblock .is-content-justification-right {
	text-align: right;
}

#main .serviceblock .wp-block-button {
	font-size: 1em;
	margin-right: .7em;
	margin-bottom: .8em !important;
}

#main .entry .portraittext h2 {
	margin-top: 0;
	padding-bottom: 1em;
	font-size: 2em;
}

.standardblock {}

.standardblock .portraittext {
	margin-top: 0;
	margin-bottom: 4em;
}

/* KARTE -------------------------------------------------------------- */

#main .leaflet-marker-icon {
	content: url(images/marker.svg);
	background-size: contain;
	width: 60px !important;
	height: 80px !important;
	margin-top: -77px !important;
	margin-left: -30px !important;
}

#main .wp-gr .wp-google-place .wp-star svg {
	width: 30px !important;
	height: 30px !important;
}

#main .wp-gr[data-layout="grid"] .grw-header-inner {
	margin: 0 !important;
}

#main .wp-gr .wp-google-powered img {
	max-width: 200px !important;
	margin-top: 10px !important;
	width: 100%;
}

#main .wp-google-place {
	background-color: #fff !important;
	display: inline-block !important;
	padding: 2em !important;
	box-sizing: border-box !important;
	width: 280px !important;
	text-align: center !important;
}

.leaflet-marker-icon {
	width: 0px !important;
	height: 0px !important;
	padding: 20px;
	padding-top: 30px;
	margin-top: -48px !important;
	margin-left: -20px !important;
	background: url(images/marker.svg) no-repeat center center;
	background-size: contain;
}

/* TESTIMONIALS ZITATE QUOTES -------------------------------------------------------------- */

.blockquote {}

/* FOOTER -------------------------------------------------------------- */

#footer,
#footer a {
	color: var(--dunkelblau);
}

#footer em {
	font-style: normal;
	display: inline-block;
	min-width: 4.6em;
}

#footer p a:hover,
#footer .menu-footer a:hover {
	color: var(--weiss);
	border-bottom: 1px solid #fff;
}

#footer figure.is-resized {
	margin-top: -.4em;
	display: inline-block;
	border-radius: 15px;
	transition: all .2s ease-out;
}

#header figure.docto {
	border-radius: 10px;
	transition: all .2s ease-out;
}

#footer figure.is-resized:hover,
#header figure.docto:hover {
	box-shadow: var(--shadow);
}

#footer {
	background-color: var(--footerfarbe);
	padding-bottom: 3.3em;
	padding-top: 3.3em;
	font-size: 1.5em;
	line-height: 1.5em;
}

#footer p {
	padding-bottom: 1.3em;
}

#footer .menu-footer ul li {
	display: inline-block;
	padding-right: .9em;
	padding-top: .9em;
}


/* =Global Elements -------------------------------------------------------------- */


/* HR HORIZONTAL RULE -------------------------------------------------------------- */

hr,
#main .wp-block-separator {
	background-color: var(--weiss);
	border: 0;
	clear: both;
	height: 1px;
	margin-bottom: 0;
	border: none;
}

#main hr,
#main .wp-block-separator {
	margin-top: 2.5em;
	margin-bottom: 2.5em;
}


/* TOOLS: Scrollbutton, Loginbutton, Editlink -------------------------------------------------------------- */


body .wp-block-button__link:hover {
	background-color: var(--schriftfarbe);
}

/* Go TOPPFEIL -------------------------------------------------------------- */

#toTop {
	width: 35px;
	height: 35px;
	position: fixed;
	z-index: 1000;
	bottom: 0px;
	right: 0px;
	margin: 0;
	display: none;
	cursor: pointer;
	color: var(--auszeichnung);
	border-radius: 3px;
	text-align: center;
	font-size: 35px;
}

#toTop:before {
	content: '\25B2';
	font-family: Arial, Helvetica, sans-serif;
}

#toTop:hover {
	text-decoration: none !important;
	border-radius: 3px;
}

.login a {
	position: fixed;
	bottom: 2px;
	left: 0;
	background: url("images/login.gif") no-repeat scroll 0 3px transparent;
	font-size: 1px;
	height: 12px;
	overflow: hidden;
	text-indent: -1000px;
	width: 10px;
	display: inline-block;
	filter: alpha(opacity=40);
	-ms-filter: "alpha(opacity = 40)";
	opacity: .40;
}

.login a:hover {
	filter: alpha(opacity=100);
	/* IE 6, 7, 8 */
	-ms-filter: "alpha(opacity = 100)";
	opacity: 1;
}

a.post-edit-link {
	position: fixed;
	z-index: 22000;
	bottom: 0px;
	left: 0;
	display: block;
	font-size: 1px;
	text-decoration: none;
	text-indent: -1000px;
	overflow: hidden;
	background: url("images/edit.png") no-repeat;
	width: 43px;
	height: 57px;
	border: none !important;
}


/* Print Style -------------------------------------------------------------- */

@media print {
	body {
		background: none !important;
	}
}


/* RESPONSIVE -------------------------------------------------------------- */


@media only screen and (max-width: 1600px) {
	body {
		font-size: 90%;
	}

	.is-style-bck-darkblue,
	.is-style-bck-white,
	.is-style-bck-brightblue {
		width: auto;
		position: static;
		margin-left: -3.4%;
		margin-right: -3.4%;
	}

	.praxis .wp-block-columns .wp-block-columns {
		display: block;
	}

	#footer {
		font-size: 1.45vw;
	}
}

@media only screen and (max-width: 1200px) {
	header {
		font-size: 85%;
	}

	.topswiper .jslice {
		background-size: 70% auto;
	}

}

@media only screen and (max-width: 1000px) {
	body {
		font-size: 80%;
	}

	#main {
		padding-top: 3em;
	}
.topswiper .jslice:has(.caption) img.slideimg {
	width: 100%;
}

.topswiper .jslice:has(.fixinfo) img.slideimg {
	width: 100%;
}
	#footer {
		font-size: 1.4em;
	}

	#footer .wp-block-columns {
		flex-wrap: wrap !important;
		gap: 0;
	}

	#footer .wp-block-column {
		flex-basis: 50%;
		box-sizing: border-box;
		padding-right: 2em;
	}

	#navi {
		padding-top: .6em;
		margin-top: .4em;
	}

	h2#logo {
		margin-top: .35em;
	}

	#header {
		padding-top: .7em;
	}

	#main .cl-team {
		justify-content: space-evenly;

	}

	.cl-team .wp-block-column {
		max-width: 40%;
	}

	#main .cl-leistungen {
		flex-wrap: wrap !important;
	}

	#main .cl-leistungen .wp-block-column:first-child {
		flex-basis: 100%;
	}

	#main .cl-leistungen .wp-block-column {
		flex-basis: 40%;
		margin-bottom: 1em;
	}

	.topswiper .fixinfo {
		display: none;
	}

	.topswiper .jslice {
		padding-top: 55%;
		background-size: contain;
	}

	.topswiper .caption {
		width: 100%;
		min-width: 100%;
	}
}

@media only screen and (max-width: 800px) {

	h2#logo,
	.scrolled h2#logo {
		margin-bottom: 5px;
		margin-top: 7px;
		margin-right: 0;
		min-width: 240px;
		width: 240px;
	}

	#header,
	body.scrolled #header {
		padding-top: 0;
	}
	.teamkachel:has(a) {
		margin-bottom: 1em;
	}
	.cl-team {
		padding-bottom: 0;
	}
	.wrapper {
		padding-left: 4%;
		padding-right: 4%;
	}

	.mobile,
	#navi ul li.mobile {
		display: block;
		font-size: .7em;
		padding-bottom: 0
	}

	#mobilemenu {
		position: fixed;
		z-index: 1000;
		width: 60px;
		height: 60px;
		right: 0px;
		top: 0px;
		font-size: 1px;
		color: #000;
		cursor: pointer;
		background: url(images/burger.svg) no-repeat center center transparent;
		background-size: 70%;
		border: none;
	}

	.active #mobilemenu {
		background: url(images/close.svg) no-repeat center center transparent;
		background-size: 45%;
	}

	.active #navi {
		left: 0px;
		right: 0px;
	}

	#navi {
		position: fixed;
		top: 60px;
		left: 100%;
		bottom: 0px;
		transition: all .5s ease-out;
		background-color: var(--dunkelblau);
		width: 100%;
		box-sizing: border-box;
		overflow-y: auto;
		padding-left: 6%;
		padding-right: 6%;
		font-size: calc(12px + 2.4vw);
		line-height: 1.3em;
		margin-top: 0;
	}

	#navi ul li {
		display: block;
		text-align: left;
		padding-bottom: .5em;
		margin-left: 0;
	}

	#navi li a {
		color: var(--weiss);
		display: block;
		border: none;
	}

	#navi li:hover>a,
	#navi ul ul :hover>a,
	#navi ul a.mPS2id-highlight {
		border: none;
		color: var(--hellblau);
	}

	#navi ul li ul {
		position: static;
		visibility: visible;
		max-height: unset;
		height: auto;
		opacity: 1;
		margin-top: 0;
		padding-bottom: 0;
		padding-top: .5em !important;
		background: transparent;
	}

	#navi ul li ul li {
		padding-bottom: 0;
	}

	#navi ul li ul li a {
		color: #fff;
		border: none;
	}

	#navi nav {
		float: left;
		width: 50%;

	}

	#navi .mobtools {
		float: left;
		width: 50%;
		box-sizing: border-box;
		background-color: #fff;
		padding: .5em .5em;
		border-radius: .5em;
	}

	#navi .mobtools .wp-block-columns {
		display: block;
	}

	#navi .mobtools a {
		border: none;
	}

	.hd-2 figure {
		margin-left: .5em;
		margin-right: .5em;
	}

	.hd-2 p.phone {
		padding: 0;
		padding-left: 1.7em;
		margin-bottom: .5em;
	}

	.hd-2 .docto {
		margin-left: 0;
		width: 100%;
	}

	#main {
		padding-top: 2em;
	}

	.home #main {
		padding-top: 1em;
	}

	#footer p {
		padding-bottom: 0.5em
	}

	#footer figure.is-resized {
		margin-top: 0.5em;
		margin-bottom: 1em;
	}

	.hd-widget {
		display: none;
	}

	#main .cl-team {
		display: block;
	}

	.cl-team .wp-block-column {
		max-width: 500px;
		margin: auto;
	}

	.standorte .wp-block-columns {
		text-align: center
	}

	#main .entry h2.is-style-bigspace {
		padding-top: 1.5em;
		padding-bottom: 1.5em;
		font-size: 2em;
	}

	.topswiper .jslice .caption {
		width: 100%;
	}

	.topswiper .swiper-pagination {
		bottom: auto;
		top: 10px;
		text-align: center;
	}

	#main .topswiper {
		margin-left: -2%;
		margin-right: -2%;
	}

	.portraitblock .wp-block-image {
		text-align: left;
		padding-left: 8%;
	}

	.portraitblock .wp-block-image img {
		margin-right: 0;
		max-width: 400px;
	}

	.serviceblock .wp-block-lazyblock-sliderinner {
		width: 100%;
	}

	#main .serviceblock .imgswiper {
		margin-bottom: 0
	}

	#main .entry .portraittext h2 {
		font-size: 1.4em;
	}

	.portraittext {
		margin-top: 0;
		padding-top: 2em;
	}

	.serviceblock .portraittext {
		margin-top: 0;
	}

	.serviceblock img {
		width: 100%;
	}

	.i-box {
		font-size: 1em;
		padding-top: 1.5em;
		margin-bottom: -2em;
	}

	.i-box img {
		min-width: 150px;
		height: auto;
		margin-top: 1em;
	}

	.entry .i-box a {
		border: none;
	}

	.jslice .caption br {
		display: none;
	}

	.wp-block-lazyblock-teamperson .spacer {
		height: 1em;
	} 
	.teamkachel .button {
		display: none;
	}
}

@media only screen and (max-width: 500px) {

	#main {
		font-size: 1.25em;
		line-height: 1.5em;
	}

	.portraittext {
		padding: 6% 5%;
	}

	.topswiper .caption {
		padding: 2em 1.7em;
	}

	#header figure.docto {
		margin-bottom: .7em;
	}

	#header figure.docto img {
		height: 2.5em;
	}

	#navi .mobtools,
	#navi nav {
		float: none;
		width: 100%;
		margin-bottom: 1em;
	}

}

/* OPERATIONEN SELECTOR minified */
.op-filter{margin-bottom:2em}.op-filter button,.teamfilter button{margin:.5em;border:none}.op-filter button.active,.teamfilter button.active{background:var(--dunkelblau);color:#fff}.arry{position:absolute;margin-left:-1.2em;padding-top:.3em;font-family:swiper-icons;display:inline-block;width:1em;height:1.4em;margin-right:.3em;font-size:.7em;line-height:1.1em;vertical-align:middle;text-transform:lowercase}.nase .op-kachel-inner{background:url(images/ico-nase.svg) right .5em bottom .5em/auto 4em no-repeat #f2f2f2}.ohr .op-kachel-inner{background:url(images/ico-ohr.svg) right .5em bottom .5em/auto 4em no-repeat #f2f2f2}.hals .op-kachel-inner{background:url(images/ico-hals.svg) right .5em bottom .5em/auto 4em no-repeat #f2f2f2}.op-grid{font-size:clamp(16px, .9em, 22px)}.op-kachel{margin-left:0;margin-right:1%;width:32%;margin-bottom:1%}#main .op-kachel button{font-size:1em;margin-top:1em}.op-kachel a{text-decoration:none;color:inherit}.op-kachel-inner{padding:1em 4em 1em 2em;text-align:left;cursor:pointer;transition:.2s;min-height:7em;line-height:1.3em}.op-kachel-inner strong{display:inline-block;text-transform:uppercase}.op-kachel-inner strong:last-of-type{padding-bottom:.5em}.op-kachel-inner:hover{background-color:var(--hellblau);box-shadow:var(--shadow)}#main .wp-block-column:has(.op-grid),#main .wp-block-columns:has(.op-grid),#main .wp-block-group:has(.op-grid){position:static}.op-popup{display:flex;background:rgba(255,255,255,.8);z-index:-1;position:fixed;top:0;left:0;width:100vw;height:100vh;flex-direction:column;justify-content:center;align-items:center;opacity:0;transition:.3s ease-out}.op-popup.active{z-index:9999999;opacity:1}.op-popup-overlay{position:fixed;inset:0;z-index:-1}.op-popup-content{box-sizing:border-box;width:60vw;max-width:60em;max-height:80vh;min-height:40vh;background:#fff;padding:2em;box-shadow:0 10px 40px rgba(0,0,0,.3);font-size:clamp(14px, 1em, 20px);line-height:1.4em;overflow-y:auto;text-align:justify;text-align-last:left;hyphens:auto}.op-popup-content h2{font-weight:600;padding-bottom:1em;line-height:1.3em}.op-popup-content p{padding-bottom:1.4em}.op-popup-scroll{overflow-y:auto;max-height:70vh;padding-right:.5em}.op-popup-close{position:absolute;top:10px;right:15px;font-size:28px;border:none;background:0 0;cursor:pointer}body.popup-open{overflow:hidden}@media only screen and (max-width:800px){.op-kachel,.op-popup-content{width:100%}.op-grid{font-size:1.1em}.op-kachel{margin-right:0}.op-kachel-inner{min-height:3em;text-align:left;padding:1em 1em 1em 1.5em}}