/*
	Custom CSS
	Please make sure your CSS rules are 
	more particular / have higher priority
	then other page styles
*/


#sb-timeline #steps #steps-content #sb_booking_content #sb_category_step_container .item:nth-child(n+2) {
      display:none;
   }


#sb-timeline #steps #steps-content #sb_booking_content .item .preloader .service-bar { display:none; }

.promotions-letter-flag { display:none; }

#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 */
}

#main #main-buttons {
min-height: 300px
}

.form-group__static-html {
 padding-top: 12px !important;
}

.form-group__static-html > .col-sm-12 > p::first-letter {
text-transform: uppercase;
}

#main-buttons .wrapper { height: 360px }
#sb-timeline #steps #steps-content #sb_booking_content .item .tab {border-radius: 8px !important;}
#membership-view #sb_membership_list_container>div .membership-item .preloader .user img, .preloader img {
    border-radius: 8px 8px 0 0;
}
#sb-timeline #steps #steps-content #sb_booking_content #details .detail-step .left-side #sb_client_info_container label { padding: 10px 0 0px 15px;}

#sb-timeline #steps #steps-content #sb_booking_content #details .detail-step .left-side .form-group { margin-bottom: 12px }

#sb-timeline #steps #steps-content #sb_booking_content #details .detail-step .left-side #sb_client_info_container label {
 width: 130px !important;
}

.custom-form label.control-label { 
padding: 0px 0 10px;

}

.custom-form label.control-label::first-letter {
  text-transform: uppercase;
}

.section-pd {
    padding: 8px !important;
}

#sb_additional_fields_container  .form-group {
display: flex;
	align-content: stretch; 

}

#sb_additional_fields_container  .form-group input  { 
 max-width: 350px !important;
}

#sb_additional_fields_container  .form-group .control-label  { 
 max-width: 130px !important;

}

@media only screen and (max-width: 766px) {
#sb_additional_fields_container  .form-group {
display: flex;
flex-direction: column;
	align-content: stretch; 

}

#sb_additional_fields_container  .form-group input  { 
 max-width: 100% !important;
margin-top: -8px !important;
}

#sb_additional_fields_container  .form-group .control-label  { 
 max-width: 100% !important;
}


}



#sb-timeline #steps #steps-content #sb_booking_content #details #sb_client_info_container {
margin-bottom: 0px; }

#sb-timeline #steps #steps-content #sb_booking_content #details .detail-step .left-side #sb_client_info_container label {
    width: 100px;
    text-align: left;
}

.slot--available-slot:before {
  content:"slots left : ";
}

#sb-timeline #steps #steps-content #sb_booking_content .datetime-step #sb_timeview_container .timeline-wrapper #sb-time-classes-container:before {
  content:"For large groups of more than 10 or any booking assistance, reach out to us at info@octopus.surf";
padding-bottom: 12px;
}

.page--booking  .wrapper .btn {display:none !important;}

.timeline-wrapper .tab-pd { padding-top: 12px; }

#sb-timeline #steps #steps-content #sb_booking_content .datetime-step #sb_timeview_container .timeline-wrapper #sb_time_slots_container .slot {
    max-width: 160px;
height: 100px;
}

#sb-timeline #steps #steps-content #sb_booking_content .datetime-step #sb_timeview_container .timeline-wrapper #sb_time_slots_container .slot a.has-available-slot {
    padding-bottom: 2px!important;
    border-radius: 4px;
height: 100%;
}

 #events input.reserve_time_btn   {
	/* add your css rule here */
}



 #events input.select_another_btn   {
	/* add your css rule here */
}

#sb-timeline #steps #steps-content #sb_booking_content .datetime-step #sb_timeview_container .timeline-wrapper #sb_time_slots_container .slot a .slot--available-slot, #sb-timeline #steps #steps-content #sb_booking_content .datetime-step #sb_timeview_container .timeline-wrapper #sb_time_slots_weekly_container .data-col .time-container .time-slot .cell .slot--available-slot, .classes-modal .sb-cell .slot--available-slot {
    background: transparent;
    padding-right: 4px;
    bottom: 0px;
}


 #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 */
}

#sb-timeline #steps-nav li:first-child:before, #sb-timeline #steps-nav li.passed:before, #sb-timeline #steps-nav li.passed + li:not(.passed):before { background: none !important;}

#sb-timeline #steps-nav li:first-child .title-small, #sb-timeline #steps-nav li.passed .title-small, #sb-timeline #steps-nav li.passed + li:not(.passed) .title-small { text-transform: uppercase;  text-align: center;}

#sb_google_translate .custom-form select.goog-te-combo, .custom-form #sb_google_translate select.goog-te-combo, .custom-form .file-upload__wrapper, .custom-form input:not([type=checkbox]), .custom-form select.form-control {background: #efeeee; border-radius: 4px !important; border: none !important; }