/* Header Style */
.nav-wrapper {
  /* mix-blend-mode: overlay; */
  /* color: color-mix(in srgb, var(--background-color) 50%, white); */
  height: 64px;
  /* background: rgba(15, 15, 15, 0.75); */
  padding: 0px;
  background: rgba(15, 15, 15, 0);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  z-index: 999;
}

.navbar-nav .nav-link {
  font-weight: 600; /* Erhöht die Schriftstärke (400 = normal, 700 = fett) */
}

.nav-wrapper ul li {
  padding-top: 0px;
}

.nav-wrapper ul li a {
  color: white;
  font-size: 14px;
  margin-right: 24px;
}

.nav-wrapper ul li a:hover {
  color: white !important;
  text-decoration: none;
}

.nav-wrapper ul img {
  margin-top: -5px !important;
}

.navbar-hamburger {
  display: block;
  box-shadow: none !important;
}

.awx-card {
  background-color: blue;
}

.navbar-toggler {
  margin-top: -8px;
  color: #f0f;
}

.nav-item {
  text-align: left !important;
  margin-top: 12px;
  border-bottom: 1px solid #4b4b4b;
  white-space: nowrap;
}

.navbar-brand {
  padding-top: 0px;
  margin-right: 24px !important;
}

.nav-menu .current-menu-item a {
  /* color: #A7C7E7 !important; */
  /* ZZZZZZZ */
  color: white !important;
  text-decoration: none !important;
}

.menu-item-gtranslate {
  position: relative;
  color: white;
  padding-top: 10px !important;
  padding-bottom: 18px !important;
  margin-top: 10px !important;
  margin-bottom: -10px !important;
  margin-right: -50px !important;
}

.menu-item-gtranslate a {
  color: white;
  font-size: 18px !important;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  transition: opacity 0.3s ease-out;
}

.menu-item-gtranslate img {
  width: 24px;
  height: 24px;
  object-fit: cover;
  border-radius: 50%;
}

.menu-item-gtranslate span {
  font-size: 12px;
  line-height: 1;
  margin-top: -10px;
  padding-top: 12px;
}

.menu-item-gtranslate .dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  margin: 0 0 0 -20px;
  padding: 10px 0;
  list-style: none;
  background: rgba(15, 15, 15, 0.8);
  backdrop-filter: blur(
    10px
  ) !important; /* Weiche Unschärfe für den Hintergrund */
  -webkit-backdrop-filter: blur(10px) !important; /* Safari-Unterstützung */
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  width: max-content;
  z-index: 1000;
  border-radius: 10px;
}

.menu-item-gtranslate:hover .dropdown-menu,
.menu-item-gtranslate:focus-within .dropdown-menu {
  display: block;
}

.menu-item-gtranslate .dropdown-menu li {
  padding: 5px 20px;
}

.menu-item-gtranslate .dropdown-menu li a {
  display: flex;
  align-items: center;
  color: white !important;
  font-size: 18px;
}

.menu-item-gtranslate .dropdown-menu li a:hover {
  /* background: rgba(255, 255, 255, 0.1); */
  color: white;
}

#location-table {
  border-collapse: collapse;
  width: 100%; /* Optional: Tabelle auf die volle Breite setzen */
}

#location-table th,
#location-table td {
  border-bottom: 1px solid #444; /* Nur Querlinien */
  line-height: 1.6; /* Vergrößert den Zeilenabstand */
  font-size: 14px;
  vertical-align: middle; /* Inhalte vertikal zentrieren */
  padding: 8px; /* Optional: Innenabstand für bessere Lesbarkeit */
}

.flag-icon {
  display: inline-block;
  width: 24px;
  height: 24px;
  background-size: cover; /* Verhindert Verzerrungen und sorgt dafür, dass das Bild den gesamten Container ausfüllt */
  background-repeat: no-repeat;
  border-radius: 50%; /* Macht die Flagge rund */
  object-fit: cover; /* Stellt sicher, dass das Bild korrekt skaliert wird und nicht verzerrt wird */
  object-position: center; /* Zentriert das Bild, damit es nicht abgeschnitten wird */
  border: 1px solid #ccc; /* Grauer Rand */
}

#location-table td:nth-child(2), /* 2. Spalte */
#location-table td:nth-child(4) {
  /* 3. Spalte */
  white-space: nowrap; /* Verhindert Zeilenumbruch */
}

#location-table a {
  color: #1428a0; /* Samsung Blau */
  text-decoration: none; /* Unterstreichung entfernen */
}

#location-table a:hover {
  text-decoration: underline; /* Unterstreichung beim Hover hinzufügen */
}

.language-switcher ul {
  display: none; /* Verstecke die Liste standardmäßig */
  position: absolute;
  background: white;
  border: 1px solid #ccc;
  list-style: none;
  padding: 5px;
  z-index: 1000;
}

.language-switcher:hover ul {
  display: block; /* Zeige die Liste beim Hover/Klick */
}

.language-switcher select {
  display: none; /* Verstecke das Dropdown-Select, falls vorhanden */
}

.language-switcher img {
  cursor: pointer; /* Zeiger ändern, um Klickbarkeit zu zeigen */
}

.extra-menu {
  background-color: #333; /* Farbe des erweiterten Menüs */
  color: white;
  display: none;
  /* transition: max-height 0.3s ease-out; */
}

.extra-menu.show {
  display: block;
  max-height: 300px; /* Maximale Höhe beim Anzeigen des Menüs */
}

.navbar-toggler.collapsed + .extra-menu {
  display: none;
}

/* Menü unter dem Header, fixiert, aber nur auf die Höhe des Menüs beschränkt */
#navbarResponsive {
  position: fixed; /* Menü fixiert am oberen Rand */
  top: 64px; /* Abstände unterhalb des Headers, hier 56px (anpassen je nach Höhe deines Headers) */
  left: 0;
  width: 100%; /* Menü soll die ganze Breite einnehmen */
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.8);

  margin-top: -64px;

  /* background: rgba(15, 15, 15, 0); */
  display: none; /* Zu Beginn unsichtbar */
  z-index: 998; /* Menü wird über anderem Inhalt angezeigt */
  overflow-y: auto; /* Falls mehr Inhalt im Menü vorhanden ist */
  transition: opacity 0s ease-out, transform 0.1s ease-out;
  /* backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px); */
}

/* Wenn das Menü sichtbar ist, ändern wir display */
#navbarResponsive.show {
  display: block; /* Zeige das Menü, wenn es geöffnet wird */
}

/* Optional: Hintergrundschattierung für den restlichen Inhalt */
body.menu-open {
  overflow: hidden; /* Verhindert das Scrollen des Body-Inhalts */
}

/* Stil für die Links im Menü */
#navbarResponsive a {
  padding: 10px 15px; /* Füge Padding hinzu für bessere Benutzererfahrung */
}

.sub-collapse {
  position: fixed;
  top: 64px; /* Falls du den Header fixiert hast, um es unter der Navbar zu positionieren */
  left: 0;
  right: 0;
  z-index: 1050; /* Stellen Sie sicher, dass das Menü über dem Inhalt liegt */
  opacity: 0; /* opacity: 0; Menü ist transparent, wenn es nicht angezeigt wird */
  height: 0; /* Höhe auf 0 setzen */
  /* transition: all 0.5s ease;  Übergang für fließende Animation */
  /* background-color: black; */
}

/* Das Dropdown-Menü ein wenig abheben, wenn geöffnet */
.sub-collapse.show {
  display: block;
  /* background: rgba(255, 255, 255, 0.75); */
  opacity: 0.95; /* Menü ist transparent, wenn es nicht angezeigt wird */
  /* background-color: white; */
  height: auto; /* Höhe anpassen, damit das Menü den Inhalt zeigt */
  /* backdrop-filter: blur(10px); */
  /* -webkit-backdrop-filter: blur(10px); */
}

.sub-collapse-title {
  font-family: "Everett";
  margin: 14px 0 14px 14px !important;
  color: white !important; /* Standardfarbe */
  text-align: left !important;
}

.sub-collapse-single {
  margin: 0;
  padding: 0;
}

.sub-collapse-single a {
  color: white !important; /* Standardfarbe */
  text-decoration: none; /* Optional: Unterstreichen entfernen */
  transition: color 0.1s ease; /* Sanfte Übergangsanimation */

  padding: 0 !important;
}

.sub-collapse-single a:hover {
  color: var(--gold) !important;
}

.sub-collapse-item {
  text-align: left !important;
  padding: 6px 0 6px 50px !important;
  /* white-space: nowrap; */
  position: relative; /* Notwendig für das Pseudo-Element */
  /* backdrop-filter: blur(10px); */
  /* -webkit-backdrop-filter: blur(10px); */
  display: block;
}

.sub-collapse-item a {
  color: white !important; /* Standardfarbe */
  font-size: 18px;
  font-weight: 300 !important;
}

.sub-collapse-item:hover::before {
  content: "\f06c"; /* Unicode für fa-leaf */
  font-family: "FontAwesome";
  position: absolute;
  transform: scaleX(-1);
  color: var(--gold); /* Farbe des Punkts (z. B. Rot) */
  margin-left: -28px;
}

.sub-collapse-line {
  border-bottom: 1px solid #4b4b4b;
}

.navbar {
  display: flex;
  align-items: center; /* Elemente vertikal zentrieren */
  justify-content: space-between; /* Platz zwischen Logo und Buttons */
}

.navbar-icons {
  display: flex; /* Setzt die Icons nebeneinander */
  gap: 10px; /* Abstand zwischen den Icons 15px */
  align-items: center; /* Zentriert die Icons vertikal */
}

.navbar-icons .btn-icon {
  display: inline-flex; /* Stellt sicher, dass die Icons als Inline-Flex-Elemente behandelt werden */
  text-decoration: none; /* Entfernt Unterstreichung */
  color: var(--white); /* Farbe der Icons */
  font-size: 20px; /* Größe der Icons */
  transition: color 0.1s ease, transform 0.3s ease; /* Animation bei Hover */
}

.navbar-icons .btn-icon:hover {
  color: #007bff; /* Farbe bei Hover */
}

.awx-card {
  position: relative;
  overflow: hidden; /* Verhindert, dass der Kreis über die Kachel hinausgeht */
  cursor: pointer;
  z-index: 1; /* Kachel bleibt im Vordergrund */
}

.awx-hover-circle {
  position: absolute;
  width: 210px;
  height: 210px;
  border-radius: 50%;
  pointer-events: none;
  transform: scale(0);
}

.awx-hover-circle-txt {
  position: relative;
  z-index: 1; /* Text bleibt im Vordergrund */
  color: white; /* Standard-Schriftfarbe */
  transition: color 0.3s ease-out;
}

/* Schriftfarbe bei Hover */
.awx-card:hover .awx-hover-circle-txt {
  color: black !important; /* Setzt die Schriftfarbe beim Hover auf schwarz */
}

.awx-card *:hover .awx-hover-circle-txt {
  color: black !important; /* Setzt die Schriftfarbe beim Hover auf schwarz */
}

.awx-clr-auto {
  transition: color 0.3s ease; /* Weiche Übergänge der Textfarbe */
}

.awx-clr-light {
  color: white;
  transition: color 0.3s ease-in-out;
}

.awx-clr-dark {
  color: var(--awx-dark);
  transition: color 0.3s ease-in-out;
}

.awx-header-info {
  display: flex;
  align-items: center; /* Zentriert den Pfeil vertikal */
  justify-content: center; /* Zentriert den Pfeil horizontal */
  font-size: 18px;
  font-weight: 300;
  /* color: color-mix(in srgb, var(--background-color) 50%, white); */
}

.awx-btn-bmg {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50% !important; /* Rund machen */
  font-size: 18px;
  cursor: pointer;
  overflow: hidden;
}

.awx-btn-bmg:focus,
.awx-btn-bmg:active {
  outline: none;
  box-shadow: none;
}

.awx-btn-bmg {
  -webkit-tap-highlight-color: transparent;
  -webkit-appearance: none;
}

.awx-btn-bmg {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50% !important; /* Rund machen */
  font-size: 18px;
  cursor: pointer;
  overflow: hidden;
}

.awx-btn-bmg-sm {
  width: 40px;
  height: 40px;
}

.awx-btn-bmg-md {
  width: 50px;
  height: 50px;
}

.awx-btn-bmg-trsp-black {
  color: black;
  background-color: rgba(0, 0, 0, 0);
  border: 1px solid black !important;
}

.awx-btn-bmg-trsp-white {
  color: white;
  background-color: rgba(0, 0, 0, 0) !important;
  border: 1px solid white !important;
}

.awx-btn-bmg-trsp-white .awx-arrow {
  background-image: url("../images/svg/arrow-right-white.svg") !important;
}

.awx-btn-bmg-green {
  background-color: var(--gold);
  border: 1px solid var(--gold) !important;
}

.awx-btn-bmg-green .awx-arrow {
  background-image: url("../images/svg/arrow-right-black.svg") !important;
}

.awx-btn-bmg-red {
  color: white !important;
  background-color: #a04732 !important;
  border: 1px solid #a04732 !important;
}

.awx-btn-bmg-gold {
  color: white !important;
  background-color: var(--gold) !important;
  border: 1px solid var(--gold) !important;
}

.awx-btn-bmg-gold .awx-arrow {
  background-image: url("../images/svg/arrow-right-white.svg") !important;
}

.awx-btn-bmg-black {
  background-color: black;
  border: 1px solid black !important;
}

.awx-btn-bmg-black .awx-arrow {
  background-image: url("../images/svg/arrow-right-white.svg") !important;
}

.awx-btn-bmg-trsp-white-inverse {
  color: white;
  background-color: rgba(0, 0, 0, 0);
  border: 1px solid white !important;
}

.awx-btn-bmg-trsp-white-inverse .awx-arrow {
  background-image: url("../images/svg/arrow-right-white.svg") !important;
}

.awx-btn-bmg-trsp-white-inverse:hover {
  color: black;
  background-color: rgba(255, 255, 255, 1);
  border: 1px solid white !important;
}

.awx-btn-bmg-trsp-white-inverse:hover .awx-arrow {
  background-image: url("../images/svg/arrow-right-black.svg") !important;
}

.awx-arrow {
  display: inline-block;
  font-size: 24px;
  position: absolute;
  transition: transform 0.3s ease-out, opacity 0.3s ease-out;
  background-image: url("../images/svg/arrow-right.svg");
  background-repeat: no-repeat;
  margin-bottom: 3px;
  height: 8px;
  width: 50px;
  vertical-align: middle; /* Vertikale Ausrichtung */
  background-position: center;
}

header {
  transition: color 0.3s ease-in-out;
}

.awx-header-cta button,
.awx-header-cta .awx-btn-word {
  display: inline-block;
  vertical-align: middle; /* Vertikale Ausrichtung */
  margin-left: 5px; /* Abstand anpassen */
  color: color-contrast(var(--background-color) vs black, white);
}

.trustindex-widget {
  width: 200px;
  height: 200px !important;
}

.ti-rating-large {
  font-family: "Everett" !important;
}

.ti-rating-text {
  font-family: "Everett" !important;
}

.ti-name {
  font-family: "Everett" !important;
  font-weight: 500 !important;
  font-size: 18px !important;
}

.ti-date {
  font-family: "Everett" !important;
  font-weight: 300 !important;
}

.ti-review-content {
  font-family: "Everett" !important;
  font-weight: 300 !important;
  font-size: 16px !important;
}

.ti-inner {
  border-radius: 18px !important;
}

.ti-review-item {
  border-radius: 18px !important;
  margin: 0 10px !important;
}

.swiper-slide {
  width: 340px !important; /* Deine gewünschte Breite */
}

.awx-card {
  background-color: blue;
}

.awx-quote {
  font-family: "Everett" !important;
  font-style: italic !important;
  font-weight: 300 !important;
  font-size: 24px !important;
  display: inline !important;
  position: relative;
}

.awx-quote::before,
.awx-quote::after {
  font-family: "Everett", serif;
  font-size: 48px;
  font-weight: 700;
  color: var(--gold); /* Akzentfarbe */
  vertical-align: middle;
}

.awx-quote::before {
  content: "“"; /* öffnendes Anführungszeichen */
  margin-right: 8px;
}

.awx-quote::after {
  content: "”"; /* schließendes Anführungszeichen */
  margin-left: 8px;
}

.awx-quote-author {
  font-family: "Everett" !important;
  font-style: italic !important;
  font-weight: 300 !important;
  font-size: 24px !important;
  margin-top: 8px;
  margin-right: 48px;
  display: block;
  text-align: right;
  white-space: nowrap; /* verhindert Zeilenumbruch */
}

.awx-quote-author::before {
  content: "–"; /* Gedankenstrich + Leerzeichen */
  font-weight: 400;
  font-style: normal;
  color: #999; /* Optional: leicht abgeschwächte Farbe */
}

.no-scroll {
  overflow: hidden;
  height: 100vh;
}

.awx-info-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px; /* Abstand zwischen Preis und Button */
}

.awx-info-price {
  color: white;
  font-family: "Everett" !important;
  font-weight: 300 !important;
  font-size: 24px !important;
}

.awx-btn-info-green {
  color: var(--white) !important;
  font-family: "Everett" !important;
  font-size: 10px;
  outline: none;
  width: 20px !important;
  height: 20px !important;
  border-radius: 50%;
  background-color: transparent !important;
  border: 1px solid var(--white) !important;
  text-align: center;
  line-height: 4px;
  padding: 2px 0 0 0 !important;
  cursor: pointer;
  position: relative;
  top: -15px;
}

.awx-btn-info-green:focus,
.awx-btn-info-green:active {
  outline: none;
  box-shadow: none;
}

.awx-btn-info-green:hover {
  color: white !important;
  background-color: black; /* leicht dunkler */
}

.awx-info-box {
  position: absolute;
  font-family: "Everett";
  font-weight: 300;
  font-size: 14px;
  padding: 10px;
  /* top: 24px !important; */
  top: 50%;
  left: 50%; /* Mitte des Containers */
  transform: translateX(-50%); /* echte Zentrierung */
  width: 300px;
  padding: 10px;
  background-color: #f9f9f9;
  border: 0px solid black;
  border-radius: 18px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  font-family: "Everett";
  font-weight: 300;
  font-size: 14px;
  display: none;
  z-index: 1000;
}

.awx-btn-close {
  position: absolute;
  top: 5px;
  right: 5px;
  background: none;
  border: none !important;
  font-size: 24px !important; /* Kleinere Schriftgröße */
  color: black; /* Farbe des X */
  cursor: pointer;
  padding: 0;
  line-height: 1;
  border-style: none !important;
  border-width: 0px !important;
  border-radius: 18px !important;
  padding: 5px 10px !important;
}

.awx-btn-close:hover {
  color: red; /* Farbe bei Hover */
}

.awx-btn-close:active {
  outline: none; /* Verhindert, dass beim Drücken ein Rahmen erscheint */
}

.awx-carousel-title-sub {
  color: lightgray !important;
}

.awx-btn-bmg-label {
  padding-top: 8px;
  height: 50px;
}

.awx-btn-bmg-label-sm {
  padding-top: 4px;
  height: 40px;
}

.awx-sync-toggle-box .elementor-button-icon {
  transition: transform 0.3s ease;
  transform: rotate(-180deg); /* Startwert */
}

.awx-sync-toggle-box.awx-open .elementor-button-icon {
  transform: rotate(180deg); /* Zielwert bei offen */
}

.awx-sync-toggle-box-content {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height 0.4s ease, opacity 0.3s ease;
}

.awx-sync-toggle-box.awx-open .awx-sync-toggle-box-content {
  max-height: 1000px; /* größer als dein größter Inhalt */
  opacity: 1;
}

.awx-fa-info {
  color: var(--gray);
}

@media (min-width: 992px) {
  .nav-item {
    text-align: center !important;
    padding: 0;
    border-bottom: 0px;
  }

  .awx-mobile-only {
    display: none !important;
  }
}