#KSBuchung,
#div_mailanfrage {
  margin: 10px;
  position: relative;
  display: none;
}

.schriftart-klein {
  font-size: 12px;
  line-height: 160%;
  text-transform: italic;
}

.buchung-buchungsinfo {
  /*width: 100%;*/
  text-align: left;
  color: var(--primary);
  padding-bottom: 15px;
  font-size: 27px;
}
#div_buchungszusammenfassung {
  /*display: none;
  height: 0;
  width: 0;*/
  overflow: auto;
  display: block;
  padding-top: 2rem;
}

.buchung-link {
  text-decoration: none;
}
.buchung-link:hover {
  text-decoration: underline;
}
.uk-grid {
  margin-left: 0px;
}
.uk-grid > * {
  padding-left: 0px;
}
#buchschritte {
  font-size: 1.2em;
}
.buchung-schritt-reiter {
  position: relative;
  text-align: center;
  padding: 15px 2px;
  height: 110px;
  width: 136px;
  box-sizing: border-box;
  -moz-transition: background 0.5s;
  -webkit-transition: background 0.5s;
  -o-transition: background 0.5s;
  transition: background 0.5s;
  border-radius: var(--c-border-radius);
  background: var(--light);
  border: none;
  margin-right: var(--grid-gutter-width);
  box-sizing: border-box;
}

.buchung-schritt-reiter td {
  color: var(--body-text-color);
}
@media (max-width: 960px) {
  .buchung-schritt-reiter {
    width: 96px;
    margin-right: 2rem;
  }
  .buchung-schritt-reiter td {
    font-size: 15px;
  }
}
@media (max-width: 799px) {
  .buchung-schritt-reiter {
    width: 96px;
    margin-right: 1rem;
  }
}
@media (max-width: 599px) {
  .buchung-schritt-reiter {
    width: 100%;
    margin-bottom: 0.5rem;
    height: auto;
    padding: 0.5rem;
    margin-right: 0;
  }
}
/*@media (max-width: 499px) {
  .buchung-schritt-reiter {
    width: 100%;
    margin-bottom: 0.5rem;
  }
}*/
.buchung-schritt-reiter table {
  height: 100%;
  width: 100%;
}
.buchung-schritt-reiter td {
  text-align: center;
  vertical-align: middle;
  line-height: 1.2em;
}
#schritte-ausblenden {
  height: 20px;
  width: 20px;
  margin-bottom: 10px;
}
@media (min-width: 800px) {
  #schritte-ausblenden {
    display: none;
  }
}
.buchschritte-inaktiv {
  display: block;
}
@media (max-width: 799px) {
  .buchschritte-inaktiv {
    display: none;
  }
}

.bs_reiter_normal {
  cursor: pointer;
  background: var(--light);
}
.bs_reiter_normal td {
  color: var(--secondary);
}

.bs_reiter_normal:hover {
  background-color: white;
}
.bs_reiter_aktiv {
  cursor: default;
  background: var(--secondary);
  border-radius: var(--c-border-radius);
}

.bs_reiter_aktiv td {
  color: white;
}
.buchung-navigation-schritt {
  font-weight: normal;
  text-transform: uppercase;
}
.buchung-navigation-schritt-next {
  float: right;
  text-align: right;
  margin-right: 5px;
}
.buchung-navigation-schritt-back {
  float: left;
  text-align: left;
  margin-left: 5px;
}
.bs_nextstep,
.bs_backstep_aktiv {
  cursor: pointer;
  padding: 10px 20px;
}
.bs_nextstep_aktiv:hover,
.bs_backstep_aktiv:hover {
  /*text-decoration: underline;*/
}

.buchung-inhalt {
  margin: 0;
}

.buchung-buchrahmen {
  text-align: left;
  padding: 1rem 0;
}
#buch_mailausstieg {
  margin: 10px;
}
#div_mailanfrage .buchung-mailanfrage-ueberschrift {
  display: none;
}
.buchung-mailanfrage-sublabel {
  font-weight: bold;
  margin-bottom: 5px;
}
.buchung-mailanfrage-abschnitt-senden,
.buchung-abschnitt-senden {
  margin: 20px;
  text-align: center;
}
.buchung-mailanfrage-abschnitt-info {
  margin-top: -1em;
  margin-left: -5px;
  font-size: 1.2em;
}

.feld_aus {
  display: none;
}

.buchung-label {
  font-weight: 600;
}
.buchung-sublabel {
  font-weight: normal;
}

.buchung-sublabel input[type="checkbox"] {
  margin-top: 8px;
}

.buchung-select {
  font-size: 1em;
}
.buchung-button-info {
  font-size: var(--base-font-size);
  font-weight: normal;
  padding: 1px 5px;
  width: 30px;
  height: 30px;
  line-height: 30px;
}
.buchung-abschnitt {
  margin: 2rem 0;
}
.buchung-unterabschnitt {
  margin: 2rem 0;
}
.buchung-tabelle-rahmen {
  padding: 2rem 0;
}

.buchung-tabelle-rahmen,
.buchung-mailanfrage-abschnitt-info .buchung-tabelle-rahmen {
  background: var(--light);
  border-radius: var(--c-border-radius);
  padding: 2rem;
  margin-top: 2rem;
  margin-bottom: 1rem;
}

@media (max-width: 799px) {
  .buchung-tabelle-rahmen {
    padding: 1rem;
  }
}

.buchung-tabelle-rahmen .buchung-tabelle-rahmen {
  font-size: var(--base-font-size);
}

.buchung-tabelle-rahmen table {
  width: 100%;
}
.buchung-tabelle-rahmen th {
  text-align: left;
  line-height: 1.8em;
  vertical-align: middle;
  font-weight: 600;
  padding: 3px 0;
  font-size: 15px;
}
.buchung-tabelle-rahmen td {
  vertical-align: middle;
  padding: 3px 0;
  font-size: 15px;
}
.buchung-zeile-aktiv {
  cursor: pointer;
}

th.buchung-tabelle-spalte-radio {
  width: 40px;
}
td.buchung-tabelle-spalte-radio {
  text-align: center;
  padding: 15px;
}
th.buchung-tabelle-spalte-bezeichnung,
td.buchung-tabelle-spalte-bezeichnung {
  text-align: left;
  padding: 15px 15px;
}
th.buchung-tabelle-spalte-datum {
  width: 5.5em;
}
td.buchung-tabelle-spalte-datum,
td.buchung-tabelle-spalte-plz,
td.buchung-tabelle-spalte-zeit,
td.buchung-tabelle-spalte-anzahl,
td.buchung-tabelle-spalte-alter,
td.buchung-tabelle-spalte-frei,
td.buchung-tabelle-spalte-auswahl {
  text-align: left;
}
th.buchung-tabelle-spalte-preis {
  width: 5em;
}
td.buchung-tabelle-spalte-preis {
  text-align: right;
}
th.buchung-tabelle-spalte-info,
th.buchung-tabelle-spalte-frei,
th.buchung-tabelle-spalte-auswahl {
  width: 2em;
}
th.buchung-tabelle-spalte-alter,
th.buchung-tabelle-spalte-anzahl {
  width: 3.5em;
}
th.buchung-tabelle-spalte-info,
td.buchung-tabelle-spalte-info {
  width: 50px;
  text-align: center;
  padding: 0 15px;
}
.buchung-tabelle-spalte-auswahl {
  padding-left: 2px;
  padding-right: 2px;
}
td.buchung-tabelle-spalte-teilnehmernr {
  vertical-align: top;
  padding-top: 2px;
}
.buchung-tabelle-spalte-anzahl .text-eingabe {
  width: 2em;
}

.buchung-tabelle-spalte-anzahl .zahl-eingabe {
  width: 40px;
}

th.buchung-tabelle-spalte-anzahl,
td.buchung-tabelle-spalte-anzahl,
th.buchung-tabelle-spalte-preis,
td.buchung-tabelle-spalte-preis {
  text-align: right;
}

div.buchung-zusammenfassung-aufruf {
  text-align: right;
  margin: 10px 0;
}
span.buchung-zusammenfassung-aufruf {
  font-size: 0.9em;
  font-weight: bold;
  cursor: pointer;
}
span.buchung-zusammenfassung-aufruf:hover {
  text-decoration: underline;
}

.buchung-information-modal {
  padding: 5px 0;
}

.buchung-mailausstieg-button {
  float: right;
}
.buchung-mailausstieg-text {
  line-height: 2em;
}

@media screen and (max-width: 499px) {
  .tabelle-buchung-befoerderung .buchung-tabelle-spalte-datum,
  .tabelle-buchung-befoerderung .buchung-tabelle-spalte-frei,
  .tabelle-buchung-befoerderung .buchung-tabelle-spalte-preis,
  .tabelle-buchung-befoerderung .buchung-tabelle-spalte-info,
  #zus_alle .buchung-tabelle-spalte-bezeichnung,
  #zus_einzel .buchung-tabelle-spalte-bezeichnung {
    display: block;
  }
  .tabelle-buchung-befoerderung .buchung-tabelle-spalte-datum,
  .tabelle-buchung-befoerderung .buchung-tabelle-spalte-frei,
  .tabelle-buchung-befoerderung .buchung-tabelle-spalte-preis,
  .tabelle-buchung-befoerderung .buchung-tabelle-spalte-info,
  #zus_alle .buchung-tabelle-spalte-bezeichnung,
  #zus_einzel .buchung-tabelle-spalte-bezeichnung {
    width: 100%;
  }

  .tabelle-buchung-befoerderung .buchung-tabelle-spalte-datum,
  .tabelle-buchung-befoerderung .buchung-tabelle-spalte-frei,
  .tabelle-buchung-befoerderung .buchung-tabelle-spalte-preis,
  .tabelle-buchung-befoerderung .buchung-tabelle-spalte-info {
    text-align: center;
  }
}

@media screen and (max-width: 699px) {
  .tabelle-buchung-hotel .buchung-untertabelle-spalte-name,
  .tabelle-buchung-hotel .buchung-untertabelle-spalte-info,
  .buchung-untertabelle-tabelle-ausstattung,
  .buchung-untertabelle-tabelle-kategorie,
  .buchung-untertabelle-tabelle-verpflegung,
  .buchung-untertabelle-tabelle-belegung,
  .buchung-untertabelle-tabelle-preis,
  #zus_alle .buchung-tabelle-spalte-datum,
  #zus_alle .buchung-tabelle-spalte-zeit,
  #zus_alle .buchung-tabelle-spalte-preis,
  #zus_einzel .buchung-tabelle-spalte-datum,
  #zus_einzel .buchung-tabelle-spalte-zeit,
  #zus_einzel .buchung-tabelle-spalte-preis {
    display: block;
  }
  .tabelle-buchung-hotel .buchung-untertabelle-spalte-name,
  .tabelle-buchung-hotel .buchung-untertabelle-spalte-info,
  .buchung-untertabelle-tabelle-ausstattung,
  .buchung-untertabelle-tabelle-kategorie,
  .buchung-untertabelle-tabelle-verpflegung,
  .buchung-untertabelle-tabelle-belegung,
  .buchung-untertabelle-tabelle-preis,
  #zus_alle .buchung-tabelle-spalte-datum,
  #zus_alle .buchung-tabelle-spalte-zeit,
  #zus_alle .buchung-tabelle-spalte-preis,
  #zus_einzel .buchung-tabelle-spalte-datum,
  #zus_einzel .buchung-tabelle-spalte-zeit,
  #zus_einzel .buchung-tabelle-spalte-preis {
    width: 100%;
  }

  .tabelle-buchung-hotel .buchung-untertabelle-spalte-name,
  .tabelle-buchung-hotel .buchung-untertabelle-spalte-info,
  .buchung-untertabelle-tabelle-ausstattung,
  .buchung-untertabelle-tabelle-kategorie,
  .buchung-untertabelle-tabelle-verpflegung,
  .buchung-untertabelle-tabelle-belegung,
  .buchung-untertabelle-tabelle-preis {
    text-align: left;
  }
  .buchung-untertabelle-tabelle-ausstattung,
  .buchung-untertabelle-tabelle-kategorie,
  .buchung-untertabelle-tabelle-verpflegung,
  .buchung-untertabelle-tabelle-belegung,
  .buchung-untertabelle-tabelle-preis {
    text-align: center;
  }
  table.buchung-untertabelle-tabelle td {
    line-height: 1em;
  }
  table.buchung-untertabelle-tabelle
    .buchung-untertabelle-tabelle-belegung
    div {
    width: 100%;
    background-position: center;
    background-repeat: no-repeat;
  }
  td.buchung-untertabelle-tabelle-bezeichnung {
    font-weight: bold;
  }
}

@media screen and (max-width: 499px) {
  .tabelle-buchung-hotel .buchung-untertabelle-spalte-bild,
  .tabelle-buchung-hotel .buchung-untertabelle-spalte-name,
  .tabelle-buchung-hotel .buchung-untertabelle-spalte-info,
  .buchung-untertabelle-tabelle-bezeichnung {
    display: block;
  }
  .tabelle-buchung-hotel .buchung-untertabelle-spalte-bild,
  .tabelle-buchung-hotel .buchung-untertabelle-spalte-name,
  .tabelle-buchung-hotel .buchung-untertabelle-spalte-info,
  .buchung-untertabelle-tabelle-bezeichnung {
    width: 100%;
    text-align: center;
  }
}

.hotel-beschreibung-dokument {
  width: 100%;
  height: 600px;
}

table.buchung-untertabelle-tabelle td,
table.buchung-untertabelle-tabelle th {
  font-size: 1em;
}

.buchung-suchetext {
  font-size: 1.2em;
  font-size: inherit;
  line-height: 100%;
  margin: 0 0.5rem;
}
.buchung-zustieg-button {
  font-size: 1em;
}
.buchung-zustieg-rahmen {
  max-height: 15em;
  overflow-y: scroll;
}
.buchung-zustieg-sub-rahmen {
  max-height: 10em;
  overflow-y: scroll;
}
.buchung-zustieg-sub-rahmen td {
  font-size: 1em;
}
.buchung-sitzplan-auswahl {
  vertical-align: top !important;
  padding-top: 10px !important;
}
.buchung-sitzplan-button {
  font-size: 1em;
  line-height: 1.6em;
  margin: 10px auto 0 auto;
  text-align: center;
  width: 15em;
}
.buchung-sitzplan-kategorie {
  width: 15em;
  margin: 0 auto 10px auto;
}
.buchung-sitzplan-kategorie td {
  font-size: 1em;
}
.buchung-sitzplan-kategorie-auswahl {
  width: 15px;
  text-align: center;
}
.buchung-sitzplan-kategorie-farbe,
.buchung-sitzplan-kategorie-bezeichnung {
  width: 1.5em;
  text-align: center;
}
.buchung-sitzplan-kategorie-preis {
  width: 4em;
  text-align: right;
}
.buchung-sitzplan-kategorie-plaetze {
  padding-left: 5px;
}
#buchung-sitzplan-vmh .ui-button {
  width: 5em;
}
#buchung-sitzplan-lr .ui-button,
#buchung-sitzplan-fg .ui-button {
  width: 7.5em;
}
td.buchung-sitzplan-leistung {
  font-size: 1em;
}

.buchung-unterbringung-zeile {
  margin-bottom: 10px;
  /*padding: 1rem;*/
  border-radius: var(--c-border-radius);
}
.buchung-unterbringung-container-preis {
  padding: 5px;
}
.buchung-unterbringung-container-anzahl {
  width: 4em;
  float: right;
  padding: 5px;
}
.buchung-unterbringung-container-bezeichnung {
  margin-right: 5em;
}
.buchung-tabelle-spalte-container .buchung-unterbringung-container-bezeichnung {
  margin-right: 5em;
}
.buchung-unterbringung-container-termin {
  margin-top: 5px;
  float: left;
  width: 48%;
}
.buchung-unterbringung-container-verpflegung {
  width: 48%;
  float: right;
  margin-top: 5px;
}
.buchung-unterbringung-container-bezeichnung {
  padding: 5px;
}
.buchung-unterbringung-kontingent {
  width: 20px;
  float: left;
}
.buchung-unterbringung-anreise,
.buchung-unterbringung-abreise {
  width: 8em;
  float: left;
  height: 1.5em;
  margin-right: 10px;
}

.buchung-unterbringung-preis {
  font-size: 1.5em;
  font-weight: bold;
  line-height: 2.2em;
  text-align: right;
  width: 12em;
  float: right;
}
.buchung-unterbringung-preis span {
  padding: 0 2px 2px 2px;
}
.buchung-unterbringung-bezeichnung {
  font-weight: bold;
  padding: 1px 5px;
  text-align: center;
}
.buchung-unterbringung-label {
  width: 1.7em;
  float: left;
  text-align: center;
  min-width: 28px;
}
.buchung-symbol-verpflegung,
.buchung-symbol-ausstattung,
.buchung-symbol-kategorie {
  width: 1.7em;
  min-width: 28px;
}
.buchung-symbol-verpflegung {
  background: url(grfx/symbol_verpflegung.png) no-repeat center;
}
.buchung-symbol-ausstattung {
  background: url(grfx/symbol_ausstattung.png) no-repeat center;
}
.buchung-symbol-kategorie {
  background: url(grfx/symbol_kategorie.png) no-repeat center;
}
.buchung-unterbringung-bezeichnung,
.buchung-unterbringung-ausstattung,
.buchung-unterbringung-anreise,
.buchung-unterbringung-abreise,
.buchung-unterbringung-kontingent,
.buchung-unterbringung-kategorie,
.buchung-unterbringung-verpflegung {
  line-height: 1.5em;
}
.buchung-unterbringung-anzahl {
  text-align: center;
}
.buchung-unterbringung-ausstattung {
  margin-top: 10px;
}
.buchung-unterbringung-anzahl .text-eingabe {
  width: 2em;
}
.buchung-unterbringung-info {
  width: 1.5em;
  margin: 5px auto;
  padding: 0px 2px;
}
.buchung-unterbringung-kategorie {
  float: left;
  width: 45%;
}
.buchung-unterbringung-verpflegung {
  float: right;
  width: 48%;
}

@media screen and (max-width: 699px) {
  .buchung-unterbringung-kategorie,
  .buchung-unterbringung-verpflegung {
    float: none;
    width: 100%;
    margin-top: 5px;
  }
  .buchung-unterbringung-anreise,
  .buchung-unterbringung-abreise {
    float: none;
    margin-top: 5px;
  }
  #div_lei .buchung-tabelle-spalte-datum {
    display: block;
    width: 100%;
  }
}
@media screen and (max-width: 499px) {
  .buchung-unterbringung-container-termin,
  .buchung-unterbringung-container-verpflegung {
    float: none;
    width: 100%;
    margin-top: 5px;
  }
  #div_lei .buchung-tabelle-spalte-datum {
    display: none;
  }
  #div_lei .buchung-tabelle-spalte-frei,
  #div_lei .buchung-tabelle-spalte-alter,
  #div_lei .buchung-tabelle-spalte-preis {
    display: block;
    width: 100%;
  }
}

.buchung-tabelle-teilnehmer {
  padding: 6px;
  padding: 0;
  background: white;
}
.buchung-tabelle-teilnehmer .buchung-sublabel {
  margin-bottom: 10px;
}
.buchung-tabelle-teilnehmer .buchung-tabelle-zeile1,
.buchung-tabelle-teilnehmer .buchung-tabelle-zeile2 {
  padding: 2rem;
  background: var(--light);
  border-radius: var(--c-border-radius);
  margin-bottom: 2rem;
}
@media (max-width: 799px) {
  .buchung-tabelle-teilnehmer .buchung-tabelle-zeile1,
  .buchung-tabelle-teilnehmer .buchung-tabelle-zeile2 {
    padding: 1rem;
  }
}
.buchung-teilnehmer-spalte1 {
  width: 30%;
  width: 32%;
  float: left;
  margin-top: 5px;
}
.buchung-teilnehmer-spalte2 {
  width: 65%;
  margin-top: 5px;
}

.buchung-teilnehmer-spalte-indent {
  margin-left: 30%;
  margin-left: 32%;
}

.buchung-teilnehmer-spalte-geburtstag {
  margin-left: 30%;
  margin-left: 32%;
}
@media screen and (max-width: 499px) {
  .buchung-teilnehmer-spalte1,
  .buchung-teilnehmer-spalte2 {
    float: none;
    width: 100%;
  }
  .buchung-teilnehmer-spalte-geburtstag {
    margin-left: 0;
  }
}
.buchung-teilnehmer-geburtstag {
  width: 7em;
}
.buchung-teilnehmer-abschnitt textarea {
  height: 5em;
}
.buchung-teilnehmer-textfeld {
  height: 5.5em;
}
.buchung-teilnehmer-anzeige_l,
.buchung-teilnehmer-lblanzeige_l {
  display: none;
}
.buchung-teilnehmer-spalte-container {
  float: left;
}
.buchung-teilnehmer-spalte2-container {
  margin-left: 50%;
}
.buchung-teilnehmer-spalte-container,
.buchung-teilnehmer-spalte2-container {
  width: 100%;
}
.buchung-teilnehmer-unterabschnitt {
  margin-top: 15px;
}

.buchung-tabelle-zuordnung {
  overflow: auto;
}

@media screen and (max-width: 699px) {
  .buchung-teilnehmer-spalte-container,
  .buchung-teilnehmer-spalte2-container {
    float: none;
    width: 100%;
    margin: 0;
  }
}
@media screen and (max-width: 499px) {
  #div_ver .buchung-tabelle-spalte-teilnehmer,
  #div_ver .buchung-tabelle-spalte-tabelle {
    display: block;
    width: 100%;
  }
}

.buchung-anmeldung-spalte1 {
  width: 7em;
  float: left;
}
.buchung-anmeldung-spalte2 {
  width: 12em;
  float: left;
}
@media screen and (max-width: 699px) {
  .buchung-anmeldung-spalte-container {
    float: left;
  }
}

.buchung-zahlung-lblzahlungsdaten {
  float: left;
  width: 10em;
}
.buchung-zahlung-zahlungsdaten_ {
  display: none;
  margin-left: 50px;
}
.buchung-zahlung-zahlungsdaten_checked {
  margin-left: 50px;
}
.buchung-zahlung-zahlungsdaten-zeile {
  margin-top: 5px;
}
.buchung-zahlung-container {
  padding: 10px 0;
}
.buchung-zahlung-kartefirma,
.buchung-zahlung-kartenr,
.buchung-zeile-bank {
  width: 10em;
}
.buchung-zahlung-blz,
.buchung-zahlung-konto {
  width: 6em;
}
.buchung-zahlung-kartemonat {
  width: 1.5em;
}
.buchung-zahlung-kartejahr {
  width: 2.5em;
}

.buchung-untertabelle-uebersicht td {
  font-size: 1em;
}
td.buchung-uebersicht-spalte-beschreibung {
  width: 12em;
  vertical-align: top;
}
#BEF .buchung-uebersicht-spalte-wert,
#TN .buchung-uebersicht-spalte-wert,
#LEI .buchung-uebersicht-spalte-wert,
#UNT .buchung-uebersicht-spalte-wert,
#VER .buchung-uebersicht-spalte-wert,
#RAB .buchung-uebersicht-spalte-wert {
  padding: 0px;
}
.buchung-uebersicht-unterspalte-preis {
  text-align: right;
  width: 6em;
}
.buchung-uebersicht-unterspalte-nr,
.buchung-uebersicht-unterspalte-anzahl {
  width: 2em;
}
.buchung-uebersicht-unterspalte-trenner {
  width: 1em;
}
#GPR td {
  font-weight: bold;
}
#GPR .buchung-uebersicht-spalte-wert {
  text-align: right;
}
td.buchung-untertabelle-spalte-name {
  font-size: 1.2em;
}
.buchung-untertabelle-spalte-ort,
.buchung-untertabelle-spalte-info {
  font-size: 1em !important;
}
.buchung-untertabelle-spalte-bild {
  width: 250px;
}
.buchung-untertabelle-spalte-info {
  font-size: 1.4em !important;
  width: 5em;
}

@media screen and (max-width: 499px) {
  .buchung-uebersicht-spalte-wert,
  .buchung-uebersicht-spalte-beschreibung {
    display: block;
    width: 100%;
  }
  .buchung-uebersicht-spalte-beschreibung {
    font-weight: bold;
  }
}
.buchung-hotel-rahmen {
  max-height: 30em;
  overflow-y: scroll;
}
.buchung-hotel-beschreibung {
  display: block;
  text-decoration: none;
}
.hotel-beschreibung-info {
  display: none;
}
.ui-dialog .hotel-beschreibung-info {
  padding: 0 !important;
}

.buchung-crm-auswahl-container {
  float: left;
  margin-right: 20px;
}
.buchung-crm-rahmen {
  padding-top: 10px;
  padding-bottom: 10px;
}
.buchung-crm-auswahl {
  width: 15em;
}

div#KSBuchungInit {
  width: 100%;
  height: 300px;
  text-align: center;
  background: url(grfx/ks_warten.gif) no-repeat;
  background-position: center center;
  padding-top: 100px;
}

/* ************* */
/* BuchungFehler */
/* ************* */

div#div_fehler_rahmen {
  clear: both;
  width: 75%;
  margin: 10px auto;
  border: 1px solid #ff0000;
  background-color: #ffdddd;
  display: none;
}
div#div_fehler {
  padding: 5px 5px 5px 50px;
  background: url(grfx/sym_fehler.gif) no-repeat left;
  color: #ff0000;
  font-weight: bold;
}

/* ************* */
/* BuchungHinweis */
/* ************* */

div#div_hinweis_rahmen {
  clear: both;
  width: 75%;
  margin: 10px auto;
  border: 1px solid #009900;
  background-color: #b3ffb3;
  display: none;
}
div#div_hinweis {
  padding: 5px 5px 5px 5px;
  color: #009900;
  font-weight: bold;
}

.crm_display_l,
.crm_lbldisplay_l {
  display: none;
}

#div_pwrenew {
  display: none;
  width: 500px;
  height: 300px;
  overflow: auto;
  border: 1px solid #000;
  padding: 20px;
  background-color: #fff;
}
#div_pwrenew input {
  width: 200px;
}
.buchung-anmeldung {
  margin: 2rem 0;
}
.buchung-anmeldung-eingabe {
  margin-left: 10px;
  margin-right: 20px;
}
#ks-warten .ui-dialog-titlebar {
  display: none;
}
.ui-dialog {
  background-color: #ffffff;
}
#ks-warten {
  background: url(grfx/ks_warten.gif) no-repeat center;
  text-align: center;
}
#buchungsinhalte #ks-warten {
  display: none;
}
#KSAnfrage #ks-warten {
  display: none;
}

.buchung_teilnehmer_anmelder_unsichtbar {
  display: none;
}
.buchung_teilnehmer_anmelder_sichtbar {
  display: block;
}

.buchung-mailanfrage-abschnitt-info #buchung-teilnehmer-anmelder1 {
  display: block;
}

/*Sitzplan Direktauswahl */
.buchung-tabelle-sitzplan-rahmen {
  border: 1px solid #000;
  padding: 5px;
  padding-right: -5px;
  margin-right: 10px;
}
.buchung-tabelle-sitzplan-rahmen-flug {
  border: 0px solid #000;
  padding: 5px;
  padding-right: -5px;
  margin-right: 10px;
}

table.buchung-tabelle-sitzplan {
  width: 110px;
}
.buchung-tabelle-sitzplan td {
  padding: 0px;
}
#sitz_tabelle_plan td {
  vertical-align: top;
}
table.buchung-sitzplan-legende {
  font-size: 1.2em;
  margin-top: 20px;
}
.sitzplan-sitz-rahmen {
  width: 23px;
}
.sitz-sitz {
  width: 20px;
  height: 20px;
}
.sitz-frei {
  background: url(grfx/sitz_frei.png) no-repeat;
}
.sitz-richtung2 .sitz-frei {
  background: url(grfx/sitz2_frei.png) no-repeat;
}
.sitz-richtung3 .sitz-frei {
  background: url(grfx/sitz3_frei.png) no-repeat;
}
.sitz-richtung4 .sitz-frei {
  background: url(grfx/sitz4_frei.png) no-repeat;
}
.sitz-frei-transparent {
  background: url(grfx/sitz_frei_transparent.png) no-repeat;
}
.sitz-richtung2 .sitz-frei-transparent {
  background: url(grfx/sitz2_frei_transparent.png) no-repeat;
}
.sitz-richtung3 .sitz-frei-transparent {
  background: url(grfx/sitz3_frei_transparent.png) no-repeat;
}
.sitz-richtung4 .sitz-frei-transparent {
  background: url(grfx/sitz4_frei_transparent.png) no-repeat;
}

.sitz-auswahl {
  background: url(grfx/sitz_auswahl.png) no-repeat;
}
.sitz-richtung2 .sitz-auswahl {
  background: url(grfx/sitz2_auswahl.png) no-repeat;
}
.sitz-richtung3 .sitz-auswahl {
  background: url(grfx/sitz3_auswahl.png) no-repeat;
}
.sitz-richtung4 .sitz-auswahl {
  background: url(grfx/sitz4_auswahl.png) no-repeat;
}

.sitz-belegt {
  background: url(grfx/sitz_belegt.png) no-repeat;
}
.sitz-richtung2 .sitz-belegt {
  background: url(grfx/sitz2_belegt.png) no-repeat;
}
.sitz-richtung3 .sitz-belegt {
  background: url(grfx/sitz3_belegt.png) no-repeat;
}
.sitz-richtung4 .sitz-belegt {
  background: url(grfx/sitz4_belegt.png) no-repeat;
}

.sitz-gesperrt {
  background: url(grfx/sitz_gesperrt.png) no-repeat;
}
.sitz-richtung2 .sitz-gesperrt {
  background: url(grfx/sitz2_gesperrt.png) no-repeat;
}
.sitz-richtung3 .sitz-gesperrt {
  background: url(grfx/sitz3_gesperrt.png) no-repeat;
}
.sitz-richtung4 .sitz-gesperrt {
  background: url(grfx/sitz4_gesperrt.png) no-repeat;
}

.sitz-nichtbuchbar {
  background: url(grfx/sitz_nichtbuchbar.png) no-repeat;
}
.sitz-richtung2 .sitz-nichtbuchbar {
  background: url(grfx/sitz2_nichtbuchbar.png) no-repeat;
}
.sitz-richtung3 .sitz-nichtbuchbar {
  background: url(grfx/sitz3_nichtbuchbar.png) no-repeat;
}
.sitz-richtung4 .sitz-nichtbuchbar {
  background: url(grfx/sitz4_nichtbuchbar.png) no-repeat;
}

.sitz-fahrer {
  background: url(grfx/sitz_fahrer.png) no-repeat;
}
.sitz-kueche {
  background: url(grfx/sitz_kueche.png) no-repeat;
}
.sitz-reiseleiter {
  background: url(grfx/sitz_reiseleiter.png) no-repeat;
}
.sitz-tisch {
  background: url(grfx/sitz_tisch.png) no-repeat;
}
.sitz-wc {
  background: url(grfx/sitz_wc.png) no-repeat;
}
.sitz-fluegelrechtserster {
  background: url(grfx/sitz_fluegelrechtserster.png) no-repeat;
  width: 65px !important;
}
.sitz-fluegelrechts {
  background: url(grfx/sitz_fluegelrechts.png) no-repeat;
  width: 65px !important;
}
.sitz-fluegelrechtsletzter {
  background: url(grfx/sitz_fluegelrechtsletzter.png) no-repeat;
  width: 65px !important;
}
.sitz-fluegellinkserster {
  background: url(grfx/sitz_fluegellinkserster.png) no-repeat;
  width: 65px !important;
}
.sitz-fluegellinks {
  background: url(grfx/sitz_fluegellinks.png) no-repeat;
  width: 65px !important;
}
.sitz-fluegellinksletzter {
  background: url(grfx/sitz_fluegellinksletzter.png) no-repeat;
  width: 65px !important;
}
.sitz-erklaerung {
  padding-top: 10px;
  font-weight: bold;
}

div.buchung-tabelle-spalte-belegung {
  background: url(grfx/symbol_ausstattung.png);
  width: 24px;
}
td.buchung-tabelle-spalte-belegung {
  text-align: center;
}

.buchung-flug-tabelle {
  margin-top: 5px;
  padding: 5px 0;
  background: transparent;
}
.buchung-flug-tabelle th,
.buchung-flug-tabelle td {
  font-size: 0.7em;
  padding: 5px 0;
}

.buchung-zahlung-iban {
  width: 15em;
}

.buchung-kategorie-kabine {
  height: 3em;
}

td hr {
  margin: 0;
}

#bs_form_4 .buchung-unterabschnitt {
  background: white;
  border-radius: var(--c-border-radius);
}

@media screen and (max-width: 499px) {
  .buchung-uebersicht-spalte-wert,
  .buchung-uebersicht-spalte-beschreibung {
    display: block;
    width: 100%;
  }
  .buchung-uebersicht-spalte-beschreibung {
    font-weight: bold;
  }
  /* Tabellenheader ausschalten */
  .buchung-tabelle-header {
    display: none;
  }
  .buchung-tabelle-rahmen td {
    padding: 5px;
  }
  .buchung-unterbringung-zeile .buchung-tabelle-rahmen td {
    float: left;
  }
  .buchung-unterbringung-zeile .buchung-tabelle-rahmen td:last-child {
    content: "Anzahl";
  }
  /* MObil TExt bei Buchungsschritte raus */
  #buchschritte.schritteAufteilung {
    height: auto;
  }
  /*.buchung-schritt-reiter table {
    display: none;
  }
  /* Zustieg Tabelle für MObil */
}

.buchung-tabelle-uebersicht {
  font-size: 14px;
}
#div_ueb .buchung-tabelle-rahmen > table > tbody > tr > td {
  vertical-align: top;
  border-bottom: 1px solid var(--body-text-color);
}
@media (max-width: 499px) {
  #div_ueb .buchung-tabelle-rahmen > table > tbody > tr > td:nth-child(2) {
    border-bottom: none;
  }
  #div_ueb .buchung-tabelle-rahmen > table > tbody > tr > td:first-child {
    width: 100%;
  }
}

#div_buchungszusammenfassung
  .buchung-tabelle-rahmen
  > table
  > tbody
  > tr
  > td:first-child,
#div_ueb .buchung-tabelle-rahmen > table > tbody > tr > td:first-child {
  font-weight: bold;
  border-bottom: 1px solid var(--body-text-color);
  vertical-align: top;
  /*max-width: 100px;*/
}

#div_buchungszusammenfassung .buchung-tabelle-rahmen > table > tbody > tr > td {
  display: block;
  width: 100%;
}
.buchung-teilnehmer-abschnitt {
  margin-bottom: 1rem;
  margin-bottom: 0;
}

.buchung-teilnehmer-abschnitt div {
  box-sizing: border-box;
}

.buchung-teilnehmer-abschnitt .buchung-teilnehmer-spalte1 {
  padding-top: 6px;
  padding-right: 2rem;
}

#legende ul li {
  margin-top: 2rem;
  display: inline-block;
  font-size: 15px;
}
[class^="ti-"] {
  font-weight: bold;
}

/* grid layout */

/* Benutzerdefiniertes CSS für das Grid-Layout */
.flex-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 30px; /* Definiert den Abstand zwischen den Spalten */
}

.flex-column {
  box-sizing: border-box; /* Berücksichtigen Sie das Padding und den Rand in der Berechnung der Breite */
}

.flex-column-left {
  flex-basis: calc(
    66% - 30px
  ); /* Berechnen Sie die Breite der Spalten und berücksichtigen Sie dabei die Abstände */
}
.flex-column-right {
  flex-basis: calc(
    34% - 30px
  ); /* Berechnen Sie die Breite der Spalten und berücksichtigen Sie dabei die Abstände */
}

@media (max-width: 960px) {
  .flex-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
  }
  .flex-column-left {
    flex-basis: 100%; /* Berechnen Sie die Breite der Spalten und berücksichtigen Sie dabei die Abstände */
  }
  .flex-column-right {
    flex-basis: 100%; /* Berechnen Sie die Breite der Spalten und berücksichtigen Sie dabei die Abstände */
  }
}

#buchschritt_3_reiter {
  display: none;
}

td.alle-flugzeiten {
  text-align: center;
}

.toggle-flugzeiten {
  cursor: pointer;
}

#bs_form_6 .buchung-unterabschnitt .teilnehmer1 {
  display: none;
}

.buchung-schritt-reiter:before {
  height: 30px;
  width: 30px;
  position: absolute;
  border-radius: var(--c-border-radius);
  background: white;
  top: -15px;
  left: 50%; /* Setzt den linken Rand des Kreises auf die Mitte des Elternelements */
  transform: translateX(-50%); /* Zentriert den Kreis horizontal */
}

#buchschritt_2_reiter:before {
  content: "1";
}
#buchschritt_4_reiter:before {
  content: "2";
}
#buchschritt_5_reiter:before {
  content: "3";
}
#buchschritt_6_reiter:before {
  content: "3";
}
#buchschritt_7_reiter:before {
  content: "4";
}
#buchschritt_8_reiter:before {
  content: "5";
}

.toggleLogin {
  cursor: pointer;
  position: relative;
  display: block;
  padding-right: 20px; /* Platz für den Pfeil */
  border-bottom: 1px solid var(--body-text-color);
  padding-bottom: 5px;
}

/* Pfeil-Stil im Normalzustand (nach unten zeigend) */
.toggleLogin::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%) rotate(45deg); /* Pfeil nach unten */
  border: solid black;
  border-width: 0 2px 2px 0;
  padding: 5px;
  transition: transform 0.3s;
}

/* Pfeil im aufgeklappten Zustand (nach oben zeigend) */
.toggleLogin.active::after {
  transform: translateY(-50%) rotate(-135deg); /* Pfeil nach oben */
}

#cmw-hinweise {
  height: 10em;
}

.bft-badge {
  display: inline-block;
  border-radius: 5px;
  font-weight: bold;
  text-transform: uppercase;
  padding: 0 10px;
  margin-right: 5px;
  background-color: var(--secondary);
  color: white;
}