#sb-timeline #steps #steps-content #sb_booking_content .datetime-step #sb_dateview_container .top-date-select .calendar .weeks-date .day-on {
   color: #f3cf1f;
   font-weight:  1000;
}




/*
	Custom CSS
	Please make sure your CSS rules are 
	more particular / have higher priority
	then other page styles
*/
 #events h3   {
	/* add your css rule here */
}


 #events p.duration, #events div.duration   {
	/* add your css rule here */
}


 #events p.description, #events div.description   {
	/* add your css rule here */
}


 #events .selectedEvent   {
	/* add your css rule here */
}


 #events input.reserve_time_btn   {
	/* add your css rule here */
}


 #events input.select_another_btn   {
	/* add your css rule here */
}


 #eventForm #start_date-block-container h3, #eventForm #timeline-container h3   {
	/* add your css rule here */
}


 #eventForm #save_button   {
	/* add your css rule here */
}


 div.ui-widget-content   {
	/* add your css rule here */
}


 div.ui-widget-header   {
	/* add your css rule here */
}


 #timeline-container table.timeline   {
	/* add your css rule here */
}


 .timeline td.not_worked_time   {
	/* add your css rule here */
}


 .timeline td.free_time   {
	/* add your css rule here */
}


 .timeline td.selected_time   {
	/* add your css rule here */
}


 .timeline td.reserved_time   {
	/* add your css rule here */
}


 div#loading   {
	/* add your css rule here */
}


 #start_date-block-container .zend_form dt, start_date-block-container .zend_form dt b, start_date-block-container .zend_form dd label   {
	/* add your css rule here */
}
/* === START: Button Mein-Segelurlaub ====================== */
.start-btn-wrapper{
  text-align:center;
  margin:2rem 0;
}

.msu-btn{
  display:inline-block;
  padding:12px 28px;
  background:#f3cf1f;        /* Marken-Gelb */
  color:#00365c;             /* Kontrast-Blau */
  font-size:1.1rem;
  font-weight:700;
  border:none;
  border-radius:8px;
  text-decoration:none;
  transition:background .2s, transform .2s;
}
.msu-btn:hover{
  background:#ffd73a;
  transform:translateY(-2px);
  box-shadow:0 4px 8px rgba(0,0,0,.25);
}
/* === ENDE Button Mein-Segelurlaub ======================== */
/* === START: Ticker-Button in Orange ===================== */
.msu-btn.msu-ticker{
  background:#ff7e00;          /* aufmerksamkeitsstarkes Orange */
  color:#ffffff;               /* Weiß für optimale Lesbarkeit */
  overflow:hidden;             /* schneidet den Track sauber ab */
  position:relative;
}

.msu-btn.msu-ticker .ticker-track{
  display:inline-block;
  white-space:nowrap;
  padding-left:100%;           /* startet rechts außerhalb des Buttons */
  animation:scroll-track 8s linear infinite;
}

/* Animation: komplette Breite nach links schieben */
@keyframes scroll-track{
  0%   { transform:translateX(0); }
  100% { transform:translateX(-100%); }
}

/* Hover-State – heller & angehalten */
.msu-btn.msu-ticker:hover{
  background:#ffa233;
}
.msu-btn.msu-ticker:hover .ticker-track{
  animation-play-state:paused; /* Text stoppt beim Darüberfahren */
}

/* Barrierefreiheit: Bewegungen für Motion-Sparer deaktivieren */
@media (prefers-reduced-motion:reduce){
  .msu-btn.msu-ticker .ticker-track{
    animation:none;
    padding-left:0;
  }
}
/* === ENDE Ticker-Button ================================= */
/* === START: CTA-Duo (nebeneinander, zentriert) ========= */
.msu-cta-duo{
  display:flex !important;          /* erzwingt Flex-Layout  */
  flex-wrap:wrap;                   /* darf auf sehr schmalen Screens umbrechen */
  justify-content:center;
  align-items:center;
  gap:1rem;                         /* Abstand zwischen Button – "oder" – Button */
  margin:2.5rem 0;
}

/* falls der Editor <p> um die Links legt, hier neutralisieren */
.msu-cta-duo p{
  display:inline-flex !important;
  margin:0 !important;
}

/* Buttons */
.msu-cta-btn{
  /* zentriert – horizontal & vertikal */
  display:inline-flex !important;
  align-items:center;
  justify-content:center;

  background:#f3cf1f;
  color:#00365c;
  font-size:1.05rem;
  font-weight:700;
  padding:14px 28px;
  border:none;
  border-radius:8px;
  text-align:center;
  text-decoration:none;
  cursor:pointer;

  transition:background .2s, transform .2s, box-shadow .2s;
}
.msu-cta-btn:hover{
  background:#ffd73a;
  transform:translateY(-2px);
  box-shadow:0 4px 8px rgba(0,0,0,.25);
}

/* "oder"-Trenner */
.msu-cta-or{
  font-weight:600;
  color:#00365c;
  white-space:nowrap;               /* verhindert Zeilenumbruch */
}

/* MOBIL: unter 600 px stapeln, "oder" ausblenden */
@media(max-width:600px){
  .msu-cta-duo{
    flex-direction:column;
    gap:0.5rem;
  }
  .msu-cta-or{
    display:none;
  }
}
/* === ENDE CTA-Duo ====================================== */
/* === Tabellen ohne sichtbare Ränder ===================== */
table,                           /* komplette Tabelle      */
table th, table td,              /* Tabellen-Header & Zellen */
.table-bordered,                 /* Bootstrap-Klasse       */
.table-bordered th,
.table-bordered td{
  border:none !important;        /* Ränder ausblenden      */
}

table{
  border-collapse:collapse;      /* verhindert Doppelränder */
}
/* ======================================================== */
/* Basisstil für einen gelben Marken-Button */
.msu-btn{
  display:inline-block;
  padding:14px 32px;
  background:#f3cf1f;  /* Marken-Gelb */
  color:#00365c;       /* Kontrast-Blau */
  font-size:1.05rem;
  font-weight:700;
  border:none;
  border-radius:8px;
  text-align:center;
  text-decoration:none;
  transition:background .2s, transform .2s, box-shadow .2s;
}
.msu-btn:hover{
  background:#ffd73a;
  transform:translateY(-2px);
  box-shadow:0 4px 8px rgba(0,0,0,.25);
}

/* Wrapper, um den Button mittig darzustellen */
.start-btn-wrapper{
  text-align:center;
  margin:2rem 0;
}

<style>
/* =====================================================
   TÖRNÜBERSICHT – FINALER GRID-BLOCK
   - SimplyBook-robust
   - feste Spalten / Tabstops
   - einklappbare Details
   - SEO- & GEO-tauglich
===================================================== */

/* -----------------------------------------------------
   DETAILS / SUMMARY – NICHT zerstören lassen
----------------------------------------------------- */
details summary {
  display: block;
  cursor: pointer;
  list-style: none;
}

details summary::-webkit-details-marker {
  display: none;
}

/* -----------------------------------------------------
   GRID-GRUNDSTRUKTUR (EINE WAHRHEIT)
----------------------------------------------------- */
.toern-grid {
  display: grid !important; /* wichtig gegen SimplyBook */
  grid-template-columns:
    28px     /* Pfeil */
    250px    /* Von–Bis */
    90px     /* Dauer */
    400px    /* Törn */
    200px    /* Start / Ziel */
    160px;   /* Status / Plätze */

  column-gap: 10px;
  align-items: center;
  font-family: Verdana, sans-serif;
  font-size: 13px;
}

/* -----------------------------------------------------
   GRID-ITEMS
----------------------------------------------------- */
.toern-grid > span {
  box-sizing: border-box;
  padding-right: 10px;
  border-right: 1px solid #999;
  display: block;
}

.toern-grid > span:last-child {
  border-right: none;
  padding-right: 0;
}

/* Datum darf nie umbrechen */
.col-date {
  white-space: nowrap;
}

/* -----------------------------------------------------
   HEADER
----------------------------------------------------- */
.toern-header {
  font-weight: 700;
  font-size: 13px;
  margin-bottom: 6px;
  border-bottom: 1px solid #ccc;
  padding-bottom: 6px;
}

/* -----------------------------------------------------
   MONAT (unterhalb der Spaltenüberschrift)
----------------------------------------------------- */
.toern-month {
  margin: 12px 0 6px 28px; /* Einrücken wegen Pfeil-Spalte */
  font-weight: 700;
  font-family: Verdana, sans-serif;
}

/* -----------------------------------------------------
   HOVER-HINWEIS (aufklappbar)
----------------------------------------------------- */
details summary:hover {
  font-weight: 600;
}

/* -----------------------------------------------------
   PFEIL
----------------------------------------------------- */
.arrow {
  width: 28px;
  display: inline-block;
  transition: transform 0.2s ease;
}

details[open] .arrow {
  transform: rotate(90deg);
}

/* -----------------------------------------------------
   DETAILBEREICH (SEO / GEO)
----------------------------------------------------- */
.toern-detailbox {
  margin: 8px 0 12px 38px; /* unter Grid eingerückt */
  font-size: 13px;
  line-height: 1.6;
  font-family: Verdana, sans-serif;
}

/* -----------------------------------------------------
   CTA – BUCHUNG
----------------------------------------------------- */
.toern-cta {
  display: inline-block;
  margin-top: 6px;
  padding: 6px 12px;
  background-color: #f3cf1f;
  color: #000;
  text-decoration: none;
  font-weight: 700;
}
</style>