/******************************************************************************/
/* Width
/******************************************************************************/
@media only screen and (max-width: 1450px) and (min-width: 1350px) {

  .indx-w {
    padding-right: 14%;
    padding-left: 14%;
  }
}

@media only screen and (max-width: 1350px) and (min-width: 901px) {

  .indx-w {
    padding-right: 5.3%;
    padding-left: 5%;
  }

  .hs,
  .hs #search-text-input {
    width: 320px !important;
  }

}

@media only screen and (max-width: 1060px) and (min-width: 830px) {

  .indx-w {
    padding-right: 1.3%;
    padding-left: 1%;
  }

  .kw-rspnse {
    width: 850px !important;
  }

  .kw-hdn {
    display: none !important;
  }

  .fs-rspnse {
    font-size: 30px !important;
  }

  .grd-6 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr !important;
  }

  .hs,
  .hs #search-text-input {
    width: 320px !important;
  }

  .w-g {
    min-width: 1000px !important;
  }

  .w-mh {
    min-width: 1000px !important;
  }
}


.pos-vb-m {
  position: absolute !important;
  right: 5 !important;
  bottom: 5 !important;
}

@media only screen and (max-width: 829px) and (min-width: 730px) {
  .grd-6 {
    grid-template-columns: 1fr 1fr 1fr 1fr !important;
  }
}

@media only screen and (max-width: 729px) and (min-width: 530px) {
  .grd-6 {
    grid-template-columns: 1fr 1fr 1fr !important;
  }
}

@media only screen and (max-width: 529px) and (min-width: 100px) {
  .grd-6 {
    grid-template-columns: 1fr 1fr !important;
  }

}

@media only screen and (max-width: 409px) and (min-width: 50px) {
  .avatar-name {
    width: 60px !important;
  }

  .sml-hdn {
    display: none !important;
  }

  .sml-fs-12 {
    font-size: 12px !important;
  }
}


@media only screen and (max-width: 829px) and (min-width: 50px) {
  .header-separator {
    margin-left: 5px !important;
    margin-right: 5px !important;
  }

  .m-abslt {
    position: absolute !important;
  }

  .bg-cvr {
    height: auto;
  }

  /******************************************************************************/
  /* Alignment
  /******************************************************************************/
  .mtac {
    text-align: center !important;
  }

  .mtar {
    text-align: right !important;
  }

  .mtal {
    text-align: left !important;
  }

  .mjc-l {
    justify-content: left !important;
  }

  .mhdn {
    display: none !important;
  }

  td.dhdn,
  th.dhdn {
    display: block !important;
  }

  /******************************************************************************/
  /* Generic Font Size
/******************************************************************************/
  .mabslt-n {
    position: relative !important;
  }

  .abslt-rel {
    position: relative !important;
  }

  .mfs-12 {
    font-size: 12px !important;
  }

  .mfs-14 {
    font-size: 14px !important;
  }

  .mfs-16 {
    font-size: 16px !important;
  }

  .mfs-18 {
    font-size: 18px !important;
  }

  .mfs-20 {
    font-size: 20px !important;
  }

  .mfs-22 {
    font-size: 22px !important;
  }

  .mfs-24 {
    font-size: 24px !important;
  }


  .movrflwx {
    width: 100%;
    overflow-wrap: normal;
    overflow: auto !important;
  }


  .v-ctr {
    margin: 0;
    position: relative !important;
    top: none !important;
    left: none !important;
    text-align: left;
    transform: translate(-50%, -50%);
  }

  .v-ctr2 {
    margin: 0;
    top: none !important;
    left: none !important;
    text-align: left;
    transform: translate(-50%, -50%);
  }

  /******************************************************************************/
  /* Generic Width
/******************************************************************************/
  .mkw-a {
    width: auto !important;
  }

  .mkw-100p {
    width: 100% !important;
  }

  .mkw-96p {
    width: 95% !important;
  }

  .mkw-25 {
    width: 25px !important;
  }

  .mkw-40 {
    width: 40px !important;
  }

  .mkw-45 {
    width: 45px !important;
  }

  .mkw-50 {
    width: 50px !important;
  }

  .mkw-55 {
    width: 55px !important;
  }

  .mkw-60 {
    width: 60px !important;
  }

  .mkw-65 {
    width: 65px !important;
  }

  .mkw-70 {
    width: 70px !important;
  }

  .mkw-80 {
    width: 80px !important;
  }

  .mkw-85 {
    width: 85px !important;
  }

  .mkw-100 {
    width: 100px !important;
  }

  .mkw-110 {
    width: 110px !important;
  }

  .mkw-125 {
    width: 125px !important;
  }

  .mkw-130 {
    width: 130px !important;
  }


  .mkw-150 {
    width: 150px !important;
  }

  .mkw-180 {
    width: 180px !important;
  }

  .mkw-200 {
    width: 200px !important;
  }

  .mkw-250 {
    width: 250px !important;
  }

  .mkw-330 {
    width: 330px !important;
  }

  .mxkw-120 {
    max-width: 120px !important;
  }

  .mxkw-170 {
    max-width: 170px !important;
  }

  .mxkw-180 {
    max-width: 180px !important;
  }

  .mxkw-190 {
    max-width: 190px !important;
  }

  .mxkw-200 {
    max-width: 200px !important;
  }

  .mxkw-280 {
    max-width: 280px !important;
  }

  /******************************************************************************/
  /* Generic Height
/******************************************************************************/
  .mkh-fc {
    height: fit-content !important;
  }

  .mkh-100 {
    height: 100px !important;
  }

  .mkh-a {
    height: auto !important;
  }

  .mkh-100p {
    height: 100% !important;
  }

  .mkh-15 {
    height: 15px !important;
  }

  .mkh-18 {
    height: 18px !important;
  }

  .mkh-30 {
    height: 30px !important;
  }

  .mkh-35 {
    height: 35px !important;
  }

  .mkh-40 {
    height: 40px !important;
  }

  .mkh-45 {
    height: 45px !important;
  }

  .mkh-50 {
    height: 50px !important;
  }

  .mkh-55 {
    height: 55px !important;
  }

  .mkh-60 {
    height: 60px !important;
  }

  .mkh-65 {
    height: 65px !important;
  }

  .mkh-70 {
    height: 70px !important;
  }

  .mkh-80 {
    height: 80px !important;
  }

  .mkh-120 {
    height: 120px !important;
  }

  .mkh-130 {
    height: 130px !important;
  }

  .mkh-150 {
    height: 150px !important;
  }

  .mkh-160 {
    height: 160px !important;
  }

  .mkh-170 {
    height: 170px !important;
  }

  .mkh-200 {
    height: 200px !important;
  }

  .mkh-500 {
    height: 500px !important;
  }

  /******************************************************************************/
  /* Generic Margin
/******************************************************************************/
  .mmgnl-10 {
    margin-left: 10px !important;
  }

  .mmgnl-20 {
    margin-left: 20px !important;
  }

  .mmgnt-0 {
    margin-top: 0px !important;
  }

  .mmgnt--3 {
    margin-top: -3px !important;
  }

  .mmgnt--10 {
    margin-top: -10px !important;
  }

  .mmgnt-2 {
    margin-top: 2px !important;
  }

  .mmgnt-4 {
    margin-top: 4px !important;
  }

  .mmgnt-5 {
    margin-top: 5px !important;
  }

  .mmgnt-7 {
    margin-top: 7px !important;
  }

  .mmgnl-5 {
    margin-left: 5px !important;
  }

  .mmgnl-15 {
    margin-left: 15px !important;
  }

  .mmgnt-10 {
    margin-top: 10px !important;
  }

  .mmgnt-15 {
    margin-top: 15px !important;
  }

  .mmgnt-40 {
    margin-top: 40px !important;
  }

  .mmgnt-50 {
    margin-top: 50px !important;
  }

  .mgnt-70 {
    margin-top: 50px !important;
  }

  .mmgnr-0 {
    margin-right: 0px !important;
  }

  .mmgnr-5 {
    margin-right: 5px !important;
  }

  .mmgnr-10 {
    margin-right: 10px !important;
  }

  .mmgnt-55 {
    margin-top: 55px !important;
  }

  .mmgnt-65 {
    margin-top: 65px !important;
  }

  .mmgnl-0 {
    margin-left: 0px !important;
  }

  .mmgnb-0 {
    margin-bottom: 0px !important;
  }

  .mmgnb-10 {
    margin-bottom: 10px !important;
  }

  .mmgnb-20 {
    margin-bottom: 20px !important;
  }

  .mmgnb-40 {
    margin-bottom: 40px !important;
  }

  .mmgnb-60 {
    margin-bottom: 60px !important;
  }

  /******************************************************************************/
  /* Generic Grid
/******************************************************************************/
  .mgrd-1 {
    display: grid;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto;
    row-gap: 10px;
  }

  .mgrd-2 {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: auto;
    row-gap: 10px;
    row-gap: 10px;
  }

  .mgrd-3 {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr !important;
    grid-template-rows: auto;
    row-gap: 10px;
    row-gap: 10px;
  }

  .mgrd-5 {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr !important;
    grid-template-rows: auto;
    row-gap: 10px;
    row-gap: 10px;
  }

  .mgrd-2-btn {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: auto;
  }

  .mgrd2f1f-2 {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    row-gap: 5px;
    column-gap: 5px;
  }

  .mfgap-0 {
    gap: 0 !important;
  }

  /******************************************************************************/
  /* Generic Padding
/******************************************************************************/
  .mpd-0 {
    padding: 0px !important;
  }

  .mpdt-5 {
    padding-top: 5px !important;
  }

  .mpd-8 {
    padding: 8px !important;
  }

  .mpd-10 {
    padding: 10px !important;
  }

  .mpd-5 {
    padding: 5px !important;
  }

  .mpd-7 {
    padding: 7px !important;
  }

  .mpd-15 {
    padding: 15px !important;
  }

  .mpdb-15 {
    padding-bottom: 15px !important;
  }

  .mpdt-3 {
    padding: 3px 0px 0px 0px !important;
  }

  .mpdlr-0 {
    padding: 0px 0px !important;
  }

  .mpdlr-10 {
    padding: 0px 10px !important;
  }

  .mpdlr-5 {
    padding: 0px 5px !important;
  }

  .mpdlr-15 {
    padding: 0px 15px !important;
  }

  .mpdlrb-1065 {
    padding: 0px 10px 65px 10px !important;
  }

  .mpdw-10 {
    padding: 10px !important;
  }

  .mpdtb-4 {
    padding: 4px 0 !important;
  }

  .c-m {
    background-color: #ffffff90;
    border: 1px solid var(--gry-m);
    border-radius: 10px;
  }

  /******************************************************************************/
  /* Generic Positions
/******************************************************************************/
  .mtp--5 {
    top: -5px !important;
  }

  .mrt--100 {
    right: -100px !important;
  }

  .mrt--5 {
    right: -5px !important;
  }

  .mtp--8 {
    top: -8px !important;
  }

  .mlf-15 {
    left: 15 !important;
  }

  .mlf-0 {
    left: 0 !important;
  }

  .mtp--20 {
    top: -20px !important;
  }

  /* Buttons ********************************************************************/

  .logout_btn {
    z-index: 5;
  }

  .cb-tab {
    display: block !important;
    top: -7px;
    z-index: 1000;
    font-size: 12px;
    color: var(--r);
  }

  .cb-tab button {
    width: 80px;
    height: 35px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 50px;
    background-color: var(--clr-clean);
    border: 1px solid var(--r);
    color: var(--r);
  }

  .cb-tab span {
    font-family: "Gicons";
    font-size: 16px;
  }

  .kbtn button {
    padding: 2px 10px;
    font-size: 14px;
  }

  .kbtn2 button {
    width: 100% !important;
  }

  .kbtn3 button {
    width: 100%;
    height: 35px;
  }

  .kbtn span {
    font-family: 'Gicons';
    font-size: 18px !important;
  }

  .prfl-t {
    width: 100%;
  }

  /* Generic ********************************************************************/
  .ae-dw {
    position: relative;
    left: 0px;
    width: 100% !important;
    margin-top: 0px !important;
    margin-bottom: 5px !important;
  }

  .w-mps {
    position: static;
    overflow: scroll;
  }

  .mob-fd-c {
    flex-direction: column;

  }

  .mfd-r {
    flex-direction: row !important;

  }

  .ae-p-w {
    grid-template-columns: 175px 175px !important;
  }

  .sp-ps {
    grid-template-columns: 1fr 1fr !important;
  }

  .movrflw-x {
    overflow-x: auto;
    overflow-y: hidden;
  }

  /* Width ********************************************************************/
  .mob-kw-100p {
    width: 100% !important;
  }

  /* Borders********************************************************************/
  .mbr-rn {
    border-radius: 0px !important;
  }

  .mbr-t15b0 {
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
  }

  /* Margins ********************************************************************/
  .mob-mgnt-5 {
    margin-top: 5px !important;
  }

  .mob-mgnt-10 {
    margin-top: 10px !important;
  }

  .m-mgnt-60 {
    margin-top: 60px !important;
  }

  .m-mgnb-40 {
    margin-bottom: 40px !important;
  }

  .m-mgnb-60 {
    margin-bottom: 60px !important;
  }

  .m-pd-60 {
    padding-bottom: 60px !important;
  }

  .mob-mgnt-15 {
    margin-top: 15px !important;
  }


  .mob-mgnl-5 {
    margin-left: 5px;
  }

  .mgnl-5 {
    margin-left: 0px !important;
  }

  .mmgnl-25 {
    margin-left: 25px !important;
  }

  .mgnl-5-rpnsv {
    margin-left: 0px;
  }

  .date-range-wrapper {
    justify-content: space-between !important;
    top: -50px !important;
    left: 0px !important;
    width: 100% !important;
  }

  /* Generic ********************************************************************/
  .flx-fd-rpnsv {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: column !important;
  }

  td.mob_rh,
  th.mob_rh {
    display: none !important;
  }

  .dataTables_length {
    float: left !important;
    position: relative;
    left: 0;
  }

  .dataTables_info {
    float: left !important;
  }

  .dataTables_paginate {
    text-align: right;
    padding-top: 0px;
    padding-bottom: 34px;
    left: 0;

  }

  .dataTables_filter {
    float: right !important;
    margin-top: 0px !important;
    width: 100px;
    left: 0;
  }

  .dataTables_filter label {
    right: 0;
    position: absolute;
    width: 230px !important;
  }

  .dataTables_empty {
    text-align: left !important;
  }

  td.dataTables_empty {
    padding-left: 8px !important;
  }

  .pagination {
    float: right;
  }

  .row {
    display: flex;
    justify-content: space-between;
    margin-right: 0px !important;
    flex-wrap: nowrap !important;
    margin-left: 0px !important;
    overflow: unset;
  }

  .table {
    min-width: 100% !important;
    margin-bottom: 0px !important;
  }

  .col-sm-12,
  .col-md-6,
  .col-md-7,
  .col-md-5 {
    width: 100% !important;
    padding: 0px !important;
  }

  @-webkit-keyframes fadeOut {
    0% {
      opacity: 1;
    }

    50% {
      opacity: 1;
    }

    100% {
      opacity: 0;
    }
  }

  @keyframes fadeOut {
    0% {
      opacity: 1;
    }

    50% {
      opacity: 1;
    }

    100% {
      opacity: 0;
    }
  }

  .inpt-log {
    display: flex;
    flex-direction: column;
    text-align: center;
  }

  .inpt-log input[type="password"],
  .inpt-log input[type="text"] {
    width: 100% !important;
    height: 50px !important;
    font-size: 16px !important;
  }

  .login input[type=submit] {
    width: 90px;
    height: 50px;
    font-size: 16px;
  }

  .signup {
    margin-top: 10px;
  }

  .m-fd-c {
    flex-direction: column;
  }

  .m-fd-cr {
    flex-direction: column-reverse;
  }

  /* Landing Page Header ********************************************************/


  .landing_logo img {
    height: 30px;
    margin: 3px;
  }

  .indx-w {
    width: 100% !important;
    margin-bottom: 35px;
  }

  .login {
    float: none !important;
  }

  .klogo {
    float: none !important;
    margin-bottom: 10px;
  }

  .user_error {
    position: absolute !important;
  }

  .alert {
    padding: 10px 15px !important;
    width: 95%;
    height: max-content;
    border-radius: 10px !important;
    margin-top: 5px !important;
    line-height: 1.5 !important;
    text-align: center;
  }

  button.close {
    width: 50px;
    height: 50px;
  }

  .fps {
    position: absolute;
    top: unset;
    bottom: 11% !important;
    right: 14% !important;
  }

  .bcd-w {
    width: 100% !important;
  }

  .pprsz {
    height: 100%;
  }


  #search-text-input::placeholder {
    visibility: hidden !important;
  }

  #search-text-input:not(:focus):not(:active) {
    width: 40px !important;
    transition: width 0.3s;
    background-color: #13131300;
    z-index: 2;
    background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' class='clr-kl bi bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'%3E%3C/path%3E%3C/svg%3E") no-repeat 10px center;
  }

  #search-text-input:focus,
  #search-text-input:active {
    width: 100% !important;
    transition: width 0.3s;
    background: transparent url("data:assets/img/dfltx10zx/search.svg  width='16' height='16' class='clr-kl bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'%3E%3C/path%3E%3C/svg%3E") no-repeat 10px center;

  }

  #search-text-input:focus+#misc,
  #search-text-input:active+#misc {
    display: none;
  }

  .pd-srch {
    padding: 10px;
  }

  .profile-content {
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    transition: width 1s !important;
  }

  .profile-content.show {
    left: 0;
    width: 100% !important;
    padding: 70px 15px 15px 15px !important;
  }

  .profile-content.hide {
    left: -100%;

  }

  .trnd-sz {
    max-height: 40px !important;
    min-height: 40px !important;
    max-width: 40px !important;
    min-width: 40px !important;
  }

  /******************************************************************************/
  /* Nain Index
/******************************************************************************/
  .btm-65 {
    bottom: 65px !important;
  }



  .strs-sw {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
  }

  .strs-w {
    width: 100% !important;
  }

  .strs-c {
    width: 100% !important;
    height: 80px;
  }

  .strs-d {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
  }

  .strs-di {
    width: 65px !important;
    height: 65px !important;
    object-fit: contain;
  }

  .strs-n {
    font-weight: bold;
    text-align: left;
    height: 20px;
    margin-top: 5px;
    width: 100%;
    margin-left: 10px;
    margin-bottom: 5px;
  }

  .strs-ct {
    margin-top: 10px;
    width: 65px;
    height: 65px;
    padding: 2px;
  }

  .strs-rb {
    margin-left: 10px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }

  /* Footer *********************************************************************/
  .ff {
    padding: 0px;
  }

  .w-fs {
    text-align: center;
    height: fit-content;
    padding: 10px 10px;
    z-index: 10;
    line-height: 1.45;
  }

  /* Modal Forget Password ******************************************************/
  .modal-dialog {
    width: 100% !important;
  }

  /* Header Logged-in ***********************************************************/
  .w-mh {
    z-index: 999;
    position: fixed !important;
  }

  .w-mr-h {
    flex-direction: column-reverse;
  }

  .kpr-lgo-mob {
    width: 30px;
    margin: 8px;
    display: block !important;
  }

  /* Header Icons ***********************************************************/
  .mh-i {
    width: 45px !important;
    padding: 8px !important;
  }

  .w-mh-i {
    padding: 0 15px;
  }

  /* Tab-Design *****************************************************************/
  #prsnl-tab,
  #admin-tab,
  #message-tab,
  #notif-tab,
  #order-tab,
  #peer-tab,
  #cart-tab {
    width: 100%;
    height: 100%;
    bottom: 55px;
    padding: 65px 10px 0 10px;
    position: fixed;
    z-index: 999;
  }

  .p-stky {
    position: sticky !important;
  }

  .mob-p {
    overflow: hidden;
    background-color: #333;
    position: fixed;
    bottom: 0;
    width: 100%;
  }

  .ht-cont {
    position: sticky !important;
    width: 100%;
    top: 0 !important;
    border-radius: 10px 10px 0px 0px;
    padding: 15px;
    box-shadow: 0px -1px 10px #1d1d1d38
  }

  .header-tab-arrow {
    display: none;


  }

  .w-iac {
    position: static;
    bottom: 0;
    top: 105px;
    overflow-y: auto;
  }

  ::-webkit-scrollbar {
    z-index: 9999;
    position: absolute;
    width: 0;
    background-color: #ffffff;
  }

  .fps-a {
    position: absolute;
    top: 68px;
    left: 215px;
    z-index: 9999;
  }

  .inv-d {
    margin-left: 0px !important;
  }

  .crsl-img {
    width: 100% !important;
    height: 350px !important;
  }



  .crsl-brdr {
    border-radius: 10px 10px 0px 0px !important;
  }

  /* Accounting Content / Point Of Sale *****************************************/
  .m-hdn {
    display: none;
  }

  .m-ui {
    display: block !important;
  }

  .mob-rd {
    display: block !important;
  }

  .mob-w {
    width: 48%;
  }

  .mob-w100 {
    width: 100% !important;
  }

  .mob-clm {
    flex-direction: column;
  }

  .mob-flx-sb {
    display: flex;
    justify-content: space-between !important;
  }

  .msb {
    justify-content: space-between !important;
  }

  .mob-flx-fs {
    display: flex;
    justify-content: flex-start !important;
  }

  .kbtn3 {
    padding-bottom: 0px;
  }


  .ae-td input {
    margin-bottom: 5px;
  }

  .ae-td {
    margin-bottom: 5px;
  }


  .ae-td select {
    margin-bottom: 0px;

  }

  .w-aec {
    height: 150%;
  }

  .kbtn-100 {
    width: none;
  }

  .kbtn-100 button {
    height: 35px;
    width: 100%;
    font-size: 12px;
    font-weight: 900;
  }

  #loader {
    top: 165px;
    left: 55%;
  }

  .w-g {
    padding: 10px !important;
  }

  .w-g-lindx,
  .w-g-indx {
    padding: 60px 0px 0px 0px !important;
  }


  .w-g-str {
    padding: 0px 0px 0px 0px !important;
  }

  .ae {
    background-color: transparent;
    width: 100%;
    height: 100%;
    padding: 10px;
    border: none !important;
  }


  .pos {
    display: block;
  }

  .pos-wm {
    width: 100% !important;
    height: 465px;
  }


  .pos-wd {
    margin-top: 10px;
    width: 100% !important;
    height: auto;

  }

  .s-pq input {
    width: 60px !important;
  }

  .ae-t {
    margin-bottom: 0px;
    padding: 7px 0px 15px 0px;
    font-size: var(--fnt-m);
  }

  .w-st {
    width: 100%;
  }

  .w-s-ps {
    margin-bottom: 0px;
    padding: 8px;
  }

  .w-ae-p {
    padding-top: 5px;
  }

  .w-s-pc {
    height: 275px;
    padding: 6px;
  }

  .w-s-pd {
    margin-bottom: 0px;
  }

  .w-s-t {
    width: 100%;
    height: auto;
    top: 55px;
    padding: 10px;
  }

  #nonSelected {
    height: 100%;
    overflow-y: scroll;
  }

  .mob-pos-c {
    position: relative;
    width: 100%;
    top: 10px;
  }

  .pbd {
    padding: 6px 0 0 0;
  }

  .pos-m-p {
    display: block;
    width: 40%;
    height: 80px;
    margin-top: 8px;
    margin-left: 10px;
    padding: 26px;
    font-size: 25px;
    color: var(--clr-clean);
    border-radius: 10px;
    text-align: center;
    background-color: var(--clr-warning);
  }

  .itm {
    height: 80px;
    margin: 4px;
    padding: 5px 10px;


  }

  .m-itm-p {
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
  }


  .ae-ed {
    width: 100% !important;
  }

  /* Sign-Up ********************************************************************/
  .w-100 {
    width: 100%;
  }

  .w-50 {
    width: 50% !important;
  }

  .w-99 {
    width: 49% !important;
  }

  .kbtn-su {
    margin-top: 15px;
  }

  .fd-clm {
    flex-direction: column;
  }

  .su-frm {
    width: 100% !important;
  }

  .w-su {
    width: 100%;
    height: 100%;
    margin-top: 0px;
    border-radius: 0px;
    padding: 15px;
  }

  /* Settiings ******************************************************************/
  .mob-flx {
    display: flex;
    flex-direction: column;
    width: 100%;
    justify-content: normal;
  }

  .mob-flx-r {
    display: flex;
    width: 100%;
    justify-content: space-between;
  }



  .mas-p-w {
    border-right: none;
  }

  .mas-p-w {
    width: 100%;
    padding-right: 0px;
    background-color: #fff;
    padding: 5px;
  }

  .mas-s-w {
    width: 100%;
    padding: 0px 10px 10px 10px;
    margin-left: 0px;
  }

  .ae-bi-ml {
    width: 100%;
  }

  .ae-bi-w {
    flex-direction: column;
  }

  .mr {
    margin-right: 0px;
  }

  .m {
    margin-left: 0px;
  }

  /* Settiings ******************************************************************/
  .ae-atnd {
    height: 265px;
    flex-direction: column;
  }

  .atnd-s {
    width: 100%;
    margin: 10px 0;
    padding-right: 0px !important;
  }

  .atnd-t {
    border-left: none;
    padding-left: 0px;
    width: 100% !important;
  }

  .atnd-b {
    text-align: center;
  }

  #clockbox2 {
    font-size: 50px !important;
  }

  #datebox2 {
    font-size: 20px !important;
  }

  .ae-bs {
    width: 100%;
  }

  .m-fixed {
    position: fixed !important;
  }

  /* Profile ********************************************************************/

  .profile {
    width: 100%;
    display: none;
    z-index: 11;
    top: 0;
  }

  .shop {
    width: 100%;
    top: 55;
  }

  .flsh-ad {
    top: 55;
    position: absolute;
    z-index: 15;
    padding: 10px;
  }

  .social-w {
    height: 500px;
  }

  .w-pc {
    width: 100% !important;
    height: 100vh !important;
    border-radius: 0px !important;
    padding: 0px !important;
  }

  .w-ps {
    width: 100% !important;
  }

  .fb-page,
  .fb-page span,
  .fb-page span iframe[style] {
    width: 100% !important;
    height: 100% !important;
  }

  .kbtn-s button {
    display: inline-block;
    width: 100%;
    height: 40px;
    padding: 4px 8px;
    color: var(--clr-clean) !important;
    border: none;
    background-color: var(--clr-warning);
    font-weight: 400;
    cursor: pointer;
  }

  .ps-dp-p {
    width: 47% !important;
  }

  .w-pcc {
    height: 100%;
    width: 100%;
    top: 45px;
  }

  .w-pcc-i {
    margin-right: 0px;
  }



  .prd-mdl-crsl {
    left: 20px !important;
    top: -67px !important;
    height: 360px !important;
    width: 250px !important;
  }

  .prdsrv-flr {
    width: 215px;
    height: 310px;

  }

  .mflx {
    display: flex;
  }

  .mctr {
    justify-content: center !important;
  }

  .mclr-dgry {
    color: #8f8f8f !important;
  }

  .mclr-kl {
    color: #067c9b !important;
  }

  /* Item Card - Shop ***********************************************************/
  .shelf {
    padding: 10px 10px 10px 10px;
  }

  .ps-dp {
    justify-content: flex-start;
  }

  .mob-is {
    width: 60px !important;
    height: 60px !important;
  }

  .mob-is img {
    width: 50px !important;
    height: 55px !important;
  }

  .ae-ps-w {
    width: 100%;
    flex-direction: column;
  }

  .ae-p-c-w {
    width: 100%;
    border: 1px solid #e5e5e5;
  }

  .ae-c-i {
    width: 100%;
  }

  .ae-c-i img {
    width: 72px !important;
    height: 70px !important;
  }

  .ae-ps-psd {
    width: 100%;
    margin-left: 0px;
  }

  .ae-ccp {
    max-width: 47.6%;
  }

  .ps-bi {
    padding: 0px !important;
  }

  .ps-dp-ps {
    width: 47.5%;
    margin: 4px;
    box-shadow: 0px 0px 4px 0px #DDD;
  }

  .po-ad {
    width: 100%;
  }

  .po-dtl {
    margin: 0px;
  }

  /* Add Product ***********************************************************/
  .chkbx {
    width: 35px !important;
  }

  /* Sales invoice ***********************************************************/
  .si-o {
    flex-direction: row !important;
  }

  .si-s-w {
    flex-direction: column !important;
  }

  .si-s-d {
    width: 100% !important;
    height: 175px;

  }

  .si-tr {
    margin-top: 0px !important;
  }

  .si-wst {
    display: flex;
    justify-content: space-between;
  }

  .si-s-w {
    height: 390px !important;

  }



  /* index ***********************************************************/
  .w-kpr-l-c {
    width: 100%;
  }

  .kpr-i {
    margin-right: 0px;
  }

  .kpr-i img {
    height: 180px;
    box-shadow: 0px 4px 12px #131313;
    border-radius: 16px;
  }

  .kpr-l-h img {
    height: 50px;
  }

  .mob-fs {
    font-size: 24px;
  }

  .kpr-c {
    padding: 20px;
  }

  .l-su a {
    font-size: 22px;
    font-weight: 600;
    top: 5px;

  }

  #contact-right {
    width: 100%;
  }

  .bs-hdr {
    width: 100% !important;
  }

  .m-rspnse {
    z-index: 12;
    position: absolute;
  }

  /* Cart *******************************************/
  .tqty input {
    width: 100% !important;
    text-align: center;
  }

}

/* @media only screen and (max-height: 500px){
.tab-content {
  height: 80% !important;
}

}

@media only screen and (max-height: 700px){
.tab-content {
  height: 86.5% !important;
}

}

@media only screen and (max-height: 900px){
.tab-content {
  height: 90%;
}

} */