/*###tuerkis  #41959e*/


@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;400;500;700&display=swap');

body {
  font-family: 'Ubuntu', sans-serif;
}
* {
  margin: 0;
  padding: 0;
}

html {  scroll-padding-top: 200px;}


.mobilemenu a {text-decoration: none;}
.mobilehead  {display: none;}





.frame a:not([class]) {
  color: #41959e;
}

.btn {background: #41959e; color:#fff!important;}
.tuerkis {background: #41959e; color:#fff!important;}

.tuerkis .frame a[class=""], .tuerkis .frame a:not([class]) {color:#fff;}
.tuerkis a, .tuerkis h2, .tuerkis h3, .tuerkis h1 {color:#fff;}
/* Logo */

main hr {border:none; padding: 2% 0;}
main h5 {font-size: 3rem;}

.logo img {
  max-height: 120px;
}
.logo .frame {padding: 0;}


/* Fokus-Stile für bessere Navigation */
a:focus, button:focus {
    outline: 3px solid #ff9900;
    outline-offset: 3px;
}

/* Skip-Links (springen direkt zu den Inhalten) */
.skip-links {
    position: absolute;
    top: -100px;
    left: -10px;
    background: #000;
    color: #fff;
    padding: 10px;
    z-index: 100;
}

.skip-links a {
    color: white;
    text-decoration: none;
}

.skip-links a:focus {
    top: 10px;
}
desktopheader {--bs-gutter-x: 0px; padding-bottom: 10px;}
desktopheader .textmedia {gap:0;}
.hauptmenu {margin-top: 8px;}

.site-header {
  z-index: 100;
  position: fixed;
  width: 100%;
  transform: none;
  position: sticky;
  top: 0;
  padding-top: 8px;
  background-color: #fff;
	  display: flex;
  align-items: center;
  justify-content: space-between;
}

.logo .frame {padding: 0;}
footer .frame,
header .frame {padding: 0;}

main .textmedia {gap:0;}

footer .textmedia {gap:0;}


main .ce-headline-center a { text-decoration: none;}

.slider-fluid {display: none;}
#pageid1 .slider-fluid {display: inherit;}

main a {color: #41959e;}


footer {padding:  0 ; margin-top: 2%;}
.border-right {
  position: relative;
}

.border-right::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  
  height: 70%;
  border-right: 3px solid #41959e;
}
main h1 {color:#41959e; font-size: 3rem; font-weight: bold; text-transform: uppercase;}
main h2 {
  color: #41959e;
  font-size: 3.5rem;
  font-weight: bold;
  text-transform: uppercase;
  line-height: 2.9rem;
}

main h3 {font-size:2rem; font-weight: bold; color:#41959e; }

.card-title {font-size: 1.3rem; font-weight: bold; text-transform: none; color:#000000; line-height: 1.6;}
.card-subtitle  {color: #41959e;
  font-size: 1.6rem;
  font-weight: bold;
  text-transform: none;
  line-height: 1.9rem;
}
main .textpic-text ul {
  list-style: none;
  padding: 0;
}

main .textpic-text li {
  position: relative;
  padding-left: 30px; /* Mehr Abstand für größere Quadrate */
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #ccc; /* Trennstrich */
}

main .textpic-text li:last-child {
  border-bottom: none; /* Kein Strich nach dem letzten Element */
}

main  .textpic-text li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 16px; /* Größeres Quadrat */
  height: 16px;
  background-color: #01803d; /* Farbe */
  transform: rotate(45deg); /* Quadrat drehen */
}

.icons-small img {max-width: 40%; margin:0;}

.frame-custom-10 .image {max-width: 50%;}
.frame-custom-11 .image {max-width: 65%;}
.frame-custom-12 .image {max-width: 80%;}


.frame-space-before-extra-small {margin-top:0.5%;display: block;}
.frame-space-before-small {margin-top:3%!important;display: block;}
.frame-space-before-medium {margin-top:3% !important;}
.frame-space-before-large {margin-top:9%;display: block;}

.frame-space-after-extra-small {margin-bottom:0.5%;display: block;}
.frame-space-after-small {margin-bottom:3%;display: block;}
.frame-space-after-medium {margin-bottom:6%;display: block;}
.frame-space-after-large {margin-bottom:9%; display: block;}


.hunderter .megazeil,
.hunderter .ce-outer,
.hunderter .ce-row,
.hunderter .ce-gallery,
.hunderter .ce-textpic,
.hunderter .image { width: 100% !important;}
.hunderter .container {padding: 0 !important;}
.hunderter .frame {width: 100%; height: auto; margin: 0;
padding: 0;}

.hunderter .ce-gallery[data-ce-columns="3"] .ce-column {
    width: 33.33333% !important;}

.hunderter {max-width: 100% !important; padding: 0 !important; z-index: 0;}
.hunderter .ce-gallery img {padding: 0;width: 100%; }
.hunderter .ce-column {padding: 0 !important ;}
.hunderter .textmedia {gap:0;}
.hunderter hr {height: 0; padding: 2% 0; background:none !important;}
.hunderter .frame-container-default {
  max-width: 100%; padding: 0; margin:0;
}
footer h3  {
  color: #41959e;
  font-size: 1.6rem;
  font-weight: bold;
  text-transform: none;
  text-align: center;
}

footer p {text-align: center; }
.copyright p {font-size: 0.8rem; text-align: center; padding: 30px 0 10px;}

.contact-bar {
    padding: 15px 0px;
    display: flex;
    align-items: center;
    gap: 40px;              /* Abstand zwischen den Blöcken */
    background: #ffffff;
}

.contact-item {
    display: inline-flex;
    align-items: center;
    font-size: 18px;
    color: #000;
}

.contact-item i {
    margin-right: 10px;
    font-size: 22px;
    color: #28a3ac;          /* Türkis */
}

.contact-link {
    color: #28a3ac;
    text-decoration: none;
    font-size: 20px;
}

.contact-link:hover {
    text-decoration: underline;
}



/* Frame-Custom-10: Quadratische, runde Portraits */
.frame-custom-10 .gallery-item,
.frame-custom-10 .image,
.frame-custom-10 picture {
    width: 240px;   /* feste Breite */
    height: 240px;  /* gleiche Höhe = quadratisch */
    max-width: 100%;
    aspect-ratio: 1 / 1; /* falls Browser unterstützt */
    overflow: hidden;
    border-radius: 50%; /* macht das Quadrat rund */
    margin-left: auto;
    margin-right: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Bild crop korrekt */
.frame-custom-10 .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center; /* Fokus zentral */
    border-radius: 50%;
    display: block;
}

/* Optional: Hover-Zoom */
.frame-custom-10 .image img {
    transition: transform .3s ease;
}

.frame-custom-10 .image:hover img {
    transform: scale(1.05);
}


.frame-custom-10 .image img {
    transition: transform .3s ease;
}

.frame-custom-10 .image:hover img {
    transform: scale(1.05);
}

@media (max-width: 768px) {
  .frame-custom-10 .image {
    width: 160px;
    height: 160px;
  }
}


.custom-divider {
    width: 100%;
    display: flex;
    align-items: center;
    padding: 20px 0; /* optional Abstand oben / unten */
	margin-top: 70px;
}

/* Linien links + rechts */
.custom-divider::before,
.custom-divider::after {
    content: "";
    flex: 1;
    height: 4px; /* Linienstärke wie im Screenshot */
    background: #28a3ac;
    border-radius: 10px;
}

/* Abstand zwischen Logo und Linien */
.custom-divider img {
    display: block;
    max-height: 80px; /* Größe des Logos → anpassen falls nötig */
    margin: 0 20px;
}


@media (max-width: 600px) {
    .custom-divider img {
        max-height: 50px;
        margin: 0 12px;
    }
    .custom-divider::before,
    .custom-divider::after {
        height: 3px;
    }
}

.frame-custom-21 picture {
  overflow: hidden;
  position: relative;
	border-radius: 50px;}


/* Ausgangszustand ganz dezent */
#main-content .scroll-reveal {
    opacity: 0;
    transform: translateY(10px);
    transition:
        opacity 0.8s ease-out,
        transform 0.8s ease-out;
    will-change: opacity, transform;
}

/* Sichtbar im Viewport */
#main-content .scroll-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}
