/* ENKEL INDIEN JE X WIL IPV TEKST OM TE ANNULEREN */

.blc_1 #fbuilder a.cancel {
    visibility:hidden;
}
.blc_1 #fbuilder a.cancel:before {
    display: inline-block;
    content: "X";
    color: #fff;
    background: #F45555;
    border-radius: 999em;
    visibility: visible;
    position: absolute;
    padding: 0px 10px;    
    font-weight: bold;
    font-size: 12px;
    margin-top: 3px;
    margin-left: 5px;
}

.blc_1 #fbuilder .ui-datepicker table, .blc_1 #fbuilder .ui-datepicker thead, .blc_1 #fbuilder .ui-datepicker tr, .blc_1 #fbuilder .ui-datepicker th, .blc_1 #fbuilder .ui-datepicker td {border: 0px;}
.blc_1 #fbuilder .ui-datepicker{box-shadow:none;font:inherit}
.blc_1 #fbuilder .ui-datepicker-header{background:none;padding:0px}
.blc_1 #fbuilder .ui-datepicker-header{text-shadow:none;color:inherit}
.blc_1 #fbuilder .ui-datepicker-calendar .ui-state-default{background:none;box-shadow: none;}
.blc_1 #fbuilder .ui-datepicker-calendar .ui-state-active{box-shadow:none;text-shadow:none;color:#2271b3;border:0px solid}
.blc_1 #fbuilder .ui-datepicker thead{background:none}

.blc_1 #fbuilder .dfield.fapp{display: flex;flex-wrap: wrap;}
.blc_1 #fbuilder .fieldCalendarService,.blc_1 #fbuilder .usedSlots ,.blc_1 #fbuilder .usedSlots,.blc_1 #fbuilder .totalCost{width: 100%;}  
.blc_1 #fbuilder .fieldCalendar,#fbuilder .slotsCalendar{
    width: auto;
    display: inline-flex;
    flex: 1;
    
}
@media (max-width: 767px) {
 .blc_1 #fbuilder .dfield.fapp{display: block}
 .blc_1 #fbuilder .slots{margin:0px;padding:0px}

.blc_1 #fbuilder .ui-datepicker-header{padding:0px 3%}
}
.blc_1 #fbuilder .ui-datepicker-inline{max-width:calc(97%);}   
.blc_1 #fbuilder .slots{border:0px;box-shadow:none;}	

.blc_1 #fbuilder .ui-datepicker-next,.blc_1 #fbuilder .ui-datepicker-prev {display: inline-block;width:18px !important;height:18px !important;margin:10px !important;border-top: 2px solid #000;border-right: 2px solid #000;background:none !important;}
.blc_1 #fbuilder .ui-datepicker-next {transform: rotate(45deg);}
.blc_1 #fbuilder .ui-datepicker-prev {transform: rotate(-135deg);}

#fbuilder .ui-state-default, #fbuilder .ui-widget-content .ui-state-default, #fbuilder .ui-widget-header .ui-state-default, #fbuilder .ui-button, #fbuilder html .ui-button.ui-state-disabled:hover, #fbuilder html .ui-button.ui-state-disabled:active{border:inherit;font-weight:bold}
#fbuilder .ui-state-active, #fbuilder .ui-widget-content .ui-state-active, #fbuilder .ui-widget-header .ui-state-active, #fbuilder a.ui-button:active, #fbuilder .ui-button:active, #fbuilder .ui-button.ui-state-active:hover{border:inherit;font-weight:bold}

.blc_1 #fbuilder .fbprogress li {
  margin-left: 20px !important;
  margin-right: 20px !important;
}
.blc_1 #fbuilder ul.fbprogress li.active {
  color: #424242;
  border-bottom: 10px solid #424242;
}

/* GEEN MARGE BIJ CHECKBOX TEXT */
.blc_1 #fbuilder .one_column {
  line-height: 1.3;
}
/* CHECKBOX LEFT ALIGN TEXT 
.blc_1 #fbuilder .cff-checkbox-field {
  margin-left: 29px;
}
.blc_1 #fbuilder input[type="checkbox"] {
  margin-left: -29px;
}
*/

/* SUMMARY GEEN TITLE */
.blc_1 #fbuilder .cff-summary-title {
  display: none;
}

/* MULTI-PAGE BOOKING BORDER */
.blc_1 #fbuilder fieldset {
  border-radius: 7px;
}
.blc_1 #fbuilder legend {
  border-radius: 7px;
  background-color: #f7f7f7;
}

.blc_1 #fbuilder h2 {
  font-size: .9em;
  color: black;
  margin-bottom: 0;
}

/* LEGENDE VOOR MULTI-PAGE BOOKING */
.blc_1 #fbuilder legend {
  width: auto;
  text-transform: initial;
  font-size: .85em;
}

/* TOTAL COST */
.blc_1 #fbuilder .totalCost {
  border-top: 2px solid black;
  max-width: 427px;
}

/* Keuze vak bovenaan */
.blc_1 #fbuilder select {
  max-width: 400px;
  margin-bottom: 1em;
  border-radius: 3px;
}
.blc_1 #fbuilder select:focus {
  box-shadow: none;
}

/* HOOGTE RIJEN */
.blc_1 #fbuilder .ui-datepicker td {
  height: 40px !important;
}

/* label sterretje */
.blc_1 #fbuilder .r {
  color: blue;
}

/* Label color */
.blc_1 #fbuilder label {
  color: black;
}

/* Input label */
.blc_1 #fbuilder input[type="text"] {
  box-shadow: none !important;
  padding: 0.5em !important;
  height: 38px;
  border-radius: 3px;
}
.blc_1 #fbuilder input[type="text"]:hover {
  box-shadow: none;
}
.blc_1 #fbuilder input[type="text"]:active {
  box-shadow: none;
}
.blc_1 #fbuilder input:focus {
  box-shadow: none;
  border: 1px solid #999;
}
.blc_1 #fbuilder input {
  margin-bottom: 0;
}

/* Datum typen voor keuze */
.blc_1 #fbuilder .slots span::before {
  content: 'Kies een slot voor\00a0';
  display: inline-block;
  padding-bottom: 4px;
}

/* RUIMTE TUSSEN DE CELLEN */
.blc_1 #fbuilder .ui-datepicker tbody td {
  padding: 0px;
}

/* ERROR TEKST */
.blc_1 #fbuilder div.cpefb_error::after {
  background: none;
}

/* USED SLOTS SELECTION */
.blc_1 #fbuilder .usedSlots {
  margin-top: 10px;
}
.blc_1 #fbuilder .ahb_list_time .t::after {
  content: '\00a0 uur\00a0\00a0|';
}
.blc_1 #fbuilder .ahb_list_time .t::before {
  content: 'om\00a0';
}
.blc_1 #fbuilder .ahb_list_service {
  padding: 0px 7px;
}

/* FONT VOOR KEUZE ONDER DATEPICKER */
.blc_1 #fbuilder .ahb_list {
  font-size: 90%;
  margin-bottom: 2px;
}
.blc_1 #fbuilder .cancel {
  color: #6380ae;
  font-weight: bold;
}

/* RAND ROND KALENDER */
.blc_1 #fbuilder .ui-datepicker-inline {
  border: 2px solid #ddd;
  padding: 6px;
  max-width: 100%;
  border-radius: 10px;
}

/* checkbox field */
.blc_1 #fbuilder .cff-checkbox-field span {
  font-weight: normal !important;
}

/* ACHTERGROND HEADER */
.blc_1 #fbuilder .ui-datepicker-header {
  background: white;
  color: #424242;
}
.blc_1 #fbuilder .ui-datepicker-header {
  box-shadow: none;
}
.blc_1 #fbuilder .ui-datepicker th {
  padding-bottom: 5px;
  text-transform: capitalize;
}

/* ACHTERGROND ONBESCHIKBAAR */
.blc_1 #fbuilder .ui-datepicker-unselectable .ui-state-default {
  color: #dbdbdb;
  background-color: white !important;
}
.blc_1 #fbuilder .ui-datepicker-calendar .ui-state-default {
  background-color: white;
}

/* KEUZE UUR RECHTS */
.blc_1 #fbuilder .slots div a {
  background: white !important;
  color: #424242;
  font-size: .9em;
  border-radius: 6px;
  border: 2px solid #424242;
  font-weight: bold;
  padding: 5.5px;
}

/* KEUZE UUR RECHTS HOVER */
.blc_1 #fbuilder .slots div a:hover {
  background: white !important;
  color: #424242 !important;
}

/* KEUZE DAG IN DATEPICKER */
.blc_1 #fbuilder .ui-datepicker-calendar .ui-state-active {
  color: white;
  background-color: #424242;
  border-radius: 9px;
}

.blc_1 #fbuilder .slots div {
  border: none !important;
}

.blc_1 #fbuilder .ui-datepicker-header {
  margin-bottom: 7px;
}

.blc_1 #fbuilder a {
  color: #4a4a4a;
}

.blc_1 #fbuilder .fieldCalendar {
  display: block;
  margin-bottom: 7px;
}

.blc_1 #fbuilder .ui-datepicker-next {
  width: 14px !important;
  height: 14px !important;
  margin: 10px !important;
  border-top: 5px solid #424242;
  border-right: 5px solid #424242;
}
.blc_1 #fbuilder .ui-datepicker-prev {
  width: 14px !important;
  height: 14px !important;
  margin: 10px !important;
  border-top: 5px solid #424242;
  border-right: 5px solid #424242;
}

/* captcha */
.blc_1 #fbuilder .captcha {
  font-size: .9em;
  margin-top: 9px;
}
.blc_1 #fbuilder .captcha img {
  cursor: pointer;
  margin-bottom: 5px;
}
.blc_1 #fbuilder .captcha input[type="text"] {
  width: 176px;
}

/* submit button */
.blc_1 #fbuilder .pbSubmit {
  font-size: .75em;
}
.blc_1 #fbuilder .pbreak .pbPrevious {
  background-color: #424242 !important;
  color: white !important;
  padding: 1px 15px !important;
  text-transform: uppercase !important;
  letter-spacing: .03em !important;
  border: 0px !important;
  font-size: .75em !important;
  font-weight: bolder !important;
  line-height: 2.4em !important;
  min-height: 2.5em !important;
}
.blc_1 #fbuilder .pbreak .pbNext {
  background-color: #424242 !important;
  color: white !important;
  padding: 1px 15px !important;
  text-transform: uppercase !important;
  letter-spacing: .03em !important;
  border: 0px !important;
  font-size: .75em !important;
  font-weight: bolder !important;
  line-height: 2.4em !important;
  min-height: 2.5em !important;
  vertical-align: middle;
}
.blc_1 #fbuilder .pbreak .pbPrevious, .blc_1 #fbuilder .pbreak .pbNext, .blc_1 #fbuilder .pbSubmit {
  background-color: #424242 !important;
  color: white !important;
  padding: 1px 15px !important;
  text-transform: uppercase !important;
  letter-spacing: .03em !important;
  border: 0px !important;
  font-size: .75em !important;
  vertical-align: middle;
}