@charset "UTF-8";
/* Overpass - Thin (100) */
@font-face {
  font-family: 'Overpass';
  src: url("../Fonts/Overpass/Overpass-Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal; }
/* Overpass - ExtraLight (200) */
@font-face {
  font-family: 'Overpass';
  src: url("../Fonts/Overpass/Overpass-ExtraLight.ttf") format("truetype");
  font-weight: 200;
  font-style: normal; }
/* Overpass - Light (300) */
@font-face {
  font-family: 'Overpass';
  src: url("../Fonts/Overpass/Overpass-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal; }
/* Overpass - Regular (400) */
@font-face {
  font-family: 'Overpass';
  src: url("../Fonts/Overpass/Overpass-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal; }
/* Overpass - Medium (500) */
@font-face {
  font-family: 'Overpass';
  src: url("../Fonts/Overpass/Overpass-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal; }
/* Overpass - SemiBold (600) */
@font-face {
  font-family: 'Overpass';
  src: url("../Fonts/Overpass/Overpass-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal; }
/* Overpass - Bold (700) */
@font-face {
  font-family: 'Overpass';
  src: url("../Fonts/Overpass/Overpass-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal; }
/* Overpass - ExtraBold (800) */
@font-face {
  font-family: 'Overpass';
  src: url("../Fonts/Overpass/Overpass-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal; }
/* Overpass - Black (900) */
@font-face {
  font-family: 'Overpass';
  src: url("../Fonts/Overpass/Overpass-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal; }
.card-panel {
  background: #6aa68c;
  border: 0px;
  padding: 30px;
  color: #fff; }

.card-panel h2, .card-panel h3 {
  color: #fff !important;
  border-bottom: solid #fff 0.6px; }

@media (min-width: 1200px) {
  .pagelevel-1 .container-fluid, .container-mainnavigation.container-fluid {
    padding-left: 10vw;
    /* 10% auf beiden Seiten, ergibt 80% max Inhalt */
    padding-right: 10vw; } }
.btn-group.powermail_multistep_navigation {
  margin-bottom: 60px;
  display: none; }

body {
  font-family: Overpass !important; }

.tx-powermail button.btn.btn-secondary.active {
  background: #028374; }

li.nav-item {
  white-space: nowrap; }

.navbar-mainnavigation .nav-item {
  flex-wrap: initial; }

.zero .frame-container, .zero .container {
  max-width: none; }

.carousel-fullscreen h1.carousel-header, .carousel-fullscreen h2, .carousel-fullscreen h3 {
  background: #028374;
  padding: 20px;
  color: #fff !important;
                       /*
width: max-content;*/
  max-width: 80vw; }

.carousel-inner, .carousel-item {
  max-height: 70vh; }

.frame-type-carousel_fullscreen, .frame-type-carousel_fullscreen .frame-container, carousel-fullscreen {
  width: 100%;
  max-width: unset;
  padding: 0px;
  max-height: 70vh;
  overflow: hidden; }

div.bg-primary {
  background-color: #028374 !important; }

footer a {
  color: #fff;
  font-weight: bold; }

.ueber_uns, .landing_vorteile, .ueber_uns li {
  font-size: 1.2em !important; }

legend.powermail_legend {
  display: none; }

.carousel-item-layout-light .carousel-content-inner {
  background: #fff; }

.carousel-control-next-icon, .carousel-control-prev-icon {
  background-color: #028374; }

.local h4 {
  border-bottom: solid #028374 1px;
  margin: 20px 0 5px 0; }

.start ul {
  list-style: none;
  /* Bullet Points entfernen */
  padding: 0;
  margin: 0; }

.start ul li {
  padding: 12px 0;
  /* Vertikaler Abstand zwischen den Punkten */
  border-bottom: 1px solid #e0e0e0;
  /* Dezente Linie für bessere Lesbarkeit */
  font-size: 1rem;
  line-height: 1.6;
  align-items: center;
  gap: 10px;
  font-weight: 500; }

.start ul li:last-child {
  border-bottom: none;
  /* Keine Linie beim letzten Element */ }

figure.image picture {
  display: flex;
  justify-content: center; }

figure.image picture img {
  display: block;
  max-width: 100%;
  height: auto; }

:root {
  --frame-spacing-xl: 4.625rem !important; }

.claim p {
  display: inline-block;
  margin: 0 10px 10px 0;
  /* Abstand zwischen den Buttons */ }

.claim a.btn {
  display: inline-block;
  padding: 10px 16px;
  font-size: 1rem;
  text-decoration: none;
  margin: 5px 8px;
  border-radius: 6px;
  white-space: nowrap; }

@media (max-width: 600px) {
  .claim p {
    display: block;
    margin: 8px auto;
    text-align: center; } }
.tx-powermail .container-fluid {
  padding: 0px; }

.kontakt .card-group-element-item {
  max-width: 300px; }

.tx-powermail h3 {
  font-size: 2em;
  padding: 30px 0px; }

.texticon-left .texticon-content *:first-child, .texticon-right .texticon-content *:first-child {
  margin-top: 50px; }

.texticon-left .texticon-icon {
  margin-top: 25px; }

button.cm-btn.cm-btn-success {
  background: #028374 !important;
  color: #fff !important; }

.radio-image-selection-container {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  justify-content: center; }

.radio-image-option {
  position: relative;
  text-align: center;
  border: 2px solid transparent;
  border-radius: 8px;
                   /*
overflow: hidden;*/
  transition: 0.3s ease-in-out;
  cursor: pointer; }

.radio-image-input {
  display: none; }

.radio-image-label {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 10px;
  border-radius: 8px;
  transition: all 0.3s ease-in-out;
  text-align: center; }

.radio-image {
  width: 100px;
  height: auto;
  border-radius: 5px;
  transition: all 0.3s ease-in-out; }

.radio-image-text {
  font-size: 14px;
  color: #333;
  margin-top: 5px; }

/* Hover-Effekt */
.radio-image-option:hover .radio-image-label {
  transform: scale(1.05); }

/* Markierte Radio-Option */
.radio-image-input:checked + .radio-image-label {
  border: 2px solid #028374;
  box-shadow: 0 0 10px rgba(0, 123, 255, 0.5);
  background-color: rgba(0, 123, 255, 0.1); }

/*

form.powermail_form {
  background: #d7e3f1;
  padding: 20px;
  border: solid grey 1px;
  min-height: 300px;
  }*/
.tx-powermail h3 {
  font-size: 3em; }

.powermail_tab_navigation {
  display: flex;
  justify-content: space-between;
  /* Verteilt die Buttons */ }

.powermail_tab_navigation .btn-primary {
  margin-left: auto;
  /* Schiebt den Weiter-Button nach rechts */ }

.powermail_radiowrap + .powermail_radiowrap {
  margin-block-start: unset; }

/* Größerer und dickerer Slider */
.styled-slider {
  -webkit-appearance: none;
  width: 100%;
  height: 12px;
  /* Dickere Höhe */
  background: linear-gradient(to right, #028374, #028374);
  /* Schicker Verlauf */
  border-radius: 6px;
  outline: none;
  opacity: 0.9;
  transition: opacity 0.2s; }

/* Schöner Hover-Effekt */
.styled-slider:hover {
  opacity: 1; }

/* Der "Knopf" des Sliders */
.styled-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 24px;
  /* Größerer Punkt */
  height: 24px;
  background: white;
  border: 3px solid #028374;
  border-radius: 50%;
  cursor: pointer;
  transition: background 0.3s ease-in-out;
  margin-top: -8px !important; }

.styled-slider::-webkit-slider-thumb:hover {
  background: #028374; }

/* Für Firefox */
.styled-slider::-moz-range-thumb {
  width: 24px;
  height: 24px;
  background: white;
  border: 3px solid #028374;
  border-radius: 50%;
  cursor: pointer; }

/* Container für die Wert-Anzeige */
#slider_value_container {
  text-align: center;
  font-size: 24px;
  /* Größere Schrift */
  font-weight: bold;
  margin-top: 10px;
  color: #028374; }

/* Basis-Styling für den Fortschrittsbalken */
#progress-container {
  width: 100%;
  background-color: #afafaf;
  border-radius: 5px;
  position: relative;
  height: 25px;
  margin-bottom: 20px;
  overflow: hidden; }

/* Fortschrittsbalken */
#progress-bar {
  height: 100%;
  width: 0%;
  background-color: #028374;
  transition: width 0.5s ease-in-out; }

/* Fortschrittstext */
#progress-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-weight: bold;
  color: white; }

.fade {
  opacity: 0;
  transition: opacity 2s ease-in-out;
  /* Sanfter Übergang */ }

.fade.show {
  opacity: 1; }

h3 {
  border-bottom: solid #fff 1px;
  font-size: 1.7em;
  margin-bottom: 20px !important; }

h1, h2, h3 {
  font-size: 1.7em;
  color: #028374 !important;
  font-weight: 700; }

.bg-primary h1, .bg-primary h2, .bg-primary h3 {
  color: #fff !important; }

.form-label {
  display: none; }

input {
  height: 55px; }

textarea {
  height: 200px; }

.row.gx-5.bg-primary.text-white.landing_kontakt {
  padding-inline: 15%;
  overflow: visible;
  font-size: 1.5em; }

.bg-primary button.btn.btn-primary {
  background: #fff; }

.bg-primary button.btn.btn-primary {
  color: #028374; }

a:hover {
  cursor: pointer; }

a {
  text-decoration: none; }

.bi, .btn {
  font-size: inherit; }

.bi::before, [class*=" bi-"]::before, [class^=bi-]::before {
  display: inline-block;
  margin-right: 8px; }

p.header-footer {
  font-weight: bold;
  font-size: 1.5em;
  border-bottom: solid #fff 0.5px;
  margin-bottom: 20px; }

.accordion-button, .accordion-button.collapsed {
  background-color: #028374 !important;
  color: #fff !important;
  font-weight: 800; }

.bp-page-header.navbar.nav-scrolled {
  position: fixed;
  /* Navigation wird fixiert */
  padding: 1em;
  /* Anpassung des Innenabstands */
  transition: padding 0.3s ease, background-color 0.3s ease;
  /* Weicher Übergang für Änderungen */ }

.bp-page-header.navbar {
  transition: all 0.3s ease-in-out;
  /* Übergang für alle Eigenschaften */ }

.anfrage {
  white-space: nowrap; }

.btn-primary {
  color: #fff; }

.card {
  background: #028374;
  color: #fff; }

.card-body h4, .card-body h3 {
  font-weight: 600;
  border-bottom: solid #fff 0.5px; }

a.btn.btn-info {
  background: #fff;
  color: #595959; }

a.btn.btn-info:hover {
  background: #d6ece3;
  color: #595959; }

.card-body a {
  white-space: nowrap; }

.ansprechpartner .card-group-element-item {
  --cardgroup-columns: 1; }

/*
.frame-container.frame-container-default {
    max-width: inherit;
}*/
/* Standard-Stil für die Desktop-Ansicht */
.quick-contact {
  position: fixed;
  top: 50%;
  /* Zentriert am rechten Bildrand */
  right: 0;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 0;
  z-index: 1000; }

.contact-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  background-color: #028374;
  /* Primärfarbe */
  color: #fff;
  text-decoration: none;
  transition: background-color 0.3s ease, transform 0.3s ease;
  border: none;
  font-size: 24px; }

.contact-icon:hover {
  background-color: #015148;
  /* Dunklere Farbe bei Hover */
  transform: scale(1.05); }

footer .col-md-4 {
  margin-bottom: 25px; }

.page-26 .row.kontakt, .page-12 .row.kontakt, .page-13 .row.kontakt {
  display: none; }

/* Sicherstellen, dass beide Spalten dieselbe Höhe haben */
.row {
  display: flex;
  align-items: stretch; }

.bild-zero * {
  margin: 0px !important;
  padding: 0px !important;
  height: 100% !important; }

.bild-zero .frame-container {
  max-width: 3000px !important; }

.gmaps .frame-container {
  max-width: unset !important;
  padding: 0px; }

/* Bild-Spalte nimmt volle Höhe an */
.bild-zero {
  display: flex;
  align-items: stretch; }

/* Bild-Container anpassen */
.bild-zero .frame-type-image {
  height: 100%;
  display: flex;
  align-items: stretch; }

/* Bild an die Höhe der Spalte anpassen */
.gallery-item figure,
.gallery-item figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Bild wird nicht verzerrt */ }

/* _____________________ */
.scroll-top {
  display: none; }

iframe {
  width: 100%;
  max-width: 100% !important; }

/* Mobile Ansicht */
@media (min-width: 768px) and (max-width: 1699px) {
  span.nav-link-text {
    font-size: 0.8em; } }
/* Mobile Ansicht */
@media (min-width: 768px) and (max-width: 1399px) {
  span.nav-link-text {
    font-size: 0.6em; } }
/* Mobile Ansicht */
@media (max-width: 991px) {
  .texticon-icon {
    display: none; }

  h1, h2, h3 {
    font-size: 1.3em; }

  .textmedia, .textpic {
    gap: 0px; } }
/* Mobile Ansicht */
@media (max-width: 768px) {
  .quick-contact {
    right: 0;
    left: 0;
    bottom: 0;
    top: auto;
    width: 100%;
    background: rgba(2, 131, 116, 0.95);
    /* Leichte Transparenz für mobile UX */
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    padding: 10px 0;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    transform: translateY(0);
    /* Entfernt vertikales Zentrieren */ }

    /*
    .card-panel
    {
        padding: 0px;
    }
    
*/
  ul.list-normal {
    padding-inline-start: 10px; }

  .radio-image-selection-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    /* 2 Spalten */
    gap: 15px;
    /* Abstand zwischen den Elementen */
    width: 100%; }

  .radio-image-option {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: left;
    width: 100%; }

  .radio-image-label {
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center; }

  .radio-image {
    max-width: 100%;
    height: auto; }

  #powermail_field_wobefindetsichdiezuverwaltendeimmobilie::placeholder {
    font-size: 11px; }

  .contact-icon {
    width: 50px;
    height: 50px;
    font-size: 22px;
    background-color: transparent;
    /* Hintergrund auf Mobile entfernen */
    box-shadow: none; }

  a.scroll-top {
    display: none;
    order: 4;
    /* Sorgt dafür, dass es als letztes Icon erscheint */ }

  .card.card-panel .card-body {
    padding: 0px; }

  .texticon-left .texticon-content *:first-child, .texticon-right .texticon-content *:first-child {
    margin-top: 10px; }

  .ueber_uns, .ueber_uns li, .landing_vorteile, .carousel-fullscreen h1.carousel-header, .carousel-fullscreen h2, .carousel-fullscreen h3 {
    font-size: 1em !important; }

  body {
    overflow-x: hidden; }

  .quick-contact a.scroll-top {
    display: block;
    position: relative;
    bottom: unset;
    right: unset;
    background: none;
    width: unset;
    height: auto !important;
    margin-top: 6px; }

  footer.footer.bg-dark.text-white.py-4 {
    padding-bottom: 120px !important; }

  .contact-icon {
    width: 45px;
    /* Kleinere Breite */
    height: 45px;
    /* Kleinere Höhe */
    font-size: 20px;
    /* Kleinere Icons */
    border-radius: 4px;
    /* Leicht abgerundete Ecken */ } }