@font-face { font-family: 'fontin_sansbold'; src: url('../fonts/fontin_sans_b_45b.woff2') format('woff2'), url('../fonts/fontin_sans_b_45b.woff') format('woff'); font-weight: normal; font-style: normal;}
@font-face { font-family: 'fontin_sansbold_italic'; src: url('../fonts/fontin_sans_bi_45b.woff2') format('woff2'), url('../fonts/fontin_sans_bi_45b.woff') format('woff'); font-weight: normal; font-style: normal;}
@font-face { font-family: 'fontin_sansitalic'; src: url('../fonts/fontin_sans_i_45b.woff2') format('woff2'), url('../fonts/fontin_sans_i_45b.woff') format('woff'); font-weight: normal; font-style: normal;}
@font-face { font-family: 'fontin_sansregular'; src: url('../fonts/fontin_sans_r_45b.woff2') format('woff2'), url('../fonts/fontin_sans_r_45b.woff') format('woff'); font-weight: normal; font-style: normal;}
@font-face { font-family: 'fontin_sanssmall_caps'; src: url('../fonts/fontin_sans_sc_45b.woff2') format('woff2'), url('../fonts/fontin_sans_sc_45b.woff') format('woff'); font-weight: normal; font-style: normal;}
@font-face { font-family: 'montserratblack'; src: url('../fonts/montserrat-black.woff2') format('woff2'), url('../fonts/montserrat-black.woff') format('woff');    font-weight: normal; font-style: normal;}
@font-face { font-family: 'montserratbold'; src: url('../fonts/montserrat-bold.woff2') format('woff2'), url('../fonts/montserrat-bold.woff') format('woff'); font-weight: normal;font-style: normal;}
@font-face { font-family: 'montserratextrabold'; src: url('../fonts/montserrat-extrabold.woff2') format('woff2'), url('../fonts/montserrat-extrabold.woff') format('woff');    font-weight: normal; font-style: normal;}
@font-face { font-family: 'montserratextralight'; src: url('../fonts/montserrat-extralight.woff2') format('woff2'), url('../fonts/montserrat-extralight.woff') format('woff');font-weight: normal; font-style: normal;}
@font-face { font-family: 'montserratitalic'; src: url('../fonts/montserrat-italic.woff2') format('woff2'), url('../fonts/montserrat-italic.woff') format('woff'); font-weight: normal; font-style: normal;}
@font-face { font-family: 'montserratlight'; src: url('../fonts/montserrat-light.woff2') format('woff2'),  url('../fonts/montserrat-light.woff') format('woff'); font-weight: normal; font-style: normal;}
@font-face {  font-family: 'montserratmedium'; src: url('../fonts/montserrat-medium.woff2') format('woff2'), url('../fonts/montserrat-medium.woff') format('woff');    font-weight: normal; font-style: normal;}
@font-face { font-family: 'montserratregular'; src: url('../fonts/montserrat-regular.woff2') format('woff2'),  url('../fonts/montserrat-regular.woff') format('woff');    font-weight: normal;  font-style: normal;}
@font-face { font-family: 'montserratsemibold'; src: url('../fonts/montserrat-semibold.woff2') format('woff2'), url('../fonts/montserrat-semibold.woff') format('woff');    font-weight: normal; font-style: normal;}
@font-face { font-family: 'montserratthin'; src: url('../fonts/montserrat-thin.woff2') format('woff2'),  url('../fonts/montserrat-thin.woff') format('woff'); font-weight: normal; font-style: normal;}



/* CSS Document */
* { box-sizing: border-box; }
html, body, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, header, footer, section, aside, nav, article, figure, address, audio, video { background: transparent; border: 0; margin: 0; padding: 0; outline: 0; }
html { min-height: 100%; position: relative; }
body {font-family: 'fontin_sansregular'; font-size: 13px; color: #333333; font-weight: 400; text-decoration: none; background: #ffffff; overflow-x: hidden; }
h1, h2, h3, h4, h5, h6 { color: #333333; margin-bottom: 15px; font-family: 'fontin_sansbold'; font-weight: normal; }
input, button { font-family: 'fontin_sansregular'; }
input[type="text"], input[type="password"] { margin: 0px; padding: 0px; border: 1px solid #d0d0d0; background: #ffffff; font-size: 14px; color: #333333; padding: 10px; font-family: 'fontin_sansregular'; -webkit-appearance: none; border-radius: 3px; box-sizing: border-box; }
select, textarea { margin: 0px; padding: 0px; border: 1px solid #d0d0d0; background: #ffffff; font-size: 13px; color: #333333; padding: 10px;font-family: 'fontin_sansregular'; resize: none; border-radius: 3px; box-sizing: border-box; }
textarea { overflow-y: auto; overflow-x: hidden; }
small { color: #666; font-size: 11px; }
:focus { outline: none; }
a:focus { outline: none; }
p { margin-bottom: 20px; line-height: 20px; }
img { border: none; outline: none; }
a { color: #222222; text-decoration: none; outline: none; transition: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s; }
a:hover, a:focus { color: #f8af44; text-decoration: none; outline: none; transition: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s; }
.sprites { background: url(../images/sprites.png) no-repeat 0 0; }
.rlatv { position: relative; }
.fnone { float: none !important; }
.nomrgn { margin: 0 !important; }
.nopad { padding: 0 !important; }
.wauto { width: auto !important; }
.req { color: #ff0000; font-size: 12px; }
button:focus { outline:none;}
.container { width:1356px; max-width:1356px;}
/* Common CSS end here */

/* Checkbox & Radio Button css */
input[type=checkbox]:not(old), input[type=radio ]:not(old) { width : 25px; height:25px; display:inline-block; vertical-align:top; margin : 0; padding : 0; opacity : 0; }
input[type=checkbox]:not(old) + label, input[type=radio ]:not(old) + label { display : inline-block; margin-left : -2em; line-height : 1.5em; }
input[type=checkbox]:not(old) + label > span{ display : inline-block; width : 20px; height : 20px; margin :0; border-radius : 2px; background: #ffffff;  border: 1px solid #d4d4e7; vertical-align : middle; float:left;  }
input[type=radio ]:not(old) + label > span { display : inline-block; width : 20px; height : 20px; margin :0; border-radius : 2px; background: #ffffff; border: 1px solid #d4d4e7; vertical-align : middle; float:left;  }
input[type=radio ]:not(old) + label > span { border-radius: 50%; }
input[type=checkbox]:not(old):checked + label > span, input[type=radio ]:not(old):checked + label > span { background: #54595F ; border: 1px solid #54595F ; }
input[type=checkbox]:not(old):checked + label > span:before {  content : ''; display : block; width : 20px; height:20px; text-align : center; background: url(../images/tick.png) no-repeat; background-position:-4px -4px;}
input[type=radio ]:not(old):checked + label > span { background: #54595F; border: 1px solid #54595F;}
input[type=radio]:not(old):checked + label > span > span { display: block; width: 10px; height: 10px; text-align: center; background: #3382c4; border-radius: 50%;  margin: 4px auto; }
/* Checkbox & Radio Button css */

.before-login, .fixed-top{background-color: #54595F !important; height:179px; transition: all 0.5s ease 0s; -ms-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; -webkit-transition: all 0.2s ease 0s;}
.navbar-dark.before-login .navbar-brand { color: #fff; display: flex; align-items: center; justify-content: center; width: 100%;}
.header-sticky .before-login { height:120px; transition: all 0.5s ease 0s; -ms-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; -webkit-transition: all 0.2s ease 0s;}
#middle{ margin-top:179px;}
.login-sec{  width: 100%; display: flex; position:relative; padding:90px 0 50px; align-items: center; justify-content: center;}
.login-blk { width:400px; display:flex; flex-direction: column; }
.top-logo { display:flex;  align-items: center; justify-content: center; flex-direction: column; text-align:center;}
.top-logo h2 { font-size: 32px; line-height: 43px; color: #54595F; font-family: 'fontin_sansregular'; margin:0; text-transform:uppercase;}
.top-logo p{ font-size:15px; color:#858585;  margin-top: 10px;}
.form-group{ display:flex;  flex-direction: column;position: relative;}
.form-group label { font-size:15px; color:#858585; margin-bottom:5px;}
.form-group .form-control{ height:46px; border-radius:8px;  border:1px solid #D4D4E7; padding:0 15px; color:#222222; font-size:16px;}
.form-group .form-control:focus { box-shadow:none; border-color:#54595F;}
.form-group .toggle-password { position: absolute;  right: 20px;  top: 41px; font-size: 16px; color: #858585; opacity: 0.8;}
.chckbox { display:table; margin:30px 0 0;}
.chckbox label em{ font-size:16px; color:#858585; font-style:normal; margin-left:10px;}
.cmn-btn { width: 180px; background: #54595F; height: 46px; border-radius: 8px; border: none; font-size: 16px;  color: #fff; cursor:pointer; align-items: center;    justify-content: center; display: flex; font-family: 'fontin_sansbold'; transition: all .5s ease 0s; -ms-transition: all .5s ease 0s;  -moz-transition: all .5s ease 0s;  -o-transition: all .5s ease 0s;  -webkit-transition: all .5s ease 0s;}
.cmn-btn:hover, .cmn-btn:focus { background:#222222; color:#fff;} 
.form-group.btn-group { display:flex; align-items: center; justify-content: center; margin-top:40px;}
.form-group.btn-group .cmn-btn { margin-bottom:10px;}
.form-group.btn-group .back-btn{ color: #354A5E; font-size: 11px; text-transform: uppercase; font-family: 'montserratbold'; border-bottom: 2px solid #f4f4f4; padding-bottom: 3px; }
.form-group.btn-group .back-btn:hover, .form-group.btn-group .back-btn:focus { opacity:1; color:#54595F; text-decoration: none;}
.forgot-blk .top-logo p{ font-size:15px; color:#858585; line-height:20px; margin-bottom:40px;}
/* Register page css */
.register-sec{ padding:100px 0;}
.login-blk.resgister-blk { width:550px;}
.login-blk.resgister-blk .top-logo h2 { font-size:36px;}
.login-blk.resgister-blk .top-logo p { font-size: 16px; color: #858585; line-height: 26px; margin-bottom: 40px;}
.login-blk.resgister-blk .top-form { margin-bottom:60px;}
.login-blk.resgister-blk .top-form:last-child{ margin-bottom:0;}
.top-form .blk-title { font-size: 22px; color: #54595F; margin-bottom: 20px; font-family: 'fontin_sansregular';}
.form-row { display:flex; justify-content: space-between;}
.top-form .custom-a-tag { margin-top: 10px; font-size: 15px; font-family: 'fontin_sansregular';}
.top-form .custom-a-tag:hover { color: #54595F };
.form-row .form-group { width:48%; display:flex;}
.login-blk.resgister-blk .form-group.btn-group { margin:0;}
.login-blk.resgister-blk .form-group.btn-group .cmn-btn { margin-bottom: 0;  margin-top: 30px;}
.form-group .form-inner {display:flex; justify-content: space-between;}
.form-group .form-inner .form-control { width:350px;}
.add-link{font-size:15px; color:#858585; text-decoration:underline; margin-top:10px;}
.add-link:hover, .add-link:focus { color:#54595F;}
.form-group .select2-container--default .select2-selection--single .select2-selection__rendered { color: #222222; line-height: 46px; padding: 0 50px 0 15px; font-size:16px;}
.form-group .select2-container--default .select2-selection--single { background-color: transparent; border:1px solid #d4d4e7;  border-radius: 8px;}
.form-group .select2-container--default .select2-selection--single .select2-selection__arrow { height: 40px; position: absolute; top: 1px; right: 1px; width: 50px;}
.form-group .select2-container--default .select2-selection--single .select2-selection__arrow b {border: solid #222222; border-width: 2px 2px 0px 0; display: inline-block;    padding: 3px; transform: rotate(135deg); -webkit-transform: rotate(135deg); opacity:1; transition: padding 0.3s ease 0s;}
.form-group .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {border: solid #fff; border-width: 2px 2px 0px 0; display: inline-block;    padding: 3px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); opacity: 0.5; margin-top:5px; transition: padding 0.3s ease 0s;}
.login-blk.resgister-blk .top-form .form-group:last-child { margin-bottom:0;}
.select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #54595F; color: white;}
.form-group.card-group .form-control{ background:url(../images/add-card-bg.png) no-repeat 98% 9px}
.form-row { display:flex; justify-content: space-between;}
.form-row .form-group { width:48%; display:flex;}
.form-group.b-day-group .inr-form-group{ display: flex; align-items: center;}
.form-group.b-day-group .inr-form-group .form-control{ width:70px; padding:0 10px; text-align:center;}
.form-group.b-day-group .inr-form-group span{ margin:0 20px}
.my_booking_flow {margin-top: 30px;}
.my_booking_flow .chose-time {display: flex; flex-direction: column; width: 100%; align-items: center; justify-content: center; margin-bottom: -25px;}
.my_booking_flow .chose-time h2{display: flex; align-items: center; justify-content: space-between; width: 100%; font-size: 14px; margin-bottom: 30px; text-align:center; line-height:18px; }
.my_booking_flow .chose-time h2 span{font-size: 24px; width: 32px;  height: 32px; display: flex; align-items: center; justify-content: center; background: #fafbfc;    border-radius: 100%;  color: #2A2D30; cursor:pointer;}
.my_booking_flow .chose-time h2 span:hover{ background: #eaecee; color: #2A2D30;}
.my_booking_flow .app-det {display: flex; flex-direction: column; width: 100%; align-items: center; justify-content: center; margin:40px 0 20px;}
.my_booking_flow .app-det p{ font-size:13px; margin:0; color:#858585; line-height:16px;}
.my_booking_flow .app-det h4{ font-size:18px;font-family: 'montserratmedium' !important; margin:10px 0 7px; color:#2A2D30; line-height:23px; text-align: center;}
.my_booking_flow .app-det span{ font-size:13px; margin:0; color:#858585; line-height:16px; text-align: center;}
.my_booking_flow .time-cnt { display: inline-block; width: 100%; margin-top:30px;}
.my_booking_flow .time-cnt p { text-align: center }
.my_booking_flow .time-cnt span{border: 1px solid #D4D4E7;border-radius: 8px; width:64px; height:40px;display: inline-block; text-align:center; line-height:40px; font-size:14px; color:#2A2D30; margin-right: 9px !important; margin-bottom: 9px; cursor:pointer;}
/*.my_booking_flow .time-cnt span:nth-child(4n+0){ margin-right:0;}*/
.my_booking_flow .time-cnt span:hover, .my_booking_flow .time-cnt span.active { background-color: #54595F; color: #fff; border-color:#444759;}
.my_booking_flow .my-book-pay-frm .help-ic{ position:absolute; top: 35px; right: 20px;}
.booking_flow .time-cnt span:hover, .booking_flow .time-cnt span.active { background-color: #54595F; color: #fff; border-color:#444759;}
.booking_flow .time-cnt { display: inline-block; width: 100%; margin-top:30px;}
.booking_flow .time-cnt p { text-align: center }
.booking_flow .time-cnt span{border: 1px solid #D4D4E7;border-radius: 8px; width:64px; height:40px;display: inline-block; text-align:center; line-height:40px; font-size:14px; color:#2A2D30; margin-right: 9px !important; margin-bottom: 9px; cursor:pointer;}
.booking_flow .time-cnt span:hover, .my_booking_flow .time-cnt span.active { background-color: #54595F; color: #fff; border-color:#444759;}


/* error class */
.form-group.error-wrapper .form-control {border-color: #fe0000 !important;}
.form-group.error-wrapper.post-group input#cvv {border-color: #fe0000 !important;}



/* Date picker css */
.my_booking_flow .react-datepicker__day.disabled-date { pointer-events: none; }
.my_booking_flow .react-datepicker__day.active-date { border-radius: 100% !important; background-color: #54595F !important; color: #fff !important; }

.my_booking_flow .chose-time .react-datepicker-popper { position: static !important; transform: none !important;}
.my_booking_flow .chose-time .react-datepicker-wrapper { display: none; }
.my_booking_flow .chose-time .react-datepicker-popper .react-datepicker { width: 100%; border:none;}
.react-datepicker__day--keyboard-selected, .react-datepicker__month-text--keyboard-selected, .react-datepicker__quarter-text--keyboard-selected, .react-datepicker__year-text--keyboard-selected {
    background-color: #fff !important;    color: #000 !important;}
.my_booking_flow .react-datepicker__header {    background-color: #fff !important;     border-bottom: 1px dotted #ddd !important;} 
.my_booking_flow .chose-time .react-datepicker__current-month { margin-bottom:20px; }   
.my_booking_flow .chose-time .react-datepicker-popper[data-placement^="bottom"] .react-datepicker__triangle {
    top: 0;
    margin-top: -8px;
    display: none;
}
.my_booking_flow .react-datepicker__triangle { display: none }
.my_booking_flow .browse-treatment.mCustomScrollbar h2 {

    margin-top: 25px;
    justify-content: center;
}

.booking_flow .react-datepicker__day.disabled-date { pointer-events: none; }
.booking_flow .react-datepicker__day.active-date { border-radius: 100% !important; background-color: #54595F !important; color: #fff !important; }

.booking_flow .chose-time .react-datepicker-popper { position: static !important; transform: none !important;}
.booking_flow .chose-time .react-datepicker-wrapper { display: none; }
.booking_flow .chose-time .react-datepicker-popper .react-datepicker { border:none;}
.react-datepicker__day--keyboard-selected, .react-datepicker__month-text--keyboard-selected, .react-datepicker__quarter-text--keyboard-selected, .react-datepicker__year-text--keyboard-selected {
    background-color: #fff !important;    color: #000 !important;}
.booking_flow .react-datepicker__header {    background-color: #fff !important;     border-bottom: 1px dotted #ddd !important;} 
.booking_flow .chose-time .react-datepicker__current-month { margin-bottom:20px; }   
.booking_flow .chose-time .react-datepicker-popper[data-placement^="bottom"] .react-datepicker__triangle {
    top: 0;
    margin-top: -8px;
    display: none;
}
.booking_flow .react-datepicker__triangle { display: none }
.booking_flow .browse-treatment.mCustomScrollbar h2 {
    margin-top: 25px;
    justify-content: center;
    text-align: center;
    font-family: revert;
    font-size: 24px;
}



.booking_steps{ list-style-type: none; display: flex; align-items: center; justify-content: center;}
.booking_steps li{ text-align: center; width: 33.33%;}
.booking_steps span{margin: 0 auto 10px; background-color: #e2e2e2; width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;}

.topheading{ margin-top: 50px; text-align: center;}
.topheading h2{ text-transform: uppercase; color: #54595F; font-weight: lighter;font-family: 'fontin_sansregular';}
.booking_steps li, .topheading p{font-size: 15px; color: #858585;}
.booking_steps li span{ position: relative;}
.booking_steps li span::after{position: absolute; content: ''; height: 1px; width: 18px; background-color:#d5d5e9; right: -42px;}
.booking_steps li:last-child span::after{display: none;}
.booking_steps li.active{ color: #54595F;}
.booking_steps li.active span{ background-color: #54595F; color: #fff;}
.my_booking_flow .react-datepicker__day-name, .my_booking_flow .react-datepicker__day, .my_booking_flow .react-datepicker__time-name{ width: 40px;}
.my_booking_flow .react-datepicker__day.active-date{ width: 40px; height: 40px; line-height: 40px; font-family: 'fontin_sansregular' !important;} 
.my_booking_flow .react-datepicker__day-names .react-datepicker__day-name:last-child, .my_booking_flow .react-datepicker__day-names .react-datepicker__day-name:first-child{color: #858585;} 
.my_booking_flow .react-datepicker__day--outside-month{ color: #858585;}

.saved-card{ text-align: left;}
.saved-card p{margin-bottom: 15px;}
.save-card-number{ cursor: pointer; display: flex; align-items: center; padding: 20px; border:2px solid #f0f0f0; border-radius: 6px; margin-bottom: 14px;}
.save-card-number img{margin-right: 20px;}
.save-card-number span{ display: table;}
.payment-time-detail{ display: flex; align-items: flex-start; justify-content: space-between; text-align: left; border-bottom: 2px solid #f0f0f0; padding-bottom: 15px; margin-top: 25px; margin-bottom: 36px;}
.payment-time-detail p{margin-bottom: 15px;}
.payment-card-wrapper{ text-align: left;}
.cvv-wrapper { display: flex; align-items: flex-start;}
.payment-card-wrapper .cvv-wrapper .help-ic{ margin-top: 36px; margin-left: 15px;}
.white-cmn-btn{ position: absolute; top: 57px; right: 30px; background-color: #fff; color: #54595F; width: 100px;}

.choose-appointment-model button.close { right: -80px }
.choose-appointment-model button.cmn-btn.canx-btn { margin-bottom: 15px; }
.choose-appointment-model .modal-dialog.modal-dialog-centered { max-width: 300px !important}

.card-not-approved-model button.close { right: -80px }
.card-not-approved-model button.cmn-btn.canx-btn { margin-bottom: 15px;  }
.card-not-approved-model .modal-dialog.modal-dialog-centered { max-width: 300px !important}


.simple-text-field-wrapper.form-group.booking-class {
    display: flex;
    margin-left: 1px;
    margin-right: 30px;
}
.simple-text-field-wrapper.form-group.booking-class.error-class .css-lxu114-control{
    border-color: red;
}

.select-practioner-span{
    color: #ffbc5b
}
.select-practioner-div {
    margin-bottom: 15px;
    position: relative;
}
.react-datepicker__day-name{
    font-family: 'fontin_sansregular' !important;
}

/* Book New appointments page css */
.add-appoinment { padding:35px; background: #354A5E; box-shadow: 0px 0px 22px #354A5E14; border-radius: 8px; margin-bottom:40px; display: flex;    justify-content: space-between; align-items: center;}
.add-appoinment h2 { display: flex; flex-direction: column; font-size: 18px; color: #fff; font-family: 'montserratbold'; margin: 0;}
.add-appoinment p{ font-size: 14px; font-family: 'montserratregular'; margin: 10px 0 0 0;}
.add-appoinment .cmn-btn{ width: 190px; height: 40px; }
.adding-clinic .new-sec .cmn-heading { flex-direction: column; justify-content: flex-start; align-items: flex-start;}
.adding-clinic .new-sec .cmn-heading p { font-size: 14px; color: #2A2D30; margin: 15px 0 0;}



/* payment page css */
.payment-page { width:100%; display:flex;}
.payment-page .cmn-sec { width:calc(100% - 526px); display:flex; padding:35px 70px 35px 20px;}
.payment-page .tab-content { width:526px; background:#F8F9FB;  border-left: 1px solid #E7E8EB;}
.payment-page .nav-tabs .nav-item.show .nav-link, .payment-page .nav-tabs .nav-link.active, .payment-page .nav-tabs .nav-link { border:none; padding:0;}
.payment-page .nav-tabs { border:none;}
.app-cnt span.download { display: flex; margin-left: 20px; align-items: flex-end; width: auto;}
.app-cnt h1.date{ width: 48px; height: 48px; font-size: 11px; display: flex; flex-direction: column; margin: 0; font-family: 'montserratbold'; line-height: 18px; align-items: center; justify-content: center; border: 1px solid #EAECEE; border-radius: 8px; text-align: center; text-transform: uppercase; color:#2A2D30;}
.app-cnt h1.date span{font-size: 18px;}
.payment-page .app-cnt { position:relative;}
.payment-page .active .app-cnt h1.date{ background:#2A2D30; color:#ffffff; border-color:#2A2D30;}
.payment-page .active .app-cnt:after{width: 47px; height: 47px; transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0); background: #F8F9FB; display:inline-block; position:absolute; right:-94px; top:15px; content:""; border: 1px solid #E7E8EB; border-width: 0 0px 1px 1px;}

/* My booking flow popup css */
/* .my_booking_flow .modal-dialog { max-width: 325px;} */
.my_booking_flow .modal-dialog { max-width: 600px;}
.my_booking_flow .popup-title {  margin-bottom: 30px; font-size: -8px; text-align: center}
.my_booking_flow .modal-content { padding: 45px 20px 20px;}
.my_booking_flow .modal-content form { width:100%;}
.my_booking_flow button.close { right: -45px; top: -70px;}
.timeslots-my-booking .modal-body { padding: 0 135px !important; }
.chose-clinic {display: flex; flex-direction: column; padding: 0 20px;}
.chose-clinic a {border-radius: 8px; border: 1px solid #E7E8EB; height: 70px; display: flex; align-items: center; justify-content: space-between; margin-bottom:10px; padding:10px; background:#FBFCFD; }
.chose-clinic a i { width:120px;}
.chose-clinic a i img{ width:50px; max-height:42px; margin-left: 10px}
.chose-clinic a span{ width:calc(100% - 120px); color:#2A2D30; font-size:14px;  font-family: 'montserratsemibold'; line-height:18px;}
.clinic-logo { margin-bottom:20px;}
.clinic-logo img { max-width:100px; max-height:100px }
.clinic-logo i img { max-width:80px; max-height:42px }
.chose-treatment {display: flex; flex-direction: column; width: 100%;}
.chose-treatment .form-group label { font-size: 14px; color: #2A2D30; margin-bottom: 5px;}
.chose-treatment .form-group .select2-container--default .select2-selection--single .select2-selection__rendered { color: #222222; line-height: 46px; padding: 0 50px 0 15px; font-size:14px;}
.chose-treatment .form-group .select2-container--default .select2-selection--single { background-color: transparent; border:1px solid #d4d4e7;  border-radius: 8px;}
.chose-treatment .form-group .select2-container--default .select2-selection--single .select2-selection__arrow { height: 40px; position: absolute; top: 1px; right: 1px; width: 50px;}
.chose-treatment .form-group .select2-container--default .select2-selection--single .select2-selection__arrow b {border: solid #222222; border-width: 2px 2px 0px 0; display: inline-block;    padding: 3px; transform: rotate(135deg); -webkit-transform: rotate(135deg); opacity:1; transition: padding 0.3s ease 0s;}
.chose-treatment .form-group .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {border: solid #222222; border-width: 2px 2px 0px 0; display: inline-block;    padding: 3px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); opacity: 1; margin-top:5px; transition: padding 0.3s ease 0s;}
.my_booking_flow .modal-footer { display:flex; flex-direction: column; margin-top: 15px;}
.my_booking_flow .modal-footer .cmn-btn { width:200px; margin:0 0 15px 0;}
.my_booking_flow .modal-footer .back-btn{ color: #354A5E;  font-size: 11px; text-transform: uppercase; font-family: 'montserratbold' !important; border-bottom: 2px solid #f4f4f4; padding-bottom: 3px;}
.my_booking_flow .modal-footer .back-btn:hover {color: #F8AF44;}
.my_booking_flow .chose-time {display: flex; flex-direction: column; width: 100%; align-items: center; justify-content: center; margin-bottom: -25px;}
.my_booking_flow .chose-time h2{display: flex; align-items: center; justify-content: space-between; width: 100%; font-size: 14px; margin-bottom: 30px; text-align:center; line-height:18px;  font-family: 'montserratsemibold';}
.my_booking_flow .chose-time h2 span{font-size: 24px; width: 32px;  height: 32px; display: flex; align-items: center; justify-content: center; background: #fafbfc;    border-radius: 100%;  color: #2A2D30; cursor:pointer;}
.my_booking_flow .chose-time h2 span:hover{ background: #eaecee; color: #2A2D30;}

.booking_flow .chose-time {display: flex; flex-direction: column; width: 100%; align-items: center; justify-content: center; margin-bottom: -25px;}
.booking_flow .chose-time h2{display: flex; align-items: center; justify-content: space-between; width: 100%; font-size: 14px; margin-bottom: 30px; text-align:center; line-height:18px;  font-family: 'montserratsemibold';}
.booking_flow .chose-time h2 span{font-size: 24px; width: 32px;  height: 32px; display: flex; align-items: center; justify-content: center; background: #fafbfc;    border-radius: 100%;  color: #2A2D30; cursor:pointer;}
.booking_flow .chose-time h2 span:hover{ background: #eaecee; color: #2A2D30;}

.my_booking_flow .app-det {display: flex; flex-direction: column; width: 100%; align-items: center; justify-content: center; margin:30px 0 20px;}
.my_booking_flow .app-det p{ font-size:13px; margin:0; color:#2A2D30; line-height:16px;}
.my_booking_flow .app-det h4{ font-size:18px; margin:10px 0 7px; color:#2A2D30; line-height:23px; font-family: 'montserratmedium' !important;; text-align: center;}
.my_booking_flow .app-det span{ font-size:13px; margin:0; color:#2A2D30; line-height:16px; text-align: center;}
.my_booking_flow .time-cnt { display: inline-block; width: 100%; margin-top:30px;}
.my_booking_flow .time-cnt p { text-align: center }
.my_booking_flow .time-cnt span{border: 1px solid #D4D4E7;border-radius: 8px; width:64px; height:40px;display: inline-block; text-align:center; line-height:40px; font-size:14px; color:#2A2D30; margin-right: 9px; margin-bottom: 9px;  font-family: 'montserratmedium'; cursor:pointer;}
.my_booking_flow .time-cnt span:nth-child(4n+0){ margin-right:0;}
.my_booking_flow .time-cnt span:hover, .my_booking_flow .time-cnt span.active { border-color:#444759;}

.booking_flow .app-det {display: flex; flex-direction: column; width: 100%; align-items: center; justify-content: center; margin:30px 0 20px;}
.booking_flow .app-det p{ font-size:13px; margin:0; color:#2A2D30; line-height:16px;}
.booking_flow .app-det h4{ font-size:18px; margin:10px 0 7px; color:#2A2D30; line-height:23px; font-family: 'montserratbold'; text-align: center;}
.booking_flow .app-det span{ font-size:13px; margin:0; color:#2A2D30; line-height:16px; text-align: center;}
.booking_flow .time-cnt { display: inline-block; width: 100%; margin-top:30px;}
.booking_flow .time-cnt p { text-align: center }
.booking_flow .time-cnt span{border: 1px solid #D4D4E7;border-radius: 8px; width:64px; height:40px;display: inline-block; text-align:center; line-height:40px; font-size:14px; color:#2A2D30; margin-right: 9px; margin-bottom: 9px;  font-family: 'montserratmedium'; cursor:pointer;}
.booking_flow .time-cnt span:nth-child(4n+0){ margin-right:0;}
.booking_flow .time-cnt span:hover, .my_booking_flow .time-cnt span.active { border-color:#444759;}

#book_flow_2 .modal-dialog{ max-width:600px;}
#book_flow_2 .chose-clinic { display: flex; flex-direction: column; width: 100%; padding: 0 50px;}
.browse-treatment { width:100%; display:flex; padding: 10px 40px 20px; border: 1px solid #D6D9DD; border-radius: 4px; max-height:400px;}
.browse-treatment .accordion { width:100%; padding-right: 25px}
.browse-treatment .accordion-group { background: #FBFCFD; border: 1px solid #E7E8EB; border-radius: 8px; padding: 15px 20px; margin-bottom:10px;}
.browse-treatment .accordion-group .accordion-heading a { font-size:14px; color:#2A2D30; padding-right: 30px; display: flex; align-items: flex-start;    flex-direction: column; font-family: 'montserratsemibold'; position:relative;}
.browse-treatment .accordion-group .accordion-heading a span{ font-family: 'montserratregular'; font-size:13px;}
.arw {border: solid #222222; border-width: 1px 1px 0px 0; display: inline-block; padding: 3px; transform: rotate(135deg); -webkit-transform: rotate(135deg);opacity: 1; transition: padding 0.3s ease 0s;}
.browse-treatment .accordion-group .accordion-heading a .arw { position:absolute; right: 10px; top: 5px;}
.browse-treatment .accordion-inner { padding-top:20px;}
.browse-treatment .accordion-inner h6 { font-size:14px; color:#2A2D30; margin:0; margin-bottom: 20px;}
.browse-treatment .accordion-inner p { font-size:13px; color:#2A2D30; margin:0 0 15px;}
.browse-treatment .accordion-inner .cmn-btn {border-radius: 23px; width:161px; height:46px; font-size: 14px; margin: 25px 0 5px;}
.tret-heading { font-size:18px;  color:#2A2D30;  font-family: 'montserratbold'; margin: 20px 0;}
.schdule-body h1{font-size:24px; margin:10px 0 15px; color:#2A2D30; line-height:24px; font-family: 'montserratbold';}
.my_booking_flow .schdule-body .popup-title { margin-bottom: 15px; font-size: 18px;}
.my_booking_flow .schdule-body p { font-size:14px; color:#2A2D30; padding:0 70px; line-height:17px; text-align: center;}
.my_booking_flow .schdule-body .browse-treatment { padding:20px 40px; flex-direction: column;}

.my_booking_flow .schdule-body .sch-blk {display: flex; flex-direction: column; align-items: flex-start; width:100%; margin-bottom:30px; padding-right: 30px}
.my_booking_flow .schdule-body .sch-blk h2{ font-size:14px; color:#2A2D30; font-family: 'montserratsemibold'; margin:0; margin-bottom: 10px}
.my_booking_flow .schdule-body .sch-blk p{ font-size:13px; color:#2A2D30;  font-family: 'montserratregular'; text-align:left; padding:0; margin:8px 0;}
.my_booking_flow .schdule-body .sch-blk span{ width:100%; position:relative;}
.my_booking_flow .schdule-body .sch-blk span input { width:100%; background: #FBFCFD; border: 1px solid #E7E8EB; border-radius: 8px; font-size: 14px;    padding: 0 50px 0 15px; height: 46px; font-family: 'montserratmedium';}
.my_booking_flow .schdule-body .sch-blk span .cal-ic{ position:absolute; right:15px; top:10px;}

.my_booking_flow .modal-body.time-body { padding: 0 135px;}
#book_flow_2 .chose-time h2 { width:300px;}
.mCustomScrollBox { width:100%;}
.mCSB_scrollTools .mCSB_draggerRail { background-color:transparent;}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width:6px; background-color: #BABEC3 !important;}
/* My booking flow popup css */

/* Date picker css */
.toggle-date-picker { display: none; }
.toggle-date-picker-booking { display: none; }
.react-datepicker__day { font-family: 'fontin_sansregular'; }
.react-datepicker__day.disabled-date { pointer-events: none; }
.react-datepicker__day.active-date { border-radius: 100% !important; background-color: #354a5e !important; color: #fff !important; }
.react-datepicker{ border:0 !important; }
.my_booking_flow .chose-time .react-datepicker-popper { position: static !important; transform: none !important;}
.my_booking_flow .chose-time .react-datepicker-popper .react-datepicker { border:none;}
.react-datepicker__day--keyboard-selected, .react-datepicker__month-text--keyboard-selected, .react-datepicker__quarter-text--keyboard-selected, .react-datepicker__year-text--keyboard-selected {
    background-color: #fff !important;    color: #000 !important;}
.react-datepicker__header {    background-color: #fff !important;     border-bottom: 1px dotted #ddd !important;} 
.my_booking_flow .chose-time .react-datepicker__current-month { margin-bottom:20px; font-family: 'fontin_sansregular'}   
.my_booking_flow .chose-time .react-datepicker-popper[data-placement^="bottom"] .react-datepicker__triangle {
    top: 0;
    margin-top: -8px;
    display: none;
}
.my_booking_flow .react-datepicker__triangle { display: none }
.browse-treatment.mCustomScrollbar h2 {
    font-family: 'fontin_sansregular';
    margin-top: 25px;
    justify-content: center;
}
/* collapse calss */

[data-toggle="collapse"].collapsed .if-not-collapsed {
    display: none;
  }
[data-toggle="collapse"]:not(.collapsed) .if-collapsed {
    display: none;
}

.booking-select.css-2b097c-container {
    width: 445px !important;
    margin-left: 1px !important;
    margin-bottom: 20px !important;
}

.booking-select span { display: none; }

.booking-select .css-2613qy-menu { height: 100px !important }


.css-1pahdxg-control{
    border: none !important;
}

.custom-input-border {
    border: 1px solid #6D7C8B !important; 
}

/* Payment flow popup */
.my_booking_flow .modal-body.payment-body .popup-title { margin-bottom: 25px; margin-top: 10px;}
.modal-body.payment-body { padding:0 50px;}
.modal-body.payment-body p{ margin-bottom:0; font-family: 'montserratsemibold'; font-size:14px;}
.modal-body.payment-body h6{ margin-bottom:25px;  font-family: 'montserratbold'; font-size:20px;}
.chose-clinic.payment-options { padding:0 !important; width: 100%; display:flex}
.chose-clinic.payment-options a { border: 2px solid #E7E8EB; padding: 10px 30px; font-family: 'montserratbold'; font-size: 18px; color:#2A2D30;}
.chose-clinic.payment-options a strong { display: flex; flex-direction: column; align-items: flex-end;}
.chose-clinic.payment-options a.part-pay strong { line-height:16px; margin-top:3px;}
.chose-clinic.payment-options a.part-pay strong small{color:#2A2D30; font-family: 'montserratsemibold';}
.chose-clinic.payment-options a.active { border-color:#2A2D30;}
.chose-clinic.payment-options .part-pay .active { border-color:#2A2D30;}
.form-group.amt-group .pound-ic{ position:absolute; left: 10px; top: 34px;}
.form-group.amt-group { margin-top:20px; width:100%;}
.form-group.amt-group label{font-size: 14px; color: #2A2D30; margin-bottom: 5px;}
.form-group.amt-group .form-control{height: 46px; border-radius: 8px; background: #FBFCFD; border: 1px solid #E7E8EB; padding: 0 20px; color: #2A2D30;    font-size: 14px; padding-left:40px;}
.card-payment{ width:100%;}
.card-payment .app-cnt { display: flex; justify-content: flex-start; width: 100%; align-items: center; border-bottom: 2px dotted #ddd; border: 2px solid #ddd;border-radius: 8px; padding: 20px; margin-bottom: 10px;}
.card-payment .app-cnt .card-ic { width:85px;}
.clinics-card-logo img { max-width: 50px; }
.card-payment .app-cnt h2 { width:calc(100% - 85px);}
/* .card-payment .app-cnt h4 { display: grid;} */
.payment-heading{color:#2A2D30; font-family: 'montserratsemibold'; font-size:18px; margin:15px 0;}
.card-payment.payment-proc .app-cnt.cli-pay{ padding: 10px 0 20px; border: none; border-bottom: 2px dotted #ddd; margin-top:10px; margin-bottom: 30px; border-radius: 0;}
.card-payment.payment-proc .app-cnt.cli-pay h2{ margin-left: 0; font-size: 18px; line-height: 22px; display: grid;}
.card-payment.payment-proc .app-cnt.cli-pay h2 span{color: #2A2D30;  font-family: 'montserratmedium'; }
.card-payment.payment-proc .app-cnt.cli-pay h4 { display: grid; }
.card-payment.payment-proc .app-cnt.cli-pay h4 span{ font-family: 'montserratmedium'; font-size: 10px; color: #fff; background: #999; padding: 4px 8px;    border-radius: 5px; margin-top: 3px;}
.card-payment .app-cnt.cards-cnt{ border: 2px solid #2A2D30; margin-bottom:30px; position:relative;}
.card-payment .app-cnt.cards-cnt:after {    border: solid #2A2D30; border-width: 2px 2px 0px 0; display: inline-block; padding: 6px; transform: rotate(135deg);
-webkit-transform: rotate(135deg); opacity:1; transition: padding 0.3s ease 0s; position:absolute; left:0; right:0; bottom:-9px; content:""; width: 10px;    margin: 0 auto; background: #fff;}
.my_booking_flow .chckbox label em {color: #2A2D30;  font-family: 'montserratmedium';}
.my_booking_flow .chckbox input[type=checkbox]:not(old) + label > span { background: transparent; border: 1px solid #f2f3f5;}
.my_booking_flow .chckbox input[type=checkbox]:not(old):checked + label > span, input[type=radio ]:not(old):checked + label > span { background: transparent; border: 1px solid #f2f3f5;}
.my_booking_flow .chckbox input[type=checkbox]:not(old):checked + label > span:before { background:url(../images/tick-blue.png) no-repeat; background-position: -2px -2px;}
.my_booking_flow .help-ic { position: absolute; top: 32px; right: 60px }
.card-payment.payment-proc .cmn-form .form-group.card-group .form-control { background: url(../images/add-card-bg.png) no-repeat 320px 10px;}
.modal-body.thank-body  { padding:0 25px; font-family: 'fontin_sansregular' !important; }
.modal-body.thank-body .popup-title{ margin-bottom: 0; font-size: 24px;}
.modal-body.thank-body p.txt{text-align: center; font-size: 14px; margin: 15px 0 0px; font-family: 'fontin_sansregular' !important;; line-height: 16px;}
.modal-footer.thank-footer {flex-direction: column; padding:0 25px;}
.modal-footer.thank-footer .cmn-btn.edit-btn { background: transparent; font-size: 14px; height: 46px; border-radius: 26px; margin-right: 10px;}
.modal-footer.thank-footer .cmn-btn.edit-btn:hover { background:#2A2D30; color:#fff;}
.thank-body .order-details {  display: flex; width: 100%;  flex-direction: column; margin:25px 0 10px;}
.thank-body .order-details .ord-cnt {display: flex; width: 100%;}
.thank-body .order-details .ord-cnt h4{ font-size:14px; color:#7E8387; width:200px; margin:0 10px 5px 0;  font-family: 'fontin_sansregular' !important;}
.thank-body .order-details .ord-cnt span{ font-size:14px; color:#2A2D30; width:calc(100% - 210px); margin:0;  font-family: 'fontin_sansregular' !important; }
.thank-body .pay-sum { padding: 15px 0; border-top: 2px dotted #ddd; display: flex; flex-direction: column; width: 100%;}
.thank-body .pay-sum h2{ font-size: 18px; color: #2A2D30; font-family: 'fontin_sansregular' !important; margin:0 0 15px 0;}
.thank-body .pay-sum .pay-cnt { display: flex; align-items: center; justify-content: space-between;}
.thank-body .pay-sum .pay-cnt h4{ font-size: 14px; color: #2A2D30; font-family: 'fontin_sansregular' !important; display: flex; flex-direction: column; margin: 0;}
.thank-body .pay-sum .pay-cnt h4 span{font-family: 'fontin_sansregular' !important; font-size: 13px; margin-top: 5px;}
.thank-body .pay-sum .pay-cnt strong{font-size: 16px; color: #2A2D30;  font-family: 'fontin_sansregular' !important;}
.thank-body .pay-sum .bill-cnt { display:flex; flex-direction: column; margin-bottom:20px;}
.thank-body .pay-sum .bill-cnt h4{ font-size:14px; color:#7E8387; font-family: 'fontin_sansregular' !important;  margin: 0 0 5px 0;}
.thank-body .pay-sum .bill-cnt h6{ font-size:14px; color:#2A2D30;  font-family: 'fontin_sansregular' !important; margin:0}
.thank-body .pay-sum .bill-cnt .app-cnt { padding: 0; border: none; justify-content: flex-start;  align-items: flex-start; margin-top: 10px;}
.thank-body .pay-sum .bill-cnt .app-cnt h2{width: auto; font-size: 14px; margin: 0 0 0 20px;}
.thank-body .pay-sum .add-clinic-cnt { align-items: flex-start;}
.thank-body .pay-sum .add-clinic-cnt i { width: 120px; height: 50px;}
.thank-body .pay-sum .add-clinic-cnt .app-cnt { padding:15px 0; font-family: 'fontin_sansregular' !important;}
.thank-body .pay-sum .add-clinic-cnt .app-cnt h2 { margin-bottom:0; font-size:14px; line-height:20px; font-family: 'fontin_sansregular' !important;}
.thank-body .pay-sum .add-clinic-cnt .app-cnt h2 span { font-family: 'montserratmedium'; color:#2A2D30; font-family: 'fontin_sansregular' !important; }
.thank-body .pay-sum .add-clinic-cnt .app-cnt h4 { margin:0; align-items: flex-end;   font-size: 16px; font-family: 'fontin_sansregular' !important;}
.thank-body .pay-sum .add-clinic-cnt .app-cnt.bal-cnt { border:none; font-family: 'fontin_sansregular' !important;}
.thank-body .pay-sum .add-clinic-cnt .app-cnt.bal-cnt h4{ width:100%; align-items: center; font-size: 24px; font-family: 'fontin_sansregular' !important;}
.thank-body .pay-sum .add-clinic-cnt .app-cnt.bal-cnt h4 span{ font-size:14px; font-family: 'fontin_sansregular' !important; margin-bottom:5px;}
/* .bill-pay-inner { height:500px; padding: 0 20px} */


#book_flow_2 .modal-body.thank-body { padding: 0 75px;}
.part-content .modal-body.payment-body { padding:0;}
.my_booking_flow .part-content .modal-body.payment-body .popup-title { text-align:center; font-size:16px;}
.my_booking_flow .part-content .chose-clinic.payment-options { width:100%;}
.my_booking_flow .part-content .chose-clinic.payment-options a {  padding: 10px 10px; font-family: 'fontin_sansregular' !important;; font-size: 14px; color: #2A2D30; height: 60px;}
.my_booking_flow .part-content .form-row .form-group { width:100%;}
.my_booking_flow .part-content .modal-body.thank-body { padding: 0;}
.my_booking_flow .part-content .modal-body.thank-body .popup-title { margin-bottom: 0; font-size: 18px; text-align: center;}
.my_booking_flow .part-content .modal-body.thank-body p.txt { font-size:13px;}
.my_booking_flow .part-content .modal-body.thank-body p.txt br{ display:none;}
.my_booking_flow .part-content .modal-footer.thank-footer { flex-direction: column; padding: 0 25px;}
.my_booking_flow .part-content .modal-footer.thank-footer .chckbox { margin-top:0;}
.my_booking_flow .part-content .thank-body .order-details .ord-cnt h4 { width:110px;}
.my_booking_flow .part-content .thank-body .order-details .ord-cnt span { width:calc(100% - 110px);}
.my_booking_flow .part-content .thank-body .pay-sum .add-clinic-cnt .app-cnt.bal-cnt{ padding:0;}
.app-blk.order-summ h4 { width: 100%;  justify-content: space-between; align-items: center; flex-direction: row; text-align: inherit; font-size: 14px; margin:0;}
.my_booking_flow .part-content .thank-body .pay-sum .add-clinic-cnt.order-summ .app-cnt { border: none; flex-direction: column; align-items: flex-start; width: 100%; padding:10px 0 0;}
.my_booking_flow .part-content .thank-body .pay-sum .add-clinic-cnt.order-summ .app-cnt h4{ font-size:14px; font-family: 'fontin_sansregular' !important;}
.cmn-btn.add-btn {width: 170px; height: 46px; border-radius: 26px; font-size: 14px; margin-top:10px; color: #fff !important}
.app-blk.order-summ .add-cal h4{ margin:10px 0;}
.app-blk.order-summ .add-cal { margin-top:10px;}
.my_booking_flow .part-content .bill-pay-inner { height:400px;}
#book_flow_2 .time-cnt { padding:0;}


/* payment page css */
.payment-page { width:100%; display:flex;}
/*.payment-page .cmn-sec { width:calc(100% - 526px); display:flex; padding:35px 70px 35px 20px;}
.payment-page .tab-content { width:526px; background:#F8F9FB;  border-left: 1px solid #E7E8EB;}
.payment-page .nav-tabs .nav-item.show .nav-link, .payment-page .nav-tabs .nav-link.active, .payment-page .nav-tabs .nav-link { border:none; padding:0;}
.payment-page .nav-tabs { border:none;}*/
.payment-page .cmn-sec { width:100%; display:flex; padding:35px 70px 35px 20px;}
.app-cnt span.download { display: flex; margin-left: 20px; align-items: flex-end; width: auto; cursor:pointer;}
.app-cnt h1.date{ width: 48px; height: 48px; font-size: 11px; display: flex; flex-direction: column; margin: 0; font-family: 'montserratbold'; line-height: 18px; align-items: center; justify-content: center; border: 1px solid #EAECEE; border-radius: 8px; text-align: center; text-transform: uppercase; color:#2A2D30;}
.app-cnt h1.date span{font-size: 18px;}
.payment-page .app-cnt { position:relative;}
.payment-page .active .app-cnt h1.date{ background:#2A2D30; color:#ffffff; border-color:#2A2D30;}
.payment-page .active .app-cnt:after{width: 47px; height: 47px; transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0); background: #F8F9FB; display:inline-block; position:absolute; right:-94px; top:15px; content:""; border: 1px solid #E7E8EB; border-width: 0 0px 1px 1px;}
.payment-page .app-cnt .cmn-btn{font-size: 12px; width: 110px; height: 36px;}
/* payment Details popup page */
.payment_details .modal-dialog { max-width: 550px;}
.payment_details .modal-content { background:#f8f9fb}
.payment-inr-det{ display: flex; width: 100%;}
.payment-inr-det .add-clinic-cnt { display: flex; align-items: flex-start; justify-content: flex-start; flex-direction: column; width: 100%;}
.payment-inr-det .add-clinic-cnt h4 { justify-content: space-between; flex-direction: row; width: 100%; border-bottom: 2px dotted #ddd; padding-bottom: 20px;
    margin-bottom: 0;}
.payment-inr-det .app-cnt em.logo-ic { width: 85px;}
.payment-inr-det .app-cnt h1.date { border:none;}
.payment-inr-det .add-clinic-cnt .app-cnt{ padding:5px 0;}
.payment-inr-det .add-clinic-cnt .app-cnt h2 { width:350px; line-height:18px;}
.payment-inr-det .add-clinic-cnt .app-cnt h4{ font-family: 'montserratsemibold'; justify-content: flex-end; border:none; padding:0; margin:0; width:auto;}
.payment-inr-det .add-clinic-cnt .app-cnt.bal-cnt {justify-content: flex-end; border:none; padding-top: 15px;}
.payment-inr-det .add-clinic-cnt .app-cnt.bal-cnt h4 {  flex-direction: column; align-items: flex-end; font-family: 'montserratbold'; font-size: 24px;    line-height: 20px;}
.payment-inr-det .add-clinic-cnt .app-cnt.bal-cnt h4 span{ font-size: 12px;font-family: 'montserratmedium';}
.payment-inr-det .btn-row {display: flex; align-items: center; justify-content: center;  width: 100%; margin:20px 0 10px;}
.payment-inr-det .btn-row .download-btn { border: 1px solid #E7E8EB; background: transparent; color: #354A5E;  font-family: 'montserratsemibold'; font-size: 14px;}
.payment-inr-det .btn-row .download-btn img{ margin-right:10px;}
.payment-inr-det .btn-row .download-btn:hover, .payment-inr-det .btn-row .download-btn:focus{ background:#FFBC5B; border-color:#FFBC5B;}
.payment-inr-det .btn-row .cmn-btn{ margin:0 5px; width: 200px;}

/* payment Details popup page */
/* payment page css */

.curosor-pointer {
    cursor: pointer;
}

/* Payment Form */

#card-errors { color: red !important }
#expdate-errors { color: red !important }
#cvv-errors { color: red !important }
#logo-container { display: none !important; }
#card-errors-book { color: red !important }
#expdate-errors-book { color: red !important }
#cvv-errors-book { color: red !important }
#logo-container-book { display: none !important; }
.card-action{ display: flex;}
.app-cnt.cliniccard-detail{align-items: flex-start; padding-bottom: 0; border-bottom: none;}
.clinic-cnt .cliniccard-detail h2{ margin: 0; border-bottom: none;}
.clinic-cnt .card-action .cmn-btn{margin: 0;}
.card-action .delete-btn{ margin-top: 4px; margin-left: 10px;}
.book-edit-btn{display: flex; align-items: center; justify-content: space-between;}
.cliniccard-detail-wrapper{display: table; width: 100%;}
.cliniccard-detail-wrapper .app-lt{ margin-right: 15px;}



#book_flow_2 .modal-body.thank-body { padding: 0 75px;}
.part-content .modal-body.payment-body { padding:0;}
.my_booking_flow .part-content .modal-body.payment-body .popup-title { text-align:center; font-size:16px;}
.my_booking_flow .part-content .chose-clinic.payment-options { width:100%;}
.my_booking_flow .part-content .chose-clinic.payment-options a {  padding: 10px 10px; font-family: 'montserratbold'; font-size: 14px; color: #2A2D30; height: 60px;}
.my_booking_flow .part-content .form-row .form-group { width:100%;}
.my_booking_flow .part-content .modal-body.thank-body { padding: 0;}
.my_booking_flow .part-content .modal-body.thank-body .popup-title { margin-bottom: 0; font-size: 18px; text-align: center;}
.my_booking_flow .part-content .modal-body.thank-body p.txt { font-size:13px;}
.my_booking_flow .part-content .modal-body.thank-body p.txt br{ display:none;}
.my_booking_flow .part-content .modal-footer.thank-footer { flex-direction: column; padding: 0 25px;}
.my_booking_flow .part-content .modal-footer.thank-footer .chckbox { margin-top:0;}
.my_booking_flow .part-content .thank-body .order-details .ord-cnt h4 { width:110px;}
.my_booking_flow .part-content .thank-body .order-details .ord-cnt span { width:calc(100% - 110px);}
.my_booking_flow .part-content .thank-body .pay-sum .add-clinic-cnt .app-cnt.bal-cnt{ padding:0;}
.app-blk.order-summ h4 { width: 100%;  justify-content: space-between; align-items: center; flex-direction: row; text-align: inherit; font-size: 14px; margin:0;}
.my_booking_flow .part-content .thank-body .pay-sum .add-clinic-cnt.order-summ .app-cnt { border: none; flex-direction: column; align-items: flex-start; width: 100%; padding:10px 0 0;}
.my_booking_flow .part-content .thank-body .pay-sum .add-clinic-cnt.order-summ .app-cnt h4{ font-size:14px; font-family: 'montserratmedium';}
.cmn-btn.add-btn {width: 170px; height: 46px; border-radius: 26px; font-size: 14px; margin-top:10px; color: #fff !important}
.app-blk.order-summ .add-cal h4{ margin:10px 0;}
.app-blk.order-summ .add-cal { margin-top:10px;}
.my_booking_flow .part-content .bill-pay-inner { height:400px;}
#book_flow_2 .time-cnt { padding:0;}
.text-reminder-modal.my_booking_flow .popup-title{ margin-bottom: 15px;}
.text-reminder-modal.my_booking_flow { text-align: center; }
.text-reminder-modal .modal-body input{ text-align: center; margin-bottom: 20px; font-family: 'montserratbold';}
.text-reminder-modal .modal-footer .cmn-btn{ width: auto; padding: 10px 30px; }
.text-reminder-modal.my_booking_flow button.close{ right: -20px; top: -90px;}

.loader.my_booking_flow .modal-content { width: 150px; height: 150px; margin-left: calc(50% - 100px); border: none; background-color: transparent; }
.loader.my_booking_flow i img { width: 100px; margin-bottom: 20px  }

.payment-form-responcive { padding: 30px; }
.cmn-btn.edit-btn.custom-button { border-radius: 10px !important; }
.modal-content .popup-title{ font-size: 24px; color: #2A2D30; font-family: 'fontin_sansbold'; text-align: center; padding: 5px;}

#choose_appointment_card .modal-body{  text-align: center; margin: 0 auto; width: 100%; display: flex; flex-direction: column; align-items: center;    justify-content: center;}
#choose_appointment_card button.close{padding: 0;  background-color: transparent; border: 0; -webkit-appearance: none; width: 34px; height: 34px; background: #c6c8cb; border-radius: 100%; opacity: 1; position: absolute; right: -30px; top: -28px; text-shadow: none; font-weight: normal;}

#card_not_approved .modal-body{  text-align: center; margin: 0 auto; width: 100%; display: flex; flex-direction: column; align-items: center;    justify-content: center;}
#card_not_approved button.close{padding: 0;  background-color: transparent; border: 0; -webkit-appearance: none; width: 34px; height: 34px; background: #c6c8cb; border-radius: 100%; opacity: 1; position: absolute; right: -30px; top: -28px; text-shadow: none; font-weight: normal;}

.form-group.btn-group.chose-type-group .type-btn { margin-top:150px !important;}
.form-group.btn-group.chose-type-group .my_booking_flow .modal-body{display: flex; flex-direction: column; align-items: center;}
.error-msg {color: #f00; margin-top: 5px;}
.after-login .navbar-brand	{display: flex; align-items: center; justify-content: center; width: 100%;}

.save-card-number.curosor-pointer.active { border: solid 1px; }

/* Custom DOB */
.cstm-dob-btn{ height: 46px; border-radius: 8px; border: 1px solid #D4D4E7; background: #fff; padding: 0 15px; font-size: 16px; width: 100%; text-align: left;}
.cstm-dob-btn:focus{box-shadow: none;}
.error-wrapper .cstm-dob-btn{border-color: #fe0000 !important;}
a.cmn-btn.clinic-redirect { color: #fff !important; background: #54595F !important;}


/* Added on 06-10-2020 */
.card-payment.payment-proc .app-cnt h2 { font-size:16px;}
.my_booking_flow .my-book-pay-frm .card-payment.payment-proc .help-ic { position: absolute; top: 35px; right: 0px;}
.form-error { color:#f00;}

.cursor-pointer { cursor: pointer; }

/*Footer Css*/
.main-container{padding-bottom:180px;}
footer{padding: 40px 0;
    text-align: center;
    border-top: 1px solid #D4D4E7;
    position: absolute;
    bottom: 0;
    width: 100%;
    z-index: 1;
    background: #fff;}
footer img {width: 180px;}
footer p{color: #858585; text-indent: 60px; font-size:11px;  margin-bottom: 0;}
/*Footer Css End*/

.scroll-bar  > div:nth-child(2) { display: none; }
.scroll-bar-terms  > div:nth-child(1) { padding: 0 30px; };