body {
    /* font-family: 'Open Sans', sans-serif; */
    font-family: 'plex-sans', sans-serif;
    background: #f9fafa;
}
.dot-v {
    font-size: 30px;
    width: 50px;
}
.strength-icon {
    width: 15px !important;
    height: 15px !important;
}
.req-mod {
    font-size: 12px;
    font-weight: bold;
    color: #ff0000;
}
.disabled {
    pointer-events: none;
    cursor: default;
    opacity: 0.5;
}
.custom-input input {
    border: 1px solid #ddd;
    border-radius: 0px;
    height: 50px;
}
.custom-input label {
    font-size: 14px;
}
.custom-input textarea {
    border: 1px solid #ddd;
    border-radius: 0px;
}
.custom-btn {
    border-radius: 0px;
    height: 50px;
}
.input-group input {
    border-radius: 0px;
}
.input-group-text {
    border-radius: 0px;
}
.allergens-modal .modal-header .allergens-modal-close {
    border-radius: 0px;
    border: 1px solid #ffffff;
    background-color: #ffffff;
}
.shop-open-close-modal .modal-body .shop-open-close-img {
    width: 100%;
    height: 200px;
}
.shop-open-close-modal .modal-body .shop-modal-close {
    align-items: center;
    display: flex;
    justify-content: center;
    position: absolute;
    right: 22px;
    top: 18px;
    z-index: 3;
    border-radius: 0px;
    border: 1px solid #ffffff;
    background-color: #ffffff;
}
.card {
    border-radius: 0px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.form-control:focus {
    box-shadow: none !important;
}
.custom-logo {
    width: 130px;
}
.error {
    color: #ff0000;
}
.success {
    color: #008000;
}
.info-card {
    border-color: transparent;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.info-card-body {
    padding: 7px;
}
.info-card .title {
    font-size: 25px;
    font-weight: bold;
    text-align: center;
}
.info-card .offers {
    font-size: 16px;
    text-align: center;
}
.info-card .time-title {
    font-size: 14px;
    font-weight: bold;
    text-align: center;
}
.info-card .time {
    padding: 0px 10px 0px 10px;
    font-size: 14px;
    text-align: center;
}
.fixed-top-nav {
    padding: 17px;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1050;
    background-color: #ffffff;
    border: 1px solid #e8ebeb;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); 
}
.sticky-cat {
    position: sticky;
    top: 66px;
    background-color: #ffffff;
    z-index: 1;
    padding-left: 20px;
    padding-right: 20px;
}
.container-fluid {
    margin-top: 80px;
    padding-right: 0px !important;
    padding-left: 0px !important;
}
.content {
    margin: 5px 20px;
    padding: 5px 10px;
}
.navbar {
    padding: 0px;
}
.nav-btn {
    text-decoration: none;
    border-radius: 0px;
}
.search-container {
    display: block;
    position: relative;
}
.search-box-length {
    position: relative;   
    /*appearance: none;*/
    font-family: plex-sans;
    box-sizing: border-box;
    font-size: 16px;
    line-height: 24px;
    caret-color: #00ccbc;
    border: 1px solid #e8ebeb;
    border-radius: 4px;
    opacity: 1;
    transition-property: box-shadow;
    transition-duration: .15s;
    transition-timing-function: ease-out;
    height: 46px;
    width: 100%;
    padding: 12px 16px 12px 65px;
}
.search-box {
    display: flex;
    align-items: center;
}
.icon-position {
    position: absolute;
    color: #abadad;    
    top: 12px;
}
.search-icon {
    left: 30px;
}
.clear-icon {
    right: 15px;
    width: 70px;
    height: 30px;
    /*border: 1px solid #000000;*/
    text-align: center;
    vertical-align: middle
}
.clear-icon:hover {
    color: #ff0000;
}
.search-input-box .input-group-text {
    background: transparent !important;
}
.search-input-box .form-control:focus{
     border-color: #dee2e6 !important;
}
.search-input-box {
    width: 100%;
}
.search-btn {
    display: none !important;
}
.checkout-form {
    overflow: auto;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    height: 621px;
}
.checkout-cart {
    position: sticky;
}
.sticky-cart {
    position: sticky;
    top: 140px;
    background-color: #ffffff;
}
.product-content {
    position: relative;
}
.scrollable {
    overflow: auto;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    height: 72vh;
}
/*Scrollable Menu*/
.scrollable-container {
    position: relative;
    display: flex;
    align-items: center;
}
.scrollable-menu {
    white-space: nowrap;
    overflow-x: auto; /* Hides scrollbars */
    overflow-y: hidden;
    scroll-behavior: smooth; /* Enables smooth scrolling */
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on touch devices */
    scrollbar-width: none;
    padding-top: 20px;
    padding-bottom: 20px;
    margin-left: 15px;
    margin-right: 15px;
}
.dd-menu {
    padding-top: 17px;
    padding-bottom: 16px;
}
.scrollable-menu::-webkit-scrollbar {
    display: none;
}
.menu-item {
    display: inline-block;
    padding: 3px 10px;
    margin: 0 2px;
    background-color: transparent;
    color: #00b8a9;
    text-decoration: none;
    border-radius: 50px;
    font-size: 12px;
    font-weight: 700;
}

.menu-item.active {
    background-color: #00b8a9;
    color: #ffffff;
}
.dropdown-menu {
    padding: 0px;
}
.dropdown-menu.scrollable-menu {
    max-height: 450px;
    overflow-y: auto;
}
.dropdown-menu .menu-item {
    padding: 5px 10px;
    margin: 0px;
}
.dropdown-menu .menu-item.active {
    width: 100%;
    border-radius: 2px;
    background-color: #00b8a9;
    color: #ffffff;
}
.dropdown-menu li .menu-item.active {
    border: 0px;
}
.scroll-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    border: none;
    background: transparent;
    color: #00b8a9;
    width: 30px;
    height: 30px;
    border-radius: 5px;
    cursor: pointer;
}
.scroll-btn.left {
    left: -15px;
}
.scroll-btn.right {
    right: -15px;
}
.see-all-btn {
    color: #00b8a9;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    border: 1px solid #00b8a9;
    border-radius: 5px;
    padding: 4px 20px;
    width: 100%;
}
.see-all-btn:hover {
    background-color: #00b8a9;
    color: #ffffff;
}
.main-footer {
    background: #2e3333;
    padding: 25px 50px;
}
.footer-separator {
    margin-bottom: 15px;
}
.footer-content {
    background: #434848;
    padding: 20px;
    color: #ffffff;
    height: 100%;
    border-radius: 5px;
}
.footer-nav {
    list-style-type: none;
    margin: 0px;
    padding: 0px 5px;
}
.footer-nav li a {
    display: block;
    color: #ffffff;
    font-size: 14px;
    margin-bottom: 5px;
    text-decoration: none;
}
.mobile-apps {
    text-align: center;
}
.mobile-apps a {
    list-style-type: none;
    text-decoration: none;
}
.mobile-apps a img {
    width: 175px;
}
.social-media {
    display: flex;
    list-style-type: none;
    padding: 0px;
}
.social-media li a {
    color: #ffffff;
    margin-right: 10px;
    text-decoration: none;
}
.copyright {
    color: #ffffff;
    text-align: right;
}
.copyright a {
    list-style-type: none;
    text-decoration: none;
}
.category-info {
    margin-top: 20px;
    margin-bottom: 10px;
}
.category-info .title {
    color: #2e3333;
    font-size: 22px;
    font-weight: 700;
}
.category-info .description {
    color: #585c5c;
    font-size: 14px;
}
.product-card {
    height: 140px;
    border-color: transparent;
}
.product-card-body {
    display: flex;
}
.product-card-body .info {
    width: 90%;
    margin: 3px 15px 3px 3px;
    color: #2e3333;
}
.product-card-body .info .title {
    font-size: 18px;
    font-weight: bold;
    text-decoration: none;
    color: #2e3333;
}
.product-card-body .info .description {
    font-size: 13px;
    line-height: 18px;
    text-align: justify;
    color: #585c5c;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}
.product-card-body .info .price {
    font-size: 16px;
    font-weight: bold;
}
.product-card-body img {
    text-align: center;
    margin: 3px;
    width: 100px;
    height: 100px;
}
.product-card-body .action-btn {
    width: 10%;
    margin: 3px;
    text-align: center;
    vertical-align: middle !important;
}
.product-card-body .action-btn .add-btn {
    background: transparent;
    border: 1px solid #abadad;
    border-radius: 0px;
    width: 40px;
    height: 100%;
    max-height: 100px;
}
.product-card-body .action-btn .add-btn:hover {
    background: #c1c1c1;
    border: 1px solid #c1c1c1;
}
.product-card-body .action-btn .product-add-loader-img {
    width: 100%;
    height: 100px;
}

/* Deals Modal CSS Part Start */
.deals-modal .modal-header {
    padding: 0px;
}
.deals-modal .modal-body {
    padding: 0px;
    background: #f9fafa;
    border-radius: 6px;
}
.deals-modal .modal-body .info-block {
    margin-bottom: 10px;
    padding: 0px;
    overflow-x: auto;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    height: calc(100vh - 130px);
}
.deals-modal .modal-body .info-block .deals-modal-image {
    width: 100%;
    height: 315px;
    border-radius: 6px 6px 0px 0px;
    object-fit: cover;
    object-position: 100% 60%;
}
.deals-modal .modal-body .mod-close-btn {
    align-items: center;
    display: flex;
    justify-content: center;
    position: absolute;
    right: 22px;
    top: 18px;
    z-index: 3;
    border: 1px solid #ffffff;
    background-color: #ffffff;
}
.deals-modal .modal-body .info-block .info-body {
    padding: 10px 15px 0px 15px;
}
.deals-modal .modal-body .info-block .info-body .title {
    color: #2e3333;
    font-size: 22px;
    font-weight: bold;
}
.deals-modal .modal-body .info-block .info-body .description {
    color: #585c5c;
    font-size: 14px;
    font-weight: 400;
}
.deals-modal .modal-body .info-block .info-body .allergence {
    color: #2e3333;
    font-size: 14px;
    font-weight: bold;
}
.deals-modal .modal-body .info-block .info-body .contact {
    color: #00b8a9;
    font-size: 14px;
    font-weight: bold;
}
.deals-modal .modal-body .info-block .info-body .deal-item-card {
    background: #f9fafa;
}
/* deals product */
.deals-modal .product-card {
    height: 100%;
    border-color: #ffffff;
}
.deals-modal .product-card .card-header {
    display: flex;
    border: 0px;
}
.deals-modal .product-card .deal-product-header .deal-product-title {
    display: inline-flex;
}
.deals-modal .product-selection {
    border-top: 1px solid #cacaca;
    cursor: pointer;
    padding: 5px 0px 5px 0px;
    color: #ffffff;
    margin-right: 5px;
}
.deals-modal .product-selection:before {
    content: '☐';
    background: #bc0f11;
    padding: 8px 15px;
}
.deals-modal .product-selection:first-child {
    border-top: none;
}
.deals-modal .product-selection:last-child {
    border-bottom: 1px solid #cacaca;
}
.deals-modal .modifier-selection-block {
    border: 0px solid #00000020;
    margin: 5px;
    background: #f8f8f8;
}
.deals-modal .selected:before {
    color: #ffffff; content: '✔ ';
    background: #bc0f11;
    padding: 8px 15px;
}
.deals-modal .deal-items-div {
    text-align: right;
    flex: 1;
}
.deals-modal .deal-item-qty-div {
    display: block;
}
.deals-modal .deal-qty-text {
    padding: 0px 15px;
    font-size: 16px;
    font-weight: bold;
}
.deals-modal .deal-item-qty-div .deal-qty-btn {
    background: #ffffff !important;
    border: 3px solid #222222 !important;
    color: #222222 !important;
    width: 7% !important;
    height: 35px !important;
}
.deals-modal .deal-item-qty-div .dec-btn {
    border-radius: 10px 0px 0px 10px;
}
.deals-modal .deal-item-qty-div .inc-btn {
    border-radius: 0px 10px 10px 0px;
}
/* modifier */
.deals-modal .modifier-as-product {
    color: #2a3f54;
}
.deals-modal .modifier-as-product:not(:first-child) {
    border-top: 0px solid #00000020;
}
.deals-modal .modifier-as-product:first-child {
    border-top:none;
}
.deals-modal .modifier {
    border-bottom: 1px solid #00000020;
    width: 100%;
    padding: 10px 5px 10px 5px;
    vertical-align: -webkit-baseline-middle;
}
.deals-modal .modifier:last-child {
    border-bottom: none;
}
.deals-modal .modifier-price {
    margin-left: 5px;
    margin-right: 5px;
}
.deals-modal .modifier-total-price {
    margin-right: 0px;
}
.deals-modal .icon-img {
    height: 25px;
    width: 25px
}
.deals-modal .add {
    float: right;
}
.deals-modal .remove {
    float: right;
}
.deals-modal .modifier-card {
    margin-bottom: 5px;
}
.deals-modal .modifier-card-header {
    margin: 0px;
    padding: 8px;
    text-align: center;
    font-weight: 700;
    color: #008000;
}
.deals-modal .modifier-card-body {
    margin: 0px;
    padding: 0px 0px 5px 0px;
}
.deals-modal .deal-alert {
    text-align: center;
    margin: 0px;
    border-radius: 0px;
}
.deals-modal .modifier .deal-mod-qty-btn {
    background: #ffffff !important;
    border: 2px solid #222222 !important;
    color: #222222 !important;
    height: 25px !important;
    line-height: 16px;
}
.deals-modal .modifier .deal-mod-qty-btn i {
    font-size: 15px;
}
.deals-modal .modifier .addOne {
    border-radius: 0px 7px 7px 0px;
}
.deals-modal .modifier .removeOne {
    border-radius: 7px 0px 0px 7px;
}
.deals-modal .modifier .modifier-qty {
    padding: 0px 10px;
}
/* Deals Modal CSS Part End */

/* Product Modal Start */
.product-modal .modal-header {
    padding: 0px;
}
.product-modal .modal-body {
    padding: 0px;
    border-radius: 6px;
}
.product-modal .modal-body .info-block {
    padding: 0px;
    overflow-x: auto;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    height: calc(100vh - 176px);
}
.product-modal .modal-body .info-block .product-modal-image {
    width: 100%;
    height: 315px;
    border-radius: 6px 6px 0px 0px;
    object-fit: cover;
    object-position: 100% 60%;
}
.product-modal .modal-body .info-block .mod-close-btn {
    align-items: center;
    display: flex;
    justify-content: center;
    position: absolute;
    right: 22px;
    top: 18px;
    z-index: 3;
    border: 1px solid #ffffff;
    border-radius: 0px;
    background-color: #ffffff;
}
.product-modal .modal-body .info-block .info-body {
    padding: 10px 15px 0px 15px;
}
.product-modal .modal-body .info-block .info-body .title {
    color: #2e3333;
    font-size: 22px;
    font-weight: bold;
}
.product-modal .modal-body .info-block .info-body .description {
    color: #585c5c;
    font-size: 14px;
    font-weight: 400;
}
.product-modal .modal-body .info-block .info-body .allergence {
    color: #2e3333;
    font-size: 14px;
    font-weight: bold;
}
.product-modal .modal-body .info-block .info-body .contact {
    color: #00b8a9;
    font-size: 14px;
    font-weight: bold;
}
.product-modal .modal-body .info-block .info-body .card {
    border-color: rgb(33 37 41 / 10%);
}
.product-modal .modal-body .info-block .info-body .card-header {
    border: 0px;
}
.product-modal .modal-body .qty-btn-block {
    margin: 10px;
    padding: 10px;
    border: 1px solid #d1d1d1;
}
.product-modal .modal-body .qty-btn-block .qty-btn {
    background: #ffffff !important;
    border: 3px solid #222222 !important;
    color: #222222 !important;
    width: 30% !important;
    height: 35px !important;
}
.product-modal .modal-body .qty-btn-block .minus-btn {
    border-radius: 15px 0px 0px 15px;
}
.product-modal .modal-body .qty-btn-block .plus-btn {
    border-radius: 0px 15px 15px 0px;
}
.product-modal .modal-body .qty-btn-block input {
    font-size: 24px;
    line-height: 24px;
    font-weight: 600;
    background: transparent !important;
    border: none !important;
    color: #abadad;
    padding: 0px;
    margin: 0px;
}
.product-modal .modal-body .qty-btn-block .product-adding-btn {
    border-radius: 0px;
}
/* Product Modal End */

/* Sub Product Modal Start */
.sub-product-modal .modal-header {
    padding: 0px;
}
.sub-product-modal .modal-body {
    padding: 0px;
    background: #f9fafa;
    border-radius: 6px;
}
.sub-product-modal .modal-body .info-block {
    margin-bottom: 10px;
    padding: 0px;
    overflow-x: auto;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    height: calc(100vh - 70px);
}
.sub-product-modal .modal-body .info-block .product-modal-image {
    width: 100%;
    height: 315px;
    border-radius: 6px 6px 0px 0px;
    object-fit: cover;
    object-position: 100% 60%;
}
.sub-product-modal .modal-body .info-block .mod-close-btn {
    align-items: center;
    display: flex;
    justify-content: center;
    position: absolute;
    right: 22px;
    top: 18px;
    z-index: 3;
    border-radius: 0px;
    border: 1px solid #ffffff;
    background-color: #ffffff;
}
.sub-product-modal .modal-body .info-block .info-body {
    padding: 10px 15px 0px 15px;
}
.sub-product-modal .modal-body .info-block .info-body .product-title {
    color: #2e3333;
    font-size: 22px;
    font-weight: bold;
}
.sub-product-modal .modal-body .info-block .info-body .product-description {
    color: #585c5c;
    font-size: 14px;
    font-weight: 400;
}
.sub-product-modal .modal-body .info-block .info-body .allergence {
    color: #2e3333;
    font-size: 14px;
    font-weight: bold;
}
.sub-product-modal .modal-body .info-block .info-body .contact {
    color: #00b8a9;
    font-size: 14px;
    font-weight: bold;
}
.sub-product-modal .modal-body .sub-product-card {
    height: 140px;
}
.sub-product-modal .modal-body .sub-product-card-body {
    display: flex;
}
.sub-product-modal .modal-body .sub-product-card-body .info {
    width: 90%;
    margin: 3px 15px 3px 3px;
    color: #2e3333;
}
.sub-product-modal .modal-body .sub-product-card-body .info .sub-product-title {
    font-size: 16px;
    font-weight: bold;
}
.sub-product-modal .modal-body .sub-product-card-body .info .sub-product-description {
    font-size: 13px;
    text-align: justify;
    color: #585c5c;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}
.sub-product-modal .modal-body .sub-product-card-body .info .sub-product-price {
    font-size: 15px;
    font-weight: bold;
}
.sub-product-modal .modal-body .sub-product-card-body .action-btn {
    width: 10%;
    margin: 3px;
    text-align: center;
    vertical-align: middle !important;
}
.sub-product-modal .modal-body .sub-product-card-body .action-btn .btn-sub-prod {
    background: transparent;
    border: 1px solid #abadad;
    border-radius: 0px;
    width: 40px;
    height: 100%;
    max-height: 100px;
}
.sub-product-modal .modal-body .sub-product-card-body .action-btn .btn-sub-prod:hover {
    background: #c1c1c1;
    border: 1px solid #c1c1c1;
}
/* Sub Product Modal End */

/* Sub Product Modifier Modal Start */
.sub-product-modifier-modal .modal-header {
    padding: 0;
}
.sub-product-modifier-modal .modal-body {
    padding: 0;
    background: #f9fafa;
    border-radius: 6px;
}
.sub-product-modifier-modal .modal-body .info-block {
    padding: 0px;
    overflow-x: auto;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    height: calc(100vh - 185px);
}
.sub-product-modifier-modal .modal-body .info-block .product-modal-image {
    width: 100%;
    height: 315px;
    border-radius: 6px 6px 0px 0px;
}
.sub-product-modifier-modal .modal-body .info-block .mod-close-btn {
    align-items: center;
    display: flex;
    justify-content: center;
    position: absolute;
    right: 22px;
    top: 18px;
    z-index: 3;
    border: 1px solid #ffffff;
    background-color: #ffffff;
}
.sub-product-modifier-modal .modal-body .info-block .info-body {
    padding: 10px 15px 0px 15px;
}
.sub-product-modifier-modal .modal-body .info-block .info-body .product-title {
    color: #2e3333;
    font-size: 22px;
    font-weight: bold;
}
.sub-product-modifier-modal .modal-body .info-block .info-body .product-description {
    color: #585c5c;
    font-size: 14px;
    font-weight: 400;
}
.sub-product-modifier-modal .modal-body .info-block .info-body .allergence {
    color: #2e3333;
    font-size: 14px;
    font-weight: bold;
}
.sub-product-modifier-modal .modal-body .info-block .info-body .contact {
    color: #00b8a9;
    font-size: 14px;
    font-weight: bold;
}
.sub-product-modifier-modal .modal-body .qty-btn-block {
    margin: 10px;
    padding: 10px;
    border: 1px solid #d1d1d1;
}
.sub-product-modifier-modal .modal-body .qty-btn-block .qty-btn {
    background: #ffffff !important;
    border: 3px solid #222222 !important;
    color: #222222 !important;
    width: 30% !important;
    height: 35px !important;
}
.sub-product-modifier-modal .modal-body .qty-btn-block .minus-btn {
    border-radius: 15px 0px 0px 15px;
}
.sub-product-modifier-modal .modal-body .qty-btn-block .plus-btn {
    border-radius: 0px 15px 15px 0px;
}
.sub-product-modifier-modal .modal-body .qty-btn-block input {
    font-size: 24px;
    font-weight: 600;
    background: transparent !important;
    border: none !important;
    color: #abadad;
}
/* Sub Product Modifier Modal End */

/* Product Modifier CSS Start */
.product-modifier .card-title {
    font-size: 18px;
}
/* Product Modifier CSS End */

/* Cart CSS Part Start */
.cart-input {
    margin: auto;
    width: 95%;
}
.cart-input input {
    border: 1px solid #ddd;
    border-radius: 0px;
}
.cart-input .error {
    font-size: 12px;
}
.checkout-cartscroll {
    height: 620px;
    /*overflow: auto;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;*/
}
.cartscroll {
    height: calc(100vh - 150px);
}
.cart-card {
    border-radius: 2px;
    border-color: #ffffff;
    background: #ffffff;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.cart-body {
    overflow: auto;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    /* scrollbar-width: none; */
}
.cart-footer {
    background: #ffffff;
    position: sticky;
    top: 0px;
    bottom: 0px;
}
.order-type-btn-container {
    text-align: center;
    background: #dee2e6;
    border-radius: 50px;
    padding: 5px 0px;
    margin-bottom: 7px;
}
.order-type-btn-container .btn {
    width: 48%;
    background: transparent;
    border-radius: 50px;
    color: #2e3333;
    padding: 2px;
}
.order-type-btn-container .btn.active {
    border-color: #ffffff;
    background: #ffffff;
}
.order-type-btn-container .btn .title {
    font-size: 14px;
}
.order-type-btn-container .btn .time {
    font-size: 12px;
}
.cart-empty-img {
    margin: 0;
    position: absolute;
    top: 65%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.cart-empty-img img {
    width: 50%;
}
.cart-empty-img p {
    font-size: 14px;
}
.table-cart-details .item-info {
    font-size: 12px;
}
.table-cart-details .cart-actions {
    width: 100%;
    display: table;
    border: 0px solid #000;
}
.table-cart-details .cart-actions-row {
    display: table-row;
}
.table-cart-details .amount {
    display: table-cell;
}
.table-cart-details .amount .item-remove {
    font-size: 16px;
    color: #ff0000;
    margin-right: 10px;
    cursor: pointer;
}
.table-cart-details .qty-col {
    display: table-cell;
    text-align: right;
}
.table-cart-details .qty-col .action-btn {
    display: inline-block;
    width: 50px;
    background: #dee2e6;
    padding-top: 3px;
    padding-bottom: 3px;
    cursor: pointer;
}
.table-cart-details .qty-col .item-qty {
    display: inline-block;
    width: 50px;
    text-align: center;
}
.table-cart-details .qty-col .increment {
    text-align: center;
    border-radius: 0px 10px 10px 0px;
}
.table-cart-details .qty-col .decrement {
    text-align: center;
    border-radius: 10px 0px 0px 10px;
}
.table-order-summery {
    margin-bottom: 5px;
}
.table-order-summery td {
    padding: 2px 5px;
    font-size: 12px;
}
.table-order-summery .summery-info {
    text-align: right;
}
.minimum-order-amount {
    font-size: 12px;
    font-weight: bold;
    color: #ff0000;
    margin-bottom: 5px;
}
.table-cart-summary td {
    font-size: 12px;
}
.table-cart-summary .amount {
    text-align: right;
}
.available-point {
    font-size: 14px;
}
.available-point-value {
    font-size: 14px;
}
.redeemed-points-message {
    font-size: 12px;
    color: #008800;
    font-weight: bold;
    text-align: center;
}
.coupon-message {
    font-size: 12px;
}
/* Cart CSS Part Start */

/*Checkout CSS Part Start*/
.process-order-loader {
    margin-top: -8px; display: none;
}
.overlay-content {
    position: absolute;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    color: #555;
}
.overlay-content img {
    width: 100px; height: 100px;
}
.back-to-menu {
    margin-bottom: 10px;
}
.back-to-menu a {
    text-decoration: none;
}
.checkout-card {
    margin-bottom: 10px;
}
.checkout-card .change-btn {
    cursor: pointer;
}
.checkout-card .change-btn:hover {
    color: #ff0000;
}
.delivery-address {
    font-size: 12px;
    font-weight: bold;
    color: #008000;
}
.delivery-postcode {
    font-size: 12px;
    font-weight: bold;
    color: #008000;
}
.selected-time {
    font-size: 12px;
    font-weight: bold;
    color: #008000;
}
.terms-and-conditions { text-decoration: none; }
.autocomplete-items {
    position: absolute;
    border: 1px solid #d4d4d4;
    border-bottom: none;
    border-top: none;
    z-index: 99;
    /*position the autocomplete items to be the same width as the container:*/
    top: 100%;
    left: 0;
    right: 0;
}
.autocomplete-items div { padding: 10px; cursor: pointer; background-color: #fff;  border-bottom: 1px solid #d4d4d4; }
/* when hovering an item: */
.autocomplete-items div:hover { background-color: #e9e9e9; }
/* when navigating through the items using the arrow keys: */
.autocomplete-active { background-color: DodgerBlue !important;  color: #ffffff; }
.invalid-post-code-message {
    font-size: 12px !important;
    font-weight: bold;
}
#tipsModal .modal-footer {
    display: block;
}
/*Checkout CSS Part End*/

/* Login, Register & Recovery Password CSS part Start */
.shopping-btn {
    text-decoration: none;
    font-size: 14px;
    font-weight: bold;
    color: #fe4e2b;
}
.shopping-btn:hover {
    font-size: 16px;
    color: #000000;
}
.login-content {
    margin: auto;
    padding-top: 20px;
    padding-bottom: 40px;
    width: 50%;
}
.login {
    display: flex;
    color: #2e3333;
    padding: 0px 15px;
}
.login .title {
    flex: 1;
    color: #2e3333;
    font-size: 20px;
}
.login .sub-title {
    float: right;
    font-size: 14px;
    padding-top: 4px;
}
.login .sub-title a {
    text-decoration: none;
}
.login-card {
    border-radius: 0px;
}
.login-form {
    padding: 0px 70px 40px 70px;
}
.login-inp input {
    border: 1px solid #ddd;
    border-radius: 0px;
    height: 50px;
}
.login-inp label {
    font-size: 14px;
}
.login-submit-btn {
    border-radius: 0px;
    height: 50px;
}
.forgot-password {
    text-decoration: none;
    font-size: 12px;
    float: right;
    padding-top: 6px;
}

.reg-content {
    margin: auto;
    padding-top: 20px;
    padding-bottom: 40px;
    width: 75%;
}
.register {
    display: flex;
    color: #2e3333;
    padding: 0px 15px;
}
.register .title {
    flex: 1;
    color: #2e3333;
}
.register .sub-title {
    float: right;
    font-size: 14px;
    padding-top: 4px;
}
.register .sub-title a {
    text-decoration: none;
}
.reg-card {
    border-radius: 0px;
}
.reg-form {
    padding: 0px 40px 40px 40px;
}
.reg-inp input {
    border: 1px solid #ddd;
    border-radius: 0px;
    height: 50px;
}
.reg-inp label {
    font-size: 14px;
}
.terms-condition {
    padding-top: 5px;
    font-size: 14px;
    text-align: center;
}
.terms-condition a {
    text-decoration: none;
}

.recovery-content {
    margin: auto;
    padding-top: 20px;
    padding-bottom: 40px;
    width: 50%;
}
.recovery {
    display: flex;
    color: #2e3333;
    padding: 0px 15px;
}
.recovery .title {
    flex: 1;
    color: #2e3333;
}
.recovery .sub-title {
    float: right;
    font-size: 14px;
    padding-top: 4px;
}
.recovery .sub-title a {
    text-decoration: none;
}
.recovery-card {
    border-radius: 0px;
}
.recovery-card-body {
    padding: 20px 100px 40px 100px;
}
.recovery-inp input {
    border: 1px solid #ddd;
    border-radius: 0px;
    height: 50px;
}
.recovery-inp label {
    font-size: 14px;
}
.check-btn {
    border-radius: 0px;
    height: 50px;
}
.pass-updated {
    font-size: 200px;
}
/* Login, Register & Recovery Password CSS part End */

/* Order Page CSS Start */
.order-content {    
    margin: auto;
    padding-top: 20px;
    padding-bottom: 40px;
    width: 50%;
}
.order-content .title {    
    color: #008800;
}
.order-content p {
    font-size: 14px;
}
.order-confimed-icon {
    font-size: 100px;
    color: #008800;
}
.order-track-content {   
    margin: auto;
    padding-top: 20px;
    padding-bottom: 40px;
    width: 75%;
}
/* Order Page CSS End */

/* My Account CSS Start */
.my-acc-content {
    margin: auto;
    padding-bottom: 20px;
    width: 95%;
}
.my-acc-content table tr td, .my-acc-content table tr th {
    background: transparent !important;
}
.my-acc-content .customer-name {
    font-size: 30px;
    font-weight: bold;
}
.my-acc-content .customer-contact {
    font-size: 14px;
/*    font-weight: bold;*/
}
.my-acc-content .btn {
    border-radius: 0px;
}
.order-track-content .btn {
    border-radius: 0px;
}
.cancle-btn {
    color: #ff0000;
    font-size: 18px;
    cursor: pointer;
}
.cancle-btn:hover {
    font-weight: bold;
}
.all-order-card {
    border: 0px;
    max-height: 100%;
    height: 190px;
}
.all-order-card .time {
    font-size: 14px;
}
.all-order-card .status {
    font-size: 14px;
    cursor: pointer;
    color: #008800;
}
.all-order-card .border-end {
    border-right: 2px solid #d1d1d1 !important;
}
.all-order-card .notes {
    font-size: 13px;
    line-height: 18px;
    text-align: justify;
    color: #585c5c;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}
.all-order-card .payment-method {
    font-weight: bold;
}
.all-order-card .details-btn {
    text-decoration: none;
    cursor: pointer;
    color: #0d6efd;
}
.order-details-tab .product-name {
    font-size: 13px;
}
.order-info-tab th, .order-info-tab td {
    font-size: 13px;
}
/* My Account CSS End */

/* Payment Option CSS Start */
.payment-opt {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    cursor: pointer;
}
.payment-opt input {
    display: none;
}
.payment-opt label {
    display: flex;
    align-items: center;
    background-color: #f9f9f9;
    border: 1px solid #ccc;
    padding: 10px 15px;
    width: 100%;
    transition: all 0.3s ease;
    position: relative;
}
.payment-opt label:hover {
    border-color: #007bff;
}
.payment-opt input:checked + label {
    background-color: #28a745;
    color: #fff;
    border-color: #28a745;
}
.payment-opt input:checked + label .checkmark {
    display: block;
}
.payment-opt label i {
    margin-right: 10px;
    font-size: 18px;
}
.payment-opt .checkmark {
    margin-left: 10px;
    font-size: 18px;
    color: #fff;
    display: none;
}
.lp-btns {
    display: flex;
    padding-bottom: 10px;
}
.lp-btns .action-btn {
    flex: 1;
    text-align: center;
    font-size: 16px;
    cursor: pointer;
    border-bottom: 1px solid #008000;
    padding: 10px;
}
.lp-btns .action-btn:first-child {
    margin-right: 0px;
}
.lp-btns .selected {
    background: #008800;
}
.lp-btns .selected span {
    color: #ffffff;
    font-weight: bold;
}
.available-points {
    background: #6c757d;
    color: #ffffff;
    text-align: center;
    padding: 10px;
}
.lp-card {
    border: 0px;
}
.lp-card .date {
    font-size: 14px;
}
.lp-card .reason {
    font-size: 14px;
}
.lp-card .point {
    font-size: 16px;
    color: #ffffff;
    padding: 1px 10px;
    width: 55px;
    max-height: 100%;
    height: 40px;
    vertical-align: middle !important;
    border-radius: 0px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.lp-card .earned_point {
    background: #008800;
}
.lp-card .used_point {
    background: #ff0000;
}
.contact-us {
    margin-bottom: 10px;
}
.contact-us .title {
    font-size: 16px;
    font-weight: bolder;
}
.contact-us .custom-input .form-label {
    font-size: 16px;
    font-weight: bolder;
}
.contact-us .sub-title {
    padding-left: 10px;
    font-size: 16px;
}
.nav-tabs-scroll {
    overflow-x: auto; /* Enable horizontal scrolling */
    white-space: nowrap; /* Prevent wrapping of tabs */
}
.nav-tabs-scroll::-webkit-scrollbar {
    height: 5px; /* Customize scrollbar height */
}
.nav-tabs-scroll::-webkit-scrollbar-thumb {
    background-color: #ddd;
    border-radius: 10px;
}
.mc-nav-tabs {
    background: #d1d1d1;
    border-bottom: 2px solid #008800;
    white-space: nowrap;
    overflow-x: auto;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.mc-nav-tabs .nav-item:hover {
    border-left: 2px solid #008800;
    border-top: 2px solid #008800;
    border-right: 2px solid #008800;
    border-radius: 0px;
}
.mc-nav-tabs .nav-link {
    color: #000000;
    font-weight: bold;
}
.mc-nav-tabs .nav-link:hover {
    border: 0px;
    border-radius: 0px;
    border-color: transparent;
}
.mc-nav-tabs .nav-link.active {
    background: #008800;
    border-color: #008800;
    color: #ffffff;
    border-radius: 0px;
}
/* Payment Option CSS End */

/* Half & Half CSS Part Start */
.first-half-portion-btn, .second-half-portion-btn {
    font-size: 12px;
}
.half-sub-product-btn {
    height: 100%;
    white-space: normal;
    padding-left: 5px;
    padding-right: 5px;
    display: grid;
    align-items: center;
    font-size: 12px;
    border-radius: 0px;
}
.half-deal-btn {
    height: 100%;
    white-space: normal;
    padding-left: 5px;
    padding-right: 5px;
    display: grid;
    align-items: center;
    font-size: 12px;
}
.selected-btn {
    background: #555555;
    border-color: #555555;
    color: #ffffff;
}
.selected-btn:hover {
    background: #555555;
    border-color: #555555;
    color: #ffffff;
}
.disable-btn {
    pointer-events: none;
    opacity: 0.5;
}
.half-modifier-block {
    margin: 10px 0px 0px 0px;
}
.half-modifier-block .modifier-head {
    text-align: center;
    padding: 5px 10px;
}
.half-modifier-block .modifier-head h5 {
    font-size: 16px;
}
.modifier-item {
    margin: 3px 10px 3px 10px;
}
.half-deal-btn-block {
    margin-top: 10px;
}
/* Half & Half CSS Part End */

/* Payment Input CSS Part Start */
.card-payment {
    margin-bottom: 10px;
}
.payment-inp {
    font-size: 16px;
}
.payment-card-inp {
    width: 75% !important;
}
.payment-expiry-date-inp {
    width: 10% !important;
}
.payment-cvc-inp {
    width: 10% !important;
}
/* Payment Input CSS Part End */

@media screen and (max-width: 991px) {
    body {
        margin: 2px !important;
    }
    .checkout-card-body {
        padding: 7px;
    }
    .cart-empty-img {
        top: 50%;
    }
    .product-modifier .card-title {
        font-size: 14px;
    }
    /*  Samira mobile media  Start */
    .navbar {
        padding: 15px;
    }    
    .mobile-nav-link {
        text-align: center;
        color: #ffffff;
    }
    .content {
        margin: 5px;
        padding: 5px;
    }
    .cartscroll {
        height: calc(100vh - 95px);
    }
    .product-card-body .info .title {
        font-size: 15px;
    }
    .sticky-cart {
        margin-top: 115px;
    }
    .sticky-cat {
        top: 112px !important;
    }
    .checkout-form {
        overflow: hidden;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        height: auto;
    }
    .cart-footer {
        position: relative;
    }
    .product-content {
        top: 110px; 
        margin-bottom: 115px;
    }
    .container-fluid {
        margin-top:0px !important
    }
    .dd-menu {
        display: none
    }
    .footer-content {
        margin-bottom: 10px;
        height: auto;
    }
 
    .copyright {
        text-align: center;
    }
    .social-media {
        justify-content: space-evenly;
    }
    .mobile-apps a img {
        width: 140px;
    }
    .login-content {
        margin: auto;
        padding-left: 10px;
        padding-top: 80px;
        padding-bottom: 40px;
        width: 100%;
        padding-right: 10px;
    }
    .login  {
        display: grid;
    }
    .login .title {
        font-size: 18px;
    }
    .login-form {
        padding: 16px;
    }
    .reg-content {
        margin: auto;
        padding-left: 10px;
        padding-top: 80px;
        padding-bottom: 40px;
        width: 100%;
        padding-right: 10px;
    }
    .register {
        display: grid;
    }
    .register .title {
        font-size: 18px;
    }
    .reg-form {
        padding: 16px;
    }
    .recovery-content {
        margin: auto;
        padding-left: 10px;
        padding-top: 80px;
        padding-bottom: 40px;
        width: 100%;
        padding-right: 10px;
    }
    .recovery {
        display: grid;
    }
    .recovery .title {
        font-size: 18px;
    }
    .recovery-card-body {
        padding: 16px;
    }
    .order-content {
        margin: auto;
        padding-left: 10px;
        padding-top: 80px;
        padding-bottom: 40px;
        width: 100%;
        padding-right: 10px;
    }
    .order-track-content {
        margin: auto;
        padding-left: 10px;
        padding-top: 80px;
        padding-bottom: 40px;
        width: 100%;
        padding-right: 10px;
    }
    .checkout-form {
        margin-top: 65px;
    }
    .checkout-cart {
        margin-top: 10px;
    }
    .my-acc-content {
        margin: auto;
        margin-top: 70px;
        padding-bottom: 20px;
        width: 95%;
    }
    .mc-nav-tabs .nav-item {
        width: auto;
        text-align: center;
    }
    .info-card {
        height: auto;
    }
    .info-card .title {
        font-size: 15px;
    }
    .info-card .offers {
        font-size: 12px;
    }
    .product-modal .modal-body .qty-btn-block .qty-btn {
        width: 50% !important;
    }
    .sub-product-modifier-modal .modal-body .qty-btn-block .qty-btn {
        width: 50% !important;
    }
    .deals-modal .modal-body .info-block .info-body {
        padding: 10px 8px 0px 8px;
    }
    .deals-modal .modal-body .info-block .info-body .deal-item-card .card-header {
        padding: 10px 8px 10px 8px;
    }
    .deals-modal .modal-body .info-block .info-body .deal-item-card .card-body {
        padding: 10px 8px 10px 8px;
    }
    .deals-modal .product-card .deal-product-header {
        display: block;
        width: 100%;
    }
    .deals-modal .product-card .deal-product-header .deal-product-title {
        display: inline-flex;
    }
    .deals-modal .deal-item-qty-div .deal-qty-btn {
        width: 20% !important;
        height: 40px !important;
    }
    .deals-modal .deal-qty-text {
        padding: 0px 25px;
        font-size: 24px;
    }
    .deals-modal .modifier-selection-block {
        margin: 0px; 
        padding: 0px;
    }
    .deals-modal .modifier-card-header {
        padding: 10px 8px 10px 8px;
    }
    .deals-modal .modifier-card-body {
        padding: 10px 8px 10px 8px;
    }
    .deals-modal .modifier {
        padding: 5px 0px 5px 0px;
    }
    .deals-modal .modifier .deal-mod-title {
        display: block;
        margin-block: 5px;
        width: 100%;
    }
    .deals-modal .modifier .deal-mod-qty-btn i {
        font-size: 15px;
        padding: 0px 15px;
    }
    .deals-modal .modifier .deal-mod-qty-btn {
        height: 35px !important;
        line-height: 26px;
    }
    .deals-modal .modifier .modifier-qty {
        padding: 0px 20px;
    }
    .table-cart-details .item-info {
        font-size: 14px;
    }
    .table-cart-details .cart-actions {
        font-size: 18px;
    }
    .table-cart-details .cart-actions {
        font-size: 18px;
    }
    .table-cart-details .amount .item-remove {
        font-size: 25px;
    }
    .payment-inp {
        font-size: 14px;
        padding: 2px;
    }
    .payment-card-inp {
        width: 45% !important;
    }
    .payment-expiry-date-inp {
        width: 10% !important;
        text-align: center;
    }
    .payment-cvc-inp {
        width: 10% !important;
        text-align: center;
    }
    .payment-igt {
        padding: 8px 5px;
    }
     .main-footer {padding: 25px;}
     .product-card{height:auto;}
     .copyright{margin-bottom: 35px;}
}
@media only screen and (width: 390px) and (device-height: 844px) {
    .mobile-apps a img { width: 122px; }
}
@media screen and (max-width: 667px) {
    .mobile-apps a img {width: 115px;}
}
@media screen and (max-width: 740px) {
    .mobile-apps a img {width: 107px;}
}
@media screen and (max-width: 915px) {
    .mobile-apps a img {width: 133px;}
}
@media only screen and (width: 375px) and (device-height: 667px) {
    .mobile-apps a img {width: 115px;}
}
@media screen and (max-width: 812px) {
    .mobile-apps a img {width: 115px;}
}
@media screen and (max-width: 640px) {
    .mobile-apps a img {width: 107px;}
}
@media only screen and (width: 320px) and (device-height: 658px) {
    .mobile-apps a img { width: 87px; }
    .order-type-btn-container .btn .title { font-size: 12px; }
    .cart-body { padding: 5px 20px; }
    .table-cart-details .qty-col .action-btn { width: 35px; }
    .table-cart-details .qty-col .action-btn > i { font-size: 14px }
    .table-cart-details .qty-col .item-qty { width: 35px; }
    .product-card-body .info .title { font-size: 14px; }
    .category-info .title { font-size: 18px; }
    .info-card .title { font-size: 13px }
    .info-card .offers { font-size: 13px; }
}
@media only screen and (width: 430px) and (device-height: 932px) {
    .mobile-apps a img {width: 140px;}
}



@media only screen and (min-width:768px) and (max-width:1024px){
    
    .product-card-body .info .title { font-size: 13px;}
    .product-card { height: auto;}
    .order-type-btn-container .btn .title{ font-size: 10px;}
    .table-cart-details .qty-col .action-btn{ width: 25px;}
    .nav-btn{ font-size: 10px;}
    .fixed-top-nav{ padding: 25px;}
    .sticky-cat{ top: 87px !important;}
    .dd-menu{ display: block;}
    .cartscroll{ height: calc(88vh - 75px);}
    .table-cart-details .amount .item-remove{ font-size: 20px;}
    .item-price{ font-size:15px;}
    .table-cart-details .qty-col .item-qty{ width:30px;}
    .product-card-body .action-btn .add-btn{ width: 30px;}
    .product-card-body .info{ margin:5px;}
    .product-card-body .info .price{ font-size:13px;}
    .sub-product-modal .modal-body .sub-product-card-body .action-btn .btn-sub-prod{ width:30px;}
    .footer-content{ height: 230px;}
    .mobile-apps a img{ width: 135px}
    .login-content{ padding-top: 100px;}
    .reg-content{ padding-top: 115px;}
    .checkout-form{ margin-top: 85px;}
    .checkout-cart{ margin-top: 85px;}
    .available-point-value{ font-size: 10px;}
    .available-point{ font-size: 12px;}
    .redeem-btn{ font-size: 10px; margin-left: -12px;}
    .my-acc-content{ margin-top: 95px;}
    .all-order-card .status{ font-size: 9px;}

}