@font-face {
	font-family: 'Open Sans';
	src: url('../fonts/OpenSans-Regular.woff2') format('woff2'),
			url('../fonts/OpenSans-Regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Open Sans';
	src: url('../fonts/OpenSans-Light.woff2') format('woff2'),
			url('../fonts/OpenSans-Light.woff') format('woff');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Open Sans';
	src: url('../fonts/OpenSans-Bold.woff2') format('woff2'),
			url('../fonts/OpenSans-Bold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}
body{
	font-family: 'Open Sans';
	font-weight: unset;
	font-style: normal;
}
#mod-menu1 li{
	float: left;
	width: unset;
	line-height: 1.5rem;
	position: relative
}
@media (min-width: 640px) {
	.grid .mt-8 {
		margin-top: 0 !important
	}
	.sm\:w-64 {
		width: 100% !important
	}
}
@media	(orientation: portrait) {
	.bg-white .hidden{
		top: 6rem;
		left:1rem
	}
	nav.bg-white{
		height:9rem
	}
	nav.bg-white img{
		margin-left: 1rem;
		width:200px;
		margin-top:2rem
	}
	.grid-cols-2{
		grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
	}
	#hero section .img-wrap.ring-slate-100 {
		max-width: 42rem;
		margin-left: auto;
		margin-right: auto;
		aspect-ratio: 1 / 1;
	}
	.content .com-content-article.item-page .com-content-article__body p img.articleimage{
		width: 100%;
		margin-bottom: 0.5rem}
	#hero section .img-wrap img{
		height: 100%;
	}
}
@media (max-width: 767px) {
	.bg-white .hidden{
		position:absolute;
		right:0 
	}
	.footermenu,
	.footer-contact{
		text-align:center !important
	}
	.Kachels {
		grid-template-columns: repeat(1, minmax(0, 1fr)) !important
	}
}
@media (max-width: 1024px) {
	.Kachels {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media (min-width: 1024px) {
	.Kachels {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
.footermenu li.nav-item a{
	margin-right: 0;
}
#mod-menu1{
	margin-top:0.75rem
}
nav .hidden{
	display:unset !important
}
.bg-white button{
	display:none !important
}
.mod-menu.mod-list.nav{
	padding: 0 0 0 1em;
}
.footer-contact{
 line-height: 1.5rem;
}
footer ul.mod-menu.mod-list.nav.footermenu{
	text-align:right
}
.logobox img{
	max-width:160px
}
#copyright{
	width:100%;
	text-align:center;
	color:#222;
	padding:1rem
}
.Kooperationspartner h3{
	font-size:12pt !important
}
.highlight{
	 background:#00ABE1;
	 text-align:center;
	 color:#FFF !important;
	 padding: 5rem 1rem
 }
.image-cover {
	height: 200px;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	margin: 0;
}
.image-cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;	 /* füllt die Box, schneidet ggf. zu */
}
.Kooperationspartner a{
	float:left
}
.Kooperationspartner{
	width: 100%;
	margin-bottom: 0.5rem;
	background-color: white;
	display: inline-block;
	padding: 0.5rem;
	border-radius: 0.25rem	
}
.Kooperationspartner h3{
	margin-top:0 !important
}
.content .com-content-article.item-page .com-content-article__body h3{
	margin-bottom: 0.5rem;
	color: #007195;
	font-weight: unset !important;
	margin-top:1rem
}
.content .com-content-article.item-page .com-content-article__body h2{
	margin-bottom:1rem	
}
.button:hover{
	background: #89bed9
}
.button{
	width: 100%;
	text-align: center;
	background: #d9e7ee;
	padding: 0.5rem;
	border-radius: 0.2rem;
	color: #222;
	margin-bottom: 1rem;
	margin-right: 0;
}
.content .com-content-category-blog.blog{
	width:100%
}
.content{
	background-color: rgb(243 244 246);
	padding-top: 2rem;
}
.com-content-article.item-page{
	padding-bottom:1rem
}
footer,
.com-content-article.item-page,
.Kachels{
	display: grid;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	max-width: 80rem;
	margin-left: auto;
	margin-right: auto
}
h4{
	font-weight: normal;
	font-style: italic;
	margin-bottom: 0.75rem !important
}
#hero .kachel p{
	color:#222
}
#hero .mt-8{
	margin-top:0
}
.w-56 {
	width: 100% !important
}
.text-wrap{
	margin-top:1rem
}
footer{
	padding-top:1rem
}
.logobox{
	padding:1rem
}
.img-wrap.relative.overflow-hidden.rounded-3xl.bg-white.shadow-xl.shadow-slate-200.ring-1.ring-slate-100{
	width: 100% !important
}
.com-content-category-blog__item.blog-item{
	float: left;
	margin-bottom: 2rem;
	margin-right: 1rem;
}
.com-content-category-blog.blog{
	display: inline-block
}
a {
	color: inherit;
	text-decoration: inherit;
	margin-right: 1.5rem
}
#hero h1{
	color: white
}
#herobutton a{
	margin:auto
}
#herobutton a,
#hero .inline-flex{
	background:white;
	color:rgb(6, 159, 224)	
}
#hero p{
	color:white
}
#hero .kachel.bg-white{
	background: white
}
.bg-white{
	background: unset
}
#hero .ring-slate-100{
	box-shadow:unset !important
}
body {
	font-family: 'Inter', sans-serif
}
.convertforms .cf-content-wrap, .convertforms .cf-form-wrap {
	padding:0 !important
}

/* Info-Badge oben rechts; verschwindet, wenn Overlay sichtbar */
.img-wrap .info-badge {
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
	width: 3rem;
	height: 3rem;
	border-radius: 50%;
	background: rgba(0,0,0,.7);
	color: #fff;
	font-size: 2rem;
	user-select: none;
	pointer-events: none;
	transition: opacity .18s ease, transform .18s ease;
	opacity: 1;
	text-align: center;
	font-weight: bold
}
.img-wrap{
	cursor:pointer
}
.img-wrap.showing-info .info-badge {
	opacity: 0;
	transform: scale(.9)
}
.img-wrap .alt-overlay {
	position: absolute;
	inset: 0;									/* volle Fläche */
	padding: 12px;
	background: rgba(0,0,0,.85);
	color: #fff;
	font: 1rem/1.5 system-ui, sans-serif;
	box-sizing: border-box;
	opacity: 0;
	transition: opacity .18s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: auto
}
.img-wrap .alt-overlay.is-visible {
	opacity: 1
}
ul.mod-menu.mod-list.nav li.nav-item{
	float: left;
	width: 100%;
	line-height: 1.5rem
}
ul.mod-menu.mod-list.nav li.nav-item.active{
	font-weight:bold;
	color:#00ABE1
}
#hero {
	position: relative;
	z-index: 1;
	background: url("../images/Wave.svg") rgb(6, 159, 224) !important;
	background-repeat: no-repeat !important;
	background-size: 178% !important;
	background-position-y: bottom !important
}
.hero-gradient {
	background: linear-gradient(135deg, #1e3a8a 0%, #1e40af 50%, #1d4ed8 100%)
}
.service-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 20px 25px -5px rgba(0,0,0,.1), 0 10px 10px -5px rgba(0,0,0,.04)
}
.content h1 {
	font-weight:bold !important;
	font-size:150% !important;
	margin-bottom:0.5rem
}
.content h2 {
	font-weight:bold !important;
	font-size:135% !important
}
h1 {
	font-weight:bold !important;
	font-size:200% !important
}
h3{
	font-weight:bold !important;
	font-size:120% !important
}
.bg-blue-600{
	background-color: rgb(6, 159, 224) !important
}
.text-blue-600 {
	--tw-text-opacity: 1;
	color: rgb(6, 159, 224) !important
}
.lg\:px-8 {
	padding: 1rem 2rem 0 2rem
}
.hover\:bg-blue-700:hover {
	--tw-bg-opacity: 1;
	background-color: rgb(6, 159, 224) !important
}

.bg-indigo-600 {
	--tw-bg-opacity: 1;
	background-color: #00ABE1 !important
}