/*
	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 */
}



/* Drogerie: Werbe-Opt-in im Buchungsformular ausblenden */
.promotions-letter-flag { display: none !important; }

/* Drogerie: gewählte Dienstleistung/Fachperson/Zeit unter den Schritten gross, dunkel, mit Häkchen */
.booking-info .step_info_item .title-sub { font-size: 17px !important; font-weight: 700 !important; color: #2B2B2B !important; line-height: 1.3 !important; height: auto !important; white-space: normal !important; overflow: visible !important; margin-top: 22px !important; top: 100% !important; bottom: auto !important; text-align: center !important; left: 0 !important; right: 0 !important; width: auto !important; padding: 0 4px !important; }
#steps-nav { margin-bottom: 16px; }
.booking-info .step_info_item.passed .title-sub::before { content: "\2713\00a0"; color: #347A81; font-weight: 700; }
.booking-info .step_info_item > a { height: auto !important; overflow: visible !important; }

/* Drogerie: Hinweis «Unsere Zeit» ausblenden (Platz bleibt, damit «Zurück» nicht verrutscht) */
#sb_booking_company_time { visibility: hidden !important; }

/* Drogerie: Einwilligungstexte im Formular grösser */
#sb_terms_and_conditions label, #sb_terms_and_conditions label a { font-size: 14px !important; line-height: 1.45 !important; }

/* Drogerie: Startseite ohne leeren Raum über und unter dem Begrüssungstext */
#main #main-buttons { min-height: 0 !important; height: auto !important; padding: 100px 0 60px !important; }

/* Drogerie: Startseite – Kontaktblock (Adresse, Öffnungszeiten, Karte) ausblenden, Text oben, Hintergrund bis zur Fusszeile */
#about_us_section { display: none !important; }
body:has(#about_us_section) #main #main-buttons { min-height: calc(100vh - 90px) !important; align-items: flex-start !important; }
body:has(#about_us_section) #main #main-buttons > .container-fluid { margin-top: 0 !important; margin-bottom: auto !important; }

/* Drogerie: auf allen Seiten ausser der Startseite (Buchung, Meine Buchungen) nur schmaler Kopf mit Namen */
body:not(:has(#about_us_section)) #main #main-buttons { min-height: 0 !important; height: auto !important; padding: 80px 0 10px !important; }
body:not(:has(#about_us_section)) #main #main-buttons #about-us h3,
body:not(:has(#about_us_section)) #main #main-buttons #about-us p,
body:not(:has(#about_us_section)) #main #main-buttons .bar { display: none !important; }

/* Drogerie: Startzeiten-Knöpfe kräftiger und grösser */
#main a.sb-cell.free { background-color: #347A81 !important; color: #ffffff !important; font-size: 16px !important; font-weight: 600 !important; border-radius: 6px !important; padding: 16px 0 !important; }
#main a.sb-cell.free:hover { background-color: #285F64 !important; color: #ffffff !important; }
#main .available .circle { background-color: #347A81 !important; }

/* Drogerie: Tablet – Auswahl unter den Schritten etwas kleiner und mit Abstand zum Kalender */
@media (max-width: 1199px) { .booking-info .step_info_item .title-sub { font-size: 15px !important; margin-top: 16px !important; } #steps-nav { margin-bottom: 44px !important; } }

/* Drogerie: Handy/Tablet – «Zurück» nicht unter der fixen Kopfzeile verstecken */
@media (max-width: 991px) { body:not(:has(#about_us_section)) #sb_content { padding-top: 40px !important; } }

/* Drogerie: Handy – «Meine Buchungen»: Reiter und Hinweis nicht abgeschnitten */
@media (max-width: 575px) { #booking-result-tabs .tab-link a { font-size: 15px !important; padding: 0 10px 10px !important; } #main .alert-dismissible { margin-left: 0 !important; margin-right: 0 !important; } }

/* Drogerie: Telefonnummer auf der Startseite als antippbarer Link in Drogerie-Farbe */
#about-us a[href^="tel:"] { color: #347A81 !important; font-weight: 600 !important; text-decoration: underline !important; white-space: nowrap !important; }

/* Drogerie: Karten der Dienstleistungen – mehr Beschreibung sichtbar (Datum, Kosten und Beginn der Beschreibung) */
#steps-content .txt.short { height: 115px !important; }