@font-face {
    font-family: 'HK Grotesk';
    src: url('../../webfonts/hk-grotesk/hkgrotesk-regular-webfont.woff2') format('woff2'),
         url('../../webfonts/hk-grotesk/hkgrotesk-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'HK Grotesk';
    src: url('../../webfonts/hk-grotesk/hkgrotesk-italic-webfont.woff2') format('woff2'),
         url('../../webfonts/hk-grotesk/hkgrotesk-italic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'HK Grotesk';
    src: url('../../webfonts/hk-grotesk/hkgrotesk-medium-webfont.woff2') format('woff2'),
         url('../../webfonts/hk-grotesk/hkgrotesk-medium-webfont.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'HK Grotesk';
    src: url('../../webfonts/hk-grotesk/hkgrotesk-semibold-webfont.woff2') format('woff2'),
         url('../../webfonts/hk-grotesk/hkgrotesk-semibold-webfont.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Zodiak';
    src: url('../../webfonts/zodiak/Zodiak-Light.woff2') format('woff2'),
         url('../../webfonts/zodiak/Zodiak-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
  font-family: 'Roboto-Bold';
  src: local("☺"), url("../webfonts/Roboto-Bold.woff2") format("woff2"), url("../webfonts/Roboto-Bold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal; }

:root{
    --font-global: 'HK Grotesk', sans-serif;
    --font-alt: 'Zodiak', serif;
    --section-padding-y: 160px;
     --color-dark-1: #111;
    --color-gray-1: #777;
    --border-radius-default: 5px;
    --box-shadow-block: 0px 5px 80px 0px rgba(51, 51, 51, 0.03),0px 4px 50px 0px rgba(51, 51, 51, 0.03),0px 3px 25px 0px rgba(51, 51, 51, 0.03),0px 2px 10px 0px rgba(51, 51, 51, 0.03),0px 1px 5px 0px rgba(27, 30, 53, 0.03);
}



body{
    letter-spacing: -0.008em;
	color: #262626;
}
.font-alt{
    font-weight: 300;
}
.lead{
    font-size: 28px;
    line-height: 1.357; 
}

h3, h4, h5,
.h3, .h4, .h5{
    letter-spacing: -0.0177em;
	font-family: "Roboto-Bold"
}
b, strong{
    font-weight: 600;
}
blockquote p {
    letter-spacing: -0.02em;
}
.inner-nav ul{
    font-size: 17px;
    line-height: 1.6; 
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.0095em;
	color: #fff;
}
.inner-nav > ul > li > a{
    opacity: 1 !important;     
}
.inner-nav ul li a{
    position: relative;
}
.inner-nav > ul > li > a:not(.no-hover):before{
    content: "";
    position: absolute;
    top: calc(50% + 0.7em);
    left: 0;
    display: block;
    width: 100%;
    height: 1px;
    transform: scaleX(0);
    transform-origin: 0 50%;
    transition: transform .27s var(--ease-default);
}
.inner-nav > ul > li > a.active:before{
    transform: scaleX(1);
}
.main-nav.mobile-on .inner-nav > ul > li > a:not(.no-hover):before{
    display: none;
}
.inner-nav > ul > li > a:not(.no-hover):after{
    content: "";
    position: absolute;
    top: calc(50% - 0.5em);
    right: -0.5em;
    display: block;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    opacity: 0;
    transform: scale(0);
    transition: var(--transition-default);
}
.inner-nav > ul > li > a:hover:after{
    opacity: 1;
    transform: scale(1);
}
.form input[type="text"],
.form input[type="email"],
.form input[type="number"],
.form input[type="url"],
.form input[type="search"],
.form input[type="tel"],
.form input[type="password"],
.form input[type="date"],
.form input[type="color"],
.form select{
    padding-bottom: 2px;
    border: 2px solid #262626;
}
.form textarea{
    border: 2px solid #262626;
}
.form input[type="text"].input-sm,
.form input[type="email"].input-sm,
.form input[type="number"].input-sm,
.form input[type="url"].input-sm,
.form input[type="search"].input-sm,
.form input[type="tel"].input-sm,
.form input[type="password"].input-sm,
.form input[type="date"].input-sm,
.form input[type="color"].input-sm,
.form select.input-sm,
.form textarea.input-sm{
    font-size: 16px;
}
.form input[type="text"].input-md,
.form input[type="email"].input-md,
.form input[type="number"].input-md,
.form input[type="url"].input-md,
.form input[type="search"].input-md,
.form input[type="tel"].input-md,
.form input[type="password"].input-md,
.form input[type="date"].input-md,
.form input[type="color"].input-md,
.form select.input-md,
.form textarea.input-md{
    font-size: 17px;
}
.form input[type="text"].input-lg,
.form input[type="email"].input-lg,
.form input[type="number"].input-lg,
.form input[type="url"].input-lg,
.form input[type="search"].input-lg,
.form input[type="tel"].input-lg,
.form input[type="password"].input-lg,
.form input[type="date"].input-lg,
.form input[type="color"].input-lg,
.form select.input-lg,
.form textarea.input-lg{    
    font-size: 18px;
	color: #262626;
}
.form input[type="text"].input-lg,
.form input[type="email"].input-lg,
.form input[type="number"].input-lg,
.form input[type="url"].input-lg,
.form input[type="search"].input-lg,
.form input[type="tel"].input-lg,
.form input[type="password"].input-lg,
.form input[type="date"].input-lg,
.form input[type="color"].input-lg,
.form select.input-lg{
    height: 54px;
    line-height: 54px;  
	color: #262626;
}
.form textarea.input-lg {
    padding-top: 11px;
    padding-bottom: 11px;
}
.form input[type="text"]::placeholder,
.form input[type="email"]::placeholder,
.form input[type="number"]::placeholder,
.form input[type="url"]::placeholder,
.form input[type="search"]::placeholder,
.form input[type="tel"]::placeholder,
.form input[type="password"]::placeholder,
.form input[type="date"]::placeholder,
.form input[type="color"]::placeholder,
.form select::placeholder,
.form textarea::placeholder{
    color: #262626;
}
.mobile-nav input[type="text"],
.visually-hidden input[type="email"],
.light-content input[type="number"],
.light-content input[type="url"],
.light-content input[type="search"],
.light-content input[type="tel"],
.light-content input[type="password"],
.light-content input[type="date"],
.light-content input[type="color"],
.light-content select,
.light-content textarea{
    border-color: #262626;
}
.form .form-group{
    margin-bottom: 25px;
	color: #262626;
}
.form label{
    margin-bottom: 12px;
    font-size: 20px;
	color: #262626;
}
.form input.newsletter-field.error{
    border-color: #dc3545 !important;
}
.form-tip,
.form-tip a{
    font-size: 14px;
}



.btn-mod,
a.btn-mod{    
    font-weight: 500;
}
.btn-mod.btn-medium{
    padding: 10px 22px;
    font-size: 16px;
    letter-spacing: 0.0025em;
}
.btn-mod.btn-large{
    padding: 13px 30px;
    font-size: 17px;
    letter-spacing: 0.0017em;
}
.link-hover-anim{
    letter-spacing: 0.0095em;
}
.hs-status{
    border-width: 1px;
}
.scroll-down-4{
    border-width: 1px;
}
.section-caption-border{
    padding: 0.4em 0.8em 0.5em;
}
.section-title{
    font-size: 60px;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.012em;
}
.section-title-strong{
    font-weight: 800;
}
.features-list-icon{
    top: 0.2em;
}
.tpl-alt-tabs > li{
    letter-spacing: -0.02em;
}
.post-prev-2-img{
    margin-bottom: 17px;
}
.post-prev-2-title{
    margin-bottom: 10px;
    font-size: 24px;
    font-weight: 500;
}
.post-prev-2-info{
    font-size: 16px;
    text-transform: unset;
    letter-spacing: 0;
}
.footer-social-links a{
    width: 42px;
    height: 42px;    
    margin: 0 3px;
    font-size: 16px;
    overflow: visible; 
    border: 1px solid #262626;
    border-radius: 50%;
    isolation: isolate;
    transform: translateZ(0);
}
.footer-social-links a:hover{
    border-color: transparent;
}
.footer-social-links a:hover:before{
    transform: scale(1.1);
}
.light-content .fw-top-link .icon{
    width: 42px;
    height: 42px;
    transition: all .27s var(--ease-out-medium);
}
.light-content .fw-top-link .icon:before{
    transition: all .27s var(--ease-out-medium);
}
.footer-text a{
    color: #262626;
    text-decoration: underline;
}
.features-1-title{
	color: #095256 ;
    font-weight: 600; 
}
.features-2-item:before{
    border: 1px solid var(--color-blue-1);
	background:	none;
    opacity: 0.15;
    transition: opacity .27s var(--ease-default);
    z-index: -1;
}
.features-2-item:hover:before{
    opacity: 1;
}
.features-2-label{
    font-weight: 500;
    color: var(--color-blue-1);
    background: none;
    -webkit-background-clip: unset;
    -webkit-text-fill-color: unset;
}
.features-2-icon:before{
    background: var(--color-gray-light-1);
    opacity: 1;
    z-index: -1;
}
.features-2-icon svg{
    fill: var(--color-blue-1);
}
.light-content .features-2-item:before{    
	background: var(--color-dark-mode-gray-2);
    border: 1px solid var(--color-dark-mode-gray-2);
    transition: border-color .27s var(--ease-default);
    opacity: 1;
    z-index: -1;
}
.light-content .features-2-item:hover:before{
    background: var(--color-dark-mode-gray-2);
    opacity: 1;
}
.light-content .features-2-label{
    color: #262626;
    background: none;
    -webkit-background-clip: unset;
    -webkit-text-fill-color: unset;
}
.light-content .features-2-icon{
    color: #262626;
}
.light-content .features-2-icon svg{
    fill: #262626;
}
.light-content .features-2-icon:before{
    background: var(--color-dark-mode-gray-2);
    opacity: 1;
    z-index: -1;
}
.light-content .features-2-descr{
    color: var(--color-dark-mode-gray-1);
}
.bg-border-gradient:before{
    background: none;
    border: 1px solid var(--color-blue-1);
    opacity: 0.15;
}
.light-content .bg-border-gradient:before{
    background: none;
    border: 1px solid var(--color-blue-1);
    opacity: 0.25;
}
.bg-gradient-dark-alpha-1:before{
    opacity: .9;
}
.bg-gradient-dark-alpha-2:before{
    opacity: .9;
}
.work-navigation a, .work-navigation a:visited{
    color: var(--color-dark-1)
}
address {
	color: #262626;
}


/*** STELLENANGEBOT ***/

.stellenangebote-section {
    background-color: #f8f9fa;
    padding: 60px 0;
}

.stellenangebot-card {
    background: #ffffff;
    border: 1px solid #dddddd;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s, box-shadow 0.2s;
}

.stellenangebot-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.stellenangebot-card .card-body {
    padding: 20px;
}

.stellenangebot-card .card-title {
    font-size: 1.25rem;
    font-weight: 600;
}

.stellenangebot-card .card-text {
    margin-bottom: 20px;
}

.stellenangebot-card .btn-primary {
    background-color: #fff;
    border-color: #A0C1B9;
    border-radius: 50px;
    padding: 10px 20px;
    text-transform: uppercase;
	Color: #262626;
    font-weight: bold;
}

.stellenangebot-card .btn-primary:hover {
    background-color: #095256;
    border-color: #095256;
	text-decoration: none;
	color: #fff;
}





/* BLOG */
.blog {
  position: relative;
  z-index: 9;
  margin-bottom: 50px;
}

.blog .entry-image {
  overflow: hidden;
}

.blog .entry-image > a {
  display: block;
  overflow: hidden;
}

.blog .entry-image img {
  -webkit-transition: all 1s ease;
  -o-transition: all 1s ease;
  -moz-transition: all 1s ease;
  transition: all 1s ease;
}

.blog .entry-image:hover img {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);
  -webkit-transition: all 1s ease;
  -o-transition: all 1s ease;
  -moz-transition: all 1s ease;
  transition: all 1s ease;
}

.blog .entry-title {
  margin-top: 30px;
  margin-bottom: 5px;
}

.blog .entry-title a {
  font-size: 18px;
  color: #222;
  text-transform: uppercase;
}

.blog .entry-title a:hover {
  color: #666;
}

.blog .entry-meta {
  font-size: 11px;
  color: #888;
  letter-spacing: 0.3em;
  display: inline-block;
}


    #calendarTable td {
        width: 45px;
        text-align: center;
        cursor: pointer;
    }
    .event-cell {
        background-color: var(--color-yellow-2);
        color: #fff;
        font-weight: 800;
    }
    .today-cell {
        border: 2px solid var(--color-blue-1);
    }

#eventDetails h2 {
    font-size: 18px; /* Ändere die Schriftgröße nach Bedarf */
    margin: 0; /* Entferne oder passe den Außenabstand an */
}

#eventDetails p {
    font-size: 14px; /* Ändere die Schriftgröße nach Bedarf */container2
    margin: 5px 0; /* Passe den Außenabstand an */
}


#eventDetails a {
    text-decoration: none; /* Entfernt die Unterstreichung */
    color: #000; /* Setzt die Textfarbe auf schwarz oder eine Farbe deiner Wahl */
}

#eventDetails a:hover {
    text-decoration: none; /* Optional: Unterstreicht den Link nur beim Hover */
    color: var(--color-blue-1); /* Ändert die Farbe beim Hover, wenn gewünscht */
}

#eventDetails {
    padding: 10px; /* Füge einen Innenabstand hinzu */
    margin-top: 10px; /* Abstand nach oben */
    background-color: #f9f9f9; /* Optional: Hintergrundfarbe für Eventdetails */
    border-radius: 5px; /* Optional: Runde Ecken */
}



.image-container1 {
    display: flex;
}

.image-container1 a {
    margin-right: 10px; /* Optional: Fügt einen Abstand zwischen den Bildern hinzu */
}

.fullWidthImage {
    width: 100%;
    transform: translateX(-100%); /* Start außerhalb des Sichtbereichs */
    transition: transform 1.2s ease-out;
}

.active-slide-in .fullWidthImage {
    transform: translateX(0); /* Bild wird in den sichtbaren Bereich geschoben */
}

.image-slide-left {
    opacity: 0;
    transform: translateX(100%); /* Start außerhalb des sichtbaren Bereichs */
    transition: transform 0.8s ease-out, opacity 0.8s ease-out;
	z-index: 1;
}

/* Sobald das Bild sichtbar wird */
.page-section .image-slide-left.is-visible {
    opacity: 1;
    transform: translateX(0); /* Endposition im sichtbaren Bereich */
}	

@media only screen and (max-width: 1366px) {
    :root{
        --section-padding-y: 140px;
    }
    .container{
        max-width: var(--container-width);
    }    
    .section-title{
        font-size: calc(1.138rem + 3.06vw);
    }
    .post-prev-2-title{
        font-size: calc(1.235rem + 0.31vw);
    }
}
@media only screen and (max-width: 480px) {
    .lead{
        font-size: 20px;
    }
		
}



/* Medienabfragen für responsives Verhalten */
@media (max-width: 991px) {
    .row .col-sm-5 {
        order: 2;
    }
    .row .col-sm-8 {
        order: 1;
    }
}