@font-face {
    font-family: Montserrat;
    src: url(./../font/Montserrat-Regular.otf);
}
html{background: #8b959f;}
body{color: #000; font-family: Montserrat; background: #fbfbfb;/*background: #f4f4f4;*/
    max-width: 600px; margin: 0 auto;
}
.appHeader, .form-button-group{ max-width: 600px; margin: 0 auto;}
.accordion{color: #000; font-family: Montserrat; background: #fff;}
.accordion-body{background: rgba(244, 244, 244, 0.3);}
.verticalCenter{display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px;}
.verticalRight{display: flex; align-items: center; justify-content: right; margin-bottom: 8px;}
.fontbold{font-weight: bold;}
.fontSize10{font-size: 10px;}
.fontSize12{font-size: 12px;}
.fontSize13{font-size: 13px;}
.fontSize14{font-size: 14px;}
.fontSize18{font-size: 18px;}
.fontSize20{font-size: 20px;}
.fontSize25{font-size: 25px;}
.fontSize60{font-size: 60px;}
.floatRight{float: right;}
.margin0{margin: 0 ;}
.cardbg_lightgray { background:#f2f2f2; /*#f8f9fa;*/}
.cardbg_lightblue { background: rgba(199, 213, 228, 0.5)!important;}
.cardbg_white { background: #fff;}
.custHeader {padding: 5px 10px; border-radius: 10px; font-weight: bold; background: rgba(222, 227, 233,0.4);}
.boderTop{border-top: 1px solid #c7d5e4;}
.boderBottom{border-bottom: 1px solid #c7d5e4;}
.boderLeft{border-left: 1px solid #c7d5e4;}
.boderRight{border-right: 1px solid #c7d5e4;}
.bottomBar{background-color: darkgray; color: #fff;border-radius: 15px;padding: 5px}
.form-group.basic{background: #f2f2f2; padding: 8px 10px; border-radius: 10px;margin-bottom: 8px;}
.venueRegi .form-group.basic, .empRegi .form-group.basic{background: transparent;}
.form-group.boxed{background: #f2f2f2; padding: 8px 10px; border-radius: 5px;margin-bottom: 8px;}
.form-group.basic .form-control, .form-group.basic .custom-select{ padding: 0px 30px 0px 10px; border-radius: 5px; height: 35px; background: #ffffff; margin-top: 5px; }
.custom-radio .custom-control-label:before, .custom-checkbox .custom-control-label::before{border-color: #a236cf;}
.parmaryBg{background: #f2f2f2; border-radius: 10px; padding:5px 0 ; }
.accordion { border-bottom: none;}
#rsvStatus{display: flex; text-transform: uppercase; font-weight: bold;}

.card { border: none; border-bottom: 1px solid #c7d5e4; }

.tipPercent{padding: 4px 5px; border-radius: 50%; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;box-shadow: 0px 3px 8px #8b959f, inset 0px 2px 3px #fff;}

.Details ion-icon {font-size: 25px;}
ion-icon {font-size: 20px;}
.badge{position: absolute; right: 2px;}
.header.badge{position: absolute; left: 28px; right: unset;top: -14px}
.badgeIcon{font-size: 30px;}
.badgeBox{padding-left: 0;}
.chillipos{position: absolute; right: 0px;}
.chilliIcon{color: #eee;}
.chilliIcon:before{font-size: 19px!important;}
.chilliIconColor{color: #ff0000;}
tables-element, reservation-table-detail-element {width: 50%;display: inline-block;}
empty-tables-card, empty-tables-close-card {width: 49.5%;display: inline-block;}
.customerIcon{font-size: 50px;}
.durationIcon{font-size: 25px; padding-right: 5px;}
#grandTotal{padding-left: 20px; font-size: 15px;}
#btnMinus,#btnPlus{font-size: 25px; padding: 3px 13px;}
#itemCount{font-size: 18px; padding: 3px 13px;}
.btn-outline-primary:hover, .btn-outline-primary:active {
    background: rgba(98, 54, 255, 0.15) !important;
    border-color: #a236cf !important;
    color: #a236cf !important;
}
.badgeperson { position: absolute; right: 0px; }
#tableName.fa-ban{font-size: 34px;}

.timeSec {font-size: 10px; display: flex; justify-content: space-between;  margin-bottom: 4px;}
.ordNoSec {display:flex; justify-content: space-between; align-items: center;}
.iconBorder .glyph-icon{border-radius: 50%; line-height: 1.1rem; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;box-shadow: 0px 3px 8px #aaa, inset 0px 2px 3px #fff;}
.futOrdSty {border-radius: 5px; font-weight: bold; background: #fe4757; color: #fff;  padding: 0px 5px; height: fit-content;}
.bottomIconSec {display:flex; align-items: center; justify-content: space-between;line-height: 1.1;}
.tableNoSty{font-size: 16px; max-width: 100px; min-height:38px; display: flex; align-items: center; justify-content: center; line-height: 1.2;word-break: break-all; font-weight: bold; }
.tableNoPayment{font-size: 24px; line-height: 1.3;}
.bottomIconSec button{padding: 15px; height: 55px; margin-bottom: 4px;}
#addTableName button, .PayCard, .PayCash{padding: 8px; height: 40px; margin-bottom: 0px;}
.bottomIconSec .glyph-icon::before{font-size: 35px;}
.menuHeader{color: #fff; background: #a236cf;}
.menuTitle{font-weight: bold; text-transform: uppercase; font-size: 16px;}
.menuTitleInfo{font-size: 13px; line-height: 1.3;text-align: left;}
.menuInnerItems{display: none;}
.modal.action-sheet .modal-content .modal-header .modal-title{color: #fff; font-weight: bold; font-size: 17px;}
.modalbox .modal-dialog .modal-content .modal-header .modal-title{color: #fff; font-weight: bold; font-size: 17px;}
.emptyCard{padding: 20px 10px; text-align: center; font-size: 20px; font-weight: bold;}
.modal {left: unset;}
.modal.action-sheet .modal-dialog, .modalbox .modal-dialog { min-width: unset; max-width: 600px;}

.badge-info, a.badge-info { background: #006400 !important; }
.badge-primary, a.badge-primary{ background: #a236cf !important; }
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active,.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle,.btn-primary, .btn-outline-primary.active {
    background: #a236cf !important;
    border-color: #a236cf !important; 
    color:#fff!important;
}
.form-group .label{color:#a236cf;}
#d1, #d3{color: #021214;}
.btn-primary.disabled, .btn-primary:disabled{ background: #D3D3D3 !important; border-color: #D3D3D3 !important;}
.text-primary, a.text-primary { color: #a236cf !important; }
.text-info, a.text-info { color: #006400 !important; }
.btn-outline-primary { border-color: #a236cf; color: #a236cf; }
.accPadding { padding: 8px 5px 2px 5px !important; }
.tavo-calendar__header { background-color: #f2f2f2; color:#a236cf; } 
.tavo-calendar__day_select span, .tavo-calendar__day_range-select { background-color: #fe4757; color:#fff; } 
.tavo-calendar__reset{border:none!important; background-color: #FFFFFF!important;}
.tavo-calendar__info{margin-bottom: 0px; padding: 5px 10px;}
.tavo-calendar__info span {background-color: #ffffff; }
.tavo-calendar__days {background: #f2f2f2;margin-top: 0px;}
.tavo-calendar__nav_prev svg, .tavo-calendar__nav_next svg { fill: #a236cf; height: 20px;}
.tavo-calendar__week-names { background-color: #a236cf; color:#fff;}
.tavo-calendar__day_abs-today { background-color: transparent;}

.timeBox{font-size: 13px;padding: 2px; border: 1px solid #a236cf; border-radius: 10px; min-height: 33px; text-align: center;}
.timeBox.select{background-color: #fe4757; border-color:#fe4757; color: #ffffff;}
.timeBox.full{opacity: 0.6;  background-color: #eee; color:#fe4757;}
#qty{background: #fe4757; color: #fff; padding: 2px 4px;border-radius: 5px;white-space: nowrap;}

.fontIcon18::before{font-size: 18px!important;}
.icon_orderType{ color: #fe4757;}
.bg_primary{background: #a236cf!important; color:#fff!important;}
.bg_danger{background: #fe4757!important; color:#fff!important;}
.bg_scondary{background: #002f87!important; color:#fff!important;}
.badge-danger{background: #fe4757 !important;}
.bg_delivery:before{font-size: 28px!important;}
.text-warning, a.text-warning { color: #9F6000 !important; }
.text-danger, a.text-danger { color: #fe4757 !important; }
.btn-danger:hover, .btn-danger:focus, .btn-danger:active, .btn-danger.active, .btn-danger { background: #fe4757 !important; border-color: #fe4757 !important; color: #FFFFFF !important; }
.form-group .label {font-size: 13px;}
.form-group.boxed .form-control.timeInput{ padding: 0px 5px 0px 20px; border: 1px solid #ced4da;}
.form-group.boxed .form-control.timeInput:focus{ border-color: #a236cf;}
.card .card-footer { color: #2a344e; }
#appCapsule{margin:0 auto;}
.toast-box.toast-bottom.show {z-index: 9999999; max-width: 600px; left: auto; right: auto; bottom: 70px;}
.btnblck{background: #000; color: #fff;}
.empCardView{min-height: 222px;}
.empHeaderTxt{display: flex; justify-content: center; align-items: center; color: #fff;}
.empInnerCardTxt{display: flex; justify-content: space-between; align-items: center; margin-bottom:5px;line-height: 1;}
.empCount{border-radius: 50px; padding:5px 10px;  line-height: 1;text-align: center;}
.empSeqName{line-height: 1.1;}
.empSeqSide{display:flex; align-items: center;}
.empEvenCard{background-color: #188c8b; color: #fff!important;}
.empOddCard{background-color: #F1931b; color: #fff!important;}
.abcRioButtonBlue{width: 100%!important;border-radius: 0 5px 5px 0!important;}
.abcRioButtonContents{font-size: 16px!important;}
.fb-login-button{width: 100%!important;}
.width-25{width: 25%;}
.width-50{width: 50%;}
.venueSearchIcon:before{font-size: 40px!important;font-weight: normal;}
.selectBoxVenue{border:2px solid; border-radius: 10px; padding:20px 10px;text-align: center; font-weight: bold;}
.venueBG{position: absolute; top: 0px; left: 0px;  height: 95vh; width: 100%;  object-fit: cover; transform: scale(1.1); opacity: 1; transition: all 1.4s ease 0s;}
.welcomeTxt{position: absolute; width: 100%; top: 90px; text-align: center; color: #fff; font-weight: bold; line-height: 1.4;background: rgba(162, 54, 207,0.7);max-width: 600px; margin: 0 auto;}
.spinner-border-sm{padding:10px;}
.btn:hover { color: #fff;}
.settingBox {display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #eee; padding: 10px 10px;}
.selectInput{width: 100%; padding: 10px; border: 2px solid #eee; border-radius: 10px;}
select option{ font-size: 10px;}
.selectInput:focus{border-color:#a236cf;}
a{color: #a236cf;}
#bottomNav a{color:#fff;}
#bottomNav .text-selected{color:#00a7e7;}
.nav-tabs.lined .nav-item .nav-link{color: #021214; background: #f5eafa; text-transform: uppercase;}
.nav-tabs.lined .nav-item .nav-link.active {
    color: #fff;
    background: #a236cf;
    border-bottom-color: #a236cf !important;
    text-transform: uppercase;
}
.custom-control .custom-control-input:checked ~ .custom-control-label:before {
    background: #a236cf !important;
    border-color: #a236cf !important;
}
.form-group.basic .form-control:focus, .form-group.basic .custom-select:focus {
    border-bottom-color: #a236cf;
    box-shadow: inset 0 -1px 0 0 #a236cf;
}
.form-group.boxed .form-control:focus {
    border-color: #a236cf;
}
.headerNav{height:65px;border-bottom: 1px solid #DCDCE9;position: fixed; top: 0; left: 0; right: 0; z-index: 999; background: #dee3e9; color: #021214;padding: 5px 10px;max-width: 600px; margin: 0 auto;}
.headerNav a{color:#021214;}
.headerNav .row{height: 60px;}
.headerNav .headerButton{padding: 0;}
.headerNav #empName{ position: absolute; left: 0px; text-align: center; bottom: -20px;font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
#headerPageTitle1, #headerPageTitle2{font-size: 14px; font-weight: bold; padding:5px; text-transform: uppercase;}
#headerPageTitle2{font-size:11px;}
#selected_ord{font-size: 10px; line-height: 1px;}
#appCapsule{padding-top:65px;height: 100vh;}
#bottomNav .item{display: none;}
.accordion .accordion-header .accordionClick.collapsed { background: #dee3e9!important;font-size: 16px; font-weight: normal; }
.accordion .accordion-header .accordionClick  { background: #c8d5e5!important; font-size: 18px; font-weight: bold;}
.appBottomMenu .item strong { margin-top: 3px; color: inherit;}
input:-internal-autofill-selected {background-color: #021214!important;}
.appBottomMenu{background: #194393;max-width: 600px; margin: 0 auto;}
.accordion .accordion-header .btn.collapsed:before { background: #eee; }
.venueSearchResult{padding: 5px 10px; border-radius: 10px 10px 0px 0px;}
.venSeCard{position: absolute; bottom: 0; left: 0;background: rgba(255, 28, 45,1);width: 100%; color: #fff!important; padding: 5px 10px!important;}
.venSeCard #venueName{font-size: 20px; font-weight: bold;}
.accordion .accordion-header .checkOutBtn{background: #fe4757!important; color: #fff; font-weight: bold;}
.accordion .accordion-header .checkOutBtn:active { background: #fe4757!important; color: #fff; font-weight: bold;}

.even, .odd{ border-radius: 10px; position:relative; margin-top: 60px!important;}
.even .empIconBox{width: 90px; height: 90px; border: 5px solid #f2f2f2; border-radius: 50%; box-shadow: 0px 2px 13px #a236cf, inset 0px 0px 8px #fff; background: #a236cf; display: flex; justify-content: center; align-items: center;position: absolute;
    top: -50px; left: 50%; transform: translateX(-50%);}
.even .empCount { color: #fff; background-color: #a236cf;}
.odd .empCount { color: #fff; background-color: #fe4757;}
.odd .empIconBox{width: 90px;height: 90px; border: 5px solid #f2f2f2; border-radius: 50%; box-shadow: 0px 2px 13px #fe4757, inset 0px 0px 8px #fff; background: #fe4757; display: flex; justify-content: center; align-items: center;position: absolute;
    top: -50px; left: 50%; transform: translateX(-50%);}
.empIcon{font-size: 25px; color:#fff;}
.empTxt{font-size: 15px; font-weight: bold; color: white;}
.empCard{ border-radius: 0px 10px 10px 0px; padding: 5px 10px; -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.1); -moz-box-shadow: 0 0 20px rgba(0,0,0,0.1); box-shadow: 0 0 20px rgba(0,0,0,0.1); transition: box-shadow 100ms ease-in; -moz-transition: box-shadow 100ms ease-in; -webkit-transition: box-shadow 100ms ease-in; -o-transition: box-shadow 100ms ease-in; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box;min-height: 90px;padding-top: 30px;}
.even .empCard{background: #ebe1ee;}
.odd .empCard{background: #ffe3e6;}
.even .icon_orderType{color:#a236cf;}
.odd .icon_orderType{color:#fe4757;}
.rechargeBals{flex-direction: row; justify-content: space-between; padding: 10px;}
.flexalign{display:flex; justify-content: space-between;}
.payOpt{text-align: center; border:1px solid #a236cf; border-radius: 5px; padding:10px; font-weight: bold; color:#a236cf;}
.payOpt.active{background-color: #a236cf; color:#fff;}
.radiusR{border-radius: 5px 0px 0px 5px; }
.radiusL{border-radius: 0px 5px 5px 0px; }
.section.full { padding: 0; padding-bottom: 65px; background: #fbfbfb; }
#bottomNav .dropdown .dropdown-menu{ top:unset; left:unset; bottom:100%; right:0px;}
#bottomNav .dropdown .dropdown-menu a{color:#000;}
#bottomNav i{font-size: 30px;}
#bottomNav .dropdown .dropdown-menu i{font-size: 24px;}
#bottomNav .dropdown .dropdown-menu .dropdown-item, #bottomNav .dropup .dropdown-menu .dropdown-item {padding: 5px 10px;font-size: 13px;}
#filterBox{display: flex; flex-direction: column; text-align: center;}
.appBottomMenu .item:hover .icon, .appBottomMenu .item:hover ion-icon, .appBottomMenu .item:hover strong {
     color: #FFF; 
}
#roleIcon::before{font-weight: bold;}
#roleIcon.fa-user-circle-o::before{font-weight: 100;}
.accordion .accordion-header .btn:after{content: '\25c4'; color:#a236cf;}
.addMsgBox{
    width: 100%;
    height: 140px;
    background: #fff;
    position: fixed;
    bottom: 0;
    border-top: 3px solid #a236cf;
    margin: 0 auto;
    z-index: 999;
    padding: 10px;
}
.closeBox{
    position: absolute;
    top: 10px;
    right: 20px;
    font-size: 20px;
    cursor: pointer;
}
#cancelOrd_popup{background-color: rgba(255,255,255,0.7); width: 100%; height:100%;display: none; position: fixed; top: 0; max-width: 600px;
    margin: 0 auto;}
#cancelOrd_popup .card{left: 0; padding: 20px; width: 97%; justify-content: center; align-items: center; position: absolute; top: 50%; transform: translateY(-50%);z-index:999999;}
#checkNetwork {display: none; left: 0; padding: 20px; width: 97%; justify-content: center; align-items: center; position: absolute; top: 50%; transform: translateY(-50%);z-index:999999;}
#tip, #cashGiven {
    -moz-appearance: textfield;
    -webkit-appearance: none;
    margin: 0;
    padding: 2px;
}
#tip::-webkit-outer-spin-button,
#tip::-webkit-inner-spin-button,
#cashGiven::-webkit-outer-spin-button,
#cashGiven::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.venueImage{ min-height: 250px; background-repeat: no-repeat; background-position: center; background-size: cover;}
#preLoader{display:none; position: fixed;align-items: center; justify-content: center; left:0; top:0; width: 100%;height:100vh; background: rgba(255,255,255,0.7);}
.abcRioButton.abcRioButtonLightBlue{width:100%!important;}
#cImage{height:30px;} /*removed by Tatha: padding-bottom: 5px; */
#seatAvail{display: none;}
.addrType{font-size: 16px; padding: 4px; position: relative;}
.addrType.selected{background-color: #a236cf; color:#fff; border-radius: 5px;}
.addrType.selected::before {
    position: absolute;
    right: 30px;
    top: 12px;
    height: 11px;
    width: 3px;
    background-color:#fff;
    content: "";
    transform: translateX(10px) rotate(-45deg);
    transform-origin: left bottom;
}
.addrType.selected::after {
    position: absolute;
    right: 13px;
    top: 20px;
    height: 3px;
    width: 20px;
    background-color: #fff;
    content: "";
    transform: translateX(10px) rotate(-45deg);
    transform-origin: left bottom;
}