@charset "UTF-8";

:root {
    --farbe_hellgrau: #F7F7F8;
    --farbe_schriftgrau: #D2D2D2;
    --farbe_graphit: #54575A;
    --farbe_graphit_light: #9DA3A8;
    --farbe_kupferlicht: #F39A73;
    --farbe_kupfer: #D78E70;
    --farbe_rosenquarz: #FBDDE7;
    --farbe_rosenquarz_dark: #6D4A58;
    --font_1: 'Barlow-Regular', Helvetica, Arial, sans-serif;
    --font_2: 'Rajdhani-SemiBold', Helvetica, Arial, sans-serif;
}

/* @font-face, family and size */

@font-face {
  src: url("fonts/Barlow-Regular.woff2") format("woff2"),
       url("fonts/Barlow-Regular.woff") format("woff");
  font-family: "Barlow-Regular";
    font-weight: 400;
}

.regular {
	font-family: var(--font_1);
	font-weight: 400;
}

@font-face {
  src: url("fonts/Rajdhani-SemiBold.woff2") format("woff2"),
       url("fonts/Rajdhani-SemiBold.woff") format("woff");
  font-family: "Rajdhani-SemiBold";
    font-weight: 600;
}

.semibold {
	font-family: var(--font_2);
	font-weight: 600;
	text-transform: uppercase;
}

* {
    box-sizing: border-box;
}

body {
	font-family: var(--font_1);
	font-weight: 400;
	font-size: 1rem;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font_2);
	font-weight: 600;
	text-transform: uppercase;
}

button {
	font-family: var(--font_2);
	font-weight: 600;
	font-size: 1em;
	letter-spacing: 0.3rem;
	text-transform: uppercase;
}

.lowercase {
	text-transform: lowercase;
}

.uppercase {
	text-transform: uppercase;
}

/* Colors */

body {
	background: var(--farbe_hellgrau);
	color: var(--farbe_graphit);
}

button {
	background: var(--farbe_graphit);
	color: #fff;
	border-color: var(--farbe_graphit);
}

button:hover, button:active {
	background: transparent;
	color: var(--farbe_graphit);
	border-color: var(--farbe_graphit);
	box-shadow: 0px 0px 1px var(--farbe_graphit);
}

.btn_kupferlicht {
	background: var(--farbe_kupferlicht);
	color: var(--farbe_graphit);
	border-color: var(--farbe_kupferlicht);
}

.btn_kupferlicht:hover, .btn_kupferlicht:active {
	background: transparent;
	color: var(--farbe_kupferlicht);
	border-color: var(--farbe_kupferlicht);
	box-shadow: 0px 0px 1px var(--farbe_kupferlicht);
}

.btn_kupfer {
	background: var(--farbe_kupfer);
	color: #fff;
	border-color: var(--farbe_kupfer);
}

.btn_kupfer:hover, .btn_kupfer:active {
	background: transparent;
	color: var(--farbe_kupfer);
	border-color: var(--farbe_kupfer);
	box-shadow: 0px 0px 1px var(--farbe_kupfer);
}

.btn_kupfer_ghost {
	background: transparent;
	color: var(--farbe_kupfer);
	border-color: var(--farbe_kupfer);
	box-shadow: 0px 0px 1px var(--farbe_kupfer);
}

.btn_kupfer_ghost:hover, .btn_kupfer_ghost:active {
	background: var(--farbe_kupfer);
	color: #fff;
	border-color: var(--farbe_kupfer);
	box-shadow: none;
}

.btn_weiss {
	background: #fff;
	color: var(--farbe_graphit);
	border-color: #fff;
}

.btn_weiss:hover, .btn_weiss:active {
	background: transparent;
	color: var(--farbe_graphit);
	border-color: #fff;
	box-shadow: 0px 0px 1px #fff;
}

.btn_rosenquarz {
	background: var(--farbe_rosenquarz);
	color: var(--farbe_graphit);
	border-color: var(--farbe_rosenquarz);
}

.btn_rosenquarz:hover, .btn_rosenquarz:active {
	background: transparent;
	color: var(--farbe_graphit);
	border-color: var(--farbe_rosenquarz);
	box-shadow: 0px 0px 1px var(--farbe_rosenquarz);
}

.btn_weiss_hover:hover, .btn_weiss_hover:active {
	color: #fff;
	border-color: #fff;
	box-shadow: 0px 0px 1px #fff;
}

a {
	color: var(--farbe_graphit);
}

a:focus, a:hover, a:active {
	color: var(--farbe_graphit);
}

.color_weiss, .color_weiss a, .color_weiss a:hover, .color_weiss a:active {
	color: #fff;
}

.color_kupferlicht, .color_kupferlicht a, .color_kupferlicht a:hover, .color_kupferlicht a:active {
	color: var(--farbe_kupferlicht);
}

.color_kupfer, .color_kupfer a, .color_kupfer a:hover, .color_kupfer a:active {
	color: var(--farbe_kupfer);
}

.color_rosenquarz, .color_rosenquarz a, .color_rosenquarz a:hover, .color_rosenquarz a:active {
	color: var(--farbe_rosenquarz);
}

.bg_graphit {
	background: var(--farbe_graphit);
	color: #fff;
}

.bg_graphit a, .bg_graphit a:hover, .bg_graphit a:active {
	color: #fff;
}

.bg_graphit h1, .bg_graphit h2, .bg_graphit h3, .bg_graphit h4, .bg_graphit h5, .bg_graphit h6 {
	color: var(--farbe_kupferlicht);
}

.bg_kupfer {
	background: var(--farbe_kupfer);
	color: #fff;
}

.bg_kupfer a, .bg_kupfer a:hover, .bg_kupfer a:active {
	color: #fff;
}

.bg_kupfer h1, .bg_kupfer h2, .bg_kupfer h3, .bg_kupfer h4, .bg_kupfer h5, .bg_kupfer h6 {
	color: #fff;
}

.bg_rosenquarz {
	background: var(--farbe_rosenquarz);
	color: var(--farbe_graphit);
}

.bg_rosenquarz a, .bg_rosenquarz a:hover, .bg_rosenquarz a:active {
	color: var(--farbe_graphit);
}

.bg_rosenquarz h1, .bg_rosenquarz h2, .bg_rosenquarz h3, .bg_rosenquarz h4, .bg_rosenquarz h5, .bg_rosenquarz h6 {
	color: var(--farbe_graphit);
}

.bg_weiss {
	background: #fff;
	color: var(--farbe_graphit);
}

.bg_weiss a, .bg_weiss a:hover, .bg_weiss a:active {
	color: var(--farbe_graphit);
}

.bg_weiss h1, .bg_weiss h2, .bg_weiss h3, .bg_weiss h4, .bg_weiss h5, .bg_weiss h6 {
	color: var(--farbe_kupfer);
}


/* Basics */

html {
	scroll-behavior: smooth;
}

body {
	height: 100%;
	margin: 0 auto;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: grayscale;
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
    overflow-x: hidden;
    overflow-wrap: break-word;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
}

img {
	width: 100%;
	display: block;
}

:focus { 
	outline: none
}

.show_mobile {
	display: block;
}

.show_tablet {
	display: none;
}

.show_desk {
	display: none;
}

.show_mobile_2 {
	display: block;
}

.show_desk_2 {
	display: none;
}

/* Links */

a {
	text-decoration: none;
	transition: all 250ms ease;
	cursor: pointer;
    outline: none;
}

a:focus, a:hover, a:active {
  	outline: none;
	transition: all 250ms ease;
}

/* Text and Headers */

.nohyph, .mensch_name {
    -webkit-hyphens: none; 
    -ms-hyphens: none; 
    hyphens: none;
}

h1, .like_h1, h2, .like_h2 {
	font-size: 2em; 
  	margin: 2rem 0;
  	line-height: 2.35rem;
}

h3, .like_h3 {
	font-size: 1.5em;
  	margin: 2.4rem 0 1rem;
  	line-height: 1.76rem; 
}

h4, .like_h4 {
	font-size: 1.2em;
  	margin: 2.4rem 0 1rem;
  	line-height: 1.41rem; 
}

h5, .like_h5 {
	font-size: .83em;
	margin: 2.4rem 0 1rem;
  	line-height: .98rem; 
}

h6, .like_h6 {
	font-size: .67em; 
	margin: 2.4rem 0 1rem;
  	line-height: .79rem;
}

p {
	font-size: 1em;
}

.muted_text {
	font-size: 0.8em;
	opacity: 0.8;
}

li {
    list-style-type: none;
}

/* Positioning */

.align_left {
    text-align: left;
}

.align_right {
    text-align: right;
}

.align_center {
    text-align: center;
}

.align_justify {
    text-align: justify;
}

.clearer {
    clear: both;
}

.pos_rel {
	position: relative;
}

.no_border_btm {
	border-bottom: 0 !important;
}

.no_scroll {
    overflow: hidden;
}

.marg_top_40 {
	margin-top: 40px;
}

.marg_top_50 {
	margin-top: 50px;
}

.no_marg_top {
	margin-top: 0;
}

/* Buttons */

button {
    border-width: 1px;
    border-style: solid;
    border-radius: 5px;
    padding: 12px 22px 11px;
	margin: 10px 0;
	transition: all 250ms ease;
	cursor: pointer;
	min-width: 150px;
}

.no_min_width {
	min-width: revert;
}

button:hover {
	transition: all 250ms ease;
}

button::last-letter {
    letter-spacing: normal;
}

.btn_spezial {
	padding: 5px 15px;
	display: inline-block;
	position: relative;
	margin-top: 40px;
}

.btn_spezial:before {
	content: ' ';
	height: 100%;
	width: 35px;
	position: absolute;
	top: 0;
	left: 0;
	background: url("img/btn_spezial_links.svg");
	background-position: left center;
	background-size: contain;
	background-repeat: no-repeat;
}

.btn_spezial:after {
	content: ' ';
	height: 100%;
	width: 35px;
	position: absolute;
	top: 0;
	right: 0;
	background: url("img/btn_spezial_rechts.svg");
	background-position: right center;
	background-size: contain;
	background-repeat: no-repeat;
}

.btn_spezial_white:before {
	content: ' ';
	height: 100%;
	width: 35px;
	position: absolute;
	top: 0;
	left: 0;
	background: url("img/btn_spezial_links_white.svg");
	background-position: left center;
	background-size: contain;
	background-repeat: no-repeat;
}

.btn_spezial_white:after {
	content: ' ';
	height: 100%;
	width: 35px;
	position: absolute;
	top: 0;
	right: 0;
	background: url("img/btn_spezial_rechts_white.svg");
	background-position: right center;
	background-size: contain;
	background-repeat: no-repeat;
}

/* Wrapper und Secions */

.wrapper {
	width: 100%;
	max-width: 1300px;
	margin: 0 auto;
}

main {
	padding-top: 95px;
}

.klammer_20_20 {
	width: calc(100% - 20px);
	margin: 0 auto;
	position: relative;
}

.klammer_20_20_mobile {
	width: calc(100% - 20px);
	margin: 0 auto;
	position: relative;
}

.klammer_60_60 {
	width: calc(100% - 20px);
	margin: 0 auto;
	position: relative;
}

.klammer_60_20, .klammer_20_60 {
	width: calc(100% - 20px);
	position: relative;
}

.klammer_60_20 {
	margin-left: auto;
}

.klammer_20_60 {
	margin-right: auto;
}

.klammer_text_inner_1 {
	width: calc(100% - 70px);
	max-width: 1020px;
	margin: 0 auto;
}

.klammer_text_inner_2 {
	width: calc(100% - 70px);
	max-width: 1020px;
	margin: 0 auto;
}

.pad_top_120_100 {
	padding: 60px 0 60px;
}

.pad_top_120_100_mobile {
	padding: 60px 0 60px;
}

.marg_bot_120 {
	margin-bottom: 60px;
}

.no_marg_bot {
	margin-bottom: 0 !important;
}

.height_100 {
	height: 100%;
}

.pos_center {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

/* Navigation */

.nav_pos_fixed {
	position: fixed;
	left: 50%;
	transform: translate(-50%);
	z-index: 29500;
}

.nav_desk {
	display: none;
}

.nav_mobile {
	display: block;
}

header {
	background: #fff;
	width: 100%;
	height: 115px;
	margin: 40px 0;
	transition: all 500ms ease-out;
}

.logo {
	width: auto;
	height: 40px;
	position: absolute;
	left: 20px;
	top: 37px;
	transform: translate(0, -50%);
	transition: all 300ms ease; 
}

.con_nav_desk {
	position: absolute;
	top: 50%;
	right: 25px;
	transform: translate(0, -50%);
}

.con_nav_desk li a, .con_nav_desk li {
	color: var(--farbe_graphit);
	transition: all 150ms ease-out;
	position: relative;
}

.con_nav_desk:hover li a:hover, .con_nav_desk:hover li:hover {
	color: #000;
	transition: color 500ms ease-out;
}

/* .con_nav_desk:hover li a:hover:after, .con_nav_desk:hover li:hover:after {
	content: ' ';
	width: 100%;
	height: 2px;
	background: var(--farbe_graphit);
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(0, -50%);
	transition: all 300ms ease-out;
} */

.con_nav_desk ul li {
	position: relative;
}

.con_nav_desk ul li ul {
	display: none;
	position: absolute;
	background: #fff;
	padding: 15px 10px;
	margin-left: -25px;
	top: 90px;
	animation: ul-li-ul 300ms ease-out;
}

@keyframes ul-li-ul {
	0% {
		top: 80px;
	}

	100% {
		top: 90px;
	}
}

.con_nav_desk ul li:hover ul {
	display: block;
}

.con_nav_desk li {
	display: inline-block;
	vertical-align: middle;
	padding: 50px 15px;
}

.cursor_default {
	cursor: default;
}

.con_nav_desk ul li ul li {
	width: 220px;
	margin-left: 0;
	padding: 15px;
}

.con_nav_desk li span {
	letter-spacing: 0;
}

.credit_ot_btn {
	font-family: var(--font_1);
	letter-spacing: 0;
	font-weight: 400;
	text-transform: none;
	font-size: 0.8rem;
}

.ot_btn_hide_credit .credit_ot_btn {
	display: none;
}

/* Mobile Navigation */

input[type=checkbox] {
	display: none;
}

label {
	position: relative; 
	display: inline-block; 
	width: 35px; 
	color: #000; 
	cursor: pointer;
}

#menu {
	width: calc(100% - 20px); 
	height: 75px;
    background: #fff;
	position: fixed; 
	top: 10px; 
	left: 10px; 
	overflow: hidden; 
	z-index: 30000;
	transform: translateZ(0);
	outline: 0.05rem solid #fff;
}

#menu li, #menu a {
	color: #fff !important;
}

.nav_mobile_header {
	width: 100%;
	height: 75px;
	background: transparent;
	position: relative;
}

input[type=checkbox]:checked ~ #menu .btn_rosenquarz:hover, input[type=checkbox]:checked ~ #menu .btn_rosenquarz:active {
	background: #fff;
	border-color: #fff;
}

input[type=checkbox]:checked ~ #menu .nav_mobile_header {
	background: var(--farbe_graphit);
}

input[type=checkbox]:checked ~ #menu {
    height: 100dvh;
	outline: 0.05rem solid #5C6063;
    background: #5C6063;
	transition: height 500ms ease-out; 
}

@supports not (height: 100dvh) {

    input[type=checkbox]:checked ~ #menu {
    	height: 100vh;
    }
}

label:before {
	position: fixed; 
	content: ""; 
	height: 10px;
	width: 10px;
	right: 20px;
	top: 23px;
	background: url("img/navigation_icon_open.svg"); 
	background-repeat: no-repeat; 
	z-index: 30001; 
	display: block;
    padding: 20px;
    background-size: 50%;
    background-position: center;
}

input[type=checkbox]:checked ~ label:before {
	background: url("img/navigation_icon_close.svg");
	background-repeat: no-repeat; 
    background-size: 50%;
    background-position: center;
	z-index: 30001;
	display: block;
	top: 24px;
}

.navigation_mobile li {
    padding: 20px 0;
    position: relative;
}

.logo svg {
	fill: var(--farbe_graphit);
	height: 100%;
	width: auto;
}

input[type=checkbox]:checked ~ #menu .logo svg {
	fill: #fff;
}

.nav_mobile_scroll_con {
	height: calc(100% - 75px);
	overflow-y: scroll;
	overflow-x: hidden;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.nav_mobile_scroll_con::-webkit-scrollbar {
  display: none; 
}

.nav_mobile_inner {
	padding: 0px 20px 40px 20px;
}

input[type=checkbox]:checked ~ #menu .nav_mobile_inner li, input[type=checkbox]:checked ~ #menu .nav_mobile_inner li ul li {
	border-bottom: 1px solid #737C80;
	animation: border-bottom-mobile-nav 1s ease-out;
}

@keyframes border-bottom-mobile-nav {
	0% {
		border-color: transparent;
	}
	30% {
		border-color: transparent;
	}
	100% {
		border-color: #737C80;
	}
}

.nav_mobile_inner li ul {
	padding-left: 15px;
	padding-top: 5px;
	margin-bottom: -13px;
}

.nav_mobile_inner li ul a:last-child li {
	border: 0 !important;
}

.nav_mobile_inner ul {
	margin: 0;
	padding: 0;
}

.nav_mobile_inner li {
	max-width: calc(100% - 10px);
}

.max_width_100 {
	max-width: 100% !important;
}

.show_small_or_large {
	display: none;
}

.show_nav_over_390 {
	display: none;
}

.ot_btn_mobile_390 {
	position: absolute;
	top: 4px;
	right: 70px;
}

.ot_btn_mobile_390 button {
	padding: 7px 14px;
	line-height: 1rem;
}

.toggle-symbol {
	position: absolute;
	right: 0;
	font-size: 1.5rem;
	line-height: 1rem;
}

.btn_label_mobile_schnellkontakt span {
	display: inline-block;
	width: 85px;
}

.btn_small_under_390 {
	padding: 10px 30px;
	letter-spacing: 0;
	margin: 0 5px;
}


/* Footer */

footer ul {
	margin: 0;
	padding: 0 0 0 15px;
}

footer ul::marker {
    margin-right: 30px; 
}

footer ul li {
	list-style-type: square;
}

.follow_us h4 {
	margin: 0;
	padding: 20px 0;
}

.follow_us img {
	width: 30px;
}

.follow_us h4, .icon_follow_us {
	display: inline-block;
	margin-right: 15px;
	vertical-align: middle;
}

.icon_follow_us {
	margin-right: 5px;
}

.credit_footer {
	padding: 20px 0;
	font-size: 0.8rem;
}

.credit_footer a {
	display: block;
	opacity: 0.7;
}

.credit_footer a:hover, .credit_footer a:active {
	opacity: 1;
}

.credit_footer span {
	display: none;
	opacity: 0.7;
}

/* Content */

.zweier_links_text {  
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 1fr;
	gap: 0px 0px;
	grid-auto-flow: row;
	grid-template-areas:
	"zweier_links_text_rechts" "zweier_links_text_links";
}

.zweier_links_text_links { grid-area: zweier_links_text_links; }

.zweier_links_text_rechts { grid-area: zweier_links_text_rechts; }

.zweier_rechts_text {  
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 1fr;
	gap: 0px 0px;
	grid-auto-flow: row;
	grid-template-areas:
	"zweier_rechts_text_rechts" "zweier_rechts_text_links";
}

.zweier_rechts_text_links { grid-area: zweier_rechts_text_links; }

.zweier_rechts_text_rechts { grid-area: zweier_rechts_text_rechts; }

/* Kompetenzen Module */

.kh_color {
	color: var(--farbe_schriftgrau);
}

.kh_align_center {
	text-align: center;
}

.arc_con_closed {
    max-height: 0;
    overflow: hidden;
    transition: max-height 500ms ease-out;
}

.arc_con_closed p:first-child {
	margin-top: 0;
}

.arc_con_open {
    max-height: 10000px;
    transition: max-height 30s ease-out;
}

.hide_opener {
    display: none;
}

.mensch_con {
	position: relative;
	margin-bottom: 40px;
}

.mensch_con img {
	display: block;
}

.mensch_name {
	text-align: left;
}

.mensch_overlay {
	background: #fff;
	padding: 60px 35px;
	width: 100%;
  	margin-left: auto;
  	text-align: justify;
}

.mensch_overlay h3 {
	margin: 0;
}

.mensch_zoom_in {
	display: none;
}

.kompetenz_links_inner {
	padding: 20px 0 40px;
	height: 100%;
}

.thema_box {
	padding: 10px 0 30px;
	margin: 0 0 10px;
}

.thema_box:last-child {
	margin: 0;
}

.kompetenz_liste ul {
	margin: 40px 0 0 0;
	padding: 0;
}

.kompetenz_liste li {
	margin-bottom: 20px;
	position: relative;
	padding-left: 50px;
}

.kompetenz_liste li::before {
	content: '';
	width: 25px;
	height: 25px;
	border: 1px solid #fff;
	border-radius: 5px;
	position: absolute;
	top: -3px;
	left: 0;
}

/* Content */

.imp_dat .trenner_ueberschrift {
	margin: 90px 0;
}

.imp_dat ul {
	padding-left: 15px;
}

.imp_dat li {
	list-style-type: square;
	margin-bottom: 15px;
}

.offnungszeiten ul {
	margin: 0;
	padding: 0;
}

.offnungszeiten span {
	display: inline-block;
	width: 35px;
}

.normal_list {
	padding-left: 15px;
	margin: 0;
}

.normal_list li {
	list-style-type: square;
	margin-bottom: 15px;
}

.presse_img_con {
	background: #fff;
	padding: 65px;
}

.presse_text_con {
	width: 100%;
	margin: 0 auto;
}

.presse_text_inner {
	padding: 60px 40px 40px;
}

.presse_text_inner button img {
	width: 20px;
}

.presse_btn_podcast {
	min-width: revert;
	padding-left: 15px;
	padding-right: 15px;
	margin-right: 5px;
}

.presse_text_inner h2 {
	margin-top: 0;
}

.presse_text_inhalt {
	margin-bottom: 25px;
}

.presse_no_marg_bot {
	margin-bottom: 0 !important;
}

.storch {
	width: 45px;
	height: auto;
	position: absolute;
	top: 30px;
	right: 30px;
}

.marg_bot_menschen_text {
	margin-bottom: 40px !important;
}

.schnellzugriff {
	margin-top: 50px;
}

.schnellzugriff button {
	text-align: left;
}

.schnellzugriff button {
	margin-bottom: 10px;
	margin-top: 0;
}

.video_inner {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}

.video_inner iframe,
.video_inner object,
.video_inner embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.youtube_loader_bg {
    background: url("img/youtube_load_2.jpg");
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: block;
    text-align: center;
}

.youtube_loader_inner {
	width: calc(100% - 40px);
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
}

.youtube_loader_inner button {
    margin-top: 15px;
}

.datenschutz_youtube_hinweis {
	text-decoration: underline !important;
}

.youtube_loader_inner p {
	line-height: 1.5rem;
}

/* Animation Winter */

.wrapper_winter_animation {
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 99999;
}

.animation_winter_1 {
  width: 45px;
  height: 45px;
  pointer-events: none;
  background: transparent;
  position: absolute;
  left: 20%;
  top: -10%;
  opacity: 0;
  animation: animation-winter-1 20s ease-in-out infinite;
}

@keyframes animation-winter-1 {
  0% {
    top: -10%;
    left: 30%;
    transform: rotate(0deg);
    opacity: 1;
  }

  20% {
    left: 25%;
  }

  40% {
    left: 35%;
  }

  30% {
    opacity: 1;
  }

  80% {
    top: 110%;
    left: 30%;
    opacity: 1;
    transform: rotate(120deg);
  }

  100% {
    top: 110%;
    left: 30%;
    opacity: 0;
    transform: rotate(120deg);
  }
}

.animation_winter_2 {
  width: 55px;
  height: 55px;
  pointer-events: none;
  background: transparent;
  position: absolute;
  left: 60%;
  top: -10%;
  opacity: 0;
  animation: animation-winter-2 28s ease-in-out 2 infinite;
}

@keyframes animation-winter-2 {
  0% {
    top: -10%;
    left: 70%;
    transform: rotate(30deg);
    opacity: 1;
  }

  30% {
    left: 65%;
  }

  60% {
    opacity: 1;
  }

  80% {
    top: 110%;
    left: 70%;
    opacity: 1;
    transform: rotate(-230deg);
  }

  100% {
    top: 110%;
    left: 70%;
    opacity: 0;
    transform: rotate(-230deg);
  }
}

.animation_winter_3 {
  width: 25px;
  height: 25px;
  pointer-events: none;
  background: transparent;
  position: absolute;
  left: 90%;
  top: 5%;
  opacity: 0;
  animation: animation-winter-3 24s ease-in-out infinite;
}

@keyframes animation-winter-3 {
  0% {
    top: -10%;
    left: 50%;
    transform: rotate(-30deg);
    opacity: 1;
  }

  30% {
    opacity: 1;
  }

  50% {
    left: 45%;
  }

  70% {
    opacity: 1;
  }

  80% {
    top: 110%;
    left: 50%;
    opacity: 1;
    transform: rotate(140deg);
  }

  100% {
    top: 110%;
    left: 50%;
    opacity: 0;
    transform: rotate(140deg);
  }
}

.animation_winter_4 {
  width: 50px;
  height: 50px;
  pointer-events: none;
  background: transparent;
  position: absolute;
  left: 20%;
  top: -10%;
  opacity: 0;
  animation: animation-winter-4 13s ease-in-out 12s infinite;
}

@keyframes animation-winter-4 {
  0% {
    top: -10%;
    left: 0%;
    transform: rotate(-40deg);
    opacity: 1;
  }

  40% {
    left: 10%;
  }

  80% {
    opacity: 1;
  }

  100% {
    top: 110%;
    left: 2%;
    opacity: 0;
    transform: rotate(-220deg);
  }
}

.animation_winter_5 {
  width: 40px;
  height: 40px;
  pointer-events: none;
  background: transparent;
  position: absolute;
  left: 90%;
  top: 5%;
  opacity: 0;
  animation: animation-winter-5 22s ease-in-out 3s infinite;
}

@keyframes animation-winter-5 {
  0% {
    top: -10%;
    left: 85%;
    transform: rotate(70deg);
    opacity: 1;
  }

  30% {
    opacity: 1;
  }

  60% {
    left: 80%;
  }

  80% {
    opacity: 1;
  }

  100% {
    top: 110%;
    left: 85%;
    opacity: 0;
    transform: rotate(-140deg);
  }
}

.animation_winter_6 {
  width: 20px;
  height: 20px;
  pointer-events: none;
  background: transparent;
  position: absolute;
  left: 90%;
  top: 5%;
  opacity: 0;
  animation: animation-winter-6 16s ease-in-out infinite;
}

@keyframes animation-winter-6 {
  0% {
    top: -10%;
    left: 65%;
    transform: rotate(70deg);
    opacity: 1;
  }

  30% {
    opacity: 1;
  }

  50% {
    left: 60%;
  }

  60% {
    opacity: 1;
  }

  80% {
    top: 130%;
    left: 65%;
    opacity: 1;
    transform: rotate(-340deg);
  }

  100% {
    top: 110%;
    left: 65%;
    opacity: 0;
    transform: rotate(-140deg);
  }
}

.animation_winter_7 {
  width: 38px;
  height: 38px;
  pointer-events: none;
  background: transparent;
  position: absolute;
  left: 90%;
  top: 5%;
  opacity: 0;
  animation: animation-winter-7 19s ease-in-out infinite;
}

@keyframes animation-winter-7 {
  0% {
    top: -10%;
    left: 75%;
    transform: rotate(20deg);
    opacity: 1;
  }

  30% {
    opacity: 1;
  }

  50% {
    left: 80%;
  }

  60% {
    opacity: 1;
  }

  80% {
    top: 130%;
    left: 75%;
    opacity: 1;
    transform: rotate(340deg);
  }

  100% {
    top: 110%;
    left: 75%;
    opacity: 0;
    transform: rotate(340deg);
  }
}

.animation_winter_8 {
  width: 38px;
  height: 38px;
  pointer-events: none;
  background: transparent;
  position: absolute;
  left: 90%;
  top: 5%;
  opacity: 0;
  animation: animation-winter-8 11s ease-in-out 4s infinite;
}

@keyframes animation-winter-8 {
  0% {
    top: -10%;
    left: 25%;
    transform: rotate(40deg);
    opacity: 1;
  }

  30% {
    opacity: 1;
  }

  40% {
    left: 20%;
  }

  60% {
    opacity: 1;
  }

  80% {
    top: 130%;
    left: 25%;
    opacity: 1;
    transform: rotate(-320deg);
  }

  100% {
    top: 110%;
    left: 25%;
    opacity: 0;
    transform: rotate(340deg);
  }
}

.animation_winter_9 {
  width: 26px;
  height: 26px;
  pointer-events: none;
  background: transparent;
  position: absolute;
  left: 90%;
  top: 5%;
  opacity: 0;
  animation: animation-winter-8 19s ease-in-out 6s infinite;
}

@keyframes animation-winter-8 {
  0% {
    top: -10%;
    left: 25%;
    transform: rotate(80deg);
    opacity: 1;
  }

  30% {
    opacity: 1;
  }

  40% {
    left: 20%;
  }

  60% {
    opacity: 1;
  }

  80% {
    top: 110%;
    left: 25%;
    opacity: 1;
    transform: rotate(-190deg);
  }

  100% {
    top: 110%;
    left: 25%;
    opacity: 0;
    transform: rotate(-190deg);
  }
}

/* STELLENANZEIGE */

.stellenanzeige_start {
    background: rgb(255, 255, 255);
    width: 100%;
    position: relative;
    animation: stellenanzeige-start-bg 2.5s ease-in-out;
}

@keyframes stellenanzeige-start-bg {
    0% {
        background: var(--farbe_rosenquarz);
        color: var(--farbe_graphit);
    }

    60% {
        background: var(--farbe_rosenquarz);
        color: var(--farbe_graphit);
    }

    100% {
        background: rgb(255, 255, 255);
        color: var(--farbe_graphit);
    }
}

.stellenanzeige_start a {
    color: var(--farbe_kupfer);
    animation: stellenanzeige-start-1 2.5s ease-in-out;
}

.stellenanzeige_start a:hover {
    color: var(--farbe_graphit);
}

.stellenanzeige_start p {
    padding: 30px;
    margin-left: 0;
}

.stellenanzeige_start_img {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 120px !important;
    height: 120px !important;
    animation: stellenanzeige-start-img 2500ms ease-in-out;
    transform-origin: bottom;
    display: none;
}

@keyframes stellenanzeige-start-img {
    0% {
        transform: scale(0.9);
    }

    100% {
        transform: scale(1);
    }
}

.trenner_stellenanzeige {
    margin-left: 20px;
    margin-right: 20px;
    display: none;
}

.next_row {
    width: 100%;
    display: block;
}

@media (min-width: 359px) {

    /* Stellenanzeige */

    .stellenanzeige_start p {
        padding: 30px;
        margin-left: 100px;
    }

    .stellenanzeige_start_img {
        position: absolute;
        left: 0;
        bottom: 0;
        width: 120px !important;
        height: 120px !important;
        animation: stellenanzeige-start-img 2500ms ease-in-out;
        transform-origin: bottom;
        display: block;
    }

}

@media (max-width: 389px) {

	.show_small_or_large {
		display: inline-block;
	}

	label:before { 
		right: 30px;
	}

	.btn_small_under_390 {
		padding: 7px 17px;
		letter-spacing: 0;
		margin: 0 2px;
	}

	.nav_mobile_inner li {
		max-width: calc(100% - 17px);
	}

}

@media (max-width: 767px) {

	/* Footer */

	.footer_mitte, .footer_rechts, .zweier_spalten_rechts { 
		margin-top: 50px;
	}

}

@media (max-width: 1023px) {

	ul li ul {
		display: none;
	}

	ul li.open > ul {
        display: block;
      }

	body::before {
		content: ' ';
		width: 100%;
		height: 12px;
		position: fixed;
		top: 0px;
		left: 0;
		background: var(--farbe_hellgrau);
		z-index: 25000;
	}

	/* Kompetenz Mitarbeiter */

	.marg_top_60_mobile {
		margin-top: 60px;
	}

}

@media (min-width: 390px) {

	.show_nav_over_390 {
		display: block;
	}
}

@media (prefers-color-scheme: dark) {

	/* Colors */

	/* Basics */

	/* Links */

	/* Text and Headers */

	/* Positioning */

	/* Buttons */

	/* Navigation */

	/* Content */

}

@media (min-width: 768px) {

    /* Stellenanzeige Start */

    .stellenanzeige_start {
        background: rgb(255, 255, 255);
        width: 100%;
        position: relative;
        animation: stellenanzeige-start-bg 2.5s ease-in-out;
    }

    .stellenanzeige_start p {
        padding: 30px;
        margin-left: 175px;
    }

    .stellenanzeige_start_img {
        position: absolute;
        left: 30px;
        bottom: 0;
        width: 125px !important;
        height: 125px !important;
        animation: stellenanzeige-start-img 2500ms ease-in-out;
        transform-origin: bottom;
    }

    @keyframes stellenanzeige-start-img {
        0% {
            transform: scale(0.9);
        }

        100% {
            transform: scale(1);
        }
    }

    .trenner_stellenanzeige {
        margin-left: 20px;
        margin-right: 20px;
        display: none;
    }

    .next_row {
        width: 100%;
        display: block;
    }

	/* Basics */

	.show_mobile {
		display: none;
	}

	.show_tablet {
		display: block;
	}

	.show_desk {
		display: none;
	}

	.marg_bot_120 {
		margin-bottom: 80px;
	}

	.col_2 {
		column-count: 2;
		column-gap: 60px;
		text-align: justify;
	}

	.col_3 {
		column-count: 3;
		column-gap: 60px;
		text-align: justify;
	}

	.col_2 p, .col_3 p {
		margin-top: 0 !important;
	}

	/* Wrapper und Sections */

	.pad_top_120_100 {
		padding: 80px 0 70px;
	}

	.pad_top_120_100_mobile {
		padding: 80px 0 70px;
	}

	/* Links */

	/* Text and Headers */

	/* Positioning */

	/* Buttons */

	/* Navigation */

	/* Footer */

	.footer_dreier {  
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
		grid-template-rows: 1fr;
		gap: 0px 60px;
		grid-auto-flow: row;
		grid-template-areas:
		"footer_links footer_mitte footer_rechts";
	}

	.footer_links { grid-area: footer_links; }

	.footer_mitte { grid-area: footer_mitte; }

	.footer_rechts { grid-area: footer_rechts; }

	.credit_footer {
		text-align: right;
	}

	.credit_footer a {
		display: inline-block;
		opacity: 0.7;
	}

	.credit_footer span {
		display: inline-block;
		margin: 0 10px;
	}


	/* Kompetenzen Module */
    
    .kh_align_center {
		text-align: center;
    }

    .kh_marg {
    	margin: 40px 0 70px;
    }

    .kh_marg_2 {
    	margin: 40px 0 40px;
    }

    .mitarbeiter_con_flex {
        display: flex;
        flex-wrap: wrap;
        gap: 40px;
        justify-content: center;
    }

    .mensch_con {
    	flex: 0 0 calc((100% - 40px) / 2); 
		position: relative;
	  	padding-bottom: 66px;
    }

	.mensch_con img {
		display: block;
	}

	.mensch_overlay {
		background: #fff;
		padding: 20px 40px;
		width: calc(100% - 80px);
		height: 66px;
	  	margin: 0 auto;
	  	overflow: hidden;
	  	position: absolute;
	  	left: 50%;
	  	bottom: 0;
		transform: translate(-50%);
	}

	.mensch_overlay span {
		display: none;
	}

	.mensch_overlay .mensch_overlay_hide_hover {
		display: block;
	}

	.mensch_overlay h3 {
		margin: 0;
	}

	.mensch_info {
		display: none;
	}

	.mensch_zoom_in {
		display: block;
		color: var(--farbe_kupfer);
		font-size: 1.4rem;
		position: absolute;
		top: 50%;
		right: 40px;
		transform: translate(0, -50%);
	}

	.mensch_con:hover .mensch_overlay {
		width: 100%;
		height: 100%;
		padding: 60px;
		position: absolute;
		left: 50%;
		bottom: 0;
		transform: translate(-50%);
		transition: all 300ms ease-out;
	}

	.mensch_con:hover .mensch_overlay .mensch_overlay_hide_hover {
		display: none;
	}

	.mensch_con:hover .mensch_overlay span {
		display: inline-block;
	}

	.mensch_con:hover .mensch_zoom_in {
		display: none;
	}

	.mensch_con:hover .mensch_overlay .mensch_info {
		display: block;
		animation: mensch-info-hover 1s ease-out;
	}

	@keyframes mensch-info-hover {
		0% {
			opacity: 0;
		}

		25% {
			opacity: 0;
		}

		100% {
			opacity: 1;
		}
	}

	/* Content */

	.presse_text_con {
		width: calc(100% - 80px);
		margin: 0 auto;
	}

	.presse_text_inhalt {
		min-height: 130px;
	}

	.marg_bot_menschen_text {
		margin-bottom: 60px !important;
	}

	.zweier_spalten {  
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-template-rows: 1fr;
		gap: 0px 60px;
		grid-auto-flow: row;
		grid-template-areas:
		"zweier_spalten_links zweier_spalten_rechts";
	}

	.zweier_spalten_links { grid-area: zweier_spalten_links; }

	.zweier_spalten_rechts { grid-area: zweier_spalten_rechts; }

}

@media (min-width: 1024px) {

	/* STELLENANZEIGE */

	.stellenanzeige_start {
		margin-bottom: 40px;
	}

	/* Basics */

	.show_mobile {
		display: none;
	}

	.show_tablet {
		display: none;
	}

	.show_desk {
		display: block;
	}

	.show_mobile_2 {
		display: none;
	}

	.show_desk_2 {
		display: block;
	}

	/* Wrapper und Sections */

	main {
		padding-top: 195px;
	}

	.klammer_20_20 {
		width: calc(100% - 40px);
		margin: 0 auto;
	}

	.klammer_20_20_mobile {
		width: 100%;
		margin: revert;
	}

	.klammer_60_60 {
		width: calc(100% - 120px);
		margin: 0 auto;
	}

	.klammer_60_20, .klammer_20_60 {
		width: calc(100% - 80px);
	}

	.klammer_60_20 {
		margin-left: auto;
	}

	.klammer_20_60 {
		margin-right: auto;
	}

	/* Header */

	header {
		outline: 0.05rem solid #fff;
	}

	.logo {
		width: auto;
		height: 55%;
		max-height: 55px;
		position: absolute;
		left: 40px;
		top: 50%;
		transform: translate(0, -50%);
	}

	.nav_mobile {
		display: none;
	}

	.nav_desk {
		display: block;
	}

	.scroll_header {
		height: 65px;
		margin: 0 0 40px;
		transition: all 300ms ease-out;
	}
	
	.show_small_or_large {
		display: inline-block;
	}

	.toggle-symbol {
		display: none;
	}

	/* Content */

	.zweier_links_text {  
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-template-rows: 1fr;
		gap: 0px 0px;
		grid-auto-flow: row;
		grid-template-areas:
		"zweier_links_text_links zweier_links_text_rechts";
	}

	.zweier_links_text_links { grid-area: zweier_links_text_links; }

	.zweier_links_text_rechts { grid-area: zweier_links_text_rechts; }

	.zweier_links_text_inner {
		padding: 40px 0 40px 40px;
		height: 100%;
		position: relative;
	}

	.zweier_rechts_text {  
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-template-rows: 1fr;
		gap: 0px 0px;
		grid-auto-flow: row;
		grid-template-areas:
		"zweier_rechts_text_rechts zweier_rechts_text_links";
	}

	.zweier_rechts_text_links { grid-area: zweier_rechts_text_links; }

	.zweier_rechts_text_rechts { grid-area: zweier_rechts_text_rechts; }

	.zweier_rechts_text_inner {
		padding: 40px 40px 40px 0;
		height: 100%;
		position: relative;
	}

	.dis_grid_center {
  		display: grid;
		align-items: center;
	}

	.klammer_text_inner_2 {
		width: calc(100% - 70px);
		max-width: 430px;
		margin: 0 auto;
	}

	/* Kompetenz Mitarbeiter */

    .mitarbeiter_con_flex {
        display: flex;
        flex-wrap: wrap;
        gap: 40px;
        justify-content: center;
    }

	.kompetenz_zweier {  
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-template-rows: 1fr;
		gap: 0px 40px;
		grid-auto-flow: row;
		grid-template-areas:
		"kompetenz_links kompetenz_rechts";
		overflow: hidden;
	}

	.kompetenz_links { grid-area: kompetenz_links; }

	.kompetenz_rechts { grid-area: kompetenz_rechts; }

	.kompetenz_links_inner {
		padding: 60px 0;
		height: 100%;
	}

	.thema_box {
		padding: 10px 0 30px;
		margin: 0 0 10px;
	}

	.thema_box:last-child {
		margin: 0;
	}

}

@media (min-width: 1180px) {

	/* Basics */

	/* Links */

	/* Text and Headers */

	/* Positioning */

	.align_left_desk {
		text-align: left;
	}

	.align_right_desk {
	    text-align: right;
	}

	.align_center_desk {
	    text-align: center;
	}

	.align_justify_desk {
	    text-align: justify;
	}

	/* Buttons */

	/* Navigation */

	/* Content */
 
}

@media (min-width: 1200px) {

    /* Stellenanzeige Start */

    .stellenanzeige_start {
        background: rgb(255, 255, 255);
        width: 100%;
        position: relative;
        animation: stellenanzeige-start-bg 2.5s ease-in-out;
    }

    .stellenanzeige_start a {
        color: #b87f60;
        animation: stellenanzeige-start-1 2.5s ease-in-out;
    }

    .stellenanzeige_start p {
        padding: 30px;
    }

    .stellenanzeige_start_img {
        position: absolute;
        left: 30px;
        bottom: 0;
        animation: stellenanzeige-start-img 2500ms ease-in-out;
        transform-origin: bottom;
    }

    @keyframes stellenanzeige-start-img {
        0% {
            transform: scale(0.9);
        }

        100% {
            transform: scale(1);
        }
    }

    .trenner_stellenanzeige {
        margin-left: 20px;
        margin-right: 20px;
        display: inline-block;
    }

    .next_row {
        width: auto;
        display: inline;
    }

	/* Kompetenz Mitarbeiter */

    .mitarbeiter_con_flex {
        display: flex;
        flex-wrap: wrap;
        gap: 60px;
        justify-content: center;
    }

    .mensch_con {
    	flex: 0 0 calc((100% - 120px) / 3); 
    }

    /* Content */

	.presse_text_inhalt {
		min-height: 175px;
	}

}

@media (min-width: 1300px) {

	/* Wrapper und Sections */

	.pad_top_120_100 {
		padding: 120px 0 100px;
	}

	.pad_top_120_100_mobile {
		padding: 0;
	}

	.marg_bot_120 {
		margin-bottom: 120px;
	}

	/* Content */

}

/* Max-width */

.max_width_300{max-width:300px}
.max_width_305{max-width:305px}
.max_width_310{max-width:310px}
.max_width_315{max-width:315px}
.max_width_320{max-width:320px}
.max_width_325{max-width:325px}
.max_width_330{max-width:330px}
.max_width_335{max-width:335px}
.max_width_340{max-width:340px}
.max_width_345{max-width:345px}
.max_width_350{max-width:350px}
.max_width_355{max-width:355px}
.max_width_360{max-width:360px}
.max_width_365{max-width:365px}
.max_width_370{max-width:370px}
.max_width_375{max-width:375px}
.max_width_380{max-width:380px}
.max_width_385{max-width:385px}
.max_width_390{max-width:390px}
.max_width_395{max-width:395px}
.max_width_400{max-width:400px}
.max_width_405{max-width:405px}
.max_width_410{max-width:410px}
.max_width_415{max-width:415px}
.max_width_420{max-width:420px}
.max_width_425{max-width:425px}
.max_width_430{max-width:430px}
.max_width_435{max-width:435px}
.max_width_440{max-width:440px}
.max_width_445{max-width:445px}
.max_width_450{max-width:450px}
.max_width_455{max-width:455px}
.max_width_460{max-width:460px}
.max_width_465{max-width:465px}
.max_width_470{max-width:470px}
.max_width_475{max-width:475px}
.max_width_480{max-width:480px}
.max_width_485{max-width:485px}
.max_width_490{max-width:490px}
.max_width_495{max-width:495px}
.max_width_500{max-width:500px}
.max_width_505{max-width:505px}
.max_width_510{max-width:510px}
.max_width_515{max-width:515px}
.max_width_520{max-width:520px}
.max_width_525{max-width:525px}
.max_width_530{max-width:530px}
.max_width_535{max-width:535px}
.max_width_540{max-width:540px}
.max_width_545{max-width:545px}
.max_width_550{max-width:550px}
.max_width_555{max-width:555px}
.max_width_560{max-width:560px}
.max_width_565{max-width:565px}
.max_width_570{max-width:570px}
.max_width_575{max-width:575px}
.max_width_580{max-width:580px}
.max_width_585{max-width:585px}
.max_width_590{max-width:590px}
.max_width_595{max-width:595px}
.max_width_600{max-width:600px}
.max_width_605{max-width:605px}
.max_width_610{max-width:610px}
.max_width_615{max-width:615px}
.max_width_620{max-width:620px}
.max_width_625{max-width:625px}
.max_width_630{max-width:630px}
.max_width_635{max-width:635px}
.max_width_640{max-width:640px}
.max_width_645{max-width:645px}
.max_width_650{max-width:650px}
.max_width_655{max-width:655px}
.max_width_660{max-width:660px}
.max_width_665{max-width:665px}
.max_width_670{max-width:670px}
.max_width_675{max-width:675px}
.max_width_680{max-width:680px}
.max_width_685{max-width:685px}
.max_width_690{max-width:690px}
.max_width_695{max-width:695px}
.max_width_700{max-width:700px}
.max_width_705{max-width:705px}
.max_width_710{max-width:710px}
.max_width_715{max-width:715px}
.max_width_720{max-width:720px}
.max_width_725{max-width:725px}
.max_width_730{max-width:730px}
.max_width_735{max-width:735px}
.max_width_740{max-width:740px}
.max_width_745{max-width:745px}
.max_width_750{max-width:750px}
.max_width_755{max-width:755px}
.max_width_760{max-width:760px}
.max_width_765{max-width:765px}
.max_width_770{max-width:770px}
.max_width_775{max-width:775px}
.max_width_780{max-width:780px}
.max_width_785{max-width:785px}
.max_width_790{max-width:790px}
.max_width_795{max-width:795px}
.max_width_800{max-width:800px}