/* ------------------------------------------------------------ *\
	Popup
\* ------------------------------------------------------------ */

.bb-popup { position: fixed; top: 0; right: 0; left: 0; bottom: 0; font-family: museo-sans, sans-serif; z-index: -1; line-height: 1.3; opacity: 0; visibility: hidden; transition: opacity .4s, visibility .4s; transition-delay: .4s; }
.bb-popup.is-visible { opacity: 1; visibility: visible; transition-delay: 0; z-index: 999999; }

.bb-popup .bb-popup__inner { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(255,255,255,.9); display: flex; flex-wrap: wrap; justify-content: center; align-items: center; }

.bb-popup form { width: 753px; margin-top: 200px; opacity: 0; transition: opacity .4s, margin-top .4s; transition-delay: 0; }
.bb-popup.is-visible form { opacity: 1; margin-top: -40px; transition-delay: 1s; }
.bb-popup .bb-popup__body { position: relative; padding: 41px 33px 35px 36px; background: #fff; box-shadow: 0 0 30px rgb(215,215,215,.45); border-radius: 7px; width: 100%; max-height: calc(100vh - 40px); overflow: auto; }
.bb-popup .bb-popup__body-inner { width: 100%; }

.bb-popup .bb-popup__time { width: 100%; display: block; text-align: right; font-size: 13px; font-family: museo-sans, sans-serif; font-weight: 700; line-height: 1; padding-bottom: 12px; color: #525252; }

.bb-popup .bb-tabs { overflow: hidden; }

@media(max-width: 767px) {
	.bb-popup form { width: 100%; }
	.bb-popup.is-visible form { margin-top: 0; }
	.bb-popup .bb-popup__body { padding: 42px 20px 38px; max-height: calc(100vh - 160px); }
}

/* ------------------------------------------------------------ *\
	Tabs
\* ------------------------------------------------------------ */

.bb-tabs .bb-tabs__nav { width: 100%; overflow: hidden; margin-bottom: 24px; }

.bb-tabs .bb-tabs__nav > ol { list-style: none; padding: 0; display: flex; flex-wrap: wrap; margin: 0 -2px; }
.bb-tabs .bb-tabs__nav > ol > li { padding: 0 2px; width: 25%; }
.bb-tabs .bb-tabs__nav > ol > li > a { display: block; text-decoration: none; padding-right: 10px; color: #c1c1c1; font-family: museo-sans, sans-serif; font-weight: 500; font-size: 13px; line-height: 1; padding-bottom: 14px; border-bottom: 7px solid #e9e9e9; transition: color .4s, border-bottom .4s; cursor: auto; }
.bb-tabs .bb-tabs__nav > ol > li.bb-done-step > a { cursor: pointer; }

.bb-tabs .bb-tabs__nav > ol > li.bb-done-step > a:hover,
.bb-tabs .bb-tabs__nav > ol > li.bb-active > a { color: #01bae8; border-color: #01bae8; }

.bb-tabs .bb-tabs__body { position: relative; }

@media(max-width: 767px) {
	.bb-tabs .bb-tabs__nav > ol > li { display: none; width: 100%; }
	.bb-tabs .bb-tabs__nav > ol > li.bb-active { display: block; }
}

/* ------------------------------------------------------------ *\
	Tab
\* ------------------------------------------------------------ */

.bb-tab { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0; visibility: hidden; }

.bb-tab.bb-active { position: relative; top: 0; left: 0; transform: translate(0); opacity: 1; visibility: visible; z-index: 3; }

.bb-tab .flatpickr-calendar.open,
.bb-tab .flatpickr-calendar.inline { visibility: hidden; }

.bb-tab.bb-active .flatpickr-calendar.open,
.bb-tab.bb-active .flatpickr-calendar.inline { visibility: visible; }

.bb-tab .bb-tab__actions { display: flex; align-items: flex-end; padding-top: 20px; margin-top: 21px; border-top: 1px solid #eaeaea; }

@media(max-width: 767px) {
	.bb-tab .bb-tab__actions { flex-wrap: wrap; }
	.bb-tab .bb-tab__actions a.bb-btn { width: 100% !important; margin: 0 0 8px 0 !important; }
}

/* ------------------------------------------------------------ *\
	Tabs Schedule
\* ------------------------------------------------------------ */

.bb-tabs-schedule { position: relative; }

.bb-tab-schedule { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0; visibility: hidden; }

.bb-tab-schedule.bb-is-active { position: relative; top: 0; left: 0; transform: translate(0); opacity: 1; visibility: visible; }

/* ------------------------------------------------------------ *\
	Btns List
\* ------------------------------------------------------------ */

.bb-btns-list > ul { padding: 0; list-style: none; display: flex; flex-wrap: wrap; margin: -5px; }
.bb-btns-list > ul > li { display: flex; padding: 5px; width: 25%; flex-grow: 1; margin: 0; }
.bb-btns-list > ul > li + li { margin: 0; }
.bb-btns-list > ul > li > a { width: 100%; text-decoration: none; }

@media(max-width: 767px) {
	.bb-btns-list > ul > li { width: 50%; }
}

@media(max-width: 479px) {
	.bb-btns-list > ul > li { width: 100%; }
}

/* ------------------------------------------------------------ *\
	Btn
\* ------------------------------------------------------------ */

.bb-btn { font-size: 13px; font-family: museo-sans, sans-serif; font-weight: 500; color: #fff; background: #01bae8; display: inline-block; line-height: 1.1; text-decoration: none; min-width: 142px; padding: 10px 20px; border-radius: 4px; border: 2px solid #01bae8; transition: background .4s, color .4s, border-color .4s; text-align: center; }

.bb-btn:hover { background: transparent; color: #01bae8; }

.bb-btn--prev { margin-right: auto; }
.bb-btn--next { margin-left: auto; }

.bb-btn--cancel { background: #f5f5f5; border-color: #f5f5f5; font-weight: 300; font-size: 13px; color: #ee7e7e; margin-left: auto; }
.bb-btn--cancel:hover { background: transparent; color: #ff5050; }
.bb-btn--cancel + .bb-btn--next { margin-left: 12px; }

.bb-btn--alt { border-color: #ebeef1; background: #ebeef1; font-size: 12px; color: #747474; font-weight: 500; min-width: auto; padding: 4px 14px; margin-bottom: 6px: }
.bb-btn--alt:hover { background: transparent; color: #525252; }

.bb-btn--cmpl { border-color: #ff1b63; background: #ff1b63; }
.bb-btn--cmpl:hover { background: transparent; color: #ff1b63; }

/* ------------------------------------------------------------ *\
	Btn Complex
\* ------------------------------------------------------------ */

.bb-btn-complex { display: inline-block; padding: 16px 18px; color: #525252; font-family: museo-sans, sans-serif; font-weight: 500; border: 1px solid #eaeaea; text-align: center; line-height: 1.38; border-radius: 7px; font-size: 13px; }
.bb-btn-complex i { display: block; margin: 0 auto 8px; }

/* ------------------------------------------------------------ *\
	Lists
\* ------------------------------------------------------------ */

.bb-list-inputs > ul { list-style: none; padding: 0; margin: 0; }
.bb-list-inputs > ul > li { padding: 0; margin: 0; }
.bb-list-inputs > ul > li + li { margin-top: 16px; }

/* ------------------------------------------------------------ *\
	Form Elements
\* ------------------------------------------------------------ */

.bb-form-controls.bb-form-controls label { color: #01bae8; font-size: 14px; font-weight: 500; margin-bottom: 8px; display: block; line-height: 1.1; }

.bb-form-controls.bb-form-controls input,
.bb-form-controls.bb-form-controls textarea,
.bb-form-controls.bb-form-controls select { font-size: 13px; font-family: museo-sans, sans-serif; font-weight: 500; color: #777; line-height: 1; padding: 0 10px; border: 1px solid #e7e9ee; width: 100%; background: transparent; }

.bb-form-controls.bb-form-controls input,
.bb-form-controls.bb-form-controls select { height: 30px; }

.bb-form-controls.bb-form-controls textarea { padding: 10px; }
.bb-form-controls.bb-form-controls select { appearance: none;-moz-appearance:none; -webkit-appearance:none; }
.bb-form-controls.bb-form-controls select::-ms-expand { display: none; }

.bb-select { position: relative; }
.bb-select:after { content: ''; position: absolute; top: 48%; right: 10px; transform: translateY(-50%) rotate(-45deg); width: 6px; height: 6px; border-width: 0 0 1px 1px; border-color: transparent transparent #777 #777; border-style: solid; pointer-events: none; }

/* ------------------------------------------------------------ *\
	Section Service
\* ------------------------------------------------------------ */

.bb-section-service { display: flex; flex-wrap: wrap; }

.bb-section-service .bb-section__content { width: 48.5%; padding-top: 13px; padding-right: 30px; }
.bb-section-service .bb-section__calendar { width: 51.5%; }

@media(max-width: 767px) {
	.bb-section-service .bb-section__content { width: 100%; padding-top: 0; padding-right: 0; margin-bottom: 20px; }
	.bb-section-service .bb-section__calendar { width: 100%; }	
}

/* ------------------------------------------------------------ *\
	Icons
\* ------------------------------------------------------------ */

.bb-ico-right { display: inline-block; border-width: 3px 0 3px 6px; border-style: solid; border-color: transparent transparent transparent #01bae8; }
.bb-ico-pin { display: inline-block; background: url(../images/location-pin.svg) no-repeat center/cover; width: 9px; height: 11px; margin-top: 2px; }
.bb-ico-print { display: inline-block; width: 37px; height: 32px; background: url(../images/ico-print.png) no-repeat center/cover; }
.bb-ico-reminder { display: inline-block; width: 27px; height: 35px; background: url(../images/ico-reminder.png) no-repeat center/cover; }
.bb-ico-phone { display: inline-block; width: 35px; height: 33px; background: url(../images/ico-phone.png) no-repeat center/cover; }
.bb-ico-share { display: inline-block; width: 25px; height: 32px; background: url(../images/ico-share.png) no-repeat center/cover; }

.bb-ico-loading { background: url('../images/spinner.svg') no-repeat center/cover; width: 100px; height: 100px; margin: 100px auto; display: block; }

/* ------------------------------------------------------------ *\
	Section Time
\* ------------------------------------------------------------ */

.bb-section-time { width: 100%; }

.bb-section-time .bb-section__head { text-align: center; border: 1px solid #eaeaea; border-radius: 9px; padding: 20px; font-size: 13px; font-weight: 300; color: #525252; margin-bottom: 18px; }
.bb-section-time .bb-section__head p { margin-bottom: 10px; }
.bb-section-time .bb-section__head p:last-child { margin-bottom: 0; }
.bb-section-time .bb-section__head h2 { color: #01bae8; font-family: museo-sans, sans-serif; font-size: 24px; font-weight: 400; }
.bb-section-time .bb-section__head .bb-ico-right { margin: 0 4px 2px; }

/* ------------------------------------------------------------ *\
	Slider Default
\* ------------------------------------------------------------ */

.bb-slider-default { position: relative; max-width: 420px; margin: 0 auto; padding: 0 40px; overflow: hidden; }

.bb-slider-default .bb-slider__clip { width: 100%; }

.bb-slider-default .bb-slider__slides { display: flex; justify-content: center; align-items: center; transform: translateX(0); transition: transform .4s; }
.bb-slider-default .bb-slider__slide { position: relative; width: 100%; flex-shrink: 0; margin: 0 40px; opacity: 0; transition: opacity .4s; }
.bb-slider-default .bb-slider__slide.bb-is-active { opacity: 1; }

.bb-slider-default .bb-slider__actions { position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-50%); display: flex; justify-content: space-between; align-items: center; }

.bb-slider-default .bb-slider__prev,
.bb-slider-default .bb-slider__next { position: relative; width: 14px; height: 14px; }

.bb-slider-default .bb-slider__prev span,
.bb-slider-default .bb-slider__next span { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(45deg); width: 8px; height: 8px; border-width: 0 0 1px 1px; border-color: transparent transparent #777 #777; border-style: solid; }
.bb-slider-default .bb-slider__next span { transform: translate(-50%, -50%) rotate(-135deg); }

/* ------------------------------------------------------------ *\
	List Times
\* ------------------------------------------------------------ */

.bb-list-times { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; margin: -7px -4px; }
.bb-list-times li { width: 25%; padding: 7px 4px; }
.bb-list-times a { flex-direction: column; display: flex; align-items: center; justify-content: center; height: 40px; border: 1px solid #e7e9ee; border-radius: 20px; font-size: 12px; font-weight: 500; color: #525252; text-decoration: none; padding: 4px 20px; text-align: center; transition: background .4s, color .4s; }

.bb-list-times li.bb-is-selected a,
.bb-list-times a:hover { color: #fff; background: #ff1b63; border-color: #ff1b63; }
.bb-list-times li.bb-is-disabled a { background: #ebeef1; border-color: #ebeef1; pointer-events: none; color: #979797; }

@media(max-width: 767px) {
	.bb-list-times li { width: 50% }
}

@media(max-width: 479px) {
	.bb-list-times li { width: 100% }
}

/* ------------------------------------------------------------ *\
	Section Payment
\* ------------------------------------------------------------ */

.bb-section-payment .bb-section__row { display: flex; flex-wrap: wrap; margin-bottom: 20px; }
.bb-section-payment .bb-section__row:last-child { margin-bottom: 0; }
.bb-section-payment .bb-section__row + .bb-section__row  { padding-top: 18px; border-top: 1px solid #eaeaea; }

.bb-section-payment .bb-section__content { width: 50%; padding-right: 40px; }
.bb-section-payment .bb-section__aside { width: 50%; }

.bb-section-payment .bb-section__aside > h4 { font-size: 14px; font-family: museo-sans, sans-serif; line-height: 1.1; color: #525252; font-weight: 700; margin-bottom: 10px; }
.bb-section-payment .bb-section__aside--payment > h4 { font-size: 18px; margin: 0 0 10px; color: #01bae8; }

.bb-section-payment .bb-section__aside--payment .bb-form-controls { margin-bottom: 16px; }
.bb-section-payment .bb-section__aside--payment .bb-input { display: flex; align-items: center; padding: 0 10px; border: 1px solid #eaeaea; width: 100%; background: transparent; height: 30px; border: 1px solid #eaeaea !important; }
.bb-section-payment .bb-section__aside--payment .bb-input > * { width: 100%; }

@media(max-width: 767px) {
	.bb-section-payment .bb-section__content { width: 100%; padding-right: 0; margin-bottom: 20px; }
	.bb-section-payment .bb-section__aside { width: 100%; }
}

/* ------------------------------------------------------------ *\
	Table
\* ------------------------------------------------------------ */

.bb-table { padding: 20px 0; border: 1px solid #eaeaea; overflow: hidden; border-radius: 8px; }

.bb-table table { border-width: 0; border-color: transparent; border-collapse: inherit; border-spacing: 0; }
.bb-table table tbody { border-width: 0; border-color: transparent; border-collapse: inherit; border-spacing: 0; }

.bb-table table tr:nth-child(odd) { background: #f7f7f7; -webkit-print-color-adjust: exact; }

.bb-table table td { width: 70%; height: 32px; padding: 8px 16px; font-size: 13px; font-family: museo-sans, sans-serif; color: #525252; font-weight: 400; font-style: normal; border-width: 0; border-color: transparent; border-collapse: inherit; border-spacing: 0; }
.bb-table table td:first-child { text-align: left; width: 40%; font-weight: 700; }
.bb-table table td:last-child { text-align: right; }
.bb-table table a { text-decoration: underline; color: inherit; }
.bb-table table a:hover { text-decoration: none; }

/* ------------------------------------------------------------ *\
	Section Confirmation
\* ------------------------------------------------------------ */

.bb-section-confirmation .bb-section__head { text-align: center; margin-bottom: 20px; }

.bb-section-confirmation .bb-section__head h2,
.bb-section-confirmation .bb-section__head h3 { line-height: 1.1; }

.bb-section-confirmation .bb-section__head h2 { font-size: 22px; color: #ff1b63; font-weight: 900; margin-bottom: 4px; }
.bb-section-confirmation .bb-section__head h3 { font-size: 17px; color: #000; font-weight: 700; margin-bottom: 0; }

.bb-section-confirmation .bb-table td:first-child { font-weight: 900; color: #01bae8; }
.bb-section-confirmation .bb-table tr:last-child td:last-child { font-weight: 900; }

.bb-section-confirmation .bb-section__foot { margin-top: 12px; }

/* ------------------------------------------------------------ *\
	Validation Error
\* ------------------------------------------------------------ */

.bb-popup .bb-validation-error { color: red; font-size: 18px; margin: 25px 0 15px; width: 100%; text-align: center; }

/* Mobile */

$breakpoint-mobile {
	.bb-popup .bb-validation-error { font-size: 16px; }
}

/* ------------------------------------------------------------ *\
	Calendar
\* ------------------------------------------------------------ */

.bb-section-service .flatpickr-calendar { width: 100%; box-shadow: none; border-radius: 0; }
.bb-section-service .flatpickr-calendar > .flatpickr-innerContainer { border: 1px solid #e7e9ee; border-top: 0; }
.bb-section-service .flatpickr-calendar .flatpickr-months { background: #01bae8; }

.bb-section-service .flatpickr-calendar .flatpickr-current-month:after { content: ''; position: absolute; top: 50%; right: calc(50% - 20px); width: 8px; height: 8px; margin-top: 1px; border-width: 0 0 2px 2px; border-color: transparent transparent #fff #fff; border-style: solid; transform: translate(-50%, -50%) rotate(-45deg); }
.bb-section-service .flatpickr-calendar .flatpickr-current-month .flatpickr-monthDropdown-months { appearance: none; -webkit-appearance: none; padding-right: 20px; }

.bb-section-service .flatpickr-calendar .flatpickr-months .flatpickr-prev-month svg,
.bb-section-service .flatpickr-calendar .flatpickr-months .flatpickr-next-month svg { fill: #fff; }


.bb-section-service .flatpickr-calendar .flatpickr-months .flatpickr-month { color: #fff; }

.bb-section-service .flatpickr-calendar .flatpickr-rContainer { width: 100%; }

.bb-section-service .flatpickr-calendar .flatpickr-days { width: 100%; }

.bb-section-service .flatpickr-calendar .dayContainer { width: 100%; max-width: 100%; min-width: auto; }

.bb-section-service .flatpickr-calendar .flatpickr-day { max-width: 100%; border-radius: 0; border: 0; transition: background .4s, color .4s; color: #777; }
.bb-section-service .flatpickr-calendar .flatpickr-day.prevMonthDay { background: #fafafa; color: #e5e5e5; }
.bb-section-service .flatpickr-calendar .flatpickr-day.selected { background: #ff1b63; color: #fff; }
.bb-section-service .flatpickr-calendar .flatpickr-day.flatpickr-disabled:not(.prevMonthDay) { background: #f2f2f2; color: #dcdcdc; }

.bb-section-service .flatpickr-calendar .flatpickr-day:hover { background: #ff1b63; color: #fff; }

.bb-section-service .flatpickr-calendar .flatpickr-weekday { color: #777; text-transform: uppercase; }