.navbar-menu .navbar-nav .nav-sm .nav-link
{
    position: relative !important;
}
input[type=checkbox][disabled]:checked{
    outline: 1px solid #000000 !important;
}
.cdf.abc{
    padding: 0 !important;
}
#sub_cat{
    max-height: 625px;
    overflow: auto;
    margin-bottom: 30px;
}
.add-addons2{
    font-size: 11px;
    color: #373e80;
    cursor: pointer; 
}
.not-delivered{
    background: #ff7200 !important;
    top:0 !important;
    width:50px;
    border-radius: 0 !important;
    right:0 !important;
}
.addon-data{
    width:500px;
    background: #ebebeb;
    padding: 10px;
    display: none;
}
.delivered{
    top:0 !important;
    width:50px;
    border-radius: 0 !important;
    left:0 !important;
}
.content-popup{
    width: 100%;
    height: 90%;
    max-width: 78%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    padding: 20px;
    box-sizing: border-box;
    position: fixed !important;
    z-index: 9999999;
    background: #ffffff !important;
    box-shadow: 0 0 10px 10px rgb(0 0 0 / 10%);
    border-radius: 5px !important;
    display: none;
}
.calendar-dates:before{
    padding-top: 100%;
    content: "";
    display: block;
}
.calendar-dates:hover{
    background: #ebebeb;
    cursor: pointer;
}
.calendar-dates{
    width: 10%;
    float: left;
    border: 1px dotted #cccccc;
    text-align: center;
    box-sizing: border-box;
    position: relative;
    transition: all 0.5s ease-in-out;
    box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.05) inset;
}
.calendar-dates span{
    width:50%;
    height: 20px;
    border-radius: 50%;
    position: absolute;
    background: #0ab39c;
    color: #ffffff;
    text-align: center;
    line-height: 20px;
    right:10px;
    top:10px;
    font-size: 10px;
}
.calendar-dates i{
    position: absolute;
    width: 100%;
    height: 20px;
    color: #000000;
    text-align: center;
    left:0;
    right:0;
    top:0;
    bottom:0;
    margin: auto;
    font-size: 15px;
    font-style: normal;
}
.cfr{
    padding: 20px;
    text-align: center;
}
.bgfr{
    position: relative;
}
ul.customer_autocomplete, ul.product_autocomplete{
    list-style: none;
    padding: 0;
    margin: 0;
}
ul.customer_autocomplete li, ul.product_autocomplete li{
    list-style: none;
    padding: 0;
    margin: 0;
    padding: 5px 10px;
    border-bottom: 1px dashed #cccccc;
    cursor: pointer;
}
ul.customer_autocomplete li:hover, ul.product_autocomplete li:hover{
    background: #ebebeb;
}
.customer_autocomplete, .product_autocomplete{
    position: absolute;
    left:0;
    top:65px;
    background: #ffffff;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.3);
    z-index: 99999;
    width:100%;
    max-height: 300px;
    overflow: auto;
    display: none;
}
.product_autocomplete{
    position: absolute;
    left:0;
    top:40px;
    background: #ffffff;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.3);
    z-index: 99999;
    width:100%;
    max-height: 300px;
    overflow: auto;
    display: none;
}

.sr-only2 {
    position: absolute !important;
    width: 25px !important;
    right: 0 !important;
    color: #ffffff !important;
    display: none;
    height: 25px !important;
    background: #0ab39c !important;
    text-align: center !important;
    font-size: 10px !important;
    line-height: 25px !important;
    border-radius: 50% !important;
}
#order-bubble-popup{
    left:0;
    right:0;
    top:0;
    bottom:0;
    z-index: 99999999;
    display: none;
    width:70%;
    height: 90%;
    max-width: 70%;
    max-height: 90%;
}
.bubble-overlay2{
    position: fixed;
    left:0;
    top:0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99999999;
    display: none;
}
.user_details_popup{
    width:;
}
.auth-bg-cover>.bg-overlay{
    background: #739518;
}
.contain{
    display: block;
    width:200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 20px;
}
.auth-bg-cover {
    background: #ebebeb !important;
}
.popup-t{
    background: #ffffff;
    padding: 30px;
    border-radius: 5px;
    box-shadow: 0 0 10px 10px rgba(0, 0, 0, 0.1);
    position: absolute;
    right:0;
    bottom:20px;
    display: none;
    min-width: 700px;
    max-width: 700px;
    z-index: 99999999999;
}
.popup-t table td{
    font-size: 12px;
    font-style: normal;
    padding-right: 10px;
}
.popup-t .bx-x{
    position: absolute;
    right: 10px;
    top:10px;
}
.fade2 span{
    opacity: 0.5;
}
table td{
    padding-bottom: 5px !important;
    padding-top: 5px !important;
}
#user_details{
    
}
.customer_details{
    position: absolute;
    left:105%;
    width: 350px;
    background: #ffffff;
    box-shadow: 2px 2px 4px 4px rgb(0 0 0 / 5%);
    border-radius: 10px;
    z-index: 99999;
    padding: 25px;
    top:0;
    display: none;
    color: #000000 !important;
}
.datepicker{
    padding: 20px;
}
.datepicker  .day, .datepicker .dow{
    width:30px;
    height: 30px;
    text-align: center;
    cursor: pointer;
    border: 1px solid #f7f7f7;
}
.underline{
    text-decoration: underline !important;
}
.customer i{
    cursor: pointer;
}
.details{
    list-style: none;
    padding: 0;
    margin: 0;
}
.details input{
    border: 1px solid #ebebeb;
    border-radius: 5px;
}
#order-details{
    width:100%;
    height: 90%;
    max-width:78%;
    left: 0;
    right: 0;
    margin: auto;
    padding: 20px;
    box-sizing: border-box;
}
.pol2.expand li{
    margin-bottom: 5px;
    padding-bottom: 5px;
    border-bottom: 1px dotted #cccccc;
}
.details img{
    cursor: pointer;
    width: 12px;
}
.kluio{
    width:90%;
    font-size: 10px;
    height: 25px;
    text-indent: 10px;
}
.acdrt{
    padding-left: 40px;
    box-sizing: border-box;
}
.modal-content.addPopup{
    position: fixed !important;
    left: 30%;
    top: 5%;
    margin: auto;
    height: 75%;
    width: 98%;
    max-width: 60%;
    background: #ffffff;
    border-radius: 5px !important;
    z-index: 99999999;
    box-sizing: border-box;
    box-shadow: 0 0 10px 10px rgba(0, 0, 0, 0.1);
    display: none;
}
.pol2{
    display: none;
    padding: 20px 5px;
}
.pol2.expand{
    display: block;
}
.pol{
    padding: 5px 10px;
    background: #ebebeb;
    border: 1px solid #cccccc;
    cursor: pointer;
    margin-bottom: 3px;
    border-radius: 5px;
}
.cmgf{
    font-size: 9px !important;
    width:130px !important;
    height: 30px !important;
}
.cfdv{
    cursor: pointer; 
}
.set-rating:focus, .order:focus, .set-rating-num:focus{
    border: 1px solid #666666 !important;
    outline: none !important;
}
.set-rating, .set-order{
    width: 60px;
    border: 1px solid #ebebeb;
    border-radius: 5px;
    font-size: 11px !important;
    text-align: left;
    text-indent: 10px;
}
.set-rating-num{
    width: 60px;
    border: 1px solid #ebebeb;
    border-radius: 5px;
    font-size: 11px !important;
    text-align: left;
    text-indent: 10px;
}
.calendar-dates span.canc{
    background: #f00 !important;
    color: #ffffff;
    width: 50%;
    height: 20px;
    border-radius: 0 !important;
    position: absolute;
    background: #0ab39c;
    color: #ffffff;
    text-align: center;
    line-height: 20px;
    right: 0;
    bottom: 0;
    top:unset;
    font-size: 10px;
}
.calendar-dates span.canc_req{
    background: #f339ff !important;
    color: #ffffff;
    width: 50%;
    height: 20px;
    border-radius: 0 !important;
    position: absolute;
    background: #0ab39c;
    color: #ffffff;
    text-align: center;
    line-height: 20px;
    left: 0;
    bottom: 0;
    top:unset;
    font-size: 10px;
}
#rp{
    right:0;
    top:135px;
    width:28%;
    height: calc(100% - 135px);
    overflow: auto;
}
#rp.cp{
    display: none;
    position: static !important;
    width: 100% !important;
    height: auto !important;
    background: #f7f7f7;
}
.hide{
    left:-5000px;
    position: fixed;
}
.hide *{
    position: static !important;
}
.white{
    background: #ffffff !important;
}
.sidebar-links i i{
     margin-left: 5px;
}
.ul{
    display: block;
    list-style: none;
    padding: 0;
    margin: 0;
}
.ul a.active{
    background: #ffffff !important;
    margin-right: -21px;
    border-right: 0 !important;
    position: relative;
    z-index: 999999;
    font-weight: bold;
}
.star{
    color: #f00;
}
.search{
    background: #ffffff url(../images/search.png) no-repeat right 10px center !important;
    background-size: 15px 15px !important;
}
.ul a input{
    margin-right: 10px;
}
.ul a{
    display: block;
    padding: 14px;
    border: 1px solid #cccccc;
    margin-bottom: 4px;
    background: #f7f7f7;
}
.ul a:hover{
    cursor: pointer;
}
.home-components .row{
    padding: 5px 0;
    margin: 0;
}
.home-components{
    position: relative;
    overflow: auto;
    overflow-x: hidden;
}
#sidebar_r span{
    position: absolute;
    top: 0;
    bottom: 0;
    right: 250px;
    width: 30px;
    height: 60px;
    border-radius: 10px 0 0 10px;
    cursor: pointer;
    background: #ffffff url('../images/001-dots.png') no-repeat left 6px center;
    margin: auto;
    box-shadow: -2px 2px 2px 2px rgba(0, 0, 0, 0.1);
    display: block;
}
#sidebar_r{
    width: 250px;
    position: fixed;
    right: -250px;
    z-index: 99999;
    top: 0;
    background: #ffffff;
    height: 100%;
    padding: 25px;
    box-shadow: -2px 2px 2px 2px rgba(0, 0, 0, 0.1);
    -webkit-transition:  all 0.2s ease-in;
}
#sidebar_r_overlay{
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    z-index: 9999;
    top: 0;
    background: rgba(0, 0, 0, 0.5);
    display: none;
}
#sidebar_r.animate{
    right: 0;
}
#lght.show{
    top: 65px !important;
    right:0 !important;
    display: block;
}
.menu-dropdown{
    display: none;
}
.bg-light{
    border-radius: 5px 5px 0 0;
}
.navbar-menu .navbar-nav .nav-link{
    cursor: pointer;
}
.loader-back{
    height: 100%;
    width: 100%;
    z-index: 9999999;
    left:0;
    top:0;
    position: fixed;
    background: rgba(0,0,0,0.5);
    display: none;
}

.loader {
    border: 3px solid #fff;
    border-radius: 50%;
    border-top: 5px solid #459ad5;
    width: 30px;
    height: 30px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
    position: fixed;
    margin: auto;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg)
    }
    100% {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg)
    }
    100% {
        transform: rotate(360deg)
    }
}
.ck-file-dialog-button{
    display: none !important;
}
.cdrftr option{
    padding: 3px 5px;
    border-bottom: 1px dotted #cccccc;
}
.gwe{
    margin-top: 5px;
    border: 1px solid #cccccc !important;
}
.overlay-caption{
    font-size: 12px;
}
.imgt{
    position: relative;
    overflow: hidden;
    border-radius: 3px;
    border: 1px solid #000000;
    width:40px;
}
.imgt:before{
    display: block;
    padding-top: 100%;
    height: 0;
    content: "";
}
.imgt img{
    position: absolute;
    left: 0;
    top: 0;
    max-width: 100%;
}

.cfd{
    width: 120px;
    margin-bottom: 10px;
}
.sidebar-links a{
    display: block;
    border-bottom: 1px dotted #cccccc;
    padding: 10px 0;
    color: #405189 !important;
    cursor: pointer;
}
.vftyer{
    border-top: 1px dashed #cccccc;
    float: left;
    margin-bottom: 10px;
    padding-top: 10px;
    margin-left: 0 !important;
}
.cdf{
    padding: 30px;
    overflow-x: hidden;
    overflow-y: auto;
    position: relative;
    height: calc(100% - 60px);
    background: #ffffff !important;
}
.ppoverlay{
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    height: 100%;
    width: 100%;
    max-width: 100%;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 0;
    z-index: 99999999;
    display: none;
}
#vendor-assign{
    z-index: 999999999;
    left:0;
    right:0;
    top:0;
    bottom:0;
}
.ppoverlay-vendor-assign{
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    height: 100%;
    width: 100%;
    max-width: 100%;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 0;
    z-index: 99999999;
    display: none;
}
.offcanvas-backdrop.show{
    opacity: 0 !important;
}

body::-webkit-scrollbar {
  width: 5px;
}
 
body::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
 
body::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  outline: 1px solid slategrey;
}


iframe::-webkit-scrollbar {
  width: 5px;
}
 
iframe::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
 
iframe::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  outline: 1px solid slategrey;
}

*::-webkit-scrollbar {
  width: 5px;
}
 
*::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
 
*::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  outline: 1px solid slategrey;
}
.gallery-box{
    background: #ebebeb !important;
}
.ms-container{
    width: 100% !important;
}
.dz-message.needsclick .mb-3{
    margin-bottom: 0 !important;
}
.cfrt{
    border: 1px solid #cccccc;
    margin-bottom: 20px;
    margin-top: 20px;
    padding: 10px;
}
.dropzone .dz-message{
    text-align: center;
}
.dropzone{
    min-height: 50px !important;
}
.logo-lg img{
    height: 35px;
}
.red-star{
    color: red;
    font-weight: bold;
}
.klj{
    border: 1px dashed #cccccc;
    padding: 30px;
    text-align: center;
    background: #f7f7f7;
    cursor: pointer;
}
.navbar-menu{
    background: #405189 !important;
    border-right: 1px solid #405189 !important;
}
.navbar-menu .navbar-nav .nav-link{
    color: rgba(255, 255, 255, 0.5) !important;
}
.d-block img{
    height: 40px !important;
}
#add-city-popup{
    min-height: 300px;
    height: 320px;
}
#add-normal-popup, #add-package-popup, #occassions-popup, #relations-popup{
    min-height: 250px;
    height: 220px;
}
#add-delivery-details, #care-info-popup, #add-variants-popup, #delivery-slot-popup{
    min-height: 250px;
    height: 350px;
}
#delivery-time-slot-popup{ 
    min-height: 450px;
    height: 350px;
}
#colours-popup{
    min-height: 250px;
    height: 350px;
}
.clearfix{
    margin: 0 !important;
}
.no-margin-top{
    margin-top: 0 !important;
}
.autocomplete{
    position: relative;
}
.autocomplete .dropdown2 ul{
    list-style: none;
    padding: 0;
    margin: 0;
}
.autocomplete .dropdown2 li{
    padding: 7px 10px;
    cursor: pointer;
    border-bottom: 1px dashed #cccccc;
}
.autocomplete .dropdown2{
    position: absolute;
    width: 100%;
    height: auto;
    background-color: #ffffff;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.1);
    z-index: 9999999;
    max-height: 200px;
    overflow: auto;
    display: none;
}


.autocomplete .dropdown3 ul{
    list-style: none;
    padding: 0;
    margin: 0;
}
.autocomplete .dropdown3 li{
    padding: 7px 10px;
    cursor: pointer;
    border-bottom: 1px dashed #cccccc;
}
.autocomplete .dropdown3{
    position: absolute;
    width: 100%;
    height: auto;
    background-color: #ffffff;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.1);
    z-index: 9999999;
    max-height: 200px;
    overflow: auto;
    display: none;
}
.cvftr{
    background: #f6f6f6;
    padding: 20px;
    border: 1px solid #cccccc;
    border-radius: 5px !important;
}
.colour input{
    display: none;
}
.colour{
    width: 25px;
    height: 25px;
    border-radius: 50%;
    margin-right: 10px;
    cursor: pointer;
    position: relative;
}
.colour input:checked + span{
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 31px;
    height: 31px;
    left: -3px;
    top: -1px;
    border: 3px solid #000000;
    border-radius: 50%;
}

.add-btn{
    position: absolute;
    bottom: 0;
    top: 0;
    width: 100%;
    z-index: 999999;
    height: 80px;
    padding: 20px;
    background: #ffffff;
}
.rtyuiop{
    position: absolute;
    top: 0;
    width: 100%;
    background: #ffffff;
    z-index: 9999999;
    padding: 20px;
}
.ftrty{
    position: relative;
}
.okju{
    position: relative;
}
.s-images{
    position: relative;
    overflow: hidden;
    width: 90px;
    margin-right: 2%;
    margin-bottom: 2%;
    border: 1px solid #cccccc;
    float: left;
    border-radius: 4px;
}
.s-images:before{
    content: '';
    padding-top: 100%;
    height: 0;
    display: block;
}
.s-images > img.s-closel{
    position: absolute;
    left: 0;
    top: 0;
    max-height: 100%;
    height: 100%;
}

.s-images > img.s-close{
    position: absolute;
    right: 10px;
    top: 10px;
    font-weight: bold;
    font-size: 20px;
    color: #000000;
    cursor: pointer;
    z-index: 9999999;
    width: 10px;
    height: 10px;
}
.bgrt{
    background: #f7f7f7;
    border: 1px solid #ebebeb;
    padding: 20px;
    width: 100% !important;
    display: block;
    float: none;
    box-sizing: border-box;
    clear: both;
    margin-left: 10px;
    border-radius: 5px !important;
    margin-top: 20px !important;
}
.cvtyr2{
    padding-left: 10px;
}
.addons-display{

}
.cvftr2{
    background: #f6f6f6;
    padding: 20px;
    border: 1px solid #cccccc;
    margin: 0 15px;
    width: 94% !important;
}
.vfret {
    background: #f7f7f7;
    border: 1px dashed #ebebeb;
    padding: 10px;
    display: block;
    margin-bottom: 5px;
}
.required{
    color: #f00;
    font-size: 15px;
}
.t-col-3{
    width:25% !important;
    float: left;
}
.t-row-header{
    font-weight: bold;
}
.t-row{
    font-weight: normal;
}
.mn-cat{
    min-height: 50px;
    max-height: 250px;
    overflow: auto;
    border-top: 1px solid #ebebeb;
}
.cder{
    padding: 10px;
    background: #fafafa;
    line-height:40px;
    display: block;
    width: 100%;
}
.edit-sections:hover{
    background: #ebebeb !important;
}
.edit-sections{
    width:100% !important; 
    height:205px !important; 
    line-height: 180px !important;
}
.slug-fixed{
    height: 40px;
    width: 200;
    float: left;
    border-right: 0;
    line-height: 35px;
    padding-left: 15px;
}
.slug-dynamic input{
    border: 0 !important;
    text-indent: 0 !important;
    padding-left: 0 !important;
    width: 300px;
}
.slug-dynamic{
    height: 40px;
    float: left;
    border-left: 0;
}
.slug-holder{
    height: 40px;
    border: 1px solid var(--vz-input-border);
}
@media screen and (max-width: 1024px){
    .main-content{
        margin-left: 0 !important;
    }
    .navbar-menu{
        left: -100% !important;
    }
    .slide{
        left: 0 !important;
    }
}



@media screen and (max-width: 900px){
    .cdf .col-sm-7 br + p{
        margin-top: 40px;
    }
    .product-details2 .fs-14{
        margin-top: 20px;
    }
    .product-details2 .d-flex br{
        display: none;
    }
    .product-details2 .btn.btn-success.btn-label.ng-scope{
        float: left !important;
        margin: 20px;
    }
    #order-details .btn.btn-success.btn-label{
        float: left !important;
        margin-left: 0;
        margin-top: 30px !important;
    }
    .product-details2 *{
        float: none !important;
        position: static;
    }
    .product-details2 .d-flex{
        display: block !important;
    }
    .product-details2 span .flex-shrink, .product-details2 .flex-grow-1{
        display: block;
        float: none;
        width:100%;
    }
    #calendar .cfr{
        float: left;
        width:25% !important;
    }
    #calendar .col-sm-4.cfr{
        width:95% !important;
        margin: auto;
        float: none;
    }
    #calendar .col-sm-1.cfr{
        width:18% !important;
    }
    #calendar .col-sm-3.cfr{
        width:32% !important;
    }
    .content-popup{
        width:100%;
        max-width: 100%;
        height: 100%;
        border-radius: 0 !important;
        padding: 0;
    }
    #order-details{
        max-width: 100%;
        padding: 0;
    }
    .content-popup .cdf{
        overflow: auto !important;
    }
    .content-popup #close-modal, #order-details #close-modal2{
        position: fixed;
        right:20px;
        top:20px;
    }
    .calendar-dates{
        width:25% !important;
    }
    #login-page .auth-one-bg .bg-overlay{
       height: 90px !important;
    }
    #login-page .auth-one-bg{
        height: 90px !important;
        overflow: hidden;
    }
    #login-page .card{
        position: fixed;
        left:0;
        top:0;
        right:0;
        bottom:0;
        margin: auto;
    }
    .modal-content.addPopup{
        width:100% !important;
        height: 100% !important;
        left: 0 !important;
        right:0 !important;
        top:0 !important;
        bottom:0 !important;
        max-width: 100%;
        margin: auto !important;
    }
    .card{
        margin: -14px !important;
    }
    .gallery-wrapper{
        overflow: auto;
    }
    .navbar-menu{
        left:-100%;
        transition: all 0.2s ease-in-out !important;
        z-index: 999999999999;
    }
    .navbar-menu.animate{
        left:0 !important;
    }
    .navbar-menu-overlay{
        z-index: 999;
        background: rgba(0, 0, 0, 0.5);
        left:0;
        top:0;
        right:0;
        bottom:0;
        height: 100%;
        width:100%;
        position: fixed;
        display: none;
    }
    #page-topbar{
        z-index: 99 !important;
    }
    #order-bubble-popup{
        max-width: 100%;
        max-height: 100%;
        width: 100%;
        height: 100%;
    }
}