
@font-face {
    font-family: 'khodijah_freeregular';
    src: url('../../../assets/home/fonts/khodijah_free-webfont.woff2') format('woff2'),
         url('../../../assets/home/fonts/khodijah_free-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'interregular';
    src: url('../../../assets/home/fonts/inter-regular-webfont.woff2') format('woff2'),
         url('../../../assets/home/fonts/inter-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'intermedium';
    src: url('../../../assets/home/fonts/inter-medium-webfont.woff2') format('woff2'),
         url('../../../assets/home/fonts/inter-medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'intersemi_bold';
    src: url('../../../assets/home/fonts/inter-semibold-webfont.woff2') format('woff2'),
         url('../../../assets/home/fonts/inter-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'playfair_displayitalic';
    src: url('../../../assets/home/fonts/playfairdisplay-italic-webfont.woff2') format('woff2'),
         url('../../../assets/home/fonts/playfairdisplay-italic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'playfair_display_scBdIt';
    src: url('../../../assets/home/fonts/playfairdisplaysc-bolditalic-webfont.woff2') format('woff2'),
         url('../../../assets/home/fonts/playfairdisplaysc-bolditalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

html, body{width: 100%;height: 100%;}

body {
    margin: 0px;
    padding: 0px;
    font-family: "interregular" !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
}

a,
a:hover,
a:focus,
a:active {
    text-decoration: none !important;
    outline: none !important;
    color: #dcaf26;
}

:root{
    --white:#fff;
    --smoke-white:#f1f3f5;
    --muster:#dcaf26;
    --dark-muster:#d19f07;
}

button{outline: none;background: none;border: none;}

.p-t-10 {padding-top: 10px;}
.p-l-30 {padding-left:30px !important;}
.ph-l-64 {padding-left:64px !important;}
.p-lr-0 {padding-left: 0;padding-right: 0;}
.ts-p-r-0{padding-right: 0;}
.ts-p-l-0{padding-left: 0;}

.bookdemo_wrapper{
    max-width: 1465px;
    width: 100%;
    margin: 0 auto;
    padding-left: 15px;
    padding-right: 15px;
    position: relative;
}

.bookdemo-banner{background: url(../../../assets/home/img/exim-banner.webp) no-repeat;position: relative; margin: 0px auto;width: 100%;height: 100%; max-width: 100%; background-size: cover; background-position: center center;display: inline-table;}

.bookdemo-banner:before {
    content: '';
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    background: rgb(255 255 255 / 84%);
    z-index: 0;
}

.bookdemo_box{
    margin:auto;
    display: block;
    background: #fff;
    max-width: 700px;
    box-shadow:0 0 14px #a7a7a7;
    border-radius: 4px;
    position: relative;
    top:-85px;
    left: 0;
    right: 0;
}

.bookdemo_img img{border-radius: 4px 4px 0 0;width: 100%;}

.tdb_logo a{display: inline-block;background: #000000;padding: 0px 12px 12px;border: 1px solid #262626;}

.bookdemo-form{padding: 55px;}

.bdemo_title{
	margin: 0 0 20px;
	position: relative;
    padding-left: 18px;
    font-size:24px;
    font-family: 'interregular';
    font-weight: 600;
    color: #000;
    margin-top: 0px;
}

.bdemo_title:before{content: ''; position: absolute; left: 0px; top:1px; width:16px; height:32px; background: url(../../../assets/home/img/ae-sprite.png) no-repeat; background-position: -3px -32px;}

.para_title{color: #747474;font-size: 14px;border-bottom: 1px solid #eee;padding-bottom: 8px;margin-bottom: 25px;}

.bdemo-datepicker{border: 1px solid #eee;border-radius: 4px;}

.bdemo_frm .form-control{
    padding: 9px 0;
    color: #666666;
    outline: none;
    margin: 0;
    border: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    width: 100%;
    font-size: 13px;
}

.bdemo_frm input:-internal-autofill-selected {background: transparent;}

.bdemo_frm .form-group {position: relative;margin-bottom: 30px;border-bottom: 2px solid #ccc;}

.bookdemo-btn{border: 0;font-size: 15px;border-radius: 3px;padding: 8px 15px;}
.submit-btn{background: #dcaf26;color: #fff;}
.submit-btn:focus, .submit-btn:hover {
    color: #fff;
    background:#cd9c09;
    outline: none !important;
    border: 0;
    box-shadow: none;
}

.back-btn{color: #000;background: #f5f5f5;margin-right: 5px;}
.back-btn:focus, .back-btn:hover{background: #eee;outline: none !important;box-shadow: none;}

.bdemo_frm .input-group-addon {
    position: absolute;
    left: 0px;
    z-index: 1;
    bottom: 0px;
    top: 0px;
    background-color: transparent;
    border: 0;
    color: #7b7b7b;
    line-height: 35px;
    width:55px;
    padding: 0px 5px;
    text-align: center;
    font-size: 13px;
}

.bdemo_frm .input-group-addon:after{
    content: '';
    position: absolute;
    top: 10px;
    right: 0px;
    width: 1px;
    height: 15px;
    background: #ddd;
}

.bdemo_floatlabel{
    position: absolute;
    pointer-events: none;
    left: 0px;
    top: -13px;
    font-size: 9px;
    background: transparent;
    padding: 0px 4px;
    border-radius: 2px;
    border: 1px solid #d4d4d4;
    line-height: 15px;
    letter-spacing: 0.05px;
    color: #717171;
}

.booking-slot-title {height: 18px;display: block;text-align: center;margin-bottom:5px;position: relative;}

.booking-slot-title-text {
    color: #cf9304;
    position: absolute;
    left: 50%;
    z-index: 1;
    transform: translateX(-50%);
    background-color: #fef8e8;
    padding:0px 5px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    font-size: 12px;
}

.booking-slot-title-border {position: absolute;width: 100%;left: 0;height: 1px;background-color: #dcaf26;top: 50%;}

.morning, .afternoon, .evening{position: relative;}
.morning, .afternoon{margin-bottom:10px;}

.date-select{padding: 5px 10px;}
.time-select{padding: 15px;background: #fef8e8;}

.timeslot-txt{
	background: transparent;
    box-shadow: none;
    height: 25px;
    padding: 3px 3px;
    border-radius: 3px;
    border: 1px solid #ddd;
    font-size: 12px;
    margin-bottom: 10px;
    text-align: center;
}

/*===time-picker===*/

.selector{position: relative;width: 100%;display: flex;align-items: center;border-radius: 0;}
.selector-item{
    position:relative;
    flex-basis:calc(70% / 2);
    height:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    margin-right: 6px;
}

.selector-item:last-child{margin-right: 0;}

.selector-item_radio{appearance:none;display:none;}

.selector-item_label{
    position: relative;
    height: 80%;
    width: 100%;
    text-align: center;
    border-radius: 4px;
    line-height: 18px;
    font-weight: 500;
    font-size: 12px;
    color: #000;
    transition-duration: .5s;
    transition-property: transform, box-shadow;
    transform: none;
    margin-bottom:6px;
    cursor: pointer;
    border: 1px solid #a5a4a2;
}
.selector-item_radio:checked + .selector-item_label{
    background-color: var(--muster);
    color: var(--white);
    border-color:var(--dark-muster);
}

.selector-item_label:hover{background-color: var(--muster);border-color:var(--dark-muster);}

.selector-item_label_disabled{
    position: relative;
    height: 80%;
    width: 100%;
    text-align: center;
    border-radius:4px;
    line-height: 18px;
    font-weight: 500;
    font-size: 12px;
    color: #a5a4a2;
    transition-duration: .5s;
    transition-property: transform, box-shadow;
    transform: none;
    margin-bottom: 6px;
    cursor: not-allowed;
    border: 1px solid #a5a4a2;
}

/*===End time-picker===*/


/*===otp-request styles===*/
.otp-rquest .form-control {
    height: 41px;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    font-size: 13px;
    color: #7B7B7B;
    padding: 9px 0;
    border: 0;
    border-bottom: 2px solid #ddd;
}

.otp-rquest .confirm-otp{
    border: 1px solid #dcaf26;
    background: #dcaf26;
    color: #000;
}

.otp-rquest .otp-btn{ color:#cf9b00;}

.otp-rquest .bdemo-otpbtn{
    height: 32px;
    line-height: 24px;
    padding: 4px 10px;
    font-size: 13px;
    line-height: 24px;
    outline: none !important;
    box-shadow: none !important;
    font-weight: 500;
}

.otp-rquest .text-success, .otp-rquest .text-danger {font-size: 13px;}
.otp-rquest .text-danger {color: #d41713;}

/*===End otp-request styles===*/

/*====Calender styles====*/

.date-select .datepicker-inline{width: 100%;padding: 0;}
.date-select .table-condensed{width: 100%;}
.date-select .datepicker table tr td.active, .date-select .datepicker table tr td.active.disabled, .date-select .datepicker table tr td.active.disabled:hover, .date-select .datepicker table tr td.active:hover{background-image: linear-gradient(to bottom, #dcaf26, #dcaf26);}

.date-select .datepicker .datepicker-switch {color: #cb9902;}

.date-select .datepicker .datepicker-switch:hover, .date-select .datepicker .next:hover, .date-select .datepicker .prev:hover, .date-select .datepicker tfoot tr th:hover{
     background:transparent;
}

.date-select .datepicker .datepicker-switch, .date-select .datepicker tfoot tr th {
    color: #cb9902;
    border-bottom: 1px solid #eee;
}

.date-select .datepicker .prev{text-align: left;}
.date-select .datepicker .next{text-align: right;}

.date-select .datepicker .next, .date-select .datepicker .prev{font-size: 18px;color: #cb9902;border-radius: 3px;border-bottom: 1px solid #eee;}

.date-select .datepicker table tr td span.active, .date-select .datepicker table tr td span.active.disabled, .date-select .datepicker table tr td span.active.disabled:hover, .date-select .datepicker table tr td span.active:hover{background-image: linear-gradient(to bottom, #dcaf26, #dcaf26);}

.date-select .datepicker td, .date-select .datepicker th{font-size: 15px;padding: 8px;}

.date-select .datepicker .prev.disabled, .date-select .datepicker .prev.disabled:hover {
    cursor: not-allowed;
    visibility: visible;
    opacity: 0.5; 
    pointer-events:none;
}

.date-select .datepicker table tr td.disabled, .date-select .datepicker table tr td.disabled:hover{color: #ccc;cursor: not-allowed;}

.date-select .datepicker table tr td.new{color: #ccc;}

/*====End Calender styles====*/


/*====Success styles====*/
.request_frm_msg{
    border: 1px solid #eee;
    padding: 20px;
    border-radius: 5px;
    text-align: center;
}

.suc_msg .payment-success {
    display: inline-block;
    background: #69b31d;
    border-radius: 50%;
    padding: 15px;
    width: 55px;
    height: 55px;
    margin-bottom: 15px;
}

.suc_msg i {color: #fff;font-size: 25px;}

.suc_msg h3 {margin: 5px 0 5px;line-height: 28px;font-size: 19px;color: #ad8710 !important;}

.suc_msg p{font-size: 15px;}

/*====End Success styles====*/


.req-alert-msg{
    padding: 0;
    margin-top: 0;
    margin-bottom: 10px;
    text-align: center;
}
.req-alert-msg p{margin-bottom: 0;}



@media(max-width: 767px){
	.bookdemo_box {max-width: 100%;top:8px;}
	.bookdemo-form {padding: 25px;}
	.bdemo_title{font-size: 19px;margin: 0 0 15px;line-height: 24px;}
	.bdemo_title:before {height: 22px;background-position: -3px -2px;}
	.tdb_logo img{width: 45px;}
	.bdemo_frm .form-group{margin-bottom: 20px;}
    .book_demosec {padding-bottom: 20px;}
}

@media(max-width:991px){
    .ts-p-r-0 {padding-right:15px;}
    .ts-p-l-0 {padding-left:15px;}
    .date-select .calendar .calendar-button-group {gap: 4px;}
    .para_title{margin-bottom: 10px;}
    .selector-item_label{line-height: 22px;}
    .time-select{border-top: 1px solid #eee;}
}

@media(min-width: 768px) and (max-width: 991px){
    .tdb_logo img{width: 55px;}
    .bookdemo_box{margin:auto 10px;top: 8px;max-width: 100%;}
    .bookdemo-form {padding: 45px;}
    .book_demosec {padding-bottom: 30px;}
}

@media(min-width: 992px) and (max-width:1024px){
	.tdb_logo img{width:65px;}
    .bookdemo_box{margin:auto;top: -58px;}
}

@media(min-width: 1025px) and (max-width:1500px){
	.tdb_logo img{width:75px;}
    .bookdemo_box{margin:auto;top: -67px;}
    .bookdemo_wrapper{max-width: 1250px;}
    .bookdemo-form {padding: 42px;}
    .para_title{margin-bottom: 20px;}
    .bdemo_title{margin: 0 0 18px;font-size: 22px;}
}



