.btn-primary {
    color: #fff;
    background-color: #35b31c;
    border-color: #35b31c;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
    padding-top: 8px;
padding-bottom: 8px;
}
.btn-primary:hover,.btn-primary:active, .btn-primary:focus {
    color: #fff;
    background-color: #2d9918;
    border-color: #2d9918;
}
.btn-secondary {
    color: #fff;
    background-color: #444;
    border-color: #444;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
     padding-top: 8px;
padding-bottom: 8px;
}
.btn-secondary:hover, .btn-secondary:active, .btn-secondary:focus {
    color: #fff;
    background-color: #222;
    border-color: #222;
}
.btn-blue {
    color: #fff;
    background-color: #1049a2;
    border-color: #1049a2;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
     padding-top: 8px;
padding-bottom: 8px;
}
.btn-blue:hover, .btn-blue:active, .btn-blue:focus {
    color: #fff;
    background-color: #0e3f8c;
    border-color: #0e3f8c;
}
.mt-25{ margin-top: 25px;}
/*This is the custom css for Dialer Admin*/
.dialer-icons{
    padding: 10px 20px; overflow-y: auto;
}
.dialer-icons ul{
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: center;
}
.dialer-icons ul li{
    margin: 0;
    padding: 0;
    list-style: none;
    display: inline-block;
}
.dialer-icons ul li a{
    margin: 5px;
    font-size: 18px;
    box-shadow: 2px 2px 10px 2px #a0a0a0;
    transition: 0.3s;
}
.dialer-icons ul li a:focus{
    box-shadow: 0px 0px 0px 0px #a0a0a0;
    background: #fff;
}
.dialer-icons ul li button{
    margin: 5px;
    font-size: 18px;
    box-shadow: 2px 2px 10px 2px #a0a0a0;
    transition: 0.3s;
}
.dialer-icons ul li button:focus{
    box-shadow: 0px 0px 0px 0px #a0a0a0;
    background: #fff;
}
.keypad-only.dialer-icons ul li a{
    box-shadow: 0px 0px 0px 0px #a0a0a0;
}
.keypad-only.dialer-icons ul li button{
    box-shadow: 0px 0px 0px 0px #a0a0a0;
}
.dialer-icons ul li a i{
    font-size: 20px;
}
.dialer-icons ul li button i{
    font-size: 20px;
}

.dialer-icons .gx-btn-teal:focus {
    background-color: #007d71;
    color: #fff;
}

.dialer-icons h1{
    font-size: 30px;
    font-weight: bold;
}
.new-dialer-menu.navbar-expand-lg .navbar-collapse {
    display: block !important;
    position: relative;
}

.color-dropdown .dropdown-item label{
    position: relative;
    padding: 3px;
}
.top-live-status{
    display: block;
    margin-top: 2px;
}
.top-live-status small{
    margin-right: 10px;
    color: #c3c3c3;
}
.active-caller{
}
.active-caller ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
.active-caller ul li{
    margin: 0;
    padding: 0;
    list-style: none;
    display: block;
    text-align: center;
}
.active-caller ul li label{
    padding: 10px 20px;
    background: #4caf4f;
    color: #fff;
    display: block;
    font-size: 16px;
}
.keypad-input ul{
    margin: 0;
    padding: 0;
    list-style: none;
    padding: 15px;
    padding-bottom: 0;
}
.keypad-input ul li{
    margin: 0;
    padding: 0;
    list-style: none;
    display: block;
    text-align: center;
}
.dialer-icons.keypad-icons span{
    display: inline-block;
    position: absolute;
    font-size: 9px;
    top: 12px;
    text-transform: uppercase;
    left: 0;
    right: 0;
}

.radio-red input[type="radio"]:checked + label::before {
    border-color: #D32F2F;
}
.radio-red input[type="radio"]:checked + label::after {
    background-color: #D32F2F;
}
.radio-orange input[type="radio"]:checked + label::before {
    border-color: #f8d686;
}
.radio-orange input[type="radio"]:checked + label::after {
    background-color: #f8d686;
}

.radio-dark-gray input[type="radio"]:checked + label::before {
    border-color: #9c9c9c;
}
.radio-dark-gray input[type="radio"]:checked + label::after {
    background-color: #9c9c9c;
}


.caller-name-number{
  background: #f7f7f7;
  border: 1px solid #ccc;
  padding: 15px;
  border-radius: 3px;
  min-height: 81px;
}
.caller-name-number h2{
  margin-bottom: 5px;
}
.caller-name-number h3{
  margin-bottom: 0px;
}

.caller-name-number.incall {
    background: #37943a;
    border: 1px solid #37943a;
}
.caller-name-number.incall h2{
  color: #fff;
}
.caller-name-number.incall h3{
  color: #fff;
}

.caller-name-number.call-hold {
    background: #ff9800;
    border: 1px solid #ff9800;
}
.caller-name-number.call-hold h2{
  color: #fff;
}
.caller-name-number.call-hold h3{
  color: #fff;
}


.caller-name-number.conf-mode {
    background: #da00ab;
    border: 1px solid #da00ab;
}
.caller-name-number.conf-mode h2{
  color: #fff;
}
.caller-name-number.conf-mode h3{
  color: #fff;
}

.text-gray{
  color: #c5c5c5 !important;
}

.text-pink{
  color: #da00ab !important;
}

.bg-dark-gray {
    background-color: #5f5f5f !important;
}

.bg-light-gray {
    background-color: #cecece !important;
}

.card-footer.footer-status-icon{
  padding: 15px 0px;
}

.footer-status-icon{

}
.footer-status-icon ul{
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: center;
}
.footer-status-icon ul li{
  margin: 0;
  padding: 0;
  list-style: none;
  display: inline-block;
  width: 20%;
  float: left;
  text-align: center;
}

.footer-status-icon ul li a{
  text-decoration: none;
}
.footer-status-icon ul li a i{
  display: block;
  color: #333333;
  margin: 0 auto;
  transition: 0.3s;
}
.footer-status-icon ul li a span{
  font-size: 10px;
  text-transform: uppercase;
  color: #333333;
  transition: 0.3s;
}

.footer-status-icon ul li a:hover i{
  color: #4350b2;
}
.footer-status-icon ul li a:hover span{
  color: #4350b2;
}
.footer-status-icon ul li:first-child a:hover i{
  color: #333333;
}
.footer-status-icon ul li:first-child a:hover span{
  color: #333333;
}
.caller-box{
  background: #4caf50;
}
.caller-box ul{
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: center;
}
.caller-box ul li{
  margin: 0;
  list-style: none;
  padding: 5px 15px;
  text-align: center;
}
.caller-box ul li p{
  margin-bottom: 0;
  color: #fff;
}

.caller-box ul li label {
    color: #fff;
    display: inline-block;
    font-size: 16px;
}

.gx-toolbar.new-red-toolbar{
  background-color: #253238; height: 52px;
}
.gx-toolbar .header-notifications>li>a {
    color: #3f51b5;
}
.btn.btn-success{
  border-color: #39833c;
  background: #3d8b40; 
}
.btn-success{
  border-color: #39833c;
  background: #3d8b40; 
}

.keypad-only{
  position: absolute;
  background: rgba(0, 0, 0, 0.71);
  left: 0;
  right: 0;
  z-index: 1;
  height: calc(100% - 44px);
  top: 44px;
}
.keypad-btn{
  position: relative;
}

.keypad-close-btn{
    position: absolute;
    color: #fff;
    top: -22px;
    right: -15px;
    font-size: 18px;
    transition: 0.3s;
}

.keypad-close-btn:hover{
  color: #fff;
  opacity: 0.8;
}
.keypad-only{
  display: none;
}

.keypad-input-box{
  position: relative;
}
.keypad-input-box a{
  position: absolute;
  top: 6px;
  right: 6px;
  font-size: 18px;
  color: #8a8a8a;
  transition: 0.3s;
}
.keypad-input-box a:hover{
  color: #696969;
}

.gx-sidebar {
    background-color: #eaeaea;
    color: #333; /*overflow-y: auto;*/
}

.side-nav .user-profile {
    background-color: #4c4c4c;
}
.gx-menu-icon{
  border: 1px solid #ccc;
}
.gx-menu-icon .menu-icon{
  background-color: #3f51b5;
}


.gx-toolbar{
  left: 0;
}

#new-menu-clsoe-toggle{
  display: none;
}

.three-way-icon{
  width: 18px;
}




/*Status Color code Sample*/
.staus-color-code{
  margin: 0;
  height: 0;
  display: inline-table;
}
.staus-color-code li{
  margin: 0;
  padding: 0;
  list-style: none;
  margin-bottom: 10px;
}
.available-color{
  width: 10px;
  height: 10px;
  background: #4444e7;
  display: inline-block;
}

.unavailable-color{
  width: 10px;
  height: 10px;
  background: #9a9a9a;
  display: inline-block;
}

.away-color{
  width: 10px;
  height: 10px;
  background: #ffc200;
  display: inline-block;
}

.logged-out-color{
  width: 10px;
  height: 10px;
  background: #dcdcdc;
  display: inline-block;
}

.logged-out-color-red{
  width: 10px;
  height: 10px;
  background: #ec5e4d;
  display: inline-block;
}

.in-call-color{
  width: 10px;
  height: 10px;
  background: #49b13e;
  display: inline-block;
}

.call-wrapping-color{
  width: 10px;
  height: 10px;
  background: #9b9be2;
  display: inline-block;
}

.conference-call-color{
  width: 10px;
  height: 10px;
  background: #9243bb;
  display: inline-block;
}

/*End Status Color code Sample*/

/*status color for extensions*/
.available-bg-color{
  background: #4444e7;
}

.unavailable-bg-color{
  background: #9a9a9a;
}

.away-bg-color{
  background: #ffc200;
}

.logged-out-bg-color{
  background: #dcdcdc;
}

.logged-out-bg-color-red{
  background: #ec5e4d;
}

.in-call-bg-color{
  background: #49b13e;
}

.call-wrapping-bg-color{
  background: #9b9be2;
}

.conference-call-bg-color{
  background: #9243bb;
}

/*End status color for extensions*/

/*status color for text*/
.available-text-color{
  color: #4444e7 !important;
}

.unavailable-text-color{
  color: #9a9a9a !important;
}

.away-text-color{
  color: #ffc200 !important;
}

.logged-out-text-color{
  color: #dcdcdc !important;
}

.logged-out-text-color-red{
  color: #ec5e4d !important;
}

.in-call-text-color{
  color: #49b13e !important;
}

.call-wrapping-text-color{
  color: #9b9be2 !important;
}

.conference-call-text-color{
  color: #9243bb !important;
}

/*End status color for text*/

.bg-new-gray{
  background: #607d8b;
}
/*Top Select*/
.top-campaign{
    padding: 0px 5px;
    background: #4c4c4c;
}
.top-campaign .top-dropdown{
    width: 65%;
    float: left;
    border-radius: 0;
}
.top-campaign .top-active-btn{
    width: 33%;
    padding: 10px 10px;
    border-radius: 0;
    margin-left: 2%;
    border-color: #4caf4f;
    background: #4caf4f;
    transition: 0.3s;
}
.top-campaign .top-active-btn:hover{
    border-color: #39833c;
    background: #3d8b40;
}
.wrap-caller{
}
.wrap-caller ul{
  margin: 0;
  padding: 0;
  list-style: none;
}
.wrap-caller ul li{
  margin: 0;
  padding: 0;
  list-style: none;
  display: block;
  text-align: center;
}
.wrap-caller ul li label{
  padding: 10px 20px;
  background: #c3c3c3;
  color: #000;
  display: block;
  font-size: 16px;
}
.in-barge-color{
  width: 10px;
  height: 10px;
  background: #0c8300;
  display: inline-block;
}

.in-barge-bg-color{
  background: #00d452;
}

.in-barge-text-color{
  color: #00d452 !important;
}

.in-barge-card{
  border-left: 10px solid #00d452;
}

.in-barge-time:before{
  background: #00d452;
}

.in-barge-border{
  border:2px solid #00d452;
}

.in-monitor-color{
  width: 10px;
  height: 10px;
  background: #0c8300;
  display: inline-block;
}

.in-monitor-bg-color{
  background: #00d452;
}

.in-monitor-text-color{
  color: #00d452 !important;
}

.in-monitor-card{
  border-left: 10px solid #00d452;
}

.in-monitor-time:before{
  background: #00d452;
}

.in-monitor-border{
  border:2px solid #00d452;
}

.in-whisper-color{
  width: 10px;
  height: 10px;
  background: #0c8300;
  display: inline-block;
}

.in-whisper-bg-color{
  background: #00d452;
}

.in-whisper-text-color{
  color: #00d452 !important;
}

.in-whisper-card{
  border-left: 10px solid #00d452;
}

.in-whisper-time:before{
  background: #00d452;
}

.in-whisper-border{
  border:2px solid #00d452;
}

li.reply-popup h5 {
    text-align: right !important;
    float: right;
    display: block;
    width: 100%;
    margin: 5px 0px;
}
li.reply-popup .d-flex {
    display: block !important;
}

li.reply-popup {
    text-align: right;
    flex-direction: row-reverse;
}
.messages-list .reply-popup .user-thumb {
    margin-right: 0;
    margin-left: 10px;
}

 /* 13-7-2020*/
    .search-group, .action-nav{ padding: 15px; overflow: hidden}
    input.user-search {
    background: url(../images/search.png) no-repeat 8px center #fff;
    border: 1px solid #f2f6fa;
    padding: 7px 7px 7px 30px;
    border-radius: 5px;
    width: 100%;
    color: #000;
            background-size: 16px;
}
    input.user-search:focus {
    border: 1px solid #f2f6fa;     outline: none;
}
    .action-nav ul {
    padding: 0;
}
   .action-nav ul li {
    float: left;
    width: auto;
    text-align: center;
    margin-right: 18px;
    list-style: none;
       padding-top: 8px;
}
    .action-nav ul li:last-child {
    margin-right: 0;
}
    .action-nav ul li a {
    color: #6f6f6f;
    display: block;
    font-size: 10px;
}
    .action-nav ul li a i {
    font-size: 20px;
    margin-bottom: 5px;
        position: relative;
padding-left: 3px;
padding-right: 3px;
}
    .action-nav ul li.active a{
    color: #3f51b5;
}
    .action-nav ul li a:hover{
    color: #3f51b5; text-decoration: none;
}
    .chat-user-list ul {
    padding: 0;
}
    .chat-user-list {
    background: #fff;
    /*height: calc(100vh - 220px);*/
    overflow-y: auto;
    overflow-x: hidden;
    box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.10) inset;
}
    .chat-user-list ul li {
    list-style: none;
    padding: 10px 15px;
        overflow: hidden; cursor: pointer;
}
    .chat-user-list ul li:hover {
        background: rgba(229, 241, 255, 0.40);
}
    .chat-user-list ul li .u-img {
    width: 55px;
    position: relative;
        float: left;
            margin-right: 10px
}
    .chat-user-list ul li .u-img img {
    width: 50px;
    border-radius: 50%;
    height: 50px;
        border: 1px solid #f7f7f7;
}
.chat-user-list ul li .u-img span.status-dot {
    background: #f44336;
    width: 16px;
    height: 16px;
    border: 2px solid #fff;
    position: absolute;
    right: 2px;
    bottom: 2px;
    border-radius: 50px;
}
    .chat-user-list ul li .u-img span.status-dot.act {
    background: #00e634;
}
    .u-info {
    margin-top: 17px;
}
    .u-info h5 {
    font-weight: 700;
}
    
/*Start Media Query*/
@media (max-width: 767px){

  .sidebar-mobile-menu {
    margin-left: 10px;

  }
  .header-notifications {
      margin: 0;
      float: right;
      padding-left: 0;
      list-style: none;
      margin-top: 10px;
  }
  .side-nav.gx-sidebar.new-menu-open{
    position: fixed !important; 
    top: 0px !important; 
    bottom: 0px !important; 
    height: 100% !important; 
    left: 0px !important; 
    width: 100% !important; 
    max-width: 100% !important;
    transition: left 300ms ease 0s !important;
    display: block !important;
  }
  .side-nav.gx-sidebar.new-menu-clsoe{ 
    display: none !important;
    transition: left 300ms ease 0s !important;
  }
  #new-menu-open-toggle i{
    color: #3f51b5;
    font-size: 26px;
  }
  #new-menu-clsoe-toggle{
    display: inline-block;
  }
  #new-menu-clsoe-toggle i{
    color: #fff;
    font-size: 26px;
    position: relative;
    top:7px;
  }
  .gx-fab-btn {
      height: 70px !important;
      width: 70px !important;
      line-height: 70px;
  }
  .dialer-icons ul li button {
      font-size: 24px;
  }
  .dialer-icons.keypad-icons span {
      font-size: 11px;
      top: 20px;
  }
  .dialer-icons ul li a i {
      font-size: 32px;
  }
  .dialer-icons {
      padding: 10px;
  }
}


/* 14-17-20*/
.sidebar-header {
    background: #fff;
    border-right: 1px solid #f2f2f2;
border-bottom: 1px solid #f2f2f2;
}
.dashboard-sidemenu .side-menu .list-group-item {
    border: 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    margin-bottom: 5px;
    padding: 10px;
    border-radius: 5px;
}
.side-menu {
    padding-left: 10px;
    padding-right: 10px;
    /*max-height: calc(100vh - 187px);
overflow-y: auto;*/
}
.side-menu a.list-group-item {
    color: #8bc349;
    font-size: 16px;
}
.dashboard-sidemenu .side-menu a.list-group-item.collapsed {
   color: #d7d7d7;
background: #253238;
}
.dashboard-sidemenu .side-menu a.list-group-item {
    background: #475257;   
}
.side-menu a.list-group-item:hover {
    color: #8bc34a;
}
.side-menu a.list-group-item.collapsed i.zmdi-chevron-right {
    font-size: 22px;
position: absolute;
right: 3px;
top: 11px;
transform: rotate(0deg);
}
.side-menu a.list-group-item i.zmdi-chevron-right {
    font-size: 22px;
position: absolute;
right: 0;
top: 11px;
transform: rotate(90deg);
}


.side-menu .side-sub-menu .list-group-item {
    border: 0;
    padding: 6px 6px 6px 26px;
    font-size: 14px;
    color: #f2f2f2;
}
.side-menu .side-sub-menu .list-group-item i {
    font-size: 15px;
    position: absolute;
    left: 10px;
    top: 10px;
}
.side-sub-menu {
    margin-bottom: 12px;
    /*max-height: 450px;
    position: relative;*/
}
.sidebar-title {
    font-size: 24px;
    background: #4c4c4c;
    color: #fff;
    font-weight: 600;
    padding: 9px 15px;
}
.title-box h3 {
    font-weight: 500;
    font-size: 24px;
    color: #666;
    margin: 0;
}
.widget {
    background: #fff;
    padding: 10px;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.03);
}
.title-box {
    float: left;
}
.report-options {
}
.report-options a {
    background: #35b31c;
    color: #fff;
    padding: 7px 10px;
    border-radius: 5px;
    font-size: 16px;
    width: 37px;
    display: inline-block;
    text-align: center;
    margin-left: 3px;
    transition: all ease 0.3s;
}
.report-options a:hover {
    background: #fed759;
    color: #222;
    transition: all ease 0.3s;
}
.title-box h3 span {
    border: 1px solid #3f51b5;
    color: #3f51b5;
    font-weight: 400;
    font-size: 12px;
    padding: 3px 10px;
    border-radius: 4px;
    vertical-align: middle;
    margin-left: 10px;
}
.table thead th {
    background: #686868;
    color: #fff;
}
.table-striped tbody tr:nth-of-type(2n+1) {
    background-color: rgba(0, 0, 0, 0.025);
}
.top-live-status small a {
    color: #757575;
}
.gx-toolbar{ padding-top: 0px; padding-bottom: 0px;}
.sidebar-header img {
    margin-top: 4px;
    margin-bottom: 4px;
    margin-left: 10px;
}
.side-menu a.list-group-item .zmdi {
    margin-right: 5px;
}
.side-menu a.list-group-item .far, .side-menu a.list-group-item .fas {
    font-size: 13px;
    margin-bottom: 4px;
    vertical-align: middle;
    margin-right: 3px;
}
.exp-menu{color: #999;
z-index: 9999;
position: absolute;
left: 10px;
top: 10px;
font-size: 21px; cursor: pointer;}
.exp-menu:hover{color: #fff;}
.exp-menu.rite{/* left: 290px;*/}
.gx-sidebar.hide-side {
    /*display: none;*/ margin-left: -240px; transition: all ease 0.3s;
}
.gx-sidebar{
   margin-left: 0px; transition: all ease 0.3s;
}
.gx-toolbar.f-wd{ left: 0;}
.logo-2 {
    width: 280px;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 9999;
    border-right: 1px solid #f2f2f2;
    height: 70px;
    display: none;
}
.logo-2 img {
    margin-left: 10px;
    margin-top: 4px;
}
.logo-2.logo-sh{ display: block;}

/* 15-07-2020*/
.inline-box .form-checkbox {
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
}
.modal-footer.text-center {
    display: block;
}
.modal-footer.text-center .btn{
    font-weight: 500;
    border-radius: 4px;
    padding: 10px 20px;
}
.modal-footer {
    border-top: 0px solid #e9ecef;
    padding-top: 5px;
}
.modal-footer.text-center .btn.btn-cancel {
    background: #d9d9d9;
}
.modal-footer.text-center .btn.btn-cancel:hover {
    background: #ccc;
}
.datepick{ background-image: url(../images/calender.png);
background-repeat: no-repeat;
background-size: 17px auto;
background-position: 96% center;}

div[tabindex="-1"] {
    z-index: 99999 !important;
}
.modal-dialog {
    max-width: 850px;
}
.w350 .modal-dialog {
    max-width: 350px;
}
.w450 .modal-dialog {
    max-width: 450px;
}
.w550 .modal-dialog {
    max-width: 550px;
}
.w650 .modal-dialog {
    max-width: 650px;
}
.modal-backdrop {
    z-index: 9999;
}
.table thead th .fa-sort {
    opacity: 0.8;
    margin-left: 5px;
}
.chart-clrs ul {
    padding: 0;
}
.chart-clrs li {
    display: inline-block;
    vertical-align: top;
    margin: 6px 0px;
    width: 150px;
}
.chart-clrs li span {
    width: 30px;
    height: 18px;
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
}
.chart-clrs li span.c-purple { background: #a90099;}
.chart-clrs li span.c-blue { background: #385acf;}
.chart-clrs li span.c-orange { background: #ff9200;}
.chart-clrs li span.c-green { background: #00a018;}
.chart-clrs li span.c-red { background: #ed0000;}

@media(max-width:991px){
    .exp-menu{ display: none;}
    .gx-menu-icon .menu-icon::after, .gx-menu-icon .menu-icon::before {
    
    height: 2px;
    min-height: 1px;
}
    .gx-menu-icon .menu-icon {
    width: 100%;
    height: 2px;
    background-color: #ccc !important;
}
    .gx-menu-icon .menu-icon::before {
    width: 100%;
}
    .gx-menu-icon .menu-icon::after {
    width: 100%;
}
}

/* 17-7-2020*/
.chat-box-head {
    border-bottom: 1px solid #ccc;
    padding-bottom: 16px;
    margin-bottom: 30px;
}
.chat-box-head h3 {
    margin-bottom: 0px;
    font-weight: 500;
font-size: 24px;
color: #666;
}
.action-nav{ padding-top: 0; padding-bottom: 8px;}
.keypad-input, .dialer-icons {
    background: #eaeaea;
}
.side-nav .user-profile {
    padding: 8px 20px;
    background-color: #1d1d1d;
}
.search-group, .action-nav {
    background: #f0f0f0;
}
/*Four Boxes*/
.st-box {
    padding: 14px;
    border-radius: 5px;
    overflow: hidden;
    height: 90px;
    margin-bottom: 10px;
    background: #f64e60; color: #fff;
}
.st-box.box1 {
    background: #2d84b6;
}
.st-box.box2 {
    background: #57be90;
}
.st-box.box3 {
    background: #7d80d9;
}
.st-box.box4 {
    background: #f39247;
}
.box-icon {
    width: 70px; float: left; text-align: center;
}
.box-icon i {
    font-size: 45px; margin-top: 6px;
}
.box-content {
    width: calc(100% - 70px);
    float: right;
}
.st-box h3 {
    font-size: 30px;
    font-weight: 500;
    margin-bottom: 0px;
    letter-spacing: -1px
}
@media(min-width:992px) and (max-width:1199px){
    .four-st-col .col-lg-3{ max-width: 50%;
flex: 0 0 50%;}
}

.ag-clr{ color: #31a2fb;}
.inact-clr{ color: #9c9c9c;}
.active-clr{ color: #5ec132;}
.talk-clr{ color: #69d937;}
.ring-clr{ color: #4c5ca6;}
.dial-clr{ color: #7988d7;}
.away-clr{ color: #ffa443;}
.intelligence-table {
    font-size: 16px; margin-bottom: 0px;
}
.flow-table td{ background: #fff; padding: 0;}

.header-notifications > li {
    padding: 0 13px;
}
.gx-toolbar .header-notifications > li > a {
    color: #555;
    font-size: 15px;
}
.gx-toolbar .header-notifications > li > a:hover{ color: #35b31c; text-decoration: none;}
@media(max-width:767px){
    /*.dh{ display: none !important;}*/
}

/* Queue Dashboard */

.sel-que {
    background: #333;
    padding: 15px;
    color: #fff;
}
.sel-que label{
    font-size: 18px;
}
.sel-que select {
    height: 40px;
    padding: 5px;
    color: #333; width: 100%;
}
.queue-lists {
    list-style: none;
    padding: 0;
}
.queue-lists li {
    padding: 15px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}
.queue-lists li h3 {
    color: #35b31c;
    font-weight: 500;
    font-size: 16px;
}
.queue-lists li a{ display: block;}
.queue-lists li a:hover{ text-decoration: none;}
.queue-lists li a p, .queue-lists li p  {
    margin: 0; color: #222;
}
.queue-lists li p span {
    width: 1px;
    height: 12px;
    background: #b0b0b0;
    display: inline-block;
    vertical-align: inherit;
    margin-left: 5px;
    margin-right: 5px;
}
.queue-lists li.active{ background: rgba(229, 241, 255, 0.70);}
.queue-lists li:hover{ background: rgba(229, 241, 255, 0.70);}

.dashboard-sidemenu .list-group-item.collapsed {
    background: #686868;
    color: #fff;
}
.dashboard-sidemenu .list-group-item {
    background: #475257;
    color: #fff;
    border: 0; border-radius: 0; padding-top: 15px; padding-bottom: 15px; z-index: 0;
}
.dashboard-sidemenu a.list-group-item.collapsed i.zmdi-chevron-right {
    font-size: 22px;
    position: absolute;
    right: 23px;
    top: 11px;
    transform: rotate(0deg);
}
.dashboard-sidemenu a.list-group-item i.zmdi-chevron-right {
    font-size: 22px;
position: absolute;
/*right: 20px;
top: 11px;
transform: rotate(90deg);*/
        right: 22px;
    top: 17px;
    transform: rotate(0deg); display: none;

}

.dashboard-sidemenu {
    height: calc(100vh - 0px);
    /*overflow-y: auto; */position: relative; background: #253238;
}
.dashboard-sidemenu a.list-group-item .far, .dashboard-sidemenu a.list-group-item .fas {
    font-size: 13px;
    margin-bottom: 4px;
    vertical-align: middle;
    margin-right: 3px;
}
/* Right Srction*/
.table thead th.mx-100 {
    max-width: 60px;
    text-align: center;
}
.w-col-title {
    margin-left: -20px;
    margin-right: -20px;
    margin-top: -20px;
    margin-bottom: 20px;
}
.w-col-title .list-group-item {
    background: #333;
    color: #fff;
    border: 0;
    border-radius: 0;
    font-size: 16px;
font-weight: 600;
    padding-left: 35px;
}

.w-col-title a.list-group-item.collapsed i.zmdi-chevron-right {
    font-size: 22px;
    position: absolute;
    left: 18px;
    top: 14px;
    transform: rotate(0deg);
}
.w-col-title a.list-group-item i.zmdi-chevron-right {
    font-size: 22px;
position: absolute;
left: 20px;
top: 14px;
transform: rotate(90deg);
}



/* CHat message loop*/

.chat-box-head {
    border-bottom: 1px solid #ccc;
    padding-bottom: 16px;
    margin-bottom: 30px;
}
    .chat-box-head h3 {
    font-weight: 700;
    font-size: 20px;
        margin-bottom: 5px;
}
    .chat-status span {
    background: #0bc828;
    width: 10px;
    height: 10px;
    display: inline-block;
    border-radius: 50px;
    vertical-align: middle;
}
    .chat-status span.login {
    background: #0bc828;
}
    .chat-status span.away {
    background: #ff9537;
} .chat-status span.offline {
    background: #f22020;
}
    
.c-text {
border: 1px solid #dfdfdf;
background: #fff;
padding: 1px 10px;
border-radius: 5px 5px 5px 0px;
box-shadow: 2px 1px 2px rgba(0, 0, 0, 0.09);
font-size: 13px;
line-height: 1.8;
color: #333;
float: left;
}
    .chat-block.replied-chat {
    float: right;
    margin-right: 20px;
}
    .c-time {
    color: #8a8a8a;
    margin-bottom: 5px;
    font-size: 12px;
}
    .chat-block {
    margin-bottom: 20px;
    width: calc(100% - 150px);
    overflow: hidden;
}
    .chat-block.replied-chat .c-text {
    background: #e3f0ff;
    float: right; 
    border-radius: 5px 5px 0px 5px;
}
    .chat-block.replied-chat .c-time {
    text-align: right;
}
    .chat-loop {
    height: calc(80vh - 200px);
    overflow-y: auto;
}
    .chat-field {
    border-top: 1px solid #ddd;
    margin-top: 10px;
    padding-top: 10px;
}
    .chat-field textarea {
    background: #e8e8e8;
    border: 0;
    width: calc(100% - 70px);
    height: 70px;
    resize: none;
    border-radius: 10px;
    padding: 10px;
    font-size: 12px;
        line-height: 1.2;
    font-family: "Roboto",sans-serif;
}
.chat-field textarea:focus {
    outline: 0;
}
    .chat-field button {
    background: #3f51b5;
    vertical-align: top;
    margin-top: 17px;
    height: 40px;
    width: 40px;
    margin-left: 15px;
    border-radius: 5px;
        border: 0;
}
    .chat-field button:hover {
    background: #354499;
}
    .chat-field button img {
    width: 20px;
}

.cg-heading {
    padding: 10px 0px;
    display: block;
    color: #666;
    font-weight: 500;
    font-size: 14px;
        position: relative;
        border-bottom: 1px solid #eee;
margin-left: 15px;
margin-right: 15px;
}
    .cg-heading:hover {
    
    color: #3f51b5;
        text-decoration: none;
}
    .chat-user-list a.cg-heading.collapsed i.zmdi-chevron-right {
    font-size: 22px;
    position: absolute;
    right: 3px;
    top: 11px;
    transform: rotate(0deg);
}
    .chat-user-list a.cg-heading i.zmdi-chevron-right {
    font-size: 22px;
    position: absolute;
    right: 0px;
    top: 11px;
    transform: rotate(90deg);
}
    
    .chat-user-list #RecentChat ul li {
    background: rgba(232, 232, 232, 0.20);
    margin-bottom: 1px;
}
    .chat-user-list #RecentChat ul li:hover{
    background: rgba(229, 241, 255, 0.40);
}
    .chat-user-list #RecentChat ul li.active {
    background: rgba(229, 241, 255, 0.70);
}
    .chat-user-list ul li.active {
    background: rgba(229, 241, 255, 0.70);
}

.recent-title {
    background: rgba(232, 232, 232, 0.20);
}

.action-nav .icons-alert::after {
    display: block;
    position: absolute;
    content: "";
    right: 0;
    top: 0;
    z-index: 10;
    width: 8px;
    height: 8px;
    background-color: #f44336;
    border-radius: 50%;
}
.action-nav .icons-alert::after {
    display: block;
    -webkit-box-shadow: 0 0 0 rgba(244,67,54,0.4);
    -moz-box-shadow: 0 0 0 rgba(244,67,54,0.4);
    -o-box-shadow: 0 0 0 rgba(244,67,54,0.4);
    box-shadow: 0 0 0 rgba(244,67,54,0.4);
    animation: pulse 2s infinite;
}

/* Preloader*/
#prelaoder {
    background: rgba(0, 0, 0, 0.3);
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 9999;
    display: none;
}
#prelaoder::after {
    content: "";
    background: url(../images/loader.svg);
        background-color: rgba(0, 0, 0, 0);
        background-position-x: 0%;
        background-position-y: 0%;
        background-repeat: repeat;
    width: 70px;
    height: 40px;
    position: absolute;
    left: 50%;
    top: 50%;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 20px;
}

.row.four-st-col {
    margin-top: -20px;
}
/* Modal Form Schedule Report*/
.modal-body label {
    font-weight: 500;
    margin-bottom: 5px;
}
.modal-body .custom-radio label{ font-weight: 400;}
.modal-body textarea.form-control{ height: 100px;}
label em {
    color: #e61010;
    font-style: normal;
    margin-left: 3px;
}
.modal-title{ font-weight: 500;}

/* Modal Form Schedule Report End*/

/* Header Setting Icon */
.gx-toolbar .header-notifications > li.settings > a {
    color: #35b31c;
    font-size: 25px;
}
.gx-toolbar .header-notifications > li.settings { padding-right: 3px;
}
/* Header Setting Icon End*/

/* Chat Unread Message Popup*/

@-webkit-keyframes unreadpulse {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(60, 54, 244, 0.4)
    }

    70% {
        -webkit-box-shadow: 0 0 0 10px rgba(60, 54, 244, 0)
    }

    100% {
        -webkit-box-shadow: 0 0 0 0 rgba(60, 54, 244, 0)
    }
}

@keyframes unreadpulse {
    0% {
        -moz-box-shadow: 0 0 0 0 rgba(60, 54, 244, 0.4);
        box-shadow: 0 0 0 0 rgba(60, 54, 244, 0.4)
    }

    70% {
        -moz-box-shadow: 0 0 0 10px rgba(60, 54, 244, 0);
        box-shadow: 0 0 0 10px rgba(60, 54, 244, 0)
    }

    100% {
        -moz-box-shadow: 0 0 0 0 rgba(60, 54, 244, 0);
        box-shadow: 0 0 0 0 rgba(60, 54, 244, 0)
    }
}

.chat-user-list ul li .u-img .unread-msg {
    background: #4950c4;
    color: #fff;
    width: 24px;
    height: 24px;
    display: block;
    text-align: center;
    line-height: 24px;
    border-radius: 50%;
    position: absolute;
    right: -4px;
    top: 0;
    font-size: 11px;
    font-weight: 600;
    box-shadow: 0 0 0 rgba(60, 54, 244, 0.4);
animation: unreadpulse 2s infinite;
}
/* Chat Unread Message Popup End*/

/* Group Chat Action CSS*/
.chat-user-list ul li.group-chat {
    overflow: visible; width: 100%; float: left; position: relative;
}
.group-action a.dropdown-toggle {
    background: #fff;
    border: 1px solid #e6e6e6;
    width: 26px;
    display: block;
    height: 26px;
    text-align: center;
    border-radius: 50px;
    line-height: 26px;
	z-index: 9999;
}
.group-action a.dropdown-toggle i {
    color: #b3b3b3;
	margin-top:5px;
}
.group-action a.dropdown-toggle::after {
    content: inherit;
}
.group-action a.dropdown-toggle .dot {
   width: 4px;
height: 4px;
background: #bfbfbf;
display: inline-block;
border-radius: 50px;
vertical-align: top;
margin-top: 7px;
position: relative;
}
.group-action a.dropdown-toggle .dot::before {
    content: "";
    width: 4px;
    height: 4px;
    display: inline-block;
    vertical-align: top;
    margin-right: 6px;
    position: absolute;
    left: -6px;
    background: #bfbfbf;
    border-radius: 15px;
}
.group-action a.dropdown-toggle .dot::after {
    content: "";
    width: 4px;
    height: 4px;
    display: inline-block;
    vertical-align: top;
    margin-right: 6px;
    position: absolute;
    left: 6px;
    background: #bfbfbf;
    border-radius: 15px;
}
.chat-user-list ul li.group-chat .group-action.dropdown {
    float: right;
    position: absolute;
    right: 10px;
    top: 23px;
}
.chat-user-list ul li.group-chat .dropdown-item {
    text-align: right;
    padding: 3px 10px;
}
.chat-user-list ul li.group-chat .dropdown-item a {
    font-size: 12px;
    color: #222;
}
.chat-user-list ul li.group-chat .dropdown-item a:hover {
    color: #35b31c;
}
 .chat-user-list ul li.group-chat .u-info h5 {
    padding-right: 25px;
     white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.chat-user-list ul li.group-chat .dropdown-item:hover{ background: none;}
.chat-user-list ul li.group-chat .dropdown-menu{ min-width: 7rem;}
.chat-loop {
    position: relative;
}
/* Group Chat Action CSS END*/
/* Edit Group */
.group-member-search {
    padding: 15px 20px 5px;
    background: #f9f9f9;
}
.group-member-search .form-control {
    border: 0;
        border-bottom-color: currentcolor;
        border-bottom-style: none;
        border-bottom-width: 0px;
    box-shadow: none;
    background: none;
    font-size: 16px;
    border-bottom: 1px solid #ccc;
    border-radius: 0;
    padding-left: 0;
    padding-right: 0;
}
.group-member-search .form-control::placeholder{ font-size: 16px;}
.edit-group-modal .modal-title{ /*display: block; text-align: center; */font-weight: 600; font-size: 22px;}
.edit-group-modal .chat-user-list{ box-shadow: none; max-height: 35vh; position: relative;}
.edit-group-modal .chat-user-list ul li {
    padding: 5px 10px;
    overflow: hidden;
    cursor: inherit;
    border-bottom: 1px solid #ededed;
}
.edit-group-modal .u-info {
    margin-top: 17px;
    width: calc(100% - 100px);
    float: left;
}
.edit-group-modal .form-checkbox {
    float: right;
    margin-top: 15px;
}
.g-title input[type=text] {
    border: 0;
    font-size: 22px;
    font-weight: 500; width: 100%;
}
.g-title input[type=text]:focus{ border: 0; outline: 0;}
.g-title {
    width: 100%;
}
/* Edit Group End*/
/* Add Group Button */
button.add-gp-btn {
    background: #f7f7f7;
    border: 1px solid #ccc;
    color: #3c3c3c;
    font-size: 10px;
    border-radius: 15px;
    position: relative;
    z-index: 999;
    float: right;
    margin-right: 27px;
    font-weight: 600;
    margin-top: 3px;
}
button.add-gp-btn:hover {
    background: #4950c4;
    border: 1px solid #4950c4;
    color: #fff;
    font-size: 10px;
}

/* Add Group Button End*/

.g-title input::placeholder {
    font-size: 22px;
}
.g-title .error {
    font-size: 12px;
	color:#FF0000;
}

#chatGroupModal .modal-footer {
    display: block;
    position: relative;
    height: 50px;
}
#chatGroupModal .modal-footer .btn {
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
}
#chatGroupModal .modal-dialog {
    max-width: 500px;
}
.gx-sidebar{z-index: 1040 !important;}

#chatGroupModal .alert {
padding: 10px 14px;
border-radius: 2px;
position: relative;
margin-left: 15px;
margin-right: 15px;
display:none;
}
#chatGroupModal .modal-header {
border-bottom: 0px solid #e9ecef;
}

button.del-btn {
    position: absolute;
    right: 8px;
    top: 8px;
    border: 0;
    background: none;
    color: #666;
    font-size: 18px;
}
/* Button Fixes 08-06*/
.group-detail {
    width: calc(100% - 30px);
    float: left;
}
button.add-gp-btn {
    margin-right: 37px;
    margin-top: -28px;
    z-index: 1;
}

/* Button Fixes 08-06*/

/*DGPOS*/
.sidebar-src-box {
    background: #192226;
    padding: 15px 10px;
}
.search-box input[type="text"] {
    height: 38px;
    float: left;
    border: 1px solid #fff;
    background: #fff;
    border-radius: 30px 0px 0px 30px;
    padding-left: 10px;
    padding-right: 10px;
    width: calc(100% - 80px);
}
.search-box button {
    background: #35b31c;
    color: #fff;
    height: 38px;
    width: 80px;
    text-align: center;
    border-radius: 0px 30px 30px 0px;
    font-weight: 500;
}
.header-btn-grp {
    display: inline-block;
    vertical-align: top;
    margin-left: 10px; float: right; margin-bottom: 5px;
}
.sidebar-src-box h3{ color: #fff; font-weight: 500; float: left;  margin-top: 5px;}
.search-box {
    display: inline-block;
    vertical-align: top;
}
.header-btn-grp button {
    background: none;
border: 0;
padding: 0px;
margin: 3px;
font-size: 26px;
line-height: 1;
color: #35b31c;
}
.user-profile .user-avatar {
    max-width: 40px;
    height: auto !important;
}
.btn.remove-btn {
    margin: 0;
    background: #e80935;
    color: #fff;
    font-size: 12px;
    padding: 4px 7px;
    border-width:1px;
}
.btn.remove-btn:hover {
    margin: 0;
    background: #35b31c;
    color: #fff;
    font-size: 12px;
    padding: 4px 7px;
    border-width:1px;
}
.btn.remove-btn:focus {
   background: #35b31c;
    border-width:1px;
}

.btn.left-move-btn {
    margin: 0;
    background: #1049a2;
    color: #fff;
    font-size: 12px;
    padding: 4px 7px;
    border-width:1px;
}
.btn.left-move-btn:hover {
    margin: 0;
    background: #35b31c;
    color: #fff;
    font-size: 12px;
    padding: 4px 7px;
    border-width:1px;
}
.btn.left-move-btn:focus {
   background: #35b31c;
    border-width:1px;
}
.btn.order-type-btn {
    background: #35b31c;
    color: #fff;
    font-weight: 500;
    font-size: 18px;
    margin-right: 3px;
    padding: 12px 17px;
    border-top: 2px solid #45d02a;
    border-left: 2px solid #45d02a;
    border-bottom: 2px solid #30931c;
    border-right: 2px solid #30931c;
    border-radius: 5px;
}
#product-table .table-responsive{ height: 250px; overflow-y: auto;}

.order-detail-col {
    background: #eaeaea;
    margin-top: -10px;
    margin-bottom: -10px;
    padding: 13px 20px;
}
.order-detail-col ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
.order-detail-col ul li {
    width: 49%;
    display: inline-block;
    vertical-align: top;
}
.order-detail-col ul li:nth-child(2n) {
    padding-left: 10px;
}
.btn{ border-radius: 5px;/* border-top: 3px solid rgba(255, 255, 255, 0.25);
border-left: 3px solid rgba(255, 255, 255, 0.25);
border-bottom: 3px solid rgba(0, 0, 0, 0.20);
border-right: 3px solid rgba(0, 0, 0, 0.20);*/}

.btn:focus{ border-radius: 5px; /*border-top: 3px solid rgba(255, 255, 255, 0.0);
border-left: 3px solid rgba(255, 255, 255, 0.0);
border-bottom: 3px solid rgba(0, 0, 0, 0.0);
border-right: 3px solid rgba(0, 0, 0, 0.0);*/}

.btn.order-action-btn {
    width: 100%;
    background: #1049a2;
    color: #fff;
    height: 50px;
    padding: 5px 20px;
    font-weight: 500;
    margin: 0;
    white-space: normal;
    font-size: 18px;
    text-align: left;
    border: 0;
    margin-bottom: 7px;
}
.btn.order-action-btn:focus, .btn.order-action-btn:hover {
    border: 0;
    background: #0a3577;
}
.btn.order-action-btn img {
    /*height: 49px;*/
}
.four-btns li {
    list-style: none;
    width: 25%;
    float: left;
    padding: 5px;
}
.two-btns li {
    list-style: none;
    width: 50%;
    float: left;
    padding: 5px;
}
.four-btns li, .two-btns li {
    list-style: none;
}
.four-btns, .two-btns{
    padding: 0; margin: 0; overflow: hidden;
}
.two-btns {
    margin-left: -5px;
    margin-right: -5px;
}

.calc button {
    width: 70px;
    height: 53px;
    margin: 5px;
    font-size: 20px;
    font-weight: 500;
    border: 1px solid #e3e3e3;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.06); 
}
.calc button:focus {
   
    border: 1px solid #1049a2;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15); 
}
.calc {
    width: 260px;
    float: left;
    padding-right: 25px;
}
.calc-right {
    width: calc(100% - 260px);
    float: left;
}
.calc-info ul {
    padding: 0;
    list-style: none;
    margin-bottom: 5px;
}
.calc-info ul li span {
    width: 120px;
    display: inline-block;
    vertical-align: top;
}
.calc-info ul li.b-amount span {
    width: 150px;
}
.calc-info ul li strong {
    text-align: right;
    width: calc(100% - 130px);
    display: inline-block;
}
.calc-info ul li.g-total strong {
    font-size: 28px;
}
.calc-info ul li {
    padding: 5px 0px;
    border-bottom: 1px solid #eee;
    font-size: 14px; overflow: hidden;
    position: relative;
}

.calc-info ul li.g-total {
    color: #e80909;
    font-size: 18px; border: 0; margin-top: 5px; border-bottom: 1px solid #dfdfdf;
}
.calc-info ul li.b-amount {
   font-size: 18px;
color: #1049a2;
border-top: 1px solid #eee;
border-bottom: 0;
}
.calc-info ul li.b-amount strong{
   font-size: 24px;
    font-weight: 600;
    width: calc(100% - 160px);
}
.calc-info ul li span {
    width: 120px;
    display: inline-block;
    vertical-align: top;
}
.btn.pay-btn {
    width: 100%;
    height: 50px;
    font-size: 22px;
    padding-left: 2px;
    padding-right: 0px;
    text-transform: inherit;
    font-weight: 600;
    background: #e80935;
    color: #fff;
    white-space: normal;
line-height: 1.1;
    border-radius: 50px;
    letter-spacing: 0.5px;
}
.btn.pay-btn:focus {
    background: #d2002a;
    color: #fff;
}
.btn.pay-btn.pay-btn-dish {background:#ff8329;
}
.btn.pay-btn.pay-btn-dish:focus {background:#e86709;
}
.discount-box {
    background: #f9f9f9;
    padding: 10px;
    overflow: hidden;
    border-bottom: 1px solid #ececec;
    margin-bottom: 12px;
    border-radius: 3px;
}
.discount-field input[type="text"] {
    height: 40px;
    float: left;
    border: 1px solid #e6e6e6;
    background: #fff;
    border-radius: 3px 0px 0px 3px; padding: 0px 4px; width:calc(100% - 100px)
}
.discount-field button {
    background: #35b31c;
    color: #fff;
    height: 40px;
    width: 100px;
    text-align: center;
    border-radius: 0px 3px 3px 0px;
}
.disc {
    width: 100%;
    float: left;
}
.disc-check {
    width: 150px;
    float: left;
}
.discount-field {
    width: calc(100% - 150px);
    float: left;
}
.d-box-btns {
    padding: 0;
    margin: 0;
    list-style: none;
    width: 100%;
    float: right;
}
.d-box-btns li {
    margin-bottom: 10px;
    width: 33.33%;
    float: left;
    padding: 5px;
}
.btn.print-btn {
    padding: 0;
    background: no-repeat;
    border: 0;
    color: #666;
}
.modal-dialog {
    margin: 1rem auto;
}
#product-table .table, #HoldOrder .table{ margin-bottom: 0;}
#paymentModal .modal-dialog{/* max-width: 700px;*/}

.p-mode label {
    background: #fbfbfb;
    padding: 8px 11px 8px 8px;
    border-radius: 25px;
    position: relative;
    cursor: pointer;
    min-width: 120px;
}
.p-type {
    width: auto;
    display: inline-block;
    margin-right: 6px;
    margin-bottom: 6px;
}
.p-mode label::before {
    content: "";
    width: 20px;
    height: 20px;
    display: inline-block;
    background: #e3e3e3;
    vertical-align: middle;
    margin-right: 4px;
    border-radius: 50px;
    font-family: fontawesome;
    text-align: center;
    font-size: 10px;
    line-height: 21px;
}
.p-mode input[type=radio]{
    position: absolute;
    z-index: -1;
    opacity: 0;
}
.p-mode input:checked + label {
    background: #35b31c;
    color: #fff;
}
.p-mode input:checked + label:before {
    background: #fff; color: #000; content: "\f00c";
}

/* CUstom Radio*/


.custom-radio-check label {
    background: #fbfbfb;
    padding: 8px 11px 8px 8px;
    border-radius: 25px;
    position: relative;
    cursor: pointer;
}
.custom-radio-check {
    /*width: auto;
    display: inline-block;
    margin-right: 6px;
    margin-bottom: 10px;*/
}
.custom-radio-check label::before {
    content: "";
    width: 20px;
    height: 20px;
    display: inline-block;
    background: #e3e3e3;
    vertical-align: middle;
    margin-right: 4px;
    border-radius: 50px;
    font-family: fontawesome;
    text-align: center;
    font-size: 10px;
    line-height: 21px;
}
.custom-radio-check input[type=radio]{
    position: absolute;
    z-index: -1;
    opacity: 0;
}
.custom-radio-check input:checked + label {
    background: #35b31c;
    color: #fff;
}
.custom-radio-check input:checked + label:before {
    background: #fff; color: #000; content: "\f00c";
}


 .pay-dish .table td, .pay-dish .table th {
    padding: 5px 5px; font-size: 14px;
}
.pay-dish {
    min-height: 120px;
    border: 1px solid #f4f4f4;
    padding: 5px; background: #fdfdfd;
}
.table{ margin-bottom: 0;}
#splitPayment h3 {
    margin-bottom: 5px;
    font-size: 14px;
    color: #1049a2;
    font-weight: 500;
}
.spilit-field label {
    display: inline-block;
    margin-right: 10px;
}
.spilit-field .form-control {
    width: 100px;
    display: inline-block;
}
.spilit-field .btn {
    margin-bottom: 0;
}
.sp-title h3 {
    background: #1049a2;
    color: #fff;
    padding: 10px;
    border-radius: 3px;
}
.inline-form .form-control
{
    width: calc(100% - 100px);
    display: inline-block;
}
.inline-form label {
    width: 80px;
    display: inline-block;
}
.btn.ok-btn {
    background: #35b31c;
   /* width: 100%;*/ color: #fff;
    height: 50px;
font-weight: 500;
font-size: 20px;
    transition: all ease 0.3s;
}.btn.ok-btn:hover {
    background: #2d9918;
   transition: all ease 0.3s;
}
.btn.cancel-btn {
    /*width: 100%;*/
    height: 50px;
font-weight: 500;
font-size: 20px;
    background: #444;
    color: #fff;
}
.btn.cancel-btn:hover {
    background: #222;
    transition: all ease 0.3s;
}

@media(min-width:992px) and (max-width:1250px){
    .two-btns li {
   /* width: 100%;
    float: left;*/
}
    .calc-right {
    width: 100%;
}
     .calc {
    float: none;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}
    .four-btns li {
    width: 33.33%;
}
.btn.order-type-btn {

    width: calc(33.33% - 6px);

}
    .order-detail-col ul li {
    width: 100%;
}
    .order-detail-col ul li:nth-child(2n) {
    padding-left: 0px;
}
    .discount-field button {
    width: 75px;
}
    .discount-field input[type="text"] {
    width: calc(100% - 75px);
}
    .discount-field {
    width: calc(100% - 110px);
}
    .disc-check {
    width: 110px;
}
}
@media(min-width:768px) and (max-width:991px){
    .btn.order-type-btn {
    width: calc(33.33% - 6px);
}
    .four-btns li {
    width: 50%;
    }
    .discount-field {
    width: 100%;
}
    .calc-right {
    width: 100%;
}
    .calc {
    float: none;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}
    #product-table .table-responsive-sm {
    height: auto;
}
}
@media(max-width:767px){
    .btn.order-type-btn {
    width: calc(50% - 6px);
}
    .order-detail-col ul li {
    width: 100%;
    display: inline-block;
    vertical-align: top;
    margin-bottom: 6px;
}
    .order-detail-col ul li:nth-child(2n) {
    padding-left: 0;
}
    #product-table .table-responsive-sm {
    height: auto;
}
    .gx-toolbar{ padding-left: 5px; padding-right: 5px;}
}
@media(max-width:575px){
    .order-detail-col {
    margin-top: 10px;
}
    .btn.order-type-btn {
    width: calc(33.33% - 6px);
}
    .four-btns li {
    width: 50%;
}
    .calc-right {
    width: 100%;
}
    .calc {
    width: 260px;
    float: none;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}
    .search-box {
   
    width: calc(100% - 85px);
}
    .header-btn-grp {
    width: 70px;
}
    .search-box input[type="text"] {
    width: calc(100% - 100px);
}
    .sidebar-mobile-menu {
    bottom: 10px;
}
    .header-notifications > li.dh {
    width: calc(100% + 45px);
}
}

@media(max-width:479px){
   
    .btn.order-type-btn {
    width: calc(50% - 6px);
}
}


/* Login*/

html body .flexbox-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100vh;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: url(../images/login-bg.jpg) no-repeat center center/cover #8fc9b1;
}
.card.bg-authentication {
    box-shadow: -8px 20px 25px 0 rgba(25,42,70,.3);
}
.bg-authentication {
    background-color: #F2F4F4;
}
.bg-authentication .disable-rounded-right {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}
#auth-login .card{ border: 0;}
#paydishPayment .modal-body, #paymentModal .modal-body{
    max-height: calc(100vh - 90px);
    overflow-y: auto;
}
@media(max-width:991px){
    #product-table .table-responsive {
    height: auto;

    }
}

/* Product serach*/
.product-search-box{background: #fff;
margin-left: 260px;
padding: 5px 10px 5px 20px;
width: 600px;
border-radius: 50px;}
.product-search-box input[type="text"] {
    width: calc(100% - 30px);
    border: 0;
    background: transparent;
    color: #000;
}
.product-search-box input[type="text"]:focus-visible {
   border: 0; outline: 0;
}
.product-search-box button {
    padding: 0;
    border: 0;
    background: transparent;
    color: #646464;
    font-size: 18px;
    width: 25px;
}
.user-name a {
    color: #fbfbfb;
    font-size: 14px;
    font-weight: 500;
}
.user-profile .fa-user-circle {
    font-size: 30px;
    color: #dfdfdf;
}
/*.right-sidedebar{width: 410px;  position: absolute;
    right: 20px;
    top: 20px; float: right;}*/

#sidebar{width: 410px; float: right; height: 750px !important;}

.right-side {
    width: 100%;
    background: #fff;
    display: inline-block;
    float: right;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); border-radius: 20px 20px 5px 5px; padding-bottom: 10px;
}
.mid-screen {
    width: calc(100% - 420px);
    display: inline-block;
    vertical-align: top;
}
.p-list ul {
    margin: 0;
    padding: 0;
}
.p-list ul li {
    list-style: none;
}
.p-list ul li {
    list-style: none;
    background: #fff;
    padding: 10px;
    text-align: center;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.03);
    width: 200px;
    display: inline-block;
    margin: 8px;
    height: 180px;
    vertical-align: top;
    border-radius: 6px;
    position: relative;
    overflow: hidden;
    background-position: center;
background-size: cover; border: 3px solid #fff;
}
.p-list ul li h3{ font-size: 15px;
font-weight: 500;
/*position: absolute;
bottom: 29px;*/
width: 100%;
/*background: rgba(255, 255, 255, 0.9);
left: 0;*/
margin-bottom: 0px;
padding-top: 8px;
padding-bottom: 1px; text-align: left; padding-left: 10px; padding-right: 10px;}

.p-box {
/* position: absolute;
bottom: 0;*/
color: #5a8a21;
font-weight: 500;
font-size: 16px;
width: 100%;
text-align: left; padding-left: 10px; padding-right: 10px;
/*background: rgba(255, 255, 255, 0.9);
left: 0;*/
padding-bottom: 5px;
}
.p-info {
    background: rgba(255, 255, 255, 0.9);
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 72px;
    left: 0;
}

.p-qty {
    width: 100%;
    height: 100%;
    background:rgba(53, 179, 28, 0.85);
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transition: all ease 0.3s;
}
.p-list ul li:hover .p-qty {
    opacity: 1; transition: all ease 0.3s;
}
.p-qty .input-group {
    width: 100px;
    background: #fff;
    border-radius: 50px;
    margin-top: 50px;
    margin-left: 25px;
}
.p-qty .input-group .button-minus, .p-qty .input-group .button-plus {
    background: none;
    border: 0;
    font-weight: 700;
    font-size: 25px;
    padding: 0px;
    width: 30px;
    height: 45px;
}
.p-qty .quantity-field {
    width: 40px;
    border: 0;
    height: 45px;
    text-align: center;
}
.p-qty .input-group .button-plus {
    font-size: 20px;
}
.right-or-detail {
    padding: 20px;
    border-bottom: 1px solid #e8e8e8;
}
.right-or-detail h3 {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 5px;
}
.order-items-list {
    padding-top: 10px;
    padding-bottom: 10px;
}
.right-or-detail h4 {
    margin: 0;
}
.right-or-detail h3 span {
    background: #253238;
font-size: 16px;
padding: 5px 15px;
font-weight: 500;
border-radius: 50px;
vertical-align: middle;
color: #fff;
}
.order-item-name {
    width: calc(100% - 200px);
    float: left; padding-left: 10px;
padding-right: 10px;  font-weight: 500;
}
.order-item-qty {
    /*width: 18%;*/
    width: 100px;
    float: left;
    text-align: center;
    font-weight: 500;
}
.order-item-total {
    width: 70px;
    float: left;
    text-align: left;  font-weight: 500; font-size: 18px;
}
.order-item-action {
   width: 30px;
float: left;
padding-left: 0px;
padding-right: 0px;
}
.order-item-action a {
    background: #e80935;
font-size: 14px;
color: #fff;
padding: 3px 6px;
border-radius: 3px;
margin-top: 2px;
display: inline-block;
}
.order-item-name span {
    display: block;
    font-size: 12px;  font-weight: 400; margin-bottom: 2px;
}
.order-item {
    overflow: hidden;
    padding-top: 13px;
    padding-bottom: 13px;
    background: #fff;
    transition: all ease 0.3s;
     border-bottom: 1px dashed #ccc;
}
.order-item:hover {
    overflow: hidden;
    background: #35b31c;
    color: #fff;
    transition: all ease 0.3s;
}
.total-info {
   /* border-top: 1px solid #eee;*/
    padding-top: 10px;
    padding-left: 14px;
    padding-right: 15px;
}
.g-total {
    border-top: 1px solid #eee;
    padding-top: 10px;
    padding-left: 14px;
    padding-right: 15px;
    font-size: 20px;
    margin-top: 15px;
}
.order-pay {
    padding: 15px;
}
.order-pay-btn {
    background: #35b31c;
    width: 100%;
    color: #fff;
    border-radius: 50px;
    height: 48px;
    font-size: 22px;
    letter-spacing: 1px;
    font-weight: 600;
    transition: all ease 0.3s;
}
.order-pay-btn:hover{background: #2d9918; transition: all ease 0.3s;}
.order-pay-btn .fa-arrow-right {
    float: right;
    margin-top: 7px;
    font-size: 17px;
    margin-right: 10px;
}
.order-item-name h4 {
    font-weight: 500;
    margin-bottom: 5px; font-size: 14px;
    white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
h3.title {
    text-align: left;
    margin-left: 5px;
    font-weight: 500;
    border-bottom: 2px solid #35b31c;
    display: inline-block;
    color: #333;
    font-size: 28px;
}
#MainMenuSidebar .side-sub-menu{ display: none !important}
input.quantity-field {
    width: 52px;
    display: inline-block;
    border: 0;
    float: left;
    text-align: center;
    background: none;
    margin-left: -5px;
}
.button-minus, .button-plus {
    height: 32px;
    width: 30px;
    text-align: center;
    padding: 0;
    line-height: 20px;
    font-weight: 700;
    border: 0;
    background: #eeeeee;
    border-radius: 5px;
    display: inline-block;
    float: left;
    cursor: pointer;
    font-size: 18px;
}
.button-minus{
    font-size: 24px;
}
.button-plus {
    margin-left: -20px; position: relative;
z-index: 9;
}
.order-item:hover input.quantity-field {
    color: #fff !important;
}
.options-btn {
    background: #e43a32;
    color: #fff;
    font-size: 12px;
    padding: 4px 15px;
    border-radius: 25px;
    display: inline-block;
    margin-right: 5px;
    margin-bottom: 3px;
}
.options-btn:hover {
    text-decoration: none;
    background: #e32118;
    color: #fff;
}
.disc-btn{
    background: #35b31c;
    color: #fff;
    font-size: 12px;
    padding: 4px 12px;
    border-radius: 25px;
    display: inline-block;
    margin-right: 0px;
}
.disc-btn:hover, .order-item:hover .disc-btn {
    text-decoration: none;
    background: #fff;
    color: #000;
}
.left-options-btn {
    background: #fff;
    color: #000;
    padding: 6px 20px;
    border-radius: 50px;
    font-size: 16px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.43);
}
.left-options-btn:hover {
    background: #fff;
    color: #000;
    text-decoration: none;
}
.btn.update-btn {
    background: #e43a32;
    color: #fff;
    font-weight: 500;
    font-size: 20px;
    padding: 10px 20px;
}
.mod-footer {
    border-top: 1px solid #eee;
    padding-top: 20px;
    margin-left: -16px;
    margin-right: -16px;
    background: #fbfbfb;
    padding-bottom: 15px;
    margin-bottom: -16px;
    border-radius: 0px 0px 7px 6px;
}
.inline-radio .custom-radio {
    display: inline-block;
    vertical-align: top;
    margin-right: 20px;
    cursor: pointer;
}
#discountBox .disc {
    margin-bottom: 20px;
    margin-top: 10px;
}
.calc-right .disc-btn {
    padding-top: 3px;
    padding-bottom: 3px;
}
.calc-right .disc-btn:hover {
    background: #2b9116; color: #fff;
}
.two-btn-set .btn.order-action-btn {
    width: 50%;
    float: left;
    border-left: 1px solid rgba(255, 255, 255, 0.21); text-align: center;
}
.two-btn-set .btn1 {
    border-radius: 50px 0 0 50px;
}
.two-btn-set .btn2 {
    border-radius: 0px 50px 50px 0px;
}
.two-btn-set #PayDishBtn{background: #062b64;}
#paymentModal .p-mode {
    border-bottom: 1px solid #f4f4f4;
}   
#paymentModal #paydish .p-mode{ border: 0;}

.paybleamount {
    background: #f2f2f2;
/*margin-right: 18px;*/
padding: 8px 20px 15px;
margin-left: 5px;
border-radius: 10px;
margin-bottom: 10px;
font-size: 44px;
font-weight: 700;
color: #333;
}
.paybleamount input[type="text"] {
    width: 150px;
    border: 0;
    font-size: 39px;
    border-radius: 5px;
    padding: 5px 15px;
    font-weight: 500;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.11) inset;
}
.right-sidedebar .disc {
    background: #fbfbfb;
    padding: 12px;
    font-size: 16px;
}
.right-sidedebar .disc .inline-radio {
    width: 150px;
    float: left;
    font-size: 15px;
    font-weight: 500;
}
.t-coupon span {
    background: #eee;
    padding: 2px 4px;
    font-size: 12px;
    font-weight: 500;
    border: 1px dashed #666;
}
.addon-total.mr-2 {
    display: inline-block;
    font-size: 20px;
    font-weight: 400;
}
.addon-total.mr-2 span {
    font-weight: 600;
    color: #e43a32;
    font-size: 26px;
}
.side-cart{ display: none;}

@media(min-width:992px) and (max-width:1150px){
    #sidebar {
    width: 380px;
}
    .mid-screen {
    width: calc(100% - 390px);
}
    .p-list ul li {
    width: calc(50% - 12px);
    margin: 4px;
}
    .p-list ul li h3 {
    font-size: 14px;
}
    .p-mode label {
    min-width: 110px;
}
}
@media(min-width:768px) and (max-width:991px){
    .p-list ul li {
    width: 155px;
}
    .mid-screen {
    width: calc(100% - 375px);
}
    #sidebar {
    width: 370px;
}
   .p-mode label {
    min-width: 110px;
    font-size: 13px;
}
}
@media(max-width:991px){
 .options-btn, .disc-btn {
    padding: 2px 10px;
}   
}
@media(max-width:767px){
    .side-cart {
   background: #35b31c;
color: #fff;
padding: 0;
border-radius: 5px 0px 0px 5px;
margin-left: -50px;
margin-top: 0px !important;
position: absolute;
width: 40px;
text-align: center;
height: 40px;
line-height: 40px;
display: block;
}
    
    .side-cart:hover {
    background: #333;
    color: #fff;
        text-decoration: none;
}
    .side-cart .fa-times{ display: none;}
    .side-cart.active .fa-times{ display: inline-block;}
    .side-cart.active .fa-shopping-cart{ display: none;}
    
    .product-search-box {
    margin-left: 10px;
}
     .p-list ul li {
    width: 155px;
}
    .mid-screen {
    width: 100%; text-align: center; margin-bottom: 30px;
}
    h3.title {
    font-size: 24px;
}
   /* #sidebar {
    width: 100%;
    float: right;
    height: auto!important;
}*/
    #sidebar {
    width: 430px;
    float: right;
    height: auto !important;
    position: fixed;
    right: -430px;
    top: 50px;
    background: #fff;
    padding: 10px;
        transition: all ease 0.5s; box-shadow: 0px 0px 20px rgba(0, 0, 0, 0); padding-top: 20px;
        /*overflow-y: scroll;
max-height: calc(100vh - 50px);*/
}
     #sidebar.open {
    right: 0px;
         transition: all ease 0.5s; box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
}
    
    .p-list ul {
    text-align: center;
}
    .p-list ul li {
    width: 160px;
}
    .p-mode label {
    padding: 8px 10px 8px 8px;
    min-width: 110px;
}
    .p-list ul li h3 {
    font-size: 12px;
}
    .right-side {
    box-shadow: none;
    border-radius: 0;
    border-top: 1px dashed #cecece;
    padding-top: 10px;
}
   
    .order-item {
    padding-left: 10px;
    padding-right: 10px;
        background: #fbfbfb;
border-bottom: 1px solid #eee;
}
    .right-or-detail {
    padding: 15px 0px;
    border-bottom: 1px dashed #e8e8e8;
}
    .order-items-list {
    margin-left: -10px;
    margin-right: -10px;
}
}
@media(min-width:480px) and (max-width:599px){
    .p-list ul li {
    width: calc(33% - 10px);
    margin: 4px;
}
}
@media (max-width:479px){
    #sidebar {
    width: 300px;
    right: -300px;
}
     .order-item-name {
    width: 100%;
    float: left;
    padding-left: 0;
    padding-right: 0;
        margin-bottom: 5px;
}
    .p-list ul li {
    width: calc(50% - 10px); margin: 4px;
}
    .discount-field input[type="text"] {
    width: calc(100% - 70px);
}
    .discount-field button {
    width: 70px;
}
    .right-sidedebar .disc .inline-radio {
    width: 120px;
}
    .discount-field {
    width: calc(100% - 120px);
}
}

/* Main Order Navigation*/
.main-links ul {
    padding: 0;
    list-style: none;
}

.main-links ul li {
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 10px;
}
.main-links ul li a.m-btn,
.main-links ul li button.m-btn {
    background: #35b31c;
    color: #fff;
    padding: 10px;
    display: block;
    width: 150px;
    font-size: 16px;
    border-radius: 10px;
    font-weight: 500; text-align: center; box-shadow: 0px 5px 2px rgba(0, 0, 0, 0.07);
    transform: scale(1);
transition: all ease 0.5s;
}
.main-links ul li a.m-btn:hover,
.main-links ul li button.m-btn:hover{
text-decoration: none;
transform: scale(1.03);
transition: all ease 0.5s;
background: #253238;
}
.main-links ul li img {
    width: 50px;
    margin-bottom: 5px;
margin-top: 0px;
}

.order-item-action a.order-note {
    background: #475257;
}
input[type="text"]:focus {
    border-color: #35b31c;
    box-shadow: none;
    outline: none;
}
.p-mode-option {
   /* background: #35b31c;
    padding: 10px;
    display: inline-block;
    vertical-align: top;
    margin-right: 20px;
    margin-bottom: 10px;
    border-radius: 5px;
    color: #fff;
font-size: 16px;*/
    width: 100%;
float: left;
/*border: 1px solid #f2f2f2;*/
padding: 15px;
    background: #fdfdfd;
border-radius: 10px;
    box-shadow: 0px 15px 20px rgba(0, 0, 0, 0.0); transition: all ease 0.5s;
}
.p-mode-option:hover{box-shadow: 0px 15px 20px rgba(0, 0, 0, 0.08); transition: all ease 0.5s; background: #fff;}
.p-mode-option input[type=text] {
  width: 80px;
height: 35px;
border: 1px solid #1049a2;
border-radius: 3px 0px 0px 3px;
font-size: 18px;
vertical-align: top;
    padding: 5px;
}
.p-mode-option label {
vertical-align: top;
line-height: 1.2;
display: block;
/*color: #35b31c;*/
font-size: 16px;
}
.p-mode-option span {
    font-size: 24px;
    margin-left: 5px;
    margin-right: 5px;
    vertical-align: middle;
    line-height: 1;
}
.p-mode-option button {
   /* background: #35b31c;*/
color: #fff;
height: 35px;
padding: 0px 10px;
margin-left: -5px;
font-weight: 500;
border-radius: 0px 3px 3px 0px;
}
.p-mode-option button.btn-block {
border-radius: 3px 3px 3px 3px;
}
.p-mode-option img {
    /*height: 40px;*/
    width: 26px;
}
.p-mode-options {
    background: #eee;
    margin-top: -15px;
    padding-top: 15px;
    margin-left: -15px;
    margin-right: -15px;
    padding-bottom: 10px;
}
h3.gift-bal-amount {
    font-weight: 700;
    font-size: 24px;
}
.refund-gray-bg {
    background: #f7f7f7;
    margin-top: -15px;
    padding: 20px 5px;
    margin-left: -15px;
    margin-right: -15px;
}
.w-80 {
    width: 80px;
    display: inline-block;
}
.fl-right{ float: right;}
.hasDatepicker{ background-image: url(../images/calendar.svg);
background-repeat: no-repeat;
background-position: 95% center;
background-size: 14px;}
.btn-sm{
    padding: 0.25rem 0.5rem !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}
.move-gray-bg {
    background: #f7f7f7;
    padding: 15px;
    border-radius: 5px 5px 0 0;
}
.move-gray-bg h3 strong {
    color: #35b31c;
    font-size: 22px;
}
#move-accordion .card {
    border: 0;
    padding: 0;
    margin-bottom: 10px;
}
#move-accordion .btn.order-action-btn {
    background: #35b31c;
}
#move-accordion .btn.order-action-btn.collapsed {
    background: #1049a2;
}
ul.table-list {
    padding: 0;
    list-style: none;
}
ul.table-list li {
    display: inline-block;
    margin: 4px;
}
ul.table-list li .btn {
    font-weight: 600;
    border-radius: 100px;
    padding-left: 20px;
    padding-right: 20px;
    font-size: 16px;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: #32408f;
    border-color: #32408f;
}
ul.table-list li .btn.active, ul.table-list li .btn:hover {
    background-color: #35b31c !important;
    border-color: #35b31c !important;
}
.calc-info ul li.pay-dish-disc .disc-check label {
    font-size: 12px;
    font-weight: 500;
}
.calc-info ul li.pay-dish-disc .disc-check .custom-control {
    min-height: inherit;
}
.inline {
    display: inline-block;
    vertical-align: bottom; width: 155px;
}
.inline-amount {
    display: inline-block;
    width: calc(100% - 170px);
    border: 0;
        border-bottom-color: currentcolor;
        border-bottom-style: none;
        border-bottom-width: 0px;
    border-bottom: 2px solid #ccc;
    background: #f9f9f9;
    height: 46px;
    font-size: 24px;
    font-weight: 600;
    padding-left: 10px;
    padding-right: 10px;
    margin-left: 10px;
}
.p-mode-option span.amt {
    font-size: 20px;
}
.payble-amount {
    font-weight: 500;
    font-size: 24px;
}
.payble-amount span {
    font-weight: 700;
    font-size: 30px;
    color: #35b31c;
}
.gray-bg.p-3 {
    background: #f7f7f7;
    border-radius: 15px;
}
.btn.pay-btn.pay-btn-small {
    font-size: 16px;
    font-weight: 500;
    width: auto;
    padding: 0 20px;
    height: 40px;
}
@media(min-width:768px){
    .row.md-reverse {
    flex-direction: row-reverse;
}
}