html {
    text-size-adjust: none;
    --main-color: var(--primary-color);
    --highlighted-color: var(--primary-color);
}

html.trasnparent {
    background: transparent !important;
}

body {
    text-size-adjust: none;
}

@keyframes gradientAnimation {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translate3d(100%, 0px, 0px)
    }

    70% {
        opacity: 0;
        transform: translate3d(100%, 0px, 0px)
    }

    100% {
        opacity: 1;
        transform: translate3d(0px, 0px, 0px)
    }
}

@keyframes backnforth {
    0% {
        left: 0px
    }

    100% {
        left: calc(100% - 10px);
    }
}

@keyframes fadeInUp2 {
    0% {
        opacity: 0;
        transform: translate3d(0px, 30px, 0px)
    }

    100% {
        opacity: 1;
        transform: translate3d(0px, 0px, 0px)
    }
}

@keyframes fadeInLeft {
    0% {
        opacity: 0;
        transform: translate3d(100px, 0px, 0px)
    }

    100% {
        opacity: 1;
        transform: translate3d(0px, 0px, 0px)
    }
}

@keyframes zoomout {
    0% {
        opacity: 0;
        transform: scale(1.1)
    }

    100% {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes zoomIn {
    0% {
        opacity: 0;
        transform: scale(0.4)
    }

    100% {
        opacity: 1;
        transform: scale(1) 
    }
}


@keyframes fillleft {
    0% {
        width: 0%;
    }

    100% {
        width: 100%;
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes bounce {

    0%,
    20%,
    53%,
    80%,
    100% {
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        transform: translate3d(0px, 0px, 0px)
    }

    40%,
    43% {
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        transform: translate3d(0px, -30px, 0px)
    }

    70% {
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        transform: translate3d(0px, -15px, 0px)
    }

    90% {
        transform: translate3d(0px, -4px, 0px)
    }
}

@keyframes bounceIn {
    0% {
        opacity: 1;
        transform: scale3d(1, 1, 1)
    }

    60% {
        opacity: 1;
        transform: scale3d(1, 1, 1)
    }

    65% {
        opacity: 1;
        transform: scale3d(1.6, 1.6, 1.6)
    }

    70% {
        opacity: 1;
        transform: scale3d(0.9, 0.9, 0.9)
    }

    80% {
        opacity: 1;
        transform: scale3d(1.03, 1.03, 1)
    }

    100% {
        opacity: 1
    }
}


@keyframes dot-falling {
    0% {
        top: 10px;
    }

    25%,
    50%,
    75% {
        top: 0px;
    }

    100% {
        top: 10px;
    }
}

@keyframes dot-falling-before {
    0% {
        top: 10px;
    }

    25%,
    50%,
    75% {
        top: 0px;
    }

    100% {
        top: 10px;
    }
}

@keyframes dot-falling-after {
    0% {
        top: 10px;
    }

    25%,
    50%,
    75% {
        top: 0px;
    }

    100% {
        top: 10px;
    }
}

.nbHolding.animate {
    animation-name: bounce;
    animation-duration: 1s;
    animation-fill-mode: both
}

.quickadd.animate {
    animation-name: bounce;
    animation-duration: .4s;
    animation-fill-mode: both
}

.rtl .MenuParts .signin {
    font-family: inherit;
    /* line-height: 13px; */
}

@keyframes pinbounce-marker {
    0% {
        transform: translateY(-32px)
    }

    40% {
        transform: translateY(-12px)
    }

    80% {
        transform: translateY(-22px)
    }

    to {
        transform: translateY(-12px)
    }
}

div#countryDetector i#flag {
    transform: translateX(-50%);
    left: 50%;
    top: 18px;
    position: absolute
}

.iti__flag.np {
    background-color: transparent
}

.genBtn .table {
    pointer-events: none
}

#popupID {
    left: -4000px
}

.rtl .footer {
    /* right: 0; */
    /* left: auto; */
    /* bottom: -34px; */
    /* position: absolute; */
    float: right;
    box-shadow: -301px 303px 0px 300px #fafafa;
    margin-left: 1px;
}

.receiptPid .footer {
    display: none;
}

.rateit {
    display: inline-block;
    position: relative;
    user-select: none
}

.rateit .rateit-range {
    position: relative;
    display: inline-block;
    background: url("star.gif");
    height: 16px;
    outline: 0
}

.rateit .rateit-range * {
    display: block
}

* html .rateit,
* html .rateit .rateit-range {
    display: inline
}

*+html .rateit,
*+html .rateit .rateit-range {
    display: inline
}

.rateit .rateit-hover,
.rateit .rateit-selected {
    position: absolute;
    left: 0;
    top: 0;
    width: 0
}

.rateit .rateit-hover-rtl,
.rateit .rateit-selected-rtl {
    left: auto;
    right: 0
}

.rateit .rateit-hover {
    background: url("star.gif") left -32px;
    color: var(--primary-color)
}

.rateit .rateit-hover-rtl {
    background-position: right -32px
}

.rateit .rateit-selected {
    background: url("star.gif") left -16px;
    color: var(--primary-color)
}

.rateit .rateit-selected-rtl {
    background-position: right -16px
}

.rateit .rateit-preset {
    background: url("star.gif") left -48px;
    color: var(--primary-color)
}

.rateit .rateit-preset-rtl {
    background: url("star.gif") left -48px
}

.rateit button.rateit-reset {
    background: url("delete.gif") 0 0;
    width: 16px;
    height: 16px;
    display: inline-block;
    outline: 0;
    border: 0;
    padding: 0
}

.rateit .rateit-reset span {
    display: none
}

.rateit button.rateit-reset:hover,
.rateit button.rateit-reset:focus {
    background-position: 0 -16px
}

.rateit-font {
    font-size: 50px;
    line-height: 1em;
    margin-top: 17px;
    margin-bottom: 25px
}

.rateit-font .rateit-range {
    background: 0 center;
    height: auto
}

.rateit-font .rateit-empty {
    color: #878787
}

.rateit-font .rateit-range>div {
    background: 0 center;
    overflow: hidden;
    cursor: default;
    font-size: 50px;
}

.rateit.rateit-font .rateit-reset {
    font-size: inherit;
    width: .6em;
    height: .6em;
    margin-top: .2em;
    background: gray;
    border-radius: 50%;
    position: relative;
    display: none !important
}

.rateit.rateit-font .rateit-reset span {
    display: block;
    font-weight: bold;
    color: white;
    height: calc(50% - .045em);
    top: 0;
    position: absolute;
    border-bottom: .09em solid white;
    width: 72%;
    margin-left: 14%
}

.rateit.rateit-font .rateit-reset:hover,
.rateit.rateit-font button.rateit-reset:focus {
    background: radial-gradient(at center center, #ee2e22 55%, #ee2e22 77%, #ee2e22 100%) 0 0
}

.rating-popup .title {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: -3px;
    color: #878787;
    max-width: 245px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    display: block
}

.rating-popup .sub-title {
    font-size: 13px;
    color: #878787
}

.rating-popup .rating-info {
    min-height: 80px;
}

.rating-popup.errorpopup {
    padding-top: 35px;
    height: 333px;
}

div#rating-popup.got-bad-rating {
    height: 547px;
    transition: all 0.4s;
}

.rating-popup.errorpopup .buttons-container {
    position: relative;
    display: block
}

.rating-popup.errorpopup .buttons-container .notice {
    position: absolute;
    top: -4px;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 12px;
    color: #b22d00
}

.rating-popup.errorpopup .button {
    font-family: inherit;
    min-width: 90px;
    position: relative;
    margin-right: 4px;
    display: inline-block;
    background-color: var(--primary-color);
    color: #fff
}

.rating-popup.errorpopup .button.white {
    background-color: #fff;
    /* border: 1px solid #eee; */
    color: var(--primary-color)
}

.ng-hide {
    display: none !important
}

ng-map {
    position: relative;
    display: block;
    height: 100% !important;
    width: 100% !important
}

.categories ul>li .title {
    text-transform: uppercase
}

.rtl .meta .title {
    /* float: right; */
    padding-right: 0px;
    text-align: right !important
}

.rtl .title {
    font-family: inherit !important
}

.online-vouchers-brief {
    color: #979797;
    display: block;
    font-family: inherit;
    font-size: 16px;
    line-height: 18px;
    width: 208px;
    margin: auto;
    margin-top: -9px;
    margin-bottom: 52px;
}

.rtl .customizedID .data .title {
    line-height: 30px;
    font-family: 'titlefont'!important;
    text-align: right;
}

.rtl .customizedID .addRemoveWrap {
    float: right;
    margin-right: 5px
}

.rtl .itemBags .title {
    text-align: left !important
}

.footer .menu .link li span {
    text-transform: uppercase
}

.market .itemsList .itemGrid .picture img {
    height: auto;
    width: 100%;
    margin: auto;
    transform: translateX(-50%);
    left: 50%;
    padding-top: 0;
    /* padding-bottom: 10px; */
}

.market .newsCtrl .itemsList .itemGrid .picture img {
    padding-top: 0
}

.deskmenu .logo img {
    max-width: calc(100% - 73px);
    margin-bottom: 14px;
    max-height: 180px;
    /* margin-top: 14px; */
}

.rtl .deskmenu .logo {
    display: inline-block;
}

.retail .deskmenu .logo img {
    max-width: 187px
}

.deskmenu .logo {
    text-align: center;
    align-items: center;
    display: flex;
    margin-bottom: 11px;
    /* margin-top: 8px; */
    cursor: pointer;
    min-height: 114px;
}

.subPage .MenuParts {
    z-index: 3
}

.homePid .catReplaceID {
    display: none !important
}

.homePid .swiperID.fix {
    position: relative;
    top: auto
}

.customDropDown .drop_options {
    overflow-y: auto
}

.homePid .swiperID.fix .swiper-slide .picture {
    visibility: visible
}

.loginRegisterID .btnClose .zmdi-close,
.loginRegisterID .btnClose .zmdi-close-circle {
    color: var(--primary-color)
}

.categories ul>li .picture span {
    text-align: center;
    font-family: Roboto, sans-serif;
    font-weight: bold;
    font-size: 22px;
    color: #fff;
    padding-top: 33px;
    position: relative;
    display: block
}

.MenuParts .signedUser {
    display: block;
    cursor: pointer
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    appearance: none;
    margin: 0
}

.calIco {
    position: absolute;
    right: 6px;
    top: 13px;
    width: 19px;
    text-align: center;
    height: 19px;
    pointer-events: none;
    z-index: 2;
    background: #f6f6f6;
    padding-left: 17px
}

.signupform .calIco {
    background: transparent;
    margin-top: 6px;
    margin-right: 8px
}

.date.inputWrap .calIco {
    padding-left: 0;
}

.date.inputWrap.focused .label {
    right: 50px !important;
    top: 14px;
    display: none !important;
}

.categories .inside li a {
    cursor: pointer
}

label.missing {
    position: absolute;
    top: -12px;
    font-size: 9px;
    color: #333;
    background-image: initial;
    background-position: initial;
    background-size: initial;
    background-repeat: initial;
    background-attachment: initial;
    background-origin: initial;
    background-clip: initial;
    right: 15px;
    border-radius: 3px;
    padding-top: 4px;
    padding-bottom: 4px;
    z-index: 2;
    text-transform: uppercase;
    box-shadow: rgba(0, 0, 0, 0.05) 0 3px 6px, rgba(0, 0, 0, 0.05) 0 3px 6px;
    background-color: #fffad3 !important;
    padding-left: 6px !important;
    padding-right: 6px !important
}

span.missing-phone {
    position: absolute;
    top: -10px;
    font-size: 11px;
    color: #fff;
    background: #333;
    right: 8px;
    border-radius: 0;
    padding: 4px;
    z-index: 3
}

.modal.smallType1 {
    height: auto;
    padding-right: 27px;
    padding-left: 27px;
    min-width: 290px;
    border-radius: 6px;
    background-color: #fff !important
}

.smallType1 .title,
.smallType2 .title {
    position: relative;
    min-height: 49px;
    width: auto;
    margin-bottom: 12px;
    margin-top: 39px;
    text-align: center;
    font-size: 20px;
    color: #4d4d4c;
    font-weight: bold
}

.smallType2 .title {
    margin-bottom: 18px;
}

.modal.smallType1,
.modal.smallType2 {
    max-width: 280px
}

.smallType1 .title {
    margin-bottom: 7px;
    width: 100%;
    text-align: center;
    position: relative;
    font-weight: bold;
    font-size: 20px;
    color: #4d4d4c
}

.smallType1 .custText {
    width: 70%;
    text-align: center;
    position: relative;
    font-weight: 400;
    font-size: 14px;
    color: #4c4c4c;
    line-height: 20px;
    margin: -9px auto 39px
}

.smallType1 .moreBtn {
    margin-right: 0 !important
}

.smallType1 .genBtn,
.smallType1 .moreBtn,
.modal.smallType2 .genBtn,
.modal.smallType2 .moreBtn {
    margin-bottom: 23px;
    width: calc(50% - 6px);
    font-size: 14px;
    height: 50px;
    float: left;
    margin-right: 11px
}

.modal.smallType2 .genBtn {
    width: 100%;
    margin-top: 23px
}

.smallType1 .btnClose {
    display: none
}

.rtl .smallType1 .moreBtn,
.rtl .smallType1 .loadMore {
    font-family: inherit
}

.modal.smallType2 {
    height: auto;
    background-color: #fff;
    padding-right: 27px;
    padding-left: 27px;
    min-width: 294px;
    border-radius: 6px
}

.ngProgressLite {
    pointer-events: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 80000033;
    width: 100%
}

.ngProgressLiteBar {
    background: var(--primary-color);
    position: relative;
    height: 2px;
    width: 0;
    box-shadow: 0 0 0 var(--primary-color), 0 0 2px var(--primary-color)
}

.checkoutID .withBagOnRight .myBagModule {
    display: block
}

.rtl .myBagModule {
    right: auto;
    left: 0
}

.mob.loadMore {
    display: none !important
}

.box_delivery {
    min-height: 0
}

.box_delivery.loc .boxData {
    min-height: auto
}

.box_delivery.loc .boxData .office {
    height: auto;
}

.box_delivery.mapnaddress {
    min-height: 287px;
    position: relative;
}

.box_delivery.mapnaddress:has(.mafiad) {
    overflow: hidden;
}

.box_delivery.buttonco {
    background-color: transparent;
    box-shadow: none
}

.box_delivery .moreBtn {
    width: 80%;
    display: block;
    margin: 0 auto
}

.box_feedback .feed.missing {
    border: 1px solid var(--primary-color)
}

.box_feedback .items .item .text .time {
    text-transform: uppercase
}

.rtl .box_feedback .items .item .text .time {
    text-align: right;
    padding-right: 10px;
    height: 29px
}

.box_feedback .items .item .r-ico {
    position: absolute;
    left: 0;
    top: 0;
    width: 44px;
    height: 44px;
    border-radius: 50px;
    overflow: hidden;
    text-align: center;
    font-family: Roboto, sans-serif;
    font-size: 13px;
    line-height: 44px;
    color: #fff;
    font-weight: 300;
    background-color: #737373
}

.box_feedback .items .item.from-me .r-ico {
    background-color: var(--primary-color);
    right: 0;
    left: auto
}

.box_feedback .items .item .r-ico span {
    position: relative;
    width: 100%;
    display: block
}

.box_feedback .items .item .r-ico img {
    vertical-align: middle;
    max-width: 150%;
    position: absolute;
    height: auto;
    transform: translateX(-50%) translateY(-50%);
    margin-top: 50%;
    margin-bottom: 50%
}

.specialTable .cell {
    padding-bottom: 15px
}

.specialTable .cell.adjs {
    text-transform: capitalize
}



.inProgress {
    cursor: default;
    opacity: contrast(0.3);
    pointer-events: none
}

.genBtn.inProgress {
    cursor: default;
    filter: contrast(0.2);
    pointer-events: none;
    opacity:1;
}

.receiptPid .fullThankyou .moreBtn {
    visibility: visible;
    margin-bottom: 27px;
    margin-top: 34px;
    line-height: 52px;
    font-size: 13px;
    /* font-weight: bold; */
    cursor: pointer;
    border: 1px solid #eee;
}

.receiptPid .fullThankyou .moreBtn.greyBtn {
    background-color: transparent;
    border: 0;
    color: #666;
    width: calc(100% - 33px);
    margin-top: 5px !important;
    text-align: left;
    display: block;
    /* padding-left: 16px; */
    margin-bottom: 0px !Important;
    text-transform: capitalize;
    font-size: 12px;
    position: absolute;
    bottom: 0px;
    border-top: 1px solid #eee;
    border-radius: 0px;
}

.receiptPid .fullThankyou .moreBtn.greyBtn .timing {
    text-transform: lowercase
}

.no-data-found {
    font-family: inherit;
    font-size: 15px;
    color: #4d4d4c;
    margin-bottom: 30px;
    text-align: center;
    margin-top: 79px;
}

[ng\:cloak],
[ng-cloak],
[data-ng-cloak],
[x-ng-cloak],
.ng-cloak,
.x-ng-cloak {
    display: none !important
}

.footer .menu .link li.selected span {
    color: var(--primary-color)
}

a.selected {
    color: var(--primary-color) !important;
    font-weight: bold;
}

.editAddAddress .setAsDefaultInput {
    height: auto;
    min-height: 18px;
    text-align: center;
    white-space: nowrap;
    z-index: 1;
    margin-top: 7px;
}

.editAddAddress .setAsDefaultInput:empty {
    display: none
}

.editAddAddress .setAsDefaultInput .error {
    position: absolute;
    top: 0;
    left: auto;
    padding: 10px 10px 10px 1px;
    margin-top: -1px;
    margin-bottom: -27px;
    text-align: left;
    color: #999 !important
}

.forgotPassID .error {
    bottom: auto;
    left: auto;
    margin-top: 6px;
    position: absolute;
    top: 77px;
    width: 100%;
    color: #e22020 !important
}

.no-items-found {
    position: relative;
    display: block;
    font-size: 15px;
    color: #b1b1b1;
    text-align: center;
    width: 100%;
    margin: 55px auto auto
}

.no-items-found .genBtn {
    width: 147px;
    margin-top: 14px;
    margin-left: auto;
    margin-right: auto
}

.column_cust .block .textarea textarea {
    height: 100%;
    background-color: transparent
}

.box_instruction.notesCss .textarea textarea {
    height: 55px;
    padding-left: 1px
}

.box_instruction.notesCss .textarea textarea::placeholder {
    color: #999 !important
}

.box_instruction.notesCss .textarea textarea:focus {
    border: 1px solid #eee !important;
    padding-left: 25px !important;
    border-radius: 9px;
}

.box_instruction.notesCss .textarea textarea:focus::placeholder {
    color: #fff !important
}

.rtl .box_instruction.notesCss .textarea textarea {
    font-family: inherit;
    font-size: 11px;
}

.box_feedback .items .item .text .desc {
    font-size: 15px !important;
}

.rtl .box_feedback .items .item .text .desc {
    text-align: right;
    font-family: inherit;
    padding-right: 10px
}

.myAccountPid .error {
    bottom: -32px;
    width: 100%
}

#updateContactInfoId .error {
    left: 0;
    position: absolute;
    font-size: 13px;
    text-align: center;
    bottom: -24px;
    color: #666 !important
}

.add-tofav-guideline {
    font-family: inherit;
    font-size: 18px;
    color: #b1b1b1;
    text-align: center;
    max-width: 264px;
    margin: auto
}

li.add-tofav-guideline::before {
    font: 119px / 1 Material-Design-Iconic-Font;
    content: "\F27C";
    margin-right: 10px;
    color: #eee;
    display: block;
    margin-bottom: 25px
}

.market li.add-tofav-guideline::before {
    content: "\f004";
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
}

.retail li.add-tofav-guideline::before {
    content: "\F15E"
}

.normalForm .inputWrap.date input {
    min-height: 22px
}

#gotomarker {
    right: 0;
    top: 0 !important;
    z-index: 2147483647 !important
}

.gotomarker {
    cursor: pointer;
    width: 28px;
    height: 23px;
    background: #fff;
    margin-right: 10px;
    color: #666;
    font-size: 17px;
    text-align: center;
    padding-top: 4px
}

.gotomarker:hover {
    color: #333;
    background-color: #eee
}

.getcurrentlocation:hover {
    color: #333;
    background-color: #eee
}

.checkoutID .box_delivery .genBtn {
    width: 100%
}

.checkoutID .box_delivery .genBtn.disabled {
    width: 100%;
    cursor: default;
    background-color: #eaeaea !important;
    border: none !important;
    color: #7f7f7f !important
}

.pinLocation {
    background-color: #eee;
    display: none !important
}

.fixedmap-label {
    position: absolute;
    left: 0;
    bottom: 0;
    background: #484848;
    width: 100%;
    margin: auto auto auto 50%;
    text-align: center;
    transform: translate3d(-50%, 0px, 0px);
    color: #fff;
    z-index: 2;
    cursor: pointer;
    font-family: inherit;
    font-size: 14px;
    font-weight: bold;
    height: 45px;
    line-height: 43px
}

.fixedmap-label::before {
    position: absolute;
    content: "";
    height: 162px;
    width: 100%;
    bottom: -1px;
    left: 0
}

.editableMap {
    /* visibility: hidden; */
    position: fixed;
    /* left: -10000px; */
    top: 0;
    z-index: 10;
    width: 100%;
    height: 100%;
    background-color: #aadaff
}

.editableMap::before {
    background-image: url("../../assets/images/marker.png");
    width: 60px;
    height: 60px;
    position: absolute;
    z-index: 641;
    top: calc(50% - 20px);
    left: 50%;
    transform: translate3d(-50%, -50%, 0px);
    background-repeat: no-repeat;
    background-position: center center
}

.editableMap .mylocation-big-map {
    font-family: Roboto, sans-serif;
    position: absolute;
    left: 0;
    bottom: 50px;
    background: var(--primary-color);
    width: 65%;
    margin: auto auto auto 15px;
    padding: 8px 31px 8px 8px;
    text-align: center;
    color: #fff;
    border: 2px solid var(--primary-color);
    z-index: 100;
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
    box-sizing: border-box;
    height: 53px;
    line-height: 36px;
    border-radius: 5px 0 0 5px
}

.rtl .mylocation-big-map.ng-binding {
    font-family: inherit
}

.editableMap .mylocation-big-map i {
    margin-right: 8px
}


.hide-bag .MenuParts .bag {
    display: none !important;
}

.hide-bag .MenuParts .bag.minicv {
    display: block !important;
}

.editableMap .close-big-map {
    font-family: Roboto, sans-serif;
    position: absolute;
    right: 0;
    bottom: 50px;
    background: #404040;
    width: 35%;
    text-align: center;
    color: #fff;
    z-index: 100;
    cursor: pointer;
    font-weight: bold;
    font-size: 14px;
    height: 53px;
    line-height: 53px;
    margin-right: 11px;
    border-radius: 0 5px 5px 0
}

.rtl .editableMap .close-big-map {
    font-family: inherit
}

.editableMap .notificationCtn {
    position: absolute;
    bottom: 155px;
    left: 0;
    width: 100%;
    min-height: 30px;
    text-align: center;
    display: none
}

.editableMap .notification {
    font-family: inherit;
    background: rgba(0, 0, 0, 0.77);
    color: #fff;
    font-size: 14px;
    padding: 6px 10px;
    transform: translate3d(0px, -10px, 0px);
    transition: all .25s ease-in-out 0s;
    position: relative;
    z-index: 33333;
    text-align: center;
    opacity: 0;
    display: inline-block;
    max-width: 80%;
    border-radius: 5px
}

.editableMap .notification.show {
    opacity: 1;
    transform: translate3d(0px, 0px, 0px)
}

.rtl .closeOrderdetails {
    left: -18px;
    right: auto
}

div#AddAddressModalID .normalForm .input {
    width: auto
}

.no-map .inputWrap.textarea .input,
.no-map .inputWrap.textarea .input textarea {
    height: 47px;
    padding-top: 10px;
}

textarea::placeholder {
    color: #999
}

.modal.noCustomization.largetxt .head {
    width: 50%;
    min-height: 600px;
}

.modal.noCustomization.largetxt .cont {
    width: 50%;
    background-color: #f9f6f6;
    min-height: 599px;
}

.market.productpage .modal .cont {
    overflow: visible;
    height: auto;
    max-height: unset;
    padding-top: 22px;
}

.rtl .modal.noCustomization .onRight .bTitle {
    text-align: center
}

#bobPaymentsModalID .mainTitle {
    text-align: center;
    padding-top: 25px;
    display: none
}

#bobPaymentsModalID .line {
    margin: 22px auto 0;
    display: none
}

.box_date .title {
    margin-bottom: 16px;
    position: relative;
    font-family: inherit;
    font-weight: bold;
    font-size: 19px;
    color: #444;
    display: none;
}

.rtl .orderdetails .title {
    text-align: right
}

.rtl .footer .menu .link .title {
    text-align: left
}

.gotomarker::after {
    content: "re-center";
    position: absolute;
    bottom: -1px;
    left: 28px;
    font-size: 12px;
    top: 8px;
    color: #333
}

.gotomarker {
    cursor: pointer;
    width: 85px;
    height: 37px;
    background: #fff;
    margin-right: 10px;
    color: #666;
    font-size: 17px;
    padding-top: 10px;
    position: absolute;
    top: 10px;
    right: 0;
    box-sizing: border-box;
    text-align: left;
    padding-left: 11px;
    border-bottom: 1px solid #ccc;
    line-height: 18px
}

#getcurrentlocation {
    top: 0 !important;
    right: 86px !important
}

.getcurrentlocation {
    cursor: pointer;
    width: 106px;
    height: 37px;
    background: #fff;
    margin-right: 10px;
    color: #666;
    font-size: 17px;
    padding-top: 10px;
    position: absolute;
    top: 10px;
    right: 0;
    box-sizing: border-box;
    text-align: left;
    padding-left: 8px;
    border-bottom: 1px solid #ccc;
    line-height: 18px
}

.modal:has(.iti__selected-flag){
    overflow:visible;
}

.getcurrentlocation::after {
    content: "my location";
    position: absolute;
    bottom: -1px;
    left: 30px;
    font-size: 12px;
    top: 8px;
    color: #333
}

@media only screen and (min-width:769px) {
    .share-product.onimg .zmdi-share:before {
        margin-left: -8px;
    }

     #customizedModalID .atf.onimg {
        position: absolute;
        top: 19px;
        right: 50px;
        left: auto;
        background: rgb(0 0 0 / 31%);
        border: 4px solid #fff;
        width: 30px !Important;
        height: 30px;
        z-index: 1;
        border-radius: 100%;
        box-sizing: content-box;
        display: block;
        zoom: 0.85;
        cursor: pointer;
    }

#customizedModalID .atf.onimg .icon {
    text-align: center;
}

#customizedModalID .atf.onimg:hover {
    opacity: 0.8;
}

    .retail #customizedModalID .atf.onimg {
        display: none;
    }

    #customizedModalID .atf.onimg .icon:before {
        font-family: 'Material-Design-Iconic-Font';
        content: "\f27c";
        color: #fff;
        top: 0px;
        font-size: 27px;
    }

    .market #customizedModalID .atf.onimg .icon:before {
        content: "\f004";
        font-family: 'Font Awesome 5 Free';
        font-size: 18px;
        top: 6px;
        position: absolute;
        left: 6px;
    }

    .market #customizedModalID .atf.onimg .icon.fav:before {}

    #customizedModalID .atf.onimg .icon.fav:before {
        font-weight: 900;
        content: "\f004";
    }

    .footermenu{
        display:none!Important;
    }

    .market.productpage .share-product.onimg .zmdi-share:before {
        color: #000 !important;
        -webkit-text-stroke-width: 2px;
    }

    .rtl.market.productpage .share-product.onimg .zmdi-share:before {
        left: 15px;
    }

    .withBagOnRight .nearBag.gridSystem ul:first-child {
        min-width: calc(100% - 0px);
        min-height: 0 !important;
    }

    .rtl .withBagOnRight .nearBag.gridSystem ul:first-child {
        float: none;
    }

    .menuontop .homeFilter .filter input::placeholder {
        color: #999
    }

    .menuontop .homeFilter .filter input {
        color: #333;
        font-size: 19px;
        padding-left: 0 !important
    }

    .homePid .gridSystem .case {
        /* margin-bottom: -7px; */
        padding-bottom: 0 !important
    }

    .menuontop .applinks {
        display: none
    }

    .menuontop .deskmenu .menu li ul {
        width: max-content;
        left: 0;
        text-align: left;
        margin-left: -8px;
    }

    .menuontop .homeFilter.ontop .filter {
        height: 53px;
        display: block;
        pointer-events: none;
        overflow: hidden;
        width: calc(100% - 103px);
        margin: 0 auto auto;
        box-sizing: border-box;
        position: relative;
        padding-top: 0;
        background-color: #fff !important
    }

    .menuontop .homeFilter.ontop {
        height: 0;
        transition: all .2s linear 0s;
        display: block;
        position: fixed;
        overflow: hidden;
        left: 0 !important;
        background-color: #fff !important;
        border-radius: 0 !important;
        top: 71px !important;
        margin-top: 0 !important;
        transform: none !important
    }

    .menuontop .socials .social {
        filter: invert(1);
        opacity: .7
    }

    .menuontop .shopmenu {
        display: block
    }

    .menuontop .deskmenu .menu li ul li span {
        font-weight: 500
    }
}

@media only screen and (max-width:768px) {
    .favoritePid .MenuParts .parts .bot {
        height: 72px;
    }

    .not-logged-in .always-expanded {
    display: none;
}

    .giftcards .homeFilter,
    .favoritePid .homeFilter,
    .offers .homeFilter,
    .challenges .homeFilter, .cordova body:has(.free-cat-title) .homeFilter, .spinthewheel .homeFilter{
        display: none !important;
    }

    div#createAccountModalID.show {
        padding-bottom: 0;
        border-radius: 0
    }

    .loginRegisterID .parts .right {
        padding-bottom: 28px;
        padding-right: 0 !important
    }

    #loginFormID {
        margin-top: -13px
    }

    #createAccountModalID .error {
        width: 100%;
        bottom: -14px !important;
        text-align: center !important
    }

    #pinPayPopUp .title {
        margin-top: 34px;
        text-transform: uppercase !important
    }

    .createAccountID .genBtn {
        margin-bottom: 40px;
        margin-top: 40px
    }

    .favoritePid .generalMainTitle {
        padding-top: 33px;
        padding-bottom: 13px;
        padding-left: 10px;
        font-weight: normal;
    }

    .generalMainTitle {
        padding-left: 14px;
        padding-bottom: 19px;
        box-sizing: border-box;
        /* margin-top: 25px; */
    }

    .rtl .generalMainTitle {
        text-align: right
    }

    .closeNew .zmdi-close-circle {
        margin-left: 9px
    }

    .customizedID .addToFav {
        width: 100%;
        text-align: center;
        text-transform: uppercase;
        position: absolute;
        top: -58px
    }

    .fnb .customizedID .addToFav {
        position: relative;
        bottom: auto;
        top: 55px;
    }

    #customizedModalID .addToFav {
        background-color: #eee;
        width: 100% !important
    }

    #customizedModalID .atf.onimg {
        position: absolute;
        top: 125px;
        right: 22px;
        left: auto;
        background: rgb(0 0 0 / 31%);
        border: 4px solid #fff;
        width: 30px !Important;
        height: 30px;
        z-index: 1;
        border-radius: 100%;
        box-sizing: content-box;
        display: block;
    }

    .retail #customizedModalID .atf.onimg {
        display: none;
    }

    #customizedModalID .atf.onimg .icon:before {
        font-family: 'Material-Design-Iconic-Font';
        content: "\f27c";
        color: #fff;
        top: 0px;
        font-size: 27px;
    }

    .market #customizedModalID .atf.onimg .icon:before {
        content: "\f004";
        font-family: 'Font Awesome 5 Free';
        font-size: 18px;
        top: 6px;
        position: absolute;
        left: 6px;
    }

    .market #customizedModalID .atf.onimg .icon.fav:before {}

    #customizedModalID .atf.onimg .icon.fav:before {
        font-weight: 900;
        content: "\f27d";
    }

    #customizedModalID .atf.onimg .icon {
        text-align: center;
    }

    #customizedModalID .atf.onimg .ico {
        top: -16px;
        opacity: 1;
        color: #fff;
        left: 1px;
    }

    #customizedModalID .atf.onimg .ico .zmdi {
        color: #fff;
        font-size: 25px;
        -webkit-text-stroke: 0.2px #fff;
    }

    .customizedID .addToFav .ico {
        position: relative;
        width: 17px;
        display: inline-block;
        top: -9px
    }

    .customizedID .addToFav .ico .heart {
        top: 1px
    }

    .customizedID .addToFav .txt {
        display: inline-block;
        padding-left: 8px;
        font-size: 14px
    }

    .thebig-ul {
        min-height: 800px
    }

    .add-tofav-guideline {
        font-family: Roboto, sans-serif;
        font-size: 15px;
        text-align: center;
        color: #999;
        margin-top: 40%
    }

    li.add-tofav-guideline::before {
        content: "\F15E";
        font-family: Material-Design-Iconic-Font;
        color: var(--primary-color);
        font-size: 35px;
        display: block;
        margin-bottom: 18px
    }

    .no-data-found {
        font-size: 15px;
        color: #999;
        margin-bottom: 50px;
        text-align: center;
        /* display: none; */
    }
}

@media(max-width:768px) {
    .loginRegisterID .listingAccount {
        margin-top: -202px;
        visibility: hidden
    }

    .label::before {
        position: absolute;
        content: "";
        inset: -10px -10px -10px -24px;
        z-index: 1
    }

    .normalForm input {
        height: 100%
    }

    .myAccountPid .fontChange .normalForm input {}

.rtl .myAccountPid .iti--show-flags {
    padding-right: 10px;
}

    .whiteBox .boxes .box .pen::before {
        position: absolute;
        content: "";
        inset: -10px -10px -10px -24px
    }

    .whiteBox .boxes .box .pen::before {
        position: absolute;
        content: "";
        inset: -10px -10px -10px -24px
    }

    .whiteBox .boxes .box .delete::before {
        position: absolute;
        content: "";
        inset: -10px -18px -10px -10px
    }

    .itemGrid .heart .zmdi::after {
        position: absolute;
        content: "";
        inset: -9px -28px -33px -24px;
    }

    .market .itemGrid .heart {
        right: 4px;
    }

    .zmdi-menu::after {
        position: absolute;
        content: "";
        inset: -24px 13px -24px -15px;
        width: 65px
    }

    .mobileMenuWrap ul li a::before {
        position: absolute;
        content: "";
        inset: -10px 154px -10px -24px
    }

    .myBagModule .itemBags .icons .ico::before {
        /* position: absolute; */
        /* content: ""; */
        /* top: -13px; */
        /* width: 36px; */
        /* left: 5px; */
        /* bottom: -8px; */
    }

    body {
        visibility: visible;
        height: auto;
        /* min-height: unset; */
    }

    i.zmdi.zmdi-filter-list {
        font-size: 22px;
        margin-top: 5px;
        position: absolute;
        left: 7px;
    }

    .pbody {
        /* padding-top: 10px; */
        padding-right: 10px;
        padding-left: 14px;
        box-sizing: border-box;
        padding-bottom: 40px !important;
        width: calc(100%) !important;
    }

    .pbody li {
        margin-bottom: 12px;
        margin-top: 9px
    }
}

@media(min-width:769px) {
    body {
        visibility: visible
    }

    .cb-wrapper{
        
    }

    .recommendedItems .modal-container .thebig-ul {
        padding-left: 0px !important;
    }

    .rtl .notloggedin .reviewBox .rBox.left {
        position: unset;
    }

    .menuontop .MenuParts.fix .parts {
        width: calc(100% - 100px);
        position: relative;
        margin: auto
    }

    .menuontop .MenuParts.fix {
        background-color: #fff;
        height: 72px;
        z-index: 12;
    }

    .menuontop .MenuParts .parts .bot {
        background-color: #fff;
        border-bottom: 1px solid #ddd
    }

    .checkoutID .reviewBox .rBox {
        width: 60%;
        float: left;
        /* margin-left: 14px; */
    }

    .menuontop .reviewBox .left.rBox {
        width: calc(42% - 20px)
    }

    .notloggedin .reviewBox .left.rBox {
        /* margin-top: 26px; */
    }

    .menuontop .checkoutID .right.rBox {
        width: calc(60% - 20px);
    }

    .retail .orderdetails .menuontop .right.rBox {}

    .pemail .lblText {
        border-top: 0 solid #eee;
        border-bottom: 1px solid #eee;
        width: 95.4%
    }

    .rtl .pemail .lblText {
        margin-left: auto;
        margin-right: 26px
    }

    .createAccountID .normalForm {
        display: inline-block
    }

    .box_feedback .feed textarea {
        border-top: 0;
        border-bottom: 0px;
    }

    .orderdetails .box_feedback {
        padding-bottom: 103px;
        background-color: #fff;
        border: 1px solid #fff;
        margin-bottom: 0px;
        margin-top: 15px;
    }

    .orderdetails .box_feedback .feed {
        width: calc(100% - 649px);
        bottom: 15px;
        border: 1px solid #e9e3e3;
        box-sizing: border-box;
        box-shadow: rgba(0, 0, 0, 0.08) 0 3px 6px, rgb(0 0 0 / 0%) 0 3px 2px;
        left: 13px;
        animation-name: bounce;
        animation-duration: 1s;
        animation-fill-mode: both;
        left: 322px;
    }

    .orderdetails .subTotalBox {
        min-height: 120px
    }

    .orderdetails .itemBags {
        width: calc(100% - 40px);
        margin: auto
    }

    .orderdetails .reviewBox .rBox .wrap {
        /* width: 100%; */
    }

    .orderdetails .bagScroll {
        width: 100%;
        background-color: #f6f6f6 !important;
        /* padding: 30px; */
    }

    .orderdetails .minitotal {
        /* display: none; */
    }

    .orderdetails .bagph {
        display: none
    }

    .orderdetails .myBagModule {
        position: relative
    }

    .orderdetails .reviewBox .rBox {
        /* width: 100%; */
    }

    .orderdetails .box_delivery .boxData {
        width: 100%;
        float: none;
        display: block
    }

    .orderdetails .reviewBox .rBox.left {
        /* background-color: #f6f6f6; */
        /* display: block; */
        /* float: right; */
        width: 100%;
        /* min-height: 150px; */
        /* margin-right: 0; */
        /* z-index: 1; */
        /* padding-top: 22px; */
        float: none !Important;
        margin: auto;
    }

    .orderdetails .location.editM {
        /* position: absolute; */
    }

    .orderdetails .box_delivery .office {
        margin-top: 0;
        width: 100%;
        /* border-top: 1px solid #eee; */
        border-bottom: 1px solid #eee
    }

    .orderdetails .orders .order .withTitle {
        display: block;
        float: none;
        width: 100%
    }

    .menuontop .newAddress.nonead.add {
        background-color: #f6f6f6
    }

    .addAddress .newAddress .ico {
        margin-left: -13px
    }

    .newAddress.edit .ico {
        margin-right: -24px
    }

    .box_delivery .btm {
        height: 34px
    }

    .menuontop .checkoutID .mCSB_container {
        height: calc(100% - 87px) !important
    }

    .box_instruction .label {
        font-size: 15px;
        min-width: 200px;
    }

    .checkoutID .reviewBox .rBox.left {
        background-color: #fff;
        width: 40%;
        padding: 18px;
        float: left;
    }

    .noCustomization .genBtn {
        width: 100%
    }

    .clear-bag {
        font-size: 9px !important;
        margin-bottom: -6px;
    }

    .market .clear-bag {
        padding-top: 12px;
    }

    .myBagModule .itemBags .icons .ico .zmdi-delete {
        margin-left: 0
    }

    .retail #customizedModalID .addToFav {
        /* margin-top: 26px !important; */
    }

    .retail #customizedModalID .addToFav {
        /* left: -7px !important; */
        top: 11px !important;
        right: 47px !important;
    }


    .retail #customizedModalID .addToFav .zmdi {
        font-size: 21.5px;
        color: #000;
        top: 5px;
        left: -2px;
        -webkit-text-stroke: 1px;
    }

    .customizedID .genBtn::before {
        content: attr(data-nbofcalories);
        position: fixed;
        left: 22px;
        font-weight: bold;
        opacity: 1;
        color: #fff;
        height: 58px;
        line-height: 59px;
        font-size: 13px;
        z-index: 3;
        letter-spacing: 0;
    }

    .checkoutID .notloggedin .box_delivery .genBtn {
        left: 50%;
        transform: translateX(-50%);
        bottom: -29px;
        display: none;
        margin-top: 28px !important;
        position: absolute !important
    }

    .retail .checkoutID .notloggedin .box_delivery .genBtn {
        left: auto;
        transform: none;
        display: none;
        position: relative !important;
        margin: auto !important
    }

    .retail .flmenubtn.retailonly {
        display: none !important
    }

    div#loginRegisterModalID {
        border-radius: 8px;
        max-width: 375px
    }

    .createAccountID .parts .part {
        box-sizing: border-box
    }

    .createAccountID .parts .part.right {
        padding-left: 12px
    }

    .createAccountID .parts .part .input {
        width: 100%
    }

    .productpage #customizedModalID .addToFav {
        right: 79px !important;
    }

    .rtl.productpage #customizedModalID .addToFav {
        right: auto !important;
        left: 68px !important;
    }




}

@media(max-width:768px) {
    .locale-select-top {
        display: none
    }

    .noOrder .locale-select-top {
        display: block
    }
}

.locale-select-top {
    height: 36px;
    overflow: hidden;
    float: left;
    margin-right: -7px;
    padding-top: 10px;
    box-sizing: border-box;
    padding-left: 11px;
    position: relative;
    padding-right: 26px;
    width: 61px;
    background-color: rgba(0, 0, 0, 0.29)
}

.noOrder .locale-select-top:first-child {
    display: none
}

.noOrder .locale-select-top:last-child {
    margin-right: 0;
    margin-top: -1px
}

.locale-select-top::after {
    right: 16px;
    position: absolute;
    top: 9px;
    content: "\F2F2";
    font: 20px / 1 Material-Design-Iconic-Font;
    color: #fff;
    pointer-events: none
}

.noOrder .select-locale-top.menuList {
    display: block
}

.onelanguage.noOrder .select-locale-top.menuList {
    display: none
}

.locale-select-top select {
    background-color: transparent;
    color: #fff;
    text-transform: uppercase;
    border: 0;
    font-size: 12px;
    width: 47px;
    font-weight: bold
}

.locale-select-top option {
    color: #333
}

.subPage .categories li a::before {
    position: absolute;
    content: "";
    top: -23px;
    width: 100%;
    left: -1px;
    bottom: -21px
}

@media(max-width:768px) {
    .errorpopup {
        padding-top: 14%
    }
}

.errorpopup .message::before {
    content: "\F1F7";
    font-family: Material-Design-Iconic-Font;
    color: var(--primary-color);
    font-size: 35px;
    display: block;
    margin-bottom: 18px
}

.errorpopup .button {
    width: calc(50% - 17px);
    font-size: 14px;
    cursor: pointer;
    height: 45px;
    line-height: 45px;
    text-transform: uppercase;
    text-align: center;
    box-sizing: border-box;
    font-family: inherit;
    display: inline-block;
    border-radius: 10px
}

.errorpopup .button.switch {
    background-color: var(--primary-color);
    color: #fff;
    border: 0
}

.errorpopup .button {
    /* border: 1px solid #ccc; */
    background-color: #fff;
    color: var(--primary-color);
    margin-top: 34px;
    margin-left: 4px;
    margin-right: 4px;
}

div#countryDetector .button.switch {
    width: 110px;
    position: absolute;
    bottom: 10px;
    height: 35px;
    border-radius: 5px;
    font-size: 12px;
    line-height: 35px
}

div#countryDetector .button {
    right: 22px;
    left: auto
}

.rtl div#countryDetector .button.switch {
    line-height: 19px
}

div#countryDetector .button.white {
    width: 110px;
    position: absolute;
    bottom: 10px;
    left: 19px;
    height: 35px;
    border-radius: 5px;
    font-size: 12px;
    background-color: #fff;
    line-height: 35px
}

.rtl div#countryDetector .button.white {
    line-height: 19px
}

.errorpopupoverlay {
    position: fixed;
    bottom: 0;
    transform: translate3d(0px, 0px, 0px);
    height: 0;
    width: 100%;
    z-index: 888888888;
    background-color: rgba(0, 0, 0, 0);
    transition: background-color .3s linear 0s;
    pointer-events: none
}

.errorpopupoverlay.show {
    background-color: rgba(0, 0, 0, 0.6);
    height: 100%;
    pointer-events: all;
}

.errorpopupoverlay.bold.show {background-color: rgba(0, 0, 0, 0.92);}

.errorpopupoverlay.loading {
    background-repeat: no-repeat;
    background-position: center center;
    background-color: rgba(0, 0, 0, 0.6)
}

@keyframes spinner {
    100% {
        transform: rotate(360deg)
    }
}

.errorpopupoverlay.loading::before {
    content: "";
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    margin-left: -10px;
    border-radius: 50%;
    border-top: 2px solid #fff;
    border-right: 2px solid transparent;
    animation: .6s linear 0s infinite normal none running spinner
}

.errorpopup.show {
    transform: translateX(-50%) translateY(-50%);
    top: 50%;
}

.errorpopup.ebottom.cipop {
    box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.5);
}

.errorpopup.ebottom.loywelcome .title::before {
    content: "\F27A" !important
}

#saveCardConfirmation .errorpopup {
    min-height: 210px !important
}

div#currencyList,
div#countryList,
div#languageList,
div#countryDetector {
    width: 270px;
    height: auto;
    transform: translate3d(-200%, 0px, 0px);
    bottom: auto;
    top: 68px;
    left: 30px;
    border-radius: 4px;
    padding: 0 0 0px;
    zoom: 1.1;
}

div#currencyList.show,
div#countryList.show,
div#languageList.show,
div#countryDetector.show {
    transform: translate3d(0px, 0px, 0px);
    box-shadow: rgba(0, 0, 0, 0.13) 0 10px 20px, rgba(0, 0, 0, 0) 0 6px 6px
}

.multibranch div#countryList::before {
    background-color: #eee;
    position: absolute;
    width: 100%;
    left: 0;
    top: -59px;
    padding: 22px;
    box-sizing: border-box;
    font-weight: bold;
    border-bottom: 1px solid #eee;
    font-size: 14px
}

.multibranch #countryList.show {
    top: 70px;
    left: 36px;
    width: 317px;
    zoom: 1.1;
}

div#countryDetector {
    height: 200px
}

div#countryList .button,
div#languageList .button {
    display: none
}

div#currencyList .title,
div#countryList .title,
div#languageList .title {
    padding-bottom: 18px;
    font-weight: bold;
    display: none
}

div#currencyList .title,
div#countryList .title {
    display: block;
    background-color: #eee;
    padding: 20px;
    border-radius: 5px 5px 0 2px;
    margin-bottom: 9px;
    text-align: left;
    padding-left: 22px;
}

.loginRegisterID .genBtn.fbType {
    background-color: #2c4988;
    box-sizing: border-box;
    text-align: center;
    line-height: 56px;
    margin-bottom: 72px;
    width: 100%;
    display: none;
    color: #fff !important;
    border: 1px solid #2c4988 !important
}

.loginRegisterID .genBtn.fbType::after {
    content: "or with your email";
    position: absolute;
    top: 64px;
    color: #999;
    width: 100%;
    text-align: center;
    left: 50%;
    transform: translateX(-50%);
    text-transform: lowercase;
    pointer-events: none
}

.rtl .loginRegisterID .genBtn.fbType::after {
    visibility: hidden
}

#paymentiframe {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 480px
}

.socials .social.customIcons {
    height: 16px;
    position: relative;
    display: block;
    width: 17px
}

.socials .social.customIcons img {
    position: absolute;
    left: 0;
    top: 0;
    transition: opacity .3s ease-in-out 0s
}

.footer .menu .link li.customIcons .ico {
    width: 13px
}

.footer .menu .link li.customIcons .ico img {
    position: absolute;
    left: -1px;
    top: 0;
    transition: opacity .3s ease-in-out 0s
}

@media(min-width:769px) {
    .socials .social.customIcons:hover .main {
        opacity: 0
    }

    .footer .menu .link li.customIcons:hover .ico .main {
        opacity: 0
    }
}

.column_cust .block .extra-note {
    position: relative;
    font-weight: 400;
    font-size: 11px;
    margin-top: 8px;
    display: block;
    color: #999;
    margin-left: 2px;
    margin-right: 2px;
    line-height: 17px;
    text-align: center;
    text-transform: uppercase
}

.whiteBox .boxes .box .pen {
    position: absolute;
    right: 50px;
    top: 170px;
    color: #999;
    font-size: 20px;
    cursor: pointer
}

.rtl .whiteBox .boxes .box .pen {
    right: auto;
    left: 62px;
}

.editaccountp .pen {
    display: none
}

.whiteBox .boxes .box .delete {
    position: absolute;
    right: 16px;
    top: 170px;
    color: #999;
    font-size: 22px;
    cursor: pointer
}

.rtl .whiteBox .boxes .box .delete {
    left: 26px;
    right: auto;
}

.removeMap .delete {
    bottom: auto !important;
    top: 22px !Important;
}

.removeMap .pen {
    bottom: auto !important;
    top: 22px ! Important;
}

@media(min-width: 769px) {
    .whiteBox .delete:hover .zmdi {
        color: var(--primary-color)
    }

    .market .itemGrid:hover .zmdi-star-outline:before {
        opacity: 1;
    }

    body {
        visibility: visible;
        transition: all .2s linear 0s !important
    }



    .recommendedItems .modal-container>.title {
        padding-left: 0px !important;
    }

    .rtl .loginor {
        margin-right: -20px;
    }

    .retail .meta .sku {
        /* margin-top: -18px!Important; */
        margin-bottom: 22px;
    }

    .market.enablesorting .filters-wrapper {
        background: #f6f6f6;
        margin-top: 9px;
        margin-bottom: -20px;
        padding: 7px;
        border-radius: 7px;
        min-height: 49px;
        margin-bottom: 26px;
    }

    .content:has(.no-data-found) .filters-wrapper,
    .content:has(.no-data-found) .sorter {
        /* display: none!important; */
    }

.enablesorting .categoryPid .sorter {
    bottom: auto!important;
    right: 0px!important;
    top: 1px;
}

    .menuontop .parts .bot {
        background-color: #fff;
        border-bottom: 1px solid #ddd;
        height: 70px
    }

    .myBagModule .itemBags .addRemoveWrap {
        /* bottom: 3px; */
    }

    .myBagModule .itemBags .icons {
        /* top: 11px; */
        /* padding-left: 15px; */
    }

    .menuontop .myBagModule.stick .wrapTotalBtn {
        position: absolute;
        left: 0;
        bottom: 62px;
        display: none
    }

    .reviewbag .myBagModule.stick .itemBags {
        width: calc(100% - 12px);
        padding-left: 12px;
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
        grid-gap: 12px;
        /* align-items: stretch; */
        /* justify-items: start; */
        /* align-content: stretch; */
        /* float: left; */
    }

    .reviewbag .myBagModule .genBtn {
        right: 15px;
        width: 269px;
        transform: none;
        left: auto
    }

    .menuontop div#popupID {
        /* height: 100vh; */
        top: 0px;
        /* bottom: 0; */
        margin: auto;
        /* left: auto!important; */
        /* height: inherit!important; */
        /* transform: translateX(-50%); */
        /* left: 50%!important; */
        width: 100%;
    }

    .menuontop .inproduct div#popupID {
        height: inherit !important;
        margin-bottom: 41px;
    }

    .menuontop .searchopen div#popupID {
        margin-bottom: -56px !Important;
    }

    .menuontop .checkoutbag {
        display: none
    }

    .signupform .verifymobilewrap {
        margin-bottom: 44px;
        width: 100% !important;
        /* margin-top: 0px !important; */
    }

    .disable-mobile-verification .signupform .verifymobilewrap {
        margin-bottom: 16px
    }

    .signupform.smssent .verifymobilewrap {
        margin-bottom: 97px;
        transition: all .3s cubic-bezier(0.4, 0, 1, 1) 0s
    }

    .signupform .inputWrap {
        width: calc(50% - 2px);
        display: inline-block
    }

    .disable-mobile-verification .inputWrap.verifymobilewrap {
        /* margin-top: -13px !important; */
    }

    .productpage .relations .title {
        /* text-align: center; */
        margin-top: 82px;
        font-size: 22px
    }

    .productpage .relations {
        background-color: #fff;
        padding: 0
    }

    .productpage .customizedID .head {
        /* min-height: 780px !important; */
    }

    .rtl.productpage .customizedID .head {
        float: right;
        /* margin-left: 2px; */
        padding-left: 2px;
    }

    .market.productpage .customizedID .head {
        min-height: unset !important;
        padding-top: 41px;
    }

    .productpage body.showModal .backgroundModal {
        /* margin-top: 120px; */
    }

    .productpage body.showModal.subPage .backgroundModal {
        background-color: rgba(40, 37, 37, 0.7);
        transition: all .3s linear 0s
    }

    .productpage .customizedID .picture .swiper-container {
        border-color: #fff !important;
        border-radius: 9px;
        border: 0px !important;
    }

    .productpage .customizedID .wrap-c,
    .productpage .customizedID .head,
    .productpage .customizedID .cont {
        background-color: #fff !important;
    }

    .rtl.productpage .customizedID .wrap-c {
        direction: rtl;
    }

    .productpage .customizedID .cont {
        float: left;
    }

    .productpage .customizedID .cont {
        padding-top: 99px;
        padding-left: 31px !important;
        max-width: 590px;
        padding-top: 40px !important;
        margin-left: 0px;
    }

    .rtl.productpage .customizedID .cont {
        /* margin-left: 48px; */
        float: right;
        padding-top: 0px;
        padding-left: 0px !important;
        padding-right: 19px;
    }

    .productpage .customizedID .wrap-c {
        display: flex;
        flex-direction: column-reverse;
    }

    .market.productpage .customizedID .wrap-c {
        display: block;
    }

    .productpage div#customizedModalID,
    .productpage div#customizedModalID.rigid {
        /* max-width: 1300px; */
        /* box-shadow: #fff 0 0 0 1000px; */
        margin-top: 0;
        transition: none 0s ease 0s;
        /* top: -69px !important; */
        /* transform: translate3d(-50%, 0px, 0px) !important; */
        background-color: #fff !important;
        padding-top: 112px;
    }

    .menuontop.productpage div#customizedModalID {
        padding-top: 51px;
        position: relative;
        transform: none !important;
        left: auto;
    }

    .menuontop.productpage.slimmenu div#customizedModalID {
        padding-top: 27px;
    }

    .productpage:not(.menuontop) div#customizedModalID,
    .productpage.retail:has(.exist) div#customizedModalID {
        /* box-shadow: 525px 519px 0px 520px #fff; */
        top: auto !important;
        left: auto !important;
        width: 100%;
        /* max-width: none!important; */
        transform: none !important;
        padding-top: 0px;
        position: relative;
        transform: none !important;
        padding-top: 27px;
    }

    .market.productpage:not(.menuontop) div#customizedModalID,
    .market.productpage.productpage:not(.menuontop) div#customizedModalID.rigid,
    .market.productpage div#customizedModalID {
        top: auto !important;
        position: relative;
        left: auto !important;
        margin-right: 0px;
        width: 100% !important;
        padding-top: 11px;
        box-shadow: none;
    }

    .productpage.hide-bag:not(.menuontop) div#customizedModalID,
    .productpage.hide-bag:not(.menuontop) div#customizedModalID.rigid {
        width: calc(100vw - 341px) !important;
        /* height: fit-content; */
        /* overflow: visible; */
        padding-bottom: 50px;
        padding-top: 55px;
    }

    .productpage div#customizedModalID .btnClose {
        filter: invert(1);
        right: -8px !important;
        top: 64px !important;
        /* display: none; */
        left: auto !important;
        /* zoom: 1.3; */
    }

    .retail.menuontop.productpage div#customizedModalID .btnClose {
        /* top: 120px!important; */
    }

    .market.productpage div#customizedModalID .btnClose {
        top: 14px !important;
        right: 6px !important;
        opacity: 0.3;
    }

    .rtl.productpage div#customizedModalID .btnClose {
        right: auto !important;
        left: 44px !important;
        /* top: 20px!important; */
    }

    .productpage div#customizedModalID .btnClose i {
        font-size: 36px;
    }

    .retail .box_delivery .boxData {
        /* background-color: #f6f6f6; */
    }

    .menuontop .widgets {
        max-width: 1500px
    }

    .widgets {
        margin: auto;
        max-width: calc(100% - 30px)
    }

    .menuontop .footer {
        width: 100%
    }

    .menuontop .showminicart .footer {
        width: calc(100% - 301px)
    }

    .rtl.menuontop .showminicart .footer {
        right: 301px;
    }

    .menuontop .deskmenu li a span {
        font-family: textfont;
        font-size: 14px
    }

    .menuontop .deskmenu .menu li {
        break-inside: avoid;
        display: block
    }

    .menuontop li.swiper-slide.colle:first-child {
        margin-left: 16px;
    }

    .menuontop .deskmenu .menu li.hide-coll-on-homepage {
        display: none
    }

    .menuontop .tabled {
        display: flex;
        justify-content: center;
        position: fixed;
        z-index: 2;
        top: 2px;
        width: 100% !important;
        left: 50%;
        transform: translateX(-50%);
        height: 50px;
        overflow: hidden;
        transition: all .2s linear 0s;
    }

    .menuontop.slimmenu .tabled {
        overflow: visible;
    }

    .menuontop .fixing .tabled {
        box-shadow: 0 4px 4px #a3a3a31a;
    }

    .menuontop .searchopen .tabled {
        top: -2px;
    }

    .menuontop .topmenuopen .tabled {
        transition: all 0s linear 0s;
        height: calc(100vh - 105px) !important;
        /* overflow: visible; */
    }

    .menuontop .deskmenu .pages {
        margin-top: -4px;
        padding-left: 15px;
        padding-right: 34px;
        width: 100%;
        box-sizing: border-box;
        height: 100%;
        /* box-shadow: 1px 2px 4px #5e73901a; */
        margin-left: 0px;
    }

    .menuontop.slimmenu .deskmenu .pages {
        text-align: left;
        white-space: nowrap;
    }

    .menuontop .deskmenu .pages:before {
        content: "";
        width: 100%;
        height: 48px;
        background: #fff;
        position: absolute;
        left: 0px;
        top: 0px;
        z-index: -1;
        /* border-bottom: 1px solid #eee; */
    }

    .topmenuopen .pages {
        background: transparent !important;
    }

    .menuontop .deskmenu .bottom {
        position: absolute;
        width: 100vw;
        height: 100%;
        /* background: #fff; */
    }

    .menuontop.slimmenu .deskmenu .bottom {
        width: 100%;
    }

    .menuontop .bagph {
        transform: translateX(400px);
        transition: all .2s ease-in 0s
    }

    .menuontop .searchopen .bagph .myBagModule.stick {
        padding-top: 54px
    }

    .menuontop .checkoutID .bagph,
    .menuontop .checkoutID .myBagModule.stick {
        transform: translateX(0px);
        transition: all .3s linear 0s
    }

    .menuontop .showminicart .bagph {
        transform: translateX(0px);
        transition: all .2s ease-out 0s
    }

    .menuontop.slimmenu .bagph {
        top: 71px !important;
        height: calc(100vh - 71px) !important;
    }

    .menuontop .content .myBagModule.stick {
        display: none !important
    }

    .menuontop .checkoutID .bagph,
    .menuontop .checkoutID .myBagModule.stick {
        transform: translateX(0px);
        transition: all .3s ease 0s
    }

    .menuontop .checkoutID .bagph,
    .menuontop .checkoutID .myBagModule.stick {
        z-index: 8
    }

    .menuontop .checkoutID .bagph .myBagModule .itemBag {
        max-width: none
    }

    .menuontop .bagph {
        top: 120px !important;
        height: calc(100vh - 120px) !important;
    }

    .reviewbag .bagph {
        width: 80vw;
        background-color: #fff;
        z-index: 8
    }

    .fnb .reviewbag .bagph,
    .market .reviewbag .bagph {
        width: 80vw
    }

    .menuontop .bagph {
        z-index: 10
    }

    body.reviewbag #wrapper::before {
        content: "";
        position: fixed;
        background-color: rgba(0, 0, 0, 0.42);
        width: 4000px;
        left: 0;
        height: 100%;
        z-index: 4;
        pointer-events: none;
        top: 0
    }

    .retail body.reviewbag #wrapper:before {
        top: 71px
    }

    .menuontop .deskmenu .hotl {
        position: fixed;
        right: 52px;
        top: 9px;
        padding: 0
    }

    .enablesorting .categoryPid .titleAndLegend {
        width: calc(100% - 287px);
    }

    .rtl.enablesorting .categoryPid .titleAndLegend {
        display: inline
    }

    .delivery-date {
        padding-right: 22px;
        position: absolute;
        z-index: 1;
        right: 2px;
        padding-top: 27px;
        text-align: right !important;
        margin-bottom: -22px !important;
        color: #999 !important
    }

    .rtl .delivery-date {
        right: auto;
        left: 22px;
        direction: rtl
    }

    body.checkoutID {
        background-color: #eee;
        transition: background-color .4s linear 0s !important;
    }

    .menuontop body.checkoutID {
        background-color: #eee
    }

    .delivery-address-note {
        display: none !important
    }

    .box_delivery .googleMap {
        box-sizing: border-box
    }

    .coupons .inp {
        background-color: #f6f6f6;
        border-radius: 6px
    }

    .coupons input:focus {
        background-color: #f6f6f6
    }

    .checkoutID .reviewBox {
        /* padding-top: 25px; */
    }

    .market .checkoutID .reviewBox {
        /* padding-top: 3px; */
    }

    .retail .checkoutID .reviewBox {
        padding-top: 0px;
    }

    .menuontop .checkoutID .notloggedin .reviewBox .left.rBox {
        min-height: 321px;
        margin-left: 12px;
        margin-right: 0px;
        width: calc(40% - 6px);
    }

    .retail .column_cust.hide-product-options .line {
        width: calc(200%+32px)
    }

    .retail .column_cust .blcWrap {
        width: 100%
    }

    .market .customizedID.largetxt .picture {
        border-bottom: 0;
        /* display: flex; */
        align-content: center;
        align-items: center;
        height: 100%;
    }

    .market .modal {
        /* min-height: 600px;
        width: 950px !important;
        max-width: unset !important */
    }

.market .customizedID .backg img {
    max-height: calc(100vh - 100px);
}

    .market .categoryPid .sorter {
        bottom: 39px !Important;
        right: 0px !important;
    }

    .retail .customizedID .wrap form {
        width: calc(100% - 20px)
    }

    .homePid .home-collection.layout3.ng-scope .gITems .itemGrid {
        max-width: 200px;
        align-items: center
    }

    .homePid .offerslist {
        position: relative;
        margin-top: 12px
    }

    .menuontop .homePid .offerslist {
        margin-top: 15px
    }

    .homePid .offerslist::after {
        content: "";
        border-bottom: 1px solid #ddd;
        width: 100%;
        position: absolute;
        bottom: 12px;
        left: 0
    }

    .aoffer {
        max-width: 340px
    }

    #offerId .offer .picture {
        display: inline-block;
        width: 50% !important;
        margin-right: 40px !important;
        margin-bottom: 19px !important
    }

    #offerId .offer .right-side-container {
        display: inline-block;
        vertical-align: top;
        width: 40% !important
    }

    #offerId .offer .countdown-container .countdown {
        width: 200px
    }

    #offerId .offer .desc {
        margin-top: 0 !important
    }

    #offerId .offer {
        text-align: left !important
    }

    #offerId .offer .genBtn {
        margin-left: 0 !important
    }

    .offers-wrap .offer {
        width: calc(25% - 15px) !important
    }

    .offers-category-wrap .offer-category {
        width: calc(25% - 15px) !important
    }

    .offers-wrap {
        text-align: left !important
    }

    .offers-category-wrap {
        text-align: left !important
    }

    .market .subPage .case .titleAndLegend {
        /* margin-top: -8px !important; */
    }

    .market .subPage .case .titleAndLegend {
        /* margin-top: 14px !important; */
        margin-bottom: -16px;
    }

    .modalParent {
        width: 100%
    }

    .rtl.multibranch .filter .zmdi {
        left: 211px !important
    }

    .checkoutID .addAddress.withEdit {
        bottom: 6px !important
    }

    .subcats {
        display: none !important
    }

    .large-menu-img .itemsList .itemGrid .descBlock .title {
        margin-top: -3px;
        padding-bottom: 0 !important
    }

    .subPage:not(.checkoutID) .content {
        padding-right: 0px;
        /* min-height: unset; */
        /* padding-top: 32px; */
        width: calc(100% - 614px);
    }

    .market .subPage .content {
        min-height: calc(100vh - 212px);
        width: calc(100% - 620px);
    }

    .market .categoryPid .content {
        padding-top: 0px;
    }

    .rtl .subPage .content {
        padding-right: 0px;
        /* padding-left: 15px; */
        padding-bottom: 52px;
    }

    .menuontop .giftcards .content {
        max-width: 789px !Important;
        padding-left: 0 !important
    }

    .giftcards .content {
        padding-left: 22px
    }

    .menuontop .subPage .content {
        max-width: 1200px;
        margin: auto;
        /* display: block; */
        padding-left: 15px;
    }

    .giftcards .content::before {
        position: absolute;
        font-family: Material-Design-Iconic-Font;
        font-size: 540px;
        color: #fafafa;
        left: -370px
    }

    .menuontop .giftcards .content:before {
        content: "\f126";
        position: absolute;
        font-family: 'Material-Design-Iconic-Font';
        font-size: 540px;
        color: #fafafa;
        left: -370px
    }

    .menuontop .searchopen .content {
        transition: all .2s ease 0s
    }

    .menuontop .categoryPid .content {
        max-width: 1300px;
        margin-top: 17px;
        width: 100%;
    }

    .subPage.checkoutID .content {
        padding-right: 14px;
    }

    .fnb .subPage.checkoutID .content,
    .market .subPage.checkoutID .content {
        padding-bottom: 31px;
        background-color: #eeeeee!important;
    }

    .fnb .subPage.checkoutID .content.notloggedin,
    .market .subPage.checkoutID .content.notloggedin {
        /* margin-top: -19px; */
    }

    .offers-section .titleAndLegend .title {
        display: none !important
    }

    .retail .checkoutID .content {
        padding-right: 14px;
        border-radius: 7px;
        margin-top: 67px;
    }

    .retail .checkoutID #wrapper {
        background-color: #eee;
    }

    .retail.rtl.menuontop .checkoutID #wrapper .content {
        margin-left: 277px;
    }

    .not-logged-in.retail .checkoutID .content {
        margin-top: 64px;
    }

    .menuontop .checkoutID .content {
        background-color: #eee;
        padding-left: 22px;
        width: calc(100% - 353px);
        margin-left: 27px;
        margin-bottom: 62px
    }

    .menuontop .checkoutID .footer {
        width: calc(100% - 300px)
    }

    .rtl.menuontop .checkoutID .footer {
        right: 300px;
    }

    .rtl.hide-bag.menuontop .checkoutID .footer {
        width: 100vw;
        right: 0px;
    }

    .pages .content {
        padding-top: 0;
        padding-right: 0px;
        margin-left: -5px;
        padding-bottom: 42px;
    }

    .menuontop .pages .content {
        max-width: none;
        padding-left: 0px;
        width: 100%;
    }

    .errorCustomization.overbtn {
        bottom: 0;
        width: 100%;
        height: 32px;
        line-height: 32px;
    }

    .formPart .lines .line {
        min-height: 22px !important
    }

    .checkoutID .withEdit .newAddress.edit {
        margin-right: 40px;
    }

    .checkoutID .addAddress.withEdit {
        margin-left: 37px;
    }

    .no-items-found {
        text-align: left;
        padding: 0;
        margin-left: 0;
        margin-top: 0
    }

    .rtl .no-items-found {
        text-align: right;
        direction: rtl;
        margin-left: auto;
        margin-right: 8px
    }

    .myAccountPid .whiteBox .boxes {
        padding-top: 20px;
        display: flex;
        flex-flow: row wrap;
        column-count: 2;
        align-items: start
    }

    .rtl .myAccountPid .whiteBox .boxes * {
        direction: rtl;
        text-align: right !Important;
    }

    .rtl .myAccountPid .whiteBox .boxes .box .mid {
        /* padding-left: 23px; */
        /* padding-right: 23px; */
    }

    .whiteBox .boxes .box .mid {
        /* width: calc(100% - 52px); */
        margin-left: auto;
        margin-right: auto
    }


    .passedit {
        padding-bottom: 62px !Important;
    }

    .box_delivery .location {
        width: 100%;
        /* border-bottom: 1px solid #fff; */
        padding-bottom: 3px
    }

    .rtl .box_delivery .location {
        width: 100%;
        float: right;
    }

    .customDropDown .drop_select {
        width: 100%;
        padding-left: 21px
    }

    .customDropDown .drop_description {
        display: block;
        float: none;
        /* margin-top: 25px; */
        clear: both;
    }

    .box_delivery.force-hide-map .boxData .customDropDown .drop_description {
        margin-top: 2px;
    }

    .drop_options .drop_description {
        margin-top: 0
    }

    .rtl .drop_options .drop_description {
        padding-right: 0
    }

    .editAddAddress .iti .iti__flag-container {
        margin-left: 3px
    }

    .mobileMenuWrap {
        display: none
    }

    header {
        margin-top: 0
    }

    .pages .header {
        /* margin-top: -87px; */
        /* margin-bottom: 22px; */
    }

    .menuMob {
        display: none !important
    }

    .menuList.bag {
        border-radius: 5px
    }

    .formPart .input .label {
        line-height: 17px;
        font-size: 14px;
        margin-bottom: 0;
        width: 98px !important;
        height: auto !important
    }

    .tinyselect select {
        width: 53px !important
    }

    .tinyselect {
        width: 39px !important;
        margin-right: 5px !important
    }

    .tinyselect::after {
        content: "" !important
    }
}

@media only screen and (max-width:768px) {
    .go-back {
        cursor: pointer;
        top: -3px;
        left: 47px;
        height: 62px;
        width: 36px;
        transition: all .3s cubic-bezier(0.42, 0, 0.6, 1.17) 0s;
        opacity: 0;
        transform: scale(0)
    }

    .retail .go-back {
        top: -12px
    }

    .go-back.has-go-back {
        cursor: pointer;
        transition: all .3s cubic-bezier(0.42, 0, 0.6, 1.17) .2s;
        opacity: 1;
        transform: scale(1.3)
    }

    .go-back .zmdi {
        color: #fff;
        font-size: 25px;
        position: relative;
        display: block;
        text-align: center
    }

    .retail .go-back .zmdi {
        color: var(--primary-color)
    }

    .inproduct .go-back .zmdi {
        display: none;
    }

    .logo.has-go-back {
        margin-left: 93px !important
    }
}

.footer .menu ul.apps li {
    height: 50px
}

.footer .menu ul.apps li .btn {
    background: 0 center
}

li.google-play .btn .box {
    position: relative;
    display: block;
    height: 50px;
    /* width: 147px; */
    background-size: 100%
}

li.google-play .btn .box {
    background: url("../images/googleplay2.png") 0 center no-repeat;
    height: 108px;
    mask: none;
    --mask: none;
}

li.app-store .btn .box {
    position: relative;
    display: block;
    height: 50px;
    background: url("../images/appstore.png") 0 center / 100% no-repeat;
    margin-top: 15px;
    mask: none;
    --mask: none;
}

li.app-store .btn .box {
    background: url("../images/appstore2.png") 0 center no-repeat;
    height: 108px;
}

#pinPayPopUp .smallTittle {
    position: relative;
    font-family: Roboto, sans-serif;
    font-weight: 400;
    font-size: 13px;
    color: #666
}

#pinPayPopUp .genBtn.loading .table {
    display: none
}

@media(max-width:768px) {
    .homePid .titleAndLegend.isSearching {
        padding: 0;
        min-height: 5px
    }

    .home-collection.layout2 .itemsList {
        overflow-x: hidden
    }

    .home-collection.layout3 .gITems {
        overflow-x: hidden;
    }
}

@media(max-width:768px) {
    .homePid .titleAndLegend.isSearching {
        padding: 0
    }

    .mainTitle.createaccount {
        margin-top: -14px;
        margin-bottom: -6px;
        display: none
    }
}

@media(min-width:769px) {
    .wrapCustom {
        column-count: 2
    }

    .checkoutID .aoffer {
        max-width: unset
    }
}

@media(min-width:769px) {
    .wrapCustom {
        column-count: 1
    }

    .column_cust {
        break-inside: avoid;
        width: 100% !important
    }

    .retail .column_cust {
        margin-top: 8px;
    }
}

@media(min-width:769px) {
    .swiperID.fix .swiper-container ul {
        margin-top: 115px;
        padding-bottom: 21px
    }

    .swiperID.fix .swiper-slide .picture,
    .swiperID.fix2 .swiper-slide .picture {
        visibility: hidden;
        height: 0;
        margin: 0;
        width: 22px
    }

    .swiperID.fix .swiper-container ul li {
        width: auto;
        max-height: 32px;
        padding-right: 26px;
        margin-right: auto !important
    }

    .swiperID.fix .titleWrp {
        height: auto !important
    }

    .fixing .content {
        margin-top: 180px
    }
}

@media(min-width:769px) {
    .fixing .content {
        margin-top: 0
    }

    .menuontop #wrapper {
        padding-top: 71px;
        margin-top: 0;
        box-sizing: border-box
    }
}

.loginRegisterID .error {
    bottom: -23px;
    text-align: center;
    width: 100%;
    color: #cf6060 !important
}

div#pinPayPopUp .error {
    text-align: center;
    top: 138px;
    height: 22px;
    color: #999 !important
}

div#pinPayPopUp .genBtn {
    margin-top: 38px
}

.favorite:hover .text {
    color: var(--primary-color)
}

.accname {
    position: absolute;
    transform: translateX(-50%) translateY(-50%);
    left: 50%;
    color: rgba(255, 255, 255, 0);
    font-size: 17px;
    /* top: 19px; */
    font-weight: bold;
    display: none;
    text-align: center;
    cursor: pointer;
    transition: all .2s ease 0s;
    top: 50%;
}

.accname::before {
    /* content: ""; */
    position: absolute;
    top: -23px;
    left: 50%;
    width: 64px;
    height: 62px;
    background-size: cover;
    color: #672a19;
    visibility: visible;
    transform: translateX(-50%)
}

.oitems div {
    width: 50%;
    float: left;
    border: 1px solid #ddd;
    height: 34px;
    line-height: 28px;
    text-align: center
}

.orderStat {
    position: absolute;
    top: 18px;
    background-color: #fff;
    border-width: 1px 1px 1px;
    border-style: solid;
    /* border-color: #f1f0f0 #f1f0f0 #e0dfdf; */
    border-image: initial;
    padding: 6px 13px;
    border-radius: 23px;
    font-size: 12px;
    right: 15px;
    color: #666;
    text-transform: capitalize;
}

.orderStat.readyforpickup {
    background-color: #57a022;
    color: #fff;
    animation: .9s ease-in-out 0s infinite normal none running fadeOut;
}

.orderStat.processing {
    background-color: #e69138;
    color: #fff
}

.orderStat.ontheway,
.orderStat.delivered {
    background-color: #6aa84f;
    color: #fff
}

.orderStat.ontheway {
    background-color: #e4ba35;
}

.orderStat.processed {
    color: #fff;
    background-color: orange;
}

.orderStat.canceled {
    background-color: #d96c6c;
    color: #fff
}

.rtl .orderStat {
    left: 15px;
    right: auto
}

.orderdate {
    width: 190px;
    font-size: 14px;
    color: #666;
    font-weight: normal;
    padding-left: 19px;
    text-transform: uppercase;
    padding-top: 3px
}

.rtl .orderdate {
    text-align: right;
    margin-left: auto
}

.userpages {
    float: left;
}

.userbar.icons .userpages {
    display: block;
}

.menuontop .up .userpages.icons {
    display: block !important;
}

.rtl .userpages {
    margin-left: 23px;
}

.userpages li {
    list-style: none;
    float: left;
    margin-right: 23px;
    cursor: pointer;
    color: #111;
    height: 40px;
    line-height: 31px;
    position: relative
}

.rtl li.md-orders {
    margin-right: 0px;
}

.menuontop .userpages li {
    margin-right: 0
}

.menuontop .userpages {
    display: none;
}

.fnb .checkoutID .userpages li,
.market .checkoutID .userpages li {
    display: none
}

.fnb .checkoutID .userbar,
.market .checkoutID .userbar {
    border-bottom: 0;
    display: none;
}

.userpages li:hover {
    opacity: .7
}

.userpages .md-reorder {
    color: var(--primary-color);
    display: none
}

.offers .md-offers a, .offers .md-offers:before {
    color: var(--primary-color);
    font-weight: bold;
}

.userpages .md-fav::before {
    font-size: 22px;
    content: "\f004";
    margin-right: 13px;
    position: absolute;
    top: 0px;
    opacity: 0.6;
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
}

.fnb .userpages .md-fav::before {
    font-family: 'Material-Design-Iconic-Font';
    content: "\F27C";
    font-size: 27px!important;
    font-weight: bold;
}

.userpages li:before {
    font-size: 21px !important;
}

.retail .userpages .md-fav::before {
    content: "\F15F";
    line-height: 26px;
    opacity: 1;
    font-family: 'Material-Design-Iconic-Font';
    font-size: 24px;
    margin-top: 3px;
}

.retail .userpages .md-wl::before {
    font: 28px / 1 Material-Design-Iconic-Font;
    content: "\f3ac";
    margin-right: 9px;
    position: absolute;
    top: 2px;
    color: var(--primary-color);
}

.menuontop .userpages .md-src:before,
.onmenu.md-src:after {
    font: 24px / 26px Material-Design-Iconic-Font;
    content: "\F1C3" !important;
    margin-right: 9px;
    position: absolute;
    top: 4px;
}

.onmenu.md-src:after {
    top: 17px;
    zoom: 0.9;
    left: 17px;
}

.userpages .md-orders::before {
    font-size: 22px;
    content: "\F543";
    margin-right: 12px;
    position: absolute;
    top: 0px;
    opacity: 0.6;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    left: 4px;
}

.market .userpages .md-orders::before {}

.userpages .md-offers::before {
    font: 25px / 1 Material-Design-Iconic-Font;
    content: "\f1df";
    margin-right: 10px;
    position: absolute;
    top: 2px;
    opacity: 0.6;
    font-size: 26px !important;
}

.userpages .md-giftcards::before {
    font: 24px / 1 Material-Design-Iconic-Font;
    content: "\F126";
    margin-right: 10px;
    position: absolute;
    top: 2px;
    opacity: 0.7;
    font-size: 26px !important;
}

.userpages .md-reorder::before {
    font: 18px / 1 Material-Design-Iconic-Font;
    content: "\F3B2";
    margin-right: 10px
}

.userpages a {
    color: #666;
    text-decoration: none;
    font-size: 16px;
    padding-left: 30px;
    text-transform: capitalize;
    opacity: 1;
}

.sumhead {
    position: relative;
    height: 38px;
    text-align: left;
    line-height: 22px;
    margin-bottom: 19px;
    font-weight: bold;
}

.notloggedin .sumhead {
    margin-bottom: 19px !important;
    /* padding-left: 19px; */
}

.rtl .sumhead {
    direction: rtl
}

.sumhead div {
    display: inline-block;
    margin-right: 5px;
    font-size: 14px;
    white-space: nowrap;
    color: #444;
    font-weight: normal;
}

.sumhead div:not(.wrp) {
    margin: 5px;
}

.sumhead div:not(.wrp):before {
    content: attr(data-txt);
    float: left;
}

.sumhead div div:last-child {
    margin-right: 0
}

.sumhead .totitems {
    font-size: 14px
}

.sumhead .price {
    float: right;
    top: 0;
    position: absolute;
    right: 2px;
    font-size: 14px
}

.myBagModule .itemBags .price {
    /* margin-top: 7px; */
    font-size: 13px;
    color: #999;
    text-align: left;
}

.price.ng-binding.ng-scope.selected {
    margin-top: 7px;
}

.retail .myBagModule .itemBags .customPart .price {
    float: left;
    margin-left: 18px
}

.retail .myBagModule .itemBags .customPart .price {
    display: none;
}

.myBagModule .itemBags .for-free .price {
    /* display: none; */
}

.rtl .myBagModule .itemBags .price {
    text-align: right;
    margin-top: 2px;
    direction: rtl
}

.menuList.signin {
    cursor: pointer
}

.checkoutID .menuList.signin {
    display: none;
}

.retail .menuList.signin {
    margin-top: 1px;
    color: #000;
    margin-right: 11px;
    float: left;
}

.retail.menuontop .menuList.signin {
    /* margin-right: -25px; */
}

.retail.menuontop .menuList.signin {
    /* display: none; */
}

.retail.menuontop .icons .menuList.signin {
    /* display: block; */
    float: left;
}

.rtl.retail .menuList.signin {
    margin-right: 10px;
}

.applinks {
    margin-top: 14px;
    display: inline-block;
    margin-bottom: 22px;
}

.cordova .applinks {
    display: none;
}

.rtl .applinks {
    text-align: right;
}

.rtl .applinks li {
    text-align: right;
    display: inline-block;
}

.applinks li {
    border: 0;
    list-style-type: none
}

.applinks li {
    width: 94px;
    display: inline-block
}

.applinks li::before {
    background-color: #fff
}

.minitotal .mtbtn {
    background-color: var(--primary-color);
    height: 32px;
    line-height: 32px;
    padding-left: 7px;
    width: 68px;
    border-radius: 0 5px 5px 0;
    float: left;
    text-transform: uppercase;
    padding-right: 7px;
    color: #fff;
    text-align: center;
    cursor: pointer;
    font-size: 12px
}

.minitotal .mtprice {
    background-color: #fff;
    height: 32px;
    line-height: 32px;
    padding-left: 9px;
    width: 82px;
    border-radius: 5px 0 0 5px;
    float: left;
    padding-right: 7px
}

.minitotal {
    width: 180px;
    font-size: 12px;
    position: absolute;
    right: 9px;
    top: -9px;
    box-shadow: rgba(204, 204, 204, 0.64) 0 0 9px;
    display: none;
}

.bagph {
    right: 0;
    position: fixed;
    background-color: #eee;
    width: 300px;
    border-left: 1px solid #ebeaea;
    z-index: 2
}

.bagph {
    top: 86px;
    height: calc(100vh - 86px);
    transition: all .3s ease 0s
}

.retail .bagph {
    top: 71px;
    height: calc(100vh - 71px);
    transition: all .3s ease 0s
}

.checkoutID .bagph {
    background-color: #f9f9f9
}

.checkoutID.reviewbag .bagph {
    opacity: 1
}

.rtl .bagph {
    left: 0;
    right: auto;
    border-right: 1px solid #ddd;
    border-left: 0
}

.checkoutID .bagph::after {
    display: none
}

.bagph::after {
    font: 122px / 1 Material-Design-Iconic-Font;
    content: "\F195";
    margin-right: -7px;
    transform: translateX(-50%) translateY(-50%);
    position: absolute;
    left: 50%;
    top: 50%;
    color: #ccc
}

.bagph::after {
    content: "\F1C9"
}

.mCustomScrollBox {
    height: 100%
}

.deskmenu {
    position: relative;
    width: 300px;
    box-sizing: border-box;
    padding-left: 36px;
    z-index: 1;
    /* top: -66px; */
    display: inline-block;
    padding-right: 29px;
    height: calc(100vh - 216px);
    opacity: 0;
    animation: 0.2s ease-in-out 0.2s 1 normal forwards running fadeIn;
    vertical-align: top;
}

.rtl .deskmenu {
    padding-left: 34px;
    padding-right: 23px;
    float: right;
    text-align: right
}

.deskmenu .menu li {
    list-style-type: none;
    border-top: 1px dotted #e2e2e2;
    position: relative
}

.homePid .deskmenu .menu li.colle.hide-coll-on-homepage {
    display: none
}

.deskmenu .menu li.colle a {
    color: var(--secondary-color)
}

.deskmenu .link.collections {
    margin-top: 32px
}

.deskmenu .menu li ul li::before {
    position: relative;
    display: none
}

.deskmenu .menu li ul li a {
    font-family: textfont;
    font-weight: normal;
    font-size: 15px;
    line-height: 27px;
    color: #666
}

.deskmenu .menu li ul li a::before {
    content: "\F2FB";
    font: 16px / 5px Material-Design-Iconic-Font;
    margin-right: 6px;
}

.retail .deskmenu .menu li ul li span {
    font-weight: normal!important;
}

.rtl .deskmenu .menu li ul li a::before {
    margin-right: 0;
    margin-left: 6px;
    float: right;
    margin-top: 13px;
    transform: rotateY(180deg)
}

.deskmenu .menu li ul li {
    border-top: 0;
    /* padding-left: 9px; */
    padding-bottom: 0px;
    margin-bottom: 3px;
}

.deskmenu .menu li ul li.selected {
    color: var(--primary-color)
}

.deskmenu .menu li ul li.selected>a {
    color: var(--secondary-color);
    font-weight: bold
}

.deskmenu .menu li ul li:first-child {
    margin-top: -9px;
    padding-top: 10px;
    padding-bottom: 0;
}

.fnb .deskmenu .menu li ul li:first-child {
    margin-top: 4px;
}

.deskmenu .menu li ul li:last-child {
    margin-bottom: 22px;
    border-bottom: 0
}

.deskmenu .menu li ul li ul li:last-child {
    margin-bottom: 5px;
}

.rtl .deskmenu .menu li {
    text-align: right;
    padding-right: 14px;
}

.deskmenu .menu li::before {
    content: "";
    width: 12px;
    height: 1px;
    position: absolute;
    top: -1px
}

.retail .deskmenu .menu li::before {
    display: none
}

.rtl .deskmenu .menu li::before {
    right: 0
}

.deskmenu li a {
    text-decoration: none;
    font-size: 15px;
    color: #555;
    line-height: 39px;
    text-transform: capitalize;
    cursor: pointer;
    transition: all .2s linear 0s;
    mask: none !important;
    --mask: none !important;
}

.deskmenu li.selected a {
    color: var(--primary-color);
    font-weight: normal;
    font-size: 17px;
    /* line-height: 40px; */
    font-weight: bold;
}

.deskmenu li a:hover {
    color: #111;
    transition: all .3s linear 0s
}

.rtl .selection .timePick .clock {
    right: auto;
    left: 7px
}

.rtl .customized .textCustom {
    font-family: inherit;
    font-size: 10px;
    line-height: 11px
}

.rtl .box_instruction.notesCss .textarea.noteOnly {
    text-align: right;
    font-family: inherit
}

.orderdetails .box_instruction.notesCss .textarea.noteOnly {
    padding-top: 4px;
    padding-left: 0;
    margin-top: 0px;
}

.rtl .orderdetails .textLbl {
    text-align: right
}

.lineLink{
    order:99;
}

.orderdetails .pageMainTitle {
    display: none
}

.box_feedback {
    margin-top: 34px;
    margin-bottom: 40px;
    /* animation: .3s cubic-bezier(0.42, 0, 0.14, 0.93) 1s 1 normal both running fadeInUp2; */
}

.rtl .box_feedback .feedTitle {
    text-align: right;
    font-family: inherit
}

.rtl .whiteBox .boxes .box .top .desc,
.rtl .whiteBox .boxes .box .top .title {
    font-family: inherit;
    text-align: right;
    direction: rtl;
}

.rtl .whiteBox .boxes .box .customized .textCustom {
    font-family: inherit;
    font-size: 9px;
    line-height: 12px;
    text-align: center !Important;
}

.myAccountPid .whiteBox .boxes .box {
    width: calc(50% - 43px);
    min-width: 280px;
    padding-bottom: 8px;
    box-shadow: rgba(204, 204, 204, 0.24) 0 0 4px;
    mask: none !important;
}

.myAccountPid .whiteBox .boxes .box {
    --mask: none;
}



.rtl .editAddAddress .line {
    visibility: hidden
}

.rtl .reviewBox .rBox.left {
    float: right;
}

.mandatory {
    display: none
}

.MenuParts .callUsNb {
    position: relative;
    float: right;
    width: auto
}

.rtl .MenuParts .bag {
    font-family: inherit
}

.txt_deliver {
    font-weight: 300;
    font-size: 43px;
    color: #fff;
    line-height: 42px;
    text-align: center
}

.rtl .txt_deliver {
    font-family: inherit
}

.rtl .link {
    font-family: inherit
}

.rtl .text {
    font-family: inherit
}

.rtl .genBtn {
    font-family: inherit;
    font-weight: bold;
    letter-spacing: normal
}

.whiteBox .boxes .box .genBtn {
    width: 30%;
    height: 38px;
    margin-bottom: 26px;
}

.myAccountPid .whiteBox .boxes .box .genBtn {
    background-color: transparent;
    color: var(--primary-color);
    border-radius: 0;
    position: absolute;
    font-size: 11px;
    display: block;
    font-weight: bold;
    left: 20px;
    top: 2px;
    text-align: left !important
}

.myAccountPid .editaccountp .whiteBox .boxes .box .genBtn {
    display: flex;
    bottom: -24px;
    transform: translateX(-50%);
    left: 50%;
    white-space: nowrap;
}

.passedit .genBtn {
    bottom: 0 !important;
    top: auto !important
}

.myAccountPid .editaccountp .whiteBox .boxes .box .verifcode .genBtn {
    border: 0;
    right: 22px;
    display: block;
    transform: none;
    width: 100px;
    font-size: 14px;
    top: -9px;
    left: auto !important;
    bottom: -33px !important;
    text-align: right !important;
}

.rtl .itemsList .itemGrid .descBlock .description {
    font-family: inherit;
    text-align: right;
    direction: rtl
}

.rtl .itemsList .itemGrid .descBlock .description pre {
    font-family: inherit;
    white-space: normal
}

.rtl .itemsList .itemGrid .descBlock .title {
    font-family: inherit;
    text-align: right;
    width: 100%
}

a.mapdir {
    color: var(--secondary-color);
    position: relative;
    font-size: 25px;
    height: 31px;
    float: left;
    margin-top: -1px;
    /* margin-left: 10px; */
}

.rtl a.mapdir {
    margin-top: -4px;
    margin-left: 4px;
}

.select-locale {
    color: var(--primary-color);
    position: absolute;
    right: 47px;
    top: 5px;
    display: none
}

.select-locale select {
    background-color: transparent;
    border: 0;
    text-transform: inherit;
    color: var(--primary-color);
    font-size: 15px;
    height: 35px
}

.select-locale::before {
    content: "\F2F2";
    font: 14px / 1 Material-Design-Iconic-Font;
    color: #7d7d7d;
    margin-right: 7px;
    margin-left: 0
}

.select-locale::after {
    content: "\F2F2";
    font: 14px / 1 Material-Design-Iconic-Font;
    color: #7d7d7d;
    margin-right: 8px;
    margin-left: 14px;
    float: right;
    margin-top: 12px;
    pointer-events: none
}

i.localeglobe {
    font-size: 23px;
    position: absolute;
    right: 18px;
    color: #7d7d7d;
    top: 43px
}

.customDropDown .drop_arrow {
    width: 27px;
    box-sizing: border-box
}

.customDropDown .drop_arrow .fa-pen {
    font-size: 15px;
}

.rtl .customDropDown .drop_arrow {
    left: 18px;
    right: auto
}

.customDropDown .drop_arrow .zmdi {
    color: #d7d4d4;
    margin-top: 0px;
    margin-right: 20px
}

.rtl .customDropDown .drop_arrow .zmdi {
    margin-top: 11px
}

.customDropDown .drop_arrow .zmdi::after {
    font-size: 11px;
    font-family: sans-serif;
    position: absolute;
    left: -5px;
    bottom: 17px;
    color: #999
}

.recommendedItems .grad,
.recommendedItems .heart {
    display: none
}

body.showModal {
    overflow: hidden !important
}





#sticky-wrapper {
    opacity: 0
}

.showBag #sticky-wrapper {
    opacity: 1
}

.orderdetails .reviewBox .myBagModule {
    top: 0;
    visibility: visible
}

.hide-v {
    opacity: 0
}

.ngviewstyle.ng-leave {
    z-index: 9999
}

.ngviewstyle.ng-enter {
    z-index: 8888
}

.content .ng-enter {
    opacity: 0;
    transition: opacity .15s ease-in-out 0s
}

.content .ng-enter-active {
    opacity: 1
}

.coupons {
    opacity: 1 !important;
    pointer-events: all !important
}

.coupons label.missing {
    top: -22px;
    left: -2px;
    right: auto
}

.low-opacity {
    opacity: .7
}

#customizedModalID .favoriteBox.addToFavorites {
    min-width: 150px;
    display: none
}

#customizedModalID .favoriteBox .textAdd {
    min-width: 150px;
    display: none
}

.recommendedItems {
    /* position: fixed; */
    /* bottom: -10000px; */
    /* left: -10000px; */
    /* height: 100%; */
    /* width: 100%; */
    background-color: transparent;
    /* transition: background-color .3s linear 0s; */
    /* z-index: 50; */
    display: block;
    height: auto;
    overflow: hidden;
    padding-top: 22px;
    margin-top: -2px;
    padding-left: 7px;
    padding-bottom: 5px;
}

.recommendedItems .product-labels-container {
    top: 18px !important;
}

.notloggedin .recommendedItems {
    display: none;
}

.recommendedItems .product-labels {
    transform-origin: top left;
    transform: scale(0.8);
    margin-top: -8px;
}

.recommendedItems .brand {
    margin-top: 4px !important;
    font-size: 12px !important;
    font-weight: normal !important;
}

.recommendedItems .itemsList {
    position: relative;
    overflow: auto !important;
    padding-bottom: 0px;
    margin-bottom: 3px;
}

.rtl .recommendedItems .itemsList {
    direction: rtl;
    padding-left: 0px;
}

.recommendedItems .d-w {
    display: inline-block;
    margin-top: 6px;
    width: 100%;
}

.recommendedItems .priceWrap {
    height: auto !important;
    position: relative !important;
}

.recommendedItems .listing-nutrition-facts-wrapper {
    display: none;
}

.recommendedItems .ingredients-container {
    display: none !important;
}

.recommendedItems .descBlock {
    padding-bottom: 0px !important;
    padding-top: 0px !important;
}

.recommendedItems .itemGrid .picture {
    width: 100% !important;
    margin-top: 0px !important;
    border-radius: 9px !important;
    top: 0px !important;
    margin-left: 0px !important;
}

.recommendedItems .itemsList .genBtn {
    display: none !important;
}

.recommendedItems .descBlock .description {
    display: none;
}

.recommendedItems .itemsList .itemGrid .wrap {
    width: 100% !important;
    padding: 0px !important;
    /* margin-top: -2px; */
}

.recommendedItems .itemsList .itemGrid .priceWrap .wrap {
    margin-top: 0px;
}

.recommendedItems.show {
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.8);
    overflow: visible
}

.recommendedItems .modal-container {
    /* position: relative; */
    width: 100%;
    /* height: 444px; */
    margin-left: auto;
    margin-right: auto;
    /* margin-bottom: -500px; */
    transition: all .5s linear 0s;
    overflow: visible;
    /* transform: translate3d(0px, 150%, 0px); */
    /* opacity: 0; */
}

.recommendedItems.show .modal-container.show {
    margin-bottom: 0;
    opacity: 1;
    transition: all .5s cubic-bezier(0.42, 0, 0, 1.21) 0s;
    transform: translate3d(0px, -50%, 0px);
    top: 50%;
    width: 94%
}

.recommendedItems .modal-container .thebig-ul {
    /* text-align: center; */
    white-space: nowrap;
    background-color: transparent !important;
    padding-bottom: 0px !important;
    padding-left: 11px;
    /* width: fit-content !important; */
    min-width: 100%;
    max-width: none !important;
    margin: initial;
}

.rtl .recommendedItems .modal-container .thebig-ul {
    padding-right: 9px;
    padding-left: 0px;
}
.retail .recommendedItems ul.case.products-listing{
    width:auto;
}
.recommendedItems .modal-container .btnClose {
    position: absolute;
    min-width: 106px;
    height: 35px;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, 0.6);
    color: #fff;
    white-space: nowrap;
    line-height: 33px;
    background-color: rgba(0, 0, 0, 0.43);
    z-index: 99;
    right: auto;
    box-sizing: border-box;
    display: inline-block;
    transform: translateX(-50%);
    background-image: none;
    bottom: -23px !important;
    left: 50% !important;
    margin-left: 3px !important;
    top: auto !important
}

@media(min-width:769px) {
    .rtl .whiteBox .boxes .box {
        float: right;
    }

    .productpage body.inproduct.showModal {
        overflow: auto !important;
    }

    .productpage body.inproduct .backgroundModal {
        display: none;
    }

    .productpage body.inproduct .layerPop {
        height: auto !important;
    }

    .recommendedItems .modal-container .btnClose:hover .zmdi-close,
    .recommendedItems .modal-container .btnClose:hover .zmdi-close-circle {
        color: #909090 !important
    }
}

.recommendedItems .modal-container>.title {
    position: relative;
    font-family: titlefont;
    font-size: 28px;
    color: #555;
    text-align: left;
    margin-top: 25px;
    margin-bottom: 17px;
    padding-left: 13px;
}

.rtl .recommendedItems .modal-container .title {}

.recommendedItems .modal-container .descBlock .title {}

.recommendedItems .modal-container .itemsList .itemGrid {
    text-align: left;
    white-space: normal;
    width: 172px !important;
    background-color: transparent;
    padding-bottom: 0px;
    min-width: auto;
    margin-right: 7px;
    padding-bottom: 0px !important;
}

.recommendedItems .swiper-pagination {
    left: auto;
    z-index: 2147483647;
    padding: 0;
    margin-top: 24px;
    position: relative !important;
    display: none;
}

.recommendedItems .swiper-pagination-bullet {
    opacity: 1;
    background: #a1a19e;
    margin: 0 3px !important
}

.recommendedItems .swiper-pagination-bullet:last-child {
    display: none
}

.recommendedItems .swiper-pagination-bullet-active {
    opacity: 1;
    background: #fff
}

@media(min-width:769px) {
    .recommendedItems .swiper-pagination {
        display: none
    }
}

@media(max-width:959px) {
    .recommendedItems .modal-container .itemsList .itemGrid {
        /* margin-right: 9px !important; */
        margin-left: 0px !important;
        margin-bottom: 0px !important;
    }
}

@media(max-width:768px) {
    .editMode .box_delivery .location .edit {
        max-width: 100%
    }

    .rtl .left.part {
        padding-right: 0 !important;
        padding-left: 0 !important;
        width: 100% !important
    }

    .editAddAddress .part {
        width: 100% !important
    }

    .editAddAddress .part.left {
        padding-right: 0 !important
    }

    .rtl .editAddAddress .line {
        background-color: #fff
    }

    .swiper-container.main-swiper {
        overflow-x: hidden !important;
        width: 100%;
        position: relative
    }

    .categoriesSlider.swiper-container {
        overflow-x: hidden !important;
        width: 100%;
        position: relative;
        height: calc(100vh - 140px) !Important;
        /* scroll-snap-type: x mandatory; */
    }

    .categoriesSlider .swiper-wrapper {
        overflow-x: scroll;
        scroll-snap-type: x mandatory;
        scroll-behavior: smooth;
    }

    .categoriesSlider.swiper-container .swiper-wrapper .swiper-slide {
        overflow-y: auto !important;
        scroll-snap-stop: always;
    }

    .swiper-container.pages-swiper {
        overflow-x: hidden;
        width: 100%;
        position: relative
    }

    img.headbackimg {
        width: 100vw !important
    }

    body {
        visibility: visible;
        display: block
    }

    ul#getAddress-autocomplete-list {
        max-height: 500px !important;
    }

    .market .itemsList .genBtn.customize {
        margin-top: -213px !important
    }

    .pheadline {
        padding-left: 13px;
        font-size: 31px !important;
        line-height: 33px !important;
        width: calc(100% - 46px) !important;
    }

    .pheadline .section-header {
        margin-bottom: 0px !Important;
    }

    .editaccountp .whiteBox .boxes .box .top .text {
        text-align: center;
        display: none
    }

    .editaccountp .whiteBox .boxes .box.loyalty-change-mobile .top .text {
        display: block
    }

    .myBagModule .itemBags {
        padding: 0;
        margin-left: -3px;
        width: 100% !important
    }

    .orderdetails .myBagModule .itemBags {
        margin-left: 0px !important;
    }

    .checkoutID .notloggedin .box_delivery .genBtn {
        bottom: auto;
        width: calc(100% - 22px);
        left: auto;
        color: #fff !important;
        border-radius: 6px !important;
        display: block !important
    }

    .checkoutID .notloggedin .box_delivery .genBtn {
        max-width: 100% !important;
        margin-top: 32px !important;
        width: 100% !important;
        margin-bottom: 62px !important;
    }

    .checkoutID .notloggedin .box_delivery .genBtn::before {
        display: none !important
    }

    .reachLocations li {
        width: calc(100vw - 16px) !important;
        margin-right: 8px !important;
        overflow: hidden;
        margin-left: 8px !Important;
    }

    .reachLocations li:first-child {
        margin-top: -4px;
    }

    .bigPrice.overbtn {
        position: fixed;
        z-index: 9999;
        bottom: 21px;
        right: 21px;
        font-size: 13px;
        color: #fff;
        opacity: 0;
        transition: all .5s linear 0s;
        transform: translateY(100px);
        font-weight: bold;
        display: block !important
    }

    .rtl .bigPrice.overbtn {
        direction: rtl
    }

    .bigPrice.overbtn.show {
        transform: translateY(0px);
        pointer-events: none;
        opacity: .7 !important;
        transition: all 0s linear .9s !important
    }

    header.header {
        height: auto
    }

    .userpages {
        margin: auto;
        float: none;
        display: block
    }

    .header .image .gradient {
        width: 100%;
        bottom: 0;
        top: auto
    }

    .wrapAll {
        bottom: 29px;
        width: 100%
    }

    .customizedID .onRight {
        position: relative;
        bottom: auto
    }

    .noCustomization .onRight {
        background-color: #fff;
        display: none
    }

    .addtobagbtn {
        position: fixed;
        border-radius: 0;
        bottom: 0;
        width: 100%;
        z-index: 999;
        height: 58px;
        transform: translateY(250%);
        transition: transform .2s linear 0s;
        display: flex !important
    }

    .addtobagbtn.show {
        transform: translateY(0px);
        transition: transform .4s linear .3s;
    }

    body.showModal.inproduct .addtobagbtn[translate="choose ordering method"] {}

    .rtl .closeOrderdetails {
        left: 0
    }

    .rtl .orders .order .orderPreference {
        text-align: left;
        float: right;
        margin-right: -20px
    }

    .rtl .wrapCustom .column_cust {
        margin-right: 0
    }

    .rtl .wrapCustom .column_cust.customnote .bTitle {
        line-height: 10px !important
    }

    .rtl .customizedID .column_cust .block .bigPrice {
        text-align: center !important
    }

    .loginRegisterID .parts .left {
        padding-right: 0 !important
    }

    .rtl .partReceipt .note {
        text-align: center;
        margin-top: -12px
    }

    .rtl .partReceipt .txtReceipt {
        text-align: center
    }

    .rtl .mini-disclaimer {
        font-family: inherit;
        text-align: right;
        width: 100%
    }

    .showModal .backgroundModal.whitebottom::after {
        content: "";
        position: absolute;
        width: 100%;
        height: 200px;
        opacity: 1;
        bottom: 0;
        transition: all .3s linear 0s
    }

    .rtl div#recommended {
        text-align: right;
        padding-right: 11px;
        top: -14px;
        font-family: titlefont
    }

    .recommendedItems .modal-container .title {
        /* margin-top: 0px; */
        /* margin-bottom: 14px; */
        /* font-size: 15px; */
        /* width: 100%; */
    }
}

.recommendedItems .modal-container .itemsList .title {
    width: 100%;
    margin-right: 0px;
    font-family: 'textfont' !important;
    font-weight: bold !important;
    font-size: 12px;
    max-width: none !Important;
}

.recommendedItems .itemsList .genBtn.customize {
    display: none
}

.recommendedItems .modal-container .itemsList .addRemoveWrap.full {
    height: 45px;
    margin-bottom: 0;
    margin-top: 17px;
    display: none
}

.recommendedItems .modal-container .itemsList .genBtn.skipBtn {
    background-color: var(--secondary-color);
    color: #fff;
    position: absolute;
    font-size: 15px;
    font-weight: bold;
    border-bottom: 1px dotted #666;
    bottom: 7px;
    border-radius: 7px;
    height: 35px;
    box-sizing: border-box;
    min-width: 100px !important;
    right: -1px !important
}

.recommendedItems .modal-container .itemsList .genBtn.skipBtn:hover {
    background-color: #fff;
    border-color: #999;
    color: #999
}

.openning-date {
    margin-top: 0;
    margin-bottom: -37px;
    background: transparent;
    box-shadow: none
}

.openning-date .delivery-span {
    font-size: 26px;
    color: var(--secondary-color);
    position: absolute;
    background-color: #fff;
    height: 98px;
    min-width: 154px;
    margin-top: 2px;
    padding-top: 35px;
    box-sizing: border-box;
    font-weight: 300;
    text-align: left;
    padding-left: 15px;
    border: 1px solid #ccc;
    border-radius: 7px;
    top: 25px;
    left: 22px;
    padding-right: 21px
}

.no-asap-order .openning-date .delivery-span {
    display: none!important;
}

.openning-date .delivery-span::before {
    content: attr(data-text);
    position: absolute;
    font-size: 11px;
    top: 21px;
    width: 100%;
    text-align: left;
    left: 17px;
    color: #999;
    box-sizing: border-box;
    text-transform: uppercase
}

.rtl .openning-date .delivery-span::before {
    top: 12px;
    direction: rtl;
    text-align: right;
    width: calc(100% - 25px)
}

.rtl .openning-date .delivery-span {
    direction: unset;
    left: auto;
    right: 22px;
    text-align: right;
    padding-left: 21px;
    padding-right: 15px;
}

.openning-date .delivery-date {
    position: relative;
    font-size: 12px;
    color: #999;
    font-family: Roboto, sans-serif;
    text-align: center;
    margin-top: 0;
    margin-bottom: 7px;
    text-transform: uppercase
}

.openning-date .delivery-date {
    margin-top: 0
}

.termsID .textTerms p,
.termsID .textTerms li {
    position: relative;
    min-height: 1px;
    line-height: 19px
}

.termsID .textTerms ul {
    margin-left: 17px
}

#disclaimerModalID .textTerms {
    border: 1px solid #eee;
    margin-top: 18px;
    padding: 7px 15px 15px;
    margin-bottom: 10px;
    height: 400px;
    overflow-y: scroll
}

#disclaimerModalID .textTerms.mCustomScrollbar {
    padding-right: 0
}

#disclaimerModalID .mCSB_scrollTools .mCSB_draggerRail {
    background: #fff
}

#disclaimerModalID .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #878787
}

#disclaimerModalID .notice {
    position: relative;
    display: block;
    font-size: 12px;
    font-family: Roboto, sans-serif;
    color: #666;
    margin-bottom: 15px
}

.loading::after {
    content: "";
    position: absolute;
    width: 24px;
    height: 24px;
    border-width: 3px;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.31) rgba(224, 224, 224, 0.69) rgba(0, 0, 0, 0.31) rgba(0, 0, 0, 0.31);
    border-image: initial;
    border-radius: 100%;
    animation-name: rotate;
    animation-duration: .4s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    transition: all .2s linear 0s;
    margin-left: -15px;
    left: 50%;
    top: 50%;
    margin-top: -15px;
    display: none
}

.homePid .loading:after {
    display: none;
}

@keyframes rotate {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

.genBtn.greyBtn {
    background-color: #bbb
}

.genBtn.greyBtn.ccl {
    background: #f6f6f6;
    position: relative;
    height: 100% !important;
    margin-top: 0px;
    color: #999;
    text-transform: none;
    padding-top: 51px;
    padding-bottom: 5px;
    /* width: 129px; */
    min-height: unset;
    right: auto;
    top: auto;
}

.genBtn.greyBtn.ccl:hover {
    border: 0px;
    filter: none;
}

.genBtn.greyBtn.ccl:before {
    content: '\f118';
    font: normal normal normal 14px/1 'Material-Design-Iconic-Font';
    color: #ddd;
    position: absolute;
    font-size: 46px;
    top: -1px;
}

.genBtn.greyBtn.ccl:before {}

.genBtn.greyBtn:hover {
    /* background-color: #fff; */
    /* border-color: #bbb; */
    /* color: #bbb; */
}

.genBtn.greyBtn .timing {
    font-size: 13px;
    color: #d8d8d8;
    font-family: Roboto, sans-serif;
    position: absolute;
    right: 16px
}

.moreBtn.greyBtn {
    background-color: #bbb;
    color: #fff;
    border-color: #aaa;
    position: relative;
    margin-top: 0 !important;
    margin-bottom: 51px !important
}

.moreBtn.greyBtn:hover {
    background-color: #fff;
    border-color: #bbb;
    color: #bbb
}

.moreBtn.greyBtn .timing {
    font-size: 17px;
    color: #ccc;
    /* font-family: Roboto, sans-serif; */
    position: absolute;
    right: 2px;
}

.for-free .addRemove .nb {
    float: none;
    width: 100%;
    text-align: center
}

.for-free .customized {
    left: auto;
    right: 6px;
    top: 4px;
    border-radius: 4px;
    overflow: hidden;
}

.customized .textCustom {
    display: none
}

.for-free .customized .textCustom,
.customized.offer .textCustom {
    /* text-align: center; */
    /* position: absolute; */
    /* bottom: -23px; */
    background-color: #ee7f0d;
    color: #fff;
    display: block !important;
    padding-left: 6px;
    padding-right: 6px;
}

#promotionId {
    width: auto;
    max-width: 90%
}

#promotionId.show {
    transform: translate3d(-50%, -50%, 1px);
    top: 50% !important;
    margin-top: -60px;
}

@media(max-height: 780px) and (min-width:768px) {
    #promotionId.show {
        margin-top: 0;
    }
}

#promotionId .btnClose {
    left: 50% !important;
    top: 12px !important
}

#promotionId .btnClose .zmdi::after {
    content: "";
    position: absolute;
    background-color: rgba(0, 0, 0, 0.26);
    width: 40px;
    height: 40px;
    border-radius: 100%;
    z-index: 1;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    left: 50%;
    visibility: visible !important
}

#promotionId .btnClose .zmdi::before {
    position: absolute;
    z-index: 2;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    left: 50%
}

#promotionId .picture-ctn,
#promotionId .picture-ctn img {
    position: relative;
    display: block;
    max-width: 100%;
    height: auto;
    min-height: 180px;
    background-color: #333;
    width: auto;
    min-width: 337px;
    max-height: calc(100vh - 282px);
    margin: auto;
    /* max-width: 800px; */
}

#promotionId .wrap {
    position: relative;
    display: block
}

#promotionId .cont {
    padding: 0 !important
}

#promotionId .message-ctn {
    position: relative;
    display: block;
    padding: 30px 22px 35px;
    font-family: inherit;
    font-size: 16px;
    text-align: center;
    background-color: #fff
}

#promotionId .message-ctn:empty {
    display: none
}

#promotionId .btn-ctn {
    position: relative;
    display: block;
    font-weight: bold
}

#promotionId .btn-ctn .genBtn {
    position: relative;
    display: block;
    width: 100%;
    height: 45px;
    margin-left: auto;
    border-radius: 0;
    margin-bottom: 0;
    background-color: var(--secondary-color);
    font-weight: bold;
    font-size: 16px;
    text-align: center;
    line-height: 44px !important
}

#createAccountModalID .error {
    bottom: -3px;
    width: 100%;
    text-align: center;
    font-size: 13px;
    z-index: 2;
    color: red !important
}

@media(max-width: 768px) {
    .add-tofav-guideline {
        font-family: inherit;
        font-size: 14px;
        text-align: center;
        color: #ccc;
        width: 60%;
        margin: 19% auto auto;
        padding-top: 33px
    }

    body {
        visibility: visible
    }

.top-categories {
    top: 119px!important;
}

.retail .top-categories {
    top: 66px !important;
}

    .myAccountPid .content {
        min-height: calc(100vh - 70px) !important;
        background: #f8f8f8;
    }

    .wrap1260.noPad.subempty {
        margin-top: 0;
        padding-top: 0 !important
    }

    .instagram_gallery a {
        margin: -4px 0 0 !important;
        width: 25% !important
    }

    .instagram_gallery {
        padding-bottom: 22px !important;
        width: 98% !important
    }

    .userbar.icons .md-src {
        display: none !important
    }

    body.loyalty .accname,
    body.myAccountPid .accname,
    body.orderdetails .accname,
    body.receiptPid .accname,
    body.favoritePid .accname,
    body.checkoutID .accname,
    body.newsCtrl .accname,
    body.branchesCtrl .accname {
        display: block;
    }

    body.checkoutID .has-oft .accname{
        display:none;
    }
    

    .case.has-loyalty .accname.has-go-back {
        /* left: 79px; */
        /* transition: all .2s ease 0s; */
    }

    .retail .pickordel .input .check {
        top: 24px !important
    }

    .retail .pickordel .input .label {
        min-width: 88px;
        position: absolute;
        line-height: 18px;
        white-space: normal !important;
        width: 26px !important
    }

    .rtl.retail .pickordel .input .label {
        width: auto !important;
        padding-left: 0;
        padding-top: 0px;
    }

    .market .customizedID img.backg {
        width: 130%;
        max-height: none
    }

    .market .customizedID .picture .pinch-zoom {
        display: flex;
        justify-content: center;
        align-items: center
    }

    .multibranch .branchtitle {
        padding-left: 0 !important
    }

.rtl.multibranch .branchtitle:before {
    content: "استلام من";
}

.c240.rtl.multibranch .branchtitle:before {
    content: "التموين من";
}

    .multibranch .branchname::after,
    .multibranch .locationName::after {
        margin-right: -11px
    }

    .multibranch .branchname,
    .multibranch .locationName {
        padding-left: 0 !important
    }

    .has-loyalty .branchname,
    .has-loyalty .locationName {
        text-align: left !important;
    }

    .multibranch .deiveringfrom {
        left: 50%;
        transform: translateX(-50%);
        top: -56px;
        /* margin-left: -14px; */
        text-align: center;
        width: 151px !important;
        border: 0 !important
    }

    .case.has-loyalty .deiveringfrom {
        left: 53px;
        transform: none;
    }

    .case.has-loyalty .deiveringfrom.has-go-back {
        left: 88px;
        transform: none;
        width: 120px!important;
    }

    .case.has-loyalty .deiveringfrom .branchtitle,
    .case.has-loyalty .deiveringfrom .locationName {
        text-align: left;
    }

    .has-loyalty .multibranch .deiveringfrom {}

    .market .itemsList .itemGrid .descBlock .wrap {
        min-height: 184px;
    }

    .market.cols3mob .itemsList .itemGrid .wrap {
        /* padding-right: 5px; */
        overflow: hidden
    }

    .market.cols3mob .itemsList .itemGrid .priceWrap .wrap {
        overflow: visible
    }

    .market .newsCtrl .descBlock .wrap {
        min-height: unset !important
    }

    .scroll-up {
        display: none
    }

    .categoryPid .sorter {
        right: 9px !important;
        top: -44px !important;
    }

    .retail.enablesorting .categoryPid .sorter {
        /* margin-top: -58px; */
    }

    .rtl .categoryPid .sorter {
        margin-left: 9px!important;
        left: auto !important;
        top: -44px !important;
    }

    .market.enablesorting .categoryPid .titleAndLegend {
        visibility: hidden !important;
        pointer-events: none !important;
        display: none !important;
    }

    .market.enablesorting .categoryPid .titleAndLegend.subempty {
        visibility: hidden;
        pointer-events: none;
        display: none !important
    }

    .home-collection .view-more {
        /* margin-top: 26px; */
        /* display: none; */
        top: 22px !Important;
    }

    a.plink.genBtn {
        margin-left: 13px;
        margin-bottom: 23px
    }

    .box_delivery .googleMap img {
        width: 200%;
        margin-left: 22px;
        margin-top: 22px
    }

    .box_feedback .feed {
        left: 0;
        border-radius: 0px;
    }

    .itemsList .itemGrid .priceWrap .price {
        text-align: right;
        padding-right: 32px
    }

    .itemsList .itemGrid .priceWrap .points-price {
        text-align: right;
        padding-right: 32px
    }

    .market .itemsList .itemGrid .priceWrap .price {
        font-size: 12px;
        padding-right: 23px
    }


    .elt.printer {
        display: none !important
    }

    .minitotal {
        display: none
    }

    .myBagModule .genBtn {
        display: none
    }

    .wrpLocations {
        padding-top: 12px !important;
    }

    header.header {
        margin-top: 0;
        min-height: 181px;
    }

    .retail .homePid.s-active .header,
    .retail .homePid.s-active .categories,
    .retail .homePid.s-active .home-collection,
    .retail .homePid.s-active .offerslist,
    .retail .homePid.s-active .ymliketitle {
        display: none
    }

    .accname {
        display: block;
        /* margin-top: -3px; */
        z-index: 4;
    }
    .accname.forceShow {
        display: block !important;
    }

    .accname img {
        width: auto;
        height: 41px;
    }

    .retail .accname img {
        height: 40px
    }

    .content,
    .contentb {
        position: relative
    }

    .userbar {
        display: none;
        top: 346px !important;
        width: 100% !important;
        height: 46px !important;
        border-bottom: #ddd !important;
        padding-top: 11px !important
    }

    .openning-date {
        top: 0;
        margin-top: 0;
        margin-bottom: 52px
    }

    .openning-date .delivery-span {
        opacity: 1
    }

    .content,
    .contentb {
        width: 100%
    }

    .categoryPid .content.has-subcategories {
        padding-top: 46px;
    }

    main.content.orderdetailsp {
        background: #f6f6f6;
    }

    .receiptPid .content {
        /* display: flex; */
        /* align-content: center; */
        /* flex-wrap: wrap; */
        min-height: calc(100vh - 179px) !important;
        background: #f3f3f3;
    }

    .retail .content,
    .retail .contentb {
        min-height: calc(100vh - 67px) !important
    }

    .enablesorting .categoryPid .content {
        padding-top: 51px;
    }

    .enablesorting .categoryPid .content.p-t-0 {
        padding-top: 0px;
    }


    .enablesorting .content.has-subcategories {
        padding-top: 112px;
    }

.enablesorting .content.has-subcategories {}

    .enablesorting .content.has-subcategories .sorter {
        margin-top: -5px;
    }



    .market .favoritePid .content {
        /* padding-top: 51px; */
    }

    .cordova.market .favoritePid .content {
        /* padding-top: 63px; */
    }

    .cordova.enablesorting .categoryPid .content {
        /* padding-top: 63px; */
    }

    .retail.enablesorting .categoryPid .content {
        padding-top: 94px;
    }

.retail.enablesorting .categoryPid .content.has-subcategories {
    padding-top: 151px;
}

    .retail.enablesorting .categoryPid .content:not(.has-subcategories) {
        padding-top: 107px;
    }

    .market.enablesorting .categoryPid .content {
        margin-top: -6px
    }

    .cordova.market.enablesorting .categoryPid .content {
        margin-top: 5px;
    }

    .cordova.market.enablesorting .categoryPid .content:has(.subempty) {
        padding-top: 42px;
    }

    .retail .checkoutID .content {
        padding-bottom: 0 !important;
        padding-top: 0 !important;
        background: #f6f6f6;
    }

    .bagph {
        display: none
    }

    .deskmenu {
        opacity: 0;
        transform: translateX(200%);
        position: fixed;
        transition: all .3s ease 0s;
        background-color: #fafafa;
        margin: 0;
        padding: 22px;
        min-height: auto;
        display: block;
        width: 100vw !important;
        top: 66px !important;
        height: calc(100vh - 66px) !important;
        overflow-y: scroll !important
    }

    .deskmenu .logo {
        display: none
    }

    .s-active:not(.isSearching) .deskmenu {
        transform: translateX(0px);
        transition: all .4s ease 0s;
        opacity: 1;
        z-index: 4;
        padding-bottom: 105px;
    }

    .s-active:not(.isSearching) .deskmenu .logo,
    .s-active:not(.isSearching) .deskmenu .pages,
    .s-active:not(.isSearching) .deskmenu .applinks {
        display: none
    }

    .s-active:not(.isSearching):not(.clickedcat) .deskmenu li {
        margin-bottom: 0;
        display: block !important
    }

    .deskmenu li:first-child {
        border-top: 0
    }

    .homePid .deskmenu .menu li.colle {
        display: block
    }

    .MenuParts .bag {
        top: -14px;
        margin-right: 12px !important
    }

    .header-loyalty-value {
        right: 86px;
        top: 6px !important;
        position: absolute !important
    }

    .retail .MenuParts .bag {
        margin-right: 1px !important
    }

    .hide-bag .MenuParts .bag.minicv {
        display: none !Important;
    }

    .hide-bag .MenuParts .bag {
        display: block !important;
    }

    .menuontop .MenuParts .bag {
        display: block !Important;
    }

    .menuontop .MenuParts .bag.minicv {
        display: none !important;
    }

    li.add-tofav-guideline::before {
        content: "\F27C";
        font-family: Material-Design-Iconic-Font;
        color: #ccc;
        font-size: 35px;
        display: block;
        margin-bottom: 18px
    }

    .subPage .titleAndLegend .title {
        display: none
    }

    .market .subPage .content .titleAndLegend .title {
        display: none !important
    }

    .market .subPage .content .titleAndLegend .title {
        display: none !important
    }

    .showsubcatmenu .subPage .titleAndLegend .title {
        display: none !important
    }

    .favoritePid .titleAndLegend::before {
        display: none
    }
}

.verify-mobile {
    position: absolute;
    right: 16px;
    top: 50%;
    cursor: default;
    background: var(--primary-color);
    color: #fff;
    padding: 8px 18px 4px;
    font-family: Roboto, sans-serif;
    font-size: 11px;
    opacity: .1;
    transition: opacity .25s ease-in-out 0s;
    height: 21px;
    transform: translateY(-50%);
    pointer-events: none;
    border-radius: 0px!important;
    margin-top: -1px;
    line-height: 18px;
    border-radius: 6px;
}

.signupform.smssent .verify-mobile {
    margin-top: 7px
}

.verify-mobile.valid {
    cursor: pointer;
    opacity: 1;
    pointer-events: all;
}

.verify-mobile-caption {
    position: relative;
    display: block;
    color: #666;
    font-family: Roboto, sans-serif;
    font-weight: 400;
    font-size: 13px;
    margin-top: 0;
    width: 100%;
    padding-bottom: 16px;
    font-style: italic
}

.signupform .verify-mobile-caption {
    text-align: left;
    padding-left: 20px;
    padding-top: 5px;
    padding-bottom: 13px
}

.signupform.smssent .verify-mobile-caption {
    display: none
}

#updateContactInfoId .verify-mobile-caption {
    display: none
}

.zindex2 {
    z-index: 2
}

@media(max-width:768px) {

    .verify-mobile-caption {
        margin-bottom: -1px
    }
}

.hide-categories .categories {
    display: none !important
}

.hide-categories .catReplaceID {
    display: none !important
}

.hide-categories .MenuPartsReplace {
    display: none !important
}

.mobileMenuWrap .lineLink .ico.koein-icon {
    width: 20px;
    height: 20px;
    top: 17px
}

.languageDrp {
    float: right;
    padding-right: 5%;
    width: 32px;
    direction: rtl
}

.visit .select-locale {
    width: 80%
}

.koein {
    font-family: inherit;
    color: #555;
    font-size: 14px;
    background-color: #efefef
}

.koein .kheader {
    background-color: #484844;
    padding: 89px 20px 20px
}

.koein .txt1 {
    color: #efefef;
    line-height: 20px
}

.koein .klogo img {
    width: 80px;
    height: auto;
    margin-top: 60px;
    margin-bottom: 10px
}

.koein .kcenter {
    padding: 25px 15px
}

.koein .txt2 {
    line-height: 20px
}

.koein .solist {
    margin-top: 30px
}

.koein .solist li {
    list-style: none;
    border-top: 1px solid #ddd;
    line-height: 42px;
    font-size: 16px;
    color: #111;
    font-weight: 500
}

.koein .solist a {
    background-color: yellow;
    padding: 7px 20px 7px 15px;
    font-size: 14px;
    text-decoration: none;
    color: #111
}

.koein .solist li:last-child {
    padding-top: 12px
}

.koein .kbottom {
    background-color: #484844;
    padding: 20px;
    display: inline-block;
    width: calc(100% - 40px)
}

.categories ul>li .picture {
    width: 80px;
    height: 80px
}

.categories .swiper-no-swiping ul>li .picture {
    width: 85px;
    height: 85px;
    background-color: var(--primary-color)
}

.terms-big-wrapper {
    z-index: 10 !important
}

.mini-disclaimer {
    font-family: Roboto, sans-serif;
    color: #999;
    font-weight: 400;
    font-size: 13px;
    width: 100%;
    text-align: center;
    margin-top: 17px;
    margin-bottom: 21px;
    padding-bottom: 20px
}

.signupform .mini-disclaimer {
    display: none
}

.underline-it {
    text-decoration: underline;
    cursor: pointer
}

@media(max-width:768px) {
    .partReceipt.left {
        display: none
    }
}

@media(max-width:768px) {
    .categories ul>li .picture {
        width: 92px;
        height: 92px
    }

    .categories .swiper-no-swiping ul>li .picture {
        background-color: transparent
    }
}

.koein .txt3 {
    margin-top: 25px;
    color: #efefef;
    font-weight: 400;
    font-size: 16px
}

.koein .zwzlink {
    margin-top: 33px;
    margin-bottom: 30px
}

.koein .zwzlink a {
    background-color: yellow;
    padding: 7px 20px 7px 15px;
    font-size: 14px;
    text-decoration: none;
    color: #111
}

.koein .kcontact {
    border-top: 1px solid #555
}

.koein .kcontact img {
    width: 50px;
    height: auto;
    margin-right: 22px;
    margin-top: 30px
}

.tinyselect {
    width: 57px;
    height: 22px;
    background: #fff;
    overflow: hidden;
    position: relative;
    float: left;
    margin-top: -3px;
    margin-right: 12px;
    border: 1px solid #f3f2f2;
}

.tinyselect::before {
    content: "\F2F2";
    position: absolute;
    left: 6px;
    color: #ddd;
    top: -1px;
    display: inline-block;
    font: 25px / 1 Material-Design-Iconic-Font;
    pointer-events: none
}

.retail.rtl .customizedID .tinyselect {
    margin-top: 11px;
}

.tinyselect select {
    width: 70px;
    height: 100%;
    margin: 0;
    padding: 1px 0 0 19px;
    color: #000;
    cursor: pointer;
    border: 1px solid #fff;
    background: #fff;
    font-size: 12px;
    font-family: inherit;
    line-height: 17px;
    font-weight: bold;
    appearance: none;
    text-align-last: center;
}

.fnb.rtl .tinyselect select {
    direction: ltr;
    padding-left: 25px !important
}

select:focus {
    outline: 0
}

.tinyselect::after {
    position: absolute;
    top: 4px;
    right: 7px;
    padding: 0 0 0 5px;
    pointer-events: none;
    color: var(--primary-color);
    font-weight: bold;
    font-size: 15px;
    line-height: 14px
}

.tinyselect::after {
    transition: all .25s ease 0s
}

.formPart .inner-price {
    margin-left: 4px !important;
    color: #999 !important;
    font-size: 11px !important
}

.retail .no-price .inner-price {
    pointer-events: none
}

.classicproduct .no-price .inner-price {
    display: none
}

.formPart .price {
    top: 0;
    user-select: none
}

.news-section .itemsList .itemGrid .descBlock .title {
    font-size: 18px;
    color: var(--primary-color);
    white-space: normal
}

.news-section .itemsList .itemGrid.noimg .descBlock .title {
    font-size: 46px;
    color: var(--primary-color);
    line-height: 46px;
    padding-top: 10px;
    margin-bottom: 22px;
}

.news-section .itemsList .itemGrid .descBlock h2 {
    margin-bottom: 17px
}

.news-section .itemsList .itemGrid .priceWrap .price {
    font-size: 13px;
    color: #878787;
    font-weight: normal;
    text-transform: lowercase;
    float: left;
    width: 89%;
    text-align: right;
    margin-top: -2px;
    position: absolute;
    padding-right: 0;
    box-sizing: border-box;
    padding-left: 0;
    padding-top: 0
}

.myBagModule .itemBags .customPart .type {
    word-break: break-word
}

.retail .myBagModule .itemBags .customPart .type {
    display: none
}

@media(max-width:768px) {
    .news-section .itemsList .itemGrid .descBlock {
        height: auto;
        min-height: auto
    }

    .news-section .itemsList .itemGrid .descBlock .title {
        font-size: 18px;
        margin-bottom: 6px;
    }

    .news-section .itemsList .itemGrid .descBlock .description {
        font-size: 14px
    }

    .market .news-section .itemsList .itemGrid .descBlock .description {
        display: block !important;
        font-size: 14px !important;
        line-height: 21px !important
    }

    .newsCtrl.subPage .case .titleAndLegend {
        height: 21px;
        display: none !important
    }

    .newsCtrl.subPage .titleAndLegend .title {
        display: block;
        margin-top: 28px
    }

    .rtl .newsCtrl.subPage .titleAndLegend .title {
        text-align: right
    }

    .newsCtrl .itemsList .itemGrid .picture {
        max-height: 1000px;
        height: auto;
        width: 100%;
        border-radius: 0;
        min-height: 362px
    }

    .newsCtrl .itemsList .itemGrid .picture img {
        display: block;
        position: relative;
        width: 100%;
        height: auto
    }

    .market .newsCtrl .itemsList .itemGrid .picture img {
        width: inherit;
        top: 0 !important
    }

    .newsCtrl .itemsList .itemGrid {
        height: auto;
        display: inline-block;
        min-width: 100vw;
        width: auto !important;
        margin-right: 0 !important;
        margin-left: 0px !important;
    }

    .rtl .itemsList .itemGrid {
        margin-right: auto !important
    }

    .news-section .itemsList .genBtn {
        width: 115px;
        font-size: 12px;
        right: auto !important
    }
}

.clear-bag {
    cursor: pointer;
    font-size: 11px;
    transition: all .25s ease-in-out 0s;
    text-decoration: none;
    padding-bottom: 0px;
    width: auto;
    overflow: visible;
    display: inline;
    color: #999;
    padding-top: 27px;
    display: block;
}

.reviewbag .clear-bag {}

.forcePopupDisplayBlock {
    display: block !important
}

.app-version {
    position: absolute;
    right: 16px;
    top: 94px;
    font-size: 8px;
    color: #ddd
}

@media(min-width:769px) {
    .clear-bag:hover {
        color: var(--primary-color)
    }
}

.driverorderCtrl header,
.driverorderCtrl footer {
    display: none
}

.driver-order-info {
    position: relative;
    display: block;
    min-height: 100vh;
    width: 100%
}

.driver-order-info .googleMap {
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
    height: calc(100% - 134px) !important
}

.driver-order-info .googleMap img {
    width: 100%
}

.driver-order-info .googleMap .delivered-tab {
    position: absolute;
    font-size: 17px;
    font-family: Roboto, sans-serif;
    left: 25px;
    top: 17px;
    z-index: 100000;
    color: #fff;
    width: calc(100% - 50px);
    text-align: center;
    height: 54px;
    line-height: 54px;
    background-color: #3e9459 !important
}

.driver-order-info .googleMap .delivered-tab i {
    position: absolute;
    left: 18px;
    border: 3px solid #fff;
    border-radius: 50%;
    height: 23px;
    width: 23px;
    top: 11px;
    color: #848b92;
    font-size: 18px;
    font-weight: bold;
    transition: all .25s ease-in-out 0s;
    background: transparent
}

.driver-order-info .googleMap .delivered-tab i::before {
    content: "";
    transition: all .25s ease-in-out 0s
}

.driver-order-info .googleMap .delivered-tab.delivered {
    transition: all .25s ease-in-out 0s;
    background-color: #ced2d6 !important
}

.driver-order-info .googleMap .delivered-tab.delivered i {
    background: #fff
}

.driver-order-info .googleMap .delivered-tab.delivered i::before {
    content: "\F26B";
    font: 25px / 1 Material-Design-Iconic-Font;
    color: #ced2d6;
    position: absolute;
    top: -1px;
    left: 3px
}

.driver-order-info .order-info {
    min-height: 65px;
    position: relative;
    display: block;
    background-color: #fff;
    padding: 25px 102px 25px 27px
}

.driver-order-info .order-info .order-header {
    color: #3e9459;
    font-size: 20px;
    font-family: Roboto, sans-serif
}

.driver-order-info .order-info .order-address {
    position: relative;
    display: block;
    margin-top: 5px;
    color: #666;
    font-size: 15px;
    font-family: Roboto, sans-serif
}

.driver-order-info .order-info .order-mobile {
    position: absolute;
    width: 65px;
    height: 65px;
    border-radius: 50%;
    right: 27px;
    bottom: 25px;
    box-shadow: #cccccb 0 0 19px 2px;
    color: #fff;
    text-decoration: none;
    background-color: #3e9459 !important
}

.driver-order-info .order-info .order-mobile i {
    width: 100%;
    height: 100%;
    font-size: 30px;
    color: #fff;
    text-align: center;
    line-height: 68px
}

.driver-order-info .order-info .order-mobile i::before {
    content: "\F2BE";
    font-family: Material-Design-Iconic-Font;
    font-size: 35px;
    display: block;
    margin-bottom: 18px;
    font-style: normal;
    color: #fff !important
}

.ot-background {
    background-size: auto 60%;
    background-repeat: repeat-x;
    background-position: 0 center
}

.ot-container {
    position: relative;
    display: block;
    /* transform: translate(0px, 0px); */
    /* height: 210px; */
    /* margin-top: -12px; */
}

.cncld .ot-prgress-bar {
    width: 0 !important
}

.ot-container .ot-prgress-bar {
    position: relative;
    display: block;
    /* height: 1px; */
    background-color: #f1f1f1;
    margin-bottom: 12px;
    margin-top: 41px;
    transform: rotate(90deg);
    transform-origin: left center;
    margin-left: 14px;
    width: 208px
}

.ot-container .ot-prgress-bar {}

.rtl .ot-container .ot-prgress-bar {
    margin-left: 25px
}

.ot-container .ot-prgress-bar::after {
    content: "";
    background-color: var(--primary-color);
    position: absolute;
    left: 17px;
    bottom: -1px;
    height: 2px;
    width: 0;
    transition: all .5s ease 0s
}

.ot-container .ot-prgress-status-ctn {
    list-style: none;
    position: relative;
    width: 89px;
    /* height: 320px; */
    text-align: center;
    margin-top: -32px
}

.rtl .ot-container .ot-prgress-status-ctn {
    transform: rotateY(180deg)
}

.ot-container .ot-prgress-status {
    color: #999;
    font-size: 12px;
    font-family: Roboto, sans-serif;
    text-align: left;
    position: relative;
    float: left;
    height: 70px;
    width: 130px;
}

.rtl .ot-container .ot-prgress-status {
    font-family: inherit
}

.rtl .ot-container .ot-prgress-status {
    transform: rotateY(180deg);
    margin-left: -52px
}

.ot-container .ot-prgress-status::before {
    content: ">>>>";
    font-family: arial;
    font-size: 14px;
    color: #ccc;
    position: absolute;
    left: -16px;
    top: 22px;
    display: none
}

.ot-container .ot-prgress-status:first-child::before {
    content: ""
}

@media(max-width:768px) {
    .ot-container .ot-prgress-status::before {
        content: ">>>>";
        font-size: 11px;
        left: -13px
    }
}

@media(max-width:768px) {
    .ot-container .ot-prgress-status::before {
        content: ">>>";
        font-size: 11px;
        left: -8px
    }
}

@media(max-width:330px) {
    .ot-container .ot-prgress-status::before {
        content: ">>";
        font-size: 11px;
        left: -5px
    }
}

.ot-container .ot-prgress-status .ot-status-icon {
    position: relative;
    display: block;
    height: 15px;
    width: 15px;
    border-radius: 50%;
    margin-right: 11px;
    float: left;
}

.ot-container .ot-status-icon i {
    display: none
}

.ot-container .ot-status-icon {
    background-color: #f6f6f6;
    border: 3px solid #ddd;
    top: 1px
}

.ot-container .ot-cooking .ot-status-icon {
    background-repeat: no-repeat;
    background-position: 9px 10px;
    background-size: 75%
}

.ot-container .ot-ontheway .ot-status-icon {
    background-repeat: no-repeat;
    background-position: 6px -35px;
    background-size: 75%
}

.ot-container .ot-orderarrived .ot-status-icon {
    background-repeat: no-repeat;
    background-position: 14px -85px;
    background-size: 72%
}

.ot-container.ot-progress-1 .ot-prgress-bar::after {
    width: 0
}

.ot-container.ot-progress-2 .ot-prgress-bar::after {
    width: 28%
}

.ot-container.ot-progress-3 .ot-prgress-bar::after {
    width: 60%
}

.ot-container.ot-progress-4 .ot-prgress-bar::after {
    width: 100%;
}

.ot-container.ot-progress-4.dine-in .ot-prgress-bar::after {
    width: 60%;
}

.ot-container.ot-progress-1 .ot-processing i,
.ot-container.ot-progress-2 .ot-processing i,
.ot-container.ot-progress-3 .ot-processing i,
.ot-container.ot-progress-4 .ot-processing i,
.ot-container.ot-progress-2 .ot-cooking i,
.ot-container.ot-progress-3 .ot-cooking i,
.ot-container.ot-progress-4 .ot-cooking i,
.ot-container.ot-progress-3 .ot-ontheway i,
.ot-container.ot-progress-4 .ot-ontheway i,
.ot-container.ot-progress-4 .ot-orderarrived i {
    position: relative;
    display: block;
    color: #fff;
    font-size: 19px;
    height: 100%;
    line-height: 26px
}

.ot-container .ot-processing {
    font-weight: bold;
    color: #4c4c4c;
}

.ot-container.ot-progress-2 .ot-cooking {
    font-weight: bold;
    color: #4c4c4c
}

.ot-container.ot-progress-3 .ot-cooking,
.ot-container.ot-progress-3 .ot-ontheway {
    font-weight: bold;
    color: #4c4c4c
}

.ot-container.ot-progress-4 .ot-cooking,
.ot-container.ot-progress-4 .ot-ontheway,
.ot-container.ot-progress-4 .ot-orderarrived {
    font-weight: bold;
    color: #4c4c4c
}

.ot-orderarrived span {
    /* background-color: green!important; */
    /* border-color: green!Important; */
}

.ot-container .ot-processing .ot-status-icon {
    background-color: var(--primary-color);
    transition: all .25s ease 0s;
    border-color: var(--primary-color);
    width: 25px;
    height: 25px;
    /* margin-left: -1px; */
    /* margin-top: 4px; */
}

.ot-container.ot-progress-2 .ot-cooking .ot-status-icon {
    background-color: var(--primary-color);
    transition: all .25s ease 0s;
    border-color: var(--primary-color);
    width: 25px;
    height: 25px;
    margin-left: -1px
}

.ot-container.ot-progress-3 .ot-cooking .ot-status-icon,
.ot-container.ot-progress-3 .ot-ontheway .ot-status-icon {
    background-color: var(--primary-color);
    transition: all .25s ease 0s;
    border-color: var(--primary-color);
    width: 25px;
    height: 25px;
    margin-left: -1px
}

.ot-container.ot-progress-4 .ot-cooking .ot-status-icon,
.ot-container.ot-progress-4 .ot-ontheway .ot-status-icon,
.ot-container.ot-progress-4 .ot-orderarrived .ot-status-icon {
    background-color: var(--primary-color);
    transition: all .25s ease 0s;
    border-color: var(--primary-color);
    width: 25px;
    height: 25px;
    margin-left: -1px
}

.ot-container .ot-processing::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -102px;
    height: 90px;
    width: 58px;
    background-size: 53px;
    background-repeat: no-repeat;
    margin-left: auto;
    margin-right: auto;
    filter: grayscale(100%);
    display: none
}

.ot-container .ot-cooking::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -99px;
    height: 90px;
    width: 59px;
    background-size: 54px;
    background-repeat: no-repeat;
    margin-left: auto;
    margin-right: auto;
    filter: grayscale(100%);
    display: none
}

.ot-container .ot-ontheway::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -89px;
    height: 90px;
    width: 85px;
    background-size: 78px;
    background-repeat: no-repeat;
    margin-left: auto;
    margin-right: auto;
    filter: grayscale(100%);
    display: none
}

.ot-container .ot-orderarrived::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -88px;
    height: 90px;
    width: 60px;
    background-size: 54px;
    background-repeat: no-repeat;
    margin-left: auto;
    margin-right: auto;
    filter: grayscale(100%);
    display: none
}

@media(max-width:360px) {
    .ot-container .ot-processing::after {
        width: 50px;
        background-size: 50px;
        top: -94px
    }

    .ot-container .ot-cooking::after {
        width: 51px;
        background-size: 51px;
        top: -91px
    }

    .ot-container .ot-ontheway::after {
        width: 73px;
        background-size: 73px;
        top: -87px
    }

    .ot-container .ot-orderarrived::after {
        width: 52px;
        background-size: 52px;
        top: -80px
    }
}

.ot-container.ot-progress-1 .ot-processing::after,
.ot-container.ot-progress-2 .ot-processing::after,
.ot-container.ot-progress-3 .ot-processing::after,
.ot-container.ot-progress-4 .ot-processing::after,
.ot-container.ot-progress-2 .ot-cooking::after,
.ot-container.ot-progress-3 .ot-cooking::after,
.ot-container.ot-progress-4 .ot-cooking::after,
.ot-container.ot-progress-3 .ot-ontheway::after,
.ot-container.ot-progress-4 .ot-ontheway::after,
.ot-container.ot-progress-4 .ot-orderarrived::after {
    filter: grayscale(0%)
}

@media only screen and (min-width:769px) {
    .swiperID {
        margin-top: -5px
    }

    .swiperID.fix,
    .swiperID.fix2 {
        top: -61px !important
    }

}

.reachPID {
    min-height: 100vh;
    width: calc(100% - 604px);
    display: inline-block;
    vertical-align: top
}

.rtl .reachPID {
    float: right
}

.clear {
    clear: both;
    list-style: none
}

.locationBox {
    float: left;
    position: relative;
    height: 96px;
    width: 628px;
    background-color: #fff
}

.reachLocations {
    position: absolute;
    width: 100%;
    height: auto;
    bottom: 0;
    left: 0
}

.reachLocations .over {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 0;
    background-color: #333230;
    transform: translate3d(0px, 0px, 0px);
    transition: height .5s cubic-bezier(0.21, 0.48, 0.84, 0.49) 0s
}

.reachLocations .item {
    min-height: 77px;
    margin-bottom: 26px;
    width: 100%;
    max-width: 520px;
    margin-right: 88px;
    cursor: pointer
}

.reachLocations .item:nth-child(2n) .sep {
    display: none
}

.reachLocations .item:nth-child(2n) {
    margin-right: 0
}

.wrpLocations {
    position: relative;
    width: 100%;
    padding-top: 9px;
    padding-left: 8px;
    height: 100%;
    box-sizing: border-box;
}

.reachLocations .locAddress {
    margin-left: 0;
    padding-left: 0;
    margin-right: 0;
    width: 218px
}

.reachLocations .closeBtn {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    text-decoration: none;
    border: 2px solid #fff;
    width: 64px;
    height: 63px;
    cursor: pointer;
    transform: translate3d(0px, 0px, 0px);
    border-radius: 100%;
    transition: border-color .3s ease 0s
}

.reachLocations .locationBox .sep {
    position: absolute;
    right: 0;
    top: 0;
    height: 77px;
    float: none;
    display: none
}

.reachLocations .telEmail {
    width: 218px
}

.locAddress {
    position: relative;
    float: left;
    margin-right: 14px;
    padding-left: 37px;
    margin-left: 20px;
    margin-top: 26px;
    width: 320px;
    box-sizing: border-box
}

.locAddress .fa-map-marker {
    color: #ee2e22;
    font-size: 55px;
    position: absolute;
    top: 0;
    left: 0
}

.locAddress .icon {
    position: absolute;
    top: 0;
    left: 0;
    width: 27px;
    height: 35px
}

.locAddress .icon .double {
    width: 54px;
    height: 70px;
    background-position: -640px -2930px;
    background-repeat: no-repeat;
    background-size: initial
}

.locAddress .street:first-child {
    font-size: 18px;
    color: #333;
    padding-top: 3px;
    overflow: hidden;
    font-family: titlefont;
    font-weight: bold !important
}

.locAddress .street p {
    width: 90%;
    font-size: 14px;
    font-weight: normal
}

.rtl .locAddress .street p {
    margin-left: auto;
    margin-right: 0
}

.locAddress .street.noaddressName {
    padding-top: 20px
}

.locAddress .street.Desc {
    color: #666;
    padding-top: 0;
    margin-top: 7px
}

.telEmail {
    position: relative;
    float: left;
    width: 262px;
    padding-top: 29px;
    box-sizing: border-box
}

.locationBox .sep {
    float: left;
    position: relative;
    width: 2px;
    height: 100%;
    background-color: #222
}

.telEmail .lineType {
    position: relative;
    min-height: 25px;
    float: left;
    margin-right: 45px;
}

.telEmail .lineType:nth-child(2) {
    margin-right: 51px;
}

.telEmail .lineType:nth-child(1) .zmdi:before {
    font-size: 25px;
}

.telEmail .lineType .type {
    position: absolute;
    left: 4px;
    top: -3px;
    text-transform: uppercase;
    font-size: 28px;
    color: var(--secondary-color)
}

.telEmail .lineType .type .zmdi-phone {
    font-size: 26px;
}

.rtl .telEmail .lineType .type {
    font-family: inherit;
    line-height: 12px;
    transform: rotateY(180deg)
}

.telEmail .lineType .value a {
    transform: translate3d(0px, 0px, 0px);
    transition: color .3s ease 0s;
    text-decoration: none;
    display: block;
    font-size: 15px;
    color: #666
}

.telEmail .lineType .value {
    font-size: 15px;
    color: #666
}

.locationBox {
    height: auto
}

.LocationAjaxData .telEmail {
    padding-top: 0;
    padding-left: 36px
}

.LocationAjaxData .locAddress {
    margin-bottom: 15px;
    margin-left: 0;
    margin-top: 0;
    width: 218px
}

.locationBox .wrp {
    position: relative;
    width: auto;
    height: auto
}

.locationBox .wrp .locationBox2 {
    position: relative
}

.telEmail .lineType .value {
    text-decoration: none
}

.rtl .telEmail .lineType .value {
    transform: rotateY(180deg);
    padding-left: 0;
    box-sizing: border-box;
    text-align: right
}

.reachLocations .locAddress {
    width: 100% !important;
    height: auto !important;
    margin-top: 0 !important;
    padding-top: 0 !important
}

.wrpLocations {
    padding-top: 31px;
    padding-bottom: 114px;
    transition: all .2s linear 0s;
    padding-left: 0 !important;
    /* padding-right: 2% !important; */
    height: auto !important;
}

.reachLocations .wrpLocations {
    margin-top: 4px
}

.rtl .reachLocations .wrpLocations {
    direction: rtl;
}

.locAddress .street {
    font-weight: 300;
    padding-top: 0 !important
}

.rtl .locAddress .street {
    font-family: inherit;
    transform: rotateY(180deg);
    text-align: right;
    line-height: 22px;
}

.reachLocations {
    position: relative;
    left: auto;
    bottom: auto
}

.reachLocations li {
    list-style: none;
    width: 48%;
    display: inline-block;
    margin-right: 14px;
    vertical-align: top;
}

.rtl .reachLocations li {
    /* float: right; */
    margin-right: 0px !Important;
    margin-left: 12px;
}

.reachLocations .item {
    min-height: 0;
    box-sizing: border-box;
    float: none;
    margin-right: 0;
    padding-left: 20px;
    padding-right: 20px;
    width: 100%;
    max-width: 100%;
    box-shadow: rgba(204, 204, 204, 0.24) 0 0 4px;
    padding-bottom: 21px !important;
    padding-top: 20px !important;
    margin-bottom: 10px !important;
    box-sizing: border-box;
}

.rtl .reachLocations .item {
    transform: rotateY(180deg);
}

.rtl .reachLocations .item .ctel {
    transform: rotateY(180deg);
    text-align: right;
    padding-right: 57px
}

.rtl .reachLocations .item .cemail {
    padding-right: 57px
}

.rtl .telEmail .lineType {
    margin-left: -34px;
    margin-right: 25px
}

.reachLocations .item:last-child {
    margin-bottom: 4px;
    min-height: 160px
}

@media(max-width:768px) {
    .rtl .reachPID {
        /* float: none; */
    }

    .rtl .reachLocations li {
        float: none;
        margin-left: auto !important;
        margin-right: 8px !Important;
        display: inline-block;
    }
}

.responsive-stacked-table.with-mobile-labels td.withTitle:nth-of-type(2)::before {
    content: attr(data-text)
}

.responsive-stacked-table.with-mobile-labels td.withTitle:nth-of-type(1)::before {
    content: attr(data-text)
}

.responsive-stacked-table.with-mobile-labels td.withTitle:nth-of-type(3)::before {
    content: attr(data-text)
}

.responsive-stacked-table.with-mobile-labels td.withTitle:nth-of-type(4)::before {
    content: attr(data-text)
}

.responsive-stacked-table.with-mobile-labels td.withTitle:nth-of-type(5)::before {
    content: attr(data-text)
}

.orderReview .responsive-stacked-table.with-mobile-labels td.withTitle:nth-of-type(1)::before {
    content: attr(data-text)
}

.orderReview .responsive-stacked-table.with-mobile-labels td.withTitle:nth-of-type(2)::before {
    content: attr(data-text)
}

.orderReview .responsive-stacked-table.with-mobile-labels td.withTitle:nth-of-type(3)::before {
    content: attr(data-text)
}

.rtl .menuList.weRecom {
    line-height: 12px;
    font-family: inherit
}

.hot-line {
    font-family: inherit;
    color: #fff;
    font-weight: 600;
    font-size: 28px;
    margin-right: 13px
}

.hot-line::after {
    font: 23px / 1 Material-Design-Iconic-Font;
    content: "\F2BE"
}

.hot-line:empty {
    display: none!important;
}

.rtl select,
button,
.rtl input,
.rtl textarea {
    text-align: right;
    direction: rtl;
    font-family: inherit !important
}

.rtl .filter input {
    font-family: inherit
}

.MenuParts .parts .bot .faBars {
    margin-right: 27px
}

.rtl .footer .menu .link li span {
    font-family: inherit
}

.rtl .mainTitle.ng-scope {
    font-family: inherit
}

.rtl .loginRegisterID .smallTittle {
    font-family: inherit
}

.rtl .normalForm .label {
    font-family: inherit;
    right: 15px;
    line-height: 14px
}

.rtl .passedit .normalForm .label {
    left: 0;
    text-align: left;
    padding-left: 16px;
}

.rtl .inputWrap.focused .label {
    left: 15px;
    right: auto;
    line-height: 13px
}

.rtl .password-field.inputWrap.focused .label {
    left: 34px;
}

.rtl .listingAccount li span {
    font-family: inherit
}

.rtl .noflex.big.empty .cell {
    font-family: inherit
}

.rtl .loginRegisterID .wrap {
    padding-top: 23px;
    padding-right: 0 !important
}

.rtl .left.part {
    text-align: right;
    box-sizing: border-box;
    direction: rtl;
}

.rtl .loginRegisterID .normalForm .txtForgot {
    font-family: inherit
}

.rtl .line.desk {
    display: inline-block
}

.rtl .loginRegisterID .parts .right {
    text-align: right;
    padding-right: 52px;
    box-sizing: border-box
}

.rtl .listingAccount li .zmdi {
    display: none
}

.rtl .text {
    font-family: inherit;
    line-height: 40px
}

.rtl .mobileMenuWrap .lineLink {
    direction: rtl;
    padding-right: 26px
}

.rtl .generalMainTitle {
    font-family: inherit
}

.rtl .description {
    font-family: inherit;
    text-align: right
}

.rtl .bTitle,
.rtl .txt {
    font-family: inherit;
    line-height: 21px;
    text-align: right;
    min-height: 24px;
    margin-right: -13px;
    padding-right: 6px;
    /* font-size: 16px !important; */
}

.rtl .myBagModule .bagTitle {
    font-family: inherit;
    text-align: right;
    padding-right: 14px;
    box-sizing: border-box
}

.rtl .cutomBox .cLink {
    font-family: inherit
}

.rtl .custText {
    font-family: inherit
}

.rtl .boxTitle {
    font-family: inherit;
    text-align: right
}

.rtl .clear-bag {
    font-family: inherit
}

.rtl .titleBox {
    font-family: inherit
}

.rtl .orderdetails .titleBox {
    text-align: right
}

.rtl .subLine .lbl {
    font-family: inherit
}

.rtl .totalLbl {
    font-family: inherit
}

.rtl .radio .label {
    font-family: inherit;
    line-height: 12px
}

.rtl .input .label {
    font-family: inherit;
    line-height: 12px;
    /* float: left; */
}

.rtl .customizedID .input .label {
    padding-right: 33px;
    text-align: right !important;
}

.rtl.retail .customizedID .input .label {
    float: left;
    line-height: 9px;
    direction: rtl;
    text-align: left
}

.rtl select {
    line-height: 15px;
    font-family: inherit !important;
    padding-right: 10px;
}

.rtl .selection .selectDate select {
    padding-right: 64px;
    direction: rtl
}

.rtl .selection .selectDate .when:first-child select {
    padding-right: 19px;
}

.rtl .pageMainTitle {
    font-family: inherit;
    text-align: right
}

.rtl .checkoutID .pageMainTitle {
    text-align: center;
    padding-top: 21px
}

.rtl .openning-date .delivery-span {
    font-family: inherit;
    font-size: 31px;
    direction: rtl;
}

.rtl .orders .order .withTitle {
    font-family: inherit;
    text-align: right;
    line-height: 23px;
    float: right;
    overflow: hidden;
    direction: rtl;
    padding-left: 22px;
    width: 100%;
    padding-right: 17px
}

.rtl .extra-note {
    font-family: inherit;
    text-align: right;
}

.rtl .mobileMenuWrap ul li {
    text-align: right;
    padding-right: 28px;
    box-sizing: border-box
}

.rtl .mobileMenuWrap ul li a {
    font-family: inherit
}

.rtl div#recommended {
    text-align: right
}

.rtl .mobileMenuWrap .lineLink .text {
    font-family: inherit !important
}

.MenuParts .bag {
    text-transform: uppercase;
    cursor: pointer
}

.menuList.bag::before {
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    font-stretch: normal;
    line-height: 1;
    font-family: Material-Design-Iconic-Font;
    content: "\F1C9";
    margin-right: 8px;
    top: 3px;
    color: var(--primary-color);
    width: 62px;
    position: relative;
    font-size: 25px !important
}

.fnb .menuList.bag::before {
    content: "\F195"
}

.retail .menuList.bag::before {
    content: "";
    display: none
}

.retail .menuList.bag span::after {
    content: "";
    top: -9px;
    position: absolute;
    width: 15px;
    height: 8px;
    left: 3px;
    z-index: 0;
    border-radius: 50% 50% 0 0 / 100% 100% 0 0
}

.rtl .orTxtWrap .orTxt .line {
    display: none
}

.rtl .column_cust .block .bSmallTitle {
    font-family: inherit;
    transform: rotateY(180deg);
    text-align: right;
    font-weight: 400;
    font-size: 16px;
    direction: rtl
}

.rtl .verify-mobile-caption {
    font-family: inherit;
    font-size: 13px;
    margin-bottom: 0;
    text-align: center
}

.rtl .createAccountID .parts .part {
    text-align: right
}

.rtl .mini-disclaimer {
    font-family: inherit;
    text-align: center;
    width: 100%
}

.rtl label.missing {
    left: 8px;
    right: auto;
    height: 18px;
    line-height: 11px;
    top: -16px;
    z-index: 3;
}

.rtl label.missing#mobile-error {
    right: 82px;
    left: auto
}

.rtl .createAccountID .mainTitle {
    text-align: center
}

.moreBtn {
    text-transform: uppercase
}

.rtl .column_cust .block .bTitle {
    transform: rotateY(180deg);
    padding-left: 0;
}

.rtl .customizedID.noCustomization .column_cust .block .bigPrice {
    text-align: center
}

.rtl .customizedID .column_cust .block .bigPrice {
    text-align: right;
    margin-top: 8px
}

.rtl .customizedID .column_cust.onRight .block {
    float: left;
    transform: rotateY(0deg)
}

.column_cust.onRight .bTitle.totalCss {
    transform: none
}

.rtl .customizedID .column_cust .block .textarea textarea {
    font-family: inherit;
    font-size: 12px
}

.rtl .MenuParts .signedIn .userInfo .cont ul li a {
    font-family: inherit;
    text-align: right;
    width: 100%
}

.rtl .titleThanks {
    font-family: inherit
}

.rtl .fullThankyou .orderProc {
    font-family: inherit;
    margin-bottom: 28px
}

.rtl .partReceipt .txtReceipt {
    font-family: inherit
}

.rtl .partReceipt .note {
    font-family: inherit
}

.rtl .categories ul>li .title {
    line-height: 23px;
    padding-bottom: 0;
    text-align: center
}

.rtl .partReceipt.left {
    text-align: right
}

.rtl .recTable .headTab {
    font-family: inherit
}

.rtl .recTable {
    transform: rotateY(180deg)
}

.rtl .recTable .cell {
    font-family: inherit;
    transform: rotateY(180deg);
    text-align: right
}

.rtl .recTable .cell:nth-child(6) {
    text-align: left
}

.receiptBox .head {
    display: none
}

#customizedModalID .addToFav {
    float: left;
    width: 50%;
    border-top: 1px solid #eee;
    height: 57px;
    margin: 0;
    box-sizing: border-box;
    line-height: 46px;
    text-transform: uppercase;
    color: #444;
    text-align: center;
    background-color: #fff
}

.addToFav.heartHov.onimg {
    display: none;
}

.market .addToFav.heartHov {
    display: none;
}

.retail #customizedModalID .addToFav {
    /* border: 1px solid #ddd; */
    /* width: calc(50% - 7px); */
    /* height: 50px; */
    /* border-radius: 4px; */
    /* box-sizing: border-box; */
    /* line-height: 50px; */
    /* padding-top: 0; */
    /* margin-bottom: 22px; */
    /* position: relative; */
    /* margin-left: 7px; */
}

.retail #customizedModalID .onRight .addToFav {
    display: none
}

.rtl .myBagModule .itemBags .customPart .name,
.rtl .myBagModule .itemBags .customPart .type {
    font-family: inherit;
    line-height: 14px;
    float: right;
    text-align: right;
    padding-right: 0px;
}

.myBagModule .itemBags .customPart .elements {
    width: calc(100% - 98px);
}

.myBagModule.stick .wrapTotalBtn {
    display: none
}

.rtl .coupons div {
    float: right;
    /* margin-right: 3px; */
    direction: rtl
}

.box_date {
    transform: translate(0px, 0px)
}

.notloggedin div#schedule-order-id {
    display: none
}

.box_date.pickordel {
    margin-top: 0;
    padding-top: 16px;
    padding-right: 19px;
    min-height: 56px;
}

.notloggedin .box_date.pickordel.ng-scope {
    /* display: none; */
}

.rtl #checkoutFormId .title,
.rtl #checkoutFormId .brand {
    text-align: right;
}

.rtl #checkoutFormId .d-w .title {
    padding-left: 0px;
    padding-right: 4px;
}

.rtl #checkoutFormId .title[translate="canWeTemptYou"] {
    padding-right: 17px;
}

.rtl .dateForm .label {
    margin-left: 27px;
    direction: rtl;
    padding-top: 4px;
}

.recTable .footTab .table .cell .text {
    width: auto
}

.rtl #promotionId .message-ctn {
    font-family: inherit
}

.wrapCustom,
.column_cust,
.blcWrap {
    width: 100%
}

.modal.noCustomization .column_cust {
    max-width: 100%;
    text-align: center;
    width: 100%
}

.modal.noCustomization .customnote {
    display: block;
}

.market .modal.noCustomization .column_cust {
    display: none
}

.rtl .column_cust.onRight {
    transform: rotateY(0deg) !important
}

.rtl .column_cust.onRight .block .bTitle {
    transform: rotateY(0deg)
}

.customizedID .input.checked .label {
    color: #000;
    font-weight: 600;
    text-align: left
}

.rtl .createAccountID .line {
    background-color: #fff
}

.loginRegisterID .parts .left {
    box-sizing: border-box
}

.loginRegisterID .genBtn,
.loginRegisterID .moreBtn,
.loginRegisterID .loadMore {
    max-width: 100%
}

.genBtn {
    text-transform: uppercase
}

.coupons.retry .genBtn,
.coupons.remove .genBtn {
    display: block !important;
}

.box_feedback .genBtn {
    width: 100%;
    height: 50px
}

.createAccountID .genBtn {
    max-width: 100%;
    margin: auto
}

.orTxtWrap {
    max-width: 100%
}

.rtl .verify-mobile {
    font-family: inherit;
    font-size: 11px;
    right: auto;
    left: 16px;
}

.rtl .whiteBox .boxes.deliverBoxID .box .lines .line .lbl {
    text-align: right;
    float: right;
    font-family: inherit;
    line-height: 13px
}

.rtl .addAddressID .label {
    text-align: right
}

.rtl .editAddAddress .location .pin {
    font-family: inherit;
    text-align: right
}

.editAddAddress .part {
    width: 50%;
    margin: 0
}

.rtl .editAddAddress .part {
    float: right
}

.editAddAddress .part.left {
    padding-right: 14px;
    box-sizing: border-box
}

.rtl .editAddAddress .part.left {
    padding-right: 0;
    padding-left: 12px
}

.editAddAddress .genBtn {
    width: 100%;
    margin-top: 17px
}

.rtl .editAddAddress .mainTitle {
    text-align: right;
    font-family: inherit
}

.rtl .whiteBox .boxes.deliverBoxID .box .lines .line .txt {
    font-family: inherit
}

.rtl .coupons .genBtn {
    font-size: 10px;
    position: absolute;
    left: 16px;
    width: auto;
    display: inline-table;
    white-space: nowrap;
}

.rtl .coupons input {
    font-family: inherit
}

.rtl .box_delivery .location .customDropDown .drop_select .drop_item {
    text-align: right;
    padding-right: 20px;
}

.rtl .box_delivery .location .customDropDown .drop_item {
    text-align: right
}

.rtl .receiptPid .fullThankyou .moreBtn {
    font-family: inherit
}

.errorpopup {
    position: fixed;
    top: 50%;
    width: 355px;
    z-index: 2147483647;
    background-color: #fff;
    font-family: inherit;
    font-weight: 400;
    font-size: 15px;
    color: #666;
    transition: all .5s cubic-bezier(0.29, 1.31, 1, 1) 0s;
    padding: 50px 19px 21px;
    box-sizing: border-box;
    text-align: center;
    transform: translateX(-50%) translateY(300%);
    left: 50%;
    border-radius: 8px
}

.errorpopup .title {
    font-weight: bold;
    padding-bottom: 11px;
    font-size: 21px;
    color: #222;
}

.errorpopup .sub-title {
    font-size: 14px;
    padding: 8px
}

.errorpopup.ebottom.multiple-buttons .button {
    width: calc(50% - 10px) !important;
}

.errorpopup.ebottom.multiple-buttons .button:nth-child(3) {
    color: #fff;
    background-color: var(--primary-color) !important;
    /* font-weight: bold; */
    /* font-size: 12px; */
    border: 0px;
}

.errorpopup.ebottom.has-title .title::before {
    content: "\F1F7";
    font-family: Material-Design-Iconic-Font;
    color: var(--primary-color);
    font-size: 35px;
    display: block;
    margin-bottom: 18px
}

.errorpopup.ebottom.has-title .message::before {
    content: ""
}

.rtl .whiteBox .userdata {
    text-align: right
}

.rtl .whiteBox .boxes .box.showing .edit .inputWrap,
.rtl .whiteBox .boxes .box.default .edit .inputWrap {
    text-align: right
}

.rtl .whiteBox .userdata .lbl {
    font-family: inherit
}

.rtl .myAccountPid .pageMainTitle {
    text-align: right;
    padding-right: 4px;
    box-sizing: border-box;
    padding-top: 18px;
    display: none
}

.subTopMenu .links .link {
    width: 33%
}

.rtl .responsive-stacked-table.with-mobile-labels td::before {
    font-family: inherit
}

.rtl .orders .order .oNbItems {
    font-family: inherit;
    line-height: 13px;
    text-align: center
}

.rtl .orders .order .orderNb,
.rtl .orders .order .oNbItems,
.rtl .orders .order .orderCost {
    text-align: right;
    line-height: 20px;
    padding-right: 17px
}

.rtl .itemsList .itemGrid {
    /* margin-left: 18px; */
    margin-right: 0
}

.rtl .categoryPid .titleAndLegend div {
    text-align: right
}

@media only screen and (min-width:769px) {
    .rtl .withBagOnRight .nearBag.gridSystem ul:first-child {
        /* right: 38px; */
    }

    .rtl .filter.normal {
        right: auto;
        left: 0
    }

    .rtl .withBagOnRight .gridSystem .thebig-ul {
        text-align: left;
    }

    .rtl .categoryPid .withBagOnRight .generalMainTitle {
        text-align: right;
        /* padding-right: 397px; */
        box-sizing: border-box
    }

    .rtl .categoryPid .generalMainTitle {
        text-align: right;
        box-sizing: border-box;
        margin-top: 51px;
    }
}

.rtl .categoryPid .withBagOnRight .generalMainTitle {
    text-align: right
}

.rtl .orderdetails .boxData .name {
    text-align: right;
    width: 100%;
    direction: rtl
}

.rtl .editMode .location .edit .title {
    text-align: right;
}

.noOrder .itemsList .genBtn {
    display: none
}

.noOrder .menuList.signin {
    display: none
}

.noOrder .MenuParts .bag {
    display: none
}

.noOrder .MenuParts .logo {
    position: absolute;
    transform: translateX(-50%);
    display: none;
    margin-left: 50% !important
}

.noOrder .menuMob {
    display: none !important
}

.noOrder .go-back {
    margin-left: -41px
}

@media(min-width:1023px) and (max-width:768px) {
    body {
        visibility: visible
    }

    .itemsList .itemGrid {
        width: 233px
    }
}

.noOrder .customizedID .wrap {
    padding: 0
}

.noOrder .customizedID .head {
    width: auto
}

.noOrder .customizedID .addRemoveWrap .price {
    border: 1px solid #fff;
    padding: 7px;
    margin: 0
}

.noOrder .zmdi-favorite-outline,
.noOrder .zmdi-favorite {
    display: none
}

.loginRegisterID .right .wrap {
    padding-right: 45px
}

nocustomization .genBtn {
    width: 100%
}

.loginRegisterID .parts .part .wrap .normalForm .input {
    width: auto
}

.rtl .listingAccount li:last-child {
    margin-bottom: 41px
}

.rtl .createAccountID .genBtn {
    max-width: 100%;
    margin-top: 48px
}

.myAccountPid .input {
    width: auto
}

.rtl .myAccountPid .input input {
    text-align: right;
}

.myAccountPid .input.verifcode {
    margin-top: 8px
}

.myAccountPid .input.verifcode input {
    border: 0 !important
}

.rtl .ot-container .ot-prgress-status::before {
    transform: rotateY(180deg);
    right: -5px;
    left: auto
}

.titleAndLegend {
    min-height: 55px;
    box-sizing: border-box
}

.retail .newsCtrl .titleAndLegend {
    margin-bottom: 28px
}

.offers-section .titleAndLegend {
    padding-bottom: 0;
    min-height: auto;
    display: none
}

.rtl .favoritePid .titleAndLegend {
    text-align: right
}

.rtl .favoritePid .titleAndLegend .title,
.rtl .generalMainTitle {
    text-align: right;
    padding-right: 6px;
    width: calc(100% - 20px);
    direction: rtl;
    margin-bottom: 18px;
}

.box_instruction {
    transform: translate(0px, 0px);
    perspective: 900000px;
    margin-top: 0 !important;
    padding-bottom: 20px;
}

.box_instruction.notesCss {
    padding-left: 17px !important;
    padding-right: 17px;
}

.box_instruction.specialInstructions {
    padding-left: 13px;
    padding-right: 13px;
    margin-top: -5px !important
}

.retail .box_instruction.specialInstructions {
    margin-top: 26px !important
}

.box_instruction.notesCss {
    padding-top: 10px;
    padding-bottom: 22px;
    margin-top: 0 !important
}

.retail .box_instruction.notesCss {
    margin-top: 0;
    padding-top: 18px
}

.termsID {
    max-width: 770px;
    min-width: 750px
}

div#offersHowItWorksId {
    max-width: 420px
}

.termsID .cont {
    background-color: #fff;
    padding: 25px;
    border-radius: 7px;
    font-size: 14px;
    line-height: 26px !important
}

.termsID .cont p,
.termsID .cont span {
    font-size: 14px;
    line-height: 26px !important;
    color: #333 !important;
    font-family: inherit !important
}

.termsID .cont a {
    color: var(--primary-color)
}

div#createAccountModalID {
    width: 375px;
    border-radius: 8px
}

.mCSB_container {
    overflow: hidden auto;
    top: 0 !important
}

.bagScroll .mCSB_container {
    height: calc(100vh - 210px);
}

.retail div#mCSB_7_container {
    height: calc(100% - 161px)
}

.userbar {
    height: 66px;
    top: 86px;
    position: fixed;
    width: calc(100% - 600px);
    transform: translateX(-50%);
    left: 50%;
    text-align: right;
    color: #333;
    box-sizing: border-box;
    padding-top: 18px;
    background: #f6f6f6;
    z-index: 6;
    padding-left: 10px;
    /* margin-left: -1px; */
    /* backdrop-filter: blur(10px); */
}

.reviewbag .userbar {
    display: none !important
}

.checkoutID .userbar {
    background: linear-gradient(#eee 47%, rgba(238, 238, 238, 0.27) 100%)
}

.showBag .userbar {
    border-bottom: 1px dotted #ddd;
}

.subPage .userbar {
    border-bottom: 1px dotted #ddd;
}

.subPage .userbar.up {
    background: 0 center;
}

.powered {
    text-align: right
}

.powered::before {
    font: 18px / 1 Material-Design-Iconic-Font;
    content: "\F387";
    margin-right: 6px;
    color: #777
}

.powered a {
    text-decoration: none;
    color: #777;
    font-weight: bold;
    margin-right: 22px;
    font-family: arial, sans-serif
}

.footer .terms {
    line-height: 60px;
    color: #999
}

.footer .terms div {
    float: left;
    margin-left: 22px;
    cursor: pointer;
    transition: all .3s linear 0s;
    text-transform: capitalize;
    font-family: inherit
}

.footer .terms div:hover {
    color: #333;
    transition: all .3s linear 0s
}

.customizedID .head .wrap {
    padding: 0;
    height: 100%
}

.wrap.nopimgb .picture {
    visibility: hidden
}

div#customizedModalID {
    background-color: transparent;
    max-width: 998px;
    width: 100%;
}

.fnb div#customizedModalID:after {
    content: '';
    height: 0px;
    margin-bottom: 57px;
}

.retail div#customizedModalID {
    background-color: transparent;
    max-width: 1200px;
    overflow: visible;
}



div#customizedModalID .formPart .input .label {
    display: inline-block;
    margin-bottom: 0;
    width: calc(100% - 140px) !important
}

.retail div#customizedModalID .formPart .input .label {
    display: block;
    margin-bottom: 0;
    line-height: 14px
}

.customizedID .bigPrice {
    position: fixed;
    right: 22px;
    font-weight: 700;
    opacity: .5;
    color: #fff;
    height: 58px;
    line-height: 59px;
    font-size: 15px;
    z-index: 3
}

.itembagfooter {
    background-color: #fff;
    width: 100%;
    /* height: 39px; */
    position: relative;
    /* border-top: 7px solid #fff; */
    /* border-radius: 0 0 5px 5px; */
    margin-top: 4px;
}

.orderdetails .itembagfooter {}

.notloggedin .itembagfooter {
    /* height: 38px; */
}

.checkoutID .myBagModule .genBtn {
    display: none
}

.checkoutID.reviewbag .myBagModule.stick .genBtn {
    display: block;
    text-align: left;
    padding: 0 0 0 21px;
    line-height: 53px
}

.newAddress.edit .ico {
    color: var(--primary-color)
}

.checkoutID .notloggedin .box_delivery .genBtn {
    font-weight: bold;
    position: relative;
    border-radius: 8px;
    border-bottom: 0;
    height: 57px;
    max-width: 310px;
    margin: auto
}

.checkoutID .notloggedin .box_delivery .genBtn::before {
    content: "\F205";
    font: 68px / 1 Material-Design-Iconic-Font;
    width: 100%;
    text-align: center;
    color: #e2e1e1;
    height: 88px;
    margin-bottom: -19px;
    display: none
}

#updateContactInfoId .verify-mobile {
    right: 5px;
}

.rtl #updateContactInfoId .verify-mobile {
    width: 26px;
    right: auto;
    left: 7px;
}

#updateContactInfoId input#mobile {
    padding-left: 55px;
}

.myAccountPid i.zmdi.zmdi-plus-circle::after {
    display: none
}

.retail .customnote {
    display: none
}

.noOrder .genBtn.trigger-addtobag.addtobagbtn.ng-scope {
    display: none !important
}

.addtobagbtn {
    display: none;
}

.addtobagbtn.sold-out {
    background-color: #ddd;
    pointer-events: none
}

.addtobagbtn.sold-out::before {
    content: attr(data-title);
    width: 100%;
    position: absolute;
    text-align: center;
    background-color: #ddd;
    height: 100%;
    line-height: 58px;
    left: 0
}

.flmenubtn {
    position: fixed;
    bottom: 22px;
    right: 25px;
    width: 50px;
    height: 50px;
    z-index: 8;
    color: #fff;
    background-color: var(--secondary-color);
    border-radius: 100%;
    line-height: 50px;
    text-align: center;
    font-size: 10px;
    font-weight: bold;
    box-shadow: rgba(0, 0, 0, 0.11) 0 10px 20px, rgba(0, 0, 0, 0.11) 0 6px 6px;
    opacity: .95;
    display: none;
    transition: all .5s cubic-bezier(0.39, 0.1, 0, 1.15) 0s
}

.market .flmenubtn {
    width: auto;
    border-radius: 8px;
    padding-left: 15px;
    padding-right: 15px;
    height: 39px;
    line-height: 39px;
    bottom: 40px
}

.homePid .flmenubtn,
.orderdetails .flmenubtn,
.checkoutID .flmenubtn {
    transform: translateY(100px);
    transition: all .3s cubic-bezier(0.42, 0, 0.57, 1.24) 0s
}

.bigPrice.overbtn {
    display: none
}

.bigPrice.overbtn.sold-out {
    display: none !important
}

.menulogo {
    width: 100%;
    text-align: center;
    margin-bottom: 22px;
    margin-top: 21px
}

.menulogo .logo {
    height: 200px;
    width: 200px;
    position: relative;
    margin-bottom: 22px;
    text-align: center
}

.menulogo .logo img {
    max-width: 142px;
    height: auto;
    max-height: 170px
}

.menuhead {
    height: 71px;
    position: relative
}

.menuhead::after {
    content: "";
    position: absolute;
    bottom: -28px;
    left: 0;
    width: 100%;
    height: 28px;
    background: linear-gradient(#fff 0, rgba(255, 255, 255, 0) 100%);
    z-index: 1
}

.cordova .menuhead {
    /* height: 84px; */
    /* border-bottom: 1px solid #ddd; */
}

.menuqlinks {
    height: 85px;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    margin-bottom: 12px;
    background-color: #fafafa;
    font-size: 22px;
    display: flex;
}

.menuqlinks .text {
    height: 100%;
    text-transform: uppercase !important;
    font-size: 10px !important;
    font-weight: bold !important;
    padding: 0 !important;
    line-height: 114px !important;
    color: #666 !important
}

.menuqlinks .lineLink {
    width: 33%;
    position: relative;
    text-align: center;
    float: left;
    border: 0;
    padding: 0 !important
}

.menuqlinks i.zmdi {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 17px;
    color: #666;
    font-size: 24px;
}

.market .menuqlinks .zmdi-assignment-o:before {
    content: '\f543';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
}

.menuqlinks i.zmdi-star-outline {
    font-size: 27px;
    top: 15px;
}

.menuqlinks i.zmdi-replay {
    font-size: 28px;
    top: 16px;
}

.userainfo {
    bottom: 0;
    height: 70px;
    position: absolute;
    width: 100%;
    box-sizing: border-box;
    padding-left: 24px;
    line-height: 64px;
    border-top: 1px solid #eee;
    z-index: 3;
    background-color: #fff;
    overflow: hidden;
    white-space: nowrap
}

.userainfo::after {
    right: 16px;
    position: absolute;
    top: 24px;
    content: "\F2F8";
    font: 20px / 1 Material-Design-Iconic-Font;
    color: var(--primary-color);
    cursor: pointer
}

.notloggedin .userainfo::after {
    display: none;
}

.loggeduser .text {
    float: left;
    padding-left: 11px;
    font-size: 14px;
    width: 85%;
    margin-top: 2px
}

.rtl .loggeduser .text {
    line-height: 62px
}

.loggeduser .zmdi-account-circle {
    float: left;
    font-size: 28px;
    color: #333;
    margin-top: 20px
}

.usermenu {
    width: 100%;
    background-color: #fff;
    padding-top: 1px;
    position: absolute;
    bottom: 28px;
    z-index: 2;
    transform: translateY(150%);
    transition: all .5s ease-in-out 0s;
    border-top: 1px solid #eee;
    min-height: 231px
}

.usermenu.show {
    transform: translateY(0%);
    transition: all .5s ease-in-out 0s;
    box-shadow: rgba(0, 0, 0, 0.7) 0 6px 4px -4px
}

.menuhead .zmdi.zmdi-sort-amount-desc {
    position: absolute;
    left: 10px;
    top: 18px;
    font-size: 28px;
    color: #333;
    width: 66px;
    height: 44px
}

.cordova .menuhead .zmdi.zmdi-sort-amount-desc {
    /* top: 33px; */
}

.retail .menuhead .zmdi.zmdi-sort-amount-desc {
    top: 25px
}

.cordova.retail .menuhead .zmdi.zmdi-sort-amount-desc {
    top: 48px;
}

i.zmdi.zmdi-sort-amount-desc::after {
    position: absolute;
    content: "";
    inset: -24px 13px -24px -15px;
    width: 83px
}

.zmdi-arrow-left::before {
    content: "\F2FA"
}

.checkoutbag .clear-bag {
    position: relative
}

.retail .checkoutbag .clear-bag {
    display: none
}

.ssm-overlay {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.6);
    display: none;
    z-index: 10
}

#addressFormId .location {
    position: relative;
    top: 1px;
    left: 0;
    width: 200px
}

.googleMap .error {
    position: absolute;
    top: 0;
    height: 33px;
    background-color: rgba(202, 19, 103, 0.8);
    font-size: 12px;
    width: 100%;
    left: 0;
    line-height: 30px;
    display: none;
    overflow: hidden;
    color: #fff !important
}

.googleMap {
    background-color: #eee
}

.editableMap::after {
    content: "1";
    position: absolute;
    transform: translateX(-50%) translateY(-50%);
    top: 50%;
    left: 50%;
    width: 10px;
    height: 10px;
    background-color: #000;
    z-index: 2147483647;
    display: none
}

.checkoutbag .myBagModule {
    z-index: 0
}

.notloggedin .checkoutbag {
    padding-top: 11px;
    margin-bottom: -24px
}

.zmdi-dot-circle::before {
    content: "\F26E";
}

.newAddress.nonead.add {
    color: var(--primary-color);
    position: absolute;
    transform: translateX(-50%) translateY(-50%);
    left: 50%;
    top: 50%;
    text-align: center;
    background-color: #f6f6f6;
    width: 220px;
    display: none;
    font-size: 40px !important
}

.newAddress.nonead.add.loadinga {
    display: none
}

.newAddress.nonead.add.mafiad {
    z-index: 6;
    display: block;
}

.newAddress.nonead.add .text {
    font-size: 13px
}

.fixedModal.small .modal.show {
    opacity: 1;
    transform: translate3d(-50%, -50%, 0px) !important
}

.fixedModal.small .modal {
    left: 50%;
    border-radius: 0;
    position: fixed;
    opacity: 0;
    background-color: #fff;
    bottom: auto !important;
    width: 90% !important;
    transform: translate3d(-50%, 70%, 0px) !important;
    top: 50% !important;
    padding: 0 !important
}

.fixedModal.small .modal .btnClose {
    display: none
}

.fnb .modal.noCustomization {
    max-width: 600px !important
}

.fnb .modal.largetxt.noCustomization {
    max-width: 1000px !important
}

.fixedModal.small .modal .genBtn {
    border-radius: 0;
    width: 50%;
    float: left;
    margin: 0;
    height: 45px
}

.fixedModal.small.onebtn .modal .genBtn {
    width: 100%
}

.fixedModal.small .modal .btnWrap {
    bottom: 0;
    position: absolute;
    width: 100%
}

.fixedModal.small .modal .title {
    text-transform: capitalize;
    line-height: 23px;
    margin-top: 52px !important
}

.withTitle.oNbItems {
    font-weight: bold
}

.withTitle.oNbItems .titemsp {
    font-weight: normal;
    text-transform: lowercase
}

.rtl .withTitle.oNbItems .titemsp {
    margin-top: -11px
}

.orderdetails .box_delivery .boxTitle {
    display: none
}

.orderdetails .googleMap {
    width: 100px;
    height: 100px;
    margin-left: 20px;
    margin-top: 22px;
    border-radius: 100px;
    overflow: hidden
}

.orderdetails .location.editM {
    box-sizing: border-box;
    border-bottom: 0;
    /* position: absolute; */
    /* height: 126px; */
    padding: 30px;
    padding-top: 23px;
    padding-right: 23px;
}

.rtl .orderdetails .location.editM {
    padding-right: 22px;
    direction: rtl
}

.gm-style>div:first-child {
    z-index: unset !important
}

li.ot-prgress-status .stext {
    height: 31px;
    line-height: 31px;
    white-space: nowrap;
}

.orderdash {
    height: 104px;
    /* border-bottom: 5px solid #fafafa; */
    background-color: #f6f6f6;
    text-align: center;
    margin: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-evenly;
}

.cncld .orderdash {
    height: 104px !important;
}

.orderstat {
    width: 50%;
    /* border: 4px solid #fafafa; */
    padding: 16px;
    box-sizing: border-box;
    float: left;
    animation: .3s cubic-bezier(0.42, 0, 0.14, 0.93) .5s 1 normal both running fadeInUp2;
    background: #fff;
}

.noordertracking .orderstat {
    display: none
}

.orderdet {
    width: 50%;
    /* border: 4px solid #fafafa; */
    padding: 18px;
    box-sizing: border-box;
    float: left;
    /* height: 298px; */
    animation: .3s cubic-bezier(0.42, 0, 0.14, 0.93) .5s 1 normal both running fadeInUp2;
    background: #fff;
}

.orderdet {
    /* height: 1px; */
    /* overflow: hidden; */
}

.noordertracking .orderdet {
    width: 100%;
    height: 200px;
    padding-bottom: 0
}

.orderdetails .elt {
    height: 84%;
    width: 24%;
    text-align: center;
    padding-top: 13px;
    color: #999;
    position: relative;
    cursor: pointer;
    display: inline-block;
    vertical-align: top;
    animation: .3s cubic-bezier(0.42, 0, 0.14, 0.93) 1s 1 normal both running zoomout;
}

a.elt.closeit {
    display: none;
}

.elt.closeit a:before {
    margin-top: -3px;
    display: block;
}

.orderdetails .elt .zmdi {
    font-size: 50px;
    text-decoration: none;
    color: #ddd;
    transition: all .2s linear 0s
}

.orderdetails .elt .zmdi-edit {}

.orderdetails .orderPreference {
    width: 100%;
    height: 100%
}

.orderdetails .elt .circle {
    color: var(--primary-color);
    font-size: 18px;
    margin-top: -60px;
    margin-left: 24px;
    display: none
}

.orderdetails .elt .circle .zmdi {
    font-size: inherit
}

.orderdetails .elt .circle .text {
    font-size: 25px;
    font-family: inherit;
    color: #fff
}

.orderdetails .elt .text {
    font-size: 14px;
    position: absolute;
    left: 0;
    top: 24px;
    width: 100%;
    text-align: center;
    color: var(--primary-color);
    font-weight: bold;
    line-height: 22px
}

.rtl .orderdetails .elt .text {
    top: 31px;
}

.elt .ordragnbtn {
    font-size: 13px;
    margin-top: 7px;
}

.elt .ordragnbtn::before {
    position: absolute;
    width: 100px;
    height: 100px;
    top: -22px;
    left: 50%;
    content: "";
    margin-left: -50px
}

.elt .expln {
    font-size: 13px;
    margin-top: 7px;
}

.hissubtotal div {
    display: inline;
    /* margin-right: 7px; */
}

.hissubtotal {
    margin-bottom: 24px;
    text-align: center;
    line-height: 24px
}

.orderdetails .hissubtotal {
    line-height: 11px;
    font-size: 13px;
    opacity: 0.8;
}

.orderdetails .subLines {
    display: none
}

.sendchat {
    width: 50px;
    height: 50px;
    position: absolute;
    top: 6px;
    right: 9px;
    cursor: pointer
}

.rtl .sendchat {
    right: auto;
    transform: rotate(180deg)
}

.sendchat:hover::after {
    color: var(--primary-color)
}

.sendchat::after {
    right: 9px;
    position: absolute;
    top: 11px;
    content: "\F194";
    font: 28px / 1 Material-Design-Iconic-Font;
    color: var(--primary-color);
}

.orderdetails .withTitle.ordernum {
    margin-bottom: 8px;
    font-size: 28px !important;
    color: var(--secondary-color) !important;
    border-top: 0 !important
}

.orderdetails .addRemove .nb {
    display: none
}

.orderdetails .editMode .textLbl {
    text-align: right
}

.orderdetails .orders .order .withTitle {
    /* padding-right: 5px; */
    border-top: 1px dotted #dad9d9;
    font-size: 14px;
    padding-left: 0;
    color: #333;
    display: flex;
    padding-bottom: 7px;
    padding-top: 0px;
}

.orderdetails .orders .order .withTitle:not(.ordernum) {
    padding-top: 10px;
    padding-bottom: 10px;
}

.noordertracking .orderdetails .orders .order .withTitle {
    /* min-height: 39px; */
}

.orderdetails .box_instruction .title {
    margin-bottom: 12px;
    font-weight: bold;
    font-size: 14px;
    display: block;
    /* top: 17px !important; */
}

.orderdetails .textLbl {
    padding-bottom: 3px;
}

.checkoutID .myBagModule,
.orderdetails .myBagModule {
    display: block !important
}

.errorpopup .message {
    width: 85%;
    margin: -22px auto 9px
}

.rtl .errorpopup .message {
    direction: rtl;
}

.errorpopup.ebottom .button {
    width: 100% !important
}

.checkoutbag {
    text-align: center;
    z-index: 0;
    position: relative
}

.checkoutID .reviewBox .myBagModule {
    position: relative
}

.checkoutID .checkoutbag .myBagModule {
    top: 8px;
    left: 3px;
    text-align: left;
    visibility: visible
}

.addAddress.withEdit {
    z-index: 4;
}

.checkoutID .addAddress.withEdit {
    bottom: -3px;
    width: 100%;
    position: absolute !important
}

.zmdi-alert-circle::before {
    content: "\F1F0" !important
}

.coupons.remove .zmdi-check-circle {
    color: #35914e !important
}

.coupons.remove .zmdi-check-circle::before {
    content: "\f269";
    color: #35914e
}

.pending .zmdi-check-circle {
    color: #e6a01f !important
}

.recommendedItems .itemsList .itemGrid .priceWrap.inlisting {
    display: none
}

@media only screen and (min-width:320px) and (max-width:360px) {
    .recommendedItems .modal-container .itemsList .itemGrid:first-child {
        left: 0;
        /* margin-left: 4% !important; */
    }

    .myBagModule .itemBags .itemBag {
        max-width: 320px
    }
}

.editaccountp .box {
    height: auto;
    min-height: auto !important
}

#updateBasicInfoId .inputWrap.focusedfix {
    width: calc(50% - 2px);
    float: left;
    margin-right: 2px;
    box-sizing: border-box
}

.pemail {
    width: 100%;
    height: 45px;
    line-height: 45px;
    text-align: center;
    color: #999;
    font-size: 14px
}

.box.passedit .genBtn {
    bottom: -15px !important;
    font-size: 13px !important
}

.addAddressID {
    display: block
}

img.headbackimg {
    width: calc(100vw - 600px);
}

.hide-bag img.headbackimg {}

img {
    animation: 1s ease-in-out 0s 1 normal none running fadeIn
}

.layout5 img {
    width: 100%;
}

.lwr5 .view-more {
    left: 50%;
    right: auto !important;
    transform: translateX(-50%);
    bottom: 32px;
    top: auto !important;
    min-width: 142px !Important;
    height: 35px !important;
    line-height: 35px !important;
    font-weight: bold;
    opacity: 0.9;
}

.lwr5 .view-more span {
    font-size: 15px;
}

.lwr5 .ltitle {
    display: none;
}

.layout3 .collimg {
    width: 100%;
    margin-bottom: 9px
}

.pages img.headbackimg {
    height: auto
}

@media(max-width:768px) {
    .fnb div#customizedModalID:after{
        margin-bottom:-30px
    }
    .notloggedin .box_date.pickordel.ng-scope {
    display: none;
}
    .pages .image {
        min-height: auto !important
    }
}

img.innerbagimg {
    width: 100%;
    height: auto;
    /* min-height: 40px; */
    cursor: pointer;
    /* position: absolute; */
    /* top: 50%; */
    /* transform: translateY(-50%); */
    /* position: absolute; */
    /* right: 0px; */
    border-radius: 5px;
    /* border: 1px solid #eee; */
    float: right;
}

.market img.innerbagimg {
    width: auto;
    /* margin: auto; */
    /* position: absolute; */
    /* transform: translateX(-50%) translateY(-50%); */
    /* left: 50%; */
    /* top: 50%; */
    /* cursor: pointer; */
    height: 100% !important;
}

.orderdetails .genBtn.greyBtn .timing {
    /* display: none !important; */
    position: absolute;
    left: 50%;
    display: inline-block;
    margin-left: 28px;
    top: 0px;
    transform: translatex(-50%);
}

.box.default .defaultBtn {
    display: none !important
}

@media(max-width: 1300px) and (min-width: 769px) {
    body {
        visibility: visible
    }

.market .hot-line {
    display: none!important;
}

    .multibranch .filter.normal {
        width: calc(100% - 22px);
    }

    .retail:has(.exist) div#customizedModalID {
        transform: translate3d(-50%, -50%, 0px) !important;
        opacity: 1 !important
    }

    .retail:has(.exist) .backgroundModal {
        opacity: 0.6;
    }

    .right.rBox .loginor {
        display: block !important;
        margin-top: -43px !important;
        padding-bottom: 26px;
    }

    .box_instruction.paymentMethods {
        background-color: transparent;
        border-top: 0px;
    }

    .fnb .customizedID .cont {
        /* max-height: 685px; */
    }

    .box_instruction .hosted-payment-wrapper::before {
        margin-left: 4px;
    }

    .box_instruction .input.saved-card {
        background-color: transparent !important;
    }

    .box_instruction.hosted-session {
        background-color: transparent !important;
    }

    .homePid .itemsList .itemGrid {
        margin-left: 0px !important;
    }

    .reviewbagbut {
        display: none !Important
    }

    .delivery-date {
        padding-top: 10px !important
    }

    .reviewBox .rBox .wrap {
        width: 100%
    }

    div#offerId {
        width: 768px
    }

    .retail .checkoutID .content {
        padding-right: 0
    }

    .bagScroll.autoMode {
        padding-bottom: 9px;
        background-color: transparent;
        margin-left: -6px
    }

    .notloggedin .reviewBox .rBox .wrap:first-child {
        background-color: transparent;
        border: 0;
        padding: 2px;
        box-shadow: none;
        width: 100%
    }

    .reviewBox .rBox {
        width: 100% !important;
        /* background-color: transparent !important; */
    }

    .reviewBox .rBox {
        width: 100%
    }

    .notloggedin .reviewBox .left.rBox {
        float: left;
        top: 0;
        width: calc(100%) !important;
        margin-bottom: 62px !important
    }

    .applinks li {
        display: none
    }

    .market .itemsList .itemGrid {
        margin-right: 0;
        /* width: calc(33% - 62px) !important; */
    }

    .footer {
        width: 100%
    }

    .orderdetails .box_feedback .feed {
        width: calc(100% - 337px);
        transform: none;
        right: 27px;
        left: auto
    }

    .homeFilter {
        left: 306px;
        transform: none;
        width: 425px !important;
        border: 0px !important;
        min-width: 349px !Important;
    }

    .homeFilter .filter .zmdi {
        /* left: -22px!Important; */
        font-size: 19px;
    }

    .retail .homeFilter.ontop {
        position: absolute;
        left: 50%;
        right: auto;
        transform: translate(-50%);
        min-width: 360px;
    }

    .rtl .homeFilter {
        left: 250px;
        right: auto;
        width: calc(100% - 545px)
    }

    .MenuParts .callUsNb {
        /* overflow: hidden; */
        /* width: 50px; */
        /* display: none !important; */
        /* padding-right: 0 !important; */
    }

    .swiper-container.main-swiper {
        width: calc(100%);
        right: 0;
        left: auto;
        transform: none
    }

    .rtl .swiper-container.main-swiper {
        margin-right: 0;
        margin-left: 0
    }

    .swiper-container.pages-swiper {
        width: 100%;
        right: 0;
        left: auto;
        transform: none;
        margin-right: 13px
    }

    img.headbackimg {
        width: 100%;
    }

    .applinks {
        display: none
    }

    .swiper-container.main-swiper {
        margin-left: auto
    }

    .swiper-container.pages-swiper {
        margin-left: auto
    }

    .userbar {
        width: calc(100% - 302px) !important;
        right: 0;
        left: auto !important;
        transform: none !important;
    }

    .rtl .userbar {
        right: auto;
        left: 0
    }

    .content,
    .contentb {
        width: calc(100% - 308px);
        /* margin-right: 0; */
        /* overflow: hidden; */
    }

    .subPage .content {
        width: calc(100% - 306px) !important;
    }

    .subPage.checkoutID .content {
        padding-right: 36px !important;
    }

    .reachPID {
        width: calc(100% - 305px);
    }

    .rtl .content,
    .rtl .contentb {
        margin-right: auto
    }

    .myBagModule.stick {
        display: none
    }

    .bagph {
        display: none
    }

    .orderstt {
        margin-left: -72px !important;
    }

    .menuontop .bagph {
        display: block
    }
}

@media only screen and (min-device-width:1024px) and (max-device-width:1366px) and (-webkit-min-device-pixel-ratio:2) and (orientation:portrait) {
    .market .itemsList .itemGrid {
        margin-right: 0
    }
}

@media only screen and (-webkit-min-device-pixel-ratio:2) and (max-device-width:1366px) and (min-device-width:1024px) and (orientation:landscape) {
    .market .itemsList .itemGrid {
        width: calc(21vw - 34px) !important;
        margin-right: 0
    }
}

.orderdetails .elt:hover .zmdi {
    color: var(--primary-color)
}

.partReceipt {
    display: none
}

.errorpopup .countrieslist {
    font-family: inherit;
    max-height: 494px;
    overflow: auto;
    padding-bottom: 7px;
}

.errorpopup .currencieslist li,
.errorpopup .countrieslist li.thecountry,
.errorpopup .languagesList li.language {
    list-style: none;
    height: 50px;
    box-sizing: border-box;
    line-height: 48px;
    text-align: left;
    padding-left: 48px;
    border-top: 0 solid #ddd;
    margin: 0;
    cursor: pointer;
    position: relative
}

.errorpopup .languagesList li.language::before {
    content: "\F185";
    font-family: Material-Design-Iconic-Font;
    color: #747474;
    font-size: 24px;
    display: block;
    margin-bottom: 18px;
    position: absolute;
    left: 11px;
    top: 0
}

.errorpopup .languagesList li.language {
    font-weight: bold;
    color: #777;
    font-family: inherit;
    cursor: pointer;
    margin-bottom: -2px
}

.errorpopup .languagesList li.language:last-child {
    /* margin-bottom: -7px; */
}

.errorpopup .currencieslist li:hover,
.errorpopup .countrieslist li.thecountry:hover {
    background-color: #f4f3f3
}

.errorpopup .currencieslist li.selected,
.errorpopup .countrieslist li.thecountry.selected {
    color: var(--primary-color);
    font-weight: bold;
    line-height: 49px
}

.errorpopup .countrieslist li {
    font-size: 14px;
    font-family: inherit
}

.errorpopup .countrieslist .langs li {
    list-style: none
}

.errorpopup .countrieslist li #flag {
    left: 14px;
    top: 19px
}

.errorpopup .countrieslist .langs {
    float: right;
    margin-right: 8px
}

.errorpopup .countrieslist .langs div {
    min-width: 32px;
    border: 1px solid #e4e3e3;
    height: 32px;
    display: inline-block;
    box-sizing: border-box;
    line-height: 32px;
    text-align: center;
    color: #666;
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
    cursor: pointer
}

.errorpopup .countrieslist .langs div.selected {
    background-color: var(--primary-color);
    color: #fff;
    font-weight: bold;
    border-color: #333
}

div#countryDetector .title {
    font-weight: bold;
    padding-top: 32px;
    color: var(--primary-color);
    font-size: 17px
}

div#countryDetector .sub-title {
    padding: 8px
}

.countryswitcher .iti__flag {
    cursor: pointer;
    margin: auto;
    margin-top: -1px;
}

.menuhead .iti__flag {
    margin-top: 0px;
}

.countryswitcher.inmenu.multibrands .iti__flag {
    background-image: none;
    background-color: transparent;
    border: 0px !Important;
    width: auto !Important;
    box-shadow: none;
    line-height: 11px;
}

.menuhead .iti__flag.multibrands:before {}

.inmenu.multibrands span {
    font-size: 13px;
    font-family: inherit;
    color: #666;
    white-space: nowrap;
    position: relative;
    font-weight: bold;
}

.countryswitcher .iti__flag::before {
    content: "";
    position: absolute;
    height: 60px;
    width: 40px;
    top: -25px;
    left: -9px;
    z-index: 1
}

.swiper-container1.swiper-container-vertical1 {
    display: block
}

.resultwrapper {
    margin: auto;
    font-family: Arial, helvetica, sans-serif;
    font-size: 15px;
    text-align: center
}

.resultwrapper svg {
    width: 100px;
    display: block;
    margin: 40px auto 0
}

.resultwrapper .path {
    stroke-dasharray: 1000;
    stroke-dashoffset: 0
}

.resultwrapper .animate .path.circle {
    animation: .9s ease-in-out 0s 1 normal none running dash
}

.resultwrapper .animate .path.line {
    stroke-dashoffset: 1000;
    animation: .9s ease-in-out .35s 1 normal forwards running dash
}

.resultwrapper .animate .path.check {
    stroke-dashoffset: -100;
    animation: .9s ease-in-out .35s 1 normal forwards running dash-check
}

.resultwrapper p {
    text-align: center;
    font-size: 1.25em
}

.resultwrapper .path.circle.load {
    animation: .9s ease-in-out 0s infinite normal none running dash
}

.resultwrapper p.success {
    color: #73af55
}

.resultwrapper p.error {
    color: #d06079
}

.resultwrapper p.verify {
    color: #666
}

@-webkit-keyframes dash {
    0% {
        stroke-dashoffset: 1000
    }

    100% {
        stroke-dashoffset: 0
    }
}

@keyframes dash {
    0% {
        stroke-dashoffset: 1000
    }

    100% {
        stroke-dashoffset: 0
    }
}

@-webkit-keyframes dash-check {
    0% {
        stroke-dashoffset: -100
    }

    100% {
        stroke-dashoffset: 900
    }
}

@keyframes dash-check {
    0% {
        stroke-dashoffset: -100
    }

    100% {
        stroke-dashoffset: 900
    }
}

.resultwrapper .success,
.fail {
    display: none
}

.resultwrapper .result {
    position: relative
}

.resultwrapper {
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    width: 300px;
    height: 300px;
    position: absolute
}

.resultwrapper .pcard {
    position: absolute;
    top: -10px;
    left: 50%;
    margin-left: -20px
}

.resultwrapper .retrybut {
    background-color: transparent;
    width: 162px;
    height: 28px;
    border-color: #ccc #ccc #d06079;
    border-width: 1px;
    border-radius: 4px;
    border-style: solid;
    font-family: Roboto, sans-serif, Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #777;
    display: block;
    margin: auto;
    text-decoration: none;
    text-transform: uppercase;
    line-height: 27px;
    font-weight: bold
}

.text-countdown {
    width: auto;
    font-size: 12px;
    color: #999;
    position: absolute;
    z-index: 7;
    top: 7px;
    right: 22px
}

.createAccountID .text-countdown {
    top: 45px;
    right: 10px
}

#updateContactInfoId .text-countdown {
    right: 75px
}

.pc-selector {
    width: 100%;
    background-color: #f6f6f6;
    border-top: 2px solid var(--primary-color);
    position: relative;
    min-height: 90px;
    margin-top: 28px
}

.ps-icon {
    position: absolute;
    right: 20px;
    top: 14px
}

.ps-icon img {
    width: 60px;
    height: auto
}

.pc-selector .activator {
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    left: 17px;
    height: 22px
}

.pc-selector .activator .input {
    cursor: pointer;
}

.pc-selector .activator .label {
    margin-left: 30px;
    color: #666;
    font-size: 17px;
    margin-top: 1px;
}

.pc-selector .activator .check .zmdi {
    font-size: 24px;
    margin-top: -2px
}

.oc-selector {
    margin-top: 3px;
    background-color: #dbd8d8;
    box-sizing: border-box;
    position: relative;
    height: 0;
    overflow: hidden;
    transition: all .3s linear 0s
}

.pc-wrapper.active .oc-selector {
    height: 326px;
    transition: all .3s linear 0s
}

.oc-title {
    font-family: roboto, sans-serif;
    font-size: 14px;
    color: #666;
    margin-bottom: 21px;
    display: none
}

.pc-wrapper {
    font-family: 'titlefont';
}

.oc-cards li .oc-icon {
    background-color: #ddd;
    border-radius: 100%;
    width: 40px;
    height: 40px;
    text-align: center;
    float: left
}

.oc-cards li .oc-icon img {
    width: 27px;
    height: 25px;
    margin-top: 7px;
    transition: all .3s linear 0s
}

.oc-cards li.selected .oc-icon {
    background-color: var(--primary-color);
}

.oc-cards li.selected .oc-icon img {
    filter: brightness(0) invert(1);
    transition: all .3s linear 0s
}

.oc-cards li {
    list-style: none;
    height: 57px;
    font-size: 14px;
    color: #666;
    cursor: pointer
}

.oc-cards li:hover {
    color: #333
}

.oc-label {
    margin-left: 50px;
    line-height: 41px;
}

.oc-preview {
    position: absolute;
    right: 11px;
    top: 30px;
    width: 283px;
    background-color: #dbd8d8;
    height: 93%
}

.oc-preview img {
    height: auto
}

.oc-scroll {
    height: 300px;
    overflow: visible auto;
    width: 197px;
    position: absolute;
    top: 11px;
    left: 12px
}

.oc-scroll::-webkit-scrollbar {
    width: 10px
}

.lwr::-webkit-scrollbar-thumb,
.oc-scroll::-webkit-scrollbar-thumb {
    opacity: .1;
    background: rgba(0, 0, 0, 0.1)
}

.lwr::-webkit-scrollbar,
.offerslist::-webkit-scrollbar {
    height: 5px
}

.lwr::-webkit-scrollbar,
.offerslist::-webkit-scrollbar-track {
    height: 5px
}

.offerslist::-webkit-scrollbar-thumb {
    opacity: .3;
    background: rgba(0, 0, 0, 0.1);
    border-radius: 5px
}

.inputWrap.ocfrom {
    width: 50%;
    float: left
}

.inputWrap.ocfrom .input,
.inputWrap.octo .input {
    width: 99%
}

.inputWrap.octo {
    width: 50%;
    float: left
}

.inputWrap.textarea.ocmsg {
    display: table;
    width: 100%;
    float: none
}

.inputWrap.textarea.ocmsg .input {
    width: 100%
}

.oc-message {
    height: 0;
    overflow: hidden;
    transition: all .3s linear 0s
}

.pc-wrapper.active .oc-message {
    height: 150px;
    transition: all .3s linear 0s
}

.swiper-container.pc-cards {
    width: 100%;
    height: 100%;
    overflow: hidden !important;
}

.swiper-container.pc-cards .swiper-slide {
    width: 100%;
    position: relative
}

.pc-card {
    width: 100%;
    transform: translateX(-50%) translateY(-50%);
    top: 50%;
    left: 50%;
    position: absolute;
    text-align: center;
    height: 92%;
    z-index: 1
}

.pc-card::before {
    content: "";
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    margin-left: -10px;
    border-radius: 50%;
    animation: 1s linear 0s infinite normal none running spinner;
    border-width: 2px;
    border-style: solid;
    border-color: #ccc rgba(255, 255, 255, 0.21) rgba(255, 255, 255, 0.21);
    border-image: initial;
    z-index: -1;
}

.swiper-slide-active .pc-card::after {
    content: "\F26A";
    box-sizing: border-box;
    position: absolute;
    bottom: 67px;
    left: 50%;
    margin-top: -10px;
    margin-left: -13px;
    animation: 1s cubic-bezier(1, 0.07, 0.29, 0.92) 0s 1 normal none running zoomOut;
    z-index: 2;
    color: #fff;
    font: 40px / 1 Material-Design-Iconic-Font;
    text-shadow: rgba(0, 0, 0, 0.1) 0 3px 6px, rgba(0, 0, 0, 0.1) 0 3px 6px
}

@-webkit-keyframes zoomOut {
    0% {
        opacity: 0;
        transform: scale3d(1.8, 1.8, 8.8)
    }

    90% {
        opacity: 1
    }
}

@keyframes zoomOut {
    0% {
        opacity: 0;
        transform: scale3d(1.8, 1.8, 8.8)
    }

    90% {
        opacity: 1
    }
}

.swiper-pagination-pc {
    bottom: 21px;
    position: absolute;
    z-index: 2;
    width: 100%;
    text-align: center
}

.oc-preview .swiper-pagination-bullet {
    margin-left: 3px;
    margin-right: 3px
}

.oc-preview .swiper-pagination-bullet-active {
    background: #fff
}

.card-details-container {
    position: absolute;
    top: 0;
    z-index: 55;
    background-color: #eee;
    height: 100%;
    transform: translateY(100%);
    transition: all .3s linear 0s
}

.card-details-container.show {
    position: absolute;
    top: 0;
    z-index: 55;
    background-color: #eee;
    height: 100%;
    transform: translateY(0px);
    transition: all .3s linear 0s
}

.payment-container .payment-notice {
    font-size: 14px;
    color: #777;
    text-align: center
}

.payment-container .payment-notice .notice-text {
    margin-right: 5px
}

.payment-container .payment-swiper {
    padding-top: 24px;
    padding-bottom: 9px;
    height: 220px;
    position: relative;
    margin: auto;
    width: 328px;
    overflow: hidden !important
}

.payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card {
    background-image: -webkit-linear-gradient(-90deg, #979ba2 0, #808288 100%);
    width: 315px;
    height: 157px;
    border-radius: 3% / 6%;
    box-shadow: rgba(0, 0, 0, 0.18) 0 0 8px 2px;
    margin: auto;
    position: relative
}

.payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card .card-delete {
    border-radius: 50%;
    background-color: #82848b;
    position: absolute;
    top: 18px;
    left: 13px;
    width: 36px;
    height: 36px
}

.payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card .card-delete .fa {
    position: absolute;
    inset: 0;
    margin: auto;
    width: 14px;
    height: 20px;
    font-size: 17px;
    line-height: 120%;
    color: #fff
}

.payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card .card-provider {
    width: 76px;
    height: 49px;
    position: absolute;
    right: 25px;
    top: 15px
}

.payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card .card-provider .card-provider-img {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card .card-number {
    font-family: Roboto, sans-serif, Arial, Helvetica, sans-serif;
    font-size: 18px;
    line-height: 120%;
    color: #fff;
    text-align: left;
    position: absolute;
    left: 20px;
    bottom: 28px
}

.payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card .card-validity {
    position: absolute;
    right: 25px;
    bottom: 21px
}

.payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card .card-validity .validity-label {
    font-family: Roboto, sans-serif, Arial, Helvetica, sans-serif;
    font-size: 10px;
    line-height: 120%;
    color: rgba(255, 255, 255, 0.33);
    text-align: left;
    width: 31px;
    height: 28px;
    margin-right: 6px;
    float: left
}

.payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card .card-validity .validity-value {
    font-family: Roboto, sans-serif, Arial, Helvetica, sans-serif;
    font-size: 18px;
    line-height: 120%;
    color: #fff;
    text-align: left;
    float: left
}

.payment-container .payment-swiper .swiper-pagination .swiper-pagination-bullet {
    background-color: transparent;
    border-color: #ccc;
    border-width: 1px;
    border-style: solid;
    opacity: 1;
    width: 33px;
    border-radius: 3px;
    height: 16px;
    display: inline-block;
    margin-right: 8px;
    cursor: pointer
}

.payment-container .payment-swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: #888;
    border-color: transparent
}

.payment-container .payment-amount {
    font-size: 24px;
    color: #666;
    text-align: center;
    margin-bottom: 19px;
    margin-top: -11px
}

.payment-container .payment-action button,
.payment-container .payment-action input {
    appearance: none;
    border: 0 none;
    background-color: transparent
}

.payment-container .payment-action .saved-payment {
    height: 48px;
    width: 100%;
    margin-bottom: 21px
}

.payment-container .payment-action .saved-payment .payment-csc {
    background-color: #eee;
    width: 85px;
    height: 48px;
    border-radius: 10px;
    float: left
}

.payment-container .payment-action .saved-payment .payment-csc input {
    width: 100%;
    height: 100%;
    border-radius: 10px;
    padding-left: 26px;
    padding-right: 18px
}

.payment-container .payment-action .saved-payment .payment-csc input::-webkit-input-placeholder {
    font-family: Roboto, sans-serif, Arial, Helvetica;
    font-size: 13px;
    line-height: 120%;
    font-style: italic;
    color: #777;
    text-align: left
}

.payment-container .payment-action .saved-payment .payment-pay {
    background-color: var(--primary-color);
    width: 328px;
    height: 48px;
    border-radius: 7px;
    position: relative;
    margin: auto;
    cursor: pointer
}

.payment-container .payment-action .saved-payment .payment-pay.disabled-payment,
.payment-container .payment-action .saved-payment .payment-pay.paying {
    background-color: #ccc
}

.payment-container .payment-action .saved-payment .payment-pay.disabled-payment .payment-disabled-layer,
.payment-container .payment-action .saved-payment .payment-pay.paying .payment-disabled-layer {
    display: block
}

.payment-container .payment-action .saved-payment .payment-pay.paying .payment-button .btn-text {
    display: none
}

.payment-container .payment-action .saved-payment .payment-pay.paying .payment-button .spinner {
    display: block
}

.payment-container .payment-action .saved-payment .payment-pay .payment-disabled-layer {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: none
}

.payment-container .payment-action .saved-payment .payment-pay .payment-button {
    font-family: Roboto, sans-serif, Arial, Helvetica, sans-serif;
    font-size: 17px;
    font-weight: bold;
    line-height: 48px;
    color: #fff;
    width: 328px;
    height: 100%;
    text-align: center;
    cursor: pointer;
    margin: auto
}

.payment-container .payment-action .saved-payment .payment-pay .payment-button .spinner {
    height: 43px;
    width: 100%;
    display: none;
    position: relative
}

.payment-container .payment-action .saved-payment .payment-pay .payment-button .spinner::before {
    content: "";
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    margin-left: -10px;
    border-radius: 50%;
    animation: 1s linear 0s infinite normal none running spinner;
    border-width: 2px;
    border-style: solid;
    border-color: #ccc #87be47 #87be47;
    border-image: initial
}

.payment-container .payment-action .alternative-payment {
    margin-bottom: 19px;
    text-align: center;
    position: relative
}

.payment-container .payment-action .alternative-payment::before,
.payment-container .payment-action .alternative-payment::after {
    width: calc((100% - 47px) / 2);
    height: 1px;
    position: absolute;
    background-color: #eee;
    top: 0;
    bottom: 0;
    margin: auto
}

.payment-container .payment-action .alternative-payment::before {
    left: 0
}

.payment-container .payment-action .alternative-payment::after {
    right: 0
}

.payment-container .payment-action .new-payment {
    margin-bottom: 22px;
    cursor: pointer
}

.payment-container .payment-action .new-payment .payment-button {
    background-color: transparent;
    width: 162px;
    height: 28px;
    border-color: #ccc;
    border-width: 1px;
    border-radius: 4px;
    border-style: solid;
    font-family: Roboto, sans-serif, Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #777;
    display: block;
    margin: auto;
    cursor: pointer;
    text-align: center
}

.payment-container .payment-cancel {
    display: none
}

@media(max-width:360px) {
    .payment-container .payment-swiper .swiper-wrapper .credit-card {
        width: 290px;
        height: 143px
    }

    .payment-container .payment-swiper .swiper-wrapper .credit-card .card-delete,
    .payment-container .payment-swiper .swiper-wrapper .credit-card .card-number {
        left: 10px
    }

    .payment-container .payment-swiper .swiper-wrapper .credit-card .card-provider,
    .payment-container .payment-swiper .swiper-wrapper .credit-card .card-validity {
        right: 10px
    }

    .payment-container .payment-swiper .swiper-wrapper .credit-card .card-number {
        font-size: 17px
    }

    .payment-container .payment-swiper .swiper-wrapper .credit-card .card-validity .validity-value {
        font-size: 17px
    }

    .payment-container .payment-amount {
        font-size: 20px;
        margin-bottom: 15px
    }

    .payment-container .payment-action .saved-payment,
    .payment-container .payment-action .new-payment {
        margin-bottom: 15px
    }
}

@keyframes spinner {
    100% {
        transform: rotate(360deg)
    }
}

body.validateable .container.pay .inline-middle.merchantName>h3 {
    display: none
}

body.validateable .container.pay .btn.btn-success {
    background-color: #000;
    border-color: #000
}

body.validateable .container.pay .btn.btn-success[data-hppverifybutton] {
    display: none
}

body.validateable .container.pay .btn.cancelButton {
    border-color: #b5b5b5;
    color: #b5b5b5
}

@media(min-width:1600px) {
    .itemsList .itemGrid {
        /* width: calc(33% - 15px); */
    }

    .retail.menuontop .homePid .itemsList .products-listing:not(.swiper-wrapper) .itemGrid {
        /* width: calc(15% - 15px) !important; */
    }

    .menuontop .checkoutID .content {
        width: calc(100% - 333px);
        margin-right: auto;
        margin-left: auto;
        margin-bottom: -26px;
        margin-top: 31px !important;
    }

    .menuontop .searchopen .content {
        padding-top: 85px;
        min-height: calc(100vh - 185px)
    }
}

@media(min-width:769px) {
    .market .newsCtrl .itemsList .itemGrid {
        margin-right: 13px;
        /* width: calc(50% - 15px) !important; */
        /* float: left; */
        border-radius: 9px;
        overflow: hidden;
    }
}

.card-delete .zmdi {
    font-size: 17px;
    margin-left: 13px;
    margin-top: 9px;
    color: #ddd
}

.add-card-title {
    font-size: 15px;
    text-transform: uppercase;
    font-family: roboto, sans-serif;
    font-weight: bold;
    color: #87be47;
    text-align: center;
    height: 50px;
    line-height: 50px
}

.add-card-close {
    font-size: 29px;
    position: absolute;
    top: 10px;
    right: 16px;
    color: #999
}

.wpwl-button-pay {
    background-color: #000
}

.wpwl-brand-VISA {
    background-color: #000
}

.wpwl-group-cardNumber {
    width: 100% !important;
    padding-right: 0 !important
}

.wpwl-form-card {
    border-radius: 0;
    box-shadow: none;
    background: #ddd;
    position: relative
}

.wpwl-group-expiry {
    border-right: 2px solid #ddd;
    width: 60% !important
}

.wpwl-group {
    margin-bottom: 16px
}

.wpwl-group-cvv {
    width: 40%
}

.wpwl-group-brand {
    top: 148px;
    position: absolute;
    z-index: 1;
    right: 50px;
    zoom: .5;
    width: 89px
}

.wpwl-brand-MASTER {
    margin-top: -7px
}

.wpwl-control {
    font-family: Helvetica, Arial, sans-serif;
    color: #444;
    font-size: 13px;
    height: 35px;
    border-width: 0 0 1px;
    border-top-style: initial;
    border-right-style: initial;
    border-left-style: initial;
    border-top-color: initial;
    border-right-color: initial;
    border-left-color: initial;
    border-image: initial;
    border-bottom-style: solid;
    border-bottom-color: #ccc;
    border-radius: 0;
    padding-left: 9px
}

.wpwl-has-error+.wpwl-hint,
.wpwl-has-error+.wpwl-hint+.wpwl-hint,
.wpwl-has-error+input+.wpwl-hint {
    font-family: Helvetica, Arial, sans-serif;
    color: #c04108;
    position: absolute;
    right: 7px;
    top: -13px;
    font-size: 10px;
    z-index: 1;
    background-color: #fff;
    padding: 2px 5px;
    border-width: 1px;
    border-style: solid;
    border-color: #e4e4e4 #e4e4e4 #d87e7e;
    border-image: initial;
    border-radius: 4px;
    text-transform: uppercase;
    box-shadow: rgba(0, 0, 0, 0.03) 0 -1px 3px, rgba(0, 0, 0, 0.04) 0 3px 2px;
    opacity: .8
}

.wpwl-button-pay {
    width: 100%;
    margin-top: 3px;
    background-color: #81b739;
    border: 0;
    font-family: Helvetica, Arial, sans-serif;
    font-weight: bold;
    height: 48px;
    font-size: 17px;
    text-transform: uppercase
}

.wpwl-group-cardHolder {
    width: 100%;
    padding-right: 0
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    background: transparent
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    border: 1px solid #fff
}

.ui-state-default:hover {
    border: 1px solid var(--primary-color)
}

.wpwl-popover {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 11px;
    width: 88px;
    right: 0;
    left: auto
}

.wpwl-popover-content {
    display: none
}

.wpwl-form-card {
    border-radius: 0;
    box-shadow: none;
    background: 0 center;
    position: relative;
    border: 0
}

.wpwl-container-registration {
    display: none !important
}

.hide {
    display: none
}

.mpgsPaymentPopUpModel {
    height: 100%
}

.mpgsPaymentContainer {
    width: 77% !important
}

@media(max-width:768px) {
    .mpgsPaymentContainer {
        width: 100% !important
    }
}

.payment-container {
    background-color: #fff;
    padding: 32px 32px 36px;
    border-radius: 6px
}

.payment-container .swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative
}

.payment-container .swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    box-sizing: content-box
}

.modalParent.modal-parent-checkout {
    position: fixed;
    inset: 0;
    z-index: 900;
    opacity: 0;
    visibility: hidden;
    transition: transform .3s ease 0s, opacity .3s ease 0s, visibility .3s ease 0s, -webkit-transform .3s ease 0s
}

.modalParent.modal-parent-checkout.is-visible {
    opacity: 1;
    visibility: visible
}

.modalParent.modal-parent-checkout .modal-overlay {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(25, 25, 25, 0.8)
}

.modalParent.modal-parent-checkout {
    z-index: 10;
    transition-delay: 350ms;
    pointer-events: unset !important
}

.modalParent.modal-parent-checkout .modal-container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, 200%, 0px);
    transition: transform .4s ease 0s;
    margin: auto;
    min-width: 375px;
    max-width: 400px;
    padding-top: 80px !important
}

.modalParent.modal-parent-checkout.is-visible {
    transition-delay: 0s
}

.modalParent.modal-parent-checkout.is-visible .modal-container {
    transform: translate3d(-50%, -50%, 0px);
    transition-delay: .4s
}

.modalParent.modal-parent-checkout .modal-separator {
    position: relative;
    height: 2px;
    margin: 0 auto;
    width: 77% !important
}

.modalParent.modal-parent-checkout .payment-notice {
    margin-top: 12px;
    margin-bottom: 7px
}

.modalParent.modal-parent-checkout .mainTitle {
    position: relative;
    font-family: inherit;
    font-size: 20px;
    color: #4d4d4c;
    text-align: center;
    font-weight: bold
}

@media(max-width:768px) {
    .modalParent.modal-parent-checkout.is-visible .modal-container {
        height: calc(100vh - 80px);
        top: 0;
        transform: translate3d(-50%, 0%, 0px);
        overflow: scroll
    }

    .oc-cards li.selected {
        position: absolute;
        z-index: 55;
        bottom: 38px;
        width: 100%;
        top: auto;
        display: block !important;
        height: 30px;
    }

    .oc-cards li.selected .oc-label {
        color: #555;
        margin-left: 0;
        /* text-align: center; */
        position: relative;
        display: block;
        text-align: center;
    }

    .oc-cards li {
        display: none
    }

    .oc-cards li .oc-icon {
        display: none
    }
}

@media(max-width:900px) and min-width:769px) {
    body.checkoutID.subPage .content {
        padding-top: 2px;
        transform: none !important
    }
}

.oc-preview img {
    object-fit: contain;
    transform: translateY(-50%);
    margin-top: calc(50% - 37px);
    height: 86%;
    width: 86%;
}

.allCoupons {
    height: auto;
    min-height: 47px;
    margin-top: 22px;
    border-radius: 9px;
}

.allCoupons .offerslist {
    height: auto
}

.checkoutID .allCoupons .offerslist {
    text-align: center;
    padding-bottom: 0
}

.allCoupons .aoffer {
    width: 100%;
    margin: 0 !important
}

.invalidPassword {
    width: 87%;
    float: right;
    bottom: 39px !important;
    left: 115px !important
}

.fixedBody {
    position: fixed
}

iframe[title="Hosted Checkout"] {
    background-color: rgba(0, 0, 0, 0.25) !important
}

.errorCustomization {
    display: none;
    color: #fff;
    background-color: rgba(255, 0, 0, 0.73);
    width: 100vw;
    position: fixed;
    left: 0;
    bottom: 58px;
    font-size: 12px;
    padding: 8px;
    text-align: center;
    z-index: 999;
    pointer-events: none
}

.active {
    display: block !important
}

.rtl .wrap .wrapCustom {
    transform: translate3d(0px, 0px, 0px)
}

.location.is_stuck {
    transform: translateY(114px);
    left: 0;
    height: 107px;
    z-index: 1;
    transition: all .2s linear 0s;
    width: 100vw !important
}

.column_cust.hide-product-options .lines .line:last-child {
    border: 0 !important
}

.pbody {
    /* max-width: 2000px; */
    /* float: left; */
}

.pheadline {
    width: 20%;
    float: left;
}

.box_delivery .googleMap img {
    width: 100%;
    margin: 0
}

.market .itemsList .itemGrid {
    /* max-width: 280px; */
    /* min-width: 224px; */
    /* justify-self: start; */
    width: 100%;
    display: grid;
    align-content: space-between;
}

.market .layout1 .itemsList .itemGrid {
    /* width: 29%; */
    /* height: auto; */
    /* margin-right: 1px !important; */
    /* min-width: auto; */
    max-width: 188px;
    height: auto;
    margin-bottom: 0px;
}

.market .itemsList .itemGrid.not-available {
    pointer-events: none
}

@media(min-width: 769px) {
    body {
        visibility: visible
    }

.challenge-item {
    max-width: 350px;
    border: 1px solid #86868669;
    background: #f2f2f2;
    border-bottom: 2px solid #a29e9e;
}

.challenges-listing {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
}

.cb-current-location .order-methods .order-method-wrap .fa-regular:before {
    left: 12px!important;
}

.cb-current-location .order-methods .order-method-wrap {
    border: 2px solid #eee;
    padding: 20px;
    padding-left: 35px!important;
    border-radius: 4px;
    min-width: 70px;
}

.cb-current-location .order-methods .order-method-wrap.checked {
    border-color: #000;
}

    .retail div#customizedModalID.show:has(.relations .descBlock) {
    transform: translate3d(-50%, 0px, 0px);
    top: 0;
    }

    .rtl .delete-account-btn {
        float: right;
    }

    .myAccountPid .addAddress {
        margin-top: 10px;
    }

    .getAddress_autocomplete_list {}

    .recommendedItems .modal-container .itemsList .itemGrid {
        box-shadow: none;
    }

    .orderdash {
        /* background: #fff; */
        margin-bottom: 14px;
        /* border-radius: 2px; */
        /* box-shadow: 0 0 16px rgba(204, 204, 204, 0.24); */
    }

    .fnb #customizedModalID .addToFav {
        bottom: -29px;
    }

    .fnb .customizedID .bigPrice {
        bottom: 57px;
    }

    .fnb .customizedID .genBtn {
        bottom: 57px;
    }

    .fnb div#popupID {
        padding-bottom: 22px;
        box-sizing: border-box;
    }

    .market.productpage .share-product.onimg {
        border: 4.9px solid #000;
        background: transparent;
        color: #000;
        left: auto !important;
        right: 67px !important;
        top: 14px !important;
        opacity: 0.3;
    }

    .rtl.productpage .share-product.onimg {
        left: -64px !important;
        right: auto !Important;
        top: 18px !important;
    }

    .receipt-pickup-branch-desc.ng-scope {
        text-align: center !Important;
    }

    .fullThankyou .orderProc {
        text-align: center;
        font-size: 22px;
    }

    .fullThankyou .orderProc span {
        top: -90px;
        width: 100%;
        right: auto;
        font-size: 26px;
    }

    .receiptPid div#wrapper {
        min-height: 100%;
    }

    .orderstt {
        width: 420px !Important;
        border-radius: 11px !Important;
        left: 50%;
        transform: translateX(-50%);
        bottom: 70px !important;
        margin-left: -212px;
        height: auto !important;
        padding: 40px !Important;
        padding-bottom: 73px !important;
    }

    .receiptPid .fullThankyou .moreBtn.greyBtn {
        margin-left: -22px;
    }

    .receiptPid .transit .orderstt {
        opacity: 0 !important;
        height: 1px !important;
        transition: all 0.3s !important
    }

    .orderdet {}

    a.morestt {
        max-width: 351px;
        margin: auto;
    }

    .market .tabled,
    .fnb .tabled {
        overflow: auto;
        height: calc(100vh - 85px);
    }

    .fnb .checkoutID .tabled {}

    .newAddress.nonead.add.mafiad {
        box-shadow: 0 0 0 9999px rgb(246 246 246);
    }

    .homeFilter {
        min-width: 589px;
    }

    .orderReview {
        margin-top: 22px;
    }

    .market .itemsList .itemGrid {
        margin-bottom: 0px;
    }

    .catpagetop:has(.filter-item) .sub-categories-container {
        width: 100% !important;
    }

    .market .categoryPid .userbar {
        background: #fff !Important;
        border-right: 1px solid #eee;
        margin-left: -1px;
    }

.hide-bag .userbar {
    width: calc(100% - 293px);
    left: auto;
    right: 0px;
    transform: none;
}

    .market.rtl .categoryPid .userbar {
        border-right: 0px;
        border-left: 1px solid #eee;
    }

    .market .sub-categories-container .sub-categories .link-container {
        background: #f6f6f6;
    }

    .market .categoryPid #wrapper {
        background: #fff;
    }

    .market.productpage .customizedID .addRemoveWrap .addRemove {
        position: relative;
        top: auto;
        left: auto;
        margin-top: 94px;
        transform: none;
        margin-bottom: -50px;
        /* background: #000; */
        z-index: 1;
    }

    .market.productpage .customizedID .addRemoveWrap .addRemove div {
        /* color: #fff; */
    }

    .market.productpage .customizedID .head .addRemoveWrap .addRemove {
        display: none;
    }

    .market.productpage .customizedID.modal {
        width: calc(100% - 332px) !important;
    }

    .market.productpage .customizedID .data .pwrap {
        border: 0px;
        margin-bottom: 22px;
    }

    .market.productpage .cont .description {
        display: none !important;
    }

    .market.productpage .myBagModule.stick {
        background: #f6f6f6;
    }

    .market.productpage .inproduct .userbar {
        background: #fff;
        width: calc(100% - 605px);
        margin-left: 1px;
    }

    .market #customizedModalID .swiper-button-prev,
    .market #customizedModalID .swiper-button-next {
        top: 46px;
    }

    .market .categoryPid .sorter {
        margin-bottom: -31px;
        margin-right: 10px;
    }

    .productpage body.inproduct .layerPop {
        z-index: 2;
        position: relative;
        width: calc(100% - 589px);
        display: inline-block;
        vertical-align: top;
        margin-bottom: 16px;
    }

    .productpage.hide-bag:not(.menuontop) body.inproduct .layerPop {
        width: calc(100% - 289px);
    }

    .market.productpage .layerPop {
        position: absolute;
    }

    .market.productpage body.inproduct .layerPop {
        width: calc(100% - 606px);
        height: unset;
        /* top: 153px; */
        padding: 0px !Important;
        /* left: 291px!important; */
        background: #fff;
        scrollbar-gutter: initial;
        overflow: hidden;
        position: relative;
        display: inline-block;
        /* box-shadow: none; */
        z-index: 1;
    }

    .rtl.market.productpage body.inproduct .layerPop {
        float: right;
    }

    .market.productpage body.inproduct {
        overflow: auto !important;
    }

    .market .categoryPid .gridSystem {
        margin-top: 18px;
    }

    .fnb .sub-categories-container {
        padding-bottom: 13px;
    }

    .share-product {
        right: 0px !important;
        top: 13px !important;
        width: 40px;
        height: 40px;
        text-align: center;
        background-size: contain;
        z-index: 3;
        transform: scale(0.8);
        margin-left: 130px;
    }

.share-product:hover {
    opacity: 0.8;
}



    .retail .cont .share-product {
        top: 5px !important;
        background: #fff;
        /* box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px; */
        zoom: 1.1;
        left: auto !important;
        right: 2px !Important;
        /* border-color: #000; */
    }

    .productpage .cont .share-product {
        right: 37px !important;
    }

    .rtl.productpage .share-product {
        right: auto !important;
        left: 90px !important;
    }

    .retail .cont .share-product .zmdi:before {
        color: #000 !Important;
        font-size: 20px;
        left: -1px;
        top: 4px;
        content: '\f1e0';
        font-family: 'Font Awesome 6 Free';
        font-weight: 900;
    }

    .retail .share-product.onimg {
        left: 18px;
        margin-left: 0px;
        top: 22px !important;
        zoom: 1.2;
        display: none;
    }

    .checkoutID .reviewbagbut {
        /* margin-top: -26px; */
    }

    .checkoutID .myBagModule .bagTitle {
        /* margin-top: 8px; */
        /* margin-bottom: 28px; */
    }

    .sumhead {
        white-space: nowrap;
    }

    #sizeGuideModalID .parts {
        /* padding: 42px!important; */
    }

    .retail .productpage .meta .price {
        /* padding-left: 20px; */
    }

    .retail.menuontop .select-locale-top.menuList {
        margin-left: -24px;
    }

    .giftcards .hosted-session-wrapper {
        margin-top: 72px
    }

    .text-countdown {
        right: 25px
    }

    input#verificationCode {
        left: 0
    }

    .giftcards .gc-bottom-part .gc-button {
        max-width: none !Important;
    }

    .giftcards .gc-bottom-part .gc-title:before {
        content: "2- "
    }

    .giftcards .gc-bottom-part .gc-title {
        padding-top: 22px
    }

    .gc-sub-title {
        padding-bottom: 28px
    }

    .giftcards .gc-top-part .gc-title {
        font-size: 34px;
    }

    .giftcards .gc-top-part .gc-title:before {
        content: "1- "
    }

    .giftcards .gc-bottom-part .gc-email-wrapper {
        max-width: none !important;
        width: 50%;
        float: left;
        background: #fff !important;
    }

    .box_instruction.specialInstructions {
        padding-left: 23px
    }

    .pickordel .radio {
        margin-left: 18px
    }

    .fnb .itemsList .itemGrid .heart {
        bottom: 33px;
    }

    .ssm-overlay {
        display: none !Important
    }

    .box_date.pickordel {
        padding-left: 3px
    }

.rtl .box_date.pickordel {
    padding-right: 2px;
}

    div#schedule-order-id {
        padding-top: 24px;
        padding-left: 21px
    }

    .box_instruction.paymentMethods {
        padding: 0 !Important;
    }

    .kangaroo-loyalty-points .lp-points-container {
        background-color: #f6f6f6 !important
    }

    #addressFormId .googleMap {
        margin-bottom: 26px
    }

    .MenuParts .parts .bot .case {
        padding-left: 32px;
        box-sizing: border-box;
        padding-right: 16px
    }

    .menuontop .langswitcher,
    .retail .langswitcher {
        filter: invert(1);
        opacity: .7
    }

    .menuontop .userbar,
    .retail .userbar {
        display: none;
        border-bottom: 0
    }

    .menuontop .showBag .userbar.icons {
        display: block !important;
    }

    .small-inputWrap .inputWrap {
        margin-bottom: 0
    }

    #addressFormId .wrap {
        column-count: 2;
        align-items: flex-end
    }

    .reviewbag .priceonbtn {
        opacity: 1
    }

    .menuontop #wrapper {
        padding-top: 120px !important
    }

    .menuontop.slimmenu #wrapper {
        padding-top: 72px !Important;
    }

    #addressFormId .small-inputWrap {
        margin-bottom: 16px !important;
        -webkit-column-break-inside: avoid;
    }

    .market .itemsList .itemGrid {
        margin-right: 0;
        /* min-width: auto; */
        /* max-width: 270px; */
    }
}

@media(min-width:1700px) {
    .market .itemsList .itemGrid {
        /* width: calc(20vw - 129px) !important; */
    }
}

.pheadline {
    font-size: 35px;
    font-family: inherit;
    font-weight: bold;
    margin-top: 22px;
    line-height: 35px;
    padding-right: 25px;
    padding-bottom: 22px;
    width: 100%;
    border-bottom: 1px solid #ddd;
    margin-bottom: 26px;
    box-sizing: border-box;
}

.rtl .pheadline {
    direction: rtl;
    float: right;
    line-height: 42px;
    /* margin-top: 0px; */
}

.pheadline span:empty {
    display: none
}

.pbody {
    font-size: 14px;
    line-height: 28px;
    margin-top: 25px;
    padding-bottom: 10px;
    margin: auto;
    padding-top: 20px;
    padding-right: 10px;
}

.rtl .pbody {
    direction: rtl;
    padding-right: 0;
    padding-left: 20px;
    padding-right: 27px;
}

.pbody span {
    font-family: textfont !important;
    line-height: initial !important;
    font-size: 14px;
}

.pbody p {
    line-height: 26px !important;
    color: #333 !important;
    background: transparent !important;
    margin-bottom: 22px;
}

.rtl .pbody {
    padding-bottom: 92px;
}

.pbody a {
    color: var(--secondary-color);
    text-decoration: none;
    border-bottom-width: 1px;
    border-bottom-style: dotted;
    border-color: var(--secondary-color)
}

a.plink.genBtn {
    padding: 23px;
    width: fit-content;
    margin-top: 34px;
    display: inline-block;
    line-height: 0
}

.customlimit {
    font-size: 10px;
    opacity: .5
}

.large-menu-img .itemsList .itemGrid .picture {
    margin: 0 0 0 -13px;
    max-height: 230px;
    border-radius: 0;
    display: inline-block;
    /* top: -16px; */
    width: calc(100% + 26px);
    padding-bottom: 58%;
    height: auto;
    float: left;
    margin-bottom: 11px;
}

.retail .itemsList .itemGrid .picture {
    max-height: none;
    padding-bottom: 156%
}

.retail .itemsList .itemGrid .picture {
    max-height: none;
    padding-bottom: 153%;
    display: block !important;
    width: 100% !important;
    margin-left: 0px !important;
}

.retail .large-menu-img .itemsList .itemGrid .picture {
    padding-bottom: 0;
    max-height: none !important
}

.market .itemsList .itemGrid .picture {
    background-color: #fff;
    padding-bottom: 106%;
    display: block !important;
}

.newsCtrl .itemsList .itemGrid .picture {
    min-height: auto;
    max-height: 360px;
    top: 0;
    margin-left: 0;
    width: 100%;
    padding-bottom: 0 !important;
}

.newsCtrl .itemsList .itemGrid .picture img {
    position: relative
}

.itemsList .itemGrid .descBlock .title {
    font-family: titlefont
}

.large-menu-img .itemsList .itemGrid .descBlock .description {
    display: block;
    margin-top: 7px;
    font-size: 15px;
    min-height: 0;
    line-height: 21px;
    min-width: 100%;
    margin-bottom: 9px;
}

.large-menu-img.rtl .itemsList .itemGrid .descBlock .description {
    padding: 0 0 0 20px
}

.large-menu-img .itemsList .itemGrid .wrap.nopimg .title {
    margin-top: 0
}

.columnsdisplay ul.case.thebig-ul {
    column-gap: 0;
    column-fill: balance;
    column-count: 2
}

.columnsdisplay li.itemGrid {
    break-inside: avoid;
    width: auto;
    min-width: 96%;
    display: table !important
}

@media(min-width:1600px) {
    .columnsdisplay ul.case.thebig-ul {
        column-gap: 0;
        column-fill: balance;
        column-count: 3
    }
}

@media(max-width:1023px) and min-width:769px) {
    .columnsdisplay ul.case.thebig-ul {
        column-gap: 0;
        column-fill: balance;
        column-count: 1
    }
}

.swiper-slide.main-swiper-slide {
    display: flex
}

.swiper-slide.main-swiper-slide>a {
    width: 100%;
}

.swiper-slide.pages-swiper-slide {
    display: flex
}

.swiper-wrapper.main-swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100% !important;
    z-index: 1;
    /* display: flex; */
    transition-property: transform, -webkit-transform;
    box-sizing: content-box;
    transition: all 0.2s linear;
}

.swiper-wrapper.pages-swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform, -webkit-transform;
    box-sizing: content-box
}

.swiper-pagination.main-swiper-pagination {
    position: absolute;
    bottom: 13px;
    height: 33px;
    width: 100%;
    z-index: 4;
    text-align: center
}

.swiper-pagination.pages-swiper-pagination {
    position: absolute;
    bottom: 5px;
    height: 33px;
    width: 100%;
    z-index: 12;
    text-align: center
}

.swiper-pagination {
    position: absolute;
    text-align: center;
    transition: opacity .3s ease 0s;
    transform: translate3d(0px, 0px, 0px);
    z-index: 10
}

.swiper-pagination.swiper-pagination-hidden {
    opacity: 0
}

.swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: 33px;
    left: 0;
    width: 101%;
    z-index: 1;
}

.pinching .swiper-pagination {
    opacity: 0
}

.oneitem .swiper-pagination-bullets {
    display: none
}

.swiper-pagination-bullets-dynamic,
.swiper-pagination-switch-dynamic {
    overflow: hidden;
    font-size: 0
}

.swiper-pagination-bullet,
.swiper-pagination-switch {
    width: 10px;
    height: 10px;
    display: inline-block;
    border-radius: 100%;
    background: #000;
    opacity: .2;
    margin: 11px;
    cursor: pointer
}

button.swiper-pagination-bullet,
button.swiper-pagination-switch {
    border: 0;
    margin: 0;
    padding: 0;
    box-shadow: none;
    appearance: none;
    cursor: pointer
}

.swiper-pagination-clickable .swiper-pagination-bullet,
.swiper-pagination-clickable .swiper-pagination-switch {
    cursor: pointer
}

.swiper-pagination-bullet-active,
.swiper-active-switch {
    opacity: 1;
    background: #fff
}

a.calli {
    position: relative;
    color: #fff;
    background-color: var(--primary-color);
    padding-left: 8px;
    padding-right: 8px;
    text-align: center;
    border-radius: 4px;
    text-transform: uppercase;
    display: none;
    height: 44px;
    /* margin: 21px auto; */
    line-height: 44px;
    width: 80% !important
}

a.calli i {
    position: absolute;
    top: 8px;
    left: 15px
}

.whatsapp.calli i::before {
    content: "\F405"
}

.calli i::before {
    font-size: 24px
}

a.calli .texti {
    font-family: inherit;
    font-weight: bold;
    display: inline-block;
    height: 100%
}

.callbuttononmobile a.calli {
    margin: auto;
    display: block;
    margin-top: 17px;
    /* margin-bottom: 22px; */
    height: 44px;
}

a.calli.whatsapp {
    display: none
}

.whatsapp a.calli.whatsapp {
    display: block !important;
    margin: auto;
    margin-top: 29px;
}

.whatsapp .whatsapp.calli {
    display: block !important
}

.whatsapp .whatsapp.calli {
    background: linear-gradient(#69ca3b, #56a61e)
}

.onecountry .countryswitcher {
    display: none;
}

.countryswitcher {
    margin-top: 29px;
    margin-right: 24px;
    display: inline-block;
    border: 2px solid #fff;
    height: 29px;
    width: 42px;
    border-radius: 7px;
    padding-top: 7px;
    box-sizing: border-box;
    background-color: #fff
}

.countryswitcher.inmenu #flag {
    /* background-position: var(--iti-flag-offset) 0; */
    /* background-position-x: -1200px; */
}

.onecountry .countryswitcher {
    display: none;
}

.retail .countryswitcher {
    border-color: #ddd;
    padding-top: 5px;
    width: 40px
}

.retail .countryswitcher.inmenu {
    padding-top: 6px;
    width: 50px;
    border: 0
}

.menuhead .langswitcher {
    display: inline-block;
    margin-right: 0px;
    /* background-color: #fff; */
    /* top: 2px; */
    border-radius: 0px;
    /* height: 26px; */
    /* box-sizing: border-box; */
    /* padding-top: 0px; */
    /* margin-left: 0; */
    margin-top: 0px;
    height: 26px;
    box-sizing: border-box;
    border: 0px;
}

.onecountry .menuhead .langswitcher {
    right: -6px;
}

.onecountry .menuhead .langswitcher:after {
    content: '\f2f2';
    font-family: 'Material-Design-Iconic-Font';
    color: #333;
    font-size: 18px;
    margin-bottom: 18px;
    position: absolute;
    right: 33px;
    top: -15px;
    width: 15px;
    height: 50px;
    box-sizing: border-box;
    padding-top: 17px;
    z-index: 0;
    pointer-events: none;
}

.cordova .menuhead .langswitcher {
    /* margin-top: 11px; */
}

.cordova .menuhead .currencyswitcher {
    /* margin-top: 54px; */
}

.onecountry.onelanguage .langswitcher {
    display: none
}

.currencyswitcher {
    margin-top: 29px;
    margin-left: 18px;
    color: #fff;
    display: block;
    border: 2.5px solid #fff;
    height: 25px;
    width: 38px;
    border-radius: 7px
}

.currencytext {
    text-align: center;
    margin-top: 0;
    cursor: pointer;
    line-height: 25px;
    text-transform: uppercase;
    font-size: 14px
}

.menuhead .currencyswitcher {
    display: inline-block;
    position: relative;
    margin-right: 0px;
    background-color: #fff;
    margin-top: 20px;
    /* box-shadow: rgb(0 0 0 / 7%) 0 0 9px 0px; */
    /* border-radius: 4px; */
    height: 26px;
    box-sizing: border-box;
    padding-top: 0px;
    margin-top: 0px;
    margin-left: 0px;
    border: 0px;
}

.menuhead .currencyswitcher .currencytext {
    color: #666;
    font-size: 12px;
    line-height: 26px;
    height: 26px;
}

.retail .currencyswitcher {
    border: 2px solid var(--primary-color);
    float: right;
    margin-left: 0px;
}

.retail .currencytext {
    color: var(--primary-color)
}

.retail .langswitcher {
    width: auto;
    padding-left: 6px;
    padding-right: 6px;
    min-width: 35px;
    border-color: #ddd;
}

.retail .menuhead .langswitcher {
    filter: none
}

@media only screen and (-webkit-device-pixel-ratio: 3) and (min-device-height: 812px) and (max-device-width: 700px), only screen and (-webkit-device-pixel-ratio: 2) and (min-device-height: 896px) and (min-device-width: 414px) and (max-device-width: 700px), only screen and (-webkit-device-pixel-ratio: 3) and (min-device-height: 896px) and (min-device-width: 414px) and (max-device-width: 700px), only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3), only screen and (device-width: 320px) and (device-height: 693px) and (-webkit-device-pixel-ratio: 3) {
    body {
        visibility: visible
    }

    .has-subsubcategories .sub-categories-container.show-for-mobile {
    }

    .retail.cordova .categoryPid .content.has-subcategories {
        padding-top: 143px;
    }

    .retail .has-subsubcategories .sub-categories-container.show-for-mobile {
    }

    .cordova .categoryPid .subcats {
        top: 140px;
    }

    .cordova .errorCustomization {
        bottom: 83px;
    }

    i.zmdi.shared.zmdi-search {}

    .receiptPid .fullThankyou .moreBtn.greyBtn {
        bottom: 13px;
    }

    .customizedID .product-labels-container {
        margin-top: 26px;
    }

    .cordova .deskmenu {
        top: 86px !important
    }

    .cordova.ios .homeFilter {
        top: 45px;
    }

    .cordova .errorpopup#languageList {
        top: 58px !important
    }

    .cordova.ios .modal.closeNew .btnClose {
        top: 36px !important
    }

    .cordova .modalParent.modal-parent-checkout .btnClose {
        margin-top: 34px
    }

    .cordova.ios .parts .bot {
        padding-top: 28px !important;
        height: 140px;
    }

    .cordova:has(.free-cat-title) .bot {
        height: 118px!important;
    }

    .cordova.ios #wrapper {
        padding-top: 140px;
    }

    .landingfixedlayout.cordova .homePid[act-as="landing-page"] #wrapper {
        padding-top: 84px;
    }

    .cordova.market.enablesorting .categoryPid .content:has(.subempty) {
        padding-top: 86px !important;
    }

    .cordova.ios .referrals .bot,
    .cordova.ios .loyalty .bot,
    .cordova.ios .pages .bot,
    .cordova.ios .newsCtrl .bot,
    .cordova.ios .branchesCtrl .bot,
    .cordova.ios .myAccountPid .bot,
    .cordova.ios .checkoutID .bot,
    .cordova.ios .receiptPid .bot,
    .cordova.ios .orderdetails .bot,
    .cordova.ios .giftcards .bot,
    .cordova.ios .favoritePid .bot,
    .cordova.ios .offers .bot,
    .cordova.ios .challenges .bot,
    .cordova.ios body:has(.free-cat-title) .bot,
    .cordova.ios .spinthewheel .bot
    {
        height: 88px !important;
    }

    .cordova.ios .pages #wrapper, .cordova.ios .referrals #wrapper, .cordova.ios .loyalty #wrapper, .cordova.ios .newsCtrl #wrapper, .cordova.ios .branchesCtrl #wrapper, .cordova.ios .myAccountPid #wrapper, .cordova.ios .favoritePid #wrapper, .cordova.ios .checkoutID #wrapper, .cordova.ios .receiptPid #wrapper, .cordova.ios .orderdetails #wrapper, .cordova.ios .giftcards #wrapper, .cordova.ios .offers #wrapper, .cordova.ios .challenges #wrapper, .cordova.ios .spinthewheel #wrapper,  .cordova.ios body:has(.free-cat-title) #wrapper, .cordova.ios .spinthewheel #wrapper{
        padding-top: 88px !important;
    }

    .cordova.ios.fnb #wrapper {
        padding-top: 135px;
    }

    .cordova.ios body.homePid[act-as="landing-page"] #wrapper {
        padding-top: 90px;
    }

    .cordova.ios.fnb .categoryPid div#wrapper:has(.top-categories) {
        padding-top: 183px;
    }

    .cordova.ios .top-categories {
        top: 140px !important;
    }

    .cordova.ios.retail .top-categories {
        top: 58px !important;
    }

    .cordova body.payinstore {
        height: (100vh - 20px) !important;
        overflow: hidden !important;
    }

    .cordova .payinstore .MenuParts .parts .bot {
        /* padding-top: 0px !important; */
        height: 83px !important;
    }

    .cordova .payinstore #wrapper {
        padding-top: 80px;
    }

    div#currencyList,
    div#countryList,
    div#languageList,
    div#countryDetector {
        margin-top: 32px;
        left: 10px;
    }

    .gotomarker {
        top: 52px;
        border-radius: 3px
    }

    .customizedID.modal.closeNew .btnClose {
        margin-top: 4px
    }

    .cordova .addtobagbtn.show {
        padding-bottom: 23px;
        box-sizing: content-box;
    }

    .cordova #customizedModalID .addToFav {
        top: 22px !Important;
        /* padding-bottom: 136px; */
    }

    .cordova .customizedID .addToFav {}

    .cordova .addtobagbtn:before {
        top: -1px;
    }

    .cordova .bigPrice.overbtn.show {
        bottom: 46px;
    }

    .cordova .share-product.onimg {
        top: 110px !important;
    }

    .cordova #customizedModalID .atf.onimg {
        top: 157px !important;
    }

    .app-version {
        top: 114px
    }

    .cordova .box_feedback .feed {
        height: 100px
    }

    .cordova .menuhead .langswitcher {
        /* margin-top: 55px !important; */
    }

    .cordova .countryswitcher.inmenu {
        /* margin-top: 50px; */
    }

    .cordova .box_feedback .feed textarea {
        padding-top: 18px !important
    }

    .cordova.ios body,
    .webapp body {
        position: relative;
        padding-top: 20px;
        box-sizing: border-box;
    }

    .payinstore.cordova #wrapper {
        padding-top: 60px !important;
    }

    .cordova .cb-wrapper {
        top: 70px!important;
        height: calc(100vh - 160px)!important;
    }

    .cordova .cb-wrapper .cb-branches {
        max-height: calc(100vh - 312px) !important;
    }

    .cordova.ios .MenuParts.fix,
    .webapp .MenuParts.fix {
        top: 20px !important
    }

    .cordova.ios .MenuParts.fix::before,
    .webapp .MenuParts.fix::before {
        content: "";
        width: 100%;
        height: 21px;
        background-color: var(--primary-color);
        position: fixed;
        top: -20px;
    }

    .cordova.market.enablesorting .content.has-subcategories .sorter {
        /* margin-top: -51px; */
    }

    .cordova.retail .has-subsubcategories .sub-categories-container.show-for-mobile {
        top: 115px;
    }

    .retail.cordova .MenuParts.fix::before,
    .webapp .MenuParts.fix::before {
        background-color: #fff
    }

    .cordova .menuhead .zmdi.zmdi-sort-amount-desc {
        top: 54px;
    }

    .cordova .menuhead {
        height: 87px;
    }

    .cordova .menuhead .switchers {
        margin-top: 29px;
    }

    .cordova .customizedID .btnClose {
        top: 24px !important
    }
}

.langtext {
    text-align: center;
    margin-top: 0;
    cursor: pointer;
    line-height: 23px;
    text-transform: lowercase
}

.menuhead .langtext {
    color: #666;
    font-size: 12px;
    line-height: 26px;
    height: 26px;
    text-transform: uppercase;
    /* font-weight: bold; */
}

div#bobPaymentsModalID,
div#fibPaymentsModalID {
    width: 100%;
    border-radius: 16px
}

div#bobPaymentsModalID .parts,
div#fibPaymentsModalID .parts {
    background-color: #fff;
    min-height: calc(100vh - 69px)
}

div#bobPaymentsModalID .normalForm,
div#fibPaymentsModalID .normalForm {
    overflow: hidden;
    min-height: 382px
}
div#bobPaymentsModalID .normalForm #hc-comms-layer-iframe,
div#fibPaymentsModalID .normalForm #hc-comms-layer-iframe {
    max-width: 90%;
    margin-left: auto !important;
    margin-right: auto !important;
    overflow: auto !important;
}
div#bobPaymentsModalID .normalForm #hc-comms-layer-iframe.acs-takeover,
div#fibPaymentsModalID .normalForm #hc-comms-layer-iframe.acs-takeover {
    position: relative !important;
    max-width: 100%;
}
.payment-type-cybersource .normalForm {
    min-height: calc(100vh - 72px);
}

@media(max-width:768px) {
    .payment-type-cybersource .normalForm {
        min-height: calc(100vh - 114px);
    }

    div#bobPaymentsModalID,
    div#fibPaymentsModalID {
        border-radius: 0;
        top: 0;
        transform: translate3d(0px, 0px, 0px) !important;
        left: 0;
        width: 100vw !important
    }

    div#bobPaymentsModalID .parts,
    div#fibPaymentsModalID .parts {
        background-color: #fff;
        min-height: calc(100vh - 80px);
        display: inline-block
    }
}

.titleAndLegend .title {
    color: var(--secondary-color);
    font-weight: normal;
    margin-top: 17px
}

.homePid .categories ul>li a.title {
    text-transform: uppercase;
    font-family: 'textfont';
    font-weight: bold;
    font-size: 14px;
    color: var(--primary-color);
    padding-top: 11px;
    /* background-color: #fff; */
    line-height: 15px;
}

.retail .homePid .categories ul>li a.title {
    text-transform: capitalize;
    color: var(--secondary-color)
}

.rtl .homePid .categories ul>li a.title {
    font-family: arabicfont
}

.market .homePid .categories ul>li a.title {
    font-family: textfont;
    text-transform: capitalize;
    font-weight: bold;
    font-size: 15px;
    color: #333
}

.deskmenu li a {
    font-family: 'titlefont';
    /* font-weight: bold; */
}

.fnb .deskmenu li a {
    font-size: 15px;
    line-height: 19px;
}

.fnb .deskmenu li {
    padding-top: 8px;
    padding-bottom: 8px;
}

.itemsList .itemGrid .descBlock .title {
    font-weight: normal;
    color: var(--secondary-color)
}

.home-collection .itemsList .itemGrid .descBlock .title {
    margin-left: 0
}

.market.large-menu-img .itemsList .itemGrid .descBlock .title {
    /* padding-top: 0; */
    /* padding-right: 0; */
    /* padding-left: 0; */
    text-transform: capitalize;
    text-align: left;
    line-height: 18px;
    white-space: normal;
    margin-left: -5px;
    color: #333 !important;
    font-family: textfont !important;
    font-size: 14px !important;
    font-weight: bold !important;
    padding-bottom: 11px !important;
}

.market.large-menu-img .newsCtrl .itemsList .itemGrid .descBlock .title {
    font-size: 20px !important;
    margin-left: 0px !important;
}

.rtl .itemsList .itemGrid .descBlock .title {
    font-family: inherit !important;
    direction: rtl;
    text-align: right !Important;
    display: block !Important;
}

.large-menu-img .itemsList .itemGrid .descBlock .description {
    white-space: normal
}

.large-menu-img .itemsList .itemGrid .descBlock .description:empty {
    display: none;
}

.retail.large-menu-img .itemsList .itemGrid .descBlock .description {
    display: none
}

.market.large-menu-img .itemsList .itemGrid .descBlock .description {
    font-size: 13px;
    margin-bottom: 10px;
    display: inline-block;
    margin-left: -5px;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: -3px;
    line-height: 19px;
    opacity: .8;
    /* margin-left: -5px; */
    padding-right: 0px;
}

.itemsList .itemGrid .descBlock .description:empty {
    display: none!important;
}

.itemsList .genBtn {
    font-family: titlefont;
    font-weight: normal;
    font-size: 12px
}

.itemsList .genBtn.customize {
    border-color: var(--primary-color);
    color: var(--primary-color);
    font-weight: normal
}

.market .itemsList .genBtn.customize {
    font-size: 10px;
    background-color: #ffde4f;
    letter-spacing: 0;
    color: #666;
    height: 26px;
    margin-top: 3px;
    margin-left: -5px;
    border: 0px;
    display: none;
    width: fit-content;
    padding-left: 9px;
    padding-right: 9px;
}

.itemsList .picture .genBtn.customize {
    display: none
}

.market .itemsList .picture .genBtn.customize {
    display: block;
    position: absolute;
    z-index: 1;
    right: 13px;
    bottom: 21px;
    text-align: center;
    line-height: 26px;
}

.market .itemsList .has-discount .picture .genBtn.customize {
    left: auto;
    right: 13px;
}

.itemsList .genBtn {
    background-color: var(--primary-color)
}

.rtl .itemsList .genBtn {
    font-family: inherit;
    font-weight: bold;
    letter-spacing: -0.1px
}

.customizedID .data .title {
    font-weight: normal;
    color: var(--secondary-color)
}

.customizedID .data .description li {
    padding: 2px;
    list-style-position: inside
}

.market .customizedID .data .description {
    margin-top: 17px
}

.customizedID.largetxt .data .description {
    display: none;
    margin-bottom: 22px;
    padding-top: 22px;
}

.hot-line {
    font-size: 18px;
    font-family: titlefont;
    font-weight: normal;
    position: relative
}

.retail .hot-line {
    font-size: 15px;
    font-family: inherit;
    color: inherit;
    font-weight: bold;
    border-bottom: 1px solid #ddd;
    padding-bottom: 0;
    width: 100%;
    display: inline-block;
    margin-bottom: 16px
}

.retail .hot-line:empty {
    display: none
}

.retail .hotl::before {
    font: 25px / 1 Material-Design-Iconic-Font;
    content: "\F27C"
}

.retail .hot-line::before {
    display: none
}

.filter.normal input::-webkit-input-placeholder {
    color: rgba(255, 255, 255, 0.69)
}

.rtl .deskmenu .menu li a {
    font-family: inherit;
    font-weight: bold;
    font-size: 16px
}

.rtl .deskmenu .menu li ul li a {
    font-weight: normal !important
}

.myBagModule .itemBags .itemBag .title,
.myBagModule .itemBags .itemBag .brand {
    font-family: 'titlefont';
    font-weight: normal;
    /* padding-top: 8px; */
    text-align: left;
    cursor: pointer;
    font-size: 15px !important;
}

.myBagModule .itemBags .itemBag .brand {
    line-height: 18px;
    margin-bottom: -2px;
}

.retail .myBagModule .itemBags .itemBag .brand {
    width: 100%;
    margin-bottom: -3px;
}

.retail .myBagModule .itemBags .itemBag .title {
    width: 100%;
    font-size: 14px !important;
    line-height: 17px;
}

.rtl .myBagModule .itemBags .itemBag .title {
    font-family: inherit;
    font-weight: bold;
}

.mobileMenuWrap .lineLink.selected .ico,
.mobileMenuWrap .lineLink .text {
    font-family: 'textfont';
    font-size: 14px;
    /* font-weight: bold!important; */
}

.loyaltyl {
    display: none
}

.hasloyalty .loyaltyl {
    display: block
}

.menuqlinks .text {
    font-family: textfont !important
}

.loginRegisterID .mainTitle {
    font-family: titlefont;
    font-weight: normal;
    text-transform: uppercase
}

.box_instruction .title {
    font-family: 'textfont';
    font-weight: 700;
    text-transform: uppercase
}

.customDropDown .drop_title {
    font-family: textfont;
    font-weight: bold
}

.editAddAddress .mainTitle {
    font-family: titlefont;
    font-weight: normal;
    /* text-transform: uppercase; */
}

.customizedID .data .title {
    font-size: 22px;
    margin-bottom: 7px
}

.market .customizedID.largetxt .head .data {
    /* display: none; */
}

.market .customizedID .data .title,
.market .customizedID .data .brand {
    font-size: 26px;
    color: #333;
    font-family: 'textfont';
    font-weight: bold;
}

.market .customizedID .data .brand {
    font-size: 17px;
    color: var(--primary-color)
}

.rtl.market .customizedID .data .brand {
    /* text-align: right; */
}

.market .customizedID .data .sku {
    color: #999;
    font-size: 13px;
    font-family: monospace;
    width: fit-content;
}

.market.productpage .customizedID .data .sku {
    text-align: left;
    margin-left: 0px;
}

.createAccountID .mainTitle {
    font-family: titlefont;
    font-weight: normal;
    text-transform: uppercase
}

.formPart .input .label {
    font-size: 15px
}

.myBagModule .nb.neartitle {
    font-size: 15px;
}

.rtl .myBagModule .nb.neartitle {
    float: right;
    margin-right: 0px;
    margin-left: 7px;
    font-size: 22px;
}

.retail .myBagModule .nb.neartitle {
    display: none;
    border: 1px
}

.myBagModule .itemBags .customPart .type {
    text-transform: uppercase;
    width: 89px;
    margin-bottom: 5px;
    padding-right: 9px;
}

.retail .myBagModule .itemBags .customPart .type {
    width: 70px
}

.myBagModule .itemBags .for-free .type {
    /* display: none !important; */
}

.myBagModule .itemBags .customPart .name {
    text-transform: uppercase
}

.retail .myBagModule .itemBags .customPart .name {
    margin-top: 1px;
    cursor: pointer;
    font-size: 15px;
    color: #666;
    margin-right: 8px;
}

.retail .myBagModule .itemBags .customPart .color {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    position: relative;
    display: block;
    float: left;
    margin-top: 5px;
    margin-right: 11px;
}

.myBagModule .itemBags .customPart .elements {
    /* width: calc(100% - 126px); */
}

.MenuParts .callUsNb {
    top: 20px;
    padding-right: 48px;
    text-decoration: none;
    pointer-events: none;
    height: 45px;
    line-height: 45px
}

.retail .MenuParts .callUsNb {
    display: none !important
}

.MenuParts .callUsNb {
    display: none
}

.whatsapp .MenuParts .callUsNb {
    pointer-events: all;
    height: 45px;
    border-radius: 5px;
    padding-right: 64px;
    overflow: hidden
}

.whatsapp.hidehotline .MenuParts .callUsNb {
    padding-right: 0;
    width: 49px
}

.disableqtty .addRemove {
    display: none
}

.recommendedItems .modal-container .title {
    text-transform: uppercase;
    font-size: 15px;
    margin-top: 0px;
}

.generalMainTitle {
    font-weight: bold;
    /* text-transform: uppercase; */
}

.retail .generalMainTitle {
    font-size: 24px
}

.pageMainTitle {
    font-weight: normal;
    font-family: titlefont;
    text-transform: uppercase
}

.myAccountPid .pageMainTitle {
    display: none
}

.editaccountp .pageMainTitle {
    padding-bottom: 12px;
    display: none
}

.market .pageMainTitle {
    padding-bottom: 3px;
    padding-top: 10px;
    display: none
}

@media only screen and (device-width:375px) and (device-height:812px) and (-webkit-device-pixel-ratio:3),
only screen and (device-width:414px) and (device-height:896px) and (-webkit-device-pixel-ratio:2),
only screen and (device-width:414px) and (device-height:896px) and (-webkit-device-pixel-ratio:3) {
    .retail .customizedID .picture {
        position: relative !important
    }
}

.customizedID .backg {
    transition: transform .5s linear 0s;
    height: auto;
    width: 100%;
}

.market .subPage .titleAndLegend {
    display: block !important;
}

.rtl.market .subPage .titleAndLegend {
    margin-right: 0;
    margin-left: auto
}

.enablesorting .categoryPid .sorter {
    position: absolute;
    right: 11px;
    bottom: 13px;
    z-index: 2;
    display: block
}

.retail.enablesorting .categoryPid .sorter {
    right: 0px;
}

.rtl .categoryPid .sorter {
    right: auto !Important;
    /* left: 10px; */
    top: 1px;
}

.sorter {
    display: none
}

.categoryPid .sorter .sort::after {
    display: inline-block;
    font: 22px / 1 Material-Design-Iconic-Font;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    content: "\F1CE";
    width: 19px;
    position: absolute;
    right: 8px;
    top: 6px;
    pointer-events: none;
}

.rtl .categoryPid .sorter .sort::after {
    right: auto;
    left: 12px;
}

.rtl .categoryPid .sorter::after {
    right: auto;
    left: 12px
}

.categoryPid .sorter select {
    width: 145px;
    height: 35px;
    padding-left: 12px;
    color: #333;
    border: 1px solid #eee;
    border-radius: 4px;
    line-height: 33px;
    background-color: #fff
}

.rtl .categoryPid .sorter select {
    padding-left: 0;
    text-align: right;
    padding-left: 34px!important;
    padding-right: 9px!important;
}

.showsubcatmenu .subPage .titleAndLegend {
    display: block
}

.market .subPage .titleAndLegend .title {
    display: block !important
}

.market .subPage .titleAndLegend .title {
    margin-top: 21px;
    margin-bottom: 10px;
    text-transform: capitalize;
    font-size: 33px;
    color: var(--primary-color);
    font-family: 'titlefont';
}

.newsCtrl.subPage .titleAndLegend .title {
    /* display: none !important; */
}

.retail .newsCtrl.subPage .titleAndLegend .title {
    text-transform: lowercase;
    color: #ddd;
    display: block !important;
    font-size: 43px !important
}

.MenuParts .parts {
    opacity: 1;
    z-index: 8;
}

.flmenubtn {
    font-family: titlefont;
    font-weight: normal;
    letter-spacing: .5px;
    font-size: 12px
}

.retail .flmenubtn {
    width: 152px;
    border-radius: 6px;
    opacity: .8;
    display: none !important
}

.retail .flmenubtn.retailonly {
    width: calc(100vw - 48px);
    text-align: left;
    box-sizing: border-box;
    background-color: transparent;
    box-shadow: none;
    opacity: 1;
    display: block !important
}

.retail .flmenubtn.retailonly .filter.normal {
    position: absolute;
    top: -1px;
    right: -2px;
    overflow: hidden;
    border-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.09) 0 10px 20px, rgba(0, 0, 0, 0.09) 0 6px 6px;
    border: 0;
    transition: all .6s ease 0s;
    width: 59px !important
}

.retail .s-active .flmenubtn.retailonly .filter.normal {
    background-color: #fff;
    width: 100vw !important
}

.retail .flmenubtn.retailonly .filter .zmdi {
    top: 6px
}

.retail .s-active .flmenubtn.retailonly .filter .zmdi::before {
    content: "\F136"
}

.retail .flmenubtn.retailonly .filter input {
    color: #333;
    visibility: hidden
}

.retail .s-active .flmenubtn.retailonly .filter input {
    visibility: visible !important
}

.retail .flmenubtn.retailonly .activecat {
    box-shadow: rgba(0, 0, 0, 0.09) 0 -18px 20px, rgba(0, 0, 0, 0.09) 0 8px 6px;
    opacity: .95;
    width: fit-content;
    background-color: #fff;
    color: #000;
    padding-left: 18px;
    padding-right: 43px;
    border-radius: 3px;
    position: absolute;
    right: 68px;
    transform: translateX(0px);
    transition: all .5s ease 0s;
    text-transform: capitalize
}

.showModal .flmenubtn {
    bottom: -150px;
    display: none !important
}

.myAccountPid .activecat {
    display: none
}

.offers .activecat {
    display: none
}

.retail .flmenubtn.retailonly .activecat::after {
    font: 17px / 1 Material-Design-Iconic-Font;
    content: "\F2F9";
    position: absolute;
    top: 16px;
    right: 18px
}

.retail .s-active .flmenubtn.retailonly .activecat {
    transform: translateX(-600px);
    transition: all .2s ease 0s
}

.locAddress .street:first-child {
    color: var(--primary-color);
    font-weight: normal !important
}

.recommendedItems .modal-container .btnClose {
    bottom: -46px !important;
    display: none;
}

.MenuParts .bag {
    padding-left: 13px;
    background-color: #fff;
    line-height: 45px;
    height: 45px;
    margin-top: 20px;
    border-radius: 5px
}

.retail .MenuParts .bag {
    position: relative;
    padding-left: 0;
    color: #fff;
    border-radius: 0 0 5px 5px;
    z-index: 1;
    margin-right: 4px;
    background: transparent;
    width: 45px !important
}

.zmdi-sort-amount-desc::before {
    margin-left: -36px
}

.MenuParts .bag.minicv {
    display: none;
}

.deiveringfrom {
    display: none
}

.multibranch .deiveringfrom {
    display: block;
    font-size: 13px;
    background-color: rgba(0, 0, 0, 0);
    width: 200px;
    border-radius: 7px 0 0 7px;
    border: 2px solid rgba(255, 255, 255, 0.1);
    height: 44px;
    position: absolute;
    cursor: pointer;
    transition: all 0.4s !important;
    animation: 0.5s ease-in-out 0s 1 normal forwards running fadeIn;
}

.multibranch .branchtitle {
    color: rgba(255, 255, 255, 0.6);
    width: 100%;
    border-bottom: 1px dashed rgba(255, 255, 255, 0.27);
    box-sizing: border-box;
    height: 20px;
    line-height: 20px;
    padding-left: 9px;
    text-transform: uppercase;
    font-size: 10px
}

.multibranch .branchname,
.multibranch .locationName {
    display: block;
    color: #fff;
    width: 100%;
    box-sizing: border-box;
    height: 27px;
    line-height: 25px;
    padding-left: 9px;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: bold;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-right: 11px;
}

.multibranch .branchname::after,
.multibranch .locationName::after {
    content: "\F2F2";
    font-family: Material-Design-Iconic-Font;
    color: #fff;
    font-size: 18px;
    position: absolute;
    right: 14px;
    top: 3px;
    box-sizing: border-box;
    padding-top: 17px;
    z-index: 0;
    pointer-events: none
}

.multibranch .filter.normal {
    width: calc(100% - 199px);
    float: right;
}

.multibranch .filter.normal.full-width {
    width: 100%;
}

.multibranch .accname {
    display: none
}

.subcats a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    transition: all .2s linear 0s;
    height: 25px;
    display: inline-block
}

.subcats li {
    list-style: none;
    padding-bottom: 7px;
    padding-top: 6px;
    display: inline-block;
    padding-right: 25px;
    /* font-weight: bold; */
    position: relative;
    width: auto;
    height: 21px;
    transition: all .2s linear 0s;
    opacity: 0.7;
}

.subcats li.selected {
    transition: all .2s linear 0s
}

.subcats li.selected a {
    color: var(--primary-color);
    transition: all .2s linear 0s;
    border-bottom: 2px solid var(--primary-color);
    font-weight: bold;
}

.subcats ul {
    overflow: auto;
    width: 100%;
    white-space: nowrap;
    height: 45px
}

.rtl .subcats ul {
    direction: rtl
}

.subcats ul.link:empty {
    display: none
}

.subcats ul.link.ng-scope {
    display: block
}

.subcats {
    background-color: #fff;
    padding: 8px 10px 10px;
    width: 100%;
    box-shadow: rgb(0 0 0 / 8%) 0 12px 8px;
    height: 28px;
    position: fixed;
    z-index: 3;
    top: 118px
}

body:has(.has-subsubcategories) .subcats {
    margin-top: 47px;
}

.retail .subcats {
    top: 66px
}

.subcats {
    display: none;
}

.checkoutID .subcats,
.orderdetails .subcats {
    display: none !important
}

.categoryPid .subcats {
    display: block;
}

.cordova .categoryPid .subcats {
    /* top: 136px; */
}

.retail.cordova .categoryPid .subcats {
    top: 60px;
}

.subcats.subempty {
    display: none
}

.subcats.subempty {
    display: none
}

@media(min-width:1800px) {
    .market .itemsList .itemGrid {
        /* width: calc(14vw - 14px) !important; */
    }

    .market .newsCtrl .itemsList .itemGrid {
        margin-right: 13px;
        width: 100%;
    }
}

.market .itemsList .itemGrid .priceWrap .wrap {
    margin-top: 0
}

.loyalty-points {
    position: relative;
    display: none;
    margin-bottom: 15px
}

.loyalty-points .input {
    position: relative;
    display: block
}

.loyalty-points .label {
    position: relative;
    display: inline-block;
    color: #000;
    padding-left: 20px;
    cursor: pointer
}

.loyalty-points .deducted-amount {
    position: relative;
    display: block;
    font-size: 12px;
    color: #666;
    margin-left: 21px;
    margin-top: -7px
}

.wrapContainer .scroll-menu {
    position: relative;
    display: block;
    height: calc(100% - 70px);
    overflow: auto;
    min-width: 300px;
    padding-bottom: 22px
}

.zmdi-facebook::before {
    background-image: url("../images/facebook.png");
    width: 28px;
    height: 28px;
    display: inline-block;
    background-size: cover;
    content: "" !important
}

.zmdi-instagram::before {
    background-image: url("../images/instagram.png");
    width: 28px;
    height: 28px;
    display: inline-block;
    background-size: cover;
    content: "" !important
}

.zmdi-twitter::before {
    background-image: url("../images/twitter.png");
    width: 28px;
    height: 28px;
    display: inline-block;
    background-size: cover;
    content: "" !important
}

.zmdi-youtube::before {
    background-image: url("../images/youtube.png");
    width: 28px;
    height: 28px;
    display: inline-block;
    background-size: cover;
    content: "" !important
}

@media(max-width:768px) {
    .checkoutID .bot {
        overflow: hidden
    }

    .flmenubtn {
        display: block
    }

    .receiptPid .flmenubtn {
        display: none;
    }

    .enablesorting .categoryPid .sorter.subempty {
        top: -40px !important;
        right: 6px !important;
    }

    .rtl .categoryPid .sorter.subempty {
        html {
            text-size-adjust: none;
        }

        body {
            text-size-adjust: none;
        }

        @keyframes fadeInUp {
            0% {
                opacity: 0;
                transform: translate3d(100%, 0px, 0px)
            }

            70% {
                opacity: 0;
                transform: translate3d(100%, 0px, 0px)
            }

            100% {
                opacity: 1;
                transform: translate3d(0px, 0px, 0px)
            }
        }

        @keyframes fadeIn {
            0% {
                opacity: 0
            }

            100% {
                opacity: 1
            }
        }

        @keyframes bounce {

            0%,
            20%,
            53%,
            80%,
            100% {
                animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
                transform: translate3d(0px, 0px, 0px)
            }

            40%,
            43% {
                animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
                transform: translate3d(0px, -30px, 0px)
            }

            70% {
                animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
                transform: translate3d(0px, -15px, 0px)
            }

            90% {
                transform: translate3d(0px, -4px, 0px)
            }
        }

        @keyframes bounceIn {
            0% {
                opacity: 1;
                transform: scale3d(1, 1, 1)
            }

            60% {
                opacity: 1;
                transform: scale3d(1, 1, 1)
            }

            65% {
                opacity: 1;
                transform: scale3d(1.6, 1.6, 1.6)
            }

            70% {
                opacity: 1;
                transform: scale3d(0.9, 0.9, 0.9)
            }

            80% {
                opacity: 1;
                transform: scale3d(1.03, 1.03, 1)
            }

            100% {
                opacity: 1
            }
        }

        .nbHolding.animate {
            animation-name: bounce;
            animation-duration: 1s;
            animation-fill-mode: both
        }

        .quickadd.animate {
            animation-name: bounce;
            animation-duration: .4s;
            animation-fill-mode: both
        }

        .rtl .MenuParts .signin {
            font-family: inherit;
            line-height: 13px
        }

        .iti {
            position: relative;
            display: inline-block;
            height: 100%;
            border-radius: 4px;
            width: 100%;
        }

        .iti * {
            box-sizing: border-box;
            -moz-box-sizing: border-box
        }

        .iti__hide {
            display: none
        }

        .iti__v-hide {
            visibility: hidden
        }

        .iti input,
        .iti input[type=tel],
        .iti input[type=text] {
            position: relative;
            z-index: 0;
            margin-top: 0 !important;
            margin-bottom: 0 !important;
            padding-right: 36px;
            margin-right: 0
        }

        .iti__flag-container {
            position: absolute;
            top: 0;
            bottom: 0;
            right: 0;
            padding: 1px;
        }

        .iti__selected-flag {
            z-index: 1;
            position: relative;
            display: flex;
            align-items: center;
            height: 100%;
            padding: 0 0 0 8px;
            width: 42px;
        }

        .rtl .iti__selected-flag {
            padding: 0 8px 0 0px;

        }

        .iti__arrow {
            margin-left: 6px;
            width: 0;
            height: 0;
            border-left: 3px solid transparent;
            border-right: 3px solid transparent;
            border-top: 4px solid #555
        }

        .rtl .iti__arrow {
            margin-left: 0px;
            margin-right: 6px;
        }

        .iti__arrow--up {
            border-top: none;
            border-bottom: 4px solid #555
        }

        .iti__country-list {
            position: absolute;
            z-index: 2;
            list-style: none;
            text-align: left;
            padding: 0;
            margin: 0 0 0 -1px;
            box-shadow: 1px 1px 10px rgb(0 0 0 / 15%);
            background-color: #fff;
            border: 1px solid #f8f4f4;
            white-space: nowrap;
            max-height: 418px;
            overflow-y: scroll;
            -webkit-overflow-scrolling: touch;
            font-family: Roboto, sans-serif;
            font-weight: 400;
            font-size: 13px;
            color: #4d4d4c;
            text-align: left;
            width: 313px;
            overflow-x: hidden;
        }

        .iti__country-list--dropup {
            bottom: 100%;
            margin-bottom: -1px
        }

        @media (max-width:500px) {
            .iti__country-list {
                white-space: normal;
                width: 342px;
            }
        }

        .iti__flag-box {
            display: inline-block;
            width: 20px;
        }

        .iti__divider {
            padding-bottom: 5px;
            margin-bottom: 5px;
            border-bottom: 1px solid #ccc
        }

        .iti__country {
            padding: 11px 10px;
            outline: 0
        }

        .iti__dial-code {
            color: #999
        }

        .iti__country.iti__highlight {
            background-color: rgba(0, 0, 0, .05)
        }

        .iti__country-name,
        .iti__dial-code,
        .iti__flag-box {
            vertical-align: middle
        }

        .iti__country-name,
        .iti__flag-box {
            margin-right: 6px
        }

        .iti--allow-dropdown input,
        .iti--allow-dropdown input[type=tel],
        .iti--allow-dropdown input[type=text],
        .iti--separate-dial-code input,
        .iti--separate-dial-code input[type=tel],
        .iti--separate-dial-code input[type=text] {
            padding-right: 6px;
            padding-left: 52px;
            margin-left: 0
        }

        .iti--allow-dropdown .iti__flag-container,
        .iti--separate-dial-code .iti__flag-container {
            right: auto;
            left: 0px;
        }

        .rtl .iti--allow-dropdown .iti__flag-container,
        .rtl .iti--separate-dial-code .iti__flag-container {
            right: 0px;
            left: auto;
        }

        .iti--allow-dropdown .iti__flag-container: hover {
            cursor: pointer;
        }

        .iti--allow-dropdown .iti__flag-container: hover .iti__selected-flag {}

        .iti--allow-dropdown input[disabled]+.iti__flag-container:hover,
        .iti--allow-dropdown input[readonly]+.iti__flag-container:hover {
            cursor: default
        }

        .iti--allow-dropdown input[disabled]+.iti__flag-container:hover .iti__selected-flag,
        .iti--allow-dropdown input[readonly]+.iti__flag-container:hover .iti__selected-flag {
            background-color: transparent
        }

        .iti--separate-dial-code .iti__selected-flag {
            background-color: rgba(0, 0, 0, .05)
        }

        .iti--separate-dial-code .iti__selected-dial-code {
            margin-left: 6px
        }

        

        @media (-webkit-min-device-pixel-ratio:2),
        (min-resolution:192dpi) {
            .iti__flag {
                background-image: url(../images/flags@2x.png);
            }
        }

        .iti__flag.iti__np {
            background-color: transparent
        }

        @keyframes pinbounce-marker {
            0% {
                transform: translateY(-32px)
            }

            40% {
                transform: translateY(-12px)
            }

            80% {
                transform: translateY(-22px)
            }

            to {
                transform: translateY(-12px)
            }
        }

        div#countryDetector i#flag {
            transform: translateX(-50%);
            left: 50%;
            top: 18px;
            position: absolute
        }

        .iti__flag.np {
            background-color: transparent
        }

        .genBtn .table {
            pointer-events: none
        }

        #popupID {
            left: -4000px
        }

        .rtl .footer {
            right: 0;
            left: auto;
            bottom: -82px;
            position: absolute
        }

        .rateit {
            display: inline-block;
            position: relative;
            user-select: none
        }

        .rateit .rateit-range {
            position: relative;
            display: inline-block;
            background: url("star.gif");
            height: 16px;
            outline: 0
        }

        .rateit .rateit-range * {
            display: block
        }

        * html .rateit,
        * html .rateit .rateit-range {
            display: inline
        }

        *+html .rateit,
        *+html .rateit .rateit-range {
            display: inline
        }

        .rateit .rateit-hover,
        .rateit .rateit-selected {
            position: absolute;
            left: 0;
            top: 0;
            width: 0
        }

        .rateit .rateit-hover-rtl,
        .rateit .rateit-selected-rtl {
            left: auto;
            right: 0
        }

        .rateit .rateit-hover {
            background: url("star.gif") left -32px;
            color: var(--primary-color)
        }

        .rateit .rateit-hover-rtl {
            background-position: right -32px
        }

        .rateit .rateit-selected {
            background: url("star.gif") left -16px;
            color: var(--primary-color)
        }

        .rateit .rateit-selected-rtl {
            background-position: right -16px
        }

        .rateit .rateit-preset {
            background: url("star.gif") left -48px;
            color: var(--primary-color)
        }

        .rateit .rateit-preset-rtl {
            background: url("star.gif") left -48px
        }

        .rateit button.rateit-reset {
            background: url("delete.gif") 0 0;
            width: 16px;
            height: 16px;
            display: inline-block;
            outline: 0;
            border: 0;
            padding: 0
        }

        .rateit .rateit-reset span {
            display: none
        }

        .rateit button.rateit-reset:hover,
        .rateit button.rateit-reset:focus {
            background-position: 0 -16px
        }

        .rateit-font {
            font-size: 24px;
            line-height: 1em;
            margin-top: 30px;
            margin-bottom: 25px
        }

        .rateit-font .rateit-range {
            background: 0 center;
            height: auto
        }

        .rateit-font .rateit-empty {
            color: #878787
        }

        .rateit-font .rateit-range>div {
            background: 0 center;
            overflow: hidden;
            cursor: default;
            font-size: 30px
        }

        .rateit.rateit-font .rateit-reset {
            font-size: inherit;
            width: .6em;
            height: .6em;
            margin-top: .2em;
            background: gray;
            border-radius: 50%;
            position: relative;
            display: none !important
        }

        .rateit.rateit-font .rateit-reset span {
            display: block;
            font-weight: bold;
            color: white;
            height: calc(50% - .045em);
            top: 0;
            position: absolute;
            border-bottom: .09em solid white;
            width: 72%;
            margin-left: 14%
        }

        .rateit.rateit-font .rateit-reset: hover,
        .rateit.rateit-font button.rateit-reset:focus {
            background: radial-gradient(at center center, #ee2e22 55%, #ee2e22 77%, #ee2e22 100%) 0 0
        }

        .rating-popup .title {
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 16px;
            color: #878787;
            max-width: 245px;
            margin-left: auto;
            margin-right: auto;
            position: relative;
            display: block
        }

        .rating-popup .sub-title {
            font-size: 13px;
            color: #878787
        }

        .rating-popup.errorpopup {
            padding-top: 35px
        }

        .rating-popup.errorpopup .buttons-container {
            position: relative;
            display: block
        }

        .rating-popup.errorpopup .buttons-container .notice {
            position: absolute;
            top: -4px;
            left: 0;
            width: 100%;
            text-align: center;
            font-size: 12px;
            color: #b22d00
        }

        .rating-popup.errorpopup .button {
            font-family: inherit;
            min-width: 90px;
            position: relative;
            margin-right: 4px;
            display: inline-block;
            background-color: var(--primary-color);
            color: #fff
        }

        .rating-popup.errorpopup .button.white {
            background-color: #fff;
            border: 1px solid #eee;
            color: var(--primary-color)
        }

        .ng-hide {
            display: none !important
        }

        ng-map {
            position: relative;
            display: block;
            height: 100% !important;
            width: 100% !important
        }

        .categories ul>li .title {
            text-transform: uppercase
        }

        .rtl .meta .title {
            float: right;
            padding-right: 27px;
            text-align: right !important
        }

        .rtl .title {
            font-family: inherit !important
        }

        .rtl .customizedID .data .title {
            line-height: 30px
        }

        .rtl .customizedID .addRemoveWrap {
            float: right;
            margin-right: 5px
        }

        .rtl .itemBags .title {
            text-align: left !important
        }

        .footer .menu .link li span {
            text-transform: uppercase
        }

        .market .itemsList .itemGrid .picture img {
            height: auto;
            width: 100%;
            margin: auto;
            transform: translateX(-50%);
            left: 50%;
            padding-top: 0;
            padding-bottom: 10px
        }

        .market .newsCtrl .itemsList .itemGrid .picture img {
            padding-top: 0
        }

        .deskmenu .logo img {
            max-width: calc(100% - 73px);
            margin-bottom: 14px;
            max-height: 180px;
            margin-top: 14px
        }

        .rtl .deskmenu .logo {
            display: inline-block
        }

        .retail .deskmenu .logo img {
            max-width: 187px
        }

        .deskmenu .logo {
            text-align: center;
            align-items: center;
            display: flex;
            margin-bottom: 11px;
            margin-top: 8px;
            cursor: pointer
        }

        .subPage .MenuParts {
            z-index: 3
        }

        .homePid .catReplaceID {
            display: none !important
        }

        .homePid .swiperID.fix {
            position: relative;
            top: auto
        }

        .customDropDown .drop_options {
            overflow-y: auto
        }

        .homePid .swiperID.fix .swiper-slide .picture {
            visibility: visible
        }

        .loginRegisterID .btnClose .zmdi-close,
        .loginRegisterID .btnClose .zmdi-close-circle {
            color: var(--primary-color)
        }

        .categories ul>li .picture span {
            text-align: center;
            font-family: Roboto, sans-serif;
            font-weight: bold;
            font-size: 22px;
            color: #fff;
            padding-top: 33px;
            position: relative;
            display: block
        }

        .MenuParts .signedUser {
            display: block;
            cursor: pointer
        }

        input::-webkit-outer-spin-button,
        input::-webkit-inner-spin-button {
            appearance: none;
            margin: 0
        }

        .calIco {
            position: absolute;
            right: 6px;
            top: 13px;
            width: 19px;
            text-align: center;
            height: 19px;
            pointer-events: none;
            z-index: 2;
            background: #f7f7f7;
            padding-left: 17px
        }

        .signupform .calIco {
            background: transparent;
            margin-top: 6px;
            margin-right: 8px
        }

        .date.inputWrap .calIco {
            padding-left: 0;
        }

        .date.inputWrap.focused .label {
            right: 50px !important
        }

        .categories .inside li a {
            cursor: pointer
        }

        label.missing {
            position: absolute;
            top: -12px;
            font-size: 9px;
            color: #333;
            background-image: initial;
            background-position: initial;
            background-size: initial;
            background-repeat: initial;
            background-attachment: initial;
            background-origin: initial;
            background-clip: initial;
            right: 15px;
            border-radius: 3px;
            padding-top: 4px;
            padding-bottom: 4px;
            z-index: 2;
            text-transform: uppercase;
            box-shadow: rgba(0, 0, 0, 0.05) 0 3px 6px, rgba(0, 0, 0, 0.05) 0 3px 6px;
            background-color: #fffad3 !important;
            padding-left: 6px !important;
            padding-right: 6px !important
        }

        span.missing-phone {
            position: absolute;
            top: -10px;
            font-size: 11px;
            color: #fff;
            background: #333;
            right: 8px;
            border-radius: 0;
            padding: 4px;
            z-index: 3
        }

        .modal.smallType1 {
            height: auto;
            padding-right: 27px;
            padding-left: 27px;
            min-width: 290px;
            border-radius: 6px;
            background-color: #fff !important
        }

        .smallType1 .title,
        .smallType2 .title {
            position: relative;
            min-height: 49px;
            width: auto;
            margin-bottom: 12px;
            margin-top: 39px;
            text-align: center;
            font-size: 20px;
            color: #4d4d4c;
            font-weight: bold
        }

        .smallType2 .title {
            margin-bottom: 39px
        }

        .modal.smallType1,
        .modal.smallType2 {
            max-width: 280px
        }

        .smallType1 .title {
            margin-bottom: 7px;
            width: 100%;
            text-align: center;
            position: relative;
            font-weight: bold;
            font-size: 20px;
            color: #4d4d4c
        }

        .smallType1 .custText {
            width: 70%;
            text-align: center;
            position: relative;
            font-weight: 400;
            font-size: 14px;
            color: #4c4c4c;
            line-height: 20px;
            margin: -9px auto 39px
        }

        .smallType1 .moreBtn {
            margin-right: 0 !important
        }

        .smallType1 .genBtn,
        .smallType1 .moreBtn,
        .modal.smallType2 .genBtn,
        .modal.smallType2 .moreBtn {
            margin-bottom: 23px;
            width: calc(50% - 6px);
            font-size: 14px;
            height: 50px;
            float: left;
            margin-right: 11px
        }

        .modal.smallType2 .genBtn {
            width: 100%;
            margin-top: 23px
        }

        .smallType1 .btnClose {
            display: none
        }

        .rtl .smallType1 .moreBtn,
        .rtl .smallType1 .loadMore {
            font-family: inherit
        }

        .modal.smallType2 {
            height: auto;
            background-color: #fff;
            padding-right: 27px;
            padding-left: 27px;
            min-width: 294px;
            border-radius: 6px
        }

        .ngProgressLite {
            pointer-events: none;
            position: fixed;
            top: 0;
            left: 0;
            z-index: 80000033;
            width: 100%
        }

        .ngProgressLiteBar {
            background: var(--primary-color);
            position: relative;
            height: 2px;
            width: 0;
            box-shadow: 0 0 0 var(--primary-color), 0 0 2px var(--primary-color)
        }

        .checkoutID .withBagOnRight .myBagModule {
            display: block
        }

        .rtl .myBagModule {
            right: auto;
            left: 0
        }

        .mob.loadMore {
            display: none !important
        }

        .box_delivery {
            min-height: 0
        }

        .box_delivery.loc .boxData {
            min-height: auto
        }

        .box_delivery.loc .boxData .office {
            height: 126px
        }

        .box_delivery.mapnaddress {
            min-height: 287px;
            position: relative
        }

        .box_delivery.buttonco {
            background-color: transparent;
            box-shadow: none
        }

        .box_delivery .moreBtn {
            width: 80%;
            display: block;
            margin: 0 auto
        }

        .box_feedback .feed.missing {
            border: 1px solid var(--primary-color)
        }

        .box_feedback .items .item .text .time {
            text-transform: uppercase
        }

        .rtl .box_feedback .items .item .text .time {
            text-align: right;
            padding-right: 10px;
            height: 29px
        }

        .box_feedback .items .item .r-ico {
            position: absolute;
            left: 0;
            top: 0;
            width: 44px;
            height: 44px;
            border-radius: 50px;
            overflow: hidden;
            text-align: center;
            font-family: Roboto, sans-serif;
            font-size: 13px;
            line-height: 44px;
            color: #fff;
            font-weight: 300;
            background-color: #737373
        }

        .box_feedback .items .item.from-me .r-ico {
            background-color: var(--primary-color);
            right: 0;
            left: auto
        }

        .box_feedback .items .item .r-ico span {
            position: relative;
            width: 100%;
            display: block
        }

        .box_feedback .items .item .r-ico img {
            vertical-align: middle;
            max-width: 150%;
            position: absolute;
            height: auto;
            transform: translateX(-50%) translateY(-50%);
            margin-top: 50%;
            margin-bottom: 50%
        }

        .specialTable .cell {
            padding-bottom: 15px
        }

        .specialTable .cell.adjs {
            text-transform: capitalize
        }

        .inProgress {
            cursor: default;
            opacity: .3;
            pointer-events: none
        }

        .receiptPid .fullThankyou .moreBtn {
            visibility: visible;
            margin-bottom: 27px;
            margin-top: 34px;
            line-height: 57px;
            font-size: 13px;
            font-weight: bold;
            cursor: pointer
        }

        .receiptPid .fullThankyou .moreBtn.greyBtn {
            background-color: transparent;
            border: 0;
            color: #333;
            width: 290px;
            margin-top: 5px !important
        }

        .receiptPid .fullThankyou .moreBtn.greyBtn .timing {
            text-transform: lowercase
        }

        .no-data-found {
            font-family: inherit;
            font-size: 15px;
            color: #4d4d4c;
            margin-bottom: 30px;
            text-align: center;
            margin-top: 29px
        }

        [ ng\:cloak],
        [ng-cloak],
        [data-ng-cloak],
        [x-ng-cloak],
        .ng-cloak,
        .x-ng-cloak {
            display: none !important
        }

        .footer .menu .link li.selected span {
            color: var(--primary-color)
        }

        a.selected {
            color: var(--primary-color) !important
        }

        .editAddAddress .setAsDefaultInput {
            height: auto;
            min-height: 18px;
            text-align: center;
            white-space: nowrap;
            z-index: 1;
            margin-top: 22px
        }

        .editAddAddress .setAsDefaultInput: empty {
            display: none
        }

        .editAddAddress .setAsDefaultInput .error {
            position: absolute;
            top: 0;
            left: auto;
            padding: 10px 10px 10px 1px;
            margin-top: -1px;
            margin-bottom: -27px;
            text-align: left;
            color: #999 !important
        }

        .forgotPassID .error {
            bottom: auto;
            left: auto;
            margin-top: 6px;
            position: absolute;
            top: 77px;
            width: 100%;
            color: #e22020 !important
        }

        .no-items-found {
            position: relative;
            display: block;
            font-size: 15px;
            color: #b1b1b1;
            text-align: center;
            width: 100%;
            margin: 55px auto auto
        }

        .no-items-found .genBtn {
            width: 147px;
            margin-top: 14px;
            margin-left: auto;
            margin-right: auto
        }

        .column_cust .block .textarea textarea {
            height: 100%;
            background-color: transparent
        }

        .box_instruction.notesCss .textarea textarea {
            height: 55px;
            padding-left: 1px
        }

        .box_instruction.notesCss .textarea textarea::placeholder {
            color: #999 !important
        }

        .box_instruction.notesCss .textarea textarea:focus {
            border: 1px solid #eee !important
        }

        .box_instruction.notesCss .textarea textarea:focus::placeholder {
            color: #fff !important
        }

        .rtl .box_instruction.notesCss .textarea textarea {
            font-family: inherit;
            font-size: 12px
        }

        .box_feedback .items .item .text .desc {
            font-size: 15px !important
        }

        .rtl .box_feedback .items .item .text .desc {
            text-align: right;
            font-family: inherit;
            padding-right: 10px
        }

        .myAccountPid .error {
            bottom: -32px;
            width: 100%
        }

        #updateContactInfoId .error {
            left: 0;
            position: absolute;
            font-size: 13px;
            text-align: center;
            bottom: -24px;
            color: #666 !important
        }

        .add-tofav-guideline {
            font-family: inherit;
            font-size: 18px;
            color: #b1b1b1;
            text-align: center;
            max-width: 264px;
            margin: auto
        }

        li.add-tofav-guideline::before {
            font: 119px / 1 Material-Design-Iconic-Font;
            content: "\F27C";
            margin-right: 10px;
            color: #eee;
            display: block;
            margin-bottom: 25px
        }

        .retail li.add-tofav-guideline::before {
            content: "\F15E"
        }

        .normalForm .inputWrap.date input {
            min-height: 22px
        }

        #gotomarker {
            right: 0;
            top: 0 !important;
            z-index: 2147483647 !important
        }

        .gotomarker {
            cursor: pointer;
            width: 28px;
            height: 23px;
            background: #fff;
            margin-right: 10px;
            color: #666;
            font-size: 17px;
            text-align: center;
            padding-top: 4px
        }

        .gotomarker: hover {
            color: #333;
            background-color: #eee
        }

        .getcurrentlocation: hover {
            color: #333;
            background-color: #eee
        }

        .checkoutID .box_delivery .genBtn {
            width: 100%
        }

        .checkoutID .box_delivery .genBtn.disabled {
            width: 100%;
            cursor: default;
            background-color: #eaeaea !important;
            border: none !important;
            color: #7f7f7f !important
        }

        .pinLocation {
            background-color: #eee;
            display: none !important
        }

        .fixedmap-label {
            position: absolute;
            left: 0;
            bottom: 0;
            background: #484848;
            width: 100%;
            margin: auto auto auto 50%;
            text-align: center;
            transform: translate3d(-50%, 0px, 0px);
            color: #fff;
            z-index: 2;
            cursor: pointer;
            font-family: inherit;
            font-size: 14px;
            font-weight: bold;
            height: 45px;
            line-height: 43px
        }

        .fixedmap-label::before {
            position: absolute;
            content: "";
            height: 162px;
            width: 100%;
            bottom: -1px;
            left: 0
        }

        .editableMap {
            visibility: hidden;
            position: fixed;
            left: -10000px;
            top: 0;
            z-index: 10;
            width: 100%;
            height: 100%;
            background-color: #aadaff
        }

        .editableMap::before {
            background-image: url("../../assets/images/marker.png");
            width: 60px;
            height: 60px;
            position: absolute;
            z-index: 641;
            top: calc(50% - 20px);
            left: 50%;
            transform: translate3d(-50%, -50%, 0px);
            background-repeat: no-repeat;
            background-position: center center
        }

        .editableMap .mylocation-big-map {
            font-family: Roboto, sans-serif;
            position: absolute;
            left: 0;
            bottom: 50px;
            background: var(--primary-color);
            width: 65%;
            margin: auto auto auto 15px;
            padding: 8px 31px 8px 8px;
            text-align: center;
            color: #fff;
            border: 2px solid var(--primary-color);
            z-index: 100;
            cursor: pointer;
            font-size: 14px;
            font-weight: bold;
            box-sizing: border-box;
            height: 53px;
            line-height: 36px;
            border-radius: 5px 0 0 5px
        }

        .rtl .mylocation-big-map.ng-binding {
            font-family: inherit
        }

        .editableMap .mylocation-big-map i {
            margin-right: 8px
        }

        .editableMap .close-big-map {
            font-family: Roboto, sans-serif;
            position: absolute;
            right: 0;
            bottom: 50px;
            background: #404040;
            width: 35%;
            text-align: center;
            color: #fff;
            z-index: 100;
            cursor: pointer;
            font-weight: bold;
            font-size: 14px;
            height: 53px;
            line-height: 53px;
            margin-right: 11px;
            border-radius: 0 5px 5px 0
        }

        .rtl .editableMap .close-big-map {
            font-family: inherit
        }

        .editableMap .notificationCtn {
            position: absolute;
            bottom: 155px;
            left: 0;
            width: 100%;
            min-height: 30px;
            text-align: center;
            display: none
        }

        .editableMap .notification {
            font-family: inherit;
            background: rgba(0, 0, 0, 0.77);
            color: #fff;
            font-size: 14px;
            padding: 6px 10px;
            transform: translate3d(0px, -10px, 0px);
            transition: all .25s ease-in-out 0s;
            position: relative;
            z-index: 33333;
            text-align: center;
            opacity: 0;
            display: inline-block;
            max-width: 80%;
            border-radius: 5px
        }

        .editableMap .notification.show {
            opacity: 1;
            transform: translate3d(0px, 0px, 0px)
        }

        .rtl .closeOrderdetails {
            left: -18px;
            right: auto
        }

        div#AddAddressModalID .normalForm .input {
            width: auto
        }

        .no-map .inputWrap.textarea .input,
        .no-map .inputWrap.textarea .input textarea {
            height: 47px;
            padding-top: 10px;
        }

        textarea::placeholder {
            color: #999
        }

        .modal.noCustomization.largetxt .head {
            width: 50%;
            min-height: 600px
        }

        .modal.noCustomization.largetxt .cont {
            width: 50%;
            background-color: #f9f6f6;
            min-height: 599px;
        }

        .rtl .modal.noCustomization .onRight .bTitle {
            text-align: center
        }

        #bobPaymentsModalID .mainTitle {
            text-align: center;
            padding-top: 25px;
            display: none
        }

        #bobPaymentsModalID .line {
            margin: 22px auto 0;
            display: none
        }

        .box_date .title {
            margin-bottom: 16px;
            position: relative;
            font-family: inherit;
            font-weight: bold;
            font-size: 19px;
            color: #444;
            display: none
        }

        .rtl .orderdetails .title {
            text-align: right
        }

        .rtl .footer .menu .link .title {
            text-align: left
        }

        .gotomarker::after {
            content: "re-center";
            position: absolute;
            bottom: -1px;
            left: 28px;
            font-size: 12px;
            top: 8px;
            color: #333
        }

        .gotomarker {
            cursor: pointer;
            width: 85px;
            height: 37px;
            background: #fff;
            margin-right: 10px;
            color: #666;
            font-size: 17px;
            padding-top: 10px;
            position: absolute;
            top: 10px;
            right: 0;
            box-sizing: border-box;
            text-align: left;
            padding-left: 11px;
            border-bottom: 1px solid #ccc;
            line-height: 18px
        }

        #getcurrentlocation {
            top: 0 !important;
            right: 86px !important
        }

        .getcurrentlocation {
            cursor: pointer;
            width: 106px;
            height: 37px;
            background: #fff;
            margin-right: 10px;
            color: #666;
            font-size: 17px;
            padding-top: 10px;
            position: absolute;
            top: 10px;
            right: 0;
            box-sizing: border-box;
            text-align: left;
            padding-left: 8px;
            border-bottom: 1px solid #ccc;
            line-height: 18px
        }

        .getcurrentlocation::after {
            content: "my location";
            position: absolute;
            bottom: -1px;
            left: 30px;
            font-size: 12px;
            top: 8px;
            color: #333
        }

        @media only screen and (min-width:769px) {
            .withBagOnRight .nearBag.gridSystem ul:first-child {
                min-width: calc(100% - 0px);
                min-height: 0 !important;
            }

            .rtl .withBagOnRight .nearBag.gridSystem ul: first-child {
                float: none
            }

            .menuontop .homeFilter .filter input:: placeholder {
                color: #999
            }

            .menuontop .homeFilter .filter input {
                color: #333;
                font-size: 19px;
                padding-left: 0 !important
            }

            .homePid .gridSystem .case {
                margin-bottom: -7px;
                padding-bottom: 0 !important
            }

            .menuontop .applinks {
                display: none
            }

            .menuontop .deskmenu .menu li ul {
                width: max-content;
                left: 0;
                text-align: left;
                margin-left: -8px
            }

            .menuontop .homeFilter.ontop .filter {
                height: 53px;
                display: block;
                pointer-events: none;
                overflow: hidden;
                width: calc(100% - 103px);
                margin: 0 auto auto;
                box-sizing: border-box;
                position: relative;
                padding-top: 0;
                background-color: #fff !important
            }

            .menuontop .homeFilter.ontop {
                height: 0;
                transition: all .2s linear 0s;
                display: block;
                position: fixed;
                overflow: hidden;
                left: 0 !important;
                background-color: #fff !important;
                border-radius: 0 !important;
                top: 71px !important;
                margin-top: 0 !important;
                transform: none !important
            }

            .menuontop .socials .social {
                filter: invert(1);
                opacity: .7
            }

            .menuontop .shopmenu {
                display: block
            }

            .menuontop .deskmenu .menu li ul li span {
                font-weight: 500
            }
        }

        @media only screen and (max-width:768px) {
            div#createAccountModalID.show {
                padding-bottom: 0;
                border-radius: 0
            }

            .loginRegisterID .parts .right {
                padding-bottom: 28px;
                padding-right: 0 !important
            }

            #loginFormID {
                margin-top: -13px
            }

            #createAccountModalID .error {
                width: 100%;
                bottom: -14px !important;
                text-align: center !important
            }

            #pinPayPopUp .title {
                margin-top: 34px;
                text-transform: uppercase !important
            }

            .createAccountID .genBtn {
                margin-bottom: 40px;
                margin-top: 40px
            }

            .favoritePid .generalMainTitle {
                padding-top: 33px;
                padding-bottom: 13px
            }

            .generalMainTitle {
                padding-left: 14px;
                padding-bottom: 19px;
                box-sizing: border-box
            }

            .rtl .generalMainTitle {
                text-align: right
            }

            .closeNew .zmdi-close-circle {
                margin-left: 9px
            }

            .customizedID .addToFav {
                width: 100%;
                text-align: center;
                text-transform: uppercase;
                position: absolute;
                top: -58px
            }

            .fnb .customizedID .addToFav {
                position: relative;
                bottom: auto;
                top: 68px
            }

            #customizedModalID .addToFav {
                background-color: #eee;
                width: 100% !important
            }

            .customizedID .addToFav .ico {
                position: relative;
                width: 17px;
                display: inline-block;
                top: -9px
            }

            .customizedID .addToFav .ico .heart {
                top: 1px
            }

            .customizedID .addToFav .txt {
                display: inline-block;
                padding-left: 8px;
                font-size: 14px
            }

            .thebig-ul {
                min-height: 800px
            }

            .add-tofav-guideline {
                font-family: Roboto, sans-serif;
                font-size: 15px;
                text-align: center;
                color: #999;
                margin-top: 40%
            }

            li.add-tofav-guideline::before {
                content: "\F15E";
                font-family: Material-Design-Iconic-Font;
                color: var(--primary-color);
                font-size: 35px;
                display: block;
                margin-bottom: 18px
            }

            .no-data-found {
                font-size: 15px;
                color: #999;
                margin-bottom: 30px;
                text-align: center;
                display: none
            }
        }

        @media(max-width:768px) {
            .loginRegisterID .listingAccount {
                margin-top: -202px;
                visibility: hidden
            }

            .label::before {
                position: absolute;
                content: "";
                inset: -10px -10px -10px -24px;
                z-index: 1
            }

            .normalForm input {
                height: 100%
            }

            .whiteBox .boxes .box .pen::before {
                position: absolute;
                content: "";
                inset: -10px -10px -10px -24px
            }

            .whiteBox .boxes .box .pen::before {
                position: absolute;
                content: "";
                inset: -10px -10px -10px -24px
            }

            .whiteBox .boxes .box .delete::before {
                position: absolute;
                content: "";
                inset: -10px -18px -10px -10px
            }

            .itemGrid .heart .zmdi::after {
                position: absolute;
                content: "";
                inset: -9px -28px -33px -24px
            }

            .zmdi-menu::after {
                position: absolute;
                content: "";
                inset: -24px 13px -24px -15px;
                width: 65px
            }

            .mobileMenuWrap ul li a::before {
                position: absolute;
                content: "";
                inset: -10px 154px -10px -24px
            }

            .myBagModule .itemBags .icons .ico::before {
                position: absolute;
                content: "";
                top: -13px;
                width: 36px;
                left: -10px;
                bottom: -8px
            }

            body {
                visibility: visible;
                height: auto;
                min-height: unset
            }

            .pbody {
                padding-top: 10px;
                padding-right: 10px;
                padding-left: 10px;
                box-sizing: border-box;
                padding-bottom: 0 !important;
                width: calc(100%) !important;
            }

            .pbody li {
                margin-bottom: 12px;
                margin-top: 9px
            }
        }

        @media(min-width:769px) {
            body {
                visibility: visible
            }

            .menuontop .MenuParts.fix .parts {
                width: calc(100% - 100px);
                position: relative;
                margin: auto
            }

            .menuontop .MenuParts.fix {
                background-color: #fff;
                height: 71px;
                z-index: 12;
            }

            .menuontop .MenuParts .parts .bot {
                background-color: #fff;
                border-bottom: 1px solid #ddd
            }

            .reviewBox .rBox {
                width: calc(60% - 20px)
            }

            .menuontop .reviewBox .left.rBox {
                width: calc(42% - 20px)
            }

            .notloggedin .reviewBox .left.rBox {
                margin-top: 16px;
            }

            .menuontop .right.rBox {
                width: calc(60% - 20px)
            }

            .pemail .lblText {
                border-top: 0 solid #eee;
                border-bottom: 1px solid #eee;
                width: 95.4%
            }

            .rtl .pemail .lblText {
                margin-left: auto;
                margin-right: 26px
            }

            .createAccountID .normalForm {
                display: inline-block
            }

            .box_feedback .feed textarea {
                border-top: 0
            }

            .orderdetails .box_feedback {
                margin-bottom: 73px;
                background-color: #eee;
                border: 1px solid #ddd
            }

            .orderdetails .box_feedback .feed {
                width: calc(100% - 26px);
                bottom: 15px;
                border: 1px solid #ccc;
                box-sizing: border-box;
                box-shadow: rgba(0, 0, 0, 0.08) 0 3px 6px, rgba(0, 0, 0, 0.08) 0 3px 6px;
                left: 13px;
                animation-name: bounce;
                animation-duration: 1s;
                animation-fill-mode: both
            }

            .orderdetails .subTotalBox {
                min-height: 120px
            }

            .orderdetails .itemBags {
                width: 100%;
                margin: auto
            }

            .orderdetails .reviewBox .rBox .wrap {
                width: 100%
            }

            .orderdetails .bagScroll {
                width: 100%;
                padding: 30px
            }

            .orderdetails .minitotal {
                display: none
            }

            .orderdetails .bagph {
                display: none
            }

            .orderdetails .myBagModule {
                position: relative
            }

            .orderdetails .reviewBox .rBox {
                width: 100%
            }

            .orderdetails .box_delivery .boxData {
                width: 100%;
                float: none;
                display: block
            }

            .orderdetails .reviewBox .rBox.left {
                background-color: transparent;
                display: block;
                float: right;
                width: 100%;
                min-height: 150px;
                margin-right: 0;
                z-index: 1
            }

            .orderdetails .location.editM {
                position: absolute
            }

            .orderdetails .box_delivery .office {
                margin-top: 0;
                width: 100%;
                border-top: 1px solid #eee;
                border-bottom: 1px solid #eee
            }

            .orderdetails .orders .order .withTitle {
                display: block;
                float: none;
                width: 100%
            }

            .menuontop .newAddress.nonead.add {
                background-color: #f8f8f8
            }

            .addAddress .newAddress .ico {
                margin-left: -13px
            }

            .newAddress.edit .ico {
                margin-right: -24px
            }

            .box_delivery .btm {
                height: 34px
            }

            .menuontop .checkoutID .mCSB_container {
                height: calc(100% - 87px) !important
            }

            .box_instruction .label {
                font-size: 15px
            }

            .reviewBox .rBox.left {
                background-color: #fff;
                width: 40%
            }

            .noCustomization .genBtn {
                width: 100%
            }

            .clear-bag {
                font-size: 9px !important
            }

            .myBagModule .itemBags .icons .ico .zmdi-delete {
                margin-left: 0
            }

            .retail #customizedModalID .addToFav {
                margin-top: 26px !important
            }

            .retail #customizedModalID .addToFav {
                right: 36px !important
            }

            .customizedID .genBtn::before {
                content: attr(data-nbofcalories);
                position: fixed;
                left: 22px;
                font-weight: bold;
                opacity: 1;
                color: #fff;
                height: 58px;
                line-height: 59px;
                font-size: 13px;
                z-index: 3;
                letter-spacing: 0;
            }

            .checkoutID .notloggedin .box_delivery .genBtn {
                left: 50%;
                transform: translateX(-50%);
                bottom: -29px;
                display: none;
                margin-top: 28px !important;
                position: absolute !important
            }

            .retail .checkoutID .notloggedin .box_delivery .genBtn {
                left: auto;
                transform: none;
                display: none;
                position: relative !important;
                margin: auto !important
            }

            .retail .flmenubtn.retailonly {
                display: none !important
            }

            div#loginRegisterModalID {
                border-radius: 8px;
                max-width: 375px
            }

            .createAccountID .parts .part {
                box-sizing: border-box
            }

            .createAccountID .parts .part.right {
                padding-left: 12px
            }

            .createAccountID .parts .part .input {
                width: 100%
            }
        }

        @media(max-width:768px) {
            .locale-select-top {
                display: none
            }

            .noOrder .locale-select-top {
                display: block
            }
        }

        .locale-select-top {
            height: 36px;
            overflow: hidden;
            float: left;
            margin-right: -7px;
            padding-top: 10px;
            box-sizing: border-box;
            padding-left: 11px;
            position: relative;
            padding-right: 26px;
            width: 61px;
            background-color: rgba(0, 0, 0, 0.29)
        }

        .noOrder .locale-select-top: first-child {
            display: none
        }

        .noOrder .locale-select-top: last-child {
            margin-right: 0;
            margin-top: -1px
        }

        .locale-select-top::after {
            right: 16px;
            position: absolute;
            top: 9px;
            content: "\F2F2";
            font: 20px / 1 Material-Design-Iconic-Font;
            color: #fff;
            pointer-events: none
        }

        .noOrder .select-locale-top.menuList {
            display: block
        }

        .onelanguage.noOrder .select-locale-top.menuList {
            display: none
        }

        .locale-select-top select {
            background-color: transparent;
            color: #fff;
            text-transform: uppercase;
            border: 0;
            font-size: 12px;
            width: 47px;
            font-weight: bold
        }

        .locale-select-top option {
            color: #333
        }

        .subPage .categories li a::before {
            position: absolute;
            content: "";
            top: -23px;
            width: 100%;
            left: -1px;
            bottom: -21px
        }

        @media(max-width:768px) {
            .errorpopup {
                padding-top: 14%
            }
        }

        .errorpopup .message::before {
            content: "\F1F7";
            font-family: Material-Design-Iconic-Font;
            color: var(--primary-color);
            font-size: 35px;
            display: block;
            margin-bottom: 18px
        }

        .errorpopup .button {
            width: calc(50% - 17px);
            font-size: 14px;
            cursor: pointer;
            height: 47px;
            line-height: 47px;
            text-transform: uppercase;
            text-align: center;
            box-sizing: border-box;
            font-family: inherit;
            display: inline-block;
            border-radius: 10px
        }

        .errorpopup .button.switch {
            background-color: var(--primary-color);
            color: #fff;
            border: 0
        }

        .errorpopup .button {
            border: 1px solid #ccc;
            background-color: #fff;
            color: var(--primary-color);
            margin-top: 34px;
            margin-left: 4px;
            margin-right: 4px
        }

        div#countryDetector .button.switch {
            width: 110px;
            position: absolute;
            bottom: 10px;
            height: 35px;
            border-radius: 5px;
            font-size: 12px;
            line-height: 35px
        }

        div#countryDetector .button {
            right: 22px;
            left: auto
        }

        .rtl div#countryDetector .button.switch {
            line-height: 19px
        }

        div#countryDetector .button.white {
            width: 110px;
            position: absolute;
            bottom: 10px;
            left: 19px;
            height: 35px;
            border-radius: 5px;
            font-size: 12px;
            background-color: #fff;
            line-height: 35px
        }

        .rtl div#countryDetector .button.white {
            line-height: 19px
        }

        .errorpopupoverlay {
            position: fixed;
            bottom: 0;
            transform: translate3d(0px, 0px, 0px);
            height: 0;
            width: 100%;
            z-index: 888888888;
            background-color: rgba(0, 0, 0, 0);
            transition: background-color .3s linear 0s;
            pointer-events: none
        }

        .errorpopupoverlay.show {
            background-color: rgba(0, 0, 0, 0.6);
            height: 100%;
            pointer-events: all
        }

        .errorpopupoverlay.loading {
            background-repeat: no-repeat;
            background-position: center center;
            background-color: rgba(0, 0, 0, 0.6)
        }

        @keyframes spinner {
            100% {
                transform: rotate(360deg)
            }
        }

        .errorpopupoverlay.loading::before {
            content: "";
            box-sizing: border-box;
            position: absolute;
            top: 50%;
            left: 50%;
            width: 20px;
            height: 20px;
            margin-top: -10px;
            margin-left: -10px;
            border-radius: 50%;
            border-top: 2px solid #fff;
            border-right: 2px solid transparent;
            animation: .6s linear 0s infinite normal none running spinner
        }

        .errorpopup.show {
            transform: translateX(-50%) translateY(-49%);
        }

        .errorpopup.ebottom.loywelcome .title::before {
            content: "\F27A" !important
        }

        #saveCardConfirmation .errorpopup {
            min-height: 210px !important
        }

        div#currencyList,
        div#countryList,
        div#languageList,
        div#countryDetector {
            width: 281px;
            height: auto;
            transform: translate3d(-200%, 0px, 0px);
            bottom: auto;
            top: 18px;
            left: 18px;
            border-radius: 4px;
            padding: 0 0 7px
        }

        div#currencyList.show,
        div#countryList.show,
        div#languageList.show,
        div#countryDetector.show {
            transform: translate3d(0px, 0px, 0px);
            box-shadow: rgba(0, 0, 0, 0.13) 0 10px 20px, rgba(0, 0, 0, 0) 0 6px 6px
        }

        .multibranch div#countryList::before {
            background-color: #eee;
            position: absolute;
            width: 100%;
            left: 0;
            top: -59px;
            padding: 22px;
            box-sizing: border-box;
            font-weight: bold;
            border-bottom: 1px solid #eee;
            font-size: 14px
        }

        .multibranch #countryList.show {
            top: 44px;
            left: 36px;
            width: 300px
        }

        div#countryDetector {
            height: 200px
        }

        div#countryList .button,
        div#languageList .button {
            display: none
        }

        div#currencyList .title,
        div#countryList .title,
        div#languageList .title {
            padding-bottom: 18px;
            font-weight: bold;
            display: none
        }

        div#currencyList .title,
        div#countryList .title {
            display: block;
            background-color: #eee;
            padding: 20px;
            border-radius: 5px 5px 0 2px;
            margin-bottom: 9px
        }

        .loginRegisterID .genBtn.fbType {
            background-color: #2c4988;
            box-sizing: border-box;
            text-align: center;
            line-height: 56px;
            margin-bottom: 72px;
            width: 100%;
            display: none;
            color: #fff !important;
            border: 1px solid #2c4988 !important
        }

        .loginRegisterID .genBtn.fbType::after {
            content: "or with your email";
            position: absolute;
            top: 64px;
            color: #999;
            width: 100%;
            text-align: center;
            left: 50%;
            transform: translateX(-50%);
            text-transform: lowercase;
            pointer-events: none
        }

        .rtl .loginRegisterID .genBtn.fbType::after {
            visibility: hidden
        }

        #paymentiframe {
            position: relative;
            width: 100%;
            height: 100%;
            min-height: 480px
        }

        .socials .social.customIcons {
            height: 16px;
            position: relative;
            display: block;
            width: 17px
        }

        .socials .social.customIcons img {
            position: absolute;
            left: 0;
            top: 0;
            transition: opacity .3s ease-in-out 0s
        }

        .footer .menu .link li.customIcons .ico {
            width: 13px
        }

        .footer .menu .link li.customIcons .ico img {
            position: absolute;
            left: -1px;
            top: 0;
            transition: opacity .3s ease-in-out 0s
        }

        @media(min-width:769px) {
            .socials .social.customIcons:hover .main {
                opacity: 0
            }

            .footer .menu .link li.customIcons: hover .ico .main {
                opacity: 0
            }
        }

        .column_cust .block .extra-note {
            position: relative;
            font-weight: 400;
            font-size: 11px;
            margin-top: 8px;
            display: block;
            color: #999;
            margin-left: 2px;
            margin-right: 2px;
            line-height: 17px;
            text-align: center;
            text-transform: uppercase
        }

        .whiteBox .boxes .box .pen {
            position: absolute;
            right: 50px;
            top: 170px;
            color: #999;
            font-size: 20px;
            cursor: pointer
        }

        .editaccountp .pen {
            display: none
        }

        .whiteBox .boxes .box .delete {
            position: absolute;
            right: 16px;
            top: 170px;
            color: #999;
            font-size: 22px;
            cursor: pointer
        }

        @media(min-width:769px) {
            .whiteBox .delete:hover .zmdi {
                color: var(--primary-color)
            }

            body {
                visibility: visible;
                transition: all .2s linear 0s !important
            }

            .menuontop .parts .bot {
                background-color: #fff;
                border-bottom: 1px solid #ddd;
                height: 70px
            }

            .myBagModule .itemBags .addRemoveWrap {
                bottom: 3px
            }

            .myBagModule .itemBags .icons {
                top: 11px;
                padding-left: 15px
            }

            .menuontop .myBagModule.stick .wrapTotalBtn {
                position: absolute;
                left: 0;
                bottom: 62px;
                display: none
            }

            .reviewbag .myBagModule.stick .itemBags {
                width: calc(100% - 12px);
                padding-left: 12px
            }

            .reviewbag .myBagModule .genBtn {
                right: 15px;
                width: 269px;
                transform: none;
                left: auto
            }

            .menuontop div#popupID {
                height: calc(100% - 120px);
                top: auto;
                bottom: 0
            }

            .menuontop .searchopen div#popupID {
                margin-bottom: -56px !Important;
            }

            .menuontop .checkoutbag {
                display: none
            }

            .signupform .verifymobilewrap {
                margin-bottom: 44px;
                width: 100% !important;
                margin-top: 0px !important;
            }

            .disable-mobile-verification .signupform .verifymobilewrap {
                margin-bottom: 16px
            }

            .signupform.smssent .verifymobilewrap {
                margin-bottom: 97px;
                transition: all .3s cubic-bezier(0.4, 0, 1, 1) 0s
            }

            .signupform .inputWrap {
                width: calc(50% - 2px);
                display: inline-block
            }

            .disable-mobile-verification .inputWrap.verifymobilewrap {
                margin-top: -13px !important;
            }

            .productpage .relations .title {
                text-align: center;
                margin-top: 82px;
                font-size: 22px
            }

            .productpage .relations {
                background-color: #fff;
                padding: 0
            }

            .productpage .customizedID .head {
                min-height: 780px !important
            }

            .productpage body.showModal .backgroundModal {
                margin-top: 120px
            }

            .productpage body.showModal.subPage .backgroundModal {
                background-color: rgba(40, 37, 37, 0.7);
                transition: all .3s linear 0s
            }

            .productpage .customizedID .picture .swiper-container {
                border-color: #fff !important
            }

            .productpage .customizedID .wrap-c,
            .productpage .customizedID .head,
            .productpage .customizedID .cont {
                background-color: #fff !important
            }

            .productpage .customizedID .head,
            .productpage .customizedID .cont {
                float: right
            }

            .productpage .customizedID .cont {
                padding-top: 122px
            }

            .productpage .customizedID .wrap-c {
                display: flex;
                flex-direction: column-reverse
            }

            .productpage div#customizedModalID,
            .productpage div#customizedModalID.rigid {
                max-width: 1300px;
                box-shadow: #fff 0 0 0 1000px;
                margin-top: 0;
                transition: none 0s ease 0s;
                top: -69px !important;
                transform: translate3d(-50%, 0px, 0px) !important;
                background-color: #fff !important
            }

            .productpage div#customizedModalID .btnClose {
                filter: invert(1);
                left: 13px !important;
                top: 102px !important
            }

            .productpage div#customizedModalID .btnClose i {
                font-size: 29px
            }

            .retail .box_delivery .boxData {
                background-color: #f8f8f8
            }

            .menuontop .widgets {
                max-width: 1500px
            }

            .widgets {
                margin: auto;
                max-width: calc(100% - 30px)
            }

            .menuontop .footer {
                width: 100%
            }

            .menuontop .showminicart .footer {
                width: calc(100% - 301px)
            }

            .rtl.menuontop .showminicart .footer {
                right: 301px;
            }

            .menuontop .deskmenu li a span {
                font-family: textfont;
                font-size: 14px
            }

            .menuontop .deskmenu .menu li {
                break-inside: avoid;
                display: block
            }

            .menuontop .deskmenu .menu li.hide-coll-on-homepage {
                display: none
            }

            .menuontop .tabled {
                display: flex;
                justify-content: center;
                position: fixed;
                z-index: 2;
                top: 72px;
                width: 100%;
                left: 50%;
                transform: translateX(-50%);
                height: 50px;
                overflow: hidden;
                transition: all .2s linear 0s;
            }

            .menuontop .searchopen .tabled {
                top: 127px
            }

            .menuontop .topmenuopen .tabled {
                transition: all 0s linear 0s;
                height: calc(100vh - 105px) !important
            }

            .menuontop .deskmenu .pages {
                margin-top: -1px;
                padding-left: 15px;
                padding-right: 34px;
                width: 100%;
                box-sizing: border-box;
                height: 100%
            }

            .menuontop .deskmenu .bottom {
                position: absolute;
                width: 100%;
                height: 100%
            }

            .menuontop .bagph {
                transform: translateX(400px);
                transition: all .2s ease-in 0s
            }

            .menuontop .searchopen .bagph .myBagModule.stick {
                padding-top: 54px
            }

            .menuontop .checkoutID .bagph,
            .menuontop .checkoutID .myBagModule.stick {
                transform: translateX(0px);
                transition: all .3s linear 0s
            }

            .menuontop .showminicart .bagph {
                transform: translateX(0px);
                transition: all .2s ease-out 0s
            }

            .menuontop .content .myBagModule.stick {
                display: none !important
            }

            .menuontop .checkoutID .bagph,
            .menuontop .checkoutID .myBagModule.stick {
                transform: translateX(0px);
                transition: all .3s ease 0s
            }

            .menuontop .checkoutID .bagph,
            .menuontop .checkoutID .myBagModule.stick {
                z-index: 8
            }

            .menuontop .checkoutID .bagph .myBagModule .itemBag {
                max-width: none
            }

            .menuontop .bagph {
                top: 120px !important;
                height: calc(100vh - 120px) !important
            }

            .reviewbag .bagph {
                width: 80vw;
                background-color: #fff;
                z-index: 8
            }

            .fnb .reviewbag .bagph,
            .market .reviewbag .bagph {
                width: 80vw
            }

            .menuontop .bagph {
                z-index: 10
            }

            body.reviewbag #wrapper::before {
                content: "";
                position: fixed;
                background-color: rgba(0, 0, 0, 0.42);
                width: 4000px;
                left: 0;
                height: 100%;
                z-index: 4;
                pointer-events: none;
                top: 0
            }

            .retail body.reviewbag #wrapper: before {
                top: 71px
            }

            .menuontop .deskmenu .hotl {
                position: fixed;
                right: 52px;
                top: 9px;
                padding: 0
            }

            .enablesorting .categoryPid .titleAndLegend {
                width: calc(100% - 210px)
            }

            .rtl.enablesorting .categoryPid .titleAndLegend {
                display: inline
            }

            .delivery-date {
                padding-right: 22px;
                position: absolute;
                z-index: 1;
                right: 2px;
                padding-top: 27px;
                text-align: right !important;
                margin-bottom: -22px !important;
                color: #999 !important
            }

            .rtl .delivery-date {
                right: auto;
                left: 22px;
                direction: rtl
            }

            body.checkoutID {
                background-color: #eee;
                transition: background-color .4s linear 0s !important
            }

            .menuontop body.checkoutID {
                background-color: #eee
            }

            .delivery-address-note {
                display: none !important
            }

            .box_delivery .googleMap {
                box-sizing: border-box
            }

            .coupons .inp {
                background-color: #f8f8f8;
                border-radius: 6px
            }

            .coupons input: focus {
                background-color: #f8f8f8
            }

            .checkoutID .reviewBox {
                /* padding-top: 13px; */
            }

            .menuontop .checkoutID .notloggedin .reviewBox .left.rBox {
                min-height: 321px
            }

            .retail .column_cust.hide-product-options .line {
                width: calc(200%+32px)
            }

            .retail .column_cust .blcWrap {
                width: 100%
            }

            .market .customizedID.largetxt .picture {
                border-bottom: 0;
                height: 100%;
                display: flex;
                align-content: center;
                align-items: center;
            }

            .market .modal.noCustomization.largetxt {
                height: 600px;
                width: 950px !important;
                max-width: unset !important
            }

            .market .categoryPid .sorter {
                margin-top: -9px
            }

            .retail .customizedID .wrap form {
                width: calc(100% - 20px)
            }

            .homePid .home-collection.layout3.ng-scope .gITems .itemGrid {
                max-width: 200px;
                align-items: center
            }

            .homePid .offerslist {
                position: relative;
                margin-top: 12px
            }

            .menuontop .homePid .offerslist {
                margin-top: 15px
            }

            .homePid .offerslist::after {
                content: "";
                border-bottom: 1px solid #ddd;
                width: 100%;
                position: absolute;
                bottom: 12px;
                left: 0
            }

            .aoffer {
                max-width: 340px
            }

            #offerId .offer .picture {
                display: inline-block;
                width: 50% !important;
                margin-right: 40px !important;
                margin-bottom: 19px !important
            }

            #offerId .offer .right-side-container {
                display: inline-block;
                vertical-align: top;
                width: 40% !important
            }

            #offerId .offer .countdown-container .countdown {
                width: 200px
            }

            #offerId .offer .desc {
                margin-top: 0 !important
            }

            #offerId .offer {
                text-align: left !important
            }

            #offerId .offer .genBtn {
                margin-left: 0 !important
            }

            .offers-wrap .offer {
                width: calc(25% - 15px) !important
            }

            .offers-category-wrap .offer-category {
                width: calc(25% - 15px) !important
            }

            .offers-wrap {
                text-align: left !important
            }

            .offers-category-wrap {
                text-align: left !important
            }

            .market .subPage .case .titleAndLegend {
                margin-top: -8px !important
            }

            .market .subPage .case .titleAndLegend {
                margin-top: 14px !important
            }

            .modalParent {
                width: 100%
            }

            .rtl.multibranch .filter .zmdi {
                left: 211px !important
            }

            .checkoutID .addAddress.withEdit {
                bottom: 6px !important
            }

            .subcats {
                display: none !important
            }

            .large-menu-img .itemsList .itemGrid .descBlock .title {
                margin-top: -3px;
                padding-bottom: 0 !important
            }

            .subPage .content {
                padding-right: 15px
            }

            .menuontop .giftcards .content {
                max-width: 789px !Important;
                padding-left: 0 !important
            }

            .giftcards .content {
                padding-left: 22px
            }

            .menuontop .subPage .content {
                max-width: 1200px;
                margin: auto;
                display: block
            }

            .giftcards .content::before {
                position: absolute;
                font-family: Material-Design-Iconic-Font;
                font-size: 540px;
                color: #fafafa;
                left: -370px
            }

            .menuontop .giftcards .content: before {
                content: "\f126";
                position: absolute;
                font-family: 'Material-Design-Iconic-Font';
                font-size: 540px;
                color: #fafafa;
                left: -370px
            }

            .menuontop .searchopen .content {
                transition: all .2s ease 0s
            }

            .menuontop .categoryPid .content {
                max-width: 1300px;
                margin-top: 17px;
            }

            .subPage.checkoutID .content {
                padding-right: 14px
            }

            .fnb .subPage.checkoutID .content,
            .market .subPage.checkoutID .content {
                padding-top: 0
            }

            .fnb .subPage.checkoutID .content.notloggedin,
            .market .subPage.checkoutID .content.notloggedin {
                margin-top: -19px;
            }

            .offers-section .titleAndLegend .title {
                display: none !important
            }

            .retail .checkoutID .content {
                padding-right: 14px;
                border-radius: 7px;
                margin-top: 67px;
            }

            .not-logged-in.retail .checkoutID .content {
                margin-top: 64px;
            }

            .menuontop .checkoutID .content {
                background-color: #eee;
                padding-left: 22px;
                width: calc(100% - 353px);
                margin-left: 27px;
                margin-bottom: 62px
            }

            .menuontop .checkoutID .footer {
                width: calc(100% - 300px)
            }

            .rtl.menuontop .checkoutID .footer {
                right: 300px;
            }

            .pages .content {
                padding-top: 0
            }

            .menuontop .pages .content {
                max-width: none
            }

            .errorCustomization.overbtn {
                bottom: 0;
                width: 100%;
            }

            .formPart .lines .line {
                min-height: 22px !important
            }

            .checkoutID .withEdit .newAddress.edit {
                margin-right: 40px
            }

            .checkoutID .addAddress.withEdit {
                margin-left: 27px
            }

            .no-items-found {
                text-align: left;
                padding: 0;
                margin-left: 0;
                margin-top: 0
            }

            .rtl .no-items-found {
                text-align: right;
                direction: rtl;
                margin-left: auto;
                margin-right: 8px
            }

            .myAccountPid .whiteBox .boxes {
                padding-top: 20px;
                display: flex;
                flex-flow: row wrap;
                column-count: 2;
                align-items: start
            }

            .box_delivery .location {
                width: 100%;
                border-bottom: 1px solid #fff;
                padding-bottom: 3px
            }

            .rtl .box_delivery .location {
                width: 100%;
                float: right;
            }

            .customDropDown .drop_select {
                width: 100%;
                padding-left: 21px
            }

            .customDropDown .drop_description {
                display: block;
                float: none;
                margin-top: 24px
            }

            .drop_options .drop_description {
                margin-top: 0
            }

            .rtl .drop_options .drop_description {
                padding-right: 0
            }

            .editAddAddress .iti .iti__flag-container {
                margin-left: 3px
            }

            .mobileMenuWrap {
                display: none
            }

            header {
                margin-top: 0
            }

            .pages .header {
                margin-top: -87px
            }

            .menuMob {
                display: none !important
            }

            .menuList.bag {
                border-radius: 5px
            }

            .formPart .input .label {
                line-height: 17px;
                font-size: 14px;
                margin-bottom: 0;
                width: 98px !important;
                height: auto !important
            }

            .tinyselect select {
                width: 53px !important
            }

            .tinyselect {
                width: 39px !important;
                margin-right: 5px !important
            }

            .tinyselect::after {
                content: "" !important
            }
        }

        @media only screen and (max-width:768px) {
            .go-back {
                cursor: pointer;
                top: -3px;
                left: 47px;
                height: 62px;
                width: 36px;
                transition: all .3s cubic-bezier(0.42, 0, 0.6, 1.17) 0s;
                opacity: 0;
                transform: scale(0)
            }

            .retail .go-back {
                top: -12px
            }

            .go-back.has-go-back {
                cursor: pointer;
                transition: all .3s cubic-bezier(0.42, 0, 0.6, 1.17) .2s;
                opacity: 1;
                transform: scale(1.3)
            }

            .go-back .zmdi {
                color: #fff;
                font-size: 25px;
                position: relative;
                display: block;
                text-align: center
            }

            .retail .go-back .zmdi {
                color: var(--primary-color)
            }

            .logo.has-go-back {
                margin-left: 93px !important
            }
        }

        .footer .menu ul.apps li {
            height: 50px
        }

        .footer .menu ul.apps li .btn {
            background: 0 center
        }

        li.google-play .btn .box {
            position: relative;
            display: block;
            height: 50px;
            width: 147px;
            background-size: 100%
        }

        li.google-play .btn .box {
            background: url("../images/googleplay2.png") 0 center no-repeat;
            height: 108px
        }

        li.app-store .btn .box {
            position: relative;
            display: block;
            height: 50px;
            background: url("../images/appstore.png") 0 center / 100% no-repeat;
            margin-top: 15px
        }

        li.app-store .btn .box {
            background: url("../images/appstore2.png") 0 center no-repeat;
            height: 108px
        }

        #pinPayPopUp .smallTittle {
            position: relative;
            font-family: Roboto, sans-serif;
            font-weight: 400;
            font-size: 13px;
            color: #666
        }

        #pinPayPopUp .genBtn.loading .table {
            display: none
        }

        @media(max-width:768px) {
            .homePid .titleAndLegend.isSearching {
                padding: 0;
                min-height: 5px
            }

            .home-collection.layout2 .itemsList {
                overflow-x: hidden
            }

            .home-collection.layout3 .gITems {
                overflow-x: hidden
            }
        }

        @media(max-width:768px) {
            .homePid .titleAndLegend.isSearching {
                padding: 0
            }

            .mainTitle.createaccount {
                margin-top: -14px;
                margin-bottom: -6px;
                display: none
            }
        }

        @media(min-width:769px) {
            .wrapCustom {
                column-count: 2
            }

            .checkoutID .aoffer {
                max-width: unset
            }
        }

        @media(min-width:769px) {
            .wrapCustom {
                column-count: 1
            }

            .column_cust {
                break-inside: avoid;
                width: 100% !important
            }
        }

        @media(min-width:769px) {
            .swiperID.fix .swiper-container ul {
                margin-top: 115px;
                padding-bottom: 21px
            }

            .swiperID.fix .swiper-slide .picture,
            .swiperID.fix2 .swiper-slide .picture {
                visibility: hidden;
                height: 0;
                margin: 0;
                width: 22px
            }

            .swiperID.fix .swiper-container ul li {
                width: auto;
                max-height: 32px;
                padding-right: 26px;
                margin-right: auto !important
            }

            .swiperID.fix .titleWrp {
                height: auto !important
            }

            .fixing .content {
                margin-top: 180px
            }
        }

        @media(min-width:769px) {
            .fixing .content {
                margin-top: 0
            }

            .menuontop #wrapper {
                padding-top: 71px;
                margin-top: 0;
                box-sizing: border-box
            }
        }

        .loginRegisterID .error {
            bottom: -23px;
            text-align: center;
            width: 100%;
            color: #cf6060 !important
        }

        div#pinPayPopUp .error {
            text-align: center;
            top: 138px;
            height: 22px;
            color: #999 !important
        }

        div#pinPayPopUp .genBtn {
            margin-top: 38px
        }

        .favorite: hover .text {
            color: var(--primary-color)
        }

        .accname {
            position: absolute;
            transform: translateX(-50%);
            left: 50%;
            color: rgba(255, 255, 255, 0);
            font-size: 17px;
            top: 19px;
            font-weight: bold;
            display: none;
            text-align: center;
            cursor: pointer;
            transition: all .2s ease 0s
        }

        .accname::before {
            content: "";
            position: absolute;
            top: -23px;
            left: 50%;
            width: 64px;
            height: 62px;
            background-size: cover;
            color: #672a19;
            visibility: visible;
            transform: translateX(-50%)
        }

        .oitems div {
            width: 50%;
            float: left;
            border: 1px solid #ddd;
            height: 34px;
            line-height: 28px;
            text-align: center
        }

        .orderStat {
            position: absolute;
            top: 18px;
            background-color: #fff;
            border-width: 1px 1px 2px;
            border-style: solid;
            border-color: #f1f0f0 #f1f0f0 #e0dfdf;
            border-image: initial;
            padding: 6px 9px;
            border-radius: 4px;
            font-size: 13px;
            right: 15px;
            color: #666;
            text-transform: capitalize;
        }

        .orderStat.readyforpickup {
            background-color: #57a022;
            color: #fff;
            animation: .9s ease-in-out 0s infinite normal none running fadeOut;
        }

        .orderStat.processing {
            background-color: #e69138;
            color: #fff
        }

        .orderStat.ontheway,
        .orderStat.delivered {
            background-color: #6aa84f;
            color: #fff
        }

        .orderStat.processed {
            color: #fff;
            background-color: orange;
        }

        .orderStat.canceled {
            background-color: #e45a5a;
            color: #fff
        }

        .rtl .orderStat {
            left: 15px;
            right: auto
        }

        .orderdate {
            width: 190px;
            font-size: 14px;
            color: #666;
            font-weight: normal;
            padding-left: 19px;
            text-transform: uppercase;
            padding-top: 3px
        }

        .rtl .orderdate {
            text-align: right;
            margin-left: auto
        }

        .userpages {
            float: left
        }

        .rtl .userpages {
            margin-left: 23px
        }

        .userpages li {
            list-style: none;
            float: left;
            margin-right: 32px;
            cursor: pointer;
            color: #666;
            height: 40px;
            line-height: 31px;
            position: relative
        }

        .menuontop .userpages li {
            margin-right: 0
        }

        .fnb .checkoutID .userpages li,
        .market .checkoutID .userpages li {
            display: none
        }

        .fnb .checkoutID .userbar,
        .market .checkoutID .userbar {
            border-bottom: 0;
            display: none;
        }

        .userpages li:hover {
            opacity: .7
        }

        .userpages .md-reorder {
            color: var(--primary-color);
            display: none
        }

        .userpages .md-offers {
            color: var(--primary-color)
        }

        .userpages .md-fav::before {
            font: 25px / 1 Material-Design-Iconic-Font;
            content: "\F27C";
            margin-right: 9px;
            position: absolute;
            top: 2px;
        }

        .retail .userpages .md-fav::before {
            content: "\F15F";
            line-height: 26px
        }

        .retail .userpages .md-wl::before {
            font: 28px / 1 Material-Design-Iconic-Font;
            content: "\f3ac";
            margin-right: 9px;
            position: absolute;
            top: 2px;
            color: var(--primary-color);
        }

        .menuontop .userpages .md-src::before {
            font: 23px / 26px Material-Design-Iconic-Font;
            content: "\F1C3";
            margin-right: 9px;
            position: absolute;
            top: 2px
        }

        .userpages .md-orders::before {
            font: 22px / 1 Material-Design-Iconic-Font;
            content: "\F109";
            margin-right: 10px;
            position: absolute;
            top: 2px;
        }

        .userpages .md-offers::before {
            font: 25px / 1 Material-Design-Iconic-Font;
            content: "\f1df";
            margin-right: 10px;
            position: absolute;
            top: 1px
        }

        .userpages .md-giftcards::before {
            font: 24px / 1 Material-Design-Iconic-Font;
            content: "\F126";
            margin-right: 10px;
            position: absolute;
            top: 1px;
        }

        .userpages .md-reorder::before {
            font: 18px / 1 Material-Design-Iconic-Font;
            content: "\F3B2";
            margin-right: 10px
        }

        .userpages a {
            color: #666;
            text-decoration: none;
            font-size: 16px;
            padding-left: 30px;
            text-transform: capitalize;
        }

        .sumhead {
            position: relative;
            height: 38px;
            text-align: left;
            line-height: 22px;
            margin-bottom: 19px;
            font-weight: bold;
        }

        .notloggedin .sumhead {
            margin-bottom: 19px !important
        }

        .rtl .sumhead {
            direction: rtl
        }

        .sumhead div {
            display: inline-block;
            margin-right: 5px;
            font-size: 14px;
            white-space: nowrap;
            color: #444;
            font-weight: normal
        }

        .sumhead div div:last-child {
            margin-right: 0
        }

        .sumhead .totitems {
            font-size: 14px
        }

        .sumhead .price {
            float: right;
            top: 0;
            position: absolute;
            right: 2px;
            font-size: 14px
        }

        .myBagModule .itemBags .price {
            margin-top: 2px;
            font-size: 13px;
            color: #999;
            text-align: left
        }

        .retail .myBagModule .itemBags .customPart .price {
            float: left;
            margin-left: 18px
        }

        .retail .myBagModule .itemBags .customPart .price {
            display: none;
        }

        .myBagModule .itemBags .for-free .price {
            display: none
        }

        .rtl .myBagModule .itemBags .price {
            text-align: right;
            padding-top: 4px;
            direction: rtl
        }

        .menuList.signin {
            cursor: pointer
        }

        .checkoutID .menuList.signin {
            display: none;
        }

        .retail .menuList.signin {
            margin-top: 2px
        }

        .rtl.retail .menuList.signin {
            margin-right: 6px
        }

        .applinks {
            margin-top: 14px;
            display: inline-block
        }

        .cordova .applinks {
            display: none;
        }

        .rtl .applinks {
            text-align: right
        }

        .rtl .applinks li {
            text-align: right;
            display: inline-block
        }

        .applinks li {
            border: 0;
            list-style-type: none
        }

        .applinks li {
            width: 94px;
            display: inline-block
        }

        .applinks li::before {
            background-color: #fff
        }

        .minitotal .mtbtn {
            background-color: var(--primary-color);
            height: 32px;
            line-height: 32px;
            padding-left: 7px;
            width: 68px;
            border-radius: 0 5px 5px 0;
            float: left;
            text-transform: uppercase;
            padding-right: 7px;
            color: #fff;
            text-align: center;
            cursor: pointer;
            font-size: 12px
        }

        .minitotal .mtprice {
            background-color: #fff;
            height: 32px;
            line-height: 32px;
            padding-left: 9px;
            width: 82px;
            border-radius: 5px 0 0 5px;
            float: left;
            padding-right: 7px
        }

        .minitotal {
            width: 180px;
            font-size: 12px;
            position: absolute;
            right: 9px;
            top: -9px;
            box-shadow: rgba(204, 204, 204, 0.64) 0 0 9px;
            display: none
        }

        .bagph {
            right: 0;
            position: fixed;
            background-color: #eee;
            width: 300px;
            border-left: 1px solid #ddd;
            z-index: 2
        }

        .bagph {
            top: 86px;
            height: calc(100vh - 86px);
            transition: all .3s ease 0s
        }

        .retail .bagph {
            top: 71px;
            height: calc(100vh - 71px);
            transition: all .3s ease 0s
        }

        .checkoutID .bagph {
            background-color: #f9f9f9
        }

        .checkoutID.reviewbag .bagph {
            opacity: 1
        }

        .rtl .bagph {
            left: 0;
            right: auto;
            border-right: 1px solid #ddd;
            border-left: 0
        }

        .checkoutID .bagph::after {
            display: none
        }

        .bagph::after {
            font: 122px / 1 Material-Design-Iconic-Font;
            content: "\F195";
            margin-right: -7px;
            transform: translateX(-50%) translateY(-50%);
            position: absolute;
            left: 50%;
            top: 50%;
            color: #ccc
        }

        .bagph::after {
            content: "\F1C9"
        }

        .mCustomScrollBox {
            height: 100%
        }

        .deskmenu {
            position: relative;
            width: 300px;
            box-sizing: border-box;
            padding-left: 36px;
            z-index: 1;
            top: -81px;
            display: inline-table;
            padding-right: 29px;
            height: calc(100vh - 276px);
            opacity: 0;
            animation: 1s ease-in-out 1s 1 normal forwards running fadeIn
        }

        .rtl .deskmenu {
            padding-left: 34px;
            padding-right: 23px;
            float: right;
            text-align: right
        }

        .deskmenu .menu li {
            list-style-type: none;
            border-top: 1px dotted #ccc;
            position: relative
        }

        .homePid .deskmenu .menu li.colle.hide-coll-on-homepage {
            display: none
        }

        .deskmenu .menu li.colle a {
            color: var(--secondary-color)
        }

        .deskmenu .link.collections {
            margin-top: 32px
        }

        .deskmenu .menu li ul li::before {
            position: relative;
            display: none
        }

        .deskmenu .menu li ul li a {
            font-family: textfont;
            font-weight: normal;
            font-size: 13px;
            line-height: 27px;
            color: #666
        }

        .deskmenu .menu li ul li a::before {
            content: "\F2FB";
            font: 14px / 5px Material-Design-Iconic-Font;
            margin-right: 6px
        }

        .rtl .deskmenu .menu li ul li a::before {
            margin-right: 0;
            margin-left: 6px;
            float: right;
            margin-top: 17px;
            transform: rotateY(180deg)
        }

        .deskmenu .menu li ul li {
            border-top: 0;
            padding-left: 9px;
            padding-bottom: 0px;
        }

        .deskmenu .menu li ul li.selected {
            color: var(--primary-color)
        }

        .deskmenu .menu li ul li.selected>a {
            color: var(--secondary-color);
            font-weight: bold
        }

        .deskmenu .menu li ul li:first-child {
            margin-top: -9px;
            padding-top: 10px;
            padding-bottom: 0;
        }

        .fnb .deskmenu .menu li ul li:first-child {
            margin-top: 4px;
        }

        .deskmenu .menu li ul li:last-child {
            margin-bottom: 22px;
            border-bottom: 0
        }

        .deskmenu .menu li ul li ul li:last-child {
            margin-bottom: 5px;
        }

        .rtl .deskmenu .menu li {
            text-align: right
        }

        .deskmenu .menu li::before {
            content: "";
            width: 12px;
            height: 1px;
            position: absolute;
            top: -1px
        }

        .retail .deskmenu .menu li::before {
            display: none
        }

        .rtl .deskmenu .menu li::before {
            right: 0
        }

        .deskmenu li a {
            text-decoration: none;
            font-size: 17px;
            color: #555;
            line-height: 46px;
            text-transform: capitalize;
            transition: all .7s linear 0s
        }

        .deskmenu li.selected a {
            color: var(--primary-color);
            font-weight: normal
        }

        .deskmenu li a:hover {
            color: #111;
            transition: all .3s linear 0s
        }

        .rtl .selection .timePick .clock {
            right: auto;
            left: 7px
        }

        .rtl .customized .textCustom {
            font-family: inherit;
            font-size: 10px;
            line-height: 11px
        }

        .rtl .box_instruction.notesCss .textarea.noteOnly {
            text-align: right;
            font-family: inherit
        }

        .orderdetails .box_instruction.notesCss .textarea.noteOnly {
            padding-top: 11px;
            padding-left: 0;
            margin-top: 28px
        }

        .rtl .orderdetails .textLbl {
            text-align: right
        }

        .orderdetails .pageMainTitle {
            display: none
        }

        .box_feedback {
            margin-top: 34px;
            margin-bottom: 40px
        }

        .rtl .box_feedback .feedTitle {
            text-align: right;
            font-family: inherit
        }

        .rtl .whiteBox .boxes .box .top .desc,
        .rtl .whiteBox .boxes .box .top .title {
            font-family: inherit;
            text-align: left
        }

        .rtl .whiteBox .boxes .box .customized .textCustom {
            font-family: inherit;
            font-size: 9px;
            line-height: 12px
        }

        .myAccountPid .whiteBox .boxes .box {
            width: calc(50% - 43px);
            min-width: 280px;
            padding-bottom: 8px;
            box-shadow: rgba(204, 204, 204, 0.24) 0 0 4px
        }

        .rtl .whiteBox .boxes .box {
            float: right
        }

        .rtl .editAddAddress .line {
            visibility: hidden
        }

        .rtl .reviewBox .rBox.left {
            float: right
        }

        .mandatory {
            display: none
        }

        .MenuParts .callUsNb {
            position: relative;
            float: right;
            width: auto
        }

        .rtl .MenuParts .bag {
            font-family: inherit
        }

        .txt_deliver {
            font-weight: 300;
            font-size: 43px;
            color: #fff;
            line-height: 42px;
            text-align: center
        }

        .rtl .txt_deliver {
            font-family: inherit
        }

        .rtl .link {
            font-family: inherit
        }

        .rtl .text {
            font-family: inherit
        }

        .rtl .genBtn {
            font-family: inherit;
            font-weight: bold;
            letter-spacing: normal
        }

        .whiteBox .boxes .box .genBtn {
            width: 30%;
            height: 38px;
            margin-bottom: 26px
        }

        .myAccountPid .whiteBox .boxes .box .genBtn {
            background-color: transparent;
            color: var(--primary-color);
            border-radius: 0;
            position: absolute;
            font-size: 11px;
            display: block;
            font-weight: bold;
            left: 20px;
            top: 2px;
            text-align: left !important
        }

        .myAccountPid .editaccountp .whiteBox .boxes .box .genBtn {
            display: flex;
            bottom: -24px;
            transform: translateX(-50%);
            left: 50%
        }

        .passedit .genBtn {
            bottom: 0 !important;
            top: auto !important
        }

        .myAccountPid .editaccountp .whiteBox .boxes .box .verifcode .genBtn {
            border: 0;
            right: 22px;
            display: block;
            transform: none;
            width: 100px;
            font-size: 14px;
            top: -9px;
            left: auto !important;
            bottom: -45px !important;
            text-align: right !important
        }

        .rtl .itemsList .itemGrid .descBlock .description {
            font-family: inherit;
            text-align: right;
            direction: rtl
        }

        .rtl .itemsList .itemGrid .descBlock .description pre {
            font-family: inherit;
            white-space: normal
        }

        .rtl .itemsList .itemGrid .descBlock .title {
            font-family: inherit;
            text-align: right;
            width: 100%
        }

        a.mapdir {
            color: var(--secondary-color);
            position: relative;
            font-size: 31px;
            height: 31px;
            float: left;
            margin-top: -5px;
            margin-left: 8px
        }

        .select-locale {
            color: var(--primary-color);
            position: absolute;
            right: 47px;
            top: 5px;
            display: none
        }

        .select-locale select {
            background-color: transparent;
            border: 0;
            text-transform: inherit;
            color: var(--primary-color);
            font-size: 15px;
            height: 35px
        }

        .select-locale::before {
            content: "\F2F2";
            font: 14px / 1 Material-Design-Iconic-Font;
            color: #7d7d7d;
            margin-right: 7px;
            margin-left: 0
        }

        .select-locale::after {
            content: "\F2F2";
            font: 14px / 1 Material-Design-Iconic-Font;
            color: #7d7d7d;
            margin-right: 8px;
            margin-left: 14px;
            float: right;
            margin-top: 12px;
            pointer-events: none
        }

        i.localeglobe {
            font-size: 23px;
            position: absolute;
            right: 18px;
            color: #7d7d7d;
            top: 43px
        }

        .customDropDown .drop_arrow {
            width: 27px;
            box-sizing: border-box
        }

        .rtl .customDropDown .drop_arrow {
            left: 18px;
            right: auto
        }

        .customDropDown .drop_arrow .zmdi {
            color: #d7d4d4;
            margin-top: 4px;
            margin-right: 20px
        }

        .rtl .customDropDown .drop_arrow .zmdi {
            margin-top: 11px
        }

        .customDropDown .drop_arrow .zmdi::after {
            font-size: 11px;
            font-family: sans-serif;
            position: absolute;
            left: -5px;
            bottom: 17px;
            color: #999
        }

        .recommendedItems .grad,
        .recommendedItems .heart {
            display: none
        }

        body.showModal {
            overflow: hidden !important
        }

        #sticky-wrapper {
            opacity: 0
        }

        .showBag #sticky-wrapper {
            opacity: 1
        }

        .orderdetails .reviewBox .myBagModule {
            top: 0;
            visibility: visible
        }

        .hide-v {
            opacity: 0
        }

        .ngviewstyle.ng-leave {
            z-index: 9999
        }

        .ngviewstyle.ng-enter {
            z-index: 8888
        }

        .content .ng-enter {
            opacity: 0;
            transition: opacity .15s ease-in-out 0s
        }

        .content .ng-enter-active {
            opacity: 1
        }

        .coupons {
            opacity: 1 !important;
            pointer-events: all !important
        }

        .coupons label.missing {
            top: -22px;
            left: -2px;
            right: auto
        }

        .low-opacity {
            opacity: .7
        }

        #customizedModalID .favoriteBox.addToFavorites {
            min-width: 150px;
            display: none
        }

        #customizedModalID .favoriteBox .textAdd {
            min-width: 150px;
            display: none
        }

        .recommendedItems {
            position: fixed;
            bottom: -10000px;
            left: -10000px;
            height: 100%;
            width: 100%;
            background-color: rgba(0, 0, 0, 0);
            transition: background-color .3s linear 0s;
            z-index: 50
        }

        .recommendedItems.show {
            bottom: 0;
            left: 0;
            background-color: rgba(0, 0, 0, 0.8);
            overflow: visible
        }

        .recommendedItems .modal-container {
            position: relative;
            width: 100%;
            height: 444px;
            margin-left: auto;
            margin-right: auto;
            margin-bottom: -500px;
            transition: all .5s linear 0s;
            overflow: visible;
            transform: translate3d(0px, 150%, 0px);
            opacity: 0
        }

        .recommendedItems.show .modal-container.show {
            margin-bottom: 0;
            opacity: 1;
            transition: all .5s cubic-bezier(0.42, 0, 0, 1.21) 0s;
            transform: translate3d(0px, -50%, 0px);
            top: 50%;
            width: 94%
        }

        .recommendedItems .modal-container .thebig-ul {
            text-align: center;
            white-space: nowrap
        }

        .recommendedItems .modal-container .btnClose {
            position: absolute;
            min-width: 106px;
            height: 35px;
            text-align: center;
            border: 1px solid rgba(255, 255, 255, 0.6);
            color: #fff;
            white-space: nowrap;
            line-height: 33px;
            background-color: rgba(0, 0, 0, 0.43);
            z-index: 99;
            right: auto;
            box-sizing: border-box;
            display: inline-block;
            transform: translateX(-50%);
            background-image: none;
            bottom: -23px !important;
            left: 50% !important;
            margin-left: 3px !important;
            top: auto !important
        }

        @media(min-width:769px) {

            .recommendedItems .modal-container .btnClose:hover .zmdi-close,
            .recommendedItems .modal-container .btnClose:hover .zmdi-close-circle {
                color: #909090 !important
            }
        }

        .recommendedItems .modal-container .title {
            position: relative;
            font-family: titlefont;
            font-size: 28px;
            color: #f9f9f9;
            text-align: center;
            margin-top: 25px;
            margin-bottom: 17px
        }

        .recommendedItems .modal-container .itemsList .itemGrid {
            text-align: left;
            white-space: normal;
            width: 337px !important
        }

        .recommendedItems .swiper-pagination {
            left: auto;
            z-index: 2147483647;
            padding: 0;
            margin-top: 24px;
            position: relative !important
        }

        .recommendedItems .swiper-pagination-bullet {
            opacity: 1;
            background: #a1a19e;
            margin: 0 3px !important
        }

        .recommendedItems .swiper-pagination-bullet: last-child {
            display: none
        }

        .recommendedItems .swiper-pagination-bullet-active {
            opacity: 1;
            background: #fff
        }

        @media(min-width:769px) {
            .recommendedItems .swiper-pagination {
                display: none
            }
        }

        @media(max-width:959px) {
            .recommendedItems .modal-container .itemsList .itemGrid {
                margin-right: 9px !important;
                margin-left: 9px !important
            }
        }

        @media(max-width:768px) {
            .editMode .box_delivery .location .edit {
                max-width: 100%
            }

            .rtl .left.part {
                padding-right: 0 !important;
                padding-left: 0 !important;
                width: 100% !important
            }

            .editAddAddress .part {
                width: 100% !important
            }

            .editAddAddress .part.left {
                padding-right: 0 !important
            }

            .rtl .editAddAddress .line {
                background-color: #fff
            }

            .swiper-container.main-swiper {
                overflow-x: hidden;
                width: 100%;
                position: relative
            }

            .swiper-container.pages-swiper {
                overflow-x: hidden;
                width: 100%;
                position: relative
            }

            img.headbackimg {
                width: 100vw !important
            }

            body {
                visibility: visible;
                display: block
            }

            .market .itemsList .genBtn.customize {
                margin-top: -213px !important
            }

            .pheadline {
                padding-left: 10px;
                font-size: 31px !important;
                line-height: 33px !important;
                width: calc(100% - 46px) !important
            }

            .editaccountp .whiteBox .boxes .box .top .text {
                text-align: center;
                display: none
            }

            .editaccountp .whiteBox .boxes .box.loyalty-change-mobile .top .text {
                display: block
            }

            .myBagModule .itemBags {
                padding: 0;
                margin-left: -3px;
                width: 100% !important
            }

            .checkoutID .notloggedin .box_delivery .genBtn {
                bottom: auto;
                width: calc(100% - 22px);
                left: auto;
                color: #fff !important;
                border-radius: 6px !important;
                display: block !important
            }

            .checkoutID .notloggedin .box_delivery .genBtn {
                max-width: 100% !important;
                margin-top: 32px !important;
                width: 100% !important
            }

            .checkoutID .notloggedin .box_delivery .genBtn::before {
                display: none !important
            }

            .reachLocations li {
                width: 100vw !important;
                margin-right: 0 !important
            }

            .bigPrice.overbtn {
                position: fixed;
                z-index: 9999;
                bottom: 21px;
                right: 21px;
                font-size: 13px;
                color: #fff;
                opacity: 0;
                transition: all .5s linear 0s;
                transform: translateY(100px);
                font-weight: bold;
                display: block !important
            }

            .rtl .bigPrice.overbtn {
                direction: rtl
            }

            .bigPrice.overbtn.show {
                transform: translateY(0px);
                pointer-events: none;
                opacity: .7 !important;
                transition: all 0s linear .9s !important
            }

            header.header {
                height: auto
            }

            .userpages {
                margin: auto;
                float: none;
                display: block
            }

            .header .image .gradient {
                width: 100%;
                bottom: 0;
                top: auto
            }

            .wrapAll {
                bottom: 29px;
                width: 100%
            }

            .customizedID .onRight {
                position: relative;
                bottom: auto
            }

            .noCustomization .onRight {
                background-color: #fff;
                display: none
            }

            .addtobagbtn {
                position: fixed;
                border-radius: 0;
                bottom: 0;
                width: 100%;
                z-index: 999;
                height: 58px;
                transform: translateY(150%);
                transition: all .2s linear 0s;
                display: flex !important
            }

            .addtobagbtn.show {
                transform: translateY(0px);
                transition: all .4s linear .3s
            }

            .rtl .closeOrderdetails {
                left: 0
            }

            .rtl .orders .order .orderPreference {
                text-align: left;
                float: right;
                margin-right: -20px
            }

            .rtl .wrapCustom .column_cust {
                margin-right: 0
            }

            .rtl .wrapCustom .column_cust.customnote .bTitle {
                line-height: 10px !important
            }

            .rtl .customizedID .column_cust .block .bigPrice {
                text-align: center !important
            }

            .loginRegisterID .parts .left {
                padding-right: 0 !important
            }

            .rtl .partReceipt .note {
                text-align: center;
                margin-top: -12px
            }

            .rtl .partReceipt .txtReceipt {
                text-align: center
            }

            .rtl .mini-disclaimer {
                font-family: inherit;
                text-align: right;
                width: 100%
            }

            .showModal .backgroundModal.whitebottom::after {
                content: "";
                position: absolute;
                width: 100%;
                height: 200px;
                opacity: 1;
                bottom: 0;
                transition: all .3s linear 0s
            }

            .rtl div#recommended {
                text-align: right;
                padding-right: 11px;
                top: -14px;
                font-family: titlefont
            }

            .recommendedItems .modal-container .title {
                margin-top: 3px;
                margin-bottom: 14px;
                font-size: 28px;
                width: 100%
            }
        }

        .recommendedItems .modal-container .itemsList .title {
            width: 100%
        }

        .recommendedItems .itemsList .genBtn.customize {
            display: none
        }

        .recommendedItems .modal-container .itemsList .addRemoveWrap.full {
            height: 45px;
            margin-bottom: 0;
            margin-top: 17px;
            display: none
        }

        .recommendedItems .modal-container .itemsList .genBtn.skipBtn {
            background-color: var(--secondary-color);
            color: #fff;
            position: absolute;
            font-size: 15px;
            font-weight: bold;
            border-bottom: 1px dotted #666;
            bottom: 7px;
            border-radius: 7px;
            height: 35px;
            box-sizing: border-box;
            min-width: 100px !important;
            right: -1px !important
        }

        .recommendedItems .modal-container .itemsList .genBtn.skipBtn: hover {
            background-color: #fff;
            border-color: #999;
            color: #999
        }

        .openning-date {
            margin-top: 0;
            margin-bottom: -37px;
            background: transparent;
            box-shadow: none
        }

        .openning-date .delivery-span {
            font-size: 26px;
            color: var(--secondary-color);
            position: absolute;
            background-color: #fff;
            height: 98px;
            min-width: 154px;
            margin-top: 2px;
            padding-top: 35px;
            box-sizing: border-box;
            font-weight: 300;
            text-align: left;
            padding-left: 15px;
            border: 1px solid #ccc;
            border-radius: 7px;
            top: 25px;
            left: 22px;
            padding-right: 21px
        }

        .openning-date .delivery-span::before {
            content: attr(data-text);
            position: absolute;
            font-size: 11px;
            top: 21px;
            width: 100%;
            text-align: left;
            left: 17px;
            color: #999;
            box-sizing: border-box;
            text-transform: uppercase
        }

        .rtl .openning-date .delivery-span::before {
            top: 12px;
            direction: rtl;
            text-align: right;
            width: calc(100% - 25px)
        }

        .rtl .openning-date .delivery-span {
            direction: unset;
            left: auto;
            right: 22px;
            text-align: right;
            padding-left: 21px;
            padding-right: 15px;
        }

        .openning-date .delivery-date {
            position: relative;
            font-size: 12px;
            color: #999;
            font-family: Roboto, sans-serif;
            text-align: center;
            margin-top: 0;
            margin-bottom: 7px;
            text-transform: uppercase
        }

        .openning-date .delivery-date {
            margin-top: 0
        }

        .termsID .textTerms p,
        .termsID .textTerms li {
            position: relative;
            min-height: 1px;
            line-height: 19px
        }

        .termsID .textTerms ul {
            margin-left: 17px
        }

        #disclaimerModalID .textTerms {
            border: 1px solid #eee;
            margin-top: 18px;
            padding: 7px 15px 15px;
            margin-bottom: 10px;
            height: 400px;
            overflow-y: scroll
        }

        #disclaimerModalID .textTerms.mCustomScrollbar {
            padding-right: 0
        }

        #disclaimerModalID .mCSB_scrollTools .mCSB_draggerRail {
            background: #fff
        }

        #disclaimerModalID .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
            background-color: #878787
        }

        #disclaimerModalID .notice {
            position: relative;
            display: block;
            font-size: 12px;
            font-family: Roboto, sans-serif;
            color: #666;
            margin-bottom: 15px
        }

        .loading::after {
            content: "";
            position: absolute;
            width: 24px;
            height: 24px;
            border-width: 3px;
            border-style: solid;
            border-color: rgba(0, 0, 0, 0.31) rgba(224, 224, 224, 0.69) rgba(0, 0, 0, 0.31) rgba(0, 0, 0, 0.31);
            border-image: initial;
            border-radius: 100%;
            animation-name: rotate;
            animation-duration: .4s;
            animation-iteration-count: infinite;
            animation-timing-function: linear;
            transition: all .2s linear 0s;
            margin-left: -15px;
            left: 50%;
            top: 50%;
            margin-top: -15px;
            display: none
        }

        .homePid .loading: after {
            display: none;
        }

        @keyframes rotate {
            0% {
                transform: rotate(0deg)
            }

            100% {
                transform: rotate(360deg)
            }
        }

        .genBtn.greyBtn {
            background-color: #bbb
        }

        .genBtn.greyBtn: hover {
            background-color: #fff;
            border-color: #bbb;
            color: #bbb
        }

        .genBtn.greyBtn .timing {
            font-size: 13px;
            color: #d8d8d8;
            font-family: Roboto, sans-serif;
            position: absolute;
            right: 16px
        }

        .moreBtn.greyBtn {
            background-color: #bbb;
            color: #fff;
            border-color: #aaa;
            position: relative;
            margin-top: 0 !important;
            margin-bottom: 51px !important
        }

        .moreBtn.greyBtn: hover {
            background-color: #fff;
            border-color: #bbb;
            color: #bbb
        }

        .moreBtn.greyBtn .timing {
            font-size: 13px;
            color: #ccc;
            font-family: Roboto, sans-serif;
            position: absolute;
            right: 16px
        }

        .for-free .addRemove .nb {
            float: none;
            width: 100%;
            text-align: center
        }

        .for-free .customized {
            left: auto;
            right: 76px;
            top: -8px
        }

        .customized .textCustom {
            display: none
        }

        .for-free .customized .textCustom,
        .customized.offer .textCustom {
            text-align: center;
            position: absolute;
            bottom: -23px;
            background-color: #ee7f0d;
            color: #fff;
            display: block !important
        }

        #promotionId {
            width: auto;
            max-width: 90%
        }

        #promotionId.show {
            transform: translate3d(-50%, -50%, 1px);
            top: 50% !important
        }

        #promotionId .btnClose {
            left: 50% !important;
            top: 12px !important
        }

        #promotionId .btnClose .zmdi::after {
            content: "";
            position: absolute;
            background-color: rgba(0, 0, 0, 0.26);
            width: 40px;
            height: 40px;
            border-radius: 100%;
            z-index: 1;
            top: 50%;
            transform: translateX(-50%) translateY(-50%);
            left: 50%;
            visibility: visible !important
        }

        #promotionId .btnClose .zmdi::before {
            position: absolute;
            z-index: 2;
            top: 50%;
            transform: translateX(-50%) translateY(-50%);
            left: 50%
        }

        #promotionId .picture-ctn,
        #promotionId .picture-ctn img {
            position: relative;
            display: block;
            max-width: 100%;
            height: auto;
            min-height: 180px;
            background-color: #333;
            width: auto;
            min-width: 337px;
            max-height: calc(100vh - 282px);
            margin: auto
        }

        #promotionId .wrap {
            position: relative;
            display: block
        }

        #promotionId .cont {
            padding: 0 !important
        }

        #promotionId .message-ctn {
            position: relative;
            display: block;
            padding: 30px 22px 35px;
            font-family: inherit;
            font-size: 16px;
            text-align: center;
            background-color: #fff
        }

        #promotionId .message-ctn: empty {
            display: none
        }

        #promotionId .btn-ctn {
            position: relative;
            display: block;
            font-weight: bold
        }

        #promotionId .btn-ctn .genBtn {
            position: relative;
            display: block;
            width: 100%;
            height: 45px;
            margin-left: auto;
            border-radius: 0;
            margin-bottom: 0;
            background-color: var(--secondary-color);
            font-weight: bold;
            font-size: 16px;
            text-align: center;
            line-height: 44px !important
        }

        #createAccountModalID .error {
            bottom: -3px;
            width: 100%;
            text-align: center;
            font-size: 13px;
            z-index: 2;
            color: red !important
        }

        @media(max-width:768px) {
            .add-tofav-guideline {
                font-family: inherit;
                font-size: 14px;
                text-align: center;
                color: #ccc;
                width: 60%;
                margin: 40% auto auto;
                padding-top: 33px
            }

            body {
                visibility: visible
            }

            .myAccountPid .content {
                min-height: calc(100vh - 70px) !important
            }

            .wrap1260.noPad.subempty {
                margin-top: 0;
                padding-top: 0 !important
            }

            .instagram_gallery a {
                margin: -4px 0 0 !important;
                width: 25% !important
            }

            .instagram_gallery {
                padding-bottom: 22px !important;
                width: 98% !important
            }

            .userbar.icons .md-src {
                display: none !important
            }

            .case.has-loyalty .accname {
                transform: none;
                left: 36px
            }

            .case.has-loyalty .accname.has-go-back {
                left: 79px;
                transition: all .2s ease 0s
            }

            .retail .pickordel .input .check {
                top: 24px !important
            }

            .retail .pickordel .input .label {
                min-width: 88px;
                position: absolute;
                line-height: 18px;
                white-space: normal !important;
                width: 26px !important
            }

            .rtl.retail .pickordel .input .label {
                width: auto !important;
                padding-left: 0;
                padding-top: 0px;
            }

            .market .customizedID img.backg {
                width: 130%;
                max-height: none
            }

            .market .customizedID .picture .pinch-zoom {
                display: flex;
                justify-content: center;
                align-items: center
            }

            .multibranch .branchtitle {
                padding-left: 0 !important
            }

            .multibranch .branchname::after,
            .multibranch .locationName::after {
                margin-right: -11px
            }

            .multibranch .branchname,
            .multibranch .locationName {
                padding-left: 0 !important
            }

            .multibranch .deiveringfrom {
                left: 50%;
                transform: translateX(-50%);
                top: -56px;
                margin-left: -14px;
                text-align: center;
                width: 161px !important;
                border: 0 !important
            }

            .market .itemsList .itemGrid .descBlock .wrap {
                min-height: 184px
            }

            .market.cols3mob .itemsList .itemGrid .wrap {
                /* padding-right: 5px; */
                overflow: hidden
            }

            .market.cols3mob .itemsList .itemGrid .priceWrap .wrap {
                overflow: visible
            }

            .market .newsCtrl .descBlock .wrap {
                min-height: unset !important
            }

            .scroll-up {
                display: none
            }

            .categoryPid .sorter {
                right: 9px !important
            }

            .retail.enablesorting .categoryPid .sorter {
                margin-top: -58px
            }

            .rtl .categoryPid .sorter {
                right: 0;
                left: auto !important;
                top: 5px !important
            }

            .market.enablesorting .categoryPid .titleAndLegend {
                visibility: hidden !important;
                pointer-events: none !important
            }

            .market.enablesorting .categoryPid .titleAndLegend.subempty {
                visibility: hidden;
                pointer-events: none;
                display: none !important
            }

            .home-collection .view-more {
                margin-top: 26px;
                display: none
            }

            a.plink.genBtn {
                margin-left: 20px;
                margin-bottom: 23px
            }

            .box_delivery .googleMap img {
                width: 200%;
                margin-left: 22px;
                margin-top: 22px
            }

            .box_feedback .feed {
                left: 0
            }

            .itemsList .itemGrid .priceWrap .price {
                text-align: right;
                padding-right: 32px
            }

            .itemsList .itemGrid .priceWrap .points-price {
                text-align: right;
                padding-right: 32px
            }

            .market .itemsList .itemGrid .priceWrap .price {
                font-size: 12px;
                padding-right: 23px
            }


            .elt.printer {
                display: none !important
            }

            .minitotal {
                display: none
            }

            .myBagModule .genBtn {
                display: none
            }

            .wrpLocations {
                padding-top: 12px !important
            }

            header.header {
                margin-top: 0;
                min-height: 181px
            }

            .retail .homePid.s-active .header,
            .retail .homePid.s-active .categories,
            .retail .homePid.s-active .home-collection,
            .retail .homePid.s-active .offerslist,
            .retail .homePid.s-active .ymliketitle {
                display: none
            }

            .accname {
                display: block;
                top: -7px;
            }

            .accname img {
                width: auto;
                height: 56px
            }

            .retail .accname img {
                height: 40px
            }

            .content,
            .contentb {
                position: relative
            }

            .userbar {
                display: none;
                top: 346px !important;
                width: 100% !important;
                height: 46px !important;
                border-bottom: #ddd !important;
                padding-top: 11px !important
            }

            .openning-date {
                top: 0;
                margin-top: 0;
                margin-bottom: 52px
            }

            .openning-date .delivery-span {
                opacity: 1
            }

            .content,
            .contentb {
                width: 100%
            }

            .retail .content,
            .retail .contentb {
                min-height: calc(100vh - 67px) !important
            }

            .enablesorting .categoryPid .content {
                padding-top: 51px;
            }

            .market .favoritePid .content {
                padding-top: 51px;
            }

            .cordova.market .favoritePid .content {
                padding-top: 63px;
            }

            .cordova.enablesorting .categoryPid .content {
                padding-top: 63px;
            }

            .retail.enablesorting .categoryPid .content {
                padding-top: 98px;
            }

            .market.enablesorting .categoryPid .content {
                margin-top: -6px
            }

            .cordova.market.enablesorting .categoryPid .content {
                margin-top: 5px;
            }

            .retail .checkoutID .content {
                padding-bottom: 0 !important;
                padding-top: 0 !important
            }

            .bagph {
                display: none
            }

            .deskmenu {
                opacity: 0;
                transform: translateX(200%);
                position: fixed;
                transition: all .3s ease 0s;
                background-color: #fafafa;
                margin: 0;
                padding: 22px;
                min-height: auto;
                display: block;
                width: 100vw !important;
                top: 66px !important;
                height: calc(100vh - 66px) !important;
                overflow-y: scroll !important
            }

            .deskmenu .logo {
                display: none
            }

            .s-active:not(.isSearching) .deskmenu {
                transform: translateX(0px);
                transition: all .4s ease 0s;
                opacity: 1;
                z-index: 4
            }

            .s-active:not(.isSearching) .deskmenu .logo,
            .s-active:not(.isSearching) .deskmenu .pages,
            .s-active:not(.isSearching) .deskmenu .applinks {
                display: none
            }

            .s-active:not(.isSearching):not(.clickedcat) .deskmenu li {
                margin-bottom: 0;
                display: block !important
            }

            .deskmenu li: first-child {
                border-top: 0
            }

            .homePid .deskmenu .menu li.colle {
                display: block
            }

            .MenuParts .bag {
                top: -14px;
                margin-right: 12px !important
            }

            .header-loyalty-value {
                right: 86px;
                top: 6px !important;
                position: absolute !important
            }

            .retail .MenuParts .bag {
                margin-right: 1px !important
            }

            .menuontop .MenuParts .bag {
                display: block !Important;
            }

            .menuontop .MenuParts .bag.minicv {
                display: none !important;
            }

            li.add-tofav-guideline::before {
                content: "\F27C";
                font-family: Material-Design-Iconic-Font;
                color: #ccc;
                font-size: 35px;
                display: block;
                margin-bottom: 18px
            }

            .subPage .titleAndLegend .title {
                display: none
            }

            .market .subPage .content .titleAndLegend .title {
                display: none !important
            }

            .market .subPage .content .titleAndLegend .title {
                display: none !important
            }

            .showsubcatmenu .subPage .titleAndLegend .title {
                display: none !important
            }

            .favoritePid .titleAndLegend::before {
                display: none
            }
        }

        .verify-mobile {
            position: absolute;
            right: 24px;
            top: 50%;
            cursor: default;
            background: var(--primary-color);
            color: #fff;
            padding: 8px 18px 4px;
            font-family: Roboto, sans-serif;
            font-size: 14px;
            opacity: .1;
            transition: opacity .25s ease-in-out 0s;
            height: 21px;
            transform: translateY(-50%);
            pointer-events: none;
        }

        .signupform.smssent .verify-mobile {
            margin-top: 7px
        }

        .verify-mobile.valid {
            cursor: pointer;
            opacity: 1;
            pointer-events: all;
        }

        .verify-mobile-caption {
            position: relative;
            display: block;
            color: #666;
            font-family: Roboto, sans-serif;
            font-weight: 400;
            font-size: 13px;
            margin-top: 0;
            width: 100%;
            padding-bottom: 16px;
            font-style: italic
        }

        .signupform .verify-mobile-caption {
            text-align: left;
            padding-left: 20px;
            padding-top: 5px;
            padding-bottom: 13px
        }

        .signupform.smssent .verify-mobile-caption {
            display: none
        }

        #updateContactInfoId .verify-mobile-caption {
            display: none
        }

        .zindex2 {
            z-index: 2
        }

        @media(max-width:768px) {

            .verify-mobile-caption {
                margin-bottom: -1px
            }
        }

        .hide-categories .categories {
            display: none !important
        }

        .hide-categories .catReplaceID {
            display: none !important
        }

        .hide-categories .MenuPartsReplace {
            display: none !important
        }

        .mobileMenuWrap .lineLink .ico.koein-icon {
            width: 20px;
            height: 20px;
            top: 17px
        }

        .languageDrp {
            float: right;
            padding-right: 5%;
            width: 32px;
            direction: rtl
        }

        .visit .select-locale {
            width: 80%
        }

        .koein {
            font-family: inherit;
            color: #555;
            font-size: 14px;
            background-color: #efefef
        }

        .koein .kheader {
            background-color: #484844;
            padding: 89px 20px 20px
        }

        .koein .txt1 {
            color: #efefef;
            line-height: 20px
        }

        .koein .klogo img {
            width: 80px;
            height: auto;
            margin-top: 60px;
            margin-bottom: 10px
        }

        .koein .kcenter {
            padding: 25px 15px
        }

        .koein .txt2 {
            line-height: 20px
        }

        .koein .solist {
            margin-top: 30px
        }

        .koein .solist li {
            list-style: none;
            border-top: 1px solid #ddd;
            line-height: 42px;
            font-size: 16px;
            color: #111;
            font-weight: 500
        }

        .koein .solist a {
            background-color: yellow;
            padding: 7px 20px 7px 15px;
            font-size: 14px;
            text-decoration: none;
            color: #111
        }

        .koein .solist li:last-child {
            padding-top: 12px
        }

        .koein .kbottom {
            background-color: #484844;
            padding: 20px;
            display: inline-block;
            width: calc(100% - 40px)
        }

        .categories ul>li .picture {
            width: 80px;
            height: 80px
        }

        .categories .swiper-no-swiping ul>li .picture {
            width: 85px;
            height: 85px;
            background-color: var(--primary-color)
        }

        .terms-big-wrapper {
            z-index: 10 !important
        }

        .mini-disclaimer {
            font-family: Roboto, sans-serif;
            color: #999;
            font-weight: 400;
            font-size: 13px;
            width: 100%;
            text-align: center;
            margin-top: 17px;
            margin-bottom: 21px;
            padding-bottom: 20px
        }

        .signupform .mini-disclaimer {
            display: none
        }

        .underline-it {
            text-decoration: underline;
            cursor: pointer
        }

        @media(max-width:768px) {
            .partReceipt.left {
                display: none
            }
        }

        @media(max-width:768px) {
            .categories ul>li .picture {
                width: 92px;
                height: 92px
            }

            .categories .swiper-no-swiping ul>li .picture {
                background-color: transparent
            }
        }

        .koein .txt3 {
            margin-top: 25px;
            color: #efefef;
            font-weight: 400;
            font-size: 16px
        }

        .koein .zwzlink {
            margin-top: 33px;
            margin-bottom: 30px
        }

        .koein .zwzlink a {
            background-color: yellow;
            padding: 7px 20px 7px 15px;
            font-size: 14px;
            text-decoration: none;
            color: #111
        }

        .koein .kcontact {
            border-top: 1px solid #555
        }

        .koein .kcontact img {
            width: 50px;
            height: auto;
            margin-right: 22px;
            margin-top: 30px
        }

        .tinyselect {
            width: 57px;
            height: 22px;
            background: #fff;
            overflow: hidden;
            position: relative;
            float: left;
            margin-top: -3px;
            margin-right: 12px;
            border: 1px solid #e6e6e6
        }

        .tinyselect::before {
            content: "\F2F2";
            position: absolute;
            left: 6px;
            color: #666;
            top: -1px;
            display: inline-block;
            font: 25px / 1 Material-Design-Iconic-Font;
            pointer-events: none
        }

        .retail.rtl .customizedID .tinyselect {
            margin-top: 1px
        }

        .tinyselect select {
            width: 70px;
            height: 100%;
            margin: 0;
            padding: 1px 0 0 19px;
            color: #000;
            cursor: pointer;
            border: 1px solid #fff;
            background: #fff;
            font-size: 12px;
            font-family: inherit;
            line-height: 17px;
            font-weight: bold;
            appearance: none
        }

        .fnb.rtl .tinyselect select {
            direction: ltr;
            padding-left: 25px !important
        }

        select:focus {
            outline: 0
        }

        .tinyselect::after {
            position: absolute;
            top: 4px;
            right: 7px;
            padding: 0 0 0 5px;
            pointer-events: none;
            color: var(--primary-color);
            font-weight: bold;
            font-size: 15px;
            line-height: 14px
        }

        .tinyselect::after {
            transition: all .25s ease 0s
        }

        .formPart .inner-price {
            margin-left: 4px !important;
            color: #999 !important;
            font-size: 11px !important
        }

        .retail .no-price .inner-price {
            pointer-events: none
        }

        .classicproduct .no-price .inner-price {
            display: none
        }

        .formPart .price {
            top: 0;
            user-select: none
        }

        .news-section .itemsList .itemGrid .descBlock .title {
            font-size: 18px;
            color: var(--primary-color);
            white-space: normal
        }

        .news-section .itemsList .itemGrid .descBlock h2 {
            margin-bottom: 17px
        }

        .news-section .itemsList .itemGrid .priceWrap .price {
            font-size: 13px;
            color: #878787;
            font-weight: normal;
            text-transform: lowercase;
            float: left;
            width: 89%;
            text-align: right;
            margin-top: -2px;
            position: absolute;
            padding-right: 0;
            box-sizing: border-box;
            padding-left: 0;
            padding-top: 0
        }

        .myBagModule .itemBags .customPart .type {
            word-break: break-word
        }

        .retail .myBagModule .itemBags .customPart .type {
            display: none
        }

        @media(max-width:768px) {
            .news-section .itemsList .itemGrid .descBlock {
                height: auto;
                min-height: auto
            }

            .news-section .itemsList .itemGrid .descBlock .title {
                font-size: 18px;
                margin-bottom: 10px
            }

            .news-section .itemsList .itemGrid .descBlock .description {
                font-size: 14px
            }

            .market .news-section .itemsList .itemGrid .descBlock .description {
                display: block !important;
                font-size: 14px !important;
                line-height: 21px !important
            }

            .newsCtrl.subPage .case .titleAndLegend {
                height: 21px;
                display: none !important
            }

            .newsCtrl.subPage .titleAndLegend .title {
                display: block;
                margin-top: 28px
            }

            .rtl .newsCtrl.subPage .titleAndLegend .title {
                text-align: right
            }

            .newsCtrl .itemsList .itemGrid .picture {
                max-height: 1000px;
                height: auto;
                width: 100%;
                border-radius: 0;
                min-height: 362px
            }

            .newsCtrl .itemsList .itemGrid .picture img {
                display: block;
                position: relative;
                width: 100%;
                height: auto
            }

            .market .newsCtrl .itemsList .itemGrid .picture img {
                width: inherit;
                top: 0 !important
            }

            .newsCtrl .itemsList .itemGrid {
                height: auto;
                display: inline-block;
                min-width: 100vw;
                width: auto !important;
                margin-right: 0 !important
            }

            .rtl .itemsList .itemGrid {
                margin-right: auto !important
            }

            .news-section .itemsList .genBtn {
                width: 115px;
                font-size: 12px;
                right: auto !important
            }
        }

        .clear-bag {
            cursor: pointer;
            font-size: 11px;
            transition: all .25s ease-in-out 0s;
            text-decoration: none;
            padding-bottom: 8px;
            width: auto;
            overflow: visible;
            display: inline;
            color: #999
        }

        .forcePopupDisplayBlock {
            display: block !important
        }

        .app-version {
            position: absolute;
            right: 16px;
            top: 94px;
            font-size: 8px;
            color: #ddd
        }

        @media(min-width:769px) {
            .clear-bag:hover {
                color: var(--primary-color)
            }
        }

        .driverorderCtrl header,
        .driverorderCtrl footer {
            display: none
        }

        .driver-order-info {
            position: relative;
            display: block;
            min-height: 100vh;
            width: 100%
        }

        .driver-order-info .googleMap {
            position: relative;
            display: block;
            width: 100%;
            overflow: hidden;
            height: calc(100% - 134px) !important
        }

        .driver-order-info .googleMap img {
            width: 100%
        }

        .driver-order-info .googleMap .delivered-tab {
            position: absolute;
            font-size: 17px;
            font-family: Roboto, sans-serif;
            left: 25px;
            top: 17px;
            z-index: 100000;
            color: #fff;
            width: calc(100% - 50px);
            text-align: center;
            height: 54px;
            line-height: 54px;
            background-color: #3e9459 !important
        }

        .driver-order-info .googleMap .delivered-tab i {
            position: absolute;
            left: 18px;
            border: 3px solid #fff;
            border-radius: 50%;
            height: 23px;
            width: 23px;
            top: 11px;
            color: #848b92;
            font-size: 18px;
            font-weight: bold;
            transition: all .25s ease-in-out 0s;
            background: transparent
        }

        .driver-order-info .googleMap .delivered-tab i::before {
            content: "";
            transition: all .25s ease-in-out 0s
        }

        .driver-order-info .googleMap .delivered-tab.delivered {
            transition: all .25s ease-in-out 0s;
            background-color: #ced2d6 !important
        }

        .driver-order-info .googleMap .delivered-tab.delivered i {
            background: #fff
        }

        .driver-order-info .googleMap .delivered-tab.delivered i::before {
            content: "\F26B";
            font: 25px / 1 Material-Design-Iconic-Font;
            color: #ced2d6;
            position: absolute;
            top: -1px;
            left: 3px
        }

        .driver-order-info .order-info {
            min-height: 65px;
            position: relative;
            display: block;
            background-color: #fff;
            padding: 25px 102px 25px 27px
        }

        .driver-order-info .order-info .order-header {
            color: #3e9459;
            font-size: 20px;
            font-family: Roboto, sans-serif
        }

        .driver-order-info .order-info .order-address {
            position: relative;
            display: block;
            margin-top: 5px;
            color: #666;
            font-size: 15px;
            font-family: Roboto, sans-serif
        }

        .driver-order-info .order-info .order-mobile {
            position: absolute;
            width: 65px;
            height: 65px;
            border-radius: 50%;
            right: 27px;
            bottom: 25px;
            box-shadow: #cccccb 0 0 19px 2px;
            color: #fff;
            text-decoration: none;
            background-color: #3e9459 !important
        }

        .driver-order-info .order-info .order-mobile i {
            width: 100%;
            height: 100%;
            font-size: 30px;
            color: #fff;
            text-align: center;
            line-height: 68px
        }

        .driver-order-info .order-info .order-mobile i::before {
            content: "\F2BE";
            font-family: Material-Design-Iconic-Font;
            font-size: 35px;
            display: block;
            margin-bottom: 18px;
            font-style: normal;
            color: #fff !important
        }

        .ot-background {
            background-size: auto 60%;
            background-repeat: repeat-x;
            background-position: 0 center
        }

        .ot-container {
            position: relative;
            display: block;
            transform: translate(0px, 0px);
            height: 210px;
            margin-top: -12px
        }

        .cncld .ot-prgress-bar {
            width: 0 !important
        }

        .ot-container .ot-prgress-bar {
            position: relative;
            display: block;
            height: 1px;
            background-color: #f1f1f1;
            margin-bottom: 12px;
            margin-top: 41px;
            transform: rotate(90deg);
            transform-origin: left center;
            margin-left: 14px;
            width: 208px
        }

        .rtl .ot-container .ot-prgress-bar {
            margin-left: 25px
        }

        .ot-container .ot-prgress-bar::after {
            content: "";
            background-color: var(--primary-color);
            position: absolute;
            left: 0;
            bottom: -1px;
            height: 2px;
            width: 0;
            transition: all .5s ease 0s
        }

        .ot-container .ot-prgress-status-ctn {
            list-style: none;
            position: relative;
            width: 89px;
            height: 320px;
            text-align: center;
            margin-top: -32px
        }

        .rtl .ot-container .ot-prgress-status-ctn {
            transform: rotateY(180deg)
        }

        .ot-container .ot-prgress-status {
            color: #999;
            font-size: 12px;
            font-family: Roboto, sans-serif;
            text-align: left;
            position: relative;
            float: left;
            height: 70px;
            width: 130px;
        }

        .rtl .ot-container .ot-prgress-status {
            font-family: inherit
        }

        .rtl .ot-container .ot-prgress-status {
            transform: rotateY(180deg);
            margin-left: -52px
        }

        .ot-container .ot-prgress-status::before {
            content: ">>>>";
            font-family: arial;
            font-size: 14px;
            color: #ccc;
            position: absolute;
            left: -16px;
            top: 22px;
            display: none
        }

        .ot-container .ot-prgress-status: first-child::before {
            content: ""
        }

        @media(max-width:768px) {
            .ot-container .ot-prgress-status::before {
                content: ">>>>";
                font-size: 11px;
                left: -13px
            }
        }

        @media(max-width:768px) {
            .ot-container .ot-prgress-status::before {
                content: ">>>";
                font-size: 11px;
                left: -8px
            }
        }

        @media(max-width:330px) {
            .ot-container .ot-prgress-status::before {
                content: ">>";
                font-size: 11px;
                left: -5px
            }
        }

        .ot-container .ot-prgress-status .ot-status-icon {
            position: relative;
            display: block;
            height: 15px;
            width: 15px;
            border-radius: 50%;
            margin: 5px 13px 8px 4px;
            float: left;
        }

        .ot-container .ot-status-icon i {
            display: none
        }

        .ot-container .ot-status-icon {
            background-color: #f7f7f7;
            border: 3px solid #ddd;
            top: 1px
        }

        .ot-container .ot-cooking .ot-status-icon {
            background-repeat: no-repeat;
            background-position: 9px 10px;
            background-size: 75%
        }

        .ot-container .ot-ontheway .ot-status-icon {
            background-repeat: no-repeat;
            background-position: 6px -35px;
            background-size: 75%
        }

        .ot-container .ot-orderarrived .ot-status-icon {
            background-repeat: no-repeat;
            background-position: 14px -85px;
            background-size: 72%
        }

        .ot-container.ot-progress-1 .ot-prgress-bar::after {
            width: 0
        }

        .ot-container.ot-progress-2 .ot-prgress-bar::after {
            width: 28%
        }

        .ot-container.ot-progress-3 .ot-prgress-bar::after {
            width: 60%
        }

        .ot-container.ot-progress-4 .ot-prgress-bar::after {
            width: 100%
        }

        .ot-container.ot-progress-1 .ot-processing i,
        .ot-container.ot-progress-2 .ot-processing i,
        .ot-container.ot-progress-3 .ot-processing i,
        .ot-container.ot-progress-4 .ot-processing i,
        .ot-container.ot-progress-2 .ot-cooking i,
        .ot-container.ot-progress-3 .ot-cooking i,
        .ot-container.ot-progress-4 .ot-cooking i,
        .ot-container.ot-progress-3 .ot-ontheway i,
        .ot-container.ot-progress-4 .ot-ontheway i,
        .ot-container.ot-progress-4 .ot-orderarrived i {
            position: relative;
            display: block;
            color: #fff;
            font-size: 19px;
            height: 100%;
            line-height: 26px
        }

        .ot-container .ot-processing {
            font-weight: bold;
            color: #4c4c4c;
        }

        .ot-container.ot-progress-2 .ot-cooking {
            font-weight: bold;
            color: #4c4c4c
        }

        .ot-container.ot-progress-3 .ot-cooking,
        .ot-container.ot-progress-3 .ot-ontheway {
            font-weight: bold;
            color: #4c4c4c
        }

        .ot-container.ot-progress-4 .ot-cooking,
        .ot-container.ot-progress-4 .ot-ontheway,
        .ot-container.ot-progress-4 .ot-orderarrived {
            font-weight: bold;
            color: #4c4c4c
        }

        .ot-orderarrived span {
            /* background-color: green!important; */
            /* border-color: green!Important; */
        }

        .ot-container .ot-processing .ot-status-icon {
            background-color: var(--primary-color);
            transition: all .25s ease 0s;
            border-color: var(--primary-color);
            width: 25px;
            height: 25px;
            margin-left: -1px;
            margin-top: 4px;
        }

        .ot-container.ot-progress-2 .ot-cooking .ot-status-icon {
            background-color: var(--primary-color);
            transition: all .25s ease 0s;
            border-color: var(--primary-color);
            width: 25px;
            height: 25px;
            margin-left: -1px
        }

        .ot-container.ot-progress-3 .ot-cooking .ot-status-icon,
        .ot-container.ot-progress-3 .ot-ontheway .ot-status-icon {
            background-color: var(--primary-color);
            transition: all .25s ease 0s;
            border-color: var(--primary-color);
            width: 25px;
            height: 25px;
            margin-left: -1px
        }

        .ot-container.ot-progress-4 .ot-cooking .ot-status-icon,
        .ot-container.ot-progress-4 .ot-ontheway .ot-status-icon,
        .ot-container.ot-progress-4 .ot-orderarrived .ot-status-icon {
            background-color: var(--primary-color);
            transition: all .25s ease 0s;
            border-color: var(--primary-color);
            width: 25px;
            height: 25px;
            margin-left: -1px
        }

        .ot-container .ot-processing::after {
            content: "";
            position: absolute;
            left: 0;
            right: 0;
            top: -102px;
            height: 90px;
            width: 58px;
            background-size: 53px;
            background-repeat: no-repeat;
            margin-left: auto;
            margin-right: auto;
            filter: grayscale(100%);
            display: none
        }

        .ot-container .ot-cooking::after {
            content: "";
            position: absolute;
            left: 0;
            right: 0;
            top: -99px;
            height: 90px;
            width: 59px;
            background-size: 54px;
            background-repeat: no-repeat;
            margin-left: auto;
            margin-right: auto;
            filter: grayscale(100%);
            display: none
        }

        .ot-container .ot-ontheway::after {
            content: "";
            position: absolute;
            left: 0;
            right: 0;
            top: -89px;
            height: 90px;
            width: 85px;
            background-size: 78px;
            background-repeat: no-repeat;
            margin-left: auto;
            margin-right: auto;
            filter: grayscale(100%);
            display: none
        }

        .ot-container .ot-orderarrived::after {
            content: "";
            position: absolute;
            left: 0;
            right: 0;
            top: -88px;
            height: 90px;
            width: 60px;
            background-size: 54px;
            background-repeat: no-repeat;
            margin-left: auto;
            margin-right: auto;
            filter: grayscale(100%);
            display: none
        }

        @media(max-width:360px) {
            .ot-container .ot-processing::after {
                width: 50px;
                background-size: 50px;
                top: -94px
            }

            .ot-container .ot-cooking::after {
                width: 51px;
                background-size: 51px;
                top: -91px
            }

            .ot-container .ot-ontheway::after {
                width: 73px;
                background-size: 73px;
                top: -87px
            }

            .ot-container .ot-orderarrived::after {
                width: 52px;
                background-size: 52px;
                top: -80px
            }
        }

        .ot-container.ot-progress-1 .ot-processing::after,
        .ot-container.ot-progress-2 .ot-processing::after,
        .ot-container.ot-progress-3 .ot-processing::after,
        .ot-container.ot-progress-4 .ot-processing::after,
        .ot-container.ot-progress-2 .ot-cooking::after,
        .ot-container.ot-progress-3 .ot-cooking::after,
        .ot-container.ot-progress-4 .ot-cooking::after,
        .ot-container.ot-progress-3 .ot-ontheway::after,
        .ot-container.ot-progress-4 .ot-ontheway::after,
        .ot-container.ot-progress-4 .ot-orderarrived::after {
            filter: grayscale(0%)
        }

        @media only screen and (min-width:769px) {
            .swiperID {
                margin-top: -5px
            }

            .swiperID.fix,
            .swiperID.fix2 {
                top: -61px !important
            }

        }

        .reachPID {
            min-height: 100vh;
            width: calc(100% - 604px);
            display: inline-block;
            vertical-align: top
        }

        .rtl .reachPID {
            float: right
        }

        .clear {
            clear: both;
            list-style: none
        }

        .locationBox {
            float: left;
            position: relative;
            height: 96px;
            width: 628px;
            background-color: #fff
        }

        .reachLocations {
            position: absolute;
            width: 100%;
            height: auto;
            bottom: 0;
            left: 0
        }

        .reachLocations .over {
            position: relative;
            overflow: hidden;
            width: 100%;
            height: 0;
            background-color: #333230;
            transform: translate3d(0px, 0px, 0px);
            transition: height .5s cubic-bezier(0.21, 0.48, 0.84, 0.49) 0s
        }

        .reachLocations .item {
            min-height: 77px;
            margin-bottom: 26px;
            width: 100%;
            max-width: 520px;
            margin-right: 88px;
            cursor: pointer
        }

        .reachLocations .item:nth-child(2n) .sep {
            display: none
        }

        .reachLocations .item:nth-child(2n) {
            margin-right: 0
        }

        .wrpLocations {
            position: relative;
            width: 100%;
            padding-top: 9px;
            padding-left: 8px;
            height: 100%;
            box-sizing: border-box
        }

        .reachLocations .locAddress {
            margin-left: 0;
            padding-left: 0;
            margin-right: 0;
            width: 218px
        }

        .reachLocations .closeBtn {
            margin-left: auto;
            margin-right: auto;
            position: relative;
            text-decoration: none;
            border: 2px solid #fff;
            width: 64px;
            height: 63px;
            cursor: pointer;
            transform: translate3d(0px, 0px, 0px);
            border-radius: 100%;
            transition: border-color .3s ease 0s
        }

        .reachLocations .locationBox .sep {
            position: absolute;
            right: 0;
            top: 0;
            height: 77px;
            float: none;
            display: none
        }

        .reachLocations .telEmail {
            width: 218px
        }

        .locAddress {
            position: relative;
            float: left;
            margin-right: 14px;
            padding-left: 37px;
            margin-left: 20px;
            margin-top: 26px;
            width: 320px;
            box-sizing: border-box
        }

        .locAddress .fa-map-marker {
            color: #ee2e22;
            font-size: 55px;
            position: absolute;
            top: 0;
            left: 0
        }

        .locAddress .icon {
            position: absolute;
            top: 0;
            left: 0;
            width: 27px;
            height: 35px
        }

        .locAddress .icon .double {
            width: 54px;
            height: 70px;
            background-position: -640px -2930px;
            background-repeat: no-repeat;
            background-size: initial
        }

        .locAddress .street: first-child {
            font-size: 18px;
            color: #333;
            padding-top: 3px;
            overflow: hidden;
            font-family: titlefont;
            font-weight: bold !important
        }

        .locAddress .street p {
            width: 90%;
            font-size: 14px;
            font-weight: normal
        }

        .rtl .locAddress .street p {
            margin-left: auto;
            margin-right: 0
        }

        .locAddress .street.noaddressName {
            padding-top: 20px
        }

        .locAddress .street.Desc {
            color: #666;
            padding-top: 0;
            margin-top: 7px
        }

        .telEmail {
            position: relative;
            float: left;
            width: 262px;
            padding-top: 29px;
            box-sizing: border-box
        }

        .locationBox .sep {
            float: left;
            position: relative;
            width: 2px;
            height: 100%;
            background-color: #222
        }

        .telEmail .lineType {
            position: relative;
            min-height: 25px;
            float: left;
            margin-right: 44px
        }

        .telEmail .lineType .type {
            position: absolute;
            left: 0;
            top: -3px;
            text-transform: uppercase;
            font-size: 28px;
            color: var(--secondary-color)
        }

        .rtl .telEmail .lineType .type {
            font-family: inherit;
            line-height: 12px;
            transform: rotateY(180deg)
        }

        .telEmail .lineType .value a {
            transform: translate3d(0px, 0px, 0px);
            transition: color .3s ease 0s;
            text-decoration: none;
            display: block;
            font-size: 15px;
            color: #666
        }

        .telEmail .lineType .value {
            font-size: 15px;
            color: #666
        }

        .locationBox {
            height: auto
        }

        .LocationAjaxData .telEmail {
            padding-top: 0;
            padding-left: 36px
        }

        .LocationAjaxData .locAddress {
            margin-bottom: 15px;
            margin-left: 0;
            margin-top: 0;
            width: 218px
        }

        .locationBox .wrp {
            position: relative;
            width: auto;
            height: auto
        }

        .locationBox .wrp .locationBox2 {
            position: relative
        }

        .telEmail .lineType .value {
            text-decoration: none
        }

        .rtl .telEmail .lineType .value {
            transform: rotateY(180deg);
            padding-left: 0;
            box-sizing: border-box;
            text-align: right
        }

        .reachLocations .locAddress {
            width: 100% !important;
            height: auto !important;
            margin-top: 0 !important;
            padding-top: 0 !important
        }

        .wrpLocations {
            padding-top: 66px;
            padding-bottom: 114px;
            transition: all .2s linear 0s;
            padding-left: 0 !important;
            padding-right: 2% !important;
            height: auto !important
        }

        .reachLocations .wrpLocations {
            margin-top: 4px
        }

        .locAddress .street {
            font-weight: 300;
            padding-top: 0 !important
        }

        .rtl .locAddress .street {
            font-family: inherit;
            transform: rotateY(180deg);
            text-align: right;
            line-height: 17px
        }

        .reachLocations {
            position: relative;
            left: auto;
            bottom: auto
        }

        .reachLocations li {
            list-style: none;
            width: 48%;
            display: inline-block;
            margin-right: 14px;
            vertical-align: top
        }

        .rtl .reachLocations li {
            float: right
        }

        .reachLocations .item {
            min-height: 0;
            box-sizing: border-box;
            float: none;
            margin-right: 0;
            padding-left: 20px;
            padding-right: 20px;
            width: 100%;
            max-width: 100%;
            box-shadow: rgba(204, 204, 204, 0.24) 0 0 4px;
            padding-bottom: 21px !important;
            padding-top: 20px !important;
            margin-bottom: 10px !important
        }

        .rtl .reachLocations .item {
            transform: rotateY(180deg)
        }

        .rtl .reachLocations .item .ctel {
            transform: rotateY(180deg);
            text-align: right;
            padding-right: 57px
        }

        .rtl .reachLocations .item .cemail {
            padding-right: 57px
        }

        .rtl .telEmail .lineType {
            margin-left: -34px;
            margin-right: 25px
        }

        .reachLocations .item: last-child {
            margin-bottom: 4px;
            min-height: 160px
        }

        @media(max-width:768px) {
            .rtl .reachPID {
                float: none
            }

            .rtl .reachLocations li {
                float: none
            }
        }

        .responsive-stacked-table.with-mobile-labels td.withTitle:nth-of-type(2)::before {
            content: attr(data-text)
        }

        .responsive-stacked-table.with-mobile-labels td.withTitle:nth-of-type(1)::before {
            content: attr(data-text)
        }

        .responsive-stacked-table.with-mobile-labels td.withTitle:nth-of-type(3)::before {
            content: attr(data-text)
        }

        .responsive-stacked-table.with-mobile-labels td.withTitle:nth-of-type(4)::before {
            content: attr(data-text)
        }

        .responsive-stacked-table.with-mobile-labels td.withTitle:nth-of-type(5)::before {
            content: attr(data-text)
        }

        .orderReview .responsive-stacked-table.with-mobile-labels td.withTitle:nth-of-type(1)::before {
            content: attr(data-text)
        }

        .orderReview .responsive-stacked-table.with-mobile-labels td.withTitle:nth-of-type(2)::before {
            content: attr(data-text)
        }

        .orderReview .responsive-stacked-table.with-mobile-labels td.withTitle:nth-of-type(3)::before {
            content: attr(data-text)
        }

        .rtl .menuList.weRecom {
            line-height: 12px;
            font-family: inherit
        }

        .hot-line {
            font-family: inherit;
            color: #fff;
            font-weight: 600;
            font-size: 28px;
            margin-right: 13px
        }

        .hot-line::after {
            font: 23px / 1 Material-Design-Iconic-Font;
            content: "\F2BE"
        }

        .hot-line: empty {
            display: none
        }

        .rtl select,
        button,
        .rtl input,
        .rtl textarea {
            text-align: right;
            direction: rtl;
            font-family: inherit !important
        }

        .rtl .filter input {
            font-family: inherit
        }

        .MenuParts .parts .bot .faBars {
            margin-right: 27px
        }

        .rtl .footer .menu .link li span {
            font-family: inherit
        }

        .rtl .mainTitle.ng-scope {
            font-family: inherit
        }

        .rtl .loginRegisterID .smallTittle {
            font-family: inherit
        }

        .rtl .normalForm .label {
            font-family: inherit;
            right: 15px;
            line-height: 14px
        }

        .rtl .passedit .normalForm .label {
            left: 0;
            text-align: left
        }

        .rtl .inputWrap.focused .label {
            left: 0;
            right: auto;
            line-height: 13px
        }

        .rtl .listingAccount li span {
            font-family: inherit
        }

        .rtl .noflex.big.empty .cell {
            font-family: inherit
        }

        .rtl .loginRegisterID .wrap {
            padding-top: 23px;
            padding-right: 0 !important
        }

        .rtl .left.part {
            text-align: right;
            box-sizing: border-box;
            direction: rtl;
        }

        .rtl .loginRegisterID .normalForm .txtForgot {
            font-family: inherit
        }

        .rtl .line.desk {
            display: inline-block
        }

        .rtl .loginRegisterID .parts .right {
            text-align: right;
            padding-right: 52px;
            box-sizing: border-box
        }

        .rtl .listingAccount li .zmdi {
            display: none
        }

        .rtl .text {
            font-family: inherit;
            line-height: 40px
        }

        .rtl .mobileMenuWrap .lineLink {
            direction: rtl;
            padding-right: 26px
        }

        .rtl .generalMainTitle {
            font-family: inherit
        }

        .rtl .description {
            font-family: inherit;
            text-align: right
        }

        .rtl .bTitle,
        .rtl .txt {
            font-family: inherit;
            line-height: 21px;
            text-align: right;
            min-height: 24px;
            margin-right: -13px;
            padding-right: 13px;
            font-size: 16px !important
        }

        .rtl .myBagModule .bagTitle {
            font-family: inherit;
            text-align: right;
            padding-right: 14px;
            box-sizing: border-box
        }

        .rtl .cutomBox .cLink {
            font-family: inherit
        }

        .rtl .custText {
            font-family: inherit
        }

        .rtl .boxTitle {
            font-family: inherit;
            text-align: right
        }

        .rtl .clear-bag {
            font-family: inherit
        }

        .rtl .titleBox {
            font-family: inherit
        }

        .rtl .orderdetails .titleBox {
            text-align: right
        }

        .rtl .subLine .lbl {
            font-family: inherit
        }

        .rtl .totalLbl {
            font-family: inherit
        }

        .rtl .radio .label {
            font-family: inherit;
            line-height: 12px
        }

        .rtl .input .label {
            font-family: inherit;
            line-height: 12px;
            /* float: left; */
        }

        .rtl .customizedID .input .label {
            padding-right: 33px;
            text-align: right !important;
        }

        .rtl.retail .customizedID .input .label {
            float: left;
            line-height: 9px;
            direction: rtl;
            text-align: left
        }

        .rtl select {
            line-height: 15px;
            font-family: inherit !important;
            padding-right: 10px;
        } 

        .rtl .pageMainTitle {
            font-family: inherit;
            text-align: right
        }

        .rtl .checkoutID .pageMainTitle {
            text-align: center;
            padding-top: 21px
        }

        .rtl .openning-date .delivery-span {
            font-family: inherit;
            font-size: 31px;
            direction: rtl;
        }

        .rtl .orders .order .withTitle {
            font-family: inherit;
            text-align: right;
            line-height: 23px;
            float: right;
            overflow: hidden;
            direction: rtl;
            padding-left: 22px;
            width: 100%;
            padding-right: 17px
        }

        .rtl .extra-note {
            font-family: inherit;
            text-align: right;
        }

        .rtl .mobileMenuWrap ul li {
            text-align: right;
            padding-right: 28px;
            box-sizing: border-box
        }

        .rtl .mobileMenuWrap ul li a {
            font-family: inherit
        }

        .rtl div#recommended {
            text-align: right
        }

        .rtl .mobileMenuWrap .lineLink .text {
            font-family: inherit !important
        }

        .MenuParts .bag {
            text-transform: uppercase;
            cursor: pointer
        }

        .menuList.bag::before {
            font-style: normal;
            font-variant: normal;
            font-weight: normal;
            font-stretch: normal;
            line-height: 1;
            font-family: Material-Design-Iconic-Font;
            content: "\F1C9";
            margin-right: 8px;
            top: 3px;
            color: var(--primary-color);
            width: 62px;
            position: relative;
            font-size: 25px !important
        }

        .fnb .menuList.bag::before {
            content: "\F195"
        }

        .retail .menuList.bag::before {
            content: "";
            display: none
        }

        .retail .menuList.bag span::after {
            content: "";
            top: -9px;
            position: absolute;
            width: 15px;
            height: 8px;
            left: 4px;
            z-index: 0;
            border-radius: 50% 50% 0 0 / 100% 100% 0 0
        }

        .rtl .orTxtWrap .orTxt .line {
            display: none
        }

        .rtl .column_cust .block .bSmallTitle {
            font-family: inherit;
            transform: rotateY(180deg);
            text-align: right;
            font-weight: 400;
            font-size: 16px;
            direction: rtl
        }

        .rtl .verify-mobile-caption {
            font-family: inherit;
            font-size: 13px;
            margin-bottom: 0;
            text-align: center
        }

        .rtl .createAccountID .parts .part {
            text-align: right
        }

        .rtl .mini-disclaimer {
            font-family: inherit;
            text-align: center;
            width: 100%
        }

        .rtl label.missing {
            left: 8px;
            right: auto;
            height: 18px;
            line-height: 11px;
            top: -16px
        }

        .rtl label.missing#mobile-error {
            right: 82px;
            left: auto
        }

        .rtl .createAccountID .mainTitle {
            text-align: center
        }

        .moreBtn {
            text-transform: uppercase
        }

        .rtl .column_cust .block .bTitle {
            transform: rotateY(180deg);
            padding-left: 0
        }

        .rtl .customizedID.noCustomization .column_cust .block .bigPrice {
            text-align: center
        }

        .rtl .customizedID .column_cust .block .bigPrice {
            text-align: right;
            margin-top: 8px
        }

        .rtl .customizedID .column_cust.onRight .block {
            float: left;
            transform: rotateY(0deg)
        }

        .column_cust.onRight .bTitle.totalCss {
            transform: none
        }

        .rtl .customizedID .column_cust .block .textarea textarea {
            font-family: inherit;
            font-size: 12px
        }

        .rtl .MenuParts .signedIn .userInfo .cont ul li a {
            font-family: inherit;
            text-align: right;
            width: 100%
        }

        .rtl .titleThanks {
            font-family: inherit
        }

        .rtl .fullThankyou .orderProc {
            font-family: inherit;
            margin-bottom: 28px
        }

        .rtl .partReceipt .txtReceipt {
            font-family: inherit
        }

        .rtl .partReceipt .note {
            font-family: inherit
        }

        .rtl .categories ul>li .title {
            line-height: 23px;
            padding-bottom: 0;
            text-align: center
        }

        .rtl .partReceipt.left {
            text-align: right
        }

        .rtl .recTable .headTab {
            font-family: inherit
        }

        .rtl .recTable {
            transform: rotateY(180deg)
        }

        .rtl .recTable .cell {
            font-family: inherit;
            transform: rotateY(180deg);
            text-align: right
        }

        .rtl .recTable .cell:nth-child(6) {
            text-align: left
        }

        .receiptBox .head {
            display: none
        }

        #customizedModalID .addToFav {
            float: left;
            width: 50%;
            border-top: 1px solid #eee;
            height: 57px;
            margin: 0;
            box-sizing: border-box;
            line-height: 46px;
            text-transform: uppercase;
            color: #444;
            text-align: center;
            background-color: #fff
        }

        .market .addToFav.heartHov {
            display: none;
        }

        .retail #customizedModalID .addToFav {
            border: 1px solid #ddd;
            width: calc(50% - 7px);
            height: 50px;
            border-radius: 4px;
            box-sizing: border-box;
            line-height: 50px;
            padding-top: 0;
            margin-bottom: 22px;
            position: relative;
            margin-left: 7px
        }

        .retail #customizedModalID .onRight .addToFav {
            display: none
        }

        .rtl .myBagModule .itemBags .customPart .name,
        .rtl .myBagModule .itemBags .customPart .type {
            font-family: inherit;
            line-height: 14px;
            float: right
        }

        .myBagModule .itemBags .customPart .elements {
            width: calc(100% - 107px)
        }

        .myBagModule.stick .wrapTotalBtn {
            display: none
        }

        .rtl .coupons div {
            float: right;
            /* margin-right: 3px; */
            direction: rtl
        }

        .box_date {
            transform: translate(0px, 0px)
        }

        .notloggedin div#schedule-order-id {
            display: none
        }

        .box_date.pickordel {
            margin-top: 0;
            padding-top: 16px;
            padding-right: 19px;
            min-height: 56px;
        }

        .rtl #checkoutFormId .title,
        .rtl #checkoutFormId .brand {
            text-align: right
        }

        .rtl .dateForm .label {
            margin-left: 27px;
            direction: rtl;
            padding-top: 4px;
        }

        .recTable .footTab .table .cell .text {
            width: auto
        }

        .rtl #promotionId .message-ctn {
            font-family: inherit
        }

        .wrapCustom,
        .column_cust,
        .blcWrap {
            width: 100%
        }

        .modal.noCustomization .column_cust {
            max-width: 100%;
            text-align: center;
            width: 100%
        }

        .modal.noCustomization .customnote {
            display: none;
        }

        .market .modal.noCustomization .column_cust {
            display: none
        }

        .rtl .column_cust.onRight {
            transform: rotateY(0deg) !important
        }

        .rtl .column_cust.onRight .block .bTitle {
            transform: rotateY(0deg)
        }

        .customizedID .input.checked .label {
            color: var(--primary-color);
            font-weight: 600;
            text-align: left
        }

        .rtl .createAccountID .line {
            background-color: #fff
        }

        .loginRegisterID .parts .left {
            box-sizing: border-box
        }

        .loginRegisterID .genBtn,
        .loginRegisterID .moreBtn,
        .loginRegisterID .loadMore {
            max-width: 100%
        }

        .genBtn {
            text-transform: uppercase
        }

        .box_feedback .genBtn {
            width: 100%;
            height: 50px
        }

        .createAccountID .genBtn {
            max-width: 100%;
            margin: auto
        }

        .orTxtWrap {
            max-width: 100%
        }

        .rtl .verify-mobile {
            font-family: inherit;
            font-size: 11px
        }

        .rtl .whiteBox .boxes.deliverBoxID .box .lines .line .lbl {
            text-align: right;
            float: right;
            font-family: inherit;
            line-height: 13px
        }

        .rtl .addAddressID .label {
            text-align: right
        }

        .rtl .editAddAddress .location .pin {
            font-family: inherit;
            text-align: right
        }

        .editAddAddress .part {
            width: 50%;
            margin: 0
        }

        .rtl .editAddAddress .part {
            float: right
        }

        .editAddAddress .part.left {
            padding-right: 14px;
            box-sizing: border-box
        }

        .rtl .editAddAddress .part.left {
            padding-right: 0;
            padding-left: 12px
        }

        .editAddAddress .genBtn {
            width: 100%;
            margin-top: 17px
        }

        .rtl .editAddAddress .mainTitle {
            text-align: right;
            font-family: inherit
        }

        .rtl .whiteBox .boxes.deliverBoxID .box .lines .line .txt {
            font-family: inherit
        }

        .rtl .coupons .genBtn {
            font-size: 10px;
            position: absolute;
            left: 16px;
            width: auto;
            display: inline-table;
        }

        .rtl .coupons input {
            font-family: inherit
        }

        .rtl .box_delivery .location .customDropDown .drop_select .drop_item {
            text-align: right
        }

        .rtl .box_delivery .location .customDropDown .drop_item {
            text-align: right
        }

        .rtl .receiptPid .fullThankyou .moreBtn {
            font-family: inherit
        }

        .errorpopup {
            position: fixed;
            top: 50%;
            width: 355px;
            z-index: 2147483647;
            background-color: #fff;
            font-family: inherit;
            font-weight: 400;
            font-size: 15px;
            color: #666;
            transition: all .3s cubic-bezier(0.29, 1.31, 1, 1) 0s;
            padding: 50px 19px 21px;
            box-sizing: border-box;
            text-align: center;
            transform: translateX(-50%) translateY(300%);
            left: 50%;
            border-radius: 8px
        }

        .errorpopup .title {
            font-weight: bold;
            padding-bottom: 11px;
            font-size: 17px
        }

        .errorpopup .sub-title {
            font-size: 14px;
            padding: 8px
        }

        .errorpopup.ebottom.multiple-buttons .button {
            width: calc(50% - 17px) !important
        }

        .errorpopup.ebottom.multiple-buttons .button:nth-child(3) {
            color: #fff;
            background-color: var(--primary-color) !important
        }

        .errorpopup.ebottom.has-title .title::before {
            content: "\F1F7";
            font-family: Material-Design-Iconic-Font;
            color: var(--primary-color);
            font-size: 35px;
            display: block;
            margin-bottom: 18px
        }

        .errorpopup.ebottom.has-title .message::before {
            content: ""
        }

        .rtl .whiteBox .userdata {
            text-align: right
        }

        .rtl .whiteBox .boxes .box.showing .edit .inputWrap,
        .rtl .whiteBox .boxes .box.default .edit .inputWrap {
            text-align: right
        }

        .rtl .whiteBox .userdata .lbl {
            font-family: inherit
        }

        .rtl .myAccountPid .pageMainTitle {
            text-align: right;
            padding-right: 4px;
            box-sizing: border-box;
            padding-top: 18px;
            display: none
        }

        .subTopMenu .links .link {
            width: 33%
        }

        .rtl .responsive-stacked-table.with-mobile-labels td::before {
            font-family: inherit
        }

        .rtl .orders .order .oNbItems {
            font-family: inherit;
            line-height: 13px;
            text-align: center
        }

        .rtl .orders .order .orderNb,
        .rtl .orders .order .oNbItems,
        .rtl .orders .order .orderCost {
            text-align: right;
            line-height: 20px;
            padding-right: 17px
        }

        .rtl .itemsList .itemGrid {
            margin-left: 18px;
            margin-right: 0
        }

        .rtl .categoryPid .titleAndLegend div {
            text-align: right
        }

        @media only screen and (min-width:769px) {
            .rtl .withBagOnRight .nearBag.gridSystem ul:first-child {
                right: 38px
            }

            .rtl .filter.normal {
                right: auto;
                left: 0
            }

            .rtl .withBagOnRight .gridSystem .thebig-ul {
                text-align: right
            }

            .rtl .categoryPid .withBagOnRight .generalMainTitle {
                text-align: right;
                padding-right: 397px;
                box-sizing: border-box
            }

            .rtl .categoryPid .generalMainTitle {
                text-align: right;
                box-sizing: border-box
            }
        }

        .rtl .categoryPid .withBagOnRight .generalMainTitle {
            text-align: right
        }

        .rtl .orderdetails .boxData .name {
            text-align: right;
            width: 100%;
            direction: rtl
        }

        .rtl .editMode .location .edit .title {
            text-align: right
        }

        .noOrder .itemsList .genBtn {
            display: none
        }

        .noOrder .menuList.signin {
            display: none
        }

        .noOrder .MenuParts .bag {
            display: none
        }

        .noOrder .MenuParts .logo {
            position: absolute;
            transform: translateX(-50%);
            display: none;
            margin-left: 50% !important
        }

        .noOrder .menuMob {
            display: none !important
        }

        .noOrder .go-back {
            margin-left: -41px
        }

        @media(min-width:1023px) and (max-width:768px) {
            body {
                visibility: visible
            }

            .itemsList .itemGrid {
                width: 233px
            }
        }

        .noOrder .customizedID .wrap {
            padding: 0
        }

        .noOrder .customizedID .head {
            width: auto
        }

        .noOrder .customizedID .addRemoveWrap .price {
            border: 1px solid #fff;
            padding: 7px;
            margin: 0
        }

        .noOrder .zmdi-favorite-outline,
        .noOrder .zmdi-favorite {
            display: none
        }

        .loginRegisterID .right .wrap {
            padding-right: 45px
        }

        nocustomization .genBtn {
            width: 100%
        }

        .loginRegisterID .parts .part .wrap .normalForm .input {
            width: auto
        }

        .rtl .listingAccount li:last-child {
            margin-bottom: 41px
        }

        .rtl .createAccountID .genBtn {
            max-width: 100%;
            margin-top: 48px
        }

        .myAccountPid .input {
            width: auto
        }

        .myAccountPid .input.verifcode {
            margin-top: 8px
        }

        .myAccountPid .input.verifcode input {
            border: 0 !important
        }

        .rtl .ot-container .ot-prgress-status::before {
            transform: rotateY(180deg);
            right: -5px;
            left: auto
        }

        .titleAndLegend {
            min-height: 55px;
            box-sizing: border-box
        }

        .retail .newsCtrl .titleAndLegend {
            margin-bottom: 28px
        }

        .offers-section .titleAndLegend {
            padding-bottom: 0;
            min-height: auto;
            display: none
        }

        .rtl .favoritePid .titleAndLegend {
            text-align: right
        }

        .rtl .favoritePid .titleAndLegend .title,
        .rtl .generalMainTitle {
            text-align: right;
            padding-right: 6px;
            width: calc(100% - 20px);
        }

        .box_instruction {
            transform: translate(0px, 0px);
            perspective: 900000px;
            margin-top: 0 !important
        }

        .box_instruction.specialInstructions {
            padding-left: 13px;
            padding-right: 13px;
            margin-top: -5px !important
        }

        .retail .box_instruction.specialInstructions {
            margin-top: 26px !important
        }

        .box_instruction.notesCss {
            padding-top: 10px;
            padding-bottom: 22px;
            margin-top: 0 !important
        }

        .retail .box_instruction.notesCss {
            margin-top: 0;
            padding-top: 18px
        }

        .termsID {
            max-width: 770px;
            min-width: 750px
        }

        div#offersHowItWorksId {
            max-width: 420px
        }

        .termsID .cont {
            background-color: #fff;
            padding: 25px;
            border-radius: 7px;
            font-size: 14px;
            line-height: 26px !important
        }

        .termsID .cont p,
        .termsID .cont span {
            font-size: 14px;
            line-height: 26px !important;
            color: #333 !important;
            font-family: inherit !important
        }

        .termsID .cont a {
            color: var(--primary-color)
        }

        div#createAccountModalID {
            width: 375px;
            border-radius: 8px
        }

        .mCSB_container {
            overflow: hidden auto;
            top: 0 !important
        }

        .bagScroll .mCSB_container {
            height: calc(100vh - 210px);
        }

        .retail div#mCSB_7_container {
            height: calc(100% - 161px)
        }

        .userbar {
            height: 81px;
            top: 86px;
            position: fixed;
            width: calc(100% - 599px);
            transform: translateX(-50%);
            left: 50%;
            text-align: right;
            color: #333;
            box-sizing: border-box;
            padding-top: 29px;
            background: linear-gradient(#fafafa 47%, rgba(250, 250, 250, 0.27) 100%);
            z-index: 6;
            padding-left: 10px;
            margin-left: -1px
        }

        .reviewbag .userbar {
            display: none !important
        }

        .checkoutID .userbar {
            background: linear-gradient(#eee 47%, rgba(238, 238, 238, 0.27) 100%)
        }

        .showBag .userbar {
            border-bottom: 1px dotted #ddd
        }

        .subPage .userbar {
            border-bottom: 1px dotted #ddd
        }

        .subPage .userbar.up {
            background: 0 center
        }

        .powered {
            text-align: right
        }

        .powered::before {
            font: 18px / 1 Material-Design-Iconic-Font;
            content: "\F387";
            margin-right: 6px;
            color: #777
        }

        .powered a {
            text-decoration: none;
            color: #777;
            font-weight: bold;
            margin-right: 22px;
            font-family: arial, sans-serif
        }

        .footer .terms {
            line-height: 60px;
            color: #999
        }

        .footer .terms div {
            float: left;
            margin-left: 22px;
            cursor: pointer;
            transition: all .3s linear 0s;
            text-transform: capitalize;
            font-family: inherit
        }

        .footer .terms div:hover {
            color: #333;
            transition: all .3s linear 0s
        }

        .customizedID .head .wrap {
            padding: 0;
            height: 100%
        }

        .wrap.nopimgb .picture {
            visibility: hidden
        }

        div#customizedModalID {
            background-color: transparent;
            max-width: 998px;
            width: 100%
        }

        .retail div#customizedModalID {
            background-color: transparent
        }

        .retail div#customizedModalID.rigid {
            top: 0 !important;
            transform: translate3d(-50%, 0px, 0px) !important;
            opacity: 1 !important
        }

        div#customizedModalID .formPart .input .label {
            display: inline-block;
            margin-bottom: 0;
            width: calc(100% - 140px) !important
        }

        .retail div#customizedModalID .formPart .input .label {
            display: block;
            margin-bottom: 0;
            line-height: 14px
        }

        .customizedID .bigPrice {
            position: fixed;
            right: 22px;
            font-weight: 700;
            opacity: .5;
            color: #fff;
            height: 58px;
            line-height: 59px;
            font-size: 15px;
            z-index: 3
        }

        .itembagfooter {
            background-color: #fff;
            width: 100%;
            height: 39px;
            position: relative;
            border-top: 7px solid #fff;
            border-radius: 0 0 5px 5px
        }

        .notloggedin .itembagfooter {
            height: 38px
        }

        .checkoutID .myBagModule .genBtn {
            display: none
        }

        .checkoutID.reviewbag .myBagModule.stick .genBtn {
            display: block;
            text-align: left;
            padding: 0 0 0 21px;
            line-height: 53px
        }

        .newAddress.edit .ico {
            color: var(--primary-color)
        }

        .checkoutID .notloggedin .box_delivery .genBtn {
            font-weight: bold;
            position: relative;
            border-radius: 8px;
            border-bottom: 0;
            height: 57px;
            max-width: 310px;
            margin: auto
        }

        .checkoutID .notloggedin .box_delivery .genBtn::before {
            content: "\F205";
            font: 68px / 1 Material-Design-Iconic-Font;
            width: 100%;
            text-align: center;
            color: #e2e1e1;
            height: 88px;
            margin-bottom: -19px;
            display: none
        }

        #updateContactInfoId .verify-mobile {
            right: 7px
        }

        #updateContactInfoId input#mobile {
            padding-left: 55px;
        }

        .myAccountPid i.zmdi.zmdi-plus-circle::after {
            display: none
        }

        .retail .customnote {
            display: none
        }

        .noOrder .genBtn.trigger-addtobag.addtobagbtn.ng-scope {
            display: none !important
        }

        .addtobagbtn {
            display: none
        }

        .addtobagbtn.sold-out {
            background-color: #ddd;
            pointer-events: none
        }

        .addtobagbtn.sold-out::before {
            content: attr(data-title);
            width: 100%;
            position: absolute;
            text-align: center;
            background-color: #ddd;
            height: 100%;
            line-height: 58px;
            left: 0
        }

        .flmenubtn {
            position: fixed;
            bottom: 22px;
            right: 25px;
            width: 50px;
            height: 50px;
            z-index: 8;
            color: #fff;
            background-color: var(--secondary-color);
            border-radius: 100%;
            line-height: 50px;
            text-align: center;
            font-size: 10px;
            font-weight: bold;
            box-shadow: rgba(0, 0, 0, 0.11) 0 10px 20px, rgba(0, 0, 0, 0.11) 0 6px 6px;
            opacity: .95;
            display: none;
            transition: all .5s cubic-bezier(0.39, 0.1, 0, 1.15) 0s
        }

        .market .flmenubtn {
            width: auto;
            border-radius: 8px;
            padding-left: 15px;
            padding-right: 15px;
            height: 39px;
            line-height: 39px;
            bottom: 40px
        }

        .homePid .flmenubtn,
        .orderdetails .flmenubtn,
        .checkoutID .flmenubtn {
            transform: translateY(100px);
            transition: all .3s cubic-bezier(0.42, 0, 0.57, 1.24) 0s
        }

        .bigPrice.overbtn {
            display: none
        }

        .bigPrice.overbtn.sold-out {
            display: none !important
        }

        .menulogo {
            width: 100%;
            text-align: center;
            margin-bottom: 22px;
            margin-top: 21px
        }

        .menulogo .logo {
            height: 200px;
            width: 200px;
            position: relative;
            margin-bottom: 22px;
            text-align: center
        }

        .menulogo .logo img {
            max-width: 142px;
            height: auto;
            max-height: 170px
        }

        .menuhead {
            height: 71px;
            position: relative
        }

        .menuhead::after {
            content: "";
            position: absolute;
            bottom: -28px;
            left: 0;
            width: 100%;
            height: 28px;
            background: linear-gradient(#fff 0, rgba(255, 255, 255, 0) 100%);
            z-index: 1
        }

        .cordova .menuhead {
            height: 84px;
            border-bottom: 1px solid #ddd
        }

        .menuqlinks {
            height: 85px;
            border-top: 1px solid #eee;
            border-bottom: 1px solid #eee;
            margin-bottom: 12px;
            background-color: #fafafa;
            font-size: 22px
        }

        .menuqlinks .text {
            height: 100%;
            text-transform: uppercase !important;
            font-size: 10px !important;
            font-weight: bold !important;
            padding: 0 !important;
            line-height: 114px !important;
            color: #666 !important
        }

        .menuqlinks .lineLink {
            width: 33%;
            position: relative;
            text-align: center;
            float: left;
            border: 0;
            padding: 0 !important
        }

        .menuqlinks i.zmdi {
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            top: 17px;
            color: #666;
            font-size: 19px
        }

        .userainfo {
            bottom: 0;
            height: 70px;
            position: absolute;
            width: 100%;
            box-sizing: border-box;
            padding-left: 24px;
            line-height: 64px;
            border-top: 1px solid #eee;
            z-index: 3;
            background-color: #fff;
            overflow: hidden;
            white-space: nowrap
        }

        .userainfo::after {
            right: 16px;
            position: absolute;
            top: 24px;
            content: "\F2F8";
            font: 20px / 1 Material-Design-Iconic-Font;
            color: var(--primary-color);
            cursor: pointer
        }

        .loggeduser .text {
            float: left;
            padding-left: 11px;
            font-size: 14px;
            width: 85%;
            margin-top: 2px
        }

        .rtl .loggeduser .text {
            line-height: 62px
        }

        .loggeduser .zmdi-account-circle {
            float: left;
            font-size: 28px;
            color: #333;
            margin-top: 20px
        }

        .usermenu {
            width: 100%;
            background-color: #fff;
            padding-top: 1px;
            position: absolute;
            bottom: 42px;
            z-index: 2;
            transform: translateY(150%);
            transition: all .5s ease-in-out 0s;
            border-top: 1px solid #eee;
            min-height: 231px
        }

        .usermenu.show {
            transform: translateY(0%);
            transition: all .5s ease-in-out 0s;
            box-shadow: rgba(0, 0, 0, 0.7) 0 6px 4px -4px
        }

        .menuhead .zmdi.zmdi-sort-amount-desc {
            position: absolute;
            left: 10px;
            top: 23px;
            font-size: 28px;
            color: #333;
            width: 66px;
            height: 44px
        }

        .cordova .menuhead .zmdi.zmdi-sort-amount-desc {
            top: 33px
        }

        .retail .menuhead .zmdi.zmdi-sort-amount-desc {
            top: 25px
        }

        .cordova.retail .menuhead .zmdi.zmdi-sort-amount-desc {
            top: 48px;
        }

        i.zmdi.zmdi-sort-amount-desc::after {
            position: absolute;
            content: "";
            inset: -24px 13px -24px -15px;
            width: 83px
        }

        .zmdi-arrow-left::before {
            content: "\F2FA"
        }

        .checkoutbag .clear-bag {
            position: relative
        }

        .retail .checkoutbag .clear-bag {
            display: none
        }

        .ssm-overlay {
            position: fixed;
            inset: 0;
            background-color: rgba(0, 0, 0, 0.6);
            display: none;
            z-index: 10
        }

        #addressFormId .location {
            position: relative;
            top: 1px;
            left: 0;
            width: 200px
        }

        .googleMap .error {
            position: absolute;
            top: 0;
            height: 33px;
            background-color: rgba(202, 19, 103, 0.8);
            font-size: 12px;
            width: 100%;
            left: 0;
            line-height: 30px;
            display: none;
            overflow: hidden;
            color: #fff !important
        }

        .googleMap {
            background-color: #eee
        }

        .editableMap::after {
            content: "1";
            position: absolute;
            transform: translateX(-50%) translateY(-50%);
            top: 50%;
            left: 50%;
            width: 10px;
            height: 10px;
            background-color: #000;
            z-index: 2147483647;
            display: none
        }

        .checkoutbag .myBagModule {
            z-index: 0
        }

        .notloggedin .checkoutbag {
            padding-top: 11px;
            margin-bottom: -24px
        }

        .zmdi-dot-circle::before {
            content: "\F26E"
        }

        .newAddress.nonead.add {
            color: var(--primary-color);
            position: absolute;
            transform: translateX(-50%) translateY(-50%);
            left: 50%;
            top: 50%;
            text-align: center;
            background-color: #fff;
            width: 220px;
            display: none;
            font-size: 40px !important
        }

        .newAddress.nonead.add.loadinga {
            display: none
        }

        .newAddress.nonead.add.mafiad {
            z-index: 6;
            display: block
        }

        .newAddress.nonead.add .text {
            font-size: 13px
        }

        .fixedModal.small .modal.show {
            opacity: 1;
            transform: translate3d(-50%, -50%, 0px) !important
        }

        .fixedModal.small .modal {
            left: 50%;
            border-radius: 0;
            position: fixed;
            opacity: 0;
            background-color: #fff;
            bottom: auto !important;
            width: 90% !important;
            transform: translate3d(-50%, 70%, 0px) !important;
            top: 50% !important;
            padding: 0 !important
        }

        .fixedModal.small .modal .btnClose {
            display: none
        }

        .fnb .modal.noCustomization {
            max-width: 600px !important
        }

        .fnb .modal.largetxt.noCustomization {
            max-width: 1000px !important
        }

        .fixedModal.small .modal .genBtn {
            border-radius: 0;
            width: 50%;
            float: left;
            margin: 0;
            height: 45px
        }

        .fixedModal.small.onebtn .modal .genBtn {
            width: 100%
        }

        .fixedModal.small .modal .btnWrap {
            bottom: 0;
            position: absolute;
            width: 100%
        }

        .fixedModal.small .modal .title {
            text-transform: capitalize;
            line-height: 23px;
            margin-top: 52px !important
        }

        .withTitle.oNbItems {
            font-weight: bold
        }

        .withTitle.oNbItems .titemsp {
            font-weight: normal;
            text-transform: lowercase
        }

        .rtl .withTitle.oNbItems .titemsp {
            margin-top: -11px
        }

        .orderdetails .box_delivery .boxTitle {
            display: none
        }

        .orderdetails .googleMap {
            width: 100px;
            height: 100px;
            margin-left: 20px;
            margin-top: 22px;
            border-radius: 100px;
            overflow: hidden
        }

        .orderdetails .location.editM {
            padding-left: 30px;
            box-sizing: border-box;
            padding-top: 26px;
            border-bottom: 0;
            position: absolute;
            height: 126px
        }

        .rtl .orderdetails .location.editM {
            padding-right: 22px;
            direction: rtl
        }

        .gm-style>div:first-child {
            z-index: unset !important
        }

        li.ot-prgress-status .stext {
            height: 50px;
            line-height: 41px;
            white-space: nowrap;
        }

        .orderdash {
            height: 117px;
            border-bottom: 5px solid #fafafa;
            background-color: #fafafa;
            text-align: center;
            margin: auto;
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            align-content: center;
            justify-content: space-evenly;
        }

        .orderstat {
            width: 50%;
            border: 4px solid #fafafa;
            padding: 11px 11px 68px 18px;
            box-sizing: border-box;
            float: left;
            height: 298px
        }

        .noordertracking .orderstat {
            display: none
        }

        .orderdet {
            width: 50%;
            border: 4px solid #fafafa;
            padding: 11px 11px 68px 13px;
            box-sizing: border-box;
            float: left;
            height: 298px
        }

        .noordertracking .orderdet {
            width: 100%;
            height: 200px;
            padding-bottom: 0
        }

        .orderdetails .elt {
            height: 84%;
            width: 24%;
            text-align: center;
            padding-top: 22px;
            color: #999;
            position: relative;
            cursor: pointer;
            display: inline-block;
            vertical-align: top
        }

        .orderdetails .elt .zmdi {
            font-size: 50px;
            text-decoration: none;
            color: #ddd;
            transition: all .2s linear 0s
        }

        .orderdetails .orderPreference {
            width: 100%;
            height: 100%
        }

        .orderdetails .elt .circle {
            color: var(--primary-color);
            font-size: 18px;
            margin-top: -60px;
            margin-left: 24px;
            display: none
        }

        .orderdetails .elt .circle .zmdi {
            font-size: inherit
        }

        .orderdetails .elt .circle .text {
            font-size: 25px;
            font-family: inherit;
            color: #fff
        }

        .orderdetails .elt .text {
            font-size: 17px;
            position: absolute;
            left: 0;
            top: 33px;
            width: 100%;
            text-align: center;
            color: var(--primary-color);
            font-weight: bold;
            line-height: 22px
        }

        .rtl .orderdetails .elt .text {
            top: 31px;
        }

        .elt .ordragnbtn {
            font-size: 13px;
            margin-top: 12px
        }

        .elt .ordragnbtn::before {
            position: absolute;
            width: 100px;
            height: 100px;
            top: -22px;
            left: 50%;
            content: "";
            margin-left: -50px
        }

        .elt .expln {
            font-size: 13px;
            margin-top: 11px
        }

        .hissubtotal div {
            display: inline;
            margin-right: 7px
        }

        .hissubtotal {
            margin-bottom: 24px;
            text-align: center;
            line-height: 24px
        }

        .orderdetails .hissubtotal {
            line-height: 19px;
        }

        .orderdetails .subLines {
            display: none
        }

        .sendchat {
            width: 50px;
            height: 50px;
            position: absolute;
            top: 6px;
            right: 9px;
            cursor: pointer
        }

        .rtl .sendchat {
            right: auto;
            transform: rotate(180deg)
        }

        .sendchat: hover::after {
            color: var(--primary-color)
        }

        .sendchat::after {
            right: 9px;
            position: absolute;
            top: 11px;
            content: "\F194";
            font: 28px / 1 Material-Design-Iconic-Font;
            color: #666
        }

        .orderdetails .withTitle.ordernum {
            margin-bottom: 20px;
            font-size: 31px !important;
            color: var(--secondary-color) !important;
            border-top: 0 !important
        }

        .orderdetails .addRemove .nb {
            display: none
        }

        .orderdetails .editMode .textLbl {
            text-align: right
        }

        .orderdetails .orders .order .withTitle {
            padding-right: 5px;
            border-top: 1px dotted #dad9d9;
            font-size: 13px;
            padding-left: 0;
            color: #333;
            display: flex;
            padding-bottom: 7px !important
        }

        .noordertracking .orderdetails .orders .order .withTitle {
            min-height: 39px
        }

        .orderdetails .box_instruction .title {
            margin-bottom: 22px;
            font-weight: bold;
            font-size: 14px;
            display: block;
            top: 17px !important
        }

        .orderdetails .textLbl {
            padding-bottom: 23px
        }

        .checkoutID .myBagModule,
        .orderdetails .myBagModule {
            display: block !important
        }

        .errorpopup .message {
            width: 85%;
            margin: -22px auto 9px
        }

        .errorpopup.ebottom .button {
            width: 100% !important
        }

        .checkoutbag {
            text-align: center;
            z-index: 0;
            position: relative
        }

        .checkoutID .reviewBox .myBagModule {
            position: relative
        }

        .checkoutID .checkoutbag .myBagModule {
            top: 8px;
            left: 3px;
            text-align: left;
            visibility: visible
        }

        .addAddress.withEdit {
            z-index: 3
        }

        .checkoutID .addAddress.withEdit {
            bottom: -3px;
            width: 100%;
            position: absolute !important
        }

        .zmdi-alert-circle::before {
            content: "\F1F0" !important
        }

        .coupons.remove .zmdi-check-circle {
            color: #35914e !important
        }

        .coupons.remove .zmdi-check-circle::before {
            content: "\f269";
            color: #35914e
        }

        .pending .zmdi-check-circle {
            color: #e6a01f !important
        }

        .recommendedItems .itemsList .itemGrid .priceWrap.inlisting {
            display: none
        }

        @media only screen and (min-width:320px) and (max-width:360px) {
            .recommendedItems .modal-container .itemsList .itemGrid:first-child {
                left: 0;
                margin-left: 4% !important
            }

            .myBagModule .itemBags .itemBag {
                max-width: 320px
            }
        }

        .editaccountp .box {
            height: auto;
            min-height: auto !important
        }

        #updateBasicInfoId .inputWrap.focusedfix {
            width: calc(50% - 2px);
            float: left;
            margin-right: 2px;
            box-sizing: border-box
        }

        .pemail {
            width: 100%;
            height: 45px;
            line-height: 45px;
            text-align: center;
            color: #999;
            font-size: 14px
        }

        .box.passedit .genBtn {
            bottom: -15px !important;
            font-size: 13px !important
        }

        .addAddressID {
            display: block
        }

        img.headbackimg {
            width: calc(100vw - 600px)
        }

        img {
            animation: 1s ease-in-out 0s 1 normal none running fadeIn
        }

        .layout5 img {
            width: 100%;
        }

        .lwr5 .view-more {
            left: 50%;
            right: auto !important;
            transform: translateX(-50%);
            bottom: 32px;
            top: auto !important;
            min-width: 142px !Important;
            height: 35px !important;
            line-height: 35px !important;
            font-weight: bold;
            opacity: 0.9;
        }

        .lwr5 .view-more span {
            font-size: 15px;
        }

        .lwr5 .ltitle {
            display: none;
        }

        .layout3 .collimg {
            width: 100%;
            margin-bottom: 9px
        }

        .pages img.headbackimg {
            height: auto
        }

        @media(max-width:768px) {
            .pages .image {
                min-height: auto !important
            }
        }

        img.innerbagimg {
            width: 106%;
            height: auto;
            min-height: 40px;
            cursor: pointer;
            position: absolute;
            top: 50%;
            transform: translateY(-50%)
        }

        .market img.innerbagimg {
            width: auto;
            margin: auto;
            position: absolute;
            transform: translateX(-50%) translateY(-50%);
            left: 50%;
            top: 50%;
            cursor: pointer;
            height: 122% !important
        }

        .orderdetails span.timing {
            display: none !important
        }

        .box.default .defaultBtn {
            display: none !important
        }

        @media(max-width:1300px) and (min-width:769px) {
            body {
                visibility: visible
            }

            .right.rBox .loginor {
                display: block !important;
                margin-top: -43px !important;
                padding-bottom: 26px;
            }

            .box_instruction.paymentMethods {
                background-color: transparent;
                border-top: 0px;
            }

            .fnb .customizedID .cont {
                /* max-height: 685px; */
            }

            .box_instruction .hosted-payment-wrapper::before {
                margin-left: 4px;
            }

            .box_instruction .input.saved-card {
                background-color: transparent !important;
            }

            .box_instruction.hosted-session {
                background-color: transparent !important;
            }

            .homePid .itemsList .itemGrid {
                margin-left: -4px !important;
            }

            .reviewbagbut {
                display: none !Important
            }

            .delivery-date {
                padding-top: 10px !important
            }

            .reviewBox .rBox .wrap {
                width: 100%
            }

            div#offerId {
                width: 768px
            }

            .retail .checkoutID .content {
                padding-right: 0
            }

            .bagScroll.autoMode {
                padding-bottom: 9px;
                background-color: transparent;
                margin-left: -6px
            }

            .notloggedin .reviewBox .rBox .wrap: first-child {
                background-color: transparent;
                border: 0;
                padding: 2px;
                box-shadow: none;
                width: 100%
            }

            .reviewBox .rBox {
                width: 100% !important;
                background-color: transparent !important
            }

            .reviewBox .rBox {
                width: 100%
            }

            .notloggedin .reviewBox .left.rBox {
                float: left;
                top: 0;
                width: calc(100% - 6px) !important;
                margin-bottom: 62px !important
            }

            .applinks li {
                display: none
            }

            .market .itemsList .itemGrid {
                margin-right: 0;
                /* width: calc(33% - 62px) !important; */
            }

            .footer {
                width: 100%
            }

            .orderdetails .box_feedback .feed {
                width: calc(100% - 312px);
                transform: none;
                right: 19px;
                left: auto
            }

            .homeFilter {
                left: 306px;
                transform: none;
                width: 258px !important;
                border: 0px !important;
            }

            .homeFilter .filter .zmdi {
                /* left: -22px!Important; */
                font-size: 19px;
            }

            .retail .homeFilter.ontop {
                position: absolute;
                left: 50%;
                right: auto;
                transform: translate(-50%)
            }

            .rtl .homeFilter {
                left: 250px;
                right: auto;
                width: calc(100% - 545px)
            }

            .MenuParts .callUsNb {
                overflow: hidden;
                width: 50px;
                display: none !important;
                padding-right: 0 !important
            }

            .swiper-container.main-swiper {
                width: calc(100%);
                right: 0;
                left: auto;
                transform: none
            }

            .rtl .swiper-container.main-swiper {
                margin-right: 0;
                margin-left: 0
            }

            .swiper-container.pages-swiper {
                width: 100%;
                right: 0;
                left: auto;
                transform: none;
                margin-right: 13px
            }

            img.headbackimg {
                width: 100%
            }

            .applinks {
                display: none
            }

            .swiper-container.main-swiper {
                margin-left: auto
            }

            .swiper-container.pages-swiper {
                margin-left: auto
            }

            .userbar {
                width: calc(100% - 287px) !important;
                right: 0;
                left: auto !important;
                transform: none !important;
            }

            .rtl .userbar {
                right: auto;
                left: 0
            }

            .content,
            .contentb {
                width: calc(100% - 308px);
                margin-right: 0;
                overflow: hidden
            }

            .rtl .content,
            .rtl .contentb {
                margin-right: auto
            }

            .myBagModule.stick {
                display: none
            }

            .bagph {
                display: none
            }

            .menuontop .bagph {
                display: block
            }
        }

        @media only screen and (min-device-width:1024px) and (max-device-width:1366px) and (-webkit-min-device-pixel-ratio:2) and (orientation:portrait) {
            .market .itemsList .itemGrid {
                margin-right: 0
            }
        }

        @media only screen and (-webkit-min-device-pixel-ratio:2) and (max-device-width:1366px) and (min-device-width:1024px) and (orientation:landscape) {
            .market .itemsList .itemGrid {
                width: calc(21vw - 34px) !important;
                margin-right: 0
            }
        }

        .orderdetails .elt: hover .zmdi {
            color: var(--primary-color)
        }

        .partReceipt {
            display: none
        }

        .errorpopup .countrieslist {
            font-family: inherit;
            max-height: 474px;
            overflow: auto;
        }

        .errorpopup .currencieslist li,
        .errorpopup .countrieslist li.thecountry,
        .errorpopup .languagesList li.language {
            list-style: none;
            height: 50px;
            box-sizing: border-box;
            line-height: 48px;
            text-align: left;
            padding-left: 48px;
            border-top: 0 solid #ddd;
            margin: 0;
            cursor: pointer;
            position: relative
        }

        .errorpopup .languagesList li.language::before {
            content: "\F185";
            font-family: Material-Design-Iconic-Font;
            color: #747474;
            font-size: 24px;
            display: block;
            margin-bottom: 18px;
            position: absolute;
            left: 11px;
            top: 0
        }

        .errorpopup .languagesList li.language {
            font-weight: bold;
            color: #777;
            font-family: inherit;
            cursor: pointer;
            margin-bottom: -2px
        }

        .errorpopup .languagesList li.language:last-child {
            margin-bottom: -7px
        }

        .errorpopup .currencieslist li:hover,
        .errorpopup .countrieslist li.thecountry:hover {
            background-color: #f4f3f3
        }

        .errorpopup .currencieslist li.selected,
        .errorpopup .countrieslist li.thecountry.selected {
            color: var(--primary-color);
            font-weight: bold;
            line-height: 49px
        }

        .errorpopup .countrieslist li {
            font-size: 14px;
            font-family: inherit
        }

        .errorpopup .countrieslist .langs li {
            list-style: none
        }

        .errorpopup .countrieslist li #flag {
            left: 14px;
            top: 19px
        }

        .errorpopup .countrieslist .langs {
            float: right;
            margin-right: 8px
        }

        .errorpopup .countrieslist .langs div {
            min-width: 32px;
            border: 1px solid #e4e3e3;
            height: 32px;
            display: inline-block;
            box-sizing: border-box;
            line-height: 32px;
            text-align: center;
            color: #666;
            font-weight: bold;
            font-size: 12px;
            text-transform: uppercase;
            cursor: pointer
        }

        .errorpopup .countrieslist .langs div.selected {
            background-color: var(--primary-color);
            color: #fff;
            font-weight: bold;
            border-color: #333
        }

        div#countryDetector .title {
            font-weight: bold;
            padding-top: 32px;
            color: var(--primary-color);
            font-size: 17px
        }

        div#countryDetector .sub-title {
            padding: 8px
        }

        .countryswitcher .iti__flag {
            cursor: pointer;
            margin: auto;
            margin-top: -1px;
        }

        .countryswitcher .iti__flag::before {
            content: "";
            position: absolute;
            height: 60px;
            width: 40px;
            top: -25px;
            left: -9px;
            z-index: 1
        }

        .swiper-container1.swiper-container-vertical1 {
            display: block
        }

        .resultwrapper {
            margin: auto;
            font-family: Arial, helvetica, sans-serif;
            font-size: 15px;
            text-align: center
        }

        .resultwrapper svg {
            width: 100px;
            display: block;
            margin: 40px auto 0
        }

        .resultwrapper .path {
            stroke-dasharray: 1000;
            stroke-dashoffset: 0
        }

        .resultwrapper .animate .path.circle {
            animation: .9s ease-in-out 0s 1 normal none running dash
        }

        .resultwrapper .animate .path.line {
            stroke-dashoffset: 1000;
            animation: .9s ease-in-out .35s 1 normal forwards running dash
        }

        .resultwrapper .animate .path.check {
            stroke-dashoffset: -100;
            animation: .9s ease-in-out .35s 1 normal forwards running dash-check
        }

        .resultwrapper p {
            text-align: center;
            font-size: 1.25em
        }

        .resultwrapper .path.circle.load {
            animation: .9s ease-in-out 0s infinite normal none running dash
        }

        .resultwrapper p.success {
            color: #73af55
        }

        .resultwrapper p.error {
            color: #d06079
        }

        .resultwrapper p.verify {
            color: #666
        }

        @-webkit-keyframes dash {
            0% {
                stroke-dashoffset: 1000
            }

            100% {
                stroke-dashoffset: 0
            }
        }

        @keyframes dash {
            0% {
                stroke-dashoffset: 1000
            }

            100% {
                stroke-dashoffset: 0
            }
        }

        @-webkit-keyframes dash-check {
            0% {
                stroke-dashoffset: -100
            }

            100% {
                stroke-dashoffset: 900
            }
        }

        @keyframes dash-check {
            0% {
                stroke-dashoffset: -100
            }

            100% {
                stroke-dashoffset: 900
            }
        }

        .resultwrapper .success,
        .fail {
            display: none
        }

        .resultwrapper .result {
            position: relative
        }

        .resultwrapper {
            left: 50%;
            top: 50%;
            transform: translateX(-50%) translateY(-50%);
            width: 300px;
            height: 300px;
            position: absolute
        }

        .resultwrapper .pcard {
            position: absolute;
            top: -10px;
            left: 50%;
            margin-left: -20px
        }

        .resultwrapper .retrybut {
            background-color: transparent;
            width: 162px;
            height: 28px;
            border-color: #ccc #ccc #d06079;
            border-width: 1px;
            border-radius: 4px;
            border-style: solid;
            font-family: Roboto, sans-serif, Arial, Helvetica, sans-serif;
            font-size: 13px;
            color: #777;
            display: block;
            margin: auto;
            text-decoration: none;
            text-transform: uppercase;
            line-height: 27px;
            font-weight: bold
        }

        .text-countdown {
            width: auto;
            font-size: 12px;
            color: #999;
            position: absolute;
            z-index: 7;
            top: 7px;
            right: 22px
        }

        .createAccountID .text-countdown {
            top: 45px;
            right: 10px
        }

        #updateContactInfoId .text-countdown {
            right: 75px
        }

        .pc-selector {
            width: 100%;
            background-color: #f7f7f7;
            border-top: 2px solid var(--primary-color);
            position: relative;
            min-height: 90px;
            margin-top: 28px
        }

        .ps-icon {
            position: absolute;
            right: 20px;
            top: 14px
        }

        .ps-icon img {
            width: 60px;
            height: auto
        }

        .pc-selector .activator {
            position: absolute;
            transform: translateY(-50%);
            top: 50%;
            left: 17px;
            height: 22px
        }

        .pc-selector .activator .input {
            cursor: pointer;
        }

        .pc-selector .activator .label {
            margin-left: 30px;
            color: #666;
            font-size: 17px;
            /* font-family: roboto; */
        }

        .pc-selector .activator .check .zmdi {
            font-size: 24px;
            margin-top: -2px
        }

        .oc-selector {
            margin-top: 3px;
            background-color: #dbd8d8;
            box-sizing: border-box;
            position: relative;
            height: 0;
            overflow: hidden;
            transition: all .3s linear 0s
        }

        .pc-wrapper.active .oc-selector {
            height: 326px;
            transition: all .3s linear 0s
        }

        .oc-title {
            font-family: roboto, sans-serif;
            font-size: 14px;
            color: #666;
            margin-bottom: 21px;
            display: none
        }

        .pc-wrapper {
            font-family: 'titlefont';
        }

        .oc-cards li .oc-icon {
            background-color: #ddd;
            border-radius: 100%;
            width: 40px;
            height: 40px;
            text-align: center;
            float: left
        }

        .oc-cards li .oc-icon img {
            width: 27px;
            height: 25px;
            margin-top: 7px;
            transition: all .3s linear 0s
        }

        .oc-cards li.selected .oc-icon {
            background-color: var(--primary-color);
        }

        .oc-cards li.selected .oc-icon img {
            filter: brightness(0) invert(1);
            transition: all .3s linear 0s
        }

        .oc-cards li {
            list-style: none;
            height: 57px;
            font-size: 14px;
            color: #666;
            cursor: pointer
        }

        .oc-cards li:hover {
            color: #333
        }

        .oc-label {
            margin-left: 50px;
            line-height: 41px;
        }

        .oc-preview {
            position: absolute;
            right: 11px;
            top: 30px;
            width: 283px;
            background-color: #dbd8d8;
            height: 93%
        }

        .oc-preview img {
            height: auto
        }

        .oc-scroll {
            height: 300px;
            overflow: visible auto;
            width: 197px;
            position: absolute;
            top: 11px;
            left: 12px
        }

        .oc-scroll:: -webkit-scrollbar {
            width: 10px
        }

        .lwr:: -webkit-scrollbar-thumb,
        .oc-scroll::-webkit-scrollbar-thumb {
            opacity: .1;
            background: rgba(0, 0, 0, 0.1)
        }

        .lwr:: -webkit-scrollbar,
        .offerslist::-webkit-scrollbar {
            height: 5px
        }

        .lwr:: -webkit-scrollbar,
        .offerslist::-webkit-scrollbar-track {
            height: 5px
        }

        .offerslist:: -webkit-scrollbar-thumb {
            opacity: .3;
            background: rgba(0, 0, 0, 0.1);
            border-radius: 5px
        }

        .inputWrap.ocfrom {
            width: 50%;
            float: left
        }

        .inputWrap.ocfrom .input,
        .inputWrap.octo .input {
            width: 99%
        }

        .inputWrap.octo {
            width: 50%;
            float: left
        }

        .inputWrap.textarea.ocmsg {
            display: table;
            width: 100%;
            float: none
        }

        .inputWrap.textarea.ocmsg .input {
            width: 100%
        }

        .oc-message {
            height: 0;
            overflow: hidden;
            transition: all .3s linear 0s
        }

        .pc-wrapper.active .oc-message {
            height: 150px;
            transition: all .3s linear 0s
        }

        .swiper-container.pc-cards {
            width: 100%;
            height: 100%;
            overflow: hidden !important;
        }

        .swiper-container.pc-cards .swiper-slide {
            width: 100%;
            position: relative
        }

        .pc-card {
            width: 100%;
            transform: translateX(-50%) translateY(-50%);
            top: 50%;
            left: 50%;
            position: absolute;
            text-align: center;
            height: 100%;
            z-index: 1
        }

        .pc-card::before {
            content: "";
            box-sizing: border-box;
            position: absolute;
            top: 50%;
            left: 50%;
            width: 20px;
            height: 20px;
            margin-top: -10px;
            margin-left: -10px;
            border-radius: 50%;
            animation: 1s linear 0s infinite normal none running spinner;
            border-width: 2px;
            border-style: solid;
            border-color: #ccc rgba(255, 255, 255, 0.21) rgba(255, 255, 255, 0.21);
            border-image: initial;
            z-index: 0
        }

        .swiper-slide-active .pc-card::after {
            content: "\F26A";
            box-sizing: border-box;
            position: absolute;
            bottom: 60px;
            left: 50%;
            margin-top: -10px;
            margin-left: -13px;
            animation: 1s cubic-bezier(1, 0.07, 0.29, 0.92) 0s 1 normal none running zoomOut;
            z-index: 2;
            color: #fff;
            font: 40px / 1 Material-Design-Iconic-Font;
            text-shadow: rgba(0, 0, 0, 0.1) 0 3px 6px, rgba(0, 0, 0, 0.1) 0 3px 6px
        }

        @-webkit-keyframes zoomOut {
            0% {
                opacity: 0;
                transform: scale3d(1.8, 1.8, 8.8)
            }

            90% {
                opacity: 1
            }
        }

        @keyframes zoomOut {
            0% {
                opacity: 0;
                transform: scale3d(1.8, 1.8, 8.8)
            }

            90% {
                opacity: 1
            }
        }

        .swiper-pagination-pc {
            bottom: 21px;
            position: absolute;
            z-index: 2;
            width: 100%;
            text-align: center
        }

        .oc-preview .swiper-pagination-bullet {
            margin-left: 3px;
            margin-right: 3px
        }

        .oc-preview .swiper-pagination-bullet-active {
            background: #fff
        }

        .card-details-container {
            position: absolute;
            top: 0;
            z-index: 55;
            background-color: #eee;
            height: 100%;
            transform: translateY(100%);
            transition: all .3s linear 0s
        }

        .card-details-container.show {
            position: absolute;
            top: 0;
            z-index: 55;
            background-color: #eee;
            height: 100%;
            transform: translateY(0px);
            transition: all .3s linear 0s
        }

        .payment-container .payment-notice {
            font-size: 14px;
            color: #777;
            text-align: center
        }

        .payment-container .payment-notice .notice-text {
            margin-right: 5px
        }

        .payment-container .payment-swiper {
            padding-top: 24px;
            padding-bottom: 9px;
            height: 220px;
            position: relative;
            margin: auto;
            width: 328px;
            overflow: hidden !important
        }

        .payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card {
            background-image: -webkit-linear-gradient(-90deg, #979ba2 0, #808288 100%);
            width: 315px;
            height: 157px;
            border-radius: 3% / 6%;
            box-shadow: rgba(0, 0, 0, 0.18) 0 0 8px 2px;
            margin: auto;
            position: relative
        }

        .payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card .card-delete {
            border-radius: 50%;
            background-color: #82848b;
            position: absolute;
            top: 18px;
            left: 13px;
            width: 36px;
            height: 36px
        }

        .payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card .card-delete .fa {
            position: absolute;
            inset: 0;
            margin: auto;
            width: 14px;
            height: 20px;
            font-size: 17px;
            line-height: 120%;
            color: #fff
        }

        .payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card .card-provider {
            width: 76px;
            height: 49px;
            position: absolute;
            right: 25px;
            top: 15px
        }

        .payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card .card-provider .card-provider-img {
            display: block;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%)
        }

        .payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card .card-number {
            font-family: Roboto, sans-serif, Arial, Helvetica, sans-serif;
            font-size: 18px;
            line-height: 120%;
            color: #fff;
            text-align: left;
            position: absolute;
            left: 20px;
            bottom: 28px
        }

        .payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card .card-validity {
            position: absolute;
            right: 25px;
            bottom: 21px
        }

        .payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card .card-validity .validity-label {
            font-family: Roboto, sans-serif, Arial, Helvetica, sans-serif;
            font-size: 10px;
            line-height: 120%;
            color: rgba(255, 255, 255, 0.33);
            text-align: left;
            width: 31px;
            height: 28px;
            margin-right: 6px;
            float: left
        }

        .payment-container .payment-swiper .swiper-wrapper .swiper-slide .credit-card .card-validity .validity-value {
            font-family: Roboto, sans-serif, Arial, Helvetica, sans-serif;
            font-size: 18px;
            line-height: 120%;
            color: #fff;
            text-align: left;
            float: left
        }

        .payment-container .payment-swiper .swiper-pagination .swiper-pagination-bullet {
            background-color: transparent;
            border-color: #ccc;
            border-width: 1px;
            border-style: solid;
            opacity: 1;
            width: 33px;
            border-radius: 3px;
            height: 16px;
            display: inline-block;
            margin-right: 8px;
            cursor: pointer
        }

        .payment-container .payment-swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
            background-color: #888;
            border-color: transparent
        }

        .payment-container .payment-amount {
            font-size: 24px;
            color: #666;
            text-align: center;
            margin-bottom: 19px;
            margin-top: -11px
        }

        .payment-container .payment-action button,
        .payment-container .payment-action input {
            appearance: none;
            border: 0 none;
            background-color: transparent
        }

        .payment-container .payment-action .saved-payment {
            height: 48px;
            width: 100%;
            margin-bottom: 21px
        }

        .payment-container .payment-action .saved-payment .payment-csc {
            background-color: #eee;
            width: 85px;
            height: 48px;
            border-radius: 10px;
            float: left
        }

        .payment-container .payment-action .saved-payment .payment-csc input {
            width: 100%;
            height: 100%;
            border-radius: 10px;
            padding-left: 26px;
            padding-right: 18px
        }

        .payment-container .payment-action .saved-payment .payment-csc input::-webkit-input-placeholder {
            font-family: Roboto, sans-serif, Arial, Helvetica;
            font-size: 13px;
            line-height: 120%;
            font-style: italic;
            color: #777;
            text-align: left
        }

        .payment-container .payment-action .saved-payment .payment-pay {
            background-color: var(--primary-color);
            width: 328px;
            height: 48px;
            border-radius: 7px;
            position: relative;
            margin: auto;
            cursor: pointer
        }

        .payment-container .payment-action .saved-payment .payment-pay.disabled-payment,
        .payment-container .payment-action .saved-payment .payment-pay.paying {
            background-color: #ccc
        }

        .payment-container .payment-action .saved-payment .payment-pay.disabled-payment .payment-disabled-layer,
        .payment-container .payment-action .saved-payment .payment-pay.paying .payment-disabled-layer {
            display: block
        }

        .payment-container .payment-action .saved-payment .payment-pay.paying .payment-button .btn-text {
            display: none
        }

        .payment-container .payment-action .saved-payment .payment-pay.paying .payment-button .spinner {
            display: block
        }

        .payment-container .payment-action .saved-payment .payment-pay .payment-disabled-layer {
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
            display: none
        }

        .payment-container .payment-action .saved-payment .payment-pay .payment-button {
            font-family: Roboto, sans-serif, Arial, Helvetica, sans-serif;
            font-size: 17px;
            font-weight: bold;
            line-height: 48px;
            color: #fff;
            width: 328px;
            height: 100%;
            text-align: center;
            cursor: pointer;
            margin: auto
        }

        .payment-container .payment-action .saved-payment .payment-pay .payment-button .spinner {
            height: 43px;
            width: 100%;
            display: none;
            position: relative
        }

        .payment-container .payment-action .saved-payment .payment-pay .payment-button .spinner::before {
            content: "";
            box-sizing: border-box;
            position: absolute;
            top: 50%;
            left: 50%;
            width: 20px;
            height: 20px;
            margin-top: -10px;
            margin-left: -10px;
            border-radius: 50%;
            animation: 1s linear 0s infinite normal none running spinner;
            border-width: 2px;
            border-style: solid;
            border-color: #ccc #87be47 #87be47;
            border-image: initial
        }

        .payment-container .payment-action .alternative-payment {
            margin-bottom: 19px;
            text-align: center;
            position: relative
        }

        .payment-container .payment-action .alternative-payment::before,
        .payment-container .payment-action .alternative-payment::after {
            width: calc((100% - 47px) / 2);
            height: 1px;
            position: absolute;
            background-color: #eee;
            top: 0;
            bottom: 0;
            margin: auto
        }

        .payment-container .payment-action .alternative-payment::before {
            left: 0
        }

        .payment-container .payment-action .alternative-payment::after {
            right: 0
        }

        .payment-container .payment-action .new-payment {
            margin-bottom: 22px;
            cursor: pointer
        }

        .payment-container .payment-action .new-payment .payment-button {
            background-color: transparent;
            width: 162px;
            height: 28px;
            border-color: #ccc;
            border-width: 1px;
            border-radius: 4px;
            border-style: solid;
            font-family: Roboto, sans-serif, Arial, Helvetica, sans-serif;
            font-size: 12px;
            color: #777;
            display: block;
            margin: auto;
            cursor: pointer;
            text-align: center
        }

        .payment-container .payment-cancel {
            display: none
        }

        @media(max-width:360px) {
            .payment-container .payment-swiper .swiper-wrapper .credit-card {
                width: 290px;
                height: 143px
            }

            .payment-container .payment-swiper .swiper-wrapper .credit-card .card-delete,
            .payment-container .payment-swiper .swiper-wrapper .credit-card .card-number {
                left: 10px
            }

            .payment-container .payment-swiper .swiper-wrapper .credit-card .card-provider,
            .payment-container .payment-swiper .swiper-wrapper .credit-card .card-validity {
                right: 10px
            }

            .payment-container .payment-swiper .swiper-wrapper .credit-card .card-number {
                font-size: 17px
            }

            .payment-container .payment-swiper .swiper-wrapper .credit-card .card-validity .validity-value {
                font-size: 17px
            }

            .payment-container .payment-amount {
                font-size: 20px;
                margin-bottom: 15px
            }

            .payment-container .payment-action .saved-payment,
            .payment-container .payment-action .new-payment {
                margin-bottom: 15px
            }
        }

        @keyframes spinner {
            100% {
                transform: rotate(360deg)
            }
        }

        body.validateable .container.pay .inline-middle.merchantName>h3 {
            display: none
        }

        body.validateable .container.pay .btn.btn-success {
            background-color: #000;
            border-color: #000
        }

        body.validateable .container.pay .btn.btn-success[data-hppverifybutton] {
            display: none
        }

        body.validateable .container.pay .btn.cancelButton {
            border-color: #b5b5b5;
            color: #b5b5b5
        }

        @media(min-width:1600px) {
            .itemsList .itemGrid {
                /* width: calc(33% - 15px); */
            }

            .retail.menuontop .homePid .itemsList .products-listing:not(.swiper-wrapper) .itemGrid {
                width: calc(15% - 15px) !important
            }

            .menuontop .checkoutID .content {
                width: calc(100% - 333px);
                margin-right: auto;
                margin-left: auto;
                margin-bottom: -26px;
                margin-top: 64px !important;
            }

            .menuontop .searchopen .content {
                padding-top: 85px;
                min-height: calc(100vh - 185px)
            }
        }

        @media(min-width:769px) {
            .market .newsCtrl .itemsList .itemGrid {
                margin-right: 13px;
                width: calc(50% - 15px) !important
            }
        }

        .card-delete .zmdi {
            font-size: 17px;
            margin-left: 13px;
            margin-top: 9px;
            color: #ddd
        }

        .add-card-title {
            font-size: 15px;
            text-transform: uppercase;
            font-family: roboto, sans-serif;
            font-weight: bold;
            color: #87be47;
            text-align: center;
            height: 50px;
            line-height: 50px
        }

        .add-card-close {
            font-size: 29px;
            position: absolute;
            top: 10px;
            right: 16px;
            color: #999
        }

        .wpwl-button-pay {
            background-color: #000
        }

        .wpwl-brand-VISA {
            background-color: #000
        }

        .wpwl-group-cardNumber {
            width: 100% !important;
            padding-right: 0 !important
        }

        .wpwl-form-card {
            border-radius: 0;
            box-shadow: none;
            background: #ddd;
            position: relative
        }

        .wpwl-group-expiry {
            border-right: 2px solid #ddd;
            width: 60% !important
        }

        .wpwl-group {
            margin-bottom: 16px
        }

        .wpwl-group-cvv {
            width: 40%
        }

        .wpwl-group-brand {
            top: 148px;
            position: absolute;
            z-index: 1;
            right: 50px;
            zoom: .5;
            width: 89px
        }

        .wpwl-brand-MASTER {
            margin-top: -7px
        }

        .wpwl-control {
            font-family: Helvetica, Arial, sans-serif;
            color: #444;
            font-size: 13px;
            height: 35px;
            border-width: 0 0 1px;
            border-top-style: initial;
            border-right-style: initial;
            border-left-style: initial;
            border-top-color: initial;
            border-right-color: initial;
            border-left-color: initial;
            border-image: initial;
            border-bottom-style: solid;
            border-bottom-color: #ccc;
            border-radius: 0;
            padding-left: 9px
        }

        .wpwl-has-error+.wpwl-hint,
        .wpwl-has-error+.wpwl-hint+.wpwl-hint,
        .wpwl-has-error+input+.wpwl-hint {
            font-family: Helvetica, Arial, sans-serif;
            color: #c04108;
            position: absolute;
            right: 7px;
            top: -13px;
            font-size: 10px;
            z-index: 1;
            background-color: #fff;
            padding: 2px 5px;
            border-width: 1px;
            border-style: solid;
            border-color: #e4e4e4 #e4e4e4 #d87e7e;
            border-image: initial;
            border-radius: 4px;
            text-transform: uppercase;
            box-shadow: rgba(0, 0, 0, 0.03) 0 -1px 3px, rgba(0, 0, 0, 0.04) 0 3px 2px;
            opacity: .8
        }

        .wpwl-button-pay {
            width: 100%;
            margin-top: 3px;
            background-color: #81b739;
            border: 0;
            font-family: Helvetica, Arial, sans-serif;
            font-weight: bold;
            height: 48px;
            font-size: 17px;
            text-transform: uppercase
        }

        .wpwl-group-cardHolder {
            width: 100%;
            padding-right: 0
        }

        .ui-state-default,
        .ui-widget-content .ui-state-default,
        .ui-widget-header .ui-state-default {
            background: transparent
        }

        .ui-state-default,
        .ui-widget-content .ui-state-default,
        .ui-widget-header .ui-state-default {
            border: 1px solid #fff
        }

        .ui-state-default: hover {
            border: 1px solid var(--primary-color)
        }

        .wpwl-popover {
            font-family: Helvetica, Arial, sans-serif;
            font-size: 11px;
            width: 88px;
            right: 0;
            left: auto
        }

        .wpwl-popover-content {
            display: none
        }

        .wpwl-form-card {
            border-radius: 0;
            box-shadow: none;
            background: 0 center;
            position: relative;
            border: 0
        }

        .wpwl-container-registration {
            display: none !important
        }

        .hide {
            display: none
        }

        .mpgsPaymentPopUpModel {
            height: 100%
        }

        .mpgsPaymentContainer {
            width: 77% !important
        }

        @media(max-width:768px) {
            .mpgsPaymentContainer {
                width: 100% !important
            }
        }

        .payment-container {
            background-color: #fff;
            padding: 32px 32px 36px;
            border-radius: 6px
        }

        .payment-container .swiper-slide {
            flex-shrink: 0;
            width: 100%;
            height: 100%;
            position: relative
        }

        .payment-container .swiper-wrapper {
            position: relative;
            width: 100%;
            height: 100%;
            z-index: 1;
            display: flex;
            transition-property: transform;
            box-sizing: content-box
        }

        .modalParent.modal-parent-checkout {
            position: fixed;
            inset: 0;
            z-index: 900;
            opacity: 0;
            visibility: hidden;
            transition: transform .3s ease 0s, opacity .3s ease 0s, visibility .3s ease 0s, -webkit-transform .3s ease 0s
        }

        .modalParent.modal-parent-checkout.is-visible {
            opacity: 1;
            visibility: visible
        }

        .modalParent.modal-parent-checkout .modal-overlay {
            content: "";
            position: absolute;
            inset: 0;
            background: rgba(25, 25, 25, 0.8)
        }

        .modalParent.modal-parent-checkout {
            z-index: 10;
            transition-delay: 350ms;
            pointer-events: unset !important
        }

        .modalParent.modal-parent-checkout .modal-container {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate3d(-50%, 200%, 0px);
            transition: transform .4s ease 0s;
            margin: auto;
            min-width: 375px;
            max-width: 400px;
            padding-top: 80px !important
        }

        .modalParent.modal-parent-checkout.is-visible {
            transition-delay: 0s
        }

        .modalParent.modal-parent-checkout.is-visible .modal-container {
            transform: translate3d(-50%, -50%, 0px);
            transition-delay: .4s
        }

        .modalParent.modal-parent-checkout .modal-separator {
            position: relative;
            height: 2px;
            margin: 0 auto;
            width: 77% !important
        }

        .modalParent.modal-parent-checkout .payment-notice {
            margin-top: 12px;
            margin-bottom: 7px
        }

        .modalParent.modal-parent-checkout .mainTitle {
            position: relative;
            font-family: inherit;
            font-size: 20px;
            color: #4d4d4c;
            text-align: center;
            font-weight: bold
        }

        @media(max-width:768px) {
            .modalParent.modal-parent-checkout.is-visible .modal-container {
                height: calc(100vh - 80px);
                top: 0;
                transform: translate3d(-50%, 0%, 0px);
                overflow: scroll
            }

            .oc-cards li.selected {
                position: absolute;
                z-index: 55;
                bottom: 17px;
                width: 100%;
                top: auto;
                display: block !important;
                height: 30px;
            }

            .oc-cards li.selected .oc-label {
                color: #555;
                margin-left: 0;
                /* text-align: center; */
                position: relative;
                display: block;
                text-align: center;
            }

            .oc-cards li {
                display: none
            }

            .oc-cards li .oc-icon {
                display: none
            }
        }

        @media(max-width:900px) and min-width:769px) {
            body.checkoutID.subPage .content {
                padding-top: 2px;
                transform: none !important
            }
        }

        .oc-preview img {
            object-fit: contain;
            transform: translateY(-50%);
            margin-top: 43%;
            height: 86%;
            width: 86%;
        }

        .allCoupons {
            height: auto;
            min-height: 47px;
            margin-top: 22px
        }

        .allCoupons .offerslist {
            height: auto
        }

        .checkoutID .allCoupons .offerslist {
            text-align: center;
            padding-bottom: 0
        }

        .allCoupons .aoffer {
            width: 100%;
            margin: 0 !important
        }

        .invalidPassword {
            width: 87%;
            float: right;
            bottom: 39px !important;
            left: 115px !important
        }

        .fixedBody {
            position: fixed
        }

        iframe[title="Hosted Checkout"] {
            background-color: rgba(0, 0, 0, 0.25) !important
        }

        .errorCustomization {
            display: none;
            color: #fff;
            background-color: rgba(255, 0, 0, 0.73);
            width: 100vw;
            position: fixed;
            left: 0;
            bottom: 58px;
            font-size: 12px;
            padding: 8px;
            text-align: center;
            z-index: 999;
            pointer-events: none
        }

        .active {
            display: block !important
        }

        .rtl .wrap .wrapCustom {
            transform: translate3d(0px, 0px, 0px)
        }

        .location.is_stuck {
            transform: translateY(114px);
            left: 0;
            height: 107px;
            z-index: 1;
            transition: all .2s linear 0s;
            width: 100vw !important
        }

        .column_cust.hide-product-options .lines .line: last-child {
            border: 0 !important
        }

        .pbody {
            width: 70%;
            float: left;
        }

        .pheadline {
            width: 20%;
            float: left;
        }

        .box_delivery .googleMap img {
            width: 100%;
            margin: 0
        }

        .market .itemsList .itemGrid {
            /* max-width: 280px; */
            /* min-width: 224px; */
            /* justify-self: start; */
            width: 100%;
            display: grid;
            align-content: space-between;
        }

        .market .layout1 .itemsList .itemGrid {
            width: 29%;
            height: auto;
        }

        .market .itemsList .itemGrid.not-available {
            pointer-events: none
        }

        @media(min-width:769px) {
            body {
                visibility: visible
            }

            .sumhead {
                white-space: nowrap;
            }

            #sizeGuideModalID .parts {
                /* padding: 42px!important; */
            }

            .retail .productpage .meta .price {
                padding-left: 20px;
            }

            .retail.menuontop .select-locale-top.menuList {
                margin-left: -24px;
            }

            .giftcards .hosted-session-wrapper {
                margin-top: 72px
            }

            .text-countdown {
                right: 25px
            }

            input#verificationCode {
                left: 0
            }

            .giftcards .gc-bottom-part .gc-button {
                max-width: none !Important
            }

            .giftcards .gc-bottom-part .gc-title: before {
                content: "2- "
            }

            .giftcards .gc-bottom-part .gc-title {
                padding-top: 22px
            }

            .gc-sub-title {
                padding-bottom: 28px
            }

            .giftcards .gc-top-part .gc-title {
                font-size: 24px
            }

            .giftcards .gc-top-part .gc-title: before {
                content: "1- "
            }

            .giftcards .gc-bottom-part .gc-email-wrapper {
                max-width: none !important;
                width: 50%;
                float: left
            }

            .box_instruction.specialInstructions {
                padding-left: 23px
            }

            .pickordel .radio {
                margin-left: 18px
            }

            .fnb .itemsList .itemGrid .heart {
                bottom: 29px;
            }

            .ssm-overlay {
                display: none !Important
            }

            .box_date.pickordel {
                padding-left: 3px
            }

            div#schedule-order-id {
                padding-top: 24px;
                padding-left: 21px
            }

            .box_instruction.paymentMethods {
                padding: 0
            }

            .kangaroo-loyalty-points .lp-points-container {
                background-color: #f8f8f8 !important
            }

            #addressFormId .googleMap {
                margin-bottom: 26px
            }

            .MenuParts .parts .bot .case {
                padding-left: 32px;
                box-sizing: border-box;
                padding-right: 16px
            }

            .menuontop .langswitcher,
            .retail .langswitcher {
                filter: invert(1);
                opacity: .7
            }

            .menuontop .userbar,
            .retail .userbar {
                display: none;
                border-bottom: 0
            }

            .menuontop .showBag .userbar.icons {
                display: block !important
            }

            .small-inputWrap .inputWrap {
                margin-bottom: 0
            }

            #addressFormId .wrap {
                column-count: 2;
                align-items: flex-end
            }

            .reviewbag .priceonbtn {
                opacity: 1
            }

            .menuontop #wrapper {
                padding-top: 120px !important
            }

            #addressFormId .small-inputWrap {
                margin-bottom: 16px !important
            }

            .market .itemsList .itemGrid {
                margin-right: 0;
                /* min-width: auto; */
            }
        }

        @media(min-width:1700px) {
            .market .itemsList .itemGrid {
                /* width: calc(20vw - 129px) !important; */
            }
        }

        .pheadline {
            font-size: 35px;
            font-family: inherit;
            font-weight: bold;
            margin-top: 22px;
            line-height: 35px;
            padding-right: 25px
        }

        .rtl .pheadline {
            direction: rtl;
            float: right
        }

        .pheadline span:empty {
            display: none
        }

        .pbody {
            font-size: 14px;
            line-height: 28px;
            margin-top: 25px;
            padding-bottom: 10px
        }

        .rtl .pbody {
            direction: rtl;
            padding-right: 0;
            padding-left: 25px
        }

        .pbody span {
            font-family: textfont !important;
            line-height: initial !important;
            font-size: 14px;
        }

        .pbody p {
            line-height: 26px !important;
            color: #333 !important;
            background: transparent !important
        }

        .pbody a {
            color: var(--secondary-color);
            text-decoration: none;
            border-bottom-width: 1px;
            border-bottom-style: dotted;
            border-color: var(--secondary-color)
        }

        a.plink.genBtn {
            padding: 23px;
            width: fit-content;
            margin-top: 34px;
            display: inline-block;
            line-height: 0
        }

        .customlimit {
            font-size: 10px;
            opacity: .5
        }

        .large-menu-img .itemsList .itemGrid .picture {
            margin: 0 0 0 -14px;
            max-height: 230px;
            border-radius: 0;
            display: inline-block;
            top: -16px;
            width: calc(100% + 34px);
            padding-bottom: 61%;
            height: auto;
            float: left;
        }

        .retail .itemsList .itemGrid .picture {
            max-height: none;
            padding-bottom: 156%
        }

        .retail .itemsList .itemGrid .picture {
            max-height: none;
            padding-bottom: 149%;
            display: block !important
        }

        .retail .large-menu-img .itemsList .itemGrid .picture {
            padding-bottom: 0;
            max-height: none !important
        }

        .market .itemsList .itemGrid .picture {
            background-color: #fff;
            padding-bottom: 90%;
            display: block !important;
        }

        .newsCtrl .itemsList .itemGrid .picture {
            min-height: auto;
            max-height: none;
            top: 0;
            margin-left: 0;
            width: 100%;
            padding-bottom: 0 !important;
        }

        .newsCtrl .itemsList .itemGrid .picture img {
            position: relative
        }

        .large-menu-img .itemsList .itemGrid .descBlock .title {
            font-family: titlefont
        }

        .large-menu-img .itemsList .itemGrid .descBlock .description {
            display: block;
            margin-top: 7px;
            font-size: 14px;
            min-height: 0;
            line-height: 22px;
            min-width: 100%
        }

        .large-menu-img.rtl .itemsList .itemGrid .descBlock .description {
            padding: 0 0 0 20px
        }

        .large-menu-img .itemsList .itemGrid .wrap.nopimg .title {
            margin-top: 0
        }

        .columnsdisplay ul.case.thebig-ul {
            column-gap: 0;
            column-fill: balance;
            column-count: 2
        }

        .columnsdisplay li.itemGrid {
            break-inside: avoid;
            width: auto;
            min-width: 96%;
            display: table !important
        }

        @media(min-width:1600px) {
            .columnsdisplay ul.case.thebig-ul {
                column-gap: 0;
                column-fill: balance;
                column-count: 3
            }
        }

        @media(max-width:1023px) and min-width:769px) {
            .columnsdisplay ul.case.thebig-ul {
                column-gap: 0;
                column-fill: balance;
                column-count: 1
            }
        }

        .swiper-slide.main-swiper-slide {
            display: flex
        }

        .swiper-slide.pages-swiper-slide {
            display: flex
        }

        .swiper-wrapper.main-swiper-wrapper {
            position: relative;
            width: 100%;
            height: 100%;
            z-index: 1;
            display: flex;
            transition-property: transform, -webkit-transform;
            box-sizing: content-box
        }

        .swiper-wrapper.pages-swiper-wrapper {
            position: relative;
            width: 100%;
            height: 100%;
            z-index: 1;
            display: flex;
            transition-property: transform, -webkit-transform;
            box-sizing: content-box
        }

        .swiper-pagination.main-swiper-pagination {
            position: absolute;
            bottom: 13px;
            height: 33px;
            width: 100%;
            z-index: 4;
            text-align: center
        }

        .swiper-pagination.pages-swiper-pagination {
            position: absolute;
            bottom: 5px;
            height: 33px;
            width: 100%;
            z-index: 12;
            text-align: center
        }

        .swiper-pagination {
            position: absolute;
            text-align: center;
            transition: opacity .3s ease 0s;
            transform: translate3d(0px, 0px, 0px);
            z-index: 10
        }

        .swiper-pagination.swiper-pagination-hidden {
            opacity: 0
        }

        .swiper-container-horizontal>.swiper-pagination-bullets,
        .swiper-pagination-custom,
        .swiper-pagination-fraction {
            bottom: 33px;
            left: 0;
            width: 100%
        }

        .pinching .swiper-pagination {
            opacity: 0
        }

        .oneitem .swiper-pagination-bullets {
            display: none
        }

        .swiper-pagination-bullets-dynamic,
        .swiper-pagination-switch-dynamic {
            overflow: hidden;
            font-size: 0
        }

        .swiper-pagination-bullet,
        .swiper-pagination-switch {
            width: 7px;
            height: 7px;
            display: inline-block;
            border-radius: 100%;
            background: #fff;
            opacity: .4;
            margin: 11px;
            cursor: pointer
        }

        button.swiper-pagination-bullet,
        button.swiper-pagination-switch {
            border: 0;
            margin: 0;
            padding: 0;
            box-shadow: none;
            appearance: none;
            cursor: pointer
        }

        .swiper-pagination-clickable .swiper-pagination-bullet,
        .swiper-pagination-clickable .swiper-pagination-switch {
            cursor: pointer
        }

        .swiper-pagination-bullet-active,
        .swiper-active-switch {
            opacity: 1;
            background: #fff
        }

        a.calli {
            position: relative;
            color: #fff;
            background-color: var(--primary-color);
            padding-left: 8px;
            padding-right: 8px;
            text-align: center;
            border-radius: 4px;
            text-transform: uppercase;
            display: none;
            height: 44px;
            margin: 21px auto;
            line-height: 44px;
            width: 80% !important
        }

        a.calli i {
            position: absolute;
            top: 8px;
            left: 15px
        }

        .whatsapp.calli i::before {
            content: "\F405"
        }

        .calli i::before {
            font-size: 24px
        }

        a.calli .texti {
            font-family: inherit;
            font-weight: bold;
            display: inline-block;
            height: 100%
        }

        .callbuttononmobile a.calli {
            bottom: auto;
            display: block;
            margin-top: 23px;
            margin-bottom: 22px;
            height: 44px
        }

        a.calli.whatsapp {
            display: none
        }

        .whatsapp a.calli.whatsapp {
            display: block !important
        }

        .whatsapp .whatsapp.calli {
            display: block !important
        }

        .whatsapp .whatsapp.calli {
            background: linear-gradient(#69ca3b, #56a61e)
        }

        .onecountry .countryswitcher {
            display: none;
        }

        .countryswitcher {
            margin-top: 29px;
            margin-right: 24px;
            display: inline-block;
            border: 2px solid #fff;
            height: 29px;
            width: 42px;
            border-radius: 7px;
            padding-top: 7px;
            box-sizing: border-box;
            background-color: #fff
        }

        .onecountry .countryswitcher {
            display: none;
        }

        .retail .countryswitcher {
            border-color: #ddd;
            padding-top: 5px;
            width: 40px
        }

        .retail .countryswitcher.inmenu {
            padding-top: 6px;
            width: 50px;
            border: 0
        }

        .menuhead .langswitcher {
            display: inline-block;
            margin-right: 13px;
            background-color: #fff;
            top: 2px;
            border-radius: 4px;
            height: 26px;
            box-sizing: border-box;
            padding-top: 2px;
            margin-left: 0
        }

        .onecountry .menuhead .langswitcher {
            right: -6px;
        }

        .onecountry .menuhead .langswitcher: after {
            content: '\f2f2';
            font-family: 'Material-Design-Iconic-Font';
            color: #333;
            font-size: 18px;
            margin-bottom: 18px;
            position: absolute;
            right: 33px;
            top: -15px;
            width: 15px;
            height: 50px;
            box-sizing: border-box;
            padding-top: 17px;
            z-index: 0;
            pointer-events: none;
        }

        .cordova .menuhead .langswitcher {
            margin-top: 11px
        }

        .cordova .menuhead .currencyswitcher {
            margin-top: 54px
        }

        .onecountry.onelanguage .langswitcher {
            display: none
        }

        .currencyswitcher {
            margin-top: 29px;
            margin-left: 18px;
            color: #fff;
            display: block;
            border: 2px solid #fff;
            height: 25px;
            width: 45px;
            border-radius: 7px
        }

        .currencytext {
            text-align: center;
            margin-top: 0;
            cursor: pointer;
            line-height: 25px;
            text-transform: uppercase;
            font-size: 14px
        }

        .menuhead .currencyswitcher {
            display: inline-block;
            position: relative;
            margin-right: 20px;
            background-color: #fff;
            margin-top: 20px;
            box-shadow: #000 0 0 31px -9px;
            border-radius: 4px;
            height: 26px;
            box-sizing: border-box;
            padding-top: 2px
        }

        .menuhead .currencyswitcher .currencytext {
            color: #333;
            font-size: 13px;
            line-height: 19px;
            height: 18px
        }

        .retail .currencyswitcher {
            border: 2px solid var(--primary-color);
            float: right;
            margin-left: 0px;
        }

        .retail .currencytext {
            color: var(--primary-color)
        }

        .retail .langswitcher {
            width: auto;
            padding-left: 6px;
            padding-right: 6px;
            min-width: 35px;
            border-color: #ddd;
        }

        .retail .menuhead .langswitcher {
            filter: none
        }

        @media only screen and (-webkit-device-pixel-ratio: 3) and (min-device-height: 812px) and (max-device-width: 700px), only screen and (-webkit-device-pixel-ratio: 2) and (min-device-height: 896px) and (min-device-width: 414px) and (max-device-width: 700px), only screen and (-webkit-device-pixel-ratio: 3) and (min-device-height: 896px) and (min-device-width: 414px) and (max-device-width: 700px),only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3), only screen and (device-width: 320px) and (device-height: 693px) and (-webkit-device-pixel-ratio: 3) {
            margin-top {
                visibility: visible
            }

            .customizedID .product-labels-container {
                margin-top: 26px;
            }

            .cordova .deskmenu {
                top: 86px !important
            }

            .cordova.ios .homeFilter {
                top: 47px;
            }

            .cordova .errorpopup#languageList {
                top: 58px !important
            }

            .cordova .modal.closeNew .btnClose {
                top: 36px !important
            }

            .cordova .modalParent.modal-parent-checkout .btnClose {
                margin-top: 34px
            }

            .cordova .bot.c118 {
                padding-top: 24px !important
            }

            .gotomarker {
                top: 52px;
                border-radius: 3px
            }

            .customizedID.modal.closeNew .btnClose {
                margin-top: 4px
            }

            .app-version {
                top: 114px
            }

            .cordova .box_feedback .feed {
                height: 100px
            }

            .cordova .menuhead .langswitcher {
                margin-top: 55px !important
            }

            .cordova .countryswitcher.inmenu {
                margin-top: 50px
            }

            .cordova .box_feedback .feed textarea {
                padding-top: 18px !important
            }

            .cordova body,
            .webapp body {
                position: relative;
                padding-top: 20px
            }

            .cordova .cb-wrapper {
                top: 50px !Important;
                height: calc(100vh - 77px) !important;
            }

            .cordova .MenuParts.fix,
            .webapp .MenuParts.fix {
                top: 20px !important
            }

            .cordova .MenuParts.fix::before,
            .webapp .MenuParts.fix::before {
                content: "";
                width: 100%;
                height: 20px;
                background-color: var(--primary-color);
                position: fixed;
                top: -20px;
            }

            .retail.cordova .MenuParts.fix::before,
            .webapp .MenuParts.fix::before {
                background-color: #fff
            }

            .cordova .menuhead .zmdi.zmdi-sort-amount-desc {
                top: 52px
            }

            .cordova .menuhead {
                height: 103px
            }

            .cordova .customizedID .btnClose {
                top: 24px !important
            }
        }

        .langtext {
            text-align: center;
            margin-top: 0;
            cursor: pointer;
            line-height: 23px;
            text-transform: lowercase
        }

        .menuhead .langtext {
            color: #333;
            font-size: 12px;
            line-height: 21px;
            height: 18px;
            text-transform: uppercase;
            font-weight: bold;
        }

        div#bobPaymentsModalID,
        div#fibPaymentsModalID {
            width: 100%;
            border-radius: 16px
        }

        div#bobPaymentsModalID .parts,
        div#fibPaymentsModalID .parts{
            background-color: #fff;
            min-height: calc(100vh - 69px)
        }

        div#bobPaymentsModalID .normalForm,
        div#fibPaymentsModalID .normalForm {
            overflow: hidden;
            height: 382px
        }

        .payment-type-cybersource .normalForm {
            min-height: calc(100vh - 72px);
        }

        @media(max-width:768px) {
            .payment-type-cybersource .normalForm {
                min-height: calc(100vh - 114px);
            }

            div#bobPaymentsModalID,
            div#fibPaymentsModalID {
                border-radius: 0;
                top: 0;
                transform: translate3d(0px, 0px, 0px);
                left: 0;
                width: 100vw !important
            }

            div#bobPaymentsModalID .parts,
            div#fibPaymentsModalID .parts {
                background-color: #fff;
                min-height: calc(100vh - 80px);
                display: inline-block
            }
        }

        .titleAndLegend .title {
            color: var(--secondary-color);
            font-weight: normal;
            margin-top: 17px
        }

        .homePid .categories ul>li a.title {
            text-transform: uppercase;
            font-family: titlefont;
            font-weight: normal;
            font-size: 14px;
            color: var(--primary-color);
            padding-top: 10px
        }

        .retail .homePid .categories ul>li a.title {
            text-transform: capitalize;
            color: var(--secondary-color)
        }

        .rtl .homePid .categories ul>li a.title {
            font-family: arabicfont
        }

        .market .homePid .categories ul>li a.title {
            font-family: textfont;
            text-transform: capitalize;
            font-weight: bold;
            font-size: 15px;
            color: #333
        }

        .deskmenu li a {
            font-family: titlefont;
            font-weight: normal
        }

        .fnb .deskmenu li a {
            font-size: 15px;
            line-height: 19px
        }

        .fnb .deskmenu li {
            padding-top: 10px;
            padding-bottom: 10px
        }

        .large-menu-img .itemsList .itemGrid .descBlock .title {
            font-weight: normal;
            color: var(--secondary-color)
        }

        .home-collection .itemsList .itemGrid .descBlock .title {
            margin-left: 0
        }

        .market.large-menu-img .itemsList .itemGrid .descBlock .title {
            padding-top: 0;
            padding-right: 0;
            padding-left: 0;
            text-transform: capitalize;
            text-align: left;
            line-height: 18px;
            white-space: normal;
            margin-left: -5px;
            color: #333 !important;
            font-family: textfont !important;
            font-size: 14px !important;
            font-weight: bold !important;
            padding-bottom: 0 !important
        }

        .market.large-menu-img .newsCtrl .itemsList .itemGrid .descBlock .title {
            font-size: 18px !important
        }

        .rtl .itemsList .itemGrid .descBlock .title {
            font-family: inherit !important
        }

        .large-menu-img .itemsList .itemGrid .descBlock .description {
            white-space: normal
        }

        .retail.large-menu-img .itemsList .itemGrid .descBlock .description {
            display: none
        }

        .market.large-menu-img .itemsList .itemGrid .descBlock .description {
            font-size: 13px;
            margin-bottom: 10px;
            display: inline-block;
            margin-left: -5px;
            overflow: hidden;
            text-overflow: ellipsis;
            margin-top: 2px;
            line-height: 17px;
            opacity: .8;
        }

        .itemsList .genBtn {
            font-family: titlefont;
            font-weight: normal;
            font-size: 12px
        }

        .itemsList .genBtn.customize {
            border-color: var(--primary-color);
            color: var(--primary-color);
            font-weight: normal
        }

        .market .itemsList .genBtn.customize {
            font-size: 10px;
            background-color: #fff;
            letter-spacing: 0;
            color: #666;
            height: 26px;
            margin-top: 3px;
            margin-left: -5px;
            border: 1px solid var(--primary-color);
            display: none
        }

        .itemsList .picture .genBtn.customize {
            display: none
        }

        .market .itemsList .picture .genBtn.customize {
            display: block;
            position: absolute;
            z-index: 1;
            left: 17px;
            top: 14px;
            text-align: center;
            line-height: 23px;
        }

        .market .itemsList .has-discount .picture .genBtn.customize {
            left: auto;
            right: 17px;
        }

        .itemsList .genBtn {
            background-color: var(--primary-color)
        }

        .rtl .itemsList .genBtn {
            font-family: inherit;
            font-weight: bold;
            letter-spacing: -0.1px
        }

        .customizedID .data .title {
            font-weight: normal;
            color: var(--secondary-color)
        }

        .customizedID .data .description li {
            padding: 2px;
            list-style-position: inside
        }

        .market .customizedID .data .description {
            margin-top: 17px
        }

        .customizedID.largetxt .data .description {
            display: none;
            margin-bottom: 22px;
            margin-top: 22px;
        }

        .hot-line {
            font-size: 18px;
            font-family: titlefont;
            font-weight: normal;
            position: relative
        }

        .retail .hot-line {
            font-size: 15px;
            font-family: inherit;
            color: inherit;
            font-weight: bold;
            border-bottom: 1px solid #ddd;
            padding-bottom: 0;
            width: 100%;
            display: inline-block;
            margin-bottom: 16px
        }

        .retail .hot-line: empty {
            display: none
        }

        .retail .hotl::before {
            font: 25px / 1 Material-Design-Iconic-Font;
            content: "\F27C"
        }

        .retail .hot-line::before {
            display: none
        }

        .filter.normal input::-webkit-input-placeholder {
            color: rgba(255, 255, 255, 0.69)
        }

        .rtl .deskmenu .menu li a {
            font-family: inherit;
            font-weight: bold;
            font-size: 16px
        }

        .rtl .deskmenu .menu li ul li a {
            font-weight: normal !important
        }

        .myBagModule .itemBags .itemBag .title,
        .myBagModule .itemBags .itemBag .brand {
            font-family: titlefont;
            font-weight: normal;
            padding-top: 11px;
            text-align: left;
            cursor: pointer;
            font-size: 14px !important;
        }

        .myBagModule .itemBags .itemBag .brand {
            margin-bottom: -11px
        }

        .retail .myBagModule .itemBags .itemBag .brand {
            width: 100%
        }

        .retail .myBagModule .itemBags .itemBag .title {
            width: 100%;
            font-size: 14px !important
        }

        .rtl .myBagModule .itemBags .itemBag .title {
            font-family: inherit;
            font-weight: bold
        }

        .mobileMenuWrap .lineLink.selected .ico,
        .mobileMenuWrap .lineLink .text {
            font-family: titlefont;
            font-size: 14px;
            font-weight: normal !important
        }

        .loyaltyl {
            display: none
        }

        .hasloyalty .loyaltyl {
            display: block
        }

        .menuqlinks .text {
            font-family: textfont !important
        }

        .loginRegisterID .mainTitle {
            font-family: titlefont;
            font-weight: normal;
            text-transform: uppercase
        }

        .box_instruction .title {
            font-family: textfont;
            font-weight: 700;
            text-transform: uppercase
        }

        .customDropDown .drop_title {
            font-family: textfont;
            font-weight: bold
        }

        .editAddAddress .mainTitle {
            font-family: titlefont;
            font-weight: normal;
            /* text-transform: uppercase; */
        }

        .customizedID .data .title {
            font-size: 24px;
            margin-bottom: 7px
        }

        .market .customizedID.largetxt .head .data {
            /* display: none; */
        }

        .market .customizedID .data .title,
        .market .customizedID .data .brand {
            font-size: 30px;
            color: var(--secondary-color);
            font-family: titlefont
        }

        .market .customizedID .data .brand {
            font-size: 20px;
            color: var(--primary-color)
        }

        .market .customizedID .data .sku {
            color: #999;
            font-size: 13px
        }

        .createAccountID .mainTitle {
            font-family: titlefont;
            font-weight: normal;
            text-transform: uppercase
        }

        .formPart .input .label {
            font-size: 15px
        }

        .myBagModule .nb.neartitle {
            font-size: 20px
        }

        .retail .myBagModule .nb.neartitle {
            display: none;
            border: 1px
        }

        .myBagModule .itemBags .customPart .type {
            text-transform: uppercase;
            width: 89px;
            margin-bottom: 5px;
            padding-right: 2px
        }

        .retail .myBagModule .itemBags .customPart .type {
            width: 70px
        }

        .myBagModule .itemBags .for-free .type {
            display: none !important
        }

        .myBagModule .itemBags .customPart .name {
            text-transform: uppercase
        }

        .retail .myBagModule .itemBags .customPart .name {
            margin-top: 4px;
            cursor: pointer
        }

        .myBagModule .itemBags .customPart .elements {
            width: calc(100% - 126px)
        }

        .MenuParts .callUsNb {
            top: 20px;
            padding-right: 48px;
            text-decoration: none;
            pointer-events: none;
            height: 45px;
            line-height: 45px
        }

        .retail .MenuParts .callUsNb {
            display: none !important
        }

        .MenuParts .callUsNb {
            display: none
        }

        .whatsapp .MenuParts .callUsNb {
            pointer-events: all;
            height: 45px;
            border-radius: 5px;
            padding-right: 64px;
            overflow: hidden
        }

        .whatsapp.hidehotline .MenuParts .callUsNb {
            padding-right: 0;
            width: 49px
        }

        .disableqtty .addRemove {
            display: none
        }

        .recommendedItems .modal-container .title {
            text-transform: uppercase
        }

        .generalMainTitle {
            font-weight: normal;
            text-transform: uppercase
        }

        .retail .generalMainTitle {
            font-size: 24px
        }

        .pageMainTitle {
            font-weight: normal;
            font-family: titlefont;
            text-transform: uppercase
        }

        .myAccountPid .pageMainTitle {
            display: none
        }

        .editaccountp .pageMainTitle {
            padding-bottom: 12px;
            display: none
        }

        .market .pageMainTitle {
            padding-bottom: 3px;
            padding-top: 10px;
            display: none
        }

        @media only screen and (device-width:375px) and (device-height:812px) and (-webkit-device-pixel-ratio:3),
        only screen and (device-width:414px) and (device-height:896px) and (-webkit-device-pixel-ratio:2),
        only screen and (device-width:414px) and (device-height:896px) and (-webkit-device-pixel-ratio:3) {
            .retail .customizedID .picture {
                position: relative !important
            }
        }

        .customizedID .backg {
            transition: transform .5s linear 0s
        }

        .market .subPage .titleAndLegend {
            display: block !important
        }

        .rtl.market .subPage .titleAndLegend {
            margin-right: 0;
            margin-left: auto
        }

        .enablesorting .categoryPid .sorter {
            position: absolute;
            right: 0;
            top: 12px;
            z-index: 1;
            display: block
        }

        .rtl .categoryPid .sorter {
            right: auto;
            left: 17px
        }

        .sorter {
            display: none
        }

        .categoryPid .sorter::after {
            display: inline-block;
            font: 22px / 1 Material-Design-Iconic-Font;
            text-rendering: auto;
            -webkit-font-smoothing: antialiased;
            content: "\F1CE";
            width: 19px;
            position: absolute;
            right: 8px;
            top: 6px;
            pointer-events: none
        }

        .rtl .categoryPid .sorter::after {
            right: auto;
            left: 12px
        }

        .categoryPid .sorter select {
            width: 178px;
            height: 35px;
            padding-left: 12px;
            color: #333;
            border: 1px solid #eee;
            border-radius: 4px;
            line-height: 35px;
            background-color: #fff
        }

        .rtl .categoryPid .sorter select {
            padding-left: 0;
            padding-right: 12px
        }

        .showsubcatmenu .subPage .titleAndLegend {
            display: block
        }

        .market .subPage .titleAndLegend .title {
            display: block !important
        }

        .market .subPage .titleAndLegend .title {
            margin-top: 7px;
            margin-bottom: -10px;
            text-transform: capitalize;
            font-size: 31px;
            color: #ccc
        }

        .newsCtrl.subPage .titleAndLegend .title {
            display: none !important
        }

        .retail .newsCtrl.subPage .titleAndLegend .title {
            text-transform: lowercase;
            color: #ddd;
            display: block !important;
            font-size: 43px !important
        }

        .MenuParts .parts {
            opacity: 1
        }

        .flmenubtn {
            font-family: titlefont;
            font-weight: normal;
            letter-spacing: .5px;
            font-size: 12px
        }

        .retail .flmenubtn {
            width: 152px;
            border-radius: 6px;
            opacity: .8;
            display: none !important
        }

        .retail .flmenubtn.retailonly {
            width: calc(100vw - 48px);
            text-align: left;
            box-sizing: border-box;
            background-color: transparent;
            box-shadow: none;
            opacity: 1;
            display: block !important
        }

        .retail .flmenubtn.retailonly .filter.normal {
            position: absolute;
            top: -1px;
            right: -2px;
            overflow: hidden;
            border-radius: 5px;
            box-shadow: rgba(0, 0, 0, 0.09) 0 10px 20px, rgba(0, 0, 0, 0.09) 0 6px 6px;
            border: 0;
            transition: all .6s ease 0s;
            width: 59px !important
        }

        .retail .s-active .flmenubtn.retailonly .filter.normal {
            background-color: #fff;
            width: 100vw !important
        }

        .retail .flmenubtn.retailonly .filter .zmdi {
            top: 6px
        }

        .retail .s-active .flmenubtn.retailonly .filter .zmdi::before {
            content: "\F136"
        }

        .retail .flmenubtn.retailonly .filter input {
            color: #333;
            visibility: hidden
        }

        .retail .s-active .flmenubtn.retailonly .filter input {
            visibility: visible !important
        }

        .retail .flmenubtn.retailonly .activecat {
            box-shadow: rgba(0, 0, 0, 0.09) 0 -18px 20px, rgba(0, 0, 0, 0.09) 0 8px 6px;
            opacity: .95;
            width: fit-content;
            background-color: #fff;
            color: #000;
            padding-left: 18px;
            padding-right: 43px;
            border-radius: 3px;
            position: absolute;
            right: 68px;
            transform: translateX(0px);
            transition: all .5s ease 0s;
            text-transform: capitalize
        }

        .showModal .flmenubtn {
            bottom: -150px;
            display: none !important
        }

        .myAccountPid .activecat {
            display: none
        }

        .offers .activecat {
            display: none
        }

        .retail .flmenubtn.retailonly .activecat::after {
            font: 17px / 1 Material-Design-Iconic-Font;
            content: "\F2F9";
            position: absolute;
            top: 16px;
            right: 18px
        }

        .retail .s-active .flmenubtn.retailonly .activecat {
            transform: translateX(-600px);
            transition: all .2s ease 0s
        }

        .locAddress .street: first-child {
            color: var(--primary-color);
            font-weight: normal !important
        }

        .recommendedItems .modal-container .btnClose {
            bottom: -46px !important
        }

        .MenuParts .bag {
            padding-left: 13px;
            background-color: #fff;
            line-height: 45px;
            height: 45px;
            margin-top: 20px;
            border-radius: 5px
        }

        .retail .MenuParts .bag {
            position: relative;
            padding-left: 0;
            color: #fff;
            border-radius: 0 0 5px 5px;
            z-index: 1;
            margin-right: 4px;
            background: transparent;
            width: 45px !important
        }

        .zmdi-sort-amount-desc::before {
            margin-left: -36px
        }

        .MenuParts .bag.minicv {
            display: none
        }

        .deiveringfrom {
            display: none
        }

        .multibranch .deiveringfrom {
            display: block;
            font-size: 13px;
            background-color: rgba(0, 0, 0, 0);
            width: 200px;
            border-radius: 7px 0 0 7px;
            border: 2px solid rgba(255, 255, 255, 0.1);
            height: 44px;
            position: absolute;
            cursor: pointer
        }

        .multibranch .branchtitle {
            color: rgba(255, 255, 255, 0.6);
            width: 100%;
            border-bottom: 1px dashed rgba(255, 255, 255, 0.27);
            box-sizing: border-box;
            height: 20px;
            line-height: 20px;
            padding-left: 9px;
            text-transform: uppercase;
            font-size: 10px
        }

        .multibranch .branchname,
        .multibranch .locationName {
            display: block;
            color: #fff;
            width: 100%;
            box-sizing: border-box;
            height: 27px;
            line-height: 25px;
            padding-left: 9px;
            text-transform: uppercase;
            font-size: 11px;
            font-weight: bold;
            overflow: hidden
        }

        .multibranch .branchname::after,
        .multibranch .locationName::after {
            content: "\F2F2";
            font-family: Material-Design-Iconic-Font;
            color: #fff;
            font-size: 18px;
            position: absolute;
            right: 8px;
            top: 3px;
            box-sizing: border-box;
            padding-top: 17px;
            z-index: 0;
            pointer-events: none
        }

        .multibranch .filter.normal {
            width: calc(100% - 199px);
            float: right;
        }

        .multibranch .accname {
            display: none
        }

        .subcats a {
            color: #333;
            text-decoration: none;
            font-size: 14px;
            transition: all .2s linear 0s;
            height: 30px;
            display: inline-block
        }

        .subcats li {
            list-style: none;
            padding-bottom: 7px;
            padding-top: 6px;
            display: inline-block;
            padding-right: 25px;
            font-weight: bold;
            position: relative;
            width: auto;
            height: 21px;
            transition: all .2s linear 0s
        }

        .subcats li.selected {
            transition: all .2s linear 0s
        }

        .subcats li.selected a {
            color: var(--primary-color);
            transition: all .2s linear 0s;
            border-bottom: 2px solid var(--primary-color)
        }

        .subcats ul {
            overflow: auto;
            width: 100%;
            white-space: nowrap;
            height: 45px
        }

        .rtl .subcats ul {
            direction: rtl
        }

        .subcats ul.link:empty {
            display: none
        }

        .subcats ul.link.ng-scope {
            display: block
        }

        .subcats {
            background-color: #fff;
            padding: 8px 10px 10px;
            width: 100%;
            box-shadow: rgba(204, 204, 204, 0.2) 0 12px 8px;
            height: 28px;
            position: fixed;
            z-index: 3;
            top: 118px
        }

        .retail .subcats {
            top: 66px
        }

        .subcats {
            display: none
        }

        .checkoutID .subcats,
        .orderdetails .subcats {
            display: none !important
        }

        .categoryPid .subcats {
            display: block
        }

        .cordova .categoryPid .subcats {
            top: 136px;
        }

        .retail.cordova .categoryPid .subcats {
            top: 61px
        }

        .subcats.subempty {
            display: none
        }

        .subcats.subempty {
            display: none
        }

        @media(min-width:1800px) {
            .market .itemsList .itemGrid {
                /* width: calc(14vw - 14px) !important; */
            }

            .market .newsCtrl .itemsList .itemGrid {
                margin-right: 13px;
                width: calc(33% - 15px) !important
            }
        }

        .market .itemsList .itemGrid .priceWrap .wrap {
            margin-top: 0
        }

        .loyalty-points {
            position: relative;
            display: none;
            margin-bottom: 15px
        }

        .loyalty-points .input {
            position: relative;
            display: block
        }

        .loyalty-points .label {
            position: relative;
            display: inline-block;
            color: #000;
            padding-left: 20px;
            cursor: pointer
        }

        .loyalty-points .deducted-amount {
            position: relative;
            display: block;
            font-size: 12px;
            color: #666;
            margin-left: 21px;
            margin-top: -7px
        }

        .wrapContainer .scroll-menu {
            position: relative;
            display: block;
            height: calc(100% - 93px);
            overflow: auto;
            min-width: 300px;
            padding-bottom: 22px
        }

        .zmdi-facebook::before {
            background-image: url("../images/facebook.png");
            width: 28px;
            height: 28px;
            display: inline-block;
            background-size: cover;
            content: "" !important
        }

        .zmdi-instagram::before {
            background-image: url("../images/instagram.png");
            width: 28px;
            height: 28px;
            display: inline-block;
            background-size: cover;
            content: "" !important
        }

        .zmdi-twitter::before {
            background-image: url("../images/twitter.png");
            width: 28px;
            height: 28px;
            display: inline-block;
            background-size: cover;
            content: "" !important
        }

        .zmdi-youtube::before {
            background-image: url("../images/youtube.png");
            width: 28px;
            height: 28px;
            display: inline-block;
            background-size: cover;
            content: "" !important
        }



        @media(max-width:768px) {
            .checkoutID .bot {
                overflow: hidden
            }

            .flmenubtn {
                display: block
            }

            .enablesorting .categoryPid .sorter.subempty {
                top: -41px;
                right: 6px !important
            }

            .rtl .categoryPid .sorter.subempty {
                margin-top: -47px !important
            }

            .fnb.enablesorting .categoryPid .sorter.subempty {
                top: -43px
            }

            .retail.enablesorting .categoryPid .sorter.subempty {
                margin-top: -7px
            }

            .flmenubtn.retailonly {
                display: none
            }

            .retail .flmenubtn.retailonly {
                display: block
            }

            .retail .pages .flmenubtn.retailonly {
                display: none !important
            }
        }

        .minimumOrderChargeAlert {
            position: relative;
            display: block;
            text-align: center;
            font-size: 13px;
            padding: 4px 25px;
            margin-bottom: 18px;
            background-color: #fffde1;
            border-radius: 6px;
            line-height: 18px;
            margin-top: 32px;
            color: #d88c00;
            font-weight: bold;
            padding-top: 11px;
            padding-bottom: 13px
        }

        .minimumOrderChargeAlert.minimumOrderCouponChargeAlert {
            margin-top: -14px;
            background-color: transparent;
            height: 31px;
            color: #e6a01f;
            font-weight: bold;
            text-align: left;
            padding: 0
        }

        .checkout-offer .minimumOrderChargeAlert {
            background: transparent;
            text-align: left;
            margin: 0 0 0 4px;
            padding-left: 0;
            color: #d58325;
            white-space: normal;
            font-size: 14px
        }

        .header-loyalty-value {
            display: none
        }

        .loyalty-details footer {
            display: none
        }

        .home-collection {
            position: relative;
            display: block
        }

        .home-collection.layout4 .title,
        .home-collection.layout3 .title {
            position: absolute;
            width: 100%;
            height: 100%;
            color: #fff;
            display: table-cell;
            vertical-align: bottom
        }

        .home-collection.layout3 .title {
            height: calc(100% - 636px)
        }

        .home-collection.layout3 .title.noprod {
            bottom: 10px;
            top: auto
        }

        .home-collection.layout4 .title span,
        .home-collection.layout3 .title span {
            position: absolute;
            transform: translate3d(-50%, 10px, 10px);
            left: 50%;
            text-shadow: rgba(0, 0, 0, 0.36) 4px 3px 17px, rgba(0, 0, 0, 0.38) 0 3px 6px;
            bottom: 122px;
            font-size: 42px;
            line-height: 37px;
            text-align: center
        }

        .home-collection.layout3 .title span {
            font-size: 63px;
            width: calc(100% - 93px);
            font-weight: bold;
            line-height: 54px
        }

        .home-collection.layout4 {
            width: calc(50% - 15px);
            /* margin-top: 42px; */
            display: inline-block;
            padding-right: 15px;
            position: relative;
        }

        .home-collection.layout4:nth-of-type(2) {
            padding-right: 0
        }

        .home-collection.layout4 img {
            width: 100%;
            height: auto
        }

        .home-collection .title {
            margin-top: 22px
        }

        .home-collection .title {
            position: relative;
            display: block;
            font-size: 27px;
            text-transform: capitalize;
            font-family: textfont;
            color: var(--secondary-color);
            padding-bottom: 19px;
            text-decoration: none;
            font-weight: bold !important
        }

        .home-collection.layout8,
        .home-collection.layout7,
        .home-collection.layout6,
        .home-collection.layout9 {
            /* float:left; */
            width: calc(19vw - 12px);
            display: inline-block;
        }

        .home-collection.layout7 {
            /* float:left; */
            width: calc(23.7vw - 12px);
            display: inline-block;
        }

        .home-collection.layout6 {
            /* float:left; */
            width: calc(31.5vw - 12px);
            display: inline-block;
        }

        .home-collection.layout9 {
            /* float:left; */
            width: calc(31.5vw - 12px);
            display: inline-block;
        }

        .home-collection.layout8 .title,
        .home-collection.layout7 .title,
        .home-collection.layout6 .title,
        .home-collection.layout9 .title {
            width: calc(100vw - 114px);
            text-align: center;
        }

        .lwr .home-collection .title {
            display: none !important;
        }

        .home-collection.layout8 .coimg,
        .home-collection.layout7 .coimg,
        .home-collection.layout6 .coimg {
            width: 100%;
            overflow: hidden;
        }

        .home-collection.layout8~.home-collection.layout8 .title,
        .home-collection.layout7~.home-collection.layout7 .title,
        .home-collection.layout6~.home-collection.layout6 .title,
        .home-collection.layout9~.home-collection.layout9 .title {
            visibility: hidden;
            width: auto !important;
            display: block;
        }

        .home-collection.layout8~.home-collection.layout8,
        .home-collection.layout7~.home-collection.layout7,
        .home-collection.layout6~.home-collection.layout6,
        .home-collection.layout9~.home-collection.layout9 {
            margin-left: 10px;
            margin-bottom: 62px;
        }

        .rtl .home-collection .title {
            direction: rtl;
            text-align: right;
            margin-left: 83px
        }

        .relations .title {
            position: relative;
            display: block;
            font-size: 24px;
            text-transform: capitalize;
            font-family: textfont;
            color: var(--secondary-color);
            padding-bottom: 19px;
            text-decoration: none;
            font-weight: bold !important
        }

        .market .ymliketitle,
        .market .ymlike {
            display: inline-block
        }

        @media only screen and (max-width:768px) {
            .home-collection .title {
                font-size: 22px;
                letter-spacing: normal;
                text-align: left;
                margin-left: 12px;
                padding-top: 27px
            }

            .home-collection a.title {
                width: calc(100vw - 123px);
                font-size: 24px;
                line-height: 24px
            }

            .home-collection.layout8~.home-collection.layout8 .title,
            .home-collection.layout7~.home-collection.layout7 .title,
            .home-collection.layout6~.home-collection.layout6 .title,
            .home-collection.layout9~.home-collection.layout9 .title {
                display: none;
            }

            .home-collection.layout3 .title,
            .home-collection.layout4 .title {
                height: calc(100% - 391px);
                margin-left: 0px !Important;
                margin-right: 0px !important;
            }

            .home-collection.layout4 .title span,
            .home-collection.layout3 .title span {
                font-size: 26px;
                line-height: 24px;
                bottom: 102px;
                font-weight: bold;
                text-shadow: rgba(0, 0, 0, 0.25) 4px 3px 20px, rgba(0, 0, 0, 0.22) -2px -1px 20px
            }
        }

        .home-collection .view-more {
            position: absolute;
            top: 3px;
            right: 15px;
            background-color: #fff;
            text-align: center;
            min-width: 85px;
            height: 27px;
            border-radius: 21px;
            font-size: 12px;
            text-decoration: none;
            color: var(--secondary-color);
            line-height: 27px;
            box-shadow: rgba(204, 204, 204, 0.24) 0 0 4px;
            border: 1px solid #eee;
            padding-left: 9px;
            padding-right: 9px
        }

        .home-collection.layout8 .view-more,
        .home-collection.layout7 .view-more,
        .home-collection.layout6 .view-more,
        .home-collection.layout9 .view-more {
            border: 0px;
            box-shadow: none;
            top: auto;
            bottom: 32px;
            width: 100%;
            text-align: center;
            left: 0px;
            right: auto;
            min-width: auto;
            padding: 0px !important;
            font-size: 17px;
            font-weight: bold;
            display: block;
            background-color: transparent;
        }

        .home-collection.layout8 img,
        .home-collection.layout7 img,
        .home-collection.layout6 img,
        .home-collection.layout9 img {
            width: 100%;
            height: auto;
            margin-bottom: 74px;
        }

        .home-collection.layout4 .view-more,
        .home-collection.layout3 .view-more {
            background-color: transparent;
            border-width: 0 0 2px;
            border-top-style: initial;
            border-right-style: initial;
            border-left-style: initial;
            border-top-color: initial;
            border-right-color: initial;
            border-left-color: initial;
            border-image: initial;
            position: absolute;
            transform: translate3d(-50%, 10px, 10px);
            left: 50%;
            text-shadow: rgba(0, 0, 0, 0.36) 4px 3px 17px, rgba(0, 0, 0, 0.38) 0 3px 6px;
            bottom: 61px;
            font-size: 17px;
            color: #fff;
            font-weight: bold;
            border-bottom-style: solid;
            border-bottom-color: #fff;
            border-radius: 0;
            display: inline-table;
            top: auto;
        }

        .home-collection.layout3 .view-more {
            bottom: 668px
        }

        .home-collection.layout3 .view-more.noprod {
            bottom: 63px
        }

        .rtl .home-collection .view-more {
            right: auto;
            left: 18px
        }

        .homePid .gridSystem .case {
            padding-bottom: 20px;
            overflow-x: hidden
        }

        @media(min-width: 769px) {
            .homePid .content {
                padding-bottom: 60px;
                margin-top: 0
            }

            .rtl .homePid .content {
                float: right
            }

            .menuontop .pheadline {
                padding-left: 57px;
                box-sizing: border-box
            }
        }

        .delivery-date {
            text-align: center;
            font-size: 14px;
            margin-top: 12px;
            color: #555;
            margin-bottom: 12px;
            display: none
        }

        .no-asap-order .delivery-date {
            display: block
        }

        .rtl .delivery-date {
            direction: rtl
        }

        .pickupmode .delivery-date {
            display: none
        }

        .scroll-up {
            width: 60px;
            height: 60px;
            background-color: var(--primary-color);
            position: fixed;
            bottom: -258px;
            left: 34px;
            border-radius: 100%;
            cursor: pointer;
            box-shadow: rgba(0, 0, 0, 0.5) 5px 8px 20px;
            z-index: 4;
            transition: all .3s cubic-bezier(0.93, 0.01, 0.24, 1.27) 0s
        }

        .rtl .scroll-up {
            right: 34px;
            left: auto
        }

        .scroll-up.show {
            transition: all .3s cubic-bezier(0.93, 0.01, 0.24, 1.27) 0s;
            bottom: 82px
        }

        .scroll-up::after {
            display: inline-block;
            font: 18px / 1 Material-Design-Iconic-Font;
            text-rendering: auto;
            -webkit-font-smoothing: antialiased;
            content: "\F303";
            width: 50px;
            position: absolute;
            right: 5px;
            top: 20px;
            pointer-events: none;
            color: #fff;
            text-align: center
        }

        .normalForm .select-list select {
            position: relative;
            display: block;
            width: 100%;
            height: 100%;
            border: 0;
            padding-left: 12px;
            color: #4d4d4c;
            font-size: 13px;
            background-color: #f7f7f7
        }

        .signupform .select-list select {
            background-color: #fff;
            color: #999;
            padding-left: 20px;
        }

        .inputWrap.select-list .label {
            right: 10px;
            opacity: .2
        }

        @media(min-width:1301px) {
            .checkoutbag {
                display: none
            }
        }
        @media(min-width:1271px) {
            .genBtn:hover {
                filter: brightness(1.1)
            }
        }

        .zmdi-facebook::before {
            background-image: url("../images/facebook.png");
            width: 28px;
            height: 28px;
            display: inline-block;
            background-size: cover;
            content: "" !important
        }

        .zmdi-instagram::before {
            background-image: url("../images/instagram.png");
            width: 28px;
            height: 28px;
            display: inline-block;
            background-size: cover;
            content: "" !important
        }

        .zmdi-twitter::before {
            background-image: url("../images/twitter.png");
            width: 28px;
            height: 28px;
            display: inline-block;
            background-size: cover;
            content: "" !important
        }

        .hot-line::after {
            content: "";
            background-image: url("../images/phone.png");
            width: 26px;
            height: 26px;
            display: inline-block;
            background-size: contain;
            background-position: 0 0;
            background-repeat: no-repeat;
            position: absolute;
            right: 12px;
            top: 50%;
            transform: translateY(-50%)
        }

        .whatsapps .hot-line::after {
            content: "whatsapp";
            visibility: visible;
            z-index: 1;
            position: absolute;
            right: 34px;
            font-size: 18px;
            line-height: 8px;
            top: 2px
        }

        .whatsapp .hot-line::after {
            content: "\F405";
            background-image: none;
            font-size: 28px;
            box-sizing: border-box;
            height: 45px;
            visibility: visible;
            right: 0;
            padding-left: 14px;
            line-height: 44px;
            width: auto;
            background-color: #5eb620;
            border-radius: 5px;
            padding-right: 12px
        }

        .retail .genBtn.quickadd.ng-scope {
            display: none
        }

        .retail.large-menu-img .itemsList .itemGrid .descBlock .title {
            font-size: 14px;
            line-height: 15px;
            font-family: textfont;
            white-space: normal;
            color: #444;
            margin-top: 2px;
            padding-bottom: 0 !important;
            font-weight: 400 !important
        }

        .retail.large-menu-img .newsCtrl .itemsList .itemGrid .descBlock .description {
            display: block;
            padding-right: 0
        }

        .newsCtrl .activecat {
            display: none
        }

        .itemsList .itemGrid .descBlock .brand {
            font-size: 15px;
            margin-top: 0;
            color: #333;
            margin-bottom: 6px;
            white-space: normal;
            font-weight: bold
        }

        .retail .itemsList .itemGrid .descBlock .brand {
            margin-bottom: 0;
            font-size: 14px
        }

        .retail .itemsList .itemGrid .priceWrap .price {
            text-align: left;
            padding-left: 12px
        }

        .retail.menuontop .itemsList .itemGrid .priceWrap .price {
            padding-left: 3px
        }

        .retail .retailonly {
            display: block
        }

        .retail .customizedID .addRemoveWrap .addRemove {
            display: none
        }

        .retail .customizedID {
            width: calc(100vw - 715px);
            min-width: 955px;
        }

        .retail .customizedID .genBtn {
            width: 50%;
            display: none
        }

        .retail .customizedID .genBtn.editmode {
            display: block
        }

        .retail .customizedID .genBtn.retailonly {
            display: block;
            position: relative;
            height: 50px;
            border-radius: 4px;
            width: 100%;
            float: left;
            text-align: center;
            line-height: 50px;
            margin-bottom: 22px;
            font-weight: bold
        }

        .classicproduct .customizedID .genBtn.retailonly {
            width: 100%;
            float: right;
            border-radius: 0 4px 4px 0
        }

        .meta .title {
            font-family: textfont;
            font-size: 24px;
            width: 84%;
            font-weight: 400;
            margin-bottom: 19px
        }

        .meta .sku {
            text-transform: uppercase;
            font-size: 11px;
            color: #ddd;
            margin-top: 10px;
            margin-bottom: 22px
        }

        .meta .brand {
            margin-bottom: -1px;
            color: #000;
            margin-top: 7px;
            font-size: 22px;
            font-weight: bold
        }

        .retail .retailonly.meta .brand {
            font-size: 14px;
            margin-bottom: 3px
        }

        .retail .customizedID .data {
            display: none
        }

        .retail .customizedID .picture {
            max-height: 100%;
            height: 100%;
            margin-bottom: 0;
            position: absolute;
            border: 0
        }

        .retail .customizedID .picture .swiper-container {
            position: relative;
            display: block;
            margin: 0;
            height: 100%;
            border: 15px solid #f7f7f7;
            box-sizing: border-box;
            overflow: hidden !important
        }

        .market .customizedID .picture .swiper-container {
            height: 100%;
            display: block
        }

        .retail .customizedID .picture .swiper-slide {
            /* background-color: #eee; */
            display: table;
            height: 100% !important;
        }

        .market .customizedID .picture .swiper-slide {
            background-color: #fff;
            display: table;
            height: 100% !important;
        }

        .retail .customizedID .picture .pinch-zoom {
            display: table-cell;
            vertical-align: middle;
        }

        .market .customizedID .picture .pinch-zoom {
            vertical-align: middle;
            display: flex;
            justify-content: center;
            align-items: center;
            height: inherit;
        }

        .retail .customizedID .head .wrap {
            height: 100% !important
        }

        .retail .customizedID .wrap-c {
            display: inline-block;
            width: 100%;
            background-color: #f7f7f7
        }

        .retail .customizedID .head {
            width: 50%;
            height: 100%;
            background-color: #f7f7f7
        }

        .retail .customizedID .cont {
            width: 50%;
            min-height: 100%;
            float: left;
            box-sizing: border-box;
            background-color: #f7f7f7;
            height: auto;
            padding-bottom: 0;
            padding-left: 0;
            padding-right: 0
        }

        .retail .customizedID .backg {
            position: relative;
            left: auto;
            transform: none;
            cursor: zoom-in
        }

        .retail .wrapCustom {
            margin-top: 38px
        }

        .retail .wrapCustom .description {
            font-size: 14px;
            color: #444;
            margin-bottom: 32px;
            display: inline-block;
            line-height: 23px;
            margin-top: 18px;
            font-weight: 400
        }

        .retail .column_cust .bTitle {
            border-bottom: 0;
            margin-bottom: 4px;
            text-transform: uppercase;
            font-size: 12px;
            display: none
        }

        .retail .formPart .lines .line {
            border-bottom: 1px solid #eee;
            break-inside: avoid;
            overflow: hidden
        }

        .retail .formPart .lines .line .check {
            top: -2px
        }

        .line.sold-out {
            opacity: .5
        }

        .retail .formPart .lines .line: last-child {
            border-bottom: 0
        }

        .retail .formPart .lines {
            background-color: #fff;
            border-radius: 4px;
            box-shadow: rgba(36, 36, 36, 0.07) 0 3px 23px;
            overflow: hidden;
            box-sizing: border-box;
            min-height: 41px
        }

        .classicproduct .formPart .lines {
            border-radius: 0
        }

        .retail .formPart .lines .line {
            padding: 13px;
            box-sizing: border-box;
            width: 100%;
            margin-bottom: 0
        }

        .classicproduct.retail .formPart .lines {
            background-color: transparent
        }

        .retail .formPart .lines .line: last-child:first-child {
            width: 100%;
            min-height: 38px !important
        }

        .tinyselect {
            display: none
        }

        .checked .tinyselect {
            display: block;
            z-index: 1
        }

        .retail .tinyselect {
            margin-top: -7px;
            border-radius: 4px;
            border-color: #fff;
            overflow: visible;
            width: 117px !important;
            margin-right: -15px !important
        }

        .retail .tinyselect.lastitem {
            visibility: hidden
        }

        .retail .tinyselect.lastitem::before {
            content: "last item";
            position: absolute;
            visibility: visible;
            font-family: inherit;
            font-size: 11px;
            text-transform: uppercase;
            background-color: #666;
            height: 20px;
            line-height: 20px;
            padding-left: 7px;
            padding-right: 7px;
            border-radius: 4px;
            right: -5px;
            left: auto;
            letter-spacing: .5px;
            color: #fff !important;
            top: 1px !important
        }

        .retail .tinyselect.fx {
            bottom: 18px;
            position: fixed;
            left: 0;
            z-index: 999999;
            display: block;
            background: #fff;
            border-color: #fff
        }

        .retail .tinyselect select {
            background: #fff;
            color: #333;
            border: none;
            pointer-events: none;
            padding-left: 47% !important;
            text-align: left;
            width: 100% !important;
        }

        .rtl.retail .tinyselect select {
            transform: translateZ(0px) rotateY(180deg);
            padding-left: 0 !important;
            padding-right: 50% !important
        }

        .tinyselect.fx select {
            background: #fff;
            color: #333
        }

        .tinyselect.fx::before {
            color: #333
        }

        .retail .tinyselect::before {
            color: #fff;
            display: none
        }

        .retail .formPart .price {
            text-align: right;
            top: 3px
        }

        .retail .categoryPid .titleAndLegend {
            display: block;
            margin-top: 0;
            z-index: 2;
            width: calc(100% - 222px);
            padding-bottom: 0;
            margin-bottom: 12px
        }

        .rtl.retail .categoryPid .titleAndLegend {
            direction: rtl;
            float: right
        }

        .retail .customizedID .addToFav .txt {
            line-height: 50px
        }

        .retail .customizedID .onRight {
            display: none
        }

        .retail .meta .discountpercent {
            position: relative;
            left: auto;
            top: auto;
            bottom: auto;
            border-radius: 5px;
            height: 33px;
            line-height: 33px;
            font-weight: bold;
            float: left;
            margin-right: 9px
        }

        .classicproduct.productpage .meta .discountpercent {
            zoom: .8;
            margin-top: 3px
        }

        .meta .price {
            float: left;
            box-shadow: rgba(36, 36, 36, 0.1) 0 3px 23px;
            background-color: #fff;
            height: 33px;
            border-radius: 5px;
            font-size: 15px;
            width: auto;
            padding-left: 12px;
            padding-right: 8px;
            line-height: 32px;
            color: var(--primary-color);
            font-weight: bold
        }

        .rtl .meta .price {
            float: right;
            margin-right: 24px
        }

        .customizedID .picture .discountpercent {
            display: none
        }

        .meta .oldprice {
            display: block;
            position: relative;
            float: left;
            font-size: 14px;
            height: 33px;
            line-height: 33px;
            margin-left: 10px;
            margin-top: 0 !important
        }

        .retail .myBagModule .itemBags .itemBag .casePic .backg {
            height: 100%
        }

        .retail .myBagModule .itemBags .itemBag .casePic .backg img {
            top: 0;
            transform: none;
            position: relative
        }

        .retail .myBagModule .itemBags .itemBag .casePic {
            height: unset
        }

        .retail .deskmenu li a {
            font-size: 17px
        }

        .retail .socials .social {
            filter: invert();
            opacity: .7
        }

        .socials.mobi .social {
            filter: none;
            opacity: 1
        }

        .retail .filter .zmdi {
            color: var(--primary-color)
        }

        .retail .itemsList .genBtn.customize {
            display: none
        }

        .retail .oldprice {
            float: left;
            margin-left: 8px;
        }

        .retail body.s-active.isSearching {
            overflow: visible !important
        }

        .retail .homeFilter.ontop {
            width: 335px;
            border-radius: 100px;
            background-color: #f3f3f3;
            margin-top: 10px
        }

        .rtl.logoontop .homeFilter.ontop {
            left: auto;
            right: 22px;
            width: 246px
        }

        .retail .homeFilter .filter input::placeholder {
            color: #999
        }

        .retail .MenuParts .parts .bot {
            background-color: #fff;
            border-bottom: 1px solid #ddd;
            height: 70px
        }

        .retail .myBagModule .bagTitle .clear-bag {
            display: none
        }

        .retail .myBagModule .bagTitle {
            margin-top: -6px
        }

        .userbar.icons {
            position: relative;
            top: auto;
            width: auto;
            transform: none;
            left: auto;
            background: transparent;
            float: right
        }

        .userbar.icons .userpages {
            float: right
        }

        .userbar.icons .menuList.signedIn {
            margin-top: 5px
        }

        .retail .nbHolding span {
            color: #fff;
            padding: 0;
            width: 100%;
            font-size: 13px;
            line-height: 19px;
        }

        .retail .showBag .userbar {
            display: none
        }

        .retail .userbar.icons {
            display: block;
            border: 0;
            padding-top: 19px
        }

        .retail .userbar.icons .md-fav {
            margin-right: 7px;
            color: var(--primary-color)
        }

        .userbar.icons .md-src {
            margin-right: 7px;
            color: #666;
            display: none
        }

        .menuontop .userbar.icons .md-src {
            display: block
        }

        .retail .menuList.signin::before {
            content: "\F207";
            font-size: 25px
        }

        .retail .nbHolding {
            margin-right: 0;
            content: "";
            width: 27px;
            height: 19px;
            border-radius: 3px 3px 5px 5px;
            z-index: 1;
            position: absolute;
            top: 35px;
            left: 5px;
            font-size: 28px !important
        }

        .nbHolding.animate::after {
            display: none
        }

        .retail .showBag .menuList.bag span::after {
            border: 2px solid var(--primary-color)
        }

        .retail .deskmenu {
            top: 15px;
            margin-bottom: 41px
        }

        .logoontop .deskmenu .logo {
            display: none
        }

        .retail .zmdi-star-outline::before {
            content: "\F15E"
        }

        .retail .zmdi-star::before {
            content: "\F15F"
        }

        .retail #wrapper {
            padding-top: 71px;
            margin-top: 0;
            box-sizing: border-box
        }

        .shopmenu {
            display: none
        }

        .retail .homeFilter .filter input {
            padding-left: 27px;
            color: #333
        }

        .rtl.logoontop .homeFilter .filter input {
            padding-left: 0 !important
        }

        .retail .deskmenu .menu li ul li {
            min-height: 34px;
            line-height: 34px
        }

        .retail .deskmenu .menu li ul li a {
            font-size: 14px
        }

        .retail .deskmenu .menu li:last-child {
            border-bottom: 0
        }

        .retail .deskmenu .menu li.colle a {
            font-size: 15px;
            color: var(--primary-color)
        }

        .customizedID .genBtn.retailonly {
            display: none
        }

        .customizedID .picture .swiper-container {
            position: relative;
            width: 100%
        }

        pre.description.retailonly {
            font-family: inherit;
            white-space: break-spaces
        }

        .market .noCustomization.largetxt .data .description {
            display: block
        }

        .noCustomization.largetxt .cont {
            display: block
        }

        .largetxt .cont .description {
            font-size: 14px;
            line-height: 24px;
            margin-bottom: 22px;
            white-space: normal;
            display: block !important
        }

        .fnb .cont .data {
            display: none;
        }

        .market .largetxt .cont .description.retailonly {
            display: none !important
        }

        @keyframes blink {
            0% {
                color: rgba(173, 173, 173, 0)
            }

            50% {
                color: #adadad
            }

            100% {
                color: rgba(173, 173, 173, 0)
            }
        }

        .inputWrap.floor {
            width: calc(50% - 3px);
            display: inline-block;
            vertical-align: top
        }

        .inputWrap.appt {
            width: calc(50% - 2px);
            display: inline-block
        }

        .ship.name input {
            width: 100%;
            appearance: none;
            border: 0;
            height: 43px;
            line-height: 43px;
            background-color: #faf8f8;
            padding-left: 98px;
            border-radius: 5px;
            color: #333;
            box-sizing: border-box
        }

        .rtl .ship.name input {
            padding-right: 117px;
            padding-left: 0
        }

        .ship.name::before {
            content: attr(data-text);
            position: absolute;
            left: 16px;
            font-size: 14px;
            color: #999;
            top: 0;
            height: 43px;
            line-height: 43px;
            border-right: 2px solid #fff;
            padding-right: 12px
        }

        .rtl .ship.name::before {
            left: auto;
            right: 0;
            border-left: 2px solid #fff;
            border-right: 0;
            padding-left: 32px
        }

        .ship.name {
            position: relative;
            margin-bottom: 25px;
            display: none
        }

        .retail .ship.name {
            display: block
        }

        @keyframes shine {
            0% {
                transform: translateX(-100%)
            }

            100% {
                transform: translateX(100%)
            }
        }

        .loadinga::after {
            background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0) 99%, rgba(255, 255, 255, 0) 100%);
            content: "";
            top: 0;
            transform: translateX(100%);
            width: 100%;
            height: 100%;
            position: absolute;
            z-index: 1;
            animation: 1s ease 0s infinite normal none running shine
        }

        .retail .pickordel .input {
            border: 1px dotted #ccc;
            height: 51px;
            display: block;
            padding-left: 24px;
            line-height: 60px;
            padding-top: 34px;
            font-weight: bold;
            cursor: pointer;
            width: calc(50% - 45px) !important
        }

        .retail .pickordel .input.checked {
            border-width: 2px;
            border-style: solid;
            border-image: initial;
            border-color: var(--primary-color)
        }

        .retail .pickordel .input .label {
            font-weight: bold;
            text-transform: capitalize;
            font-size: 16px
        }

        .retail .pickordel .input.checked .label {
            color: var(--primary-color)
        }

        .retail .pickordel .input .check {
            left: 16px;
            top: 33px
        }

        .retail .pickordel {
            height: 128px;
            display: block
        }

        .retail .delivery-date {
            display: none
        }

        .retail .box_date.schedule-order {
            display: none
        }

        @media(max-width:768px) {
            body {
                visibility: visible
            }

            .maerket .myBagModule .itemBags .addRemoveWrap .addRemove {
                width: 75px;
                float: left;
                margin-top: 6px;
                margin-left: 13px;
            }

            .fnb .pwrap .discountpercent {
                bottom: 68px;
            }

            .sumhead div {
                font-size: 13px;
            }

            .itemGrid .product-labels-container .product-labels {
                margin-top: -1px !important;
                border-radius: 5px;
                font-size: 11px !important;
                line-height: 16px !important;
            }

            .home-collection.layout8,
            .home-collection.layout7,
            .home-collection.layout6,
            .home-collection.layout9 {
                width: calc(33vw + 1px);
                margin: 0px !important;
                /* margin-bottom: 62px!important; */
            }

            .selectedpayment.ng-scope {}

            span.ptnl.ng-scope {
                margin-top: 8px
            }

            .instagram_profile {
                width: 100%
            }

            .instagram_profile {
                padding-left: 23px
            }

            p.instagram_username a {
                font-size: 20px
            }

            div#instagramfeed {
                width: 100%;
                padding: 16px;
                box-sizing: border-box;
                overflow-x: hidden;
            }

            .pickordel .radio {
                padding-right: 17px;
                margin-left: -2px !important
            }

            .reviewbagbut {
                display: none !important
            }

            .productpage .relationsinline {
                min-height: 0 !important
            }

            .price.nearadd {
                margin-bottom: 37px;
                width: 100% !important
            }

            .home-collection.layout4 {
                padding: 0;
                width: calc(50%);
            }

            .home-collection.layout4:nth-of-type(2) {
                padding-right: 0
            }

            .layout3 .collimg {
                margin-bottom: 0
            }

            .retail body.s-active {
                overflow: hidden !important
            }

            .rtl.market .customizedID.largetxt .data .pwrap {
                text-align: center !important
            }

            .notloggedin .sumhead {
                margin-bottom: 9px
            }

            .enablesorting .categoryPid .ngviewstyle.subempty .content {
                padding-top: 56px
            }

            #ui-datepicker-div {
                box-shadow: rgba(0, 0, 0, 0.49) 0 1px 0 1000px;
                width: 100vw;
                box-sizing: border-box;
                border-radius: 0;
                z-index: 300 !important;
                position: fixed !important;
                bottom: 0 !important;
                top: auto !important;
                left: -19px !important;
            }

            .retail .categoryPid .sorter {
                margin-top: -60px
            }

            #loyaltyDetailsModalID.loyalty-details .loyalty-w,
            #loyaltyMoreDetailsModalID.loyalty-details .loyalty-w {
                border-radius: 0;
                margin-bottom: 0 !important;
                min-height: calc(100vh - 81px) !important
            }

            .tinyselect {
                margin-right: 0
            }

            .fnb .largetxt .cont .description {
                display: none !important;
            }

            .tabled {
                display: block;
                height: auto
            }

            .retail .customizedID .wrap form {
                margin-top: 0
            }

            .rtl.retail .customizedID .wrap form {
                margin-top: 48px
            }

            .show-footer-menu main {
                padding-bottom: 64px !important
            }

            .offerclose {
                left: 12px !important
            }

            .market.cols3mob .itemsList .itemGrid .nb {
                /* transform: translateX(-10px); */
                text-align: center;
                width: 60px
            }

            .market.cols3mob .addRemoveWrap.black .minus {
                transform: translateX(67px);
            }

            .market.cols3mob .active .addRemoveWrap.black .minus {
                transform: translateX(0px);
            }

            .market.cols3mob .addRemoveWrap {
                transform: translateX(-50%);
                left: 50%;
                position: relative;
                z-index: 2;
            }

            .myBagModule .itemBags .addRemoveWrap {
                transform: none;
                left: 16px;
                position: absolute;
            }

            .market.cols3mob .addRemoveWrap.black .plus {
                transform: translateX(-22%);
            }

            .market.cols3mob .active .addRemoveWrap.black .plus {
                transform: scale(1) translateX(0px);
                transition: all .2s linear 0s;
                background-color: #ccc
            }

            .rtl .myAccountPid .addAddress .newAddress .text {
                padding-right: 11px
            }

            .market .largetxt .cont .description {
                /* display: none!important */
            }

            .market .modal.noCustomization.largetxt .cont {
                display: none;
            }

            .payment-container {
                height: calc(100vh - 80px)
            }

            .market .myBagModule .itemBags .price {
                padding-left: 23px
            }

            .retail .column_cust.hide-product-options .tinyselect {
                margin-left: 0;
                margin-right: 0 !important
            }

            .price.nearadd .tinyselect {
                width: calc(100% - 23px) !important
            }

            .pinching .tinyselect {
                opacity: 0
            }

            .classicproduct.retail .formPart .lines .line: last-child {
                margin-top: 0
            }

            .retail .myBagModule .itemBags .customPart .drp-quantity-container {
                margin-left: -31px;
                top: 51px
            }

            .column_cust.hide-product-options .price .tinyselect.no-price {
                top: -1px
            }

            .retail .deskmenu li a {
                font-size: 18px;
                display: block
            }

            #offerId .cont {
                min-height: calc(100vh - 80px);
                box-sizing: border-box;
                margin-bottom: 0 !important;
                border-radius: 0 !important
            }

            .retail .myBagModule .itemBags .customPart .drp-quantity-container {
                left: 12px !important;
                bottom: -48px !important
            }

            .ot-container .ot-prgress-status-ctn {
                height: 266px
            }

            .textTerms {
                padding: 32px;
                overflow-y: auto;
                box-shadow: none;
                height: calc(100vh - 80px) !important;
                border-radius: 0 !important
            }

            .termsID {
                min-width: unset;
                width: 100vw
            }

            .classicproduct.retail .formPart .lines {
                background-color: transparent
            }

            .createAccountID .parts {
                border-radius: 0
            }

            .createAccountID .head {
                padding-top: 35px;
                padding-left: 7px;
                padding-right: 7px;
            }

            .createAccountID .normalForm {
                width: 88%;
                margin: 35px auto auto
            }

            .modal.closeNew {
                padding-top: 80px
            }

            .modal.show {
                transform: translate3d(-50%, 0px, 0px);
                top: 0
            }

            #sizeGuideModalID {
                max-width: 100vw !Important;
            }

            .modal.show.smallType2 {
                transform: translate3d(-50%, -50%, 0px);
                top: 50%
            }

            .modal.show.smallType1 {
                transform: translate3d(-50%, -50%, 0px);
                top: 50%
            }

            .modal.closeNew .btnClose {
                top: 29px !important
            }

            .android.cordova .modal.closeNew .btnClose {
                top: 15px !important
            }

            .retail .myBagModule .itemBags .customPart .line {
                margin-bottom: 6px
            }

            .retail .myBagModule .itemBags .customPart .line:nth-child(2) {
                margin-top: -9px
            }

            .retail .myBagModule .itemBags .customPart {
                width: calc(100% - 108px)
            }

            .retail .related-items .heart {
                display: none
            }

            .layerPop {
                width: 100vw
            }

            .layerPop .popup {
                display: inline-block;
                height: auto
            }

            .customDropDown.open .drop_options {
                height: 222px;
                bottom: 1px
            }

            .offerslist {
                margin-top: -3px;
                height: 99px !important
            }

            .checkoutID .offerslist {
                height: 114px !important
            }

            .deskmenu .link.collections {
                margin-bottom: 100px
            }

            .column_cust.hide-product-options .line {
                width: 100% !important
            }

            .related-items {
                width: calc(100% + 20px);
                margin-bottom: 22px
            }

            .relationsinline .related-items {
                margin-bottom: -7px
            }

            .related-items .title {
                text-align: left;
                border-bottom: 0 !important;
                margin-bottom: 9px !important;
                text-align: center;
            }

            .retail .customizedID .picture .pinch-zoom {
                border: 0;
            }

            .customizedID .wrap form {
                position: relative;
                margin-top: 12px;
                width: calc(100%) !important
            }

            .market .customizedID .wrap form {
                width: calc(100%) !important
            }

            .related-items[data-group~="Colors"] .itemGrid,
            .related-items[data-group~="Color"] .itemGrid,
            .related-items[data-group~="colors"] .itemGrid,
            .related-items[data-group~="color"] .itemGrid {
                width: calc(51vw - 2px) !important
            }

            .relationsinline .related-items .itemsList .itemGrid.selected-product {
                height: 22px;
                box-sizing: border-box;
                margin-top: -3px
            }

            .relations {
                width: 100vw !important;
                display: block !important
            }

            .retail .wrapCustom {
                margin-top: 0;
                box-sizing: border-box
            }

            .retail .customizedID .cont {
                height: auto;
                padding-top: 13px;
                width: 100vw !important;
                min-height: unset !important
            }

            .retail .customizedID .picture {
                height: auto;
                background-color: #eee;
            }

            .retail .related-items .itemsList .itemGrid .picture {
                background-color: transparent
            }

            html.retail div#customizedModalID {
                padding-bottom: 50px !important
            }

            .meta .title,
            .meta .brand {
                text-align: center;
                width: 100%
            }

            .retail .meta .title,
            .retail .meta .brand {
                text-align: left
            }

            .retail .meta .brand {
                font-size: 12px;
                margin-bottom: 0;
                font-weight: bold;
                color: #333
            }

            .retail .meta .title {
                font-size: 20px;
                width: calc(100% - 46px);
                margin-bottom: 0;
                font-weight: 400;
                margin-top: 3px
            }

            .rtl.retail .meta .title {
                padding-right: 6px;
                font-weight: bold;
                color: #999;
                margin-top: -4px
            }

            .retail .userbar.icons {
                position: absolute;
                width: 30px !important;
                background: transparent !important;
                top: -6px !important;
                right: 40px !important
            }

            .retail .userbar.icons.has-waitinglist {
                width: 85px !important;
            }

            .retail .userpages .md-fav::before {
                color: var(--primary-color)
            }

            .menuontop .userpages .md-src::before {
                color: var(--primary-color)
            }

            .retail .userpages .md-wl::before {
                color: var(--primary-color)
            }

            .customizedID .picture .swiper-container {
                overflow: visible !important
            }

            .retail #wrapper {
                padding-top: 66px;
                margin-top: 0;
                box-sizing: border-box;
            }

            .aoffer: only-child {
                width: calc(100% - 14px);
                margin-left: 7px !important
            }

            .termsID {
                height: auto
            }

            .subcats ul.link.collections {
                display: none
            }

            .retail .customizedID .picture .swiper-container {
                border: 0;
                overflow: visible !important
            }

            .customizedID .swiper-zoom-container {
                overflow: visible !important
            }

            .customizedID .picture .swiper-container {
                width: 100vw
            }

            .customizedID .backg {
                transition: transform .3s linear 0s
            }

            .retail .pickordel .input {
                box-sizing: border-box;
                width: calc(50% - 2px) !important;
                height: 73px !important;
                padding-top: 24px !important
            }

            .retail .oldprice {
                position: absolute;
                z-index: 1;
                color: #fff;
                mix-blend-mode: difference;
                opacity: .5;
                left: 18px
            }

            .meta .oldprice {
                top: -112px;
                right: 3px;
                z-index: 2;
                left: auto !important
            }

            .meta .price {
                position: absolute;
                top: -75px;
                left: 20px
            }

            .retail .meta .price {
                padding-left: 9px !important;
            }

            .retail .meta .discountpercent {
                position: absolute;
                top: -76px;
                z-index: 3;
                right: 21px
            }

            .retail .wrapCustom .description {
                text-align: left;
                margin-top: -4px;
                margin-bottom: 42px;
                padding-top: 7px !important
            }

            .rtl.retail .wrapCustom .description {
                direction: rtl;
                text-align: right
            }

            .retail .wrap-c {
                position: relative;
                display: inline-block;
                width: 100vw !important
            }

            .retail #customizedModalID .addToFav {
                margin-left: 0;
                margin-top: 0;
                top: 5px !important;
                right: 20px !important
            }

            .rtl.retail #customizedModalID .addToFav {
                left: 16px !important;
                top: 0 !important
            }

            .retail .homePid .flmenubtn.retailonly {
                transform: translate(0px)
            }

            .retail .homePid .flmenubtn.retailonly .activecat {
                transform: translateY(100px)
            }

            .retail .flmenubtn.retailonly .filter {
                background-color: var(--primary-color);
                transition: all .6s ease 0s
            }

            .retail .homePid.s-active .flmenubtn.retailonly .filter {
                background-color: #fff
            }

            .retail .homePid.s-active .flmenubtn.retailonly .zmdi {
                color: var(--primary-color)
            }

            .retail .flmenubtn.retailonly .zmdi {
                color: #fff
            }

            .retail .s-active .flmenubtn.retailonly .zmdi {
                color: var(--primary-color)
            }

            .meta.retailonly {
                position: relative;
                padding-left: 25px;
                padding-right: 17px;
                padding-bottom: 16px;
                z-index: 1;
                transform: translate3d(0px, 0px, 1px);
                transition: all .2s linear 0s
            }

            .pinching .meta.retailonly {
                opacity: 0;
                transform: scale(2)
            }

            .retail .customizedID .genBtn.retailonly {
                display: none
            }

            .retail .customizedID {
                min-width: unset
            }

            .retail .customizedID .head {
                height: auto !important
            }

            .retail.large-menu-img .itemsList .itemGrid .descBlock .title {
                font-family: textfont;
                display: contents;
                padding-bottom: 0 !important
            }

            .retail.large-menu-img .homePid .itemsList .itemGrid .descBlock .title {
                font-size: 13px
            }

            .userbar.icons.retailonly .menuList {
                display: none !important
            }

            .retail .homeFilter.ontop {
                background-color: #fff;
                height: 46px;
                display: none !important
            }
        }

        .retail .menuMob .zmdi {
            color: var(--primary-color)
        }

        .retail .homePid .categories ul>li a.picture {
            border-radius: 100%;
            height: 98px;
            border: 1px solid #eee;
            box-shadow: rgba(0, 0, 0, 0.12) 1px 5px 8px
        }

        .retail .homePid .categories ul>li {
            box-shadow: none;
            background-color: transparent;
            margin-left: 8px;
            margin-right: 8px;
            width: 98px !important
        }

        .retail .homePid .categories ul>li img {
            width: 200%;
            margin-top: 12px
        }

        .retail .categories {
            min-height: 100px
        }

        .retail .itemBag .hide-product-options .drp-quantity-container::before {
            margin-left: -14px !important
        }

        .retail .myBagModule .itemBags .customPart .drp-quantity-container select {
            cursor: pointer;
            border: 0 solid #fff;
            font-size: 15px;
            appearance: none;
            font-family: inherit;
            padding-top: 0;
            background: #fff;
            color: #333;
            pointer-events: none
        }

        .retail .myBagModule .itemBags .customPart .drp-quantity-container {
            cursor: pointer
        }

        .rtl.retail .myBagModule .itemBags .customPart .drp-quantity-container {
            text-align: right;
            padding-right: 19px
        }

        .retail .myBagModule .itemBags .customPart .drp-quantity-container::before {
            content: "x";
            color: #333;
            font-size: 13px;
            font-weight: 400;
            margin-left: 18px
        }

        #offerId .offer .picture img {
            width: 100%;
            margin-bottom: -6px
        }

        #offerId .offer .picture {
            box-shadow: rgba(0, 0, 0, 0.1) 0 16px 15px;
            border-radius: 9px;
            overflow: hidden;
            position: relative;
            max-width: 375px;
            margin: auto
        }

        #offerId .cont {
            margin-bottom: 80px;
            background-color: #fff;
            padding: 25px 25px 35px;
            border-radius: 7px
        }

        #offerId .offer {
            text-align: center
        }

        #offerId .offer .title {
            padding: 19px;
            font-size: 18px;
            font-family: textfont;
            font-weight: bold
        }

        #offerId .offer .desc {
            margin-top: 38px;
            margin-bottom: 27px;
            font-size: 16px;
            color: #333;
            line-height: 24px;
            padding: 3px;
            overflow: hidden
        }

        #offerId .offer .genBtn {
            margin: auto;
            min-width: 150px;
            height: 50px;
            font-size: 23px;
            font-family: titlefont;
            white-space: nowrap;
            padding-left: 22px;
            padding-right: 22px;
            box-sizing: content-box
        }

        .auto-apply .offer .genBtn {
            display: none
        }

        #offerId .offer .genBtn.loading {
            opacity: .3;
            animation: .9s ease-in-out 0s infinite normal none running fadeOut
        }

        #offerId .offer .genBtn.claimed {
            opacity: .2
        }

        #offerId .offer .terms {
            margin-top: 12px;
            margin-bottom: 32px;
            font-size: 13px;
            color: #666;
            line-height: 24px;
            overflow: hidden
        }

        #offerId .offer .termstitle {
            margin-top: 32px;
            overflow: hidden;
            display: none
        }

        #offerId .offer .howitworks {
            border-bottom: 1px solid;
            display: inline-block;
            width: auto;
            color: var(--primary-color);
            cursor: pointer;
            overflow: hidden
        }

        .offers-wrap .offer {
            width: calc(50% - 11px);
            display: inline-block;
            margin-bottom: 22px;
            box-shadow: rgba(0, 0, 0, 0.04) 0 7px 10px, rgba(0, 0, 0, 0.04) 0 0 6px;
            margin-left: 3px;
            margin-right: 6px;
            position: relative;
            border: 1px dashed #ccc;
            border-radius: 6px;
            cursor: pointer;
            vertical-align: bottom
        }

        .offers-wrap .offer.in-store-coupon-item {
            display: none
        }

        .offers-wrap .offer: hover {
            opacity: .9
        }

        .offers-wrap .offer .claimed {
            position: absolute;
            width: 100%;
            height: 100%;
            left: 0;
            background-color: rgba(255, 255, 255, 0.68);
            z-index: 1;
            top: 0;
            display: flex;
            align-items: center;
            pointer-events: none
        }

        .offers-wrap .offer .claimed span {
            background-color: var(--secondary-color);
            padding: 6px 10px;
            border-radius: 7px;
            color: #fff;
            font-weight: bold;
            opacity: .8;
            top: 11px;
            position: absolute;
            right: 12px
        }

        .offers-wrap .offer .claimed span::before {
            content: "\F26B";
            font: 14px / 1 Material-Design-Iconic-Font;
            margin-right: 9px
        }

        .offers-wrap .offer .picture {
            width: 100%
        }

        .offers-wrap .offer .title {
            padding: 10px;
            color: #333;
            font-weight: bold;
            min-height: 43px;
            margin-top: -4px;
            border-top: 1px dashed #ddd;
            text-align: center;
            align-items: center;
            display: flex;
            place-content: center
        }

        .offers-wrap .offer .picture img {
            width: 100%;
            text-align: left
        }

        .offers-wrap {
            padding: 5px;
            margin: 14px auto auto;
            text-align: center
        }

        .aoffer {
            width: calc(100% - 41px);
            border: 1px dashed #ddd;
            margin: 5px -3px auto 9px;
            overflow: hidden;
            box-sizing: border-box;
            position: relative;
            display: inline-block;
            opacity: .9;
            cursor: pointer
        }

        .aoffer .inner-aoffer {
            padding: 10px;
            position: relative;
            display: block;
            min-height: 62px;
            background-color: #fff;
            text-align: left
        }

        .checkoutID .auto-apply .inner-aoffer,
        .checkoutID .auto-apply .aoffer {
            min-height: 0;
            background: #fff
        }

        .checkoutID .auto-apply {
            height: auto !important
        }

        .aoffer.on {
            box-shadow: rgba(0, 0, 0, 0.07) 0 2px 10px, rgba(0, 0, 0, 0.1) 0 0 2px;
            opacity: 1;
            border-color: var(--primary-color)
        }

        .aoffer: last-child {
            margin-right: 22px
        }

        .aoffer: last-child:first-child {
            margin-right: 0
        }

        .aoffer: first-child {
            margin-left: 0
        }

        .checkoutID .aoffer: only-child {
            width: 100%;
            border-radius: 6px;
            position: relative;
            display: block;
            margin-left: 0 !important
        }

        .aoffer .zmdi {
            position: absolute;
            top: 4px;
            right: 7px;
            font-size: 27px;
            color: var(--primary-color);
            display: none
        }

        .auto-apply .aoffer .zmdi {
            display: none !important
        }

        .auto-apply .aoffer .subject {
            display: none !important
        }

        .aoffer.on .zmdi {
            display: block
        }

        .auto-apply.aoffer.on .zmdi {
            display: none
        }

        .aoffer img {
            height: 62px;
            width: auto;
            border-radius: 5px;
            float: left;
            margin-right: 13px;
            margin-bottom: 9px
        }

        .aoffer.on .subject,
        .auto-apply .subject {
            color: var(--primary-color);
            font-weight: bold;
            padding-top: 0;
            padding-right: 0;
            padding-bottom: 0;
            margin: 0;
            text-transform: capitalize;
            border: 0 !important;
            padding-left: 0 !important
        }

        .aoffer img:not([src]) {
            width: 0;
            margin-right: 4px;
            height: 44px
        }

        .enabled img:not([src]) {
            width: 23px;
            visibility: hidden
        }

        .checkoutID .aoffer img:not([src]) {
            height: 26px
        }

        .aoffer .title {
            margin-top: 2px;
            color: #666;
            white-space: normal;
            font-size: 15px
        }

        .offerslist {
            width: 100%;
            white-space: nowrap;
            overflow: auto hidden;
            height: 120px;
            position: relative;
            top: auto;
            left: auto
        }

        .checkoutID .auto-apply .aoffer {
            cursor: default
        }

        .checkoutID .aoffer.enabled {
            border: 1px solid #71a368
        }

        .checkoutID .aoffer.enabled::before {
            content: "\F269";
            font-family: Material-Design-Iconic-Font;
            color: #71a368;
            position: absolute;
            z-index: 2;
            font-size: 21px;
            left: 10px;
            top: 11px;
            animation: .6s linear 0s 1 normal forwards running fadeInUp
        }

        .isSearching .offerslist {
            display: none
        }

        .aoffer .subject {
            color: var(--primary-color);
            border: 1px dashed var(--primary-color);
            display: inline-block;
            padding-left: 7px;
            padding-right: 9px;
            border-radius: 3px;
            margin-bottom: 2px;
            line-height: 22px
        }

        .retail .aoffer .subject {
            float: right;
            margin-left: 9px
        }

        .retail .aoffer.on .subject {
            float: none;
            margin-left: 0
        }

        .retail .d-w {
            min-height: 58px;
            display: block;
            float: left;
            text-align: left
        }

        @media(min-width:769px) {
            .retail .flmenubtn.retailonly {
                display: none !important
            }

            .logoontop .homeFilter.ontop {
                left: 27px;
                transform: translateX(0px);
                background: transparent;
                top: 60px
            }

            .menuontop .deskmenu li a {
                text-transform: uppercase;
                margin-left: 20px;
                margin-right: 20px;
                font-size: 15px !important
            }

            .menuontop .deskmenu li a span {
                font-size: 14px !important
            }

            .menuontop .deskmenu .menu li ul li {
                margin-top: -8px !important
            }

            .menuontop .deskmenu .menu li ul li: last-child {
                margin-bottom: 6px
            }

            .menuontop .deskmenu .menu li ul li span {
                color: #777 !important
            }

            .menuontop .deskmenu .menu li ul li: first-child {
                margin-top: -17px !important
            }

            .menuontop a.whatsapp-r {
                position: absolute;
                width: max-content;
                background-color: #fff;
                top: 11px;
                right: -14px;
                z-index: 2;
                min-width: 220px;
                text-align: right
            }

            .menuontop .deskmenu .menu li.colle a span {
                text-transform: capitalize
            }

            .logoontop .homeFilter .filter input {
                padding-left: 38px !important
            }

            .menuontop .homeFilter .filter input {
                color: #333;
                font-size: 19px;
                padding-left: 23px !important
            }

            .logoontop .deskmenu {
                margin-top: 80px;
                height: calc(100vh - 151px)
            }

            .menuontop .deskmenu {
                height: 41px;
                z-index: 3
            }

            .menuontop .deskmenu .menu {
                background-color: #fff;
                margin-top: 60px;
                min-width: 900px;
                padding: 51px;
                transform: translateY(100px);
                opacity: 0;
                transition: all .2s linear 0s;
                box-shadow: rgba(0, 0, 0, 0.16) 0 0 14px -1px;
                height: fit-content;
                max-width: 900px;
                z-index: 1
            }

            .menuontop .topmenuopen .deskmenu .menu {
                transform: translateY(0px);
                opacity: 1;
                transition: all .3s ease-in-out 0s
            }

            .menuontop .topmenuopen .deskmenu .menu: hover {
                transform: translateY(0px);
                opacity: 1;
                transition: all .3s ease-in-out 0s
            }

            .logoontop .deskmenu .menu::before {
                position: absolute;
                top: -68px;
                width: 100%;
                background-color: red;
                height: 70px;
                left: 50%;
                transform: translateX(-50%)
            }

            .menuontop .deskmenu .link {
                margin: auto auto auto 0;
                display: inline-block;
                text-align: left;
                column-count: 3;
                position: relative;
                width: 100%
            }

            .menuontop .deskmenu .link.collections {
                margin-top: 72px;
                background-color: #f2f2f2
            }

            .menuontop .deskmenu {
                position: fixed;
                width: 100%;
                background-color: #fff;
                text-align: center;
                top: 71px;
                height: 50px;
                border-bottom: 1px solid #ddd;
                transition: all .2s linear 0s;
                z-index: 12;
                margin-top: 0;
                margin-bottom: 0
            }

            .menuontop .deskmenu .pages li {
                display: inline-block;
                text-transform: uppercase;
                font-weight: normal;
                font-size: 15px;
                height: 100%;
                line-height: 50px;
                margin-top: 0 !important
            }

            .topmenuopen .menuontop .deskmenu {
                pointer-events: none
            }

            .topmenuopen .shopmenu::after {
                height: 100%;
                width: 100% !important
            }

            .menuontop .hot-line {
                border-bottom: 0;
                color: var(--primary-color);
                margin-right: 0;
                display: block;
                margin-top: -11px !important
            }

            .menuontop .bot .hot-line {
                display: none !important
            }

            .menuontop .searchopen .deskmenu {
                top: 126px;
                transition: all .2s linear 0s
            }

            li.shopmenu {
                padding-left: 20px;
                padding-right: 20px;
                position: relative
            }

            li.shopmenu::after {
                position: absolute;
                content: "";
                width: 100%;
                height: 100px;
                left: 0;
                top: 0
            }
        }

        .market .d-w {
            display: inline-block;
            width: 100%;
            /* min-height: 80px; */
            padding-bottom: 15px;
        }

        .market .d-w .brand {
            margin-left: -5px;
            font-size: 13px !important;
            color: #666 !important;
            font-weight: normal !important
        }

        @media(max-width:1550px) {

            .loginor {
                display: none;
            }

            .right.rBox .loginor {
                display:
                    block !important;
                margin-top: -43px !important;
                padding-bottom: 26px;
            }

            .reviewBox .rBox,
            .reviewBox .rBox.left {
                width: 100% !important;
                margin-top: -4px;
            }

            .orderdetails .reviewBox .rBox.left {
                padding-top: 14px;
                margin-top: -35px !important
            }

            .rtl .reviewBox .rBox.left {
                margin-right: -14px
            }

            .retail .formPart .lines {
                column-count: 1
            }
        }



        .checkoutID .allCoupons .aoffer {
            display: inline-block;
            width: 100%;
            margin: auto !important
        }

        .column_cust.hide-product-options .bTitle {
            display: none !important
        }

        .column_cust.hide-product-options .check {
            display: none !important
        }

        .column_cust.hide-product-options .label {
            display: none !important
        }

        .column_cust.hide-product-options .line: last-child {
            border-bottom: 0 !important
        }

        .column_cust.hide-product-options .line {
            width: calc(200%+8px)
        }

        .column_cust.hide-product-options .price {
            width: 100% !important
        }

        .column_cust.hide-product-options .price .tinyselect.no-price {
            border-color: #fff;
            background: #fff;
            width: 100% !important
        }

        .column_cust.hide-product-options .price .tinyselect.no-price.lastitem::before {
            background-color: #fff;
            right: auto;
            transform: translateX(-50%);
            color: #333 !important;
            top: 1px !important;
            left: 50% !important
        }

        .retail .column_cust.hide-product-options .price .tinyselect.no-price.lastitem {
            display: none
        }

        .retail .column_cust.hide-product-options .price.price-lastitem::after {
            content: attr(data-last-item);
            margin-top: -4px;
            margin-bottom: 4px
        }

        .column_cust.hide-product-options .price .tinyselect::before {
            color: #333
        }

        .column_cust.hide-product-options .price .tinyselect::before {
            top: -1px
        }

        .column_cust.hide-product-options .price .tinyselect.no-price select {
            color: #333;
            background: #fff;
            font-size: 19px;
            font-weight: 400;
            width: 100% !important;
            padding-left: 50% !important;
            text-align: left;
        }

        .itemBag .hide-product-options .type {
            visibility: hidden
        }

        .itemBag .hide-product-options .name {
            visibility: hidden
        }

        .retail .myBagModule .itemBags .icons {
            left: 2px
        }

        .product-sold-out:not(.hasWaitingList) .column_cust {
            display: none !important
        }

        .product-sold-out .sold-out-btn {
            background: transparent !important;
            color: #999 !important;
            border: 1px solid #ccc !important;
            cursor: default !important
        }

        .formPart .line.sold-out {
            pointer-events: none !important
        }

        .formPart .line.sold-out .price {
            display: none !important
        }

        .formPart .line .sold-out-item {
            display: none
        }

        .classicproduct .formPart .line .sold-out-item {
            display: none !important
        }

        .formPart .line.sold-out .sold-out-item .label {
            color: #999
        }

        .formPart .line.sold-out .sold-out-item .check .zmdi::before {
            color: #ccc
        }

        .formPart .line.sold-out .sold-out-item {
            display: block;
            position: relative;
            float: right;
            font-size: 14px;
            margin-top: -16px;
            color: #999
        }

        .market .formPart .line.sold-out .sold-out-item {
            margin-top: 3px;
            font-size: 12px;
            margin-right: 29px;
        }

        li.retailonly.hotl {
            position: relative;
            color: var(--primary-color);
            height: auto
        }

        li.retailonly.hotl label::after {
            display: none
        }

        li.retailonly.hotl .whatsapp-r {
            margin-left: -38px;
            color: #56a61e;
            margin-top: -14px;
            font-weight: bold;
            display: none
        }

        .whatsapp li.retailonly.hotl .whatsapp-r {
            display: block
        }

        li.retailonly.hotl .whatsapp-r::before {
            content: "\F405";
            padding-left: 13px;
            font: 21px / 1 Material-Design-Iconic-Font;
            color: #56a61e;
            margin-right: 7px
        }

        li.retailonly.hotl::after {
            font: 16px / 1 Material-Design-Iconic-Font;
            content: "\F2BE";
            position: absolute;
            left: -22px;
            top: 8px
        }

        .rtl li.retailonly.hotl::after {
            left: auto;
            right: -17px
        }

        .home-collection.layout2 .gITems ul {
            white-space: normal
        }

        .home-collection.layout3 .gITems ul {
            white-space: normal
        }

        .home-collection.layout3 .gITems ul {
            display: flex;
            margin-left: -1px;
            justify-content: center;
            min-width: calc(100% - 14px) !important
        }

        .layout3 .itemGrid {
            width: calc(25% - 11px) !important
        }

        .layout3 .itemGrid {
            min-width: calc(25% - 12px);
            margin-left: 15px;
            width: 100% !important
        }

        .layout3 .itemGrid: first-child {
            margin-left: 0
        }

        .homePid .home-collection.layout3.ng-scope .gITems .itemGrid: last-child {
            margin-right: 0 !important
        }

        div#wrapperb .contentb {
            display: inline-block;
            width: 100%
        }

        .userbar.icons {
            transform: translateY(-150%);
            transition: all .2s cubic-bezier(0, 0, 0.65, 1.32) 0s
        }

        .showBag .userbar.icons {
            transition: all .2s cubic-bezier(0, 0, 0.65, 1.32) 0s;
            transform: translateY(0%)
        }

        .relations {
            background-color: #f7f7f7;
            display: block;
            margin-top: -4px;
            padding: 20px;
            box-sizing: border-box;
            width: 100%;
            transform: translateY(0px);
            transition: all .4s cubic-bezier(0.46, 0.03, 0.52, 0.96) 0s;
            min-height: 400px
        }

        .relations.ready {
            transform: translateY(0px);
            transition: all .4s cubic-bezier(0.46, 0.03, 0.52, 0.96) 0s;
            min-height: 400px;
        }

        .retail .itemsList .itemGrid {
            width: calc(25% - 14px);
            box-shadow: none
        }

        .retail .related-items .itemsList .itemGrid {
            width: calc(25% - 14px);
            box-shadow: none
        }

        .retail .related-items .itemsList .itemGrid .heart .zmdi {
            bottom: 9px
        }

        .relationsinline .related-items .itemsList .itemGrid {
            width: 54px !important;
            max-width: 54px;
            min-width: auto !important;
        }

        .related-items .itemsList .itemGrid.selected-product {
            display: none
        }

        .relationsinline .related-items .itemsList .itemGrid.selected-product {
            border: 3px solid #000;
            display: inline-flex
        }

        .retail .related-items .heart {
            position: absolute;
            top: 26px;
            z-index: 1
        }

        .relationsinline .heart {
            display: none
        }

        .retail .related-items .descBlock {
            padding-top: 0;
            padding-bottom: 0;
            float: none;
        }

        .retail .related-items .itemsList .itemGrid .picture {
            float: left;
            width: 100%;
            text-align: left;
            position: relative;
            margin: 0;
            height: 100%;
            box-sizing: border-box;
            padding-bottom: 0 !important
        }

        .retail .related-items .itemsList .itemGrid .wrap {
            padding: 0
        }

        .related-items .picture {
            top: 0 !important
        }

        .retail .related-items .itemsList .itemGrid .priceWrap .wrap {
            padding-left: 11px
        }

        .retail .related-items .itemsList .itemGrid .priceWrap .wrap .oldprice {
            padding-left: 6px;
            margin-right: 13px
        }

        .retail .related-items .itemsList .itemGrid .d-w {
            position: relative;
            padding: 0 10px 10px;
            min-height: 22px;
            margin-top: 17px
        }

        .related-items .title {
            margin-bottom: 21px;
            padding-bottom: 13px;
            text-transform: uppercase;
            font-size: 18px;
            min-height: unset !important
        }

        .relationsinline .related-items .title {
            font-size: 13px;
            margin-bottom: 1px;
            color: #999;
        }

        .rtl .related-items .title {
            direction: rtl;
            text-align: right;
            box-sizing: border-box;
            padding-right: 22px !important
        }

        .related-items[ data-group~="Colors"] .d-w,
        .related-items[data-group~="Color"] .d-w,
        .related-items[data-group~="Colors"] .priceWrap,
        .related-items[data-group~="Color"] .priceWrap .related-items[data-group~="colors"] .d-w,
        .related-items[data-group~="color"] .d-w,
        .related-items[data-group~="colors"] .priceWrap,
        .related-items[data-group~="color"] .priceWrap {
            display: none !important
        }

        .related-items[ data-group~="Colors"] .itemGrid,
        .related-items[data-group~="Color"] .itemGrid,
        .related-items[data-group~="colors"] .itemGrid,
        .related-items[data-group~="color"] .itemGrid {
            width: 160px
        }

        .related-items[ data-group~="Colors"] .itemGrid.not-available::before,
        .related-items[data-group~="Color"] .itemGrid.not-available::before,
        .related-items[data-group~="colors"] .itemGrid.not-available::before,
        .related-items[data-group~="color"] .itemGrid.not-available::before {
            box-shadow: none;
            width: 100%;
            height: 25px;
            border-radius: 0;
            bottom: 0;
            transform: none;
            left: 0;
            opacity: .6;
            font-size: 11px;
            text-transform: uppercase;
            line-height: 10px;
            font-weight: bold;
            top: auto;
            padding-top: 7px;
            background-color: #000;
            color: #fff;
            content: "out of stock" !important
        }

        .retail #customizedModalID .addToFav {
            background-color: transparent;
            position: absolute;
            top: 0;
            border: 0;
            right: 18px;
            transform: scale(1.2);
            z-index: 2;
            transition: all .5s ease 0s;
            width: 33px !important
        }

        .rtl.retail #customizedModalID .addToFav {
            left: -11px
        }

        .retail #customizedModalID .addToFav .txt {
            display: none
        }

        @media(max-width:1399px) {
            body {
                visibility: visible
            }

            .orders.normal .order {
                width: calc(50% - 23px)
            }

            .retail .itemsList .itemGrid {
                width: calc(33% - 11px)
            }



            .sumhead {
                text-align: center
            }

            .retail .newsCtrl .itemsList .itemGrid {
                width: calc(50% - 15px)
            }
        }

        @media(max-width:1550px) {
            .retail div#customizedModalID.show {
                transform: translate3d(-50%, 0px, 0px);
                top: 0
            }

            .delivery-date {
                padding-top: 9px
            }
        }



        .is-offer .customized {
            left: auto;
            right: 77px
        }

        .is-discounted .customized {
            left: 80px
        }

        .modal.disable-close .btnClose {
            display: none
        }

        .itemsList .itemGrid.not-available::before {
            content: attr(data-title) !important
        }

        .fullThankyou .transaction-number-note {
            display: none;
            color: #555;
            font-size: 14px;
            text-align: center
        }

        .fullThankyou .transaction-receipt-note {
            display: none;
            margin-top: 24px;
            color: #676767;
            font-size: 16px;
            text-align: center;
            max-width: 617px;
            margin-left: auto;
            margin-right: auto;
            font-weight: normal;
            line-height: 26px;
            padding: 22px
        }

        .wrap-c {
            display: flex
        }

        .fnb .wrap-c {}

        .market .wrap-c {
            background-color: #fafafa
        }

        .subTotalBox {
            padding-bottom: 0;
            margin-bottom: 0
        }

        .subTotalBox .totalPrice {
            position: relative
        }

        .loggedin .totalPrice[ data-text="Total"] {
            padding-bottom: 36px;
        }

        .totalPrice.has-seccond-currency {
            padding-bottom: 0 !important
        }

        .rtl .subTotalBox .totalPrice {
            direction: rtl;
            text-align: left;
        }

        .subTotalBox .totalPrice.secondcurr {
            padding-top: 10px
        }

        .subTotalBox .totalPrice.has-seccond-currency::after {
            display: none
        }

        .transaction-number-note[ content="receipt.transactionnumbernote"] {
            display: none !important
        }

        .transaction-receipt-note[ content="receipt.transactionreceiptnote"] {
            display: none !important
        }

        .sm-pages .text {
            color: #666 !important;
            font-size: 14px !important;
            font-family: textfont !important
        }

        .sm-pages:nth-child(1) {
            border-top: 0 solid #ddd !important
        }

        .sm-pages {
            margin-top: 19px;
            padding-top: 12px
        }

        html.disable-ui {
            overflow: hidden
        }

        html.disable-ui::before {
            content: " ";
            position: absolute;
            width: 100%;
            height: 100vh;
            z-index: 1000000;
            background-color: rgba(0, 0, 0, 0.32)
        }

        html.disable-ui::after {
            content: "";
            position: absolute;
            width: 32px;
            height: 32px;
            border-width: 3px;
            border-style: solid;
            border-color: rgba(0, 0, 0, 0.58) rgba(224, 224, 224, 0.69) rgba(0, 0, 0, 0.58) rgba(0, 0, 0, 0.58);
            border-image: initial;
            border-radius: 100%;
            animation-name: rotate;
            animation-duration: .4s;
            animation-iteration-count: infinite;
            animation-timing-function: linear;
            transition: all .2s linear 0s;
            margin-left: -15px;
            left: 50%;
            top: 50%;
            margin-top: -15px
        }

        .tinyselect .fieldMinus {
            position: absolute;
            width: 50px;
            height: 40px;
            left: -6px;
            top: -10px;
            line-height: 40px;
            text-align: center;
            font-size: 35px;
            z-index: 2;
            background-color: #fff;
            transform: translate3d(0px, 0px, 1px);
            cursor: pointer
        }

        .tinyselect .fieldPlus {
            position: absolute;
            width: 50px;
            height: 40px;
            right: -3px;
            top: -10px;
            line-height: 40px;
            text-align: center;
            font-size: 25px;
            z-index: 2;
            background-color: #fff;
            transform: translate3d(0px, 0px, 1px);
            cursor: pointer
        }

        .tinyselect .fieldPlus: hover,
        .tinyselect .fieldMinus:hover {
            color: var(--primary-color)
        }

        .noOrder .customizedID .cont {
            display: none
        }

        .noOrder .customizedID .genBtn {
            display: none
        }

        .gm-style div:first-child div:first-child div:last-child {
            z-index: 11 !important
        }

        @media(max-width:768px) {
            .editAddAddress .parts {
                padding-top: 30px !important
            }

            .customizedID .cont .data {
                display: none !Important;
                padding-top: 50px;
            }
        }

        .editAddAddress .googleMap img {
            width: 100%;
            height: auto;
            top: 50%;
            transform: translateY(-50%);
            position: absolute;
        }

        @media(max-width: 1023px) and (min-width: 768px) {
            body {
                visibility: visible;
                zoom: 0.8;
                -webkit-text-size-adjust: none;
            }

            .reachPID {
                width: calc(100% - 317px);
            }

            .fnb .swiper-slide.pinch-zoom-parent {}

            .fnb .customizedID .backg {
                width: 100% !important;
                height: auto !important;
            }

            .content,
            .contentb {
                min-height: calc(100vh - 153px) !important;
            }

            .menuontop .categoryPid .content {
                max-width: 809px;
            }

            .aoffer: last-child:first-child {
                width: calc(100% - 29px) !important;
                max-width: initial;
                margin-left: 14px !important;
            }

            .giftcards .gc-top-part .gc-list-wrapper .gc-list-item {
                width: calc(33% - 22px) !important
            }

            .giftcards .gc-bottom-part .gc-button {
                max-width: none !important
            }

            .giftcards .gc-bottom-part .gc-mobile-wrapper,
            .giftcards .gc-bottom-part .gc-email-wrapper {
                max-width: none !Important
            }

            .userpages li {
                margin-right: 18px
            }

            .deskmenu {
                height: auto
            }

            .menuontop .deskmenu .tabled .menu .link {
                min-width: auto !Important;
                column-count: 2;
            }

            .menuontop .deskmenu .tabled {
                width: calc(100vw - 23px);
            }

            .retail .hot-line {
                font-size: 13px;
                right: -14px;
            }

            .retail .hot-line: after {
                display: none;
            }

            .menuontop .topmenuopen .tabled .menu {
                min-width: 800px;
            }

            .aoffer {
                max-width: 320px
            }

            .header-loyalty-value {
                margin-right: 22px
            }

            a.callUsNb.hot-line {
                top: 6px;
                margin-right: 14px;
                overflow: hidden;
                width: 50px;
                padding-right: 0 !important
            }

            div#offerId {
                max-width: 585px
            }

            div#offerId .cont {
                min-height: unset;
                border-radius: 8px !important
            }

            .fnb .categoryPid.subPage .content {
                padding-top: 5px
            }

            .editAddAddress .parts {
                border-radius: 8px
            }

            .editAddAddress .part {
                display: inline-block;
                width: 50% !important
            }

            .editAddAddress .left.part {
                margin-right: 10px;
                width: calc(50% - 10px) !important
            }

            .loginRegisterID .parts {
                border-radius: 8px;
                min-height: auto !important
            }

            div#createAccountModalID .parts {
                border-radius: 8px;
                min-height: auto !important
            }

            .noOrder .langswitcher {
                right: 25px;
                margin-top: 15px;
                position: fixed
            }

            .noOrder .bigPrice.overbtn.show {
                display: none !important
            }

            .customizedID .picture .swiper-container {
                /* max-width: 600px!important */
            }

            div#customizedModalID {
                max-width: calc(100% - 20px);
            }

            .noCustomization#customizedModalID .head,
            .noCustomization#customizedModalID .cont,
            .noCustomization#customizedModalID .genBtn {
                width: 100% !important;
            }

            .market .content .itemsList .genBtn.customize {
                margin-top: -213px
            }

            .homePid .categories ul>li a.picture {
                height: 83px;
                width: 100%
            }

            .homePid .categories ul>li {
                width: 23% !important
            }

            .market .content li.itemGrid {
                margin-bottom: 23px;
                /* width: calc(25vw - 5px) !important; */
                margin-left: 2px !important;
                margin-right: 0 !important
            }

            .market .home-collection .itemsList .itemGrid {
                /* width: calc(33% - 5px) !important; */
            }

            .multibranch .homeFilter.ontop {
                min-width: 409px !Important;
            }

            .mobileMenuWrap {
                width: 0
            }

            .holder.ssm-nav-visible {
                width: 300px !important
            }

            .is-navOpen .mobileMenuWrap {
                width: 300px
            }

            div#loginRegisterModalID,
            div#createAccountModalID {
                max-width: 375px;
                margin: auto !important;
                min-height: auto !important;
                border-radius: 8px !important
            }

            .modal.show {
                top: 50%;
                transform: translate3d(-50%, -50%, 0px)
            }

            div#AddAddressModalID {
                border-radius: 8px;
                overflow: hidden
            }

            #customizedModalID .addToFav {
                width: 100%;
                margin-top: 2px
            }

            .customizedID .head {
                width: 100%
            }

            #customizedModalID .addToFav {
                width: 50%;
                margin-top: 2px
            }

            .customizedID .head {
                width: 50%;
            }

            .fnb .customizedID .cont {
                width: 50%;
                height: 734px !important;
            }

            .customizedID .genBtn {
                height: 55px;
                width: 50% !important;
            }

            .customizedID .genBtn::before {
                content: attr(data-nbofcalories);
                position: fixed;
                left: 22px;
                font-weight: 700;
                opacity: 1;
                color: #000;
                height: 58px;
                line-height: 59px;
                font-size: 13px;
                z-index: 3;
                letter-spacing: 0
            }

            .customizedID {
                max-width: none
            }

            .modal.noCustomization {
                max-width: unset !important
            }

            .homePid .categories ul>li img {
                height: 160%;
                width: auto
            }

            .mobileMenuWrap .holder {
                width: 300px
            }
        }

        .box.mobileEdit {
            min-height: 199px !important
        }

        .box.mobileEdit .genBtn {
            bottom: -15px !important;
            font-size: 13px !important;
            top: auto !important
        }

        .disable-mobile-verification .inputWrap.verifymobilewrap {
            border: 0;
            padding-bottom: 0;
            background: 0 center;
            margin-bottom: 16px;
        }

        .disable-mobile-verification .verify-mobile-caption {
            display: none
        }

        .disable-mobile-verification .iti {
            background: #f7f7f7;
            width: 100%;
            padding-left: 6px;
        }

        .rtl .disable-mobile-verification .iti {
            padding-left: 0px;
            padding-right: 6px;
        }

        .signupform .disable-mobile-verification .iti {
            margin-left: 0;
            background: #fff
        }

        .disable-mobile-verification .iti .missing {
            right: 16px;
            margin-right: 0px !Important;
        }

        .verifymobilewrap .input {
            z-index: 3;
            border-bottom: 0;
            padding-left: 14px;
        }

        .rtl .verifymobilewrap .input {
            padding-left: 0px;
            padding-right: 14px;
        }

        .signupform.smssent .verifymobilewrap .input {
            margin-top: 4px !important
        }

        .order-detailspickup-button-container {
            display: flex;
            justify-content: center
        }

        .order-detailspickup-button {
            margin-top: 25px;
            width: auto;
            padding-left: 15px;
            padding-right: 15px;
            height: 52px;
            line-height: 52px
        }

        .pickup-identifier-container {
            padding-left: 17px;
            padding-right: 89px;
            position: relative;
            display: block;
            width: calc(100% - 40px) !important
        }

        .catinmenu.lineLink li {
            list-style: none;
            height: 35px
        }

        .catinmenu.lineLink li.selected span {
            color: var(--primary-color)
        }

        .catinmenu.lineLink li.colls a {
            color: var(--secondary-color)
        }

        .catinmenu.lineLink li a {
            text-decoration: none;
            display: block
        }

        .catinmenu.lineLink li:last-child a span {
            font-size: 14px !important
        }

        .lineLink.catinmenu {
            display: none;
            padding-bottom: 22px
        }

        .showmobilecategories .catinmenu {
            display: none
        }

        .showmobilecategories .catinmenu {
            display: table
        }

        .showmobilecategories .menum {
            display: none
        }

        /* .pickup-identifier-container {
    display: none
}

.show-pickup-identifiers .pickup-identifier-container {
    display: block
} */

        @media(max-width:768px) {
            .retail .oldprice {
                position: absolute;
                z-index: 1;
                color: #333;
                mix-blend-mode: difference;
                opacity: .5;
                right: 1px !important;
                left: auto !important
            }

            .retail .priceWrap .oldprice {
                opacity: 1;
                padding-right: 33px;
                color: #999 !important;
                mix-blend-mode: unset !important
            }

            .retail.has-retail-quick-add .priceWrap .oldprice {
                right: auto !important;
                left: 6px !important
            }
        }

        .offers-category-wrap .offer-category {
            width: calc(50% - 11px);
            display: none;
            margin-bottom: 22px;
            box-shadow: rgba(0, 0, 0, 0.09) 0 7px 10px, rgba(0, 0, 0, 0.09) 0 0 6px;
            margin-left: 3px;
            margin-right: 6px;
            position: relative;
            border-radius: 6px;
            cursor: pointer;
            vertical-align: top;
            min-width: 310px
        }

        .offers-category-wrap .offer-category: hover {
            opacity: .9
        }

        .offers-category-wrap .offer-category .picture {
            width: 100%
        }

        .offers-category-wrap .offer-category .title {
            padding: 10px;
            color: #333;
            font-weight: bold;
            min-height: 43px;
            margin-top: -4px;
            text-align: center;
            align-items: center;
            display: flex;
            place-content: center
        }

        .offers-category-wrap .offer-category .picture img {
            width: 100%;
            text-align: left
        }

        .offers-category-wrap {
            padding: 5px;
            margin: 24px auto auto;
            text-align: center
        }

        @media(max-width:768px) {
            .retail .oldprice {
                justify-content: center
            }
        }

        .countdown-container {
            margin-top: 26px
        }

        .countdown-container .barCode {
            display: none
        }

        .countdown-container .date {
            font-size: 24px;
            font-weight: bold;
            margin-bottom: 25px;
            text-transform: uppercase
        }

        .countdown-container .countdown {
            font-size: 80px;
            font-family: titlefont;
            margin-bottom: 22px
        }

        .online-vouchers-title,
        .in-store-coupons-title {
            font-family: titlefont;
            color: var(--secondary-color);
            position: relative;
            font-size: 22px;
            line-height: 35px;
            text-align: center;
            padding-left: 7px;
            width: calc(100% - 19px);
            margin: -32px auto 23px;
            font-weight: normal !important
        }

        .in-store-coupons-title {
            display: none
        }

        .in-store-coupons-page .online-vouchers-title {
            display: none
        }

        .online-vouchers-page .in-store-coupons-title {
            display: none
        }

        .delivery-address-note {
            position: relative;
            display: block;
            margin-bottom: 10px;
            margin-top: 81px;
            font-size: 15px;
        }

        .rtl .delivery-address-note {
            direction: rtl
        }

        .delivery-address-note .address-edit {
            float: right;
            margin-right: 4px;
            cursor: pointer;
            text-decoration: none;
            border-bottom: 1px dotted #666
        }

        .rtl .delivery-address-note .address-edit {
            float: left
        }

        .offerclose {
            font-family: titlefont;
            color: var(--primary-color);
            width: 33px;
            height: 33px;
            text-align: center;
            border-radius: 20px;
            font-size: 25px;
            position: absolute;
            left: 2px;
            top: 23px;
            cursor: pointer;
            z-index: 1;
            display: none
        }

        .in-store-coupons-page .offerclose {
            color: var(--secondary-color)
        }

        .footermenu {
            display: none
        }

        .footermenu a {
            display: inline-block;
            font-family: textfont;
            font-size: 11px;
            flex: 1 1 0;
            text-align: center;
            padding-top: 6px;
            color: #999;
            text-decoration: none;
            text-transform: capitalize
        }

        .footermenu a.ft-sch {
            display: none
        }

        .display-scheduled-order .footermenu a.ft-sch {
            display: inline-block
        }

        .footermenu a::before {
            font-family: Ionicons;
            display: block;
            font-size: 28px;
            margin-bottom: 2px;
            color: #777
        }

        .footermenu a.active,
        .footermenu a.active::before {
            color: var(--primary-color)
        }

        .footermenu a.ft-hom::before {
            content: "\F30C"
        }

        .footermenu a.ft-fav::before {
            content: "\F4B3"
        }

        .footermenu a.ft-sch::before {
            content: "\F3F4"
        }

        .footermenu a.ft-ord::before {
            content: "\F454"
        }

        .footermenu a.ft-acc::before {
            content: "\F345"
        }

        .footermenu a.ft-add::before {
            content: "\F1E5"
        }

        .userpages .md-schedule {
            display: none
        }

        .display-scheduled-order .userpages .md-schedule {
            display: block
        }

        .userpages .md-schedule::before {
            font-family: Ionicons;
            content: "\F3F4";
            font-size: 24px;
            margin-right: 10px;
            position: absolute;
            top: -3px
        }

        @media(max-width:500px) {
            .show-footer-menu .footermenu {
                position: fixed;
                width: 100%;
                height: 80px;
                background-color: #fafafa;
                bottom: 0;
                border-top: 1px solid #eee;
                display: flex;
                z-index: 9
            }

            /* .show-footer-menu .content::after,
    .contentb::after {
        content: "";
        background-color: red;
        display: block;
        height: 100px !important;
        position: absolute !important;
        bottom: -100px !important
    } */

            .show-footer-menu.market .checkoutID.subPage .content {
                padding-bottom: 90px !important
            }
        }

        @media(max-width:768px) {
            .show-footer-menu .offers-wrap {
                padding-bottom: 90px
            }

            .closed {
                width: calc(100vw - 122px)
            }

            .offers-wrap {
                display: none
            }

            .offers-category-wrap .offer-category {
                display: inline-block
            }

            .online-vouchers-page .offers-category-wrap .offer-category,
            .in-store-coupons-page .offers-category-wrap .offer-category {
                display: none
            }

            .online-vouchers-page .offers-wrap,
            .in-store-coupons-page .offers-wrap {
                display: block
            }

            .online-vouchers-page .offerclose,
            .in-store-coupons-page .offerclose {
                display: block;
                z-index: 2
            }

            .disableClose .offerclose {
                display: none
            }

            .offers-wrap .offer {
                display: none
            }

            .online-vouchers-page .offers-wrap .offer.online-voucher-item {
                display: inline-block
            }

            .in-store-coupons-page .offers-wrap .offer.in-store-coupon-item {
                display: inline-block
            }

            .in-store-coupons-page .in-store-coupons-title {
                display: block
            }
        }

        .orders .order .withTitle {
            text-transform: capitalize;
            width: 100%;
            min-height: 15px;
            height: auto
        }

        @media only screen and (min-device-width:834px) and (max-device-width:834px) and (orientation:portrait) and (-webkit-min-device-pixel-ratio:2) {
            body {
                visibility: visible
            }

            .retail.menuontop .reviewbagbut {
                display: block !important;
            }

            .retail.menuontop .reviewbag .reviewbagbut {
                display: none !important;
            }

            .retail.menuontop .myBagModule.stick {
                display: block;
            }

            .giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-amount-wrapper .gc-custom-amount {
                width: 28px !important;
            }

            div#customizedModalID {
                max-width: 780px;
            }

            .orders.normal .order {
                margin-right: 0;
                width: 100%
            }

            .checkoutID .reviewbagbut {
                display: none
            }

            .categoryPid .titleAndLegend {
                display: none
            }

            .content,
            .contentb {
                width: 531px;
                margin-left: -16px;
                padding-right: 0 !important
            }

            .pheadline {
                width: 28%;
            }

            .homePid .itemsList .itemGrid,
            .itemsList .itemGrid {
                width: calc(100% - 16px);
                margin-left: 0 !important
            }

            .itemsList .itemGrid {
                width: 100%
            }

            .retail .priceWrap .oldprice {
                margin: -6px;
                position: absolute;
                left: 21px !important
            }

            .myAccountPid .whiteBox .boxes .box {
                width: 100% !important
            }

            .footer {
                display: none
            }

            .retail .customizedID .genBtn.retailonly {
                margin-bottom: 22px
            }

            .retail .customizedID {
                min-width: unset
            }

            .productpage div#customizedModalID,
            .productpage div#customizedModalID.rigid {
                max-width: 790px;
            }

            .retail .itemsList .itemGrid {
                width: calc(33% - 11px) !important
            }



            .retail .homeFilter.ontop {
                width: 250px;
                margin-left: -24px
            }
        }

        .tabled {
            display: table;
            height: 100%;
            width: 100%;
            transition: all .2s ease 0s
        }

        .langswitcher {
            margin-top: 29px;
            margin-right: 18px;
            color: #fff;
            display: block;
            border: 2px solid #fff;
            height: 25px;
            width: 45px;
            border-radius: 7px;
            float: left
        }

        .onelanguage .langswitcher {
            display: none;
        }

        .selection .selectDate {
            width: 150px
        }

        .rtl .selection .selectDate {
            width: 150px
        }

        .no-asap-order #time-now {
            display: none
        }

        .no-asap-order #time-sched {
            display: none
        }

        .no-asap-order .box_date .title {
            display: block !important
        }

        .myAccountPid .no-items-found {
            text-align: center;
            font-size: 15px;
            margin-top: 122px
        }

        .myAccountPid .no-items-found::before {
            font: 119px / 1 Material-Design-Iconic-Font;
            content: "\F109";
            margin-right: 10px;
            color: #eee;
            display: block;
            margin-bottom: 25px
        }

        .no-items-found .genBtn {
            margin-left: auto;
            margin-right: auto;
            min-width: 310px;
            min-height: 50px;
            margin-top: 42px
        }

        .rtl.market .itemsList .itemGrid .priceWrap .wrap .price {
            float: left
        }

        .rtl.market .itemsList .itemGrid .priceWrap .wrap .oldprice {
            float: none;
            display: block
        }

        .myBagModule .itemBags .itemBag .brand {
            font-weight: normal;
            font-family: textfont;
            color: #666;
            font-size: 12px !important
        }

        .rtl .myBagModule .itemBags .itemBag .brand {
            text-align: right
        }

        .market.rtl .itemsList .itemGrid {
            margin-left: 0
        }

        .market .bagph::after {
            content: "\F1C9"
        }

        .rtl.retail .d-w {
            float: right
        }

        .cancel-edit-order {
            position: relative;
            display: block;
            float: right;
            font-size: 11px;
            text-transform: uppercase;
            border-bottom: 1px dashed #878787;
            color: #878787;
            margin-top: 19px;
            padding-bottom: 3px;
            cursor: pointer;
            font-weight: bold;
            margin-right: 39px
        }

        .cancel-edit-order.address-itb {
            margin-top: 7px;
            margin-right: 10px
        }

        @media(min-width:769px) {
            .cancel-edit-order:hover {
                color: var(--primary-color)
            }
        }

        .auto-login-from-back .socials.menuList {
            display: none
        }

        .auto-login-from-back .MenuParts .callUsNb {
            display: none !important
        }

        .auto-login-from-back .logo {
            display: none !important
        }

        .auto-login-from-back .deskmenu .bottom {
            display: none
        }

        .auto-login-from-back .deskmenu {
            margin-top: 26px
        }

        .auto-login-from-back footer {
            display: none !important
        }

        .auto-login-from-back .subPage .titleAndLegend {
            display: none !important
        }

        .auto-login-from-back .deskmenu {
            position: fixed;
            top: 90px;
            overflow: hidden auto;
            display: block;
            height: calc(100% - 116px) !important
        }

        .auto-login-from-back .content {
            margin-left: 298px
        }

        .auto-login-from-back .cancel-edit-order {
            display: none
        }

        .auto-login-from-back .paymentMethods {
            display: none
        }

        .auto-login-from-back .userpages a {
            margin-left: -28px;
            width: 34px;
            display: block;
            overflow: hidden;
            position: absolute;
            opacity: 0;
            background-color: #fff;
            height: 29px;
            color: #fafafa !important;
            line-height: 7px !important
        }

        .auto-login-from-back .userpages .md-fav::before {
            color: #666 !important
        }

        .auto-login-from-back .MenuParts .menuList {
            display: none
        }

        .auto-login-from-back .homeFilter {
            margin-top: 105px;
            left: 30px;
            width: 244px;
            transform: none;
            position: fixed;
            top: -92px;
            visibility: visible;
            background-color: rgba(44, 44, 44, 0.05)
        }

        .auto-login-from-back .MenuParts .parts .bot {
            visibility: hidden
        }

        .auto-login-from-back #wrapper {
            margin-top: 4px
        }

        .auto-login-from-back .userbar {
            top: 51px;
            left: 25px !important;
            border-bottom: 0 !important;
            transform: none !important
        }

        .auto-login-from-back .auto-login-from-back .deskmenu {
            top: 107px;
            height: calc(100% - 134px) !important
        }

        .auto-login-from-back .subPage .MenuParts {
            width: 293px
        }

        .auto-login-from-back .userpages {
            float: none;
            width: 100% !important
        }

        .auto-login-from-back .subPage .userbar {
            width: 100%;
            background: 0 center
        }

        .auto-login-from-back .myBagModule.stick {
            top: -13px
        }

        .auto-login-from-back .mCSB_container {
            height: calc(100% - 136px)
        }

        .auto-login-from-back .filter input {
            color: #333
        }

        .auto-login-from-back .homeFilter .filter .zmdi {
            color: #333
        }

        .auto-login-from-back .userpages li {
            margin-right: 54px;
            width: 0
        }

        .auto-login-from-back.fnb .checkoutID .userpages li,
        .auto-login-from-back.market .checkoutID .userpages li {
            display: block
        }

        .auto-login-from-back li.md-schedule {
            display: none !important
        }

        .auto-login-from-back li.md-reorder {
            display: none !important
        }

        .auto-login-from-back .delivery-date {
            display: none !important
        }

        .auto-login-from-back.fnb .subPage.checkoutID .content,
        .auto-login-from-back.market .subPage.checkoutID .content {
            margin-top: -15px
        }

        .auto-login-from-back .userpages .md-orders::before {
            pointer-events: none
        }

        .auto-login-from-back .userbar {
            background: transparent
        }

        @media (min-width:769px) {
            #bobPaymentsModalID.payment-type-checkout,
            #fibPaymentsModalID.payment-type-checkout{
                max-width: 640px;
                max-height: 480px;
                border-radius: 0
            }

            #bobPaymentsModalID.payment-type-checkout .normalForm,
            #fibPaymentsModalID.payment-type-checkout .normalForm{
                height: 425px
            }

            #bobPaymentsModalID.payment-type-urway,
            #fibPaymentsModalID.payment-type-urway {
                max-width: 455px;
                max-height: 600px;
                border-radius: 0
            }

            #bobPaymentsModalID.payment-type-urway .normalForm,
            #fibPaymentsModalID.payment-type-urway .normalForm {
                height: 600px
            }
        }

        .fnb .cont .data {
            display: none;
        }

        .fnb .largetxt .cont .data,
        .fnb .largetxt .cont .description {
            display: block;
        }

        .fnb .description.retailonly {
            display: none !important;
        }

        .fnb .largetxt .cont .description {
            /* display: none!important; */
        }

        .fnb .customizedID.largetxt .data .description {
            display: block
        }

        .no-asap-order .delivery-date {
            color: #999;
            font-weight: bold;
            font-size: 13px;
            padding-bottom: 6px
        }

        .box_date .radio .label: last-child {
            min-width: 0;
            margin-bottom: 0
        }

        .box_date .radio {
            width: auto
        }

        #promotionId .btnClose .zmdi {
            display: block !important
        }

        .closed {
            background-color: rgba(255, 249, 233, 0.92);
            position: absolute;
            padding: 10px 38px 11px;
            border: 1px solid #f2cece;
            border-radius: 6px;
            font-size: 14px;
            color: #c54d4d;
            display: none;
            margin-top: -11px
        }

        .no-asap-order .closed {
            display: block
        }

        .closed .l1 {
            font-weight: bold;
            font-size: 16px
        }

        .closed .l1::before {
            font: 20px / 1 Material-Design-Iconic-Font;
            content: "\F1F7";
            margin-right: 8px;
            margin-bottom: 10px;
            position: absolute;
            left: 12px
        }

        .closed .l2 {
            font-size: 13px;
            margin-top: 5px;
            color: #666
        }

        .retail .closed {
            display: none
        }

        .paused {
            background-color: rgba(255, 249, 233, 0.92);
            position: absolute;
            padding: 10px 38px 11px;
            border: 1px solid #f2cece;
            border-radius: 6px;
            font-size: 14px;
            color: #c54d4d;
            display: block;
            margin-top: -11px
        }

        .paused .l1 {
            font-weight: bold;
            font-size: 16px
        }

        .paused .l1::before {
            font: 20px / 1 Material-Design-Iconic-Font;
            content: "\F1F7";
            margin-right: 8px;
            margin-bottom: 10px;
            position: absolute;
            left: 12px
        }

        .paused .l2 {
            font-size: 13px;
            margin-top: 5px
        }

        .retail .paused {
            display: none
        }

        .normalForm .inputWrap.date.disabled {
            cursor: default
        }

        .normalForm .inputWrap.date.disabled input {
            cursor: default;
            color: #999
        }

        .normalForm .inputWrap.date.disabled .zmdi-calendar-alt {
            cursor: default;
            color: #999 !important
        }

        .header.noslides {
            display: none
        }

        .fnb .picture.nopimgb {
            height: 116px
        }

        @media(max-width:768px) {
            .swiper-container.main-swiper .headbackimg.desktop-img {
                display: none
            }

            .swiper-container.main-swiper .headbackimg.mobile-img {
                display: block
            }
        }

        @media(min-width:769px) {
            .swiper-container.main-swiper .headbackimg.desktop-img {
                display: block
            }

            .menuontop img.headbackimg {
                width: 100vw
            }

            .swiper-container.main-swiper .headbackimg.mobile-img {
                display: none
            }
        }

        .retail .size-guide-container {
            position: relative;
            display: flex;
            text-align: right;
            justify-content: flex-end
        }

        .classicproduct .size-guide-container {
            text-align: left;
            flex-direction: row-reverse;
            margin-bottom: 0
        }

        .retail .size-guide-container[ data-unit=""] {
            /* display: none; */
        }

        .size-guide-button {
            position: relative;
            display: block;
            font-size: 14px;
            color: #666;
            cursor: pointer;
            margin-right: 8px;
            padding-top: 1px;
            border-bottom: 1px dashed #ccc;
            height: 24px;
            margin-bottom: 17px;
        }

        .classicproduct .size-guide-button {
            text-transform: uppercase;
            font-size: 13px;
            color: #999
        }

        #sizeGuideModalID {
            padding: 0;
            max-width: 998px;
            width: 1024px !important;
        }

        .classicproduct div#sizeGuideModalID {
            box-shadow: 5px 5px 26px rgba(0, 0, 0, 0.1);
            /* margin-top: 82px; */
            overflow: hidden;
        }

        div#sizeGuideModalID .btnClose .zmdi {
            color: #000;
            margin-top: 6px;
        }

        #sizeGuideModalID .parts {
            padding: 0px;
            overflow: hidden;
            width: 100%;
            box-sizing: border-box;
        }

        .classicproduct #sizeGuideModalID .parts {
            border-radius: 0;
            overflow: auto;
        }

        #sizeGuideModalID .wrap {
            padding-bottom: 0;
            padding: 42px;
            padding-top: 59px;
        }

        #sizeGuideModalID img.desktop {
            /* max-height: 470px; */
            max-width: 100%;
            display: block !important;
        }

        #sizeGuideModalID img.mobile {
            max-height: 470px;
            max-width: 100%;
            display: none !important;
        }

        @media(max-width:768px) {
            #sizeGuideModalID img.desktop {
                display: none !important
            }

            #sizeGuideModalID img.mobile {
                display: block !important;
                height: auto !important;
                /* max-height: 100%; */
                max-width: none;
            }
        }

        .you-will-earn-points {
            position: relative;
            display: block;
            font-size: 13px;
            color: #999;
            text-align: right;
            font-weight: normal;
            margin-top: -36px
        }

        .rtl .you-will-earn-points {
            text-align: left;
        }

        .you-will-earn-points .l-left-side {
            margin-right: 5px
        }

        .mcolls {
            margin-top: 22px
        }

        .mobileMenuWrap .lineLink .mcolls .text {
            color: #999 !important;
            font-size: 13px !important
        }

        .hide-coll-on-homepage {
            display: none
        }

        .loyaltyl.loyaltyl-bottom {
            display: block
        }

        .l-join {
            width: 100%;
            height: 100vh;
            background-color: rgba(0, 0, 0, 0.76);
            position: fixed;
            bottom: -100vh;
            text-align: center;
            z-index: 99;
            opacity: 0;
            display: none
        }

        .l-join.lj-fade {
            display: block;
            opacity: 1;
            transition: all .3s linear 0s;
            bottom: 0
        }

        .l-join img {
            width: 295px;
            margin: 34px auto auto
        }

        @media only screen and (max-width:375px) {
            .l-join img {
                width: 268px;
                margin: 30px auto auto
            }
        }

        @media only screen and (max-width:320px) {
            .l-join img {
                width: 235px;
                margin: 20px auto auto
            }
        }

        .loyalty-w {
            background-image: none;
            background-repeat: no-repeat;
            background-size: 100%;
            background-position: center bottom;
            min-height: calc(100vh - 136px);
            background-attachment: fixed;
            text-align: center;
            display: inline-block;
            width: 100%;
            margin-top: 52px
        }

        .loyalty-w .loyalty-logo img {
            width: 90px;
            height: auto;
            margin-top: 18%
        }

        .loyalty-w .loyalty-logo {
            text-align: center;
            margin-top: 0
        }

        .lvl1 td.l-name::before {
            content: "Rook"
        }

        td.l-name {
            text-align: right
        }

        .lvl2 td.l-name::before {
            content: "Knight"
        }

        .lvl3 td.l-name::before {
            content: "King"
        }

        .lvl1 td.l-icon {
            background-image: url("../../config/images/level-1.png");
            background-size: 100px 100px;
            height: 186px;
            width: 184px;
            background-repeat: no-repeat;
            background-position: center center
        }

        .lvl2 td.l-icon {
            background-image: url("../../config/images/level-2.png");
            background-size: 100px 100px;
            height: 186px;
            width: 184px;
            background-repeat: no-repeat;
            background-position: center center
        }

        .lvl3 td.l-icon {
            background-image: url("../../config/images/level-3.png");
            background-size: 100px 100px;
            height: 186px;
            width: 184px;
            background-repeat: no-repeat;
            background-position: center center
        }

        .current-level {
            vertical-align: middle;
            font-size: 42px;
            font-family: titlefont;
            font-weight: normal;
            position: relative;
            display: inline-block;
            text-align: center;
            line-height: 53px;
            margin-bottom: 8px;
            height: 70px;
            background-color: #bc7f4c;
            color: #fff;
            border-radius: 8px;
            overflow: hidden;
            width: 70px;
        }

        .current-level .zmdi {
            position: relative;
            display: block;
            margin-top: 14px;
        }

        .lvl1 .current-level {
            background-color: #bc7f4c
        }

        .lvl2 .current-level {
            background-color: #91989e
        }

        .lvl3 .current-level {
            background-color: #f5a732
        }

        .lvl4 .current-level {
            background-color: #3c1a2f
        }

        .loyaltylvl1.header-loyalty-value {
            background-color: #bc7f4c
        }

        .loyaltylvl2.header-loyalty-value {
            background-color: #91989e
        }

        .loyaltylvl3.header-loyalty-value {
            background-color: #f5a732
        }

        .loyaltylvl4.header-loyalty-value {
            background-color: #3c1a2f
        }

        .current-level::before {
            position: absolute;
            content: "";
            width: 45px;
            height: 293px;
            background-color: #fafafa;
            transform: rotate(45deg);
            opacity: .1;
            left: 50%;
            top: -132px;
        }

        .current-level::after {
            animation: 5s ease-in-out 0s infinite normal forwards running shine;
            content: "";
            position: absolute;
            top: -110%;
            left: -210%;
            width: 200%;
            height: 200%;
            opacity: 0;
            transform: rotate(30deg);
            background: linear-gradient(to right, rgba(255, 255, 255, 0.13) 0, rgba(255, 255, 255, 0.13) 77%, rgba(255, 255, 255, 0.5) 92%, rgba(255, 255, 255, 0) 100%)
        }

        @keyframes shine {
            10% {
                opacity: 1;
                top: -30%;
                left: -30%;
                transition-property: left, top, opacity;
                transition-duration: .7s, 0.7s, 0.15s;
                transition-timing-function: ease
            }

            100% {
                opacity: 0;
                top: -30%;
                left: -30%;
                transition-property: left, top, opacity
            }
        }

        .current-level-unit {
            font-size: 21px;
            font-family: titlefont;
            font-weight: normal;
            position: relative;
            display: block;
            color: #333;
            text-align: center;
            text-transform: uppercase
        }

        .p2next {
            text-align: center;
            color: #333;
            font-family: textfont;
            font-size: 14px;
            margin-top: 10px;
            min-height: 17.6px
        }

        .lvl1 span.nln::before {
            content: "SILVER"
        }

        .lvl2 span.nln::before {
            content: "GOLD"
        }

        .lvl3 .p2next {
            display: none
        }

        .p2nexti li {
            list-style: none;
            width: 55px;
            display: inline-block !important
        }

        .p2nexti li.active {
            opacity: 1
        }

        li.lvl-1 {
            opacity: .6
        }

        li.lvl-1 .zmdi {
            color: #b57139
        }

        .p2nexti li img {
            width: 45px
        }

        .p2nexti li .name {
            font-family: titlefont;
            font-size: 14px;
            position: relative;
            display: block;
            text-align: center;
            margin-top: -3px;
            text-transform: uppercase
        }

        .p2nexti li.lvl-1 .name {
            color: #ad7139
        }

        .p2nexti li.lvl-2 .name {
            color: #91989e
        }

        .p2nexti li.lvl-3 .name {
            color: #f5a71d
        }

        .p2nexti li.lvl-4 .name {
            color: var(--primary-color)
        }

        .p2nexti li.bar1,
        .p2nexti li.bar2,
        .p2nexti li.bar3 {
            width: 94px;
            height: 4px;
            margin-top: 43px;
            vertical-align: top;
            margin-left: -13px;
            margin-right: -13px;
            background-color: #e6e6e6
        }

        .p2nexti.nb-of-levels-4 li.bar1,
        .p2nexti.nb-of-levels-4 li.bar2,
        .p2nexti.nb-of-levels-4 li.bar3 {
            width: 60px;
            margin-left: -14px;
            margin-right: -9px
        }

        .p2nexti li.bar1 .bfiller,
        .p2nexti li.bar2 .bfiller,
        .p2nexti li.bar3 .bfiller {
            height: 4px;
            margin-top: 0;
            background-color: var(--secondary-color)
        }

        .loyalty-w .p-summary {
            display: block;
            float: none;
            margin-top: 10px;
            text-align: center;
            padding: 11px;
            color: #666
        }

        .p2nexti {
            margin-top: 20px;
            text-align: center
        }

        .p2nexti .zmdi {
            font-size: 44px;
            margin-bottom: 11px;
            margin-top: 22px
        }

        .p2nexti .l1 {
            text-align: center
        }

        .l-dynamics .ld-title {
            color: #a61815;
            background-color: #fff;
            display: block;
            text-align: center;
            margin: -9px auto auto;
            width: 193px;
            font-weight: bold;
            font-size: 15px
        }

        .l-dynamics {
            border-top: 1px solid #a0a0a0;
            margin-top: 24px;
            padding-bottom: 96px
        }

        .d-desc {
            text-align: center;
            padding: 16px;
            color: #666
        }

        .p-summary .lking {
            color: green;
            display: none
        }

        .lvl3 .p-summary .r-k {
            display: none
        }

        .lvl3 .p-summary .lking {
            display: block
        }

        .l-footer {
            text-align: center;
            background-color: var(--primary-color);
            padding-top: 21px;
            position: fixed;
            width: 100%;
            height: 56px;
            padding-left: 30px;
            padding-right: 30px;
            box-sizing: border-box;
            bottom: 0;
            color: #fff;
            font-size: 15px;
            cursor: pointer
        }

        .rd-title {
            position: relative;
            display: block;
            text-align: center;
            font-family: titlefont;
            font-size: 13px;
            margin-bottom: 6px;
            color: var(--primary-color);
            margin-top: calc(100vh - 635px)
        }

        .rd-amount {
            position: relative;
            display: flex;
            text-align: center;
            align-items: center;
            justify-content: center
        }

        .rd-amount .l-btn {
            position: relative;
            display: inline-block;
            text-align: center;
            min-width: 150px;
            margin-left: auto;
            margin-right: auto;
            color: #333;
            font-family: textfont, sans-serif;
            font-size: 21px;
            padding: 4px 15px;
            width: auto;
            border-radius: 6px;
            align-items: center;
            justify-content: center;
            min-height: 41px;
            line-height: 41px;
            border: 1px dotted var(--primary-color)
        }

        .rd-button {
            display: block;
            margin-top: 41px;
            background-color: #a61815;
            color: #fff;
            height: 53px;
            line-height: 53px;
            font-size: 16px;
            font-weight: bold;
            border-radius: 4px;
            border-top: 1px solid #e06868
        }

        @media only screen and (min-width:769px) {
            .loyalty-w {
                margin: auto;
                padding-top: 82px;
                width: calc(100% - 604px);
                vertical-align: top
            }

            .menuontop .loyalty-w {
                width: 100%
            }

            .header-loyalty-value {
                margin-right: 17px
            }

            .loyalty-details .loyalty-w {
                background-image: none !important
            }

            .rd-title {
                margin-top: 62px !important
            }

            .loyalty-w .loyalty-logo {
                margin-top: 0
            }

            .loyalty-w .loyalty-logo img {
                margin-top: 22px
            }

            .loyalty-popup {
                width: 460px;
                height: 647px;
                padding-top: 0;
                transform: translateY(-50%);
                top: 50%;
                min-height: auto !important
            }

            .loyalty-popup .l-footer {
                display: block
            }

            .l-footer {
                display: none
            }
        }

        .rd-how-it-works {
            position: relative;
            display: inline-block;
            text-align: center;
            font-family: titlefont;
            font-size: 15px;
            padding-bottom: 14px;
            color: var(--primary-color);
            margin-top: 30px;
            text-decoration: none;
            cursor: pointer
        }

        .rd-how-it-works.expiry::after {
            display: none
        }

        .rd-how-it-works.expiry {
            font-size: 15px
        }

        .rd-how-it-works::after {
            content: "";
            position: absolute;
            bottom: 9px;
            left: 0;
            height: 1px;
            width: 100%;
            background-color: var(--primary-color);
            opacity: .5
        }

        @media(max-width:768px) {
            #wrapper {
                height: auto;
                min-height: calc(100vh - 143px)
            }

            #wrapper {
                background-color: #f8f8f8
            }

            .cordova .homePid #wrapper {
                padding-top: 132px;
            }

            .retail.cordova .homePid #wrapper {
                padding-top: 66px;
            }

            .subPage .titleAndLegend {
                display: none !important
            }
        }

        .loyalty-details h2 {
            font-size: 27px;
            font-family: titlefont;
            font-weight: normal;
            position: relative;
            display: block;
            color: var(--primary-color);
            text-align: center;
            margin-top: 25px
        }

        .loyalty-details .loyalty-w {
            margin-top: 0
        }

        #loyaltyDetailsModalID.loyalty-details .loyalty-w,
        #loyaltyMoreDetailsModalID.loyalty-details .loyalty-w {
            padding: 25px 0 0;
            margin-top: 0;
            position: relative;
            display: block;
            margin-bottom: 59px;
            width: 100% !important
        }

        .loyalty-details .l-description {
            position: relative;
            display: block;
            width: 80%;
            margin-right: auto;
            margin-left: auto;
            text-align: center
        }

        .loyalty-details p {
            font-size: 15px;
            color: #8c532e;
            font-weight: 600;
            line-height: 16px;
            margin-top: 8px
        }

        .loyalty-details p img {
            position: relative;
            display: block;
            margin: 11px auto 15px
        }

        .loyalty-details .loyalty-w h3 {
            position: relative;
            display: inline-block;
            text-align: center;
            font-family: titlefont;
            font-size: 15px;
            padding-bottom: 14px;
            color: var(--primary-color);
            margin-top: 31px;
            text-decoration: none;
            cursor: pointer
        }

        .loyalty-details .l-description {
            padding-bottom: 100px
        }

        .loyalty-w li.lvl-2,
        .loyalty-w li.lvl-3,
        .loyalty-w li.lvl-4 {
            opacity: .4
        }

        li.lvl-2 .zmdi {
            color: #91989e
        }

        li.lvl-3 .zmdi {
            color: #f5a732
        }

        li.lvl-4 .zmdi {
            color: var(--primary-color)
        }

        .loyalty-w li.lvl-2.active,
        .loyalty-w li.lvl-3.active,
        .loyalty-w li.lvl-4.active {
            opacity: 1
        }

        .header-loyalty-value {
            display: inline-block;
            background-repeat: no-repeat;
            background-position: center center;
            height: 45px;
            min-width: 55px;
            position: relative;
            background-size: contain;
            top: 20px;
            padding-left: 5px;
            padding-right: 5px;
            text-align: center;
            font-size: 12px;
            color: #fff;
            font-weight: bold;
            cursor: pointer;
            background-color: #b57139;
            border-radius: 5px;
            overflow: hidden;
            box-sizing: border-box;
            width: 55px;
            margin-right: 20px;
        }

        .loyalty.subPage .header-loyalty-value {
            display: none
        }

        .loyalty-icon {
            font-size: 21px;
            margin-top: 5px
        }

        .header-loyalty-value span {
            position: absolute;
            text-align: center;
            bottom: 3px;
            width: 100%;
            left: 0
        }

        .header-loyalty-value::before {
            position: absolute;
            content: "";
            width: 20px;
            height: 100px;
            background-color: #fafafa;
            transform: rotate(45deg);
            opacity: .1;
            left: 50%;
            top: -37px
        }

        .box_delivery .btm .loyalty {
            display: none
        }

        .kangaroo-loyalty-points .lp-points-container {
            position: relative;
            display: block;
            height: 42px;
            background-color: #fff;
            background-repeat: no-repeat;
            background-size: auto 100%;
            background-position: right center;
            margin-top: 14px;
            padding-bottom: 4px;
            border-bottom: 1px solid #dfdfdf;
            border-radius: 6px !important
        }

        .kangaroo-loyalty-points .lp-points-container .lp-title {
            font-family: titlefont;
            color: #fff;
            font-size: 18px;
            margin-left: 20px;
            position: relative;
            padding-top: 16px;
            display: none
        }

        .kangaroo-loyalty-points .lp-points-container .input {
            margin-left: 12px;
            position: relative;
            display: block;
            margin-top: 13px;
            padding-left: 20px;
            cursor: pointer
        }

        .kangaroo-loyalty-points .lp-points-container .input .label {
            font-size: 14px;
            color: #666;
            position: absolute;
            top: 13px;
            left: 26px
        }

        .rtl .kangaroo-loyalty-points .lp-points-container .input .label {
            top: 16px;
        }

        .kangaroo-loyalty-points .lp-points-container .input .zmdi-dot-circle {
            color: var(--primary-color);
            font-size: 21px;
            width: 17px;
            height: 17px
        }

        .kangaroo-loyalty-points .lp-points-container .input .zmdi-circle-o {
            color: #999;
            font-size: 21px;
            width: 17px;
            height: 17px
        }

        .kangaroo-loyalty-points .lp-points-container .input .check {
            position: absolute;
            top: 13px;
            cursor: pointer
        }

        .lp-redeemable-amount {
            position: absolute;
            display: block;
            bottom: 3px;
            margin-left: 0;
            height: 40px;
            max-width: 250px;
            padding-left: 15px;
            padding-top: 13px;
            right: 0
        }

        .lp-redeemable-amount .lpr-title {
            position: relative;
            color: var(--primary-color);
            font-family: titlefont;
            float: left;
            font-size: 14px;
            display: none;
            pointer-events: none
        }

        .lpr-amount-container {
            position: relative;
            display: flex;
            float: right;
            padding-top: 3px;
            margin-right: 15px
        }

        .lpr-amount-container .lpr-minus {
            position: relative;
            color: var(--primary-color);
            font-size: 50px;
            border-radius: 50%;
            width: 16px;
            height: 16px;
            text-align: center;
            line-height: 28px;
            margin-right: 5px;
            cursor: pointer;
            user-select: none
        }

        .lpr-amount-container .lpr-plus {
            position: relative;
            color: var(--primary-color);
            font-size: 31px;
            border-radius: 50%;
            width: 16px;
            height: 16px;
            text-align: center;
            line-height: 29px;
            margin-left: 5px;
            cursor: pointer;
            user-select: none
        }

        .lpr-amount-container .lpr-value {
            position: relative;
            font-size: 15px;
            border-radius: 6px;
            padding: 10px 8px 8px;
            height: 17px;
            line-height: 16px;
            margin-top: -3px;
            font-family: titlefont;
            min-width: 50px;
            text-align: end
        }

        .lpr-amount-container .disable-btn {
            cursor: default
        }

        .kangaroo-loyalty-points .lp-redeemable-amount.disabled .lpr-minus {
            display: none
        }

        .kangaroo-loyalty-points .lp-redeemable-amount.disabled .lpr-plus {
            display: none
        }

        .kangaroo-loyalty-points .lp-points-container.disabled .input .check {
            display: none
        }

        .kangaroo-loyalty-points .lp-points-container.disabled .input .label {
            left: 0
        }

        .loyalty-popup h2.l-title {
            font-size: 28px;
            font-family: titlefont;
            font-weight: normal;
            position: relative;
            display: block;
            color: #f5a71d;
            text-align: center;
            margin-top: 18px;
            line-height: 27px;
            width: 255px;
            margin-left: auto;
            margin-right: auto
        }

        .loyalty-popup .l-description {
            position: relative;
            display: block;
            margin-right: auto;
            margin-left: auto;
            text-align: center
        }

        .loyalty-popup .loyalty-w {
            background-image: url("../../config/images/loyalty-bg.png")
        }

        .loyalty-popup p.l-details {
            font-size: 15px;
            color: #8c532e;
            font-weight: 600;
            line-height: 16px;
            margin-top: 8px
        }

        .loyalty-popup p.l-details img {
            position: relative;
            display: block;
            margin: 11px auto 15px;
            width: 33px
        }

        .loyalty-sub-logo img {
            width: 65px;
            margin-top: 13px
        }

        .loyalty-sub-logo {
            text-align: center
        }

        .loyalty-popup {
            background-position: center bottom;
            min-height: 100vh;
            background-image: url("../../config/images/loyalty-bg.png");
            position: relative;
            display: block;
            background-attachment: unset
        }

        .loyalty-popup .loyalty-header {
            position: relative;
            display: block;
            height: 100px;
            background-color: #ed7800;
            background-image: url("../../config/images/checkout-loyalty-crown.png");
            background-repeat: no-repeat;
            background-size: auto 100%;
            background-position: right center
        }

        .loyalty-popup .loyalty-header .l-header-text {
            vertical-align: middle;
            font-size: 35px;
            font-family: titlefont;
            color: #fff;
            padding-left: 33px;
            padding-top: 33px;
            text-align: left
        }

        .loyalty-popup .loyalty-logo img {
            width: 171px;
            margin-top: 26px
        }

        .loyalty-popup .l-footer {
            position: absolute
        }

        @media(max-width:360px) {
            .loyalty-popup h2.l-title {
                padding-left: 0;
                padding-right: 0
            }

            .loyalty-popup .loyalty-logo img {
                width: 160px;
                margin-top: 21px
            }

            .loyalty-popup h2.l-title {
                margin-top: 13px
            }
        }

        @keyframes bounce {

            0%,
            20%,
            53%,
            80%,
            100% {
                animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
                transform: translate3d(0px, 0px, 0px)
            }

            40%,
            43% {
                animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
                transform: translate3d(0px, -30px, 0px)
            }

            70% {
                animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
                transform: translate3d(0px, -15px, 0px)
            }

            90% {
                transform: translate3d(0px, -4px, 0px)
            }
        }

        .bounce {
            animation-name: bounce;
            transform-origin: center bottom
        }

        .checkoutID .totalPrice::before {
            content: attr(data-text);
            text-transform: uppercase;
            font-family: textfont;
            position: absolute;
            left: 0
        }

        .rtl .checkoutID .totalPrice::before {
            left: auto;
            right: 0;
        }

        .kangaroo-loyalty-points .totalPrice::before {
            content: "SUB TOTAL"
        }

        .subTotalBox .totalPrice {
            text-align: right;
            font-size: 14px
        }

        .orderdetails .subTotalBox .totalPrice {
            text-align: center;
            margin-top: -5px !important;
            font-size: 24px !important
        }

        .kangaroo-loyalty-points {
            position: relative;
            margin-bottom: 16px
        }

        .kangaroo-loyalty-points .wrap {
            position: relative;
            display: block;
            width: 100% !important
        }

        .kangaroo-loyalty-points .wrap .totalPrice {
            margin-top: -3px
        }

        .kangaroo-loyalty-points .loggedin .totalPrice::before {
            content: "SUB TOTAL"
        }

        .loading-opacity {
            opacity: .3;
            transition: opacity 1s ease-in-out 0s
        }

        @media(max-width:1300px) and (min-width:769px) {
            .loyalty-w {
                width: calc(100% - 360px);
                margin-right: 0
            }
        }

        @media(min-width:769px) {

            #loyaltyDetailsModalID.loyalty-details .loyalty-w,
            #loyaltyMoreDetailsModalID.loyalty-details .loyalty-w {
                min-height: 510px;
                max-height: 510px;
                height: auto;
                overflow-y: auto
            }
        }

        #updateRewardsInfoId .label {
            opacity: .4;
            right: 10px;
            display: block !important
        }

        .loyalty-w.lvl1 li.lvl-1 {
            opacity: 1
        }

        .loyalty-w.lvl2 li.lvl-1,
        .loyalty-w.lvl2 li.lvl-2 {
            opacity: 1
        }

        .loyalty-w.lvl3 li.lvl-1,
        .loyalty-w.lvl3 li.lvl-2,
        .loyalty-w.lvl3 li.lvl-3 {
            opacity: 1
        }

        .loyalty-w.lvl4 li.lvl-1,
        .loyalty-w.lvl4 li.lvl-2,
        .loyalty-w.lvl4 li.lvl-3,
        .loyalty-w.lvl4 li.lvl-4 {
            opacity: 1
        }

        div#loyaltyDetailsModalID {
            box-shadow: none
        }

        .referrals-section {
            position: relative;
            padding-top: 45px;
            background-color: #fff
        }

        .cordova .referrals-section {
            padding-top: 90px
        }

        .referrals-section .rf-top-part {
            position: relative;
            display: block;
            border-bottom: 1px solid #ddd;
            padding: 0 20px 75px;
            text-align: center
        }

        .referrals-section .rf-top-part .rf-icon-container {
            font-size: 80px;
            color: var(--primary-color);
            position: relative;
            display: block
        }

        .referrals-section .rf-top-part .rf-sub-title-container {
            position: relative;
            display: block;
            font-weight: bold;
            font-size: 19px;
            color: #000;
            margin-bottom: 10px;
            font-family: titlefont
        }

        .referrals-section .rf-top-part .rf-description-container {
            position: relative;
            display: block;
            color: #777;
            font-size: 13px;
            margin-bottom: 35px;
            line-height: 21px;
            padding-left: 15px;
            padding-right: 15px
        }

        .referrals-section .rf-top-part .rf-buttons-container {
            position: relative;
            display: block
        }

        .referrals-section .rf-top-part .rf-buttons-container .rf-btn {
            position: relative;
            display: inline-block;
            width: 140px;
            height: 30px;
            border: 1px solid var(--primary-color);
            text-align: center;
            text-transform: uppercase;
            font-size: 16px;
            font-weight: bold;
            padding-top: 4px;
            border-radius: 5px;
            cursor: pointer;
            vertical-align: top;
            padding-bottom: 6px
        }

        .rtl .referrals-section .rf-top-part .rf-buttons-container rf-copy-btn {
            padding-top: 4px;
            padding-bottom: 6px
        }

        .referrals-section .rf-top-part .rf-buttons-container .rf-share-btn {
            margin-right: 15px;
            color: #fff;
            background-color: var(--primary-color);
            padding-top: 0;
            height: 35px
        }

        .referrals-section .rf-top-part .rf-buttons-container .rf-share-btn .rf-share-inner-btn {
            position: relative;
            display: block;
            padding-top: 10px;
            padding-bottom: 10px
        }

        .referrals-section .rf-top-part .rf-buttons-container .rf-copy-btn {
            color: var(--primary-color);
            background-color: #fff;
            padding-top: 9px;
            padding-bottom: 2px
        }

        .referrals-section .rf-top-part .rf-buttons-container .rf-copy-btn::before {
            display: none;
            position: absolute;
            z-index: 1000001;
            height: 5px;
            color: rgba(0, 0, 0, 0.8);
            pointer-events: none;
            content: "";
            top: calc(100% - 1px);
            right: calc(50% - 5px);
            clear: both;
            border-left: 5px solid transparent;
            border-right: 5px solid transparent;
            border-bottom: 5px solid #000
        }

        .referrals-section .rf-top-part .rf-buttons-container .rf-copy-btn::after {
            display: none;
            position: absolute;
            font-size: 12px;
            z-index: 1000000;
            padding: 5px 8px;
            color: #fff;
            text-align: center;
            text-decoration: none;
            text-shadow: none;
            text-transform: none;
            letter-spacing: normal;
            overflow-wrap: break-word;
            white-space: pre;
            pointer-events: none;
            content: attr(aria-label);
            background: rgba(0, 0, 0, 0.8);
            border-radius: 3px;
            -webkit-font-smoothing: subpixel-antialiased;
            top: 110%;
            right: 50%;
            margin-top: 5px;
            transform: translateX(50%);
            font-weight: normal
        }

        .referrals-section .rf-top-part .rf-buttons-container .rf-copy-btn.tooltipped::before {
            display: inline-block;
            text-decoration: none
        }

        .referrals-section .rf-top-part .rf-buttons-container .rf-copy-btn.tooltipped::after {
            display: block
        }

        .referrals-section .rf-top-part .rf-sharing-options {
            visibility: hidden;
            opacity: 0;
            position: absolute;
            transition: opacity .5s linear 0s;
            width: 190px;
            left: -25px;
            top: 52px;
            background-color: #fff;
            border-radius: 4px
        }

        .referrals-section .rf-top-part .rf-sharing-options.show {
            visibility: visible;
            opacity: 1;
            transition: opacity .5s linear 0s
        }

        .referrals-section .rf-top-part .rf-sharing-options::before {
            content: "";
            position: absolute;
            width: 0;
            height: 0;
            left: calc(50% - 7px);
            top: -7px;
            border-left: 7px solid transparent;
            border-right: 7px solid transparent;
            border-bottom: 7px solid #fff;
            clear: both
        }

        .referrals-section .rf-bottom-part {
            position: relative;
            display: block;
            background-color: #fff
        }

        .referrals-section .rf-bottom-part .rf-statistics-container {
            position: relative;
            display: block;
            padding-top: 28px;
            text-align: center;
            padding-bottom: 60px
        }

        .referrals-section .rf-bottom-part .rf-statistics-container .rf-joined-container {
            position: relative;
            display: inline-block;
            margin-right: 56px
        }

        .referrals-section .rf-bottom-part .rf-statistics-container .rf-ordered-container {
            position: relative;
            display: inline-block
        }

        .referrals-section .rf-bottom-part .rf-statistics-container .rf-statistics-number {
            position: relative;
            display: block;
            color: var(--primary-color);
            font-size: 50px;
            font-weight: bold
        }

        .referrals-section .rf-bottom-part .rf-statistics-container .rf-statistics-title {
            position: relative;
            display: block;
            color: #999;
            font-size: 10px;
            text-transform: uppercase
        }

        .rtl .referrals-section .rf-bottom-part .rf-statistics-container .rf-statistics-title {
            font-size: 12px
        }

        .referrals-section .rf-bottom-part .rf-vouchers-container {
            position: relative;
            display: block;
            padding-left: 10px;
            white-space: nowrap;
            padding-bottom: 15px;
            width: calc(100% - 15px);
            overflow-x: scroll
        }

        .referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher {
            position: relative;
            display: inline-block;
            width: 211px;
            height: 93px;
            border: 1px solid var(--primary-color);
            border-radius: 5px;
            padding: 10px 10px 14px;
            white-space: initial;
            margin-right: 15px;
            cursor: pointer
        }

        .referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher .rf-voucher-button-container .rf-voucher-button {
            position: relative;
            display: none;
            width: 87px;
            height: 16px;
            font-size: 12px;
            text-transform: uppercase;
            font-weight: bold;
            border-radius: 2px;
            text-align: center;
            padding-top: 3px
        }

        .referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher .rf-voucher-button-container .rf-voucher-locked {
            border: 1px dotted #c6c6c6;
            color: #c6c6c6
        }

        .referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher .rf-voucher-button-container .rf-voucher-claim {
            display: block;
            border: 1px solid var(--primary-color);
            color: #fff;
            background-color: var(--primary-color)
        }

        .referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher .rf-voucher-title {
            position: relative;
            display: block;
            color: #878787;
            font-size: 10px;
            text-transform: uppercase;
            padding-top: 5px
        }

        .referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher .rf-voucher-description {
            position: relative;
            display: block;
            color: #444;
            font-size: 14px;
            text-transform: uppercase;
            padding-top: 17px;
            font-weight: bold
        }

        .referrals-share-section {
            position: relative;
            display: block;
            padding-left: 30px;
            padding-right: 30px;
            padding-top: 150px;
            text-align: center
        }

        .referrals-share-section .rfs-name {
            position: relative;
            display: block;
            text-transform: uppercase;
            font-weight: bold;
            font-size: 18px;
            color: #000;
            margin-bottom: 7px
        }

        .referrals-share-section .rfs-sub-name {
            position: relative;
            display: block;
            color: #444;
            font-size: 14px
        }

        .referrals-share-section .rfs-icon-container {
            margin: 65px auto;
            position: relative;
            display: block;
            width: 190px
        }

        .referrals-share-section .rfs-description-container {
            position: relative;
            display: block;
            color: #444;
            font-size: 14px;
            margin-bottom: 35px
        }

        .referrals-share-section .rfs-btn {
            position: relative;
            display: inline-block;
            width: 212px;
            height: 30px;
            border: 1px solid var(--primary-color);
            background-color: var(--primary-color);
            text-align: center;
            text-transform: uppercase;
            font-size: 16px;
            font-weight: bold;
            padding-top: 10px;
            border-radius: 5px;
            cursor: pointer;
            color: #fff
        }

        @media(max-width:768px) {
            body.referrals {
                height: calc(100vh - 143px);
                min-height: calc(100vh - 143px);
                background-color: #fff
            }

            body.referrals #wrapper {
                margin-top: 72px
            }
        }

        @media(min-width:769px) {
            .referrals-section .rf-bottom-part .rf-vouchers-container {
                white-space: unset;
                overflow-x: unset
            }

            .referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher {
                margin-bottom: 15px
            }

            .referrals-section .rf-top-part .rf-buttons-container .rf-btn {
                cursor: pointer
            }

            .referrals-section .rf-top-part .rf-buttons-container .rf-btn: hover {
                filter: brightness(1.1)
            }

            .referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher .rf-voucher-button-container .rf-voucher-button {
                cursor: default
            }

            .referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher .rf-voucher-button-container .rf-voucher-claim {
                cursor: pointer
            }
        }

        .resp-sharing-button__link,
        .resp-sharing-button__icon {
            display: inline-block
        }

        .resp-sharing-button__link {
            text-decoration: none;
            color: #fff;
            margin: .5em
        }

        .resp-sharing-button {
            border-radius: 5px;
            transition: all 25ms ease-out 0s;
            padding: .5em .75em;
            font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
        }

        .resp-sharing-button__icon {
            stroke: #fff;
            fill: none
        }

        .resp-sharing-button__icon--solid,
        .resp-sharing-button__icon--solidcircle {
            fill: #fff;
            stroke: none
        }

        .resp-sharing-button__icon .zmdi::before {
            width: 17px;
            height: 22px;
            font-size: 20px
        }

        .resp-sharing-button__icon .zmdi-facebook::before {
            content: "\F343" !important;
            background: none !important
        }

        .resp-sharing-button__icon .zmdi-twitter::before {
            content: "\F360" !important;
            background: none !important
        }

        .resp-sharing-button--twitter {
            background-color: #55acee
        }

        .resp-sharing-button--twitter: hover {
            background-color: #2795e9
        }

        .resp-sharing-button--facebook {
            background-color: #3b5998
        }

        .resp-sharing-button--facebook: hover {
            background-color: #2d4373
        }

        .resp-sharing-button--facebook {
            background-color: #3b5998;
            border-color: #3b5998
        }

        .resp-sharing-button--facebook: hover,
        .resp-sharing-button--facebook:active {
            background-color: #2d4373;
            border-color: #2d4373
        }

        .resp-sharing-button--twitter {
            background-color: #55acee;
            border-color: #55acee
        }

        .resp-sharing-button--twitter: hover,
        .resp-sharing-button--twitter:active {
            background-color: #2795e9;
            border-color: #2795e9
        }

        .resp-sharing-button--email {
            background-color: #777;
            border-color: #777
        }

        .resp-sharing-button--email: hover,
        .resp-sharing-button--email:active {
            background-color: #5e5e5e;
            border-color: #5e5e5e
        }

        @media(max-width:768px) {
            .referrals-section .rf-top-part .rf-sharing-options {
                display: none
            }
        }

        .ref-button {
            border: 1px dashed var(--primary-color);
            width: calc(100% - 44px);
            margin: 12px auto auto;
            padding: 7px 7px 7px 56px;
            border-radius: 5px;
            min-height: 45px;
            box-sizing: border-box;
            position: relative;
            line-height: 29px;
            font-size: 12px;
            text-transform: uppercase;
            font-family: textfont;
            font-weight: bold;
            color: #444;
            letter-spacing: normal
        }

        .rtl .ref-button {
            text-align: right;
            padding-right: 12px
        }

        .ref-button::before {
            content: "\F208";
            font-family: Material-Design-Iconic-Font;
            position: absolute;
            left: 10px;
            color: var(--primary-color);
            font-size: 32px;
            font-weight: inherit
        }

        #addressFormId .error-container .error {
            bottom: 0;
            position: relative;
            display: none;
            padding-bottom: 8px;
            font-size: 13px;
            color: #ee2e22 !important
        }

        #addressFormId .wrap {
            box-sizing: border-box
        }

        #AddAddressModalID.no-map.no-shipping-countries #addressFormId .wrap {
            /* height: 325px; */
        }

        #addressFormId .googleMap {
            margin-top: 0
        }

        #addressFormId .inputWrap {
            display: inline-block;
            width: 100%
        }

        .inputWrap.phonead {
            display: none !important
        }

        .small-inputWrap {
            position: relative;
            display: flex
        }

        .small-inputWrap.bldg .inputWrap {
            margin-left: 0;
            margin-right: 0 !important
        }

        .delivered-informative-tab {
            position: relative;
            display: block;
            width: calc(100% - 100px);
            height: 30px;
            line-height: 30px;
            background: #c4c4c4;
            color: #fff;
            padding: 16px;
            text-align: center;
            margin-left: auto;
            margin-right: auto;
            margin-top: calc(50vh - 60px);
            font-size: 17px;
            font-family: Roboto, sans-serif
        }

        .delivered-informative-tab.loading {
            background-color: #3e9459 !important
        }

        @media(max-width:768px) {
            div#AddAddressModalID {
                max-width: 631px
            }

            .home-collection.layout2 .gITems ul {
                width: 100vw !important;
                max-width: 100vw !important
            }
        }

        @media(max-width:768px) {
            div#AddAddressModalID {
                max-width: 10000px
            }

            #addressFormId .wrap {
                display: flex;
                flex-flow: column wrap;
                box-sizing: border-box;
                height: auto !important
            }

            #addressFormId .inputWrap {
                margin-right: 0;
                width: 100%
            }

            #addressFormId .small-inputWrap {
                width: 100%
            }

            #addressFormId .googleMap {
                max-width: 100%;
                width: 100%
            }
        }

        .small-inputWrap .inputWrap {
            display: flex;
            width: 100% !important
        }

        #addressFormId .small-inputWrap .inputWrap: first-child {
            display: inline-block;
            flex-shrink: 2;
            width: 100%;
            margin-right: 5px
        }

        .small-inputWrap.bldg .inputWrap: first-child {
            margin-right: 5px !important
        }

        .small-inputWrap.bldg .inputWrap:nth-child(2) {
            flex-shrink: 1;
            max-width: 92px;
            margin-right: 5px !important
        }

        .small-inputWrap.bldg .inputWrap: last-child {
            max-width: 62px;
            flex-shrink: 1 !important
        }

        #addressFormId .small-inputWrap .inputWrap: last-child {
            display: inline-block;
            flex-shrink: 4;
            width: 100%;
            margin-right: 0
        }

        #registerFormID .small-inputWrap .inputWrap: first-child {
            display: inline-block;
            flex-shrink: 2;
            width: 100%;
            margin-right: 0
        }

        #registerFormID .small-inputWrap .inputWrap: last-child {
            display: inline-block;
            flex-shrink: 2;
            margin-left: 5px;
            width: 100%;
            margin-right: 0
        }

        .rtl #registerFormID .small-inputWrap .inputWrap: last-child {
            margin-left: 0px;
            margin-right: 5px;
        }

        .receipt-loyalty-earned {
            position: relative;
            display: block;
            text-align: center;
            text-transform: uppercase;
            font-size: 15px;
            margin-bottom: 2px
        }

        .orderdetails .myBagModule .genBtn {
            display: none
        }

        .listing-nutrition-facts-wrapper {
            position: relative;
            display: flex;
            margin-top: 8px;
            /* justify-content: space-between; */
            align-items: center;
            /* margin-left: -5px; */
            margin-bottom: 8px;
        }

        .customizedID .listing-nutrition-facts-wrapper {
            position: relative;
            display: flex;
            margin-top: 8px;
            justify-content: center;
            align-items: center;
            margin-bottom: 8px
        }

        .listing-nutrition-facts-wrapper .ingredients-container {
            position: relative;
            display: flex !important;
            margin: 0 !important;
            padding: 0 !important;
            width: auto !important;
            min-width: 0 !important;
            overflow: hidden;
        }

        .listing-nutrition-facts-wrapper .ingredients-container .ingredient-item {
            position: relative;
            width: 22px;
            height: 22px;
            margin-right: 5px;
            list-style: none
        }

        .listing-nutrition-facts-wrapper .ingredients-container .ingredient-item img {
            width: 22px
        }

        .listing-nutrition-facts-wrapper .calories-fact {
            position: relative;
            font-weight: 700;
            font-size: 13px;
            text-transform: uppercase;
            /* margin-top: 2px; */
            color: var(--secondary-color);
        }

        .popup-calories-fact {
            display: none
        }

        .listing-macronutrients-wrapper {
            position: relative;
            display: flex;
            margin-top: 34px;
            justify-content: center;
            align-items: center;
            margin-bottom: 39px;
        }

        .listing-macronutrients-wrapper .macronutrients-container {
            position: relative;
            display: flex !important;
            margin: 0 !important;
            padding: 0 !important;
            width: auto !important;
            min-width: 0 !important
        }

        .listing-macronutrients-wrapper .macronutrients-container .macronutrients-item {
            position: relative;
            margin-right: 11px;
            list-style: none;
            display: flex;
            flex-direction: column;
            flex-wrap: nowrap;
            align-items: center;
        }

        .listing-macronutrients-wrapper .macronutrients-container .macronutrients-item:last-child {
            margin-right: 0
        }

        .listing-macronutrients-wrapper .macronutrients-container .macronutrients-item .macronutrients-item-info {
            position: relative;
            display: block;
            border-radius: 100%;
            border: 2px solid var(--primary-color);
            width: 37px;
            height: 37px;
            line-height: 39px;
            font-size: 11px;
            margin-bottom: 7px;
            text-align: center;
            padding: 2px;
        }

        .listing-macronutrients-wrapper .macronutrients-container .macronutrients-item .macronutrients-item-title {
            font-weight: bold;
            font-size: 14px;
            color: #444;
            position: relative;
            display: block
        }

        .addtobagbtn::before {
            content: attr(data-nbofcalories);
            position: fixed;
            left: 22px;
            font-weight: 700;
            opacity: 1;
            color: #fff;
            height: 58px;
            line-height: 59px;
            font-size: 13px;
            z-index: 3;
            letter-spacing: 0;
            transition: all .5s linear 0s;
            transform: translateY(100px);
        }

        .addtobagbtn.show::before {
            transition: all 1s linear .5s;
            transform: translateY(0px);
            pointer-events: none;
            opacity: .7 !important
        }

        .customizedID .listing-nutrition-facts-wrapper .ingredients-container .ingredient-item {
            width: 24px;
            height: 24px
        }

        .customizedID .listing-nutrition-facts-wrapper .ingredients-container .ingredient-item img {
            width: 24px
        }

        #ingredientsModalID {
            height: 340px;
            border-radius: 4%;
            overflow: visible;
            z-index: 1000;
            top: 50%;
            left: 50%;
            width: 330px !important;
            transform: translate3d(-50%, -50%, 0px) !important
        }

        #ingredientsModalID .parts {
            height: auto;
            border-radius: 12px;
            min-height: 237px !important
        }

        #ingredientsModalID .parts .part {
            padding: 0
        }

        #ingredientsModalID .parts .part .wrap {
            padding-top: 10px
        }

        #ingredientsModalID .product-title {
            position: relative;
            display: block;
            font-weight: bold;
            font-size: 19px;
            margin-bottom: 20px
        }

        #ingredientsModalID .product-sub-title {
            position: relative;
            display: block;
            margin-top: 25px;
            font-size: 14px;
            margin-bottom: 10px;
            font-weight: bold
        }

        #ingredientsModalID .close-btn {
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            text-align: center;
            height: 37px;
            border-top: 1px solid #efefef;
            padding-top: 18px;
            color: var(--primary-color);
            text-transform: uppercase;
            cursor: pointer;
            font-size: 16px;
            font-weight: bold
        }

        .ingredients-listing-container {
            position: relative;
            display: flex;
            justify-content: flex-start
        }

        .ingredients-listing-container .ingredient-item {
            position: relative;
            display: flex;
            text-align: center;
            flex-direction: column;
            align-items: center;
            margin-right: 16px
        }

        .ingredients-listing-container .ingredient-item img {
            width: 45px;
            position: relative;
            display: block
        }

        .ingredients-listing-container .ingredient-item span {
            position: relative;
            display: block;
            font-size: 11px;
            margin-top: 5px
        }

        .rtl.market.large-menu-img .itemsList .itemGrid .descBlock .title {
            text-align: right
        }

        .rtl.market.large-menu-img .itemsList .itemGrid .descBlock .title {
            text-align: right
        }

        .rtl.market .customizedID .data .title {
            text-align: right
        }

        .rtl.market .customizedID .data .sku {
            text-align: right
        }

        .rtl.market .customizedID.largetxt .data .pwrap {
            text-align: right
        }

        .rtl.market .noCustomization.largetxt .cont .description {
            text-align: right;
            direction: rtl
        }

        .column_cust .formPart .input.disabled {
            opacity: .5
        }

        .column_cust .formPart .input.disabled.checked {
            opacity: 1
        }

        span.caladd {
            float: right;
            padding-left: 15px;
            font-size: 12px !important;
            color: #333 !important
        }

        span.caladd {
            float: right;
            padding-left: 15px;
            display: none;
            color: #333 !important
        }

        .input.checked span.caladd {
            display: block
        }

        .retail .input.checked span.caladd {
            display: none
        }

        body.show-inner-popup #popupID::after {
            content: " ";
            width: 100%;
            height: 100vh;
            position: fixed;
            left: 0;
            top: 0;
            background-color: rgba(0, 0, 0, 0.376);
            z-index: 9
        }

        body.show-inner-popup {
            overflow: hidden !important
        }

        body.show-inner-popup::after {
            content: " ";
            width: 100%;
            height: 96px;
            position: fixed;
            left: 0;
            bottom: 0;
            background-color: rgba(0, 0, 0, 0.376);
            z-index: 10000
        }

        body.show-inner-popup #customizedModalID {
            max-height: calc(100vh - 54px);
            overflow: hidden
        }

        body.show-inner-popup #popupID {
            overflow: hidden
        }

        #ingredientsModalID {
            transform: translate3d(-50%, -50%, 0px) !important
        }

        body.show-inner-popup::after {
            display: none
        }

        body.show-inner-popup {
            max-height: calc(100vh - 5px)
        }

        .ingredients-listing-container .ingredient-item img {
            width: 40px
        }

        .ingredients-listing-container .ingredient-item span {
            font-size: 10px
        }

        #ingredientsModalID .product-title {
            font-size: 17px
        }

        #ingredientsModalID .product-sub-title {
            position: relative;
            display: block;
            margin-top: 18px;
            font-size: 12px;
            margin-bottom: 8px;
            font-weight: bold
        }

        .menuontop .MenuParts .bag {
            display: none
        }

        .menuontop .MenuParts .bag.minicv {
            display: block;
            margin-right: -11px
        }

        #ingredientsModalID .parts .part .wrap {
            padding-top: 0
        }

        #ingredientsModalID .parts {
            min-height: 250px !important
        }

        #ingredientsModalID .close-btn {
            padding-top: 20px;
            font-size: 14px
        }

        .productpage .meta .price {
            box-shadow: none;
            padding-left: 0px;
            font-size: 16px;
            font-weight: bold;
            margin-top: 1px;
            margin-bottom: 19px;
        }

        .productpage .relations .title {
            font-family: titlefont;
            font-size: 31px;
            font-weight: 600 !important
        }

        .productpage .meta .title {
            font-family: titlefont;
            font-size: 37px;
            margin-bottom: -4px;
            font-weight: 600;
            line-height: 38px;
        }

        .menuontop .deskmenu li a span {
            font-weight: bold;
            display: inline-block;
            position: relative;
            font-size: 15px !important
        }

        .menuontop .titleAndLegend .title {
            font-family: titlefont, serif;
            text-transform: uppercase;
            font-size: 35px;
            font-weight: normal !important
        }

        .menuontop .d-w,
        .menuontop .priceWrap {
            margin-left: -8px
        }

        .menuontop .titleAndLegend .title {
            font-family: titlefont, serif;
            text-transform: uppercase;
            font-size: 35px;
            font-weight: normal !important
        }

        .menuontop .d-w,
        .menuontop .priceWrap {
            margin-left: -9px;
        }

        .menuontop main.content {
            background-color: #fff
        }

        .relationsinline .itemGrid .wrap {
            height: 100%
        }

        p.instagram_username::before {
            background-image: url("../images/instagram.png");
            width: 11px;
            height: 11px;
            display: inline-block;
            background-size: cover;
            filter: invert(1);
            padding: 7px;
            position: absolute;
            left: -42px;
            top: 5px;
            content: "" !important
        }

        p.instagram_username {
            position: relative;
            display: inline-block
        }

        p.instagram_username a {
            text-decoration: none;
            color: #333;
            border-bottom: 1px dotted #ccc
        }

        div#instagramfeed {
            background-color: #f8f8f8;
        }

        img.instagram_profile_image {
            display: none
        }

        .instagram_profile {
            padding-top: 39px;
            padding-bottom: 32px;
            font-size: 24px
        }

        .subPage #instagramfeed {
            display: none
        }

        .instagram_gallery {
            width: calc(100% - 600px);
            margin: auto
        }

        .menuontop .instagram_gallery {
            max-width: 1200px;
            margin: auto
        }

        .price.nearadd {
            display: none
        }

        .classicproduct .price.nearadd {
            position: relative;
            display: inline-block;
            width: 138px;
            height: 48px;
            background: #fff;
            border: 1px solid var(--primary-color);
            margin-top: 0;
            flex-shrink: 0;
            text-align: center
        }

        .price.nearadd.price-lastitem::before {
            content: attr(data-last-item);
            text-align: center;
            line-height: 46px;
            text-transform: uppercase;
            font-size: 13px;
            font-weight: bold
        }

        .price.nearadd.price-lastitem .tinyselect {
            display: none
        }

        .price.nearadd .tinyselect {
            display: block;
            margin-top: 11px;
            left: 8px
        }

        .price.nearadd .tinyselect .fieldPlus {
            background-color: transparent
        }

        .genbtnw {
            display: flex;
            width: 100%
        }

        .relationsinline li.itemGrid {
            height: 66px !important;
            display: inline-flex;
            width: 100px !important;
        }

        .productpage .relationsinline.ng-scope {
            min-height: 170px
        }

        .productpage .relationsinline {
            min-height: 121px
        }

        .signupform {
            margin-top: -19px
        }

        .signupform .normalForm {
            margin-top: 22px
        }

        .signupform .wrap {
            display: flex;
            flex-wrap: wrap;
            margin: 0 !important;
            width: 100% !important
        }

        .signupform .genBtn {
            background-color: #fff;
            width: 100%;
            border-radius: 0;
            height: 173px;
            color: #000;
            text-transform: lowercase;
            letter-spacing: normal;
            padding-top: 58px
        }

        .signupform .genBtn::before {
            visibility: visible;
            content: "+";
            position: absolute;
            background-color: #000;
            width: 40px;
            height: 40px;
            text-align: center;
            border-radius: 100%;
            font-size: 22px;
            line-height: 38px;
            box-sizing: border-box;
            top: 55px;
            color: #fff;
            padding-left: 1px !important;
            font-family: arial, sans-serif;
            font-weight: bold;
        }

        .signupform .genBtn: hover::before {
            background-color: var(--primary-color)
        }

        .loginbut {
            background-color: #fff;
            width: 150px;
            height: 43px;
            line-height: 43px;
            position: relative;
            padding-left: 42px;
            padding-right: 12px;
            border-radius: 6px;
            margin-bottom: 23px;
            cursor: pointer
        }

        .loginbut i {
            margin-right: 10px;
            font-size: 25px;
            line-height: 44px;
            position: absolute;
            left: 13px
        }

        .loginor {
            color: #333;
            padding-bottom: 12px;
            text-align: right;
            font-size: 15px;
            margin-top: -68px;
            position: absolute;
            right: 5px;
        }

        .retail .loginor {
            margin-top: -71px;
        }

        .fnb .loginor {
            margin-top: -69px;
        }

        .right.rBox .loginor {
            position: relative;
            margin-top: 0px;
            display: none;
        }

        .loginor span:last-child {
            color: var(--primary-color);
            margin-left: 7px;
            font-weight: bold;
            border-bottom: 1px dashed;
            padding-bottom: 6px;
            cursor: pointer;
        }

        .rtl .loginor span:last-child {
            margin-right: 7px;
        }

        @media(min-width:1600px) and (max-width:1800px) {
            .menuontop .checkoutID .content {
                margin: 56px auto auto;
                width: calc(100% - 602px) !important
            }
        }

        .relationsinline .related-items {
            display: none
        }

        .relationsinline .related-items[ data-group~="Colors"],
        .relationsinline .related-items[data-group~="Color"],
        .relationsinline .related-items[data-group~="colors"],
        .relationsinline .related-items[data-group~="color"] {
            display: block
        }

        .relationsinline .related-items {
            display: none
        }

        .relations .related-items[ data-group~="Colors"],
        .relations .related-items[data-group~="Color"],
        .relations .related-items[data-group~="colors"],
        .relation .related-items[data-group~="color"] {
            display: none;
        }

        .reviewbagbut {
            display: none
        }

        .reviewbagbut {
            position: absolute;
            bottom: 79px;
            text-align: center;
            width: auto;
            font-size: 15px;
            border-bottom: 1px dotted #666;
            left: 50%;
            transform: translateX(-50%);
            height: 23px;
            cursor: pointer;
            display: block
        }

        .reviewbagbut {
            position: absolute;
            top: 34px;
            border-bottom: 1px dashed #666;
            text-decoration: none;
            padding-bottom: 8px;
            width: auto;
            overflow: visible;
            display: inline;
            color: #666;
            font-size: 9px;
            text-transform: uppercase;
            height: 12px;
            transform: none;
            left: 13px
        }

        .orderdetails .reviewbagbut {
            display: none
        }

        .checkoutID .reviewbagbut {
            bottom: 20px
        }

        .reviewbag .reviewbagbut {
            display: none !important
        }

        .continueshoppingbut {
            position: absolute;
            right: 300px;
            width: 246px;
            height: 55px;
            background-color: #fff;
            border: 1px solid #ddd;
            bottom: 8px;
            border-radius: 6px;
            text-align: center;
            line-height: 53px;
            cursor: pointer;
            display: none !important
        }

        .reviewbag .continueshoppingbut {
            display: block !important
        }

        .password-field .label {
            margin-right: 22px
        }

        .rtl .password-field .label {
            margin-left: 22px;
            margin-right: 0px;
        }

        .password-field i.zmdi {
            position: absolute;
            right: 8px;
            cursor: pointer
        }

        .rtl .password-field i.zmdi {
            left: 8px;
            right: autopx;
        }

        .signupform .password-field i.zmdi {
            right: 18px
        }

        .rtl .signupform .password-field i.zmdi {
            left: 18px;
            right: auto;
        }

        h1.metadesc {
            display: none
        }

        .myAccountPid .whiteBox .boxes .box.removeMap {
            min-height: 202px !important
        }

        .whiteBox .boxes.deliverBoxID .box.removeMap .top {
            margin-top: 33px
        }

        input:focus::placeholder {
            color: #f7f7f7 !important
        }

        .p-t-25 {
            padding-top: 25px
        }

        .custom-max.highlighted {
            color: rgba(255, 0, 0, 0.73)
        }

        .lp-points-container.disabled::after {
            content: "";
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: #fff;
            opacity: .5
        }

        .lp-redeemable-amount.disabled,
        .lp-points-container.disabled {
            pointer-events: none
        }

        .rd-redeem-wrapper {
            margin-top: 25px
        }

        .rd-redeem-wrapper .rd-title {
            margin-top: 25px;
            margin-bottom: 0
        }

        .rd-redeem-wrapper .rd-sub-title {
            display: block;
            font-size: 13px;
            color: #333;
            margin-top: 6px;
            font-family: textfont;
            font-weight: bold
        }

        .rd-redeem-wrapper .rd-redeem-items {
            position: relative;
            margin-top: 15px;
            display: block;
            flex-direction: row;
            width: 100%;
            overflow: auto;
            padding-bottom: 20px;
            white-space: nowrap
        }

        .rd-redeem-wrapper .rd-redeem-items .rd-redeem-item {
            position: relative;
            border: 5px solid var(--primary-color);
            border-radius: 10px;
            background-color: #fff;
            width: calc(100% - 115px);
            margin-right: 20px;
            list-style: none;
            display: inline-block;
            max-width: 250px
        }

        .rd-redeem-wrapper .rd-redeem-items .rd-redeem-item: first-child {
            margin-left: 20px
        }

        .rd-redeem-wrapper .rd-redeem-items .rd-redeem-item.disabled::after {
            content: "";
            position: absolute;
            left: -5px;
            top: -5px;
            width: calc(100% + 10px);
            height: calc(100% + 10px);
            background-color: rgba(255, 255, 255, 0.463)
        }

        .rd-redeem-wrapper .rd-redeem-items .rd-redeem-item .rd-redeem-item-title {
            position: relative;
            display: block;
            width: 140px;
            margin: 17px auto 13px;
            font-size: 17px;
            text-transform: uppercase;
            white-space: pre-wrap;
            text-align: center
        }

        .rd-redeem-wrapper .rd-redeem-items .rd-redeem-item .rd-redeem-item-points {
            position: relative;
            display: block;
            margin-left: auto;
            margin-right: auto;
            color: var(--primary-color);
            text-transform: lowercase;
            font-size: 17px;
            margin-bottom: 10px
        }

        .rd-redeem-wrapper .rd-redeem-items .rd-redeem-item .rd-redeem-item-btn {
            position: relative;
            display: block;
            cursor: pointer;
            font-size: 15px;
            color: #fff;
            background-color: var(--primary-color);
            margin-left: auto;
            margin-right: auto;
            width: 120px;
            padding: 10px;
            border-radius: 6px;
            margin-bottom: 12px
        }

        .rd-redeem-wrapper .rd-redeem-items .rd-redeem-item .rd-redeem-item-btn.loading {
            opacity: .4;
            pointer-events: none
        }

        .rd-title.has-redeem-options {
            margin-top: 18px
        }

        @media(min-width:769px) {
            .rd-redeem-wrapper .rd-redeem-items {
                overflow: visible;
                white-space: unset
            }

            .rd-redeem-wrapper .rd-redeem-items .rd-redeem-item {
                margin-bottom: 20px
            }

            .rd-redeem-wrapper .rd-redeem-items .rd-redeem-item: first-child {
                margin-left: 0
            }
        }

        .market div#customizedModalID.noCustomization {
            max-width: 600px;
        }

        .market .deskmenu .menu li.colle a {
            font-size: 16px
        }

        .market .customizedID .backg {
            max-height: 360px;
            width: auto;
        }

        .market .customizedID.largetxt .backg {
            max-height: none;
            width: 100%
        }



        @media(max-width:768px) {
            .cordova .giftcards {
                height: calc(100vh - 131px)
            }

            .cordova .giftcards .content {
                height: calc(100vh - 131px)
            }

            .giftcards {
                min-height: 0;
                height: calc(100vh - 118px)
            }

            .cordova .giftcards .gc-top-part {
                /* height: calc(100vh - 452px) */
            }

            .cordova .giftcards .gc-big-top .gc-top-part {
                height: calc(100vh - 398px)
            }

            .giftcards .gc-top-part .gc-sub-title {
                max-width: 300px;
                line-height: 20px
            }

            .giftcards .gc-top-part .gc-list-wrapper .gc-list-item {
                width: calc(50% - 22px)
            }

            .giftcards .gc-top-part .gc-list-wrapper .gc-list-item.custom-amount-wrapper {
                width: calc(50% - 20px)
            }

            .market.cols3mob .homePid .ymlike .itemGrid {
                width: calc(33vw - 2px) !important
            }
        }

        .giftcards .gc-payments-wrapper {
            position: fixed;
            bottom: -5000px;
            left: 0;
            width: calc(100% - 30px);
            background-color: #fff;
            padding: 25px 15px 92px;
            box-shadow: #000 0 0 10px -6px;
            z-index: 10;
            transition: bottom .5s ease-out 0s
        }

        .giftcards .gc-payments-wrapper .gc-close {
            position: absolute;
            display: block;
            margin-left: auto;
            margin-right: auto;
            width: 36px;
            height: 36px;
            font-size: 33px;
            left: calc(50% - 18px);
            top: -48px;
            color: #fff;
            text-align: center;
            cursor: pointer
        }

        .giftcards .gc-payments-wrapper .gc-title {
            text-align: center;
            margin-bottom: 21px;
            color: #4d4d4c;
            font-size: 22px
        }

        .giftcards .gc-payments-wrapper .gc-payments-items {
            position: relative;
            display: block;
            list-style: none
        }

        .giftcards .gc-payments-wrapper .gc-payments-items .gc-payments-item {
            position: relative;
            display: block;
            font-size: 15px;
            padding-bottom: 8px;
            padding-top: 8px;
            margin-bottom: 10px;
            border-radius: 4px;
            padding-left: 12px;
            color: #333;
            border: 1px solid var(--primary-color);
            font-weight: bold;
            cursor: pointer
        }

        .giftcards .gc-shadow {
            position: fixed;
            left: 0;
            top: -50000px;
            width: 100%;
            height: 100vh;
            background: #000;
            z-index: 9;
            opacity: 0;
            transition: opacity 1s ease-out 0s
        }

        .giftcards .gc-shadow.show {
            top: 0;
            opacity: .8;
            transition: opacity .6s ease-out 0s
        }

        .giftcards .gc-payments-wrapper.show {
            bottom: 0;
            transition: bottom .6s ease-out 0s
        }

        .giftcards .gcr-top-part {
            position: relative;
            display: block;
            padding-top: 45px;
            height: calc(100vh - 300px);
            overflow: auto;
            text-align: center
        }

        .giftcards .gc-title {
            position: relative;
            display: block;
            font-size: 23px;
            font-weight: bold;
            color: #000
        }

        .giftcards .gc-top-part {
            position: relative;
            display: block;
            padding-left: 13px;
            padding-top: 20px;
        }

        .giftcards .gc-big-top .gc-top-part {
            height: calc(100vh - 385px)
        }

        .giftcards .hosted-session-big-wrapper.gc-big-top .gc-top-part {
            height: calc(100vh - 470px)
        }

        .giftcards .gc-top-part .gc-sub-title {
            position: relative;
            display: block;
            font-size: 14px;
            color: rgba(119, 119, 119, 0.81);
            margin-top: 5px
        }

        .giftcards .gc-top-part .gc-list-wrapper {
            position: relative;
            list-style: none;
            display: flex;
            margin-top: 12px;
            flex-wrap: wrap;
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item {
            position: relative;
            width: 161px;
            height: 94px;
            border: 1px solid #eee;
            background-color: #f8f8f8;
            margin-right: 13px;
            margin-bottom: 15px;
            border-radius: 10px;
            box-sizing: border-box;
            background-repeat: no-repeat;
            background-position: center;
            background-size: cover;
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item.selected {
            border: 2px solid var(--primary-color)
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-check {
            position: absolute;
            right: 10px;
            height: 15px;
            width: 15px;
            top: 10px
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-check .zmdi {
            position: relative;
            display: block;
            font-size: 21px
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-check .zmdi-circle-o {
            color: #777
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-check .zmdi-check-circle {
            display: none
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item.selected .gc-check .zmdi-circle-o {
            display: none
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item.selected .gc-check .zmdi-check-circle {
            display: block;
            color: var(--primary-color)
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-amount-wrapper {
            position: absolute;
            left: -1px;
            top: 55px
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-custom-amount-title {
            display: none
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-amount-wrapper .gc-custom-amount {
            content: "";
            position: relative;
            display: inline-block;
            height: 23px;
            width: 48px;
            background-color: #ddd;
            vertical-align: middle
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-amount-wrapper .gc-custom-amount input {
            position: relative;
            display: block;
            border: 0;
            height: calc(100% - 4px);
            width: calc(100% - 12px);
            background: transparent;
            font-size: 19px;
            font-weight: bold;
            padding: 2px 6px;
            overflow: hidden;
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item.selected .gc-amount-wrapper .gc-custom-amount {
            background-color: var(--primary-color)
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-amount-wrapper .gc-amount {
            position: relative;
            display: inline-block;
            vertical-align: middle;
            font-size: 16px;
            font-weight: bold;
            line-height: 23px;
            margin-left: 4px
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item.custom-amount-wrapper {
            width: 163px;
            height: 96px;
            background: transparent;
            border: 1px dashed var(--primary-color) !important;
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item.custom-amount-wrapper .gc-custom-amount-title {
            display: block;
            position: relative;
            font-weight: bold;
            font-size: 16px;
            color: #4a4a4a;
            margin-top: 8px;
            margin-left: 10px;
            max-width: 94px;
            line-height: 16px;
            text-transform: lowercase
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item.custom-amount-wrapper .gc-amount-wrapper {
            left: 10px;
            top: 50px
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item.custom-amount-wrapper .gc-amount-wrapper .gc-amount {
            color: #666
        }

        .giftcards .gc-top-part .gc-list-wrapper .gc-list-item.custom-amount-wrapper .gc-amount-wrapper .gc-custom-amount {
            height: 33px;
            width: 100px;
            background: #eee;
            min-width: 80px;
        }

        .giftcards .gc-bottom-part {
            position: relative;
            width: calc(100% - 31px);
            padding-left: 15px;
            padding-right: 15px;
            bottom: 0;
            left: 0;
            background: #fff;
            padding-bottom: 12px;
        }

        .giftcards .gc-big-top .gc-bottom-part {
            min-height: 250px
        }

        .giftcards .hosted-session-big-wrapper.gc-big-top .gc-bottom-part {
            min-height: 335px
        }

        .giftcards .gc-bottom-part .gc-message-wrapper {
            height: 70px;
            border-bottom: 1px solid #efefef;
            margin-bottom: 15px
        }

        .giftcards .gc-bottom-part .gc-message-wrapper textarea {
            height: calc(100% - 25px);
            width: 100%;
            border: 0;
            color: #333;
            padding-top: 25px;
            font-size: 13px
        }

        .giftcards .gc-bottom-part .gc-message-wrapper textarea::placeholder {
            color: #666
        }

        .giftcards .gc-bottom-part .gc-title {
            margin-bottom: 15px
        }

        .giftcards .gc-bottom-part .gc-mobile-wrapper {
            position: relative;
            display: block;
            height: 45px;
            background-color: #f7f7f7;
            font-weight: bold;
            border-radius: 4px;
            margin-bottom: 10px;
            border-bottom: 1px solid #ececec;
            max-width: 400px
        }

        .giftcards .gc-bottom-part .gc-mobile-wrapper .iti {
            position: relative;
            display: block;
            width: calc(100% - 8px);
            height: 100%;
            border: 0;
            background: transparent;
            padding-left: 8px
        }

        .giftcards .gc-bottom-part .gc-mobile-wrapper .iti label.missing {
            right: 8px
        }

        .giftcards .gc-bottom-part .gc-mobile-wrapper .iti input {
            position: relative;
            display: block;
            border: 0;
            background-color: transparent;
            width: 100%;
            font-size: 13px;
            top: 15px;
        }

        .giftcards .gc-bottom-part .gc-email-wrapper {
            position: relative;
            display: block;
            height: 45px;
            background-color: #f7f7f7;
            font-weight: bold;
            border-radius: 4px;
            margin-bottom: 15px;
            border-bottom: 1px solid #ececec;
            max-width: 400px
        }

        .giftcards .gc-bottom-part .gc-email-wrapper input {
            position: relative;
            display: block;
            width: calc(100% - 30px);
            height: 100%;
            border: 0;
            background: transparent;
            padding-left: 15px;
            padding-right: 15px;
            font-size: 13px
        }

        .giftcards .gc-bottom-part .gc-button {
            position: relative;
            display: block;
            text-align: center;
            height: 52px;
            background-color: var(--primary-color);
            text-transform: uppercase;
            font-weight: bold;
            font-size: 16px;
            color: #fff;
            padding-top: 0;
            border-radius: 4px;
            border: 0;
            width: 100%;
            cursor: pointer;
            max-width: 400px;
            margin-top: 18px;
            margin-bottom: 30px
        }

        .giftcards .gc-bottom-part .gc-button.loading {
            opacity: .5;
            pointer-events: none
        }

        @media(max-width:768px) {
            .cordova .giftcards {
                height: calc(100vh - 131px)
            }

            .cordova .giftcards .content {
                height: calc(100vh - 131px)
            }

            .giftcards {
                min-height: 0;
                height: calc(100vh - 118px)
            }

            .cordova .giftcards .gc-top-part {
                /* height: calc(100vh - 452px) */
            }

            .cordova .giftcards .gc-big-top .gc-top-part {
                height: calc(100vh - 398px)
            }

            .giftcards .gc-top-part .gc-sub-title {
                max-width: 300px;
                line-height: 18px
            }

            .giftcards .gc-top-part .gc-list-wrapper .gc-list-item {
                width: calc(50% - 15px)
            }

            .giftcards .gc-top-part .gc-list-wrapper .gc-list-item.custom-amount-wrapper {
                width: calc(50% - 20px)
            }

            .market.cols3mob .homePid .ymlike .itemGrid {
                width: calc(33vw - 2px) !important
            }
        }

        .giftcards .gc-payments-wrapper {
            position: fixed;
            bottom: -5000px;
            left: 0;
            width: calc(100% - 30px);
            background-color: #fff;
            padding: 25px 15px 92px;
            box-shadow: #000 0 0 10px -6px;
            z-index: 10;
            transition: bottom .5s ease-out 0s
        }

        .giftcards .gc-payments-wrapper .gc-close {
            position: absolute;
            display: block;
            margin-left: auto;
            margin-right: auto;
            width: 36px;
            height: 36px;
            font-size: 33px;
            left: calc(50% - 18px);
            top: -48px;
            color: #fff;
            text-align: center;
            cursor: pointer
        }

        .giftcards .gc-payments-wrapper .gc-title {
            text-align: center;
            margin-bottom: 21px;
            color: #4d4d4c;
            font-size: 22px
        }

        .giftcards .gc-payments-wrapper .gc-payments-items {
            position: relative;
            display: block;
            list-style: none
        }

        .giftcards .gc-payments-wrapper .gc-payments-items .gc-payments-item {
            position: relative;
            display: block;
            font-size: 15px;
            padding-bottom: 8px;
            padding-top: 8px;
            margin-bottom: 10px;
            border-radius: 4px;
            padding-left: 12px;
            color: #333;
            border: 1px solid var(--primary-color);
            font-weight: bold;
            cursor: pointer
        }

        .giftcards .gc-shadow {
            position: fixed;
            left: 0;
            top: -50000px;
            width: 100%;
            height: 100vh;
            background: #000;
            z-index: 9;
            opacity: 0;
            transition: opacity 1s ease-out 0s
        }

        .giftcards .gc-shadow.show {
            top: 0;
            opacity: .8;
            transition: opacity .6s ease-out 0s
        }

        .giftcards .gc-payments-wrapper.show {
            bottom: 0;
            transition: bottom .6s ease-out 0s
        }

        .giftcards .gcr-top-part {
            position: relative;
            display: block;
            padding-top: 45px;
            height: calc(100vh - 300px);
            overflow: auto;
            text-align: center
        }

        .giftcards .gcr-top-part .gcr-title {
            position: relative;
            display: block;
            font-size: 23px;
            font-weight: bold;
            color: #000;
            width: 190px;
            margin-left: auto;
            margin-right: auto
        }

        .giftcards .gcr-top-part .gcr-sub-title {
            position: relative;
            display: block;
            font-size: 14px;
            color: rgba(119, 119, 119, 0.81);
            margin-top: 8px;
            width: 210px;
            margin-left: auto;
            margin-right: auto
        }

        .giftcards .gcr-top-part .gcr-envelope {
            position: absolute;
            display: block;
            width: 209px;
            background-image: url("../images/envelope-back.png");
            height: 190px;
            background-position: center center;
            left: 50%;
            top: calc(50% + 55px);
            transform: translate(-50%, -50%);
        }

        .giftcards .gcr-top-part .gcr-envelope::after {
            content: "";
            position: absolute;
            width: 209px;
            background-image: url("../images/envelope-front.png");
            height: 106px;
            background-position: center center;
            left: 0;
            bottom: 0;
        }

        .giftcards .gcr-top-part .gcr-envelope .gcr-item {
            position: absolute;
            width: 161px;
            height: 94px;
            border: 2px solid var(--primary-color);
            background-color: #eee;
            border-radius: 10px;
            left: 50%;
            bottom: 66px;
            transform: translateX(-50%)
        }

        .giftcards .gcr-top-part .gcr-envelope .gcr-item::before {
            font-family: Material-Design-Iconic-Font;
            content: "\F1BC";
            transform: rotate(90deg);
            position: absolute;
            font-size: 24px;
            top: -14px;
            right: 22px;
            color: var(--primary-color)
        }

        .giftcards .gcr-top-part .gcr-envelope .gcr-item .gcr-amount-wrapper {
            position: absolute;
            left: -2px;
            top: 55px
        }

        .giftcards .gcr-top-part .gcr-envelope .gcr-item .gcr-amount-wrapper .gcr-custom-amount {
            position: relative;
            display: inline-block;
            height: 23px;
            width: 50px;
            background-color: var(--primary-color);
            vertical-align: middle
        }

        .giftcards .gcr-top-part .gcr-envelope .gcr-item .gcr-amount-wrapper .gcr-amount {
            position: relative;
            display: inline-block;
            vertical-align: middle;
            font-size: 17px;
            font-weight: bold;
            line-height: 23px;
            margin-left: 4px;
            color: #666
        }

        .giftcards .gcr-bottom-part {
            text-align: center;
            position: relative
        }

        .giftcards .gcr-bottom-part .gcr-sub-title {
            position: relative;
            display: block;
            font-size: 14px;
            color: rgba(119, 119, 119, 0.81);
            margin-top: 8px;
            margin-left: auto;
            margin-right: auto;
            padding-left: 25px;
            padding-right: 25px;
            text-align: center
        }

        .giftcards .gcr-bottom-part .gcr-buttons-wrapper {
            position: relative;
            display: block;
            margin-top: 22px
        }

        .giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-button {
            position: relative;
            display: inline-block;
            width: 140px;
            height: 30px;
            border: 1px solid var(--primary-color);
            text-align: center;
            text-transform: uppercase;
            font-size: 16px;
            font-weight: bold;
            padding-top: 4px;
            border-radius: 5px;
            cursor: pointer;
            vertical-align: top;
            padding-bottom: 6px
        }

        .giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-button-copy {
            color: var(--primary-color);
            background-color: #fff;
            padding-top: 9px;
            padding-bottom: 2px
        }

        .giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-button-copy::before {
            display: none;
            position: absolute;
            z-index: 1000001;
            height: 5px;
            color: rgba(0, 0, 0, 0.8);
            pointer-events: none;
            content: "";
            top: -7px;
            right: calc(50% - 5px);
            clear: both;
            border-left: 5px solid transparent;
            border-right: 5px solid transparent;
            border-top: 5px solid #000
        }

        .giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-button-copy::after {
            display: none;
            position: absolute;
            font-size: 12px;
            z-index: 1000000;
            padding: 5px 8px;
            color: #fff;
            text-align: center;
            text-decoration: none;
            text-shadow: none;
            text-transform: none;
            letter-spacing: normal;
            overflow-wrap: break-word;
            white-space: pre;
            pointer-events: none;
            content: attr(aria-label);
            background: rgba(0, 0, 0, 0.8);
            border-radius: 3px;
            -webkit-font-smoothing: subpixel-antialiased;
            top: -36px;
            right: 50%;
            margin-top: 5px;
            transform: translateX(50%);
            font-weight: normal
        }

        .giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-button-copy.tooltipped::before {
            display: inline-block;
            text-decoration: none
        }

        .giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-button-copy.tooltipped::after {
            display: block
        }

        .giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-button-share {
            margin-right: 15px;
            color: #fff;
            background-color: var(--primary-color);
            padding-top: 0;
            height: 35px
        }

        .giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-button-share .gcr-share-inner-btn {
            position: relative;
            display: block;
            padding-top: 10px;
            padding-bottom: 10px
        }

        .giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-sharing-options {
            visibility: hidden;
            opacity: 0;
            position: absolute;
            transition: opacity .5s linear 0s;
            width: 190px;
            left: -25px;
            top: -62px;
            background-color: #fafafa;
            border-radius: 4px
        }

        .giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-sharing-options.show {
            visibility: visible;
            opacity: 1;
            transition: opacity .5s linear 0s
        }

        .giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-sharing-options::before {
            content: "";
            position: absolute;
            width: 0;
            height: 0;
            left: calc(50% - 7px);
            bottom: -7px;
            border-left: 7px solid transparent;
            border-right: 7px solid transparent;
            border-top: 7px solid #fafafa;
            clear: both
        }

        .giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-sharing-options .resp-sharing-button__link {
            text-decoration: none;
            color: #fff;
            margin: .5em
        }

        @media(max-width:768px) {
            .giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-sharing-options {
                display: none
            }
        }

        @media(min-width:769px) {
            .giftcards .gc-payments-wrapper {
                bottom: unset;
                max-width: 400px;
                border-radius: 8px;
                left: 50%;
                padding-bottom: 40px;
                height: auto;
                transform: translate3d(-50%, -50%, 0);
                transition: all 0s ease-out 0s;
                top: 5000px
            }

            .giftcards .gc-payments-wrapper.show {
                top: 50%;
                bottom: unset;
                transition: all .8s ease-out 0s
            }

            .giftcards .gc-shadow.show {
                transition: opacity .3s ease-out 0s
            }

            .giftcards .gcr-top-part {
                height: 340px
            }

            .giftcards .gc-top-part {
                height: auto !important;
                margin-bottom: 16px
            }

            .giftcards .gc-bottom-part {
                position: relative;
                bottom: unset;
                left: unset;
                background-color: transparent
            }

            .giftcards .gc-bottom-part .gc-mobile-wrapper {
                max-width: none;
                width: calc(50% - 5px);
                float: left;
                margin-right: 5px
            }

            .giftcards .gcr-top-part .gcr-envelope {
                position: relative;
                transform: unset;
                top: unset;
                left: unset;
                display: block;
                margin-left: auto;
                margin-right: auto;
                margin-top: 15px
            }
        }

        .order-from-table-section {
            position: relative;
            display: block;
            text-align: center;
            background-color: #fff
        }

        .order-from-table-section .oft-title {
            position: relative;
            display: block;
            margin-top: calc(20vh);
            font-size: 23px;
            font-weight: bold;
            padding-left: 20px;
            padding-right: 20px
        }

        .order-from-table-section .oft-details-container {
            position: relative;
            display: block;
            margin-top: 28px
        }

        .order-from-table-section .oft-details-container .oft-table-title {
            position: relative;
            display: block;
            color: #777;
            font-size: 18px;
            font-weight: bold
        }

        .order-from-table-section .oft-details-container .oft-table-title::after {
            content: "";
            position: relative;
            display: block;
            height: 1px;
            background-color: #ddd;
            width: 215px;
            margin: 10px auto
        }

        .order-from-table-section .oft-details-container .oft-table-name {
            position: relative;
            display: block;
            color: #777;
            font-size: 24px
        }

        .order-from-table-section .oft-description {
            margin-top: 65px;
            position: relative;
            display: block;
            color: #777;
            font-size: 14px;
            margin-bottom: 45px
        }

        .order-from-table-section .oft-button {
            position: relative;
            display: block;
            margin-top: 20px;
            margin-left: auto;
            margin-right: auto;
            height: 35px;
            width: 185px;
            background-color: var(--primary-color);
            color: #fff;
            border-radius: 5px;
            font-size: 15px;
            font-weight: bold;
            padding-top: 15px;
            text-transform: uppercase;
            cursor: pointer
        }

        .order-from-table-section .oft-button-cancel {
            position: fixed;
            margin-left: auto;
            margin-right: auto;
            font-size: 13px;
            color: #999;
            border-bottom: 1px solid #999;
            width: 52px;
            text-align: center;
            bottom: 30px;
            left: calc(50% - 26px);
            text-transform: capitalize;
            text-decoration: none;
            z-index: 30
        }

        .has-oft .accname {
            display: none
        }

        .oft-head-container {
            left: 50%;
            transform: translateX(-50%);
            top: 0;
            text-align: center;
            display: none;
            font-size: 13px;
            position: absolute;
            cursor: pointer
        }

        .has-oft .oft-head-container {
            display: block
        }

        .oft-head-container .oft-head-title {
            color: #fff;
            width: 100%;
            border-bottom: 1px dashed #fff;
            box-sizing: border-box;
            height: 20px;
            line-height: 20px;
            padding-left: 5px;
            text-transform: uppercase;
            font-size: 13px;
            padding-right: 5px;
            margin-bottom: 3px
        }

        .oft-head-container .oft-head-subtitle {
            display: inline-block;
            color: var(--primary-color);
            box-sizing: border-box;
            text-transform: lowercase;
            font-size: 14px;
            line-height: 14px;
            font-weight: bold;
            overflow: hidden;
            vertical-align: top;
            background-color: #fff;
            padding-right: 12px;
            padding-left: 12px;
            border-radius: 16px;
            padding-top: 4px;
            height: 22px;
            margin-top: 2px;
            margin-right: 3px
        }

        .oft-head-container .zmdi-close-circle {
            font-size: 26px;
            color: #fff;
            display: inline-block;
            vertical-align: top;
            height: 26px
        }

        .has-oft .box_date.pickordel,
        .has-oft .box_delivery,
        .has-oft .ship.name,
        .has-oft .box_date,
        .has-oft .delivery-address-note .address-edit {
            display: none
        }

        .notloggedin.has-oft .box_delivery.loget-out-user-sign-button {
            display: block;
        }

        .tips-wrapper {
            position: relative;
            display: block;
            margin-bottom: 20px
        }

        .tips-wrapper .tips-title {
            font-size: 15px;
            color: #000;
            position: relative;
            font-weight: bold;
            text-transform: uppercase;
            margin-bottom: 10px
        }

        .tips-wrapper .tips-subtitle {
            margin-bottom: 15px;
            font-size: 13px;
            color: rgba(119, 119, 119, 0.796);
            display: none
        }

        .tips-wrapper .tips-options {
            position: relative;
            list-style: none;
            display: flex;
            flex-flow: row nowrap;
            place-content: space-around space-between;
            align-items: center
        }

        .tips-wrapper .tips-options .tips-option-item {
            border: 1px solid #ddd;
            background-color: #fff;
            width: calc(25% - 7px);
            height: 41px;
            text-align: center;
            display: flex;
            flex-flow: column nowrap;
            justify-content: center;
            align-items: center;
            border-radius: 5px;
            cursor: pointer;
            max-width: 91px;
            box-sizing: border-box
        }

        .tips-wrapper .tips-options .tips-option-item.selected-tips {
            border: 2px solid var(--primary-color)
        }

        .tips-wrapper .tips-options .tips-option-item.tips-option-other .tips-other-main-title {
            color: #333;
            font-size: 13px;
            font-weight: bold;
            width: 100%;
            height: 100%;
            display: flex;
            flex-flow: row nowrap;
            justify-content: space-evenly;
            align-items: center
        }

        .tips-wrapper .tips-options .tips-option-item .tips-other-choosed-title,
        .tips-wrapper .tips-options .tips-option-item .zmdi,
        .tips-wrapper .tips-options .tips-option-item .tips-other-amount {
            display: none
        }

        .tips-wrapper .tips-options .tips-option-item .tips-option-item-title {
            font-size: 14px;
            font-weight: bold;
            color: #333;
            margin-bottom: 8px
        }

        .tips-wrapper .tips-options .tips-option-item .tips-option-item-subtitle {
            font-size: 13px;
            color: #333
        }

        .tips-wrapper.tips-choose-option-other .tips-option-item {
            display: none
        }

        .tips-wrapper.tips-choose-option-other .tips-option-item.tips-option-other {
            display: block;
            width: 100%;
            max-width: 10000px
        }

        .tips-wrapper.tips-choose-option-other .tips-options .tips-option-item.tips-option-other .tips-other-main-title {
            display: none
        }

        .tips-wrapper.tips-choose-option-other .tips-option-item .tips-other-choosed-title {
            display: block;
            color: #333;
            font-weight: bold;
            font-size: 13px;
            margin-top: 11px;
            margin-bottom: 11px;
            position: absolute;
            right: 14px
        }

        .tips-wrapper.tips-choose-option-other .tips-option-item .zmdi {
            display: block;
            position: absolute;
            left: 9px;
            top: 8px;
            color: #aaa;
            font-size: 24px
        }

        .tips-wrapper.tips-choose-option-other .tips-option-item .tips-other-amount {
            display: block;
            height: 39px;
            width: calc(100% - 20px);
            margin-left: auto;
            margin-right: auto;
            text-align: center;
            border: 0;
            background: transparent;
            font-size: 16px
        }

        .orderfromtable {
            height: calc(100vh - 270px);
            min-height: 0
        }

        .orderfromtable #wrapper {
            height: calc(100vh - 270px);
            min-height: 0
        }

        @media(max-width:768px) {
            .has-oft .header-loyalty-value {
                display: none
            }
        }

        .has-loyalty .oft-head-container {
            left: 40%
        }

        @media(min-width:769px) {
            .order-from-table-section {
                display: inline-block
            }

            .order-from-table-section .oft-title {
                margin-top: 40px
            }

            .order-from-table-section .oft-button-cancel {
                position: relative;
                left: unset;
                bottom: unset;
                margin-top: 80px;
                cursor: pointer
            }

            .has-oft .oft-head-container {
                left: 30%;
                top: 15px
            }

            .tips-wrapper .tips-options {
                max-width: 350px
            }
        }

        /* .insta .addtobagbtn.show {
            transform: translateY(-120px);
            display: none !important
        } */



        .insta .editableMap .mylocation-big-map {
            bottom: 150px
        }

        .insta .editableMap .close-big-map {
            bottom: 150px
        }

        .insta .onRight .genBtn.trigger-addtobag {
            display: none !important
        }

        .insta .addAddressID.editAddAddress .genBtn {
            margin-bottom: 100px
        }

        .insta.market .onRight {
            display: block;
            position: relative;
            float: left
        }

        .insta.market .customizedID .genBtn.trigger-addtobag,
        .insta.fnb .customizedID .genBtn.trigger-addtobag {
            text-align: center;
            line-height: 53px;
            width: calc(100% - 22px);
            transform: translateX(-11px);
            border-radius: 6px;
            margin-bottom: 120px;
            bottom: auto;
            margin-top: -42px
        }

        .insta .onRight .genBtn.trigger-addtobag {
            display: none !important
        }

        .insta.fnb .customizedID .genBtn.trigger-addtobag {
            margin-bottom: 0;
            margin-top: 123px
        }

        .insta .bigPrice.overbtn.show {
            display: none !important
        }

        .insta .errorCustomization {
            bottom: 100px;
            border-radius: 4px;
            width: calc(100% - 63px);
            margin-left: 24px
        }

        .insta .wrapCustom .column_cust {
            margin-bottom: 32px
        }

        @media(max-width:376px) {
            .order-from-table-section .oft-description {
                margin-top: 30px
            }
        }

        @mediamin-width:769px) {
            .order-from-table-section .oft-button {
                display: inline-block
            }

            .order-from-table-section .oft-button#oft-copy-button {
                margin-right: 10px
            }

            .order-from-table-section .oft-description {
                margin-top: 40px
            }
        }

        .loginor .zmdi {
            margin-right: 10px;
            font-size: 17px;
            display: none;
        }

        #checkoutRegisterFormID .ordering-type {
            position: relative;
            display: flex;
            width: 100%;
            flex-flow: row nowrap;
            place-content: center space-between;
            height: 110px
        }

        .rtl #checkoutRegisterFormID .ordering-type {
            direction: rtl;
        }

        #checkoutRegisterFormID .ordering-type .input {
            position: relative;
            cursor: pointer;
            display: flex;
            justify-content: flex-start;
            align-items: center;
            outline: #ddd solid 1px;
            outline-offset: -13px;
            padding-left: 16px
        }

        .rtl #checkoutRegisterFormID .ordering-type .input {
            padding-right: 25px;
            padding-left: 0;
        }

        #checkoutRegisterFormID .ordering-type .input .check {
            position: relative;
            display: inline-block;
            top: auto;
            left: auto;
            vertical-align: top;
            margin-top: 15px;
            margin-left: 15px;
            margin-bottom: 15px;
            width: 20px;
            height: 20px
        }

        .rtl #checkoutRegisterFormID .ordering-type .input .check {
            margin-left: 0;
            margin-right: 15px;
        }

        #checkoutRegisterFormID .ordering-type .input .label {
            display: inline-block;
            position: relative;
            left: auto;
            top: auto;
            vertical-align: top;
            margin-top: 5px;
            margin-left: 9px;
            line-height: normal;
            height: auto;
            text-transform: capitalize;
            font-size: 18px
        }

        .rtl #checkoutRegisterFormID .ordering-type .input .label {
            float: right;
            margin-left: 0;
        }

        .bagph .itemsinbag {
            display: none
        }

        .reviewbag .bagph .itemsinbag {
            display: block;
            position: absolute;
            top: 27px;
            left: 15px;
            font-size: 22px;
            color: var(--primary-color)
        }

        .receipt-pickup-infos {
            position: relative;
            display: none;
            margin: 10px auto;
            text-align: center;
            width: 80%;
            font-size: 13px;
            color: #666
        }

        .fnb .receipt-pickup-infos {
            display: block
        }

        .receipt-pickup-infos .receipt-pickup-date {
            font-weight: bold;
            margin-bottom: 15px
        }

        .receipt-pickup-infos .receipt-pickup-branch-title {
            font-weight: bold;
            margin-bottom: 2px
        }

        .receipt-pickup-infos .receipt-pickup-branch {
            margin-bottom: 3px
        }

        .receipt-pickup-infos .receipt-pickup-address {
            position: relative;
            display: block;
            color: #666;
            text-decoration: none;
            cursor: pointer
        }

        .receipt-pickup-infos .receipt-pickup-title {
            margin-top: 42px
        }

        .receipt-pickup-infos .receipt-pickup-date {
            font-weight: bold;
            margin-bottom: 15px;
            font-size: 20px
        }

        .receipt-pickup-infos .receipt-pickup-branch-title {
            margin-top: 32px;
            margin-bottom: 2px
        }

        .receipt-pickup-infos .receipt-pickup-branch {
            margin-bottom: 3px;
            font-weight: bold
        }

        .receipt-pickup-infos .receipt-pickup-address {
            position: relative;
            display: inline-block;
            color: #666;
            text-decoration: none;
            cursor: pointer;
            font-weight: bold;
            border-bottom: 1px dotted #999;
            padding-bottom: 7px;
            margin-bottom: 23px
        }

        .thebig-ul.loading {
            min-height: 400px !important
        }

        .box_instruction.hosted-session {
            background-color: #fff;
            border: 0;
            padding-left: 0;
            padding-right: 0;
        }

        .gc-bottom-part .box_instruction.hosted-session {
            padding-top: 0
        }

        .gc-bottom-part .box_instruction.paymentMethods.hosted-session.byDefaultSavedCard {
            margin-bottom: -38px
        }

        .gc-bottom-part .box_instruction.paymentMethods.hosted-session.byDefaultSavedCard.expanded {
            margin-bottom: 0
        }

        .box_instruction.hosted-session .dateForm {
            height: 0;
            overflow: hidden;
            padding-bottom: 0
        }

        .box_instruction.hosted-session.showHostedSessionPayment .dateForm {
            height: 40px;
            padding-bottom: 10px;
        }

        .box_instruction.hosted-session .title {
            color: #333
        }

        .box_instruction .input.saved-card {
            background-color: #fff;
            margin-bottom: 12px;
            border-radius: 5px;
            position: relative;
            display: flex;
            flex-flow: row nowrap;
            place-content: center flex-start;
            align-items: flex-start;
            padding-top: 5px;
            padding-bottom: 16px;
            margin-right: auto;
            width: 100%;
        }

        .box_instruction .hosted-payment-wrapper {
            margin-bottom: 12px;
            position: relative;
            width: 100%;
            height: 44px;
            overflow: hidden
        }

        .box_instruction .input.saved-card {
            margin-bottom: 2px !important
        }

        .box_instruction .input.saved-card .check {
            top: 5px
        }

        .box_instruction .input.saved-card .card-provider-img {
            margin-left: 0;
            height: 13px
        }

        .box_instruction.expanded .input.saved-card .card-provider-img {
            padding-left: 28px
        }

        .box_instruction .input.saved-card .label {
            padding-left: 10px;
            margin-bottom: 0;
            font-size: 14px;
            color: #888;
            line-height: 16px
        }

        .box_instruction .input.saved-card .zmdi-delete {
            position: relative;
            font-size: 15px;
            color: #aaa;
            margin-left: 13px
        }

        .box_instruction.hosted-session.expanded .input.saved-card .zmdi-delete {
            left: auto;
            right: 0;
            position: absolute;
            top: 8px
        }

        .box_instruction.hosted-session .other-payments {
            position: absolute;
            top: 65px;
            right: 3px;
            border-bottom: 1px dashed #ddd;
            margin-top: 14px;
            font-size: 12px;
            color: #444;
            padding-bottom: 5px;
            z-index: 6;
            cursor: pointer;
        }

        .box_instruction.hosted-session.showHostedSessionPayment .other-payments {
            position: relative;
            display: inline-block;
            top: -12px;
            right: auto;
        }

        .box_instruction.hosted-session.byDefaultSavedCard .other-payments {
            top: 70px
        }

        .gc-bottom-part .box_instruction.hosted-session.byDefaultSavedCard .other-payments {
            top: 0;
            margin-top: 7px;
            right: 13px
        }

        .gc-bottom-part .box_instruction.hosted-session .other-payments {
            top: 0;
            margin-top: 7px;
            right: 13px
        }

        .gc-bottom-part .box_instruction.hosted-session.showHostedSessionPayment .other-payments {
            top: unset;
            right: auto;
            margin-bottom: 10px
        }

        .box_instruction.hosted-session.expanded .dateForm {
            height: auto
        }

        .box_instruction.hosted-session.expanded .selectedpayment {
            display: none
        }

        .box_instruction.hosted-session.expanded .other-payments {
            display: none
        }

        .box_instruction.hosted-session:not(.expanded) .input.saved-card.checked {
            border-color: transparent;
            min-height: 32px;
            padding-left: 0;
            width: calc(100% - 30px)
        }

        .box_instruction.hosted-session:not(.expanded) .input.saved-card.checked .check {
            display: none
        }

        .box_instruction .hosted-payment-wrapper::before {
            content: "$";
            width: 30px;
            height: 20px;
            background-color: var(--primary-color);
            position: absolute;
            left: 0;
            top: 6px;
            z-index: 1;
            text-align: center;
            color: #fff;
            font-size: 13px;
            font-weight: bold;
            line-height: 20px;
            border-radius: 2px
        }

        .box_instruction .hosted-payment-wrapper .input-field.cardnumber {
            height: 32px;
            border-top: 0;
            border-right: 0;
            border-left: none;
            border-image: initial;
            border-bottom: 1px solid #ddd;
            padding-left: 38px;
            padding-right: 5px;
            font-size: 12px;
            width: 194px;
            position: relative;
            font-style: normal;
            margin-right: 3px
        }

        .box_instruction .hosted-payment-wrapper .gw-proxy-number {
            position: relative;
            display: inline-block;
            width: 237px !important;
            height: 33px !important
        }

        .box_instruction .hosted-payment-wrapper .input-field.month {
            height: 32px;
            border-top: 0;
            border-right: 0;
            border-left: none;
            border-image: initial;
            border-bottom: 1px solid #ddd;
            width: 28px;
            text-align: center;
            font-size: 12px;
            position: relative;
            margin-right: 3px
        }

        .box_instruction .hosted-payment-wrapper .gw-proxy-expiryMonth {
            position: relative;
            display: inline-block;
            width: 28px !important;
            height: 33px !important
        }

        .box_instruction .hosted-payment-wrapper .input-field.year {
            height: 32px;
            border-top: 0;
            border-right: 0;
            border-left: none;
            border-image: initial;
            border-bottom: 1px solid #ddd;
            width: 28px;
            text-align: center;
            font-size: 12px;
            position: relative;
            margin-right: 3px
        }

        .box_instruction .hosted-payment-wrapper .gw-proxy-expiryYear {
            position: relative;
            display: inline-block;
            width: 30px !important;
            height: 33px !important
        }

        .box_instruction .hosted-payment-wrapper .input-field.cvv {
            height: 32px;
            border-top: 0;
            border-right: 0;
            border-left: none;
            border-image: initial;
            border-bottom: 1px solid #ddd;
            width: 34px;
            text-align: center;
            font-size: 12px;
            position: relative
        }

        .box_instruction .hosted-payment-wrapper .gw-proxy-securityCode {
            position: relative;
            display: inline-block;
            width: 34px !important;
            margin: 0 !important;
            height: 33px !important
        }

        .retail .customizedID .waitingList-button-container {
            position: relative;
            display: block;
            margin-bottom: 20px;
            width: 100%;
        }

        .retail .customizedID .waitingList-button-container .w-description {
            position: relative;
            display: block;
            font-size: 15px;
            margin-bottom: 15px
        }

        .retail .customizedID .waitingList-button-container .genBtn {
            display: block;
            position: relative;
            width: 100%;
            text-align: center;
            padding-top: 15px;
            height: 50px;
            border-radius: 4px;
        }

        .hasWaitingList .formPart .line.sold-out {
            pointer-events: unset !important
        }

        .bigPrice.overbtn.ng-hide {
            display: none !important
        }

        @media(max-width:768px) {
            .retail .customizedID .waitingList-button-container .genBtn {
                display: none
            }

            .hosted-session-wrapper {
                position: relative;
                display: block;
                background-color: #fff;
                padding-left: 11px;
                margin-left: -11px;
                padding-right: 11px;
                margin-right: -11px;
                padding-bottom: 28px;
                margin-bottom: -28px;
                box-shadow: rgba(204, 204, 204, 0.09) 0 -4px 3px
            }

            .gc-bottom-part .hosted-session-wrapper {
                position: relative;
                display: block;
                background-color: #fff;
                padding-left: 11px;
                padding-right: 11px;
                box-shadow: none;
                margin-bottom: 0;
                padding-bottom: 0
            }
        }

        .selectedpayment .selected .zmdi-dot-circle {
            color: #e4bdb4;
            display: block;
            opacity: 1
        }

        @media(min-width:769px) {
            .box_instruction.hosted-session .other-payments {
                top: 38px;
            }

            .box_instruction.hosted-session.byDefaultSavedCard .other-payments {
                top: 42px
            }

            .box_instruction.hosted-session.expanded .input.saved-card .zmdi-delete {
                left: auto;
                right: auto;
                top: auto;
                position: relative;
                margin-left: 50px
            }

            .box_instruction.hosted-session.showHostedSessionPayment .dateForm {
                height: 40px
            }

            .box_instruction.hosted-session.expanded .dateForm {
                height: auto
            }

            .gc-bottom-part .box_instruction.hosted-session {
                margin-bottom: 0
            }

            .giftcards .hosted-session-big-wrapper.content {
                height: auto
            }

            .giftcards .hosted-session-big-wrapper.gc-big-top .gc-bottom-part {
                height: auto
            }

            .tips-wrapper.tips-choose-option-other .tips-option-item .zmdi {
                top: 8px
            }
        }

        .totalPrice.discount-price {
            font-size: 13px !important
        }

        .gc-bottom-part .box_instruction.hosted-session .dateForm {
            width: 100%
        }

        .gc-bottom-part .box_instruction.hosted-session .input {
            margin-right: 0;
            width: 100% !Important
        }

        .add-towl-guideline {
            font-family: inherit;
            font-size: 18px;
            color: #b1b1b1;
            text-align: center;
            max-width: 264px;
            margin: auto;
        }

        li.add-towl-guideline::before {
            font: 119px / 1 Material-Design-Iconic-Font;
            content: "\f3ac";
            margin-right: 10px;
            color: #eee;
            display: block;
            margin-bottom: 25px;
        }

        .rtl #wrapper {
            position: relative;
        }

        .whiteBox .boxes .box.customer-profile .mid .view {
            display: block;
            padding-left: 0;
        }

        .whiteBox .customer-profile .userdata .lblText {
            text-transform: capitalize;
        }



        .lwr {
            margin-bottom: 52px;
            white-space: nowrap;
            overflow-y: hidden;
            overflow-x: auto;
        }

        .lwr .ltitle {
            font-size: 29px;
            font-family: 'titlefont';
            padding: 20px;
            margin-bottom: 22px;
            white-space: initial;
            text-align: center;
        }

        .itemGrid .product-labels-container {
            position: absolute;
            left: 10px;
            top: 17px;
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            align-content: flex-start;
            justify-content: flex-start;
            align-items: flex-start;
            z-index: 1;
        }

        .itemGrid .product-labels-container .product-labels {
            padding-left: 9px;
            padding-right: 9px;
            padding-top: 4px;
            padding-bottom: 4px;
            margin-right: 9px;
            color: #fff;
            font-size: 14px;
            font-weight: bold;
            text-transform: uppercase;
            border-radius: 5px;
        }

        .customizedID .product-labels-container {
            position: absolute;
            left: 17px;
            top: 17px;
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            align-content: flex-start;
            justify-content: flex-start;
            align-items: flex-start;
            z-index: 1;
        }

        .customizedID .product-labels-container .product-labels {
            padding-left: 9px;
            padding-right: 9px;
            padding-top: 5px;
            padding-bottom: 5px;
            margin-right: 9px;
            color: #fff;
            font-size: 14px;
            font-weight: bold;
            text-transform: uppercase;
            cursor: default;
            border-radius: 5px;
        }



        .filters-wrapper {
            position: relative;
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            align-content: flex-start;
            justify-content: flex-start;
            align-items: flex-start;
            width: 100%;
            margin-bottom: 20px;
        }

        .filters-wrapper .filter-item {
            position: relative;
            display: block;
            margin-right: 10px;
            padding-left: 10px;
            padding-right: 10px;
            cursor: pointer;
        }

        .filters-wrapper .filter-item.opened {
            background-color: #fff;
            box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 11%);
        }

        .filters-wrapper .filter-item .filter-title {
            font-size: 15px;
            color: var(--primary-color);
            padding-bottom: 10px;
            padding-right: 70px;
            padding-top: 10px;
            border-bottom: 1px solid #ddd;
            position: relative;
        }

        .filters-wrapper .filter-item.opened: before {
            /* content:""; */
            width: calc(100% + 20px);
            height: 40px;
            position: absolute;
            left: -10px;
            top: 0;
            background-color: #fff;
            z-index: 0;
            box-shadow: 0px 0px 10px 0px #ccc;
        }

        .filters-wrapper .filter-item.opened .filter-title {
            border: none;
        }

        .filters-wrapper .filter-item.opened .filter-title: before {
            content: "";
            width: calc(100% + 20px);
            height: 20px;
            position: absolute;
            background-color: #fff;
            z-index: 3;
            bottom: -10px;
            left: -10px;
        }

        .filters-wrapper .filter-item .filter-title: after {
            font: 19px / 1 Material-Design-Iconic-Font;
            content: "\f2f9";
            position: absolute;
            top: 11px;
            right: 0;
            color: var(--primary-color);
            pointer-events: none;
        }

        .filters-wrapper .filter-item.opened .filter-title: after {
            content: "\f2fc";
        }

        .filters-wrapper .filter-item .filter-title .filters-count {
            position: absolute;
            top: 10px;
            right: 18px;
            width: 41px;
            height: 18px;
            font-size: 13px;
            background-color: var(--primary-color);
            color: #fff;
            border-radius: 15px;
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            justify-content: center;
        }

        .filters-wrapper .filter-item.price-layout .filter-title .filters-count {
            width: auto;
        }

        .filters-wrapper .filter-item .filter-title .filters-count .filter-count-number {
            width: 20px;
            height: 18px;
            text-align: center;
            font-size: 12px;
            margin-top: 2px;
            padding-left: 1px;
        }

        .filters-wrapper .filter-item .filter-title .filters-count .filter-count-close {
            width: 19px;
            border-left: 1px solid #ffffff;
            height: 15px;
            text-align: center;
            font-size: 13px;
            margin-right: 1px;
            margin-top: 2px;
            margin-bottom: 1px;
            line-height: 13px;
        }

        .filters-wrapper .filter-item.price-layout .filter-title .filters-count .filter-count-close {
            border: none;
            margin-right: 0;
        }

        .filters-wrapper .filter-item .filter-popup {
            position: absolute;
            display: none;
            height: 0;
            z-index: 2;
            background-color: #fff;
            padding-left: 10px;
            padding-bottom: 10px;
            padding-right: 10px;
            padding-top: 20px;
            top: 40px;
            left: 0;
            overflow: hidden;
            min-width: calc(100% + 30%);
        }

        .filters-wrapper .filter-item.opened .filter-popup {
            height: auto;
            box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 11%);
            display: block;
        }

        .filters-wrapper .filter-item .filter-popup .filter-search {
            position: relative;
            display: block;
            border-bottom: 1px dotted #ccc;
            padding-left: 15px;
            margin-bottom: 10px;
        }

        .filters-wrapper .filter-item .filter-popup .filter-search: before {
            font: 18px / 1 Material-Design-Iconic-Font;
            content: "\f1c3";
            position: absolute;
            left: 0;
            top: 4px;
            color: var(--primary-color);
            pointer-events: none;
            opacity: 0.32;
        }

        .filters-wrapper .filter-item .filter-popup .filter-search input {
            position: relative;
            display: block;
            border: none;
            width: calc(100% - 25px);
            padding-left: 5px;
            padding-right: 5px;
            height: 20px;
            padding-top: 5px;
            margin-bottom: 3px;
        }

        .filters-wrapper .filter-item .filter-popup .filter-list-wrapper {
            max-height: 240px;
            overflow-y: auto;
        }

        .filters-wrapper .filter-item .filter-popup .filter-subcategory {
            position: relative;
            display: block;
            font-size: 14px;
            margin-bottom: 8px;
            margin-top: 15px;
            font-weight: bold;
            text-transform: capitalize;
        }

        .filters-wrapper .filter-item .filter-popup .filter-options {
            list-style: none;
            position: relative;
            display: block;
            font-size: 13px;
            color: var(--primary-color);
        }

        .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper {
            position: relative;
            display: flex;
            margin-bottom: 3px;
        }

        .filters-wrapper .filter-item.price-layout .filter-popup .filter-options .filter-option-wrapper {
            width: 200px;
            height: 34px;
            /* border: 1px solid var(--primary-color); */
            margin-bottom: 8px;
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            justify-content: space-between;
            align-items: center;
            /* background: #f8f8f8; */
        }

        .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-check {
            position: relative;
        }

        .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-check: before {
            font: 16px / 1 Material-Design-Iconic-Font;
            content: "\f279";
        }

        .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper.checked .filter-check: before {
            font: 16px / 1 Material-Design-Iconic-Font;
            content: "\f26a";
        }

        .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-option-title {
            margin-left: 8px;
            text-transform: capitalize;
            color: #333;
        }

        .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-price-title {
            position: relative;
            display: block;
            text-transform: uppercase;
            width: 53px;
            /* border-right: 1px solid var(--primary-color); */
            text-align: left;
            padding-top: 11px;
            padding-bottom: 10px;
            font-size: 12px;
            padding-left: 3px;
        }

        .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-price-amount-wrapper {
            position: relative;
            display: block;
            width: 148px;
            height: 33px;
            margin-top: 1px;
            margin-right: 1px;
            margin-bottom: 1px;
        }

        .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-price-amount-wrapper: after {
            font: 19px / 1 Material-Design-Iconic-Font;
            content: "\f2f9";
            position: absolute;
            top: 8px;
            right: 10px;
            color: #999999;
            pointer-events: none;
        }

        .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-price-amount-wrapper select {
            width: 100%;
            height: 100%;
            border: none;
            color: #aaaaaa;
            font-size: 14px;
            padding-left: 10px;
        }

        .itemsList .itemGrid .priceWrap .sku {
            display: none;
        }

        #registerFormID .inputWrap.textarea.focused .label {
            display: block !important;
        }

        .relationsinline .product-labels {
            display: none
        }

        .filters-mobile {
            display: none;
        }

        .filter-mobile-title,
        .filter-btn-wrapper,
        .filter-mobile-applied {
            display: none;
        }

        .has-pdf {
            color: var(--primary-color) !important;
        }

        .market .customizedID .data .sku.has-pdf {
            border-bottom: 1px solid var(--primary-color);
            display: unset;
        }

        @media (max-width:768px) {
            .filters-mobile {
                display: block;
                margin-left: 10px;
                margin-bottom: 20px;
                position: absolute;
                left: 0;
                top: -38px;
            }

            .filters-mobile.subempty {
                top: -40px;
            }

            .filters-wrapper {
                display: block;
                opacity: 0;
                position: fixed;
                background-color: #fff;
                width: 100%;
                height: 100vh;
                z-index: 1500;
                top: -5000px;
                left: 0;
                transition: opacity 0.4s;
            }

            .filters-wrapper.filter-show {
                top: 0px;
                display: block;
                opacity: 1;
            }

            .filter-mobile-title {
                display: block;
                padding-top: 16px;
                padding-left: 10px;
                border-bottom: 1px solid #333;
                padding-bottom: 16px;
                font-weight: bold;
                font-size: 18px;
            }

            .filter-mobile-title .zmdi-close {
                position: absolute;
                right: 20px;
                top: 16px;
                font-size: 20px;
            }

            .filters-wrapper .filter-item .filter-popup .filter-list-wrapper {
                max-height: 1000px;
                height: calc(100vh - 277px);
                overflow-y: scroll;
                margin-top: 15px;
                margin-bottom: 15px;
            }

            .filters-wrapper .filter-item {
                padding-left: 0;
                padding-right: 0;
                margin-right: 0;
            }

            .filters-wrapper .filter-item.opened {
                box-shadow: none;
                position: absolute;
                width: 100%;
                top: 55px;
                background: #fff;
                z-index: 1;
                height: calc(100vh - 148px);
            }

            .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-price-amount-wrapper {
                width: calc(100% - 55px);
            }

            .filters-wrapper .filter-item .filter-title {
                padding-bottom: 20px;
                padding-top: 20px;
                padding-left: 10px;
                color: #333;
                font-weight: bold;
                border-bottom: 1px solid #666;
                font-size: 18px;
            }

            .filters-wrapper .filter-item .filter-title: after {

                right: 20px;
                top: 20px;
                color: #333;
                font-size: 23px;
            }

            .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper {
                margin-bottom: 8px;
            }

            .filters-wrapper .filter-item .filter-title .filters-count {
                top: 20px;
                right: 50px;
                font-weight: normal;
                width: 50px;
                height: 22px;
            }

            .filters-wrapper .filter-item .filter-title .filters-count .filter-count-number {
                height: 18px;
                padding-top: 0px;
                font-size: 14px;
            }

            .filters-wrapper .filter-item .filter-title .filters-count .filter-count-close {
                height: 16px;
                padding-top: 2px;
                font-size: 15px;
            }

            .filters-wrapper .filter-item.opened .filter-popup {
                box-shadow: none;
                top: auto;
                padding-top: 0;
                position: relative;
                left: auto;
                display: block;
                min-width: calc(100% - 20px);
            }

            .filters-wrapper .filter-item.opened .filter-title: before {
                display: none;
            }

            .filters-wrapper .filter-item .filter-popup .filter-search {
                border-bottom: 1px solid #666;
            }

            .filters-wrapper .filter-item .filter-popup .filter-search: before {

                color: #666;
                font-size: 23px;
            }

            .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-check: before {
                color: #333;
                font-size: 18px !important;
            }

            .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-option-title {
                color: #333;
                font-size: 16px;
            }

            .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-price-title {
                border-right-color: #666;
                color: #666;
            }

            .filters-wrapper .filter-item.price-layout .filter-popup .filter-options .filter-option-wrapper {
                border-color: #666;
                width: calc(100% - 10px);
            }

            .filters-wrapper .filter-btn-wrapper {
                position: absolute;
                bottom: 0;
                left: 0;
                padding-top: 20px;
                padding-bottom: 20px;
                width: 100%;
                display: block;
                border-top: 1px solid #ccc;
            }

            .filters-wrapper .filter-item .filter-popup .filter-subcategory {
                font-size: 16px;
            }

            .filters-wrapper .filter-btn-wrapper .filter-btn-inner-wrapper {
                position: relative;
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                justify-content: space-around;
                align-items: flex-start;
            }

            .filters-wrapper .filter-item .filter-popup .filter-search input {
                font-size: 16px;
                padding-left: 10px;
            }

            .filters-wrapper .filter-btn-wrapper .filter-clear-all {
                position: relative;
                border: 1px solid #999;
                padding-top: 15px;
                padding-bottom: 15px;
                text-align: center;
                min-width: 170px;
                color: #999;
            }

            .filters-wrapper .filter-btn-wrapper .filter-apply {
                position: relative;
                border: 1px solid transparent;
                padding-top: 15px;
                padding-bottom: 15px;
                text-align: center;
                min-width: 170px;
                color: #fff;
                background-color: var(--primary-color);
            }

            .filters-wrapper .filter-btn-wrapper.filter-opened .filter-clear-all {
                display: none;
            }

            .filters-wrapper .filter-btn-wrapper.filter-opened .filter-apply {
                width: 350px;
            }

            .filter-mobile-applied {
                display: flex;
                margin-top: 8px;
                margin-bottom: 8px;
                position: relative;
                height: 61px;
                overflow-x: scroll;
                flex-direction: row;
                flex-wrap: nowrap;
                justify-content: flex-start;
                padding-left: 10px;
                padding-right: 10px;
                overflow-y: hidden;
                align-items: flex-start;
            }

            .filter-mobile-applied .filter-applied-item {
                position: relative;
                border: 1px solid #ccc;
                padding-left: 12px;
                padding-right: 35px;
                padding-top: 12px;
                padding-bottom: 12px;
                margin-right: 15px;
                list-style: none;
                font-size: 15px;
                width: auto;
                display: block;
                text-transform: capitalize;
            }

            .filter-mobile-applied .filter-applied-item span {
                white-space: nowrap;
            }

            .filter-mobile-applied .filter-applied-item .zmdi-close {
                position: absolute;
                right: 10px;
                top: 11px;
                font-size: 20px;
                font-weight: normal;
            }

            .filters-wrapper .filter-item.price-layout .filter-title .filters-count .filter-count-close {
                width: 22px;
            }
        }

        .retail.insta .genbtnw {
            display: block;
        }

        .signupform .normalForm .textarea .label {
            display: block;
        }

        .signupform .inputWrap.textarea.focused .label {
            display: block !important;
        }

        .signupform .inputWrap.textarea .input textarea {
            height: 59px;
        }

        .scanqrcode {
            background-color: transparent !important;
            background-image: url("../../assets/images/image-scanner-frame.png");
            background-size: 240px;
            background-position: center;
            background-repeat: no-repeat;
        }

        .scanqrcode #wrapper {
            background-color: transparent;
        }

        .qr-wrapper {
            height: calc(100vh - 119px);
            background-color: var(--primary-color);
            color: #fff;
            background-image: url('../../config/images/qr-bg.png');
            background-repeat: no-repeat;
            background-position: center bottom;
            background-size: contain;
        }

        .qr-title {
            position: relative;
            display: block;
            text-align: center;
            padding-top: 179px;
            font-size: 45px;
            font-family: 'titlefont';
            font-weight: bold;
        }

        .qr-title: before {
            content: "";
            position: absolute;
            top: 42px;
            left: -33px;
            width: 115%;
            height: 264px;
            background-image: url('../../config/images/confeti-qr.png');
            background-repeat: no-repeat;
            background-position: center bottom;
            background-size: contain;
        }

        .qr-description {
            position: relative;
            display: block;
            text-align: center;
            padding-top: 102px;
            font-size: 33px;
            /* padding-left: 30px; */
            /* padding-right: 30px; */
            font-family: 'titlefont';
        }

        .qr-code-menu {
            display: none;
        }

        .cordova .qr-code-menu {
            display: block;
        }

        @media (max-width:768px) {
            .insta.fnb .customizedID .genbtnw .genBtn.trigger-addtobag {
                display: block !important
            }

            .insta.market .customizedID .genBtn.trigger-addtobag {
                display: block !important
            }

            /* .insta.retail .customizedID .genBtn.trigger-addtobag {
                display: block !important
            } */

            .retail.insta .customizedID .show-waitinglist .genBtn.trigger-addtobag {
                display: none !important
            }

            .retail.insta .customizedID .show-waitinglist .waitingList-button-container .genBtn {
                display: block !important
            }
        }

        .cb-wrapper {
            position: fixed;
            width: 448px;
            top: 20px;
            left: -950px;
            z-index: 888888889;
            background: #fff;
            border-radius: 5px;
            padding-bottom: 10px;
            border-bottom: 1px solid #ccc;
            box-shadow: 0px 0px 10px 0px #aaa;
            transition: all .3s ease 0s;
        }

        .cb-wrapper.show {
            left: 20px;
        }

        .cb-wrapper .cb-header {
            position: relative;
            display: block;
            border-bottom: 1px solid #eeeeee;
            color: #666666;
            font-weight: bold;
            font-size: 19px;
            padding-top: 18px;
            padding-left: 30px;
            padding-bottom: 18px;
        }

        .cb-wrapper .cb-map-container {
            position: relative;
            display: block;
            height: 222px;
            overflow: hidden;
        }

        .cb-wrapper.location-not-detected .cb-map-container {
            height: 60px;
        }

        .cb-wrapper .cb-map-container .cb-map {
            position: relative;
            display: block;
            height: auto;
            width: 448px;
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
        }

        .cb-wrapper .cb-map-container .cb-map-buttons {
            position: absolute;
            display: flex;
            right: 14px;
            bottom: 18px;
            height: 40px;
        }

        .cb-wrapper .cb-map-container .cb-map-buttons .cb-map-b-big {
            position: relative;
            display: block;
            background-color: #fff;
            margin-right: 7px;
            color: #545454;
            font-weight: bold;
            font-size: 13px;
            padding-left: 14px;
            padding-right: 14px;
            text-transform: uppercase;
            font-family: 'titlefont';
            height: 45px;
            box-shadow: 1px 1px 2px 0px #ccc;
            cursor: pointer;
            min-width: 121px;
            line-height: 45px;
            margin-bottom: 2px;
            text-align: center;
        }

        .cb-wrapper .cb-map-container .cb-map-buttons .cb-map-b-small {
            position: relative;
            display: block;
            height: 45px;
            width: 45px;
            background-color: #ffffff;
            box-shadow: 1px 1px 2px 0px #ccc;
        }

        .cb-wrapper .cb-map-container .cb-map-buttons .cb-map-b-small: before {
            content: '!';
            position: absolute;
            background-color: #A61815;
            color: #fff;
            border-radius: 50%;
            width: 18px;
            height: 18px;
            text-align: center;
            font-weight: bold;
            right: -4px;
            top: -4px;
            font-size: 14px;
        }

        .cb-wrapper .cb-map-container .cb-map-buttons .cb-map-b-small.gps-detected: before {
            content: '\f26b';
            font: normal normal normal 18px/1 'Material-Design-Iconic-Font';
            position: absolute;
            background-color: #85B200;
            color: #fff;
            border-radius: 50%;
            width: 18px;
            height: 18px;
            text-align: center;
            font-weight: bold;
            right: -4px;
            top: -4px;
        }

        .cb-wrapper .cb-map-container .cb-map-buttons .cb-map-b-small .zmdi {
            font-size: 18px;
            position: relative;
            display: block;
            height: 29px;
            padding-top: 11px;
            cursor: pointer;
        }

        .cb-wrapper .cb-branches {
            position: relative;
            display: block;
            padding-left: 30px;
            list-style: none;
            padding-right: 14px;
            padding-bottom: 20px;
            max-height: calc(100vh - 353px);
            overflow-y: auto;
            margin-bottom: 20px;
        }

        .cb-wrapper .cb-branches .cb-branches-item {
            position: relative;
            display: block;
            margin-top: 20px;
            padding-top: 4px;
            min-height: 40px;
        }

        .cb-wrapper .cb-branches .cb-branches-item .cb-item-button {
            height: 43px;
            color: #fff;
            background-color: var(--primary-color);
            position: absolute;
            top: 0;
            right: 0;
            /* font-family: 'titlefont'; */
            font-size: 11px;
            padding-right: 10px;
            padding-left: 10px;
            /* padding-top: 7px; */
            cursor: pointer;
            border-radius: 3px;
            line-height: 43px;
            min-width: 90px;
            text-align: center;
        }

        .cb-item-button.olater {
            background-color: #fff !Important;
            color: var(--primary-color) !important;
            border: 1px solid var(--primary-color);
        }

        .cb-wrapper .cb-branches .cb-branches-item .cb-item-title {
            position: relative;
            display: block;
            font-weight: bold;
            font-size: 16px;
            max-width: 180px;
        }

        .cb-wrapper .cb-branches .cb-branches-item .cb-item-address {
            position: relative;
            display: block;
            font-size: 14px;
            color: #888;
            max-width: 180px;
            margin-top: 2px;
            line-height: 19px;
        }

        .cb-wrapper .cb-branches .cb-branches-item .cb-item-info {
            position: relative;
            display: flex;
            width: 100%;
            flex-direction: row;
            flex-wrap: wrap;
            font-size: 11px;
            font-weight: bold;
            margin-top: 5px;
        }

        .cb-wrapper .cb-branches .cb-branches-item .cb-item-info .cb-item-info-details {
            margin-right: 5px;
            text-transform: uppercase;
            font-size: 11px;
            margin-top: 3px;
            font-weight: normal;
            letter-spacing: 1.5px;
        }

        .cb-wrapper .cb-branches .cb-branches-item .cb-item-info .cb-yellow {
            color: #D9A300;
        }

        .cb-wrapper .cb-branches .cb-branches-item .cb-item-info .cb-green {
            color: #59B200;
        }

        .cb-wrapper .cb-branches .cb-branches-item .cb-item-info .cb-grey {
            color: #999999;
        }

        .cb-wrapper .cb-view-other-branches {
            position: relative;
            display: inline-block;
            margin-left: 30px;
            font-size: 13px;
            color: #bababa;
            border-bottom: 1px dotted;
            margin-bottom: 10px;
            cursor: pointer;
        }

        .cb-wrapper .cb-nodelivernopickup {
            position: relative;
            display: flex;
            margin-left: 30px;
            margin-right: 14px;
            margin-top: 20px;
            margin-bottom: 10px;
            justify-content: space-between;
            align-items: center;
            flex-wrap: nowrap;
            flex-direction: row;
        }

        .cb-wrapper .cb-nodelivernopickup .cb-nf-np-button {
            height: 41px;
            color: #fff;
            background-color: #A61815;
            position: relative;
            font-size: 14px;
            padding-right: 10px;
            padding-left: 10px;
            cursor: pointer;
            min-width: 130px;
            text-align: center;
            line-height: 40px;
            border-radius: 4px;
        }

        .cb-wrapper .cb-nodelivernopickup .cb-nf-np-text {
            position: relative;
            font-size: 13px;
            font-weight: bold;
            /* color: #999999; */
        }

        .cb-current-location .editableMap {
            visibility: visible;
            left: 0;
            z-index: 888888890;
        }



        .main-swiper img {
            animation: none;
        }

        .market .relationsinline .related-items {
            display: block;
        }

        .market .relationsinline .related-items .itemsList .itemGrid .priceWrap {
            display: none;
        }

        .market .relationsinline .related-items .itemsList .itemGrid .picture {
            width: 100%;
            max-height: 100%;
            margin-left: 0;
        }

        @media (max-width:600px) {
            .cb-wrapper {
                width: 100%;
                border-radius: 0;
                top: 15px;
            }

            .cb-wrapper.show {
                left: 15px;
                width: calc(100vw - 30px);
                top: 15px;
                max-height: calc(100vh - 45px);
                opacity: 0.96;
            }

            .cb-wrapper .cb-map-container .cb-map {
                width: 119%;
                height: auto;
                margin-left: -34px;
            }
        }

        .customizedID .addRemoveWrap input.nb {
            border: none;
            /* display: none; */
            width: 80px;
        }

        /* .wholesale .customizedID .addRemoveWrap input.nb {
    border: none;
    display: block;
}

.wholesale .customizedID .addRemoveWrap div.nb {
    display: none;
} */

        .wholesale .addRemove {
            width: 90px;
        }

        #currentEditMap .gm-style::after,
        #addressEditMap .gm-style::after {
            position: absolute;
            width: 29px;
            height: 42px;
            left: calc(50% - 14.7px);
            top: calc(50% - 31.4px);
            font: 50px / 1 Material-Design-Iconic-Font;
            content: "\f1ab";
            z-index: 5;
            color: var(--primary-color);
            pointer-events: none;
            line-height: 46px;
        }

        #currentEditMap.standing-marker .gm-style::after,
        #addressEditMap.standing-marker .gm-style::after {
            transform: translateY(-12px);
            animation-name: pinbounce-marker;
            animation-duration: .3s;
            animation-timing-function: ease;
            animation-delay: 0;
            animation-iteration-count: 1;
        }

        #currentEditMap .gm-style::before,
        #addressEditMap .gm-style::before {
            content: "";
            width: 250px;
            height: 250px;
            position: absolute;
            top: 4px;
            bottom: 0;
            right: 0;
            left: 3px;
            z-index: 2;
            margin: auto;
            -webkit-border-radius: 50%;
            border-radius: 50%;
            pointer-events: none;
            transition: all .2s ease-in-out;
            /* -webkit-box-shadow: 0 0 0 90px var(--primary-color); */
            /* box-shadow: 0px 0px 0px 90px var(--primary-color); */
            background-color: var(--primary-color);
            opacity: .1;
            -webkit-backface-visibility: hidden;
        }

        #currentEditMap.animate-marker .gm-style::after,
        #addressEditMap.animate-marker .gm-style::after {
            top: calc(50% - 65px);
        }

        #currentEditMap.animate-marker .gm-style::before,
        #addressEditMap.animate-marker .gm-style::before {
            /*box-shadow: 0 0 0 3px var(--primary-color);*/
            width: 8px;
            height: 8px;
            background-color: var(--primary-color);
            opacity: 1;
        }

        .register-privacy-and {
            margin-left: 2px;
            margin-right: 2px;
        }

        .register-privacy-and,
        .register-privacy {
            display: none;
        }

        @media (max-width:768px) {
            .cb-wrapper .cb-map-container .cb-map-buttons .cb-map-b-big {
                /* padding-top: 14px; */
                /* height: 26px; */
            }

            .cb-wrapper .cb-nodelivernopickup .cb-nf-np-button {
                /* padding-top: 8px; */
                /* height: 20px; */
            }

            .cb-wrapper .cb-branches .cb-branches-item .cb-item-button {
                /* padding-top: 8px; */
                /* height: 20px; */
            }

            .auto-login-from-back .content {
                margin-left: 0;
            }
        }

        .gmnoprint {
            display: none;
        }

        button.gm-control-active.gm-fullscreen-control {
            display: none;
        }

        .gotomarker {
            display: none;
        }

        .olaternopickup {
            filter: grayscale();
            background-color: #fff !Important;
            color: var(--primary-color) !important;
            border: 1px solid var(--primary-color);
        }

        .products-details-cal {
            position: relative;
            display: none;
        }

        .orders .order .oNbItems,
        .orders .order .withTitle {
            width: calc(100% - 40px) !important;
        }

        .pay-with-apple-pay {
            background-size: 50% 30%;
            background-repeat: no-repeat;
            background-position: 50% 50%;
            border-radius: 5px;
            padding: 0px;
            box-sizing: border-box;
            min-width: 200px;
            min-height: 32px;
            max-height: 50px;
            color: white;
            background-image: -webkit-named-image(apple-pay-logo-white);
            background-color: black;
            border: .5px solid black;
        }

        .hosted-session .pay-with-apple-pay {
            margin-bottom: 20px !important;
        }

        apple-pay-button {
            --apple-pay-button-width: 100%;
            --apple-pay-button-height: 50px;
            --apple-pay-button-border-radius: 3px;
            --apple-pay-button-padding: 0px 0px;
            --apple-pay-button-box-sizing: border-box;
        }

        .itemsList .itemGrid .priceWrap .download-pdf {
            display: none;
        }

        .hasdatasheet .itemsList .itemGrid .priceWrap .download-pdf {
            display: block;
            position: absolute;
            right: 15px;
            font-size: 28px;
            top: -42px;
            color: var(--primary-color);
        }

        .customizedID .data .download-pdf {
            display: none;
        }

        .hasdatasheet .customizedID .data .download-pdf {
            display: block;
            position: relative;
            font-size: 32px;
            color: var(--primary-color);
        }

        .hide-inst-box.no-map.box_delivery {
            min-height: 100px !important;
        }

        .hide-inst-box.no-map.box_delivery .boxData {
            min-height: 100px;
        }

        .hide-inst-box.no-map.box_delivery .office {
            height: 100px;
        }

        .hide-inst-box.no-map.box_delivery .googleMap {
            display: none;
        }

        .hide-inst-box.no-map.box_delivery .box_instruction {
            display: none;
        }

        .cash-card-notice {
            position: relative;
            display: block;
            text-align: center;
            margin-top: 10px;
            font-size: 13px;
        }

        .column_cust .block .bSmallTitle .custom-min {
            display: none;
        }

        .contactus {
            display: none !important;
        }

        .opt-plus-minus {
            display: none;
        }

        .checked .opt-plus-minus {
            display: flex;
            z-index: 1;
            flex-direction: row;
            flex-wrap: nowrap;
            align-items: center;
            width: 100px;
        }

        .opt-plus-minus .minus {
            width: 25px;
            text-align: center;
            font-size: 30px;
            height: 22px;
            line-height: 18px;
            color: #333;
            -webkit-user-select: none;
        }

        .opt-plus-minus .nb {
            width: 42px;
            border: 1px solid #ccc;
            text-align: center;
            padding-top: 4px;
            padding-bottom: 4px;
            padding-left: 4px;
            padding-right: 4px;
            height: 12px;
            font-size: 11px;
        }

        .opt-plus-minus .plus {
            width: 25px;
            text-align: center;
            font-size: 25px;
            height: 22px;
            line-height: 20px;
            color: #333;
            -webkit-user-select: none;
        }

        .opt-plus-minus .max-qty-tooltip {
            display: none;
            position: absolute;
            top: -29px;
            min-width: 67px;
            width: auto;
            white-space: nowrap;
            right: 10px;
            font-size: 10px;
            background: #fff;
            padding: 5px;
            line-height: 10px;
            border-bottom: 1px solid #ccc;
            border-radius: 4px;
            box-shadow: 0 0px 6px 1px #efefef;
            text-align: center;
            padding-left: 20px;
            color:
                var(--primary-color);
        }

        .opt-plus-minus .max-qty-tooltip.reached-max {
            display: block;
        }

        .opt-plus-minus .max-qty-tooltip: before {
            content: "\f1f8";
            font: 15px / 1 Material-Design-Iconic-Font;
            position: absolute;
            height: 8px;
            width: 8px;
            bottom: 9px;
            left: 4px;
            color: var(--primary-color);
        }

        .opt-plus-minus .max-qty-tooltip: after {
            content: "";
            position: absolute;
            height: 8px;
            width: 8px;
            bottom: -6px;
            right: 34px;
            border-right: 1px solid #ccc;
            border-bottom: 1px solid #ccc;
            transform: rotate(45deg);
            background-color: #fff;
        }

        .opt-plus-minus .long-press-tooltip {
            display: none;
            position: absolute;
            top: -29px;
            min-width: 115px;
            right: 0;
            font-size: 10px;
            background: #fff;
            padding: 5px;
            line-height: 10px;
            border-bottom: 1px solid #ccc;
            border-radius: 4px;
            box-shadow: 0 0px 6px 1px #efefef;
        }


        .opt-plus-minus .long-press-tooltip: after {
            content: "";
            position: absolute;
            height: 8px;
            width: 8px;
            bottom: -6px;
            right: 7px;
            border-right: 1px solid #ccc;
            border-bottom: 1px solid #ccc;
            transform: rotate(45deg);
            background-color: #fff;
        }

        .opt-plus-minus .plus: hover .long-press-tooltip {
            display: block;
            animation: hideMe 0s ease-in 2s forwards;
        }

        @keyframes hideMe {
            to {
                opacity: 0;
            }
        }

        .disable-product-qty .minus,
        .disable-product-qty .plus {
            display: none;
        }

        .disable-product-qty .nb {
            width: 100%;
        }

        .products-listing .addRemoveWrap .addRemove .nb {
            width: auto !important;
            padding-left: 5px;
            padding-right: 5px;
        }

        .products-listing .addRemoveWrap .addRemove input.nb {
            width: 36px !important;
            margin-right: 6px;
            margin-left: 2px;
            border: 1px solid #ddd;
            margin-top: -2px;
            transition: font-size .5s;
            border-radius: 5px;
        }

        .products-listing .addRemoveWrap .addRemove input.nb.ftz-15 {
            font-size: 15px;
            transition: font-size .5s;
        }

        .pt-plus-minus .max-qty-tooltip {
            display: none;
            position: absolute;
            top: -44px;
            min-width: 67px;
            width: auto;
            white-space: nowrap;
            left: 50%;
            font-size: 14px;
            background: #fff;
            padding: 10px;
            line-height: 12px;
            border-bottom: 1px solid #ccc;
            border-radius: 5px;
            box-shadow: 0 0px 12px 4px rgb(0 0 0 / 8%);
            text-align: center;
            padding-left: 28px;
            color:
                var(--primary-color);
            transform: translateX(-50%);
            animation: fadeInUp;
        }

        .pt-plus-minus .max-qty-tooltip.reached-max {
            display: block;
        }

        .pt-plus-minus .max-qty-tooltip: before {
            content: "\f1f8";
            font: 20px / 1 Material-Design-Iconic-Font;
            position: absolute;
            height: 8px;
            width: 8px;
            bottom: 17px;
            left: 6px;
            color:
                var(--primary-color);
        }

        .pt-plus-minus .max-qty-tooltip: after {
            content: "";
            position: absolute;
            height: 8px;
            width: 8px;
            bottom: -6px;
            left: 50%;
            border-right: 1px solid #ccc;
            border-bottom: 1px solid #ccc;
            transform: rotate(45deg);
            background-color: #fff;
        }

        .pt-plus-minus .long-press-tooltip {
            display: none;
            position: absolute;
            color: #444;
            top: -41px;
            min-width: 137px;
            right: 12px;
            font-size: 14px;
            background: #fff;
            padding: 8px;
            line-height: 14px;
            border-bottom: 1px solid #ccc;
            border-radius: 4px;
            box-shadow: 0 0px 12px 4px rgb(0 0 0 / 8%);
            white-space: nowrap;
        }


        .pt-plus-minus .long-press-tooltip: after {
            content: "";
            position: absolute;
            height: 8px;
            width: 8px;
            bottom: -6px;
            right: 7px;
            border-right: 1px solid #ccc;
            border-bottom: 1px solid #ccc;
            transform: rotate(45deg);
            background-color: #fff;
        }

        .pt-plus-minus .plus: hover .long-press-tooltip {
            display: block;
            animation: hideMe 0s ease-in 2s forwards;
        }



        .products-listing .max-qty-tooltip {
            display: none;
            position: absolute;
            top: -43px;
            min-width: 67px;
            width: auto;
            white-space: nowrap;
            right: 3px;
            font-size: 14px;
            background: #fff;
            padding: 7px;
            line-height: 13px;
            border-bottom: 1px solid #ccc;
            border-radius: 4px;
            box-shadow: 0 0px 6px 1px #efefef;
            text-align: center;
            padding-left: 24px;
            color:
                var(--primary-color);
            padding-bottom: 7px;
            padding-top: 6px;
        }

        .products-listing .max-qty-tooltip.reached-max {
            display: block;
        }

        .products-listing .max-qty-tooltip: before {
            content: "\f1f8";
            font: 16px / 1 Material-Design-Iconic-Font;
            position: absolute;
            height: 8px;
            width: 8px;
            bottom: 13px;
            left: 6px;
            color:
                var(--primary-color);
        }

        .products-listing .max-qty-tooltip: after {
            content: "";
            position: absolute;
            height: 8px;
            width: 8px;
            bottom: -6px;
            right: 34px;
            border-right: 1px solid #ccc;
            border-bottom: 1px solid #ccc;
            transform: rotate(45deg);
            background-color: #fff;
        }

        .products-listing .long-press-tooltip {
            display: none;
            position: absolute;
            color: #555;
            top: -30px;
            min-width: 87px;
            right: 0px;
            font-size: 10px;
            background: #fff;
            padding: 5px;
            line-height: 10px;
            border-bottom: 1px solid #ddd;
            border-radius: 4px;
            box-shadow: 0 0px 9px 3px rgb(0 0 0 / 4%);
        }


        .products-listing .long-press-tooltip: after {
            content: "";
            position: absolute;
            height: 8px;
            width: 8px;
            bottom: -6px;
            right: 7px;
            border-right: 1px solid #ccc;
            border-bottom: 1px solid #ccc;
            transform: rotate(45deg);
            background-color: #fff;
        }

        .products-listing .plus: hover .long-press-tooltip {
            display: block;
            animation: hideMe 0s ease-in 2s forwards;
        }

        .myBagModule .itemBags .addRemoveWrap input.nb {
            width: 51px;
            height: 22px;
            margin-top: 4px;
            transition: font-size .5s;
            border: 1px solid #999;
            line-height: 22px !Important;
            box-sizing: border-box;
        }

        .myBagModule .itemBags .addRemoveWrap input.nb.ftz-15 {
            font-size: 13px;
            transition: font-size .5s;
        }


        .myBagModule .max-qty-tooltip {
            display: none;
            position: absolute;
            top: -27px;
            min-width: 67px;
            width: auto;
            white-space: nowrap;
            left: -2px;
            font-size: 10px;
            background: #fff;
            padding: 5px;
            line-height: 10px;
            border: 1px solid #ccc;
            border-radius: 4px;
            box-shadow: 0 0px 6px 1px #efefef;
            text-align: center;
            padding-left: 20px;
            color:
                var(--primary-color);
        }

        .myBagModule .max-qty-tooltip.reached-max {
            display: block;
        }

        .myBagModule .max-qty-tooltip: before {
            content: "\f1f8";
            font: 15px / 1 Material-Design-Iconic-Font;
            position: absolute;
            height: 8px;
            width: 8px;
            bottom: 9px;
            left: 4px;
            color: var(--primary-color);
        }

        .myBagModule .max-qty-tooltip: after {
            content: "";
            position: absolute;
            height: 8px;
            width: 8px;
            bottom: -6px;
            left: 31px;
            border-right: 1px solid #ccc;
            border-bottom: 1px solid #ccc;
            transform: rotate(45deg);
            background-color: #fff;
        }

        .myBagModule .long-press-tooltip {
            display: none;
            position: absolute;
            top: -23px;
            min-width: 115px;
            left: -15px;
            font-size: 10px;
            background: #fff;
            padding: 5px;
            line-height: 10px;
            border: 1px solid #ccc;
            border-radius: 4px;
            box-shadow: 0 0px 6px 1px #efefef;
        }


        .myBagModule .long-press-tooltip: after {
            content: "";
            position: absolute;
            height: 8px;
            width: 8px;
            bottom: -6px;
            left: 14px;
            border-right: 1px solid #ccc;
            border-bottom: 1px solid #ccc;
            transform: rotate(45deg);
            background-color: #fff;
        }

        .myBagModule .plus: hover .long-press-tooltip {
            display: block;
            animation: hideMe 0s ease-in 2s forwards;
        }

        .delete-account-btn {
            min-width: 200px;
            width: 200px;
            height: 40px;
            margin-top: 40px;
            background-color: #d11a2a;
        }

        .rtl .delete-account-btn {
            margin-bottom: 40px;
        }

        #deleteMyAccountModalID.smallType1 {
            min-width: 350px;
        }

        #deleteMyAccountModalID.smallType1 .custText {
            width: 85%;
        }

        #deleteMyAccountModalID.smallType1 .genBtn {
            background-color: #d11a2a;
        }

        #deleteMyAccountModalID.smallType1 .moreBtn {
            border-color: #666;
            color: #666;
        }

        #deleteMyAccountModalID.smallType1 .moreBtn: hover {
            background-color: transparent;
        }

        @media (max-width:768px) {
            .delete-account-btn {
                margin-bottom: 100px;
                margin-left: auto;
                margin-right: auto;
                margin-top: 69px;
            }
        }

        @media only screen and (min-width: 820px) and (orientation: portrait) {
            body {
                zoom: 0.8;
            }

            .market body {
                zoom: 0.88;
            }

            .footer {
                display: none;
            }
        }

        #notificationModalID2 .title {
            margin-bottom: 15px;
        }

        #notificationModalID2 .messageContainer {
            font-weight: normal;
            text-align: center;
        }

        .for-free .itembagfooter {
            display: none;
        }

        .no-map .customDropDown.open .drop_options {
            bottom: auto;
        }

        .box_delivery .office {
            z-index: 4
        }

        .wautocomplete .list-group {
            position: absolute;
            top: 45px;
            left: 0px;
            width: 100%;
            box-shadow: 0 3px 10px 0px rgb(0 0 0 / 20%);
            z-index: 20;
            max-height: 170px;
            overflow-y: auto;
            background: #fff;
        }

        .wautocomplete .list-group .list-group-item {
            list-style-type: none;
            color: #666;
        }


        .wautocomplete .list-group .list-group-item: hover {
            background-color: #f8f8f8;

        }

        .wautocomplete .list-group li.list-group-item {
            width: calc(100% - 22px);
            border-bottom: 1px solid #ccc;
            font-weight: 400;
            padding: 10px;
            position: relative;
            cursor: pointer;
            font-size: 12px;
        }

        .lds-ellipsis {
            display: block;
            position: absolute;
            z-index: 1;
            width: 30px;
            height: 100%;
            right: 0;
            top: 0;
            padding-right: 4px;
            background: #f7f7f7;
        }

        .lds-ellipsis div {
            position: absolute;
            top: 20px;
            width: 4px;
            height: 4px;
            border-radius: 50%;
            background: #333;
            animation-timing-function: cubic-bezier(0, 1, 1, 0);
        }

        .lds-ellipsis div:nth-child(1) {
            left: 0;
            animation: lds-ellipsis1 0.6s infinite;
        }

        .lds-ellipsis div:nth-child(2) {
            left: 0px;
            animation: lds-ellipsis2 0.6s infinite;
        }

        .lds-ellipsis div:nth-child(3) {
            left: 8px;
            animation: lds-ellipsis2 0.6s infinite;
        }

        .lds-ellipsis div:nth-child(4) {
            left: 16px;
            animation: lds-ellipsis3 0.6s infinite;
        }

        @keyframes lds-ellipsis1 {
            0% {
                transform: scale(0);
            }

            100% {
                transform: scale(1);
            }
        }

        @keyframes lds-ellipsis3 {
            0% {
                transform: scale(1);
            }

            100% {
                transform: scale(0);
            }
        }

        @keyframes lds-ellipsis2 {
            0% {
                transform: translate(0, 0);
            }

            100% {
                transform: translate(8px, 0);
            }
        }


        @media(max-width:1300px) and (min-width:769px) {

            .right.rBox .loginor {
                display: block !important;
                margin-top: -27px !important;
                padding-bottom: 26px;
            }

            .market .right.rBox .loginor {
                margin-top: -16px !important;
            }

            .retail .right.rBox .loginor {
                margin-top: -1px !important;
            }

            .fnb .right.rBox .loginor {
                margin-top: -15px !important;
            }
        }

        .footer .topFoot {
            display: none;
        }

        .hide-add-button .addRemoveWrap {
            display: none;
        }

        /* .hide-add-button .customizedID .onRight{
    display:none;
}.hide-add-button .addtobagbtn.show{
    display:none !important;
} */
        .trackingDisabled .orderdet {
            display: none;
            width: 100%;
        }

        .currencyonleft .itemsList .itemGrid .priceWrap .price {
            direction: rtl;
        }

        .currencyonleft .customizedID .data .price {
            direction: rtl;
        }

        .currencyonleft .myBagModule .itemBags .total {
            direction: rtl;
        }

        .currencyonleft .sumhead div:nth-child(1),
        .currencyonleft .sumhead div:nth-child(2) {
            direction: rtl;
            float: left;
        }


        .currencyonleft .subTotalBox .totalPrice:nth-child(2) {
            direction: rtl;
        }

        .currencyonleft .myBagModule .itemBags .price {
            direction: rtl;
        }

        .currencyonleft .minitotal .mtprice {
            direction: rtl;
        }

        .currencyonleft .myBagModule .priceonbtn {
            direction: rtl;
        }

        .currencyonleft .myBagModule .subtotal .subPrice {
            direction: rtl;
        }


        .currencyonleft .customizedID .bigPrice {
            direction: rtl;
        }

        .currencyonleft .hissubtotal div {
            display: inline-block;
            direction: rtl;
        }


        .hide-add-button .checkboxCol .formPart .lines .line .check {
            display: none;
        }

        .hide-add-button .checkboxCol .formPart .lines .line .label {
            padding-left: 0;
        }

        .hide-add-button .checkboxCol .formPart .lines .line {
            pointer-events: none;
            opacity: 0.7;
        }

        .hide-add-button .checkboxCol .formPart .lines .line .input {
            cursor: default;
        }

        .hide-add-button .customnote {
            display: none;
        }

        .hide-add-button .formPart .line.sold-out .sold-out-item {
            display: none;
        }

        .hide-add-button .bigPrice.overbtn {
            display: none !important;
        }

        .footer {
            height: auto;
            background-color: #fafafa;
        }

        .footer .topFoot {
            position: relative;
            width: 100%;
            flex-direction: row;
            flex-wrap: nowrap;
            justify-content: space-around;
            max-width: 1120px;
            margin-left: auto;
            margin-right: auto;
            min-height: 250px;
        }

        .footer .topFoot .column {}

        .footer .topFoot .column .logo {
            position: relative;
            display: block;
            width: 50px;
            cursor: pointer;
        }

        .footer .topFoot .column .logo img {
            position: relative;
            display: block;
            width: auto;
            max-height: 28px;
        }

        .footer .topFoot .column .links .title {
            position: relative;
            display: block;
            font-weight: bold;
            font-size: 17px;
            line-height: 17px;
            margin-bottom: 22px;
        }

        .footer .topFoot .column .links .title: after {
            content:
                '';
            position:
                absolute;
            left: 0;
            bottom: -2px;
            width: 48px;
            height: 2px;
            background-color: #222222;
        }

        .footer .topFoot .column .links .link-item {
            position: relative;
            display: block;
            font-size: 14px;
            line-height: 14px;
            margin-bottom: 8px;
            cursor: pointer;
            text-transform: capitalize;

        }


        .footer .topFoot .column .links .link-item a {
            text-decoration: none;
            color: #222;
            text-transform: capitalize;
        }

        .footer .topFoot .column .links .link-item a:hover {
            color: #333;
        }

        .footer .address-box {
            padding-left: 35px;
            margin-bottom: 22px !important;
        }

        .footer .address-box::before {
            position: absolute;
            content: "";
            background-image: url(../images/location.png);
            width: 18px;
            height: 26px;
            background-repeat: no-repeat;
            background-size: contain;
            top: 0;
            left: 0px;
        }

        .footer .phones-box {
            padding-left: 35px;
            margin-bottom: 20px !important;
        }

        .footer .phones-box::before {
            position: absolute;
            content: "";
            background-image: url(../images/phone-footer.png);
            width: 19px;
            height: 20px;
            background-repeat: no-repeat;
            background-size: contain;
            top: 0;
            left: 0px;
        }

        .footer .emails-box {
            padding-left: 35px;
            margin-bottom: 10px !important;
        }

        .footer .emails-box::before {
            position: absolute;
            content: "";
            background-image: url(../images/mail.png);
            width: 19px;
            height: 16px;
            background-repeat: no-repeat;
            background-size: contain;
            top: 0;
            left: 0px;
        }

        .relationsinline .related-items .itemsList .itemGrid.showRGB {
            background-color: transparent !important;
            border-top: none;
        }


        .retail .related-items .itemsList .itemGrid.showRGB .picture {
            width: 45px;
            height: 45px;
            margin-left: 0px;
            margin-top: 10px;
            border-radius: 50%;
            min-width: 0px;
            min-height: 0px;
        }


        .top-categories {
            display: none;
        }

        .top-categories {
            background-color: #fff;
            padding: 8px 10px 10px;
            width: 100%;
            box-shadow: rgb(204 204 204 / 20%) 0 12px 8px;
            height: 28px;
            position: fixed;
            z-index: 3;
            top: 118px;
        }

        .top-categories ul {
            overflow: auto;
            width: 100%;
            white-space: nowrap;
            height: 45px;
        }

        .top-categories li {
            list-style: none;
            padding-bottom: 7px;
            padding-top: 6px;
            display: inline-block;
            padding-right: 25px;
            font-weight: bold;
            position: relative;
            width: auto;
            height: 21px;
            transition: all .2s linear 0s;
        }

        .top-categories li.selected {
            transition: all .2s linear 0s;
        }

        .top-categories a {
            color: #333;
            text-decoration: none;
            font-size: 14px;
            transition: all .2s linear 0s;
            height: 30px;
            display: inline-block;
        }

        .top-categories li.selected a {
            color: var(--primary-color);
            transition: all .2s linear 0s;
            border-bottom: 2px solid var(--primary-color);
        }

        @media (min-width: 769px) {
            .top-categories {
                display: none !important;
            }
        }

        .share-product {
            height: 24px;
            width: 24px;
            border-radius: 50%;
            /* display: flex; */
            display: none;
            border: 3px solid var(--primary-color);
            position: absolute;
            top: 38px;
            right: 84px;
            align-items: center;
            justify-content: space-around;
            cursor: pointer;
        }

        .share-product .zmdi-share: before {
            font-size: 21px;
            color: var(--primary-color);
        }

        @media (max-width: 768px) {
            .share-product {
                height: 22px;
                width: 22px;
                top: 11px;
                left: 55px;
                right: auto;
                z-index: 100;
            }

            .share-product .zmdi-share: before {
                font-size: 19px;
                margin-left: -1px;
            }
        }

        .fnb .itemsList .itemGrid: only-of-type,
        .market .itemsList .itemGrid:only-of-type {
            max-width: 400px;
        }

        .pinch-zoom {
            font-size: 0;
        }

        .zmdi-linkedin::before {
            background-image: url(../images/linkedin.png);
            width: 28px;
            height: 28px;
            display: inline-block;
            background-size: cover;
            content: "" !important;
        }

        .zmdi-snapchat::before {
            background-image: url(../images/snapchat.png);
            width: 28px;
            height: 28px;
            display: inline-block;
            background-size: cover;
            content: "" !important;
        }

        .zmdi-tiktok::before {
            background-image: url(../images/tiktok.png);
            width: 28px;
            height: 28px;
            display: inline-block;
            background-size: cover;
            content: "" !important;
        }

        .col-description {
            position: relative;
            display: block;
            padding-left: 30px;
            padding-right: 30px;
            margin-bottom: 0;
            margin-top: 15px;
        }

        .home-collection .swiper-container {
            width: calc(100% - 20px);
            position: relative;
            overflow: hidden !important;
            list-style: none;
            z-index: 1;
            display: inline-block;
            left: auto;
            margin-right: 20px;
        }

        .showSwiperArrows .home-collection .swiper-container {
            width: calc(100% - 60px);
            margin-left: 30px;
            margin-right: 30px;
        }

        .home-collection .swiper-container .swiper-wrapper {
            position: relative;
            overflow: visible !important;
            width: 100% !important;
            height: 100%;
            z-index: 1;
            display: flex;
            transition-property: transform, -webkit-transform;
            box-sizing: content-box;
            padding-bottom: 0px !important;
        }

        .market .home-collection.layout1 .swiper-container ul.case.products-listing {
            display: flex;
            align-items: stretch;
        }

        .home-collection .swiper-container .swiper-scrollbar {
            opacity: 1 !important;
            background-color: #eee;
            height: 1px;
        }

        .home-collection .swiper-container .swiper-scrollbar .swiper-scrollbar-drag {
            background-color: rgba(0, 0, 0, .5);
        }

        .home-collection .swiper-button-prev {
            background: none;
            left: 0px;
            font-size: 30px;
            padding: 5px;
            width: 20px;
            height: 29px;
            top: 33%;
            z-index: 1;
        }

        .home-collection .swiper-button-next {
            background: none;
            right: 0px;
            font-size: 30px;
            padding: 5px;
            width: 20px;
            height: 29px;
            top: 33%;
            z-index: 1;
        }

        .market .home-collection .swiper-button-prev,
        .market .home-collection .swiper-button-next {
            top: 50%;
        }

        .home-collection .swiper-button-prev,
        .home-collection .swiper-button-next {
            display: none;
        }

        .showSwiperArrows .home-collection .swiper-button-prev,
        .showSwiperArrows .home-collection .swiper-button-next {
            display: block;
        }

        #customizedModalID .swiper-button-prev {
            background: none;
            left: 0px;
            font-size: 30px;
            padding: 5px;
            width: 20px;
            height: 29px;
            z-index: 1;
        }

        #customizedModalID .swiper-button-next {
            background: none;
            right: 0px;
            font-size: 30px;
            padding: 5px;
            width: 20px;
            height: 29px;
            z-index: 1;
        }

        #customizedModalID .oneItem .swiper-button-prev {
            display: none;
        }

        #customizedModalID .oneItem .swiper-button-next {
            display: none;
        }

        #customizedModalID .swiper-button-prev,
        #customizedModalID .swiper-button-next {
            display: none;
        }

        .showSwiperArrows #customizedModalID .swiper-button-prev,
        .showSwiperArrows #customizedModalID .swiper-button-next {
            display: block;
        }

        .langswitcher-label {
            display: none;
        }

        @media(max-width:768px) {




            .home-collection .swiper-container {
                width: calc(100vw - 30px);
                /* margin: 0 auto; */
                position: relative;
                overflow: hidden !important;
                list-style: none;
                /* padding: 0; */
                z-index: 1;
                display: inline-block;
                left: auto;
                /* padding-left: 4px; */
                /* padding-right: 4px; */
                margin-left: 15px;
                margin-right: 15px;
            }
        }

        @media(min-width:769px) {
            .market.has-loyalty-points .itemsList .itemGrid .priceWrap .price.has-points {
                position: absolute;
                left: 14px;
                top: -34px;
            }

            .market.has-loyalty-points .itemsList .itemGrid .priceWrap .points-price {
                position: absolute;
                left: 14px;
                top: -9px;
            }
        }

        @media(min-width:1024px) {
            .market.has-loyalty-points .itemsList .itemGrid .priceWrap .price.has-points {
                position: absolute;
                left: 14px;
                top: -11px;
            }

            .market.has-loyalty-points .itemsList .itemGrid .priceWrap .points-price {
                position: absolute;
                left: 14px;
                top: 13px;
            }
        }


        @media(max-width:768px) {
            .market .itemsList .itemGrid .priceWrap .price {
                position: absolute;
                left: 14px;
                top: -34px;
            }

            .market.has-loyalty-points .itemsList .itemGrid .priceWrap .points-price {
                position: absolute;
                left: 14px;
                top: -11px;
            }
        }


        .has-loyalty-points .customizedID .data .price.has-points {
            margin-bottom: 0;
        }

        .customizedID .data .points-price-details {
            margin-top: 2px;
            margin-bottom: 52px;
            font-size: 13px;
            color: var(--secondary-color);
            position: relative;
            display: none;
            text-transform: lowercase;
        }

    
        .has-loyalty-points .customizedID .data .points-price-details {
            display: block;
        }

        .has-loyalty-points .bigPrice.overbtn.show .bigPriceValue.has-points {
            position: relative;
            display: block;
            top: 7px;
        }

        .bigPrice.overbtn.show .points-price-big-details {
            position: relative;
            display: none;
            top: 7px;
            text-transform: lowercase;
        }

        .has-loyalty-points .bigPrice.overbtn.show .points-price-big-details {
            display: block;
        }

        .has-loyalty-points .customizedID .bigPrice .bigPriceValue.has-points {
            position: relative;
            display: block;
            top: -9px;
            height: 22px;
        }

        .customizedID .bigPrice .points-price-big-details {
            position: relative;
            display: none;
            top: -14px;
            text-transform: lowercase;
            font-weight: normal;
            font-size: 14px;
        }

        .has-loyalty-points .customizedID .bigPrice .points-price-big-details {
            display: block;
        }

        .has-loyalty-points .myBagModule .itemBags .price.has-points {
            float: left;
            margin-top: 5px;
            cursor: pointer;
        }

        .has-loyalty-points .myBagModule .itemBags .price.has-points.selected {
            color: var(--secondary-color);
            transition: color 0.1s ease;
        }

        .myBagModule .itemBags .price-points-toggle {
            outline: 0;
            display: none;
            /* user-select: none; */
            cursor: pointer;
            height: 18px;
            background-color: #efefef;
            border-radius: 9px;
            width: 36px;
            position: relative;
            margin-bottom: 0;
            transition: all 0.4s ease;
            float: left;
            margin-left: 8px;
            margin-top: 4px;
        }

        .has-loyalty-points .myBagModule .itemBags .price-points-toggle {
            display: block;
        }

        .has-loyalty-points .myBagModule .itemBags .price-points-toggle: before {
            display: block;
            content: "";
            width: 14px;
            height: 14px;
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            left: 2px;
            right: auto;
            background-color: var(--secondary-color);
            border-radius: 12px;
            transition: all 0.4s ease;
        }

        .has-loyalty-points .myBagModule .itemBags .price-points-toggle.disabled {
            /* pointer-events: none;
    opacity: 0.6; */
        }

        .has-loyalty-points .myBagModule .itemBags .price-points-toggle.disabled: before {
            background-color: #ccc;
        }

        .has-loyalty-points .myBagModule .itemBags .price-points-toggle.toggled: before {
            left: 50%;
        }

        .myBagModule .itemBags .points-price {
            display: none;
            margin-top: 2px;
            font-size: 13px;
            color: #999;
            text-align: left;
            float: left;
            margin-left: 8px;
            text-transform: lowercase;
            margin-top: 5px;
            cursor: pointer;
        }

        .has-loyalty-points .myBagModule .itemBags .points-price {
            display: block;
        }

        .has-loyalty-points .myBagModule .itemBags .points-price.selected {
            color: var(--secondary-color);
            transition: color 0.1s ease;
        }


        .header-loyalty-value .progressbar {
            display: none;
        }

        @media (min-width:769px) {
            .has-loyalty-points .myBagModule .itemBags .price.has-points {
                /* float: none; */
                margin-top: 5px;
                cursor: pointer;
                font-size: 11px;
            }

            .has-loyalty-points .myBagModule .itemBags .price-points-toggle {
                /* float: none; */
                /* margin-left:0; */
                /* margin-right: 0; */
                margin-top: 8px;
                width: 24px;
                margin-left: 4px;
                height: 12px;
            }

            .has-loyalty-points .myBagModule .itemBags .price-points-toggle: before {
                width: 11px;
                height: 11px;
            }

            .has-loyalty-points .myBagModule .itemBags .points-price {
                /* float:none; */
                margin-left: 4px;
                /* margin-top: 4px; */
                font-size: 11px;
            }

            .has-loyalty-points .myBagModule .itemBags .itemBag .top.has-points {
                text-align: left;
            }
        }

        .orderdetails .myBagModule .itemBags .price-points-toggle {
            display: none !important;
        }

        .orderdetails .myBagModule .itemBags .points-price {
            display: none !important;
        }

        .myBagModule .itemBags .invoice-pts-price {
            display: none !important;
        }

        .orderdetails .myBagModule .itemBags .invoice-pts-price {
            display: block !important;
            padding-left: 30px;
        }

        .orderdetails .myBagModule .itemBags .price.has-points {
            display: none !important;
        }


        .tinyselect .max-qty-tooltip {
            display: none;
            position: absolute;
            top: -29px;
            min-width: 67px;
            width: auto;
            white-space: nowrap;
            right: 10px;
            font-size: 10px;
            background: #fff;
            padding: 5px;
            line-height: 10px;
            border-bottom: 1px solid #ccc;
            border-radius: 4px;
            box-shadow: 0 0px 6px 1px #efefef;
            text-align: center;
            padding-left: 20px;
            color: var(--primary-color);
            z-index: 5;
        }

        .tinyselect .max-qty-tooltip.reached-max {
            display: block;
        }

        .tinyselect .max-qty-tooltip: before {
            content: "\f1f8";
            font: 15px / 1 Material-Design-Iconic-Font;
            position: absolute;
            height: 8px;
            width: 8px;
            bottom: 9px;
            left: 4px;
            color: var(--primary-color);
        }

        .tinyselect .max-qty-tooltip: after {
            content: "";
            position: absolute;
            height: 8px;
            width: 8px;
            bottom: -6px;
            right: 34px;
            border-right: 1px solid #ccc;
            border-bottom: 1px solid #ccc;
            transform: rotate(45deg);
            background-color: #fff;
        }

        .tinyselect .long-press-tooltip {
            display: none;
            position: absolute;
            top: -29px;
            min-width: 115px;
            right: 0;
            font-size: 10px;
            background: #fff;
            padding: 5px;
            line-height: 10px;
            border-bottom: 1px solid #ccc;
            border-radius: 4px;
            box-shadow: 0 0px 6px 1px #efefef;
        }


        .tinyselect .long-press-tooltip: after {
            content: "";
            position: absolute;
            height: 8px;
            width: 8px;
            bottom: -6px;
            right: 7px;
            border-right: 1px solid #ccc;
            border-bottom: 1px solid #ccc;
            transform: rotate(45deg);
            background-color: #fff;
        }

        .tinyselect .fieldPlus: hover .long-press-tooltip {
            display: block;
            animation: hideMe 0s ease-in 2s forwards;
        }

        .tinyselect .nb {
            border: none;
            text-align: center;
        }





        .checkout-green-box {
            background-color: var(--primary-color);
        }

        .checkout-green-box .title {
            color: #fff;
            font-size: 23px;
            font-weight: bold;
        }

        .checkout-green-box .sub-title {
            color: #fff;
            font-family: 'Roboto', sans-serif;
            font-size: 16px;
            line-height: 22px;
            margin-bottom: 45px;
        }

        .checkout-green-box .choices-container {
            position: relative;
            display: block;
            color: #fff;
            margin-bottom: 15px;
        }

        .checkout-green-box .choice-title {
            position: relative;
            display: block;
            font-family: 'Roboto', sans-serif;
            font-size: 15px;
            font-weight: bold;
            padding-bottom: 17px;
            border-bottom: 1px solid var(--secondary-color);
            margin-bottom: 12px;
        }

        .checkout-green-box .input {
            position: relative;
            display: block;
            font-family: 'Roboto', sans-serif;
            font-size: 15px;
            font-weight: bold;
            padding-bottom: 17px;
            border-bottom: 1px solid var(--secondary-color);
            width: 100%;
            float: unset;
            margin-right: 0;
            margin-bottom: 12px;
        }

        .checkout-green-box .input: last-child {
            border-bottom: none;
        }

        .checkout-green-box .input .check .zmdi-circle-o,
        .checkout-green-box .input .check .zmdi-square-o,
        .checkout-green-box .input.checked .zmdi-check-square,
        .checkout-green-box .input.checked .zmdi-dot-circle {
            color: #fff;
        }

        .checkout-green-box .label {
            padding-top: 1px;
            color: #fff;
            margin-bottom: 0;
        }

        .checkout-green-box.receipt .label {
            cursor: default;
        }

        .checkout-green-box.receipt .input {
            cursor: default;
        }


        .rtl .checkout-green-box .sub-title {
            text-align: right;
        }

        .rtl .checkout-green-box .choice-title {
            text-align: right;
        }

        .rtl .checkout-green-box .check {
            left: unset;
            right: 0;
        }

        .rtl .checkout-green-box .input .label {
            padding-left: 0;
            padding-right: 22px;
        }

        .rtl .newsCtrl .titleAndLegend {
            direction: rtl;
            float: right
        }

        .rtl .newsCtrl .itemsList .itemGrid .wrap {
            padding-right: 14px;
            padding-left: 19px;
        }

        .newsCtrl .itemsList .itemGrid .descBlock .date {
            font-size: 13px;
            margin-top: 10px;
            pointer-events: none;
            color: #999;
        }

        .newsCtrl .itemsList .itemGrid {
            margin-bottom: 40px;
            float: none;
        }

        .newsCtrl .itemsList .itemGrid .descBlock {
            float: none;
        }

        .newsCtrl .itemsList .itemGrid .wrap {
            float: none;
        }

        .newsCtrl .itemsList .genBtn {
            float: none;
            margin-top: 15px
        }

        .rtl .newsCtrl .itemsList .genBtn {
            margin-right: 0;
        }

        .newsCtrl .itemsList .itemGrid .picture {
            float: none;
        }

        .checkoutID .pay-delivery-with-loyalty {
            display: none;
        }

        .has-loyalty-points .checkoutID .pay-delivery-with-loyalty {
            display: flex;
            position: relative;
            flex-wrap: nowrap;
            align-items: flex-start;
            justify-content: flex-start;
            margin-top: 15px;
            margin-bottom: 10px;
            flex-direction: row;
            cursor: pointer;
        }

        .checkoutID .pay-delivery-with-loyalty .check {
            position: relative;
            display: block;
            top: auto;
            left: auto;
            height: 20px;
            width: 20px;
            margin-right: 12px;
        }

        .checkoutID .pay-delivery-with-loyalty .delivery-fees {
            cursor: pointer;
        }

        .checkoutID .pay-delivery-with-loyalty .delivery-fees.selected {
            color: var(--secondary-color);
            transition: color 0.1s ease;
        }

        .checkoutID .pay-delivery-with-loyalty .delivery-fees-by-points {
            cursor: pointer;
        }

        .checkoutID .pay-delivery-with-loyalty .delivery-fees-by-points.selected {
            color: var(--secondary-color);
            transition: color 0.1s ease;
        }

        .checkoutID .pay-delivery-with-loyalty .price-points-toggle {
            outline: 0;
            display: block;
            cursor: pointer;
            height: 18px;
            background-color: #efefef;
            border-radius: 9px;
            width: 36px;
            position: relative;
            margin-bottom: 0;
            transition: all 0.4s ease;
            margin-left: 15px;
            margin-top: 3px;
            margin-right: 15px;
        }


        .checkoutID .pay-delivery-with-loyalty .price-points-toggle: before {
            display: block;
            content: "";
            width: 14px;
            height: 14px;
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            left: 2px;
            right: auto;
            background-color: var(--secondary-color);
            border-radius: 12px;
            transition: all 0.4s ease;
        }

        .checkoutID .pay-delivery-with-loyalty .price-points-toggle.disabled {
            pointer-events: none;
            opacity: 0.6;
        }

        .checkoutID .price-points-toggle.disabled: before {
            background-color: #ccc;
        }

        .checkoutID .pay-delivery-with-loyalty .price-points-toggle.toggled: before {
            left: 50%;
        }

        .checkoutID .pay-delivery-with-loyalty .delivery-fees-description {
            position: relative;
            display: block;
            width: 100%;
            text-align: left;
            text-transform: capitalize;
            color: #666;
            font-size: 14px;
        }

        .checkoutID .pay-delivery-with-loyalty .delivery-fees-description span {
            color: var(--secondary-color);
            text-transform: none;
        }

        .inner-customization-wrapper {
            position: relative;
            width: 100%;
            height: auto;
        }

        .inner-customization-wrapper .head {
            position: relative;
            display: block;
            width: 100%;
            float: none;
            min-height: 0;
            background: none;
        }

        .inner-customization-wrapper .picture {
            width: 40%;
            display: block;
            margin-left: auto;
            margin-right: auto;
        }

        .inner-customization-wrapper .picture .swiper-container {
            width: 100%;
        }

        .inner-customization-wrapper .picture .swiper-slide {
            width: 100% !important;
        }

        .fnb .cont .inner-customization-wrapper .data {
            display: block !important;
            padding-top: 20px;
        }


        @media (max-width:768px) {
            .hide-on-mobile {
                display: none;
            }

            .oc-scroll {
                width: 100% !important;
                /* display: none; */
                height: 34px;
                z-index: 10;
                pointer-events: none !important;
                overflow: hidden !important;
                top: auto;
                bottom: 0px;
                left: auto;
            }

            .oc-preview {
                width: 100%;
                height: 100%;
                right: auto;
                top: 0;
            }

            .oc-preview img {
                transform: none;
                margin-top: 10%;
                width: auto;
                margin-left: auto;
                margin-right: auto;
                display: block;
                height: 80%;
            }

            .swiper-pagination-pc {
                bottom: -10px;
            }

            .pc-wrapper.active .oc-selector {
                height: 400px;
            }
        }

        .age-restricted {
            display: none;
        }

        .cordova .age-restricted,
        .show-age-restriction .age-restricted {
            position: absolute;
            display: block;
            width: 26px;
            height: 30px;
            right: 20px;
            top: 20px;
            z-index: 111;
            background-color: #454545;
            color: #fff;
            font-size: 13px;
            border-radius: 50%;
            text-align: center;
            line-height: 27px;
            font-weight: bold;
            padding-right: 4px;
            pointer-events: none;
            opacity: 1;
        }

        .cordova .age-restricted::before,
        .show-age-restriction .age-restricted::before {
            content: '+';
            position: absolute;
            right: 1px;
            width: 10px;
            height: 10px;
            font-size: 10px;
            line-height: 12px;
            top: 7px;
            font-weight: normal;
        }

        .cordova .age-restricted::after,
        .show-age-restriction .age-restricted::after{
            content: attr(data-title);
            position: absolute;
            bottom: 2px;
            left: 9px;
            font-size: 6px;
            line-height: 9px;
            font-weight: normal;
            text-transform: uppercase;
        }

        .market .age-restricted {
            top: 45px;
            right: 10px;
        }

        .categories .age-restricted {
            top: 10px;
            right: 10px;
        }

        .cordova .product-age-restricted,
        .show-age-restriction .product-age-restricted 
        {
            /* opacity:0.05 !important; */
        }

        .age-restricted-overlay {
            display: none;
        }

        .cordova .product-age-restricted .age-restricted-overlay,
        .show-age-restriction .product-age-restricted .age-restricted-overlay
        {
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 2;
            background-color: #fffffff0;
        }

        .age-restricted-confirmed .product-age-restricted .age-restricted-overlay {
            display: none;
        }

        .age-restricted-confirmed .product-age-restricted {
            opacity: 1 !important;
        }

        .cordova.age-restricted-not-confirmed .category-is-age-restricted,
        .show-age-restriction.age-restricted-not-confirmed .category-is-age-restricted,
        .cordova.age-restricted-not-confirmed .collection-is-age-restricted,
        .show-age-restriction.age-restricted-not-confirmed .collection-is-age-restricted,
        .cordova.age-restricted-not-confirmed .product-age-restricted,
        .show-age-restriction.age-restricted-not-confirmed .product-age-restricted {
            display: none !important;
        }

        .customizedID .age-restricted {
            z-index: 25;
            top: 90px;
            right: 25px;
        }

        .errorpopup.show .btnClose {
            top: -42px !important;
        }

        .myBagModule .itemBags .customPart .inner-product {
            margin-top: 10px;
            position: relative;
            display: block;
            margin-bottom: 8px;
        }

        .myBagModule .itemBags .customPart .inner-product .part {
            min-height: 50px;
            padding-bottom: 8px;
        }

        .myBagModule .itemBags .itemBag .customPart .inner-product .casePic {
            width: 69px;
            height: 59px;
        }

        .myBagModule .itemBags .itemBag .customPart .inner-product .casePic .picture {
            width: 50px;
            height: 35px;
        }

        .myBagModule .itemBags .itemBag .customPart .inner-product .casePic .picture .backg {}

        .myBagModule .itemBags .itemBag .customPart .inner-product .casePic .picture .backg .innerbagimg {}

        .myBagModule .itemBags .customPart .inner-product .part .casedata {}

        .myBagModule .itemBags .customPart .inner-product .part .casedata .top {
            text-align: -webkit-left;
        }

        .myBagModule .itemBags .customPart .inner-product .part .casedata .category {
            width: 100%;
            text-transform: uppercase;
            font-size: 10px !important;
            font-weight: bold;
            /* color: #4e4e4e; */
            text-align: left;
            margin-top: 0;
        }

        .myBagModule .itemBags .customPart .inner-product .part .casedata .title {
            font-size: 12px !important;
            color: #4d4d4c;
            font-weight: bold;
            width: auto;
            margin-left: 0;
            display: inline-block;
            float: none;
            padding-top: 8px;
        }

        .myBagModule .itemBags .customPart .inner-product .part .casedata .nb {
            font-size: 14px;
            padding-top: 6px;
            margin-right: 2px;
            float: none;
        }

        .myBagModule .itemBags .customPart .inner-product .part .casedata .quantity {
            width: 100%;
        }

        .myBagModule .itemBags .customPart .inner-product .part .casedata .price {
            width: 100%;
            float: none;
            text-align: left;
            display: block;
            font-size: 12px;
            color: #999;
            margin-top: 0;
        }

        .inner-customize {
            font-size: 20px;
            position: absolute;
            right: -11px;
            top: -9px;
            padding-top: 6px;
            padding-bottom: 6px;
            padding-right: 12px;
            padding-left: 12px;
        }

        .price.move-it-left {
            right: 35px;
        }

        .discountpercent: before {
            content: "";
        }

        @media(min-width: 959px) and (max-width: 978px) {
            body {
                visibility: visible;
                zoom: 0.95 !important;
            }
        }

        @media(min-width: 908px) and (max-width: 958px) {
            body {
                visibility: visible;
                zoom: 0.94 !important;
            }
        }

        @media(min-width: 906px) and (max-width: 948px) {
            body {
                visibility: visible;
                zoom: 0.89 !important;
            }
        }

        .mobileMenuWrap .applinks {
            margin-left: 25px;
        }

        .cordova .mobileMenuWrap .applinks {
            display: none;
        }

        .mobileMenuWrap .lineLink.my-addresses {
            display: none;
        }

        .reachLocations .item .address-picture {
            position: relative;
            display: block;
            width: 100%;
            height: 200px;
            margin-bottom: 20px;
        }

        .reachLocations .item .address-picture img {

            position: relative;
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .reachLocations .service-type {
            position: relative;
            display: block;
            float: left;
            width: 100%;
            margin-top: 10px;
        }

        .reachLocations .service-type .service {
            color: #666;
            margin-right: 12px;
        }

        .reachLocations .service-type .service .zmdi {
            color: var(--secondary-color);
            margin-right: 2px;
        }

        .reachLocations .working-hours {
            position: relative;
            display: block;
            float: left;
            margin-top: 11px;
            color: #666;
        }

        .reachLocations .working-hours .working-hours-list {
            position: relative;
            display: block;
            margin-top: 12px;
            font-size: 14px;
        }

        .reachLocations .working-hours .working-hours-list .working-hours-item {
            width: 100%;
            margin-bottom: 8px;
        }

        .reachLocations .working-hours .working-hours-list .working-hours-item .working-hours-item-day {
            width: 90px;
            display: inline-block;
        }

        .menuontop .cat-description {
            font-family: textfont, serif;
            font-weight: normal !important;
            font-size: 15px;
            position: relative;
            color: #666;
            margin-bottom: 20px;
            margin-top: -15px;
            display: none;
        }

        @media (max-width: 1300px) {
            .menuontop .MenuParts .bag {
                display: block !important;
            }

            .menuontop .MenuParts .bag.minicv {
                display: none !important;
            }
        }


        .multiple-brands {
            width: calc(100vw - 69px) !important;
            max-width: 361px;
        }

        .multiple-brands .countrieslist li.thecountry {
            font-size: 17px;
            font-weight: bold;
            color: #333;
            height: 82px;
            padding-left: 10px;
            line-height: 73px !important;
            border-bottom: 1px solid #eee;
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            justify-content: flex-start;
            align-items: center;
        }

        .multiple-brands .brand-logo {
            width: 100px;
            height: auto;
            margin-right: 20px;
            max-height: 70px;
        }



        .retail.has-retail-quick-add .itemsList .itemGrid {
            width: 100%;
            display: grid;
            align-content: space-between;
            margin-bottom: 0;
        }

        .retail.has-retail-quick-add .itemsList .itemGrid .genBtn.quickadd {
            position: relative;
            display: block;
            padding-top: 8px;
            float: right;
            margin-right: -8px;
            margin-top: -4px;
            text-align: center;
            width: auto;
            padding-right: 15px;
            padding-left: 15px;
            height: 32px;
            pointer-events: all;
        }

        .retail.has-retail-quick-add ul.case.products-listing {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(195px, 1fr));
            justify-content: space-between;
            grid-gap: 18px;
        }

        .retail.has-retail-quick-add .home-collection.layout1 .swiper-container ul.case.products-listing {
            display: flex;
            align-items: stretch;
            grid-gap: 0;
        }

        .retail.has-retail-quick-add .home-collection.layout1 .swiper-container ul.case.products-listing .itemGrid {
            margin-bottom: 21px;
        }

        .retail.has-retail-quick-add .heart {
            position: absolute;
            right: 14px;
            display: inline-block;
            top: 27px;
            left: auto;
            bottom: auto;
            z-index: 22 !Important;
        }

        .retail.has-retail-quick-add .favoriteBox.addToFavorites {
            bottom: -13px;
            right: 25px;
        }

        .sub-categories-container {
            position: absolute;
            display: none;
            width: calc(100% - 630px);
            left: 303px;
            overflow: hidden !important;
            padding-bottom: 9px;
            top: 245px;
        }

        .categoryPid .sub-categories-container {
            display: block;
        }

        .market .sub-categories-container {
            top: 227px;
            border-bottom: 1px solid #eeeeee;
        }

        .retail .sub-categories-container {
            left: 305px;
            width: calc(100% - 635px);
            top: 131px;
            border-bottom: 1px solid #eeeeee;
        }

        .retail.menuontop .sub-categories-container {
            left: 118px;
            width: calc(100% - 250px);
            top: 195px;
            border-bottom: 1px solid #eeeeee;
        }

        .sub-categories-container .sub-categories {
            list-style: none;
            display: flex;
            align-items: start;
            justify-content: start;
        }

        .sub-categories-container .sub-categories .link-container {
            border: 1px solid #ccc;
            border-radius: 20px;
            box-shadow: 0px 0px 6px -2px #ddd;
            width: fit-content;
        }

        .sub-categories-container .sub-categories .link-container .link {
            position: relative;
            display: block;
            padding-left: 16px;
            padding-right: 16px;
            padding-top: 6px;
            height: 23px;
            text-decoration: none;
            font-size: 14px;
            color: #999;
        }

        .sub-categories-container .sub-categories .link-container.selected .link {
            color: var(--primary-color);
            font-weight: bold;
        }

        .sub-categories-container .swiper-scrollbar {
            bottom: 0;
            height: 1px;
            background-color: #eee;
            opacity: 1 !important;
        }

        .sub-categories-container .swiper-scrollbar .swiper-scrollbar-drag {
            background: var(--primary-color);
            box-shadow: none;
        }

        .sub-category-title {
            font-size: 26px;
            color: var(--primary-color);
            padding-left: 16px;
            position: relative;
        }

        .retail .sub-category-title {
            font-size: 20px;
            padding-left: 16px;
        }

        .retail.menuontop .sub-category-title {
            font-size: 30px;
            padding-left: 20px;
        }

        .sub-category-title:before {
            content: "»";
            font-size: 27px;
            color: var(--primary-color);
            position: absolute;
            display: inherit;
            left: 0;
            top: -4px;
        }

        .retail .sub-category-title: before {
            font-size: 23px;
        }

        .retail.menuontop .sub-category-title: before {
            font-size: 30px;
        }

        .isSearching .sub-categories-container,
        .searchopen .sub-categories-container {
            display: none;
        }


        @media (min-width:769px) {
            .categoryPid:not(.isSearching):not(.searchopen) .has-subcategories .titleAndLegend {
                padding-bottom: 50px;
            }

            .market .categoryPid:not(.isSearching):not(.searchopen) .has-subcategories .titleAndLegend {
                padding-bottom: 60px;
            }

            .retail .categoryPid:not(.isSearching):not(.searchopen) .has-subcategories .titleAndLegend {
                margin-bottom: 50px;
                padding-bottom: 0;
            }

            .retail.menuontop .categoryPid:not(.isSearching):not(.searchopen) .has-subcategories .titleAndLegend {
                margin-bottom: 50px;
                padding-bottom: 0;
            }

            .mobile-only {
                display: none !important;
            }
        }

        @media (max-width:1300px) {
            .sub-categories-container {
                width: calc(100% - 342px);
            }

            .sub-category-title {
                display: none;
            }
        }


        @media (max-width:768px) {

            .sub-categories-container,
            .categoryPid .sub-categories-container {
                display: none;
            }

        }



        .itemsList .itemGrid .picture.has-swiper .swiper-container {
            position: absolute;
            display: block;
            width: 100%;
            height: 100%;
            left: 0;
            top: 0;
            margin-left: 0px;
            margin-right: 0px;
        }


        .itemsList .itemGrid .picture.has-swiper .swiper-button-prev {
            background: none;
            left: 0px;
            font-size: 30px;
            padding: 5px;
            width: 20px;
            height: 29px;
            top: 33%;
            z-index: 1;
            color: #333;
        }

        .itemsList .itemGrid .picture.has-swiper .swiper-button-next {
            background: none;
            right: 0px;
            font-size: 30px;
            padding: 5px;
            width: 20px;
            height: 29px;
            top: 33%;
            z-index: 1;
            color: #333;
        }


        .itemsList .itemGrid .picture.has-swiper .swiper-button-prev,
        .itemsList .itemGrid .picture.has-swiper .swiper-button-next {
            top: 50%;
            display: block;
        }

        .itemsList .itemGrid .picture.has-swiper .swiper-button-prev: before,
        .itemsList .itemGrid .picture.has-swiper .swiper-button-next:before {
            text-shadow: 0px 0px 1px #fff;
        }



        .hide-bag .MenuParts .bag {
            display: none !important;
        }

        .hide-bag .MenuParts .bag.minicv {
            display: block !important;
        }


        @media (min-width: 769px) {
            .hide-bag .bagph {
                top: 70px !important;
                height: calc(100vh - 70px) !important;
                z-index: 11;
                transform: translateX(400px);
                transition: all .2s ease-in 0s;
            }

            .hide-bag .showminicart .bagph {
                transform: translateX(0px);
                transition: all .2s ease-out 0s;
            }

            .hide-bag .content {
                width: calc(100% - 304px);
            }

            .hide-bag .footer {
                width: 100%;
                z-index: 10;
            }

            .hide-bag img.headbackimg {
                width: 100%;
            }

            .hide-bag .checkoutID .bagph,
            .hide-bag .checkoutID .myBagModule.stick {
                z-index: 9;
                transform: translateX(0px);
                transition: all .3s ease 0s;
            }

            .hide-bag .checkoutID .content {
                background-color: #eee;
                width: calc(100% - 600px);
                margin-bottom: 62px;
            }
        }

        #customizedModalID .related-items .swiper-button-prev,
        #customizedModalID .related-items .swiper-button-next {
            display: none;
        }

        ;
        /* margin-top: -47px !important; */
    }

    .fnb.enablesorting .categoryPid .sorter.subempty {
        top: -41px !important;
    }

    .retail.enablesorting .categoryPid .sorter.subempty {
        margin-top: -7px
    }

    .flmenubtn.retailonly {
        display: none
    }

    .retail .flmenubtn.retailonly {
        display: block
    }

    .retail .receiptPid .flmenubtn.retailonly {
        display: none !important;
    }

    .receiptPid .retail .flmenubtn.retailonly {}

    .retail .pages .flmenubtn.retailonly {
        display: none !important
    }
}

.minimumOrderChargeAlert {
    position: relative;
    display: block;
    text-align: center;
    font-size: 13px;
    padding: 4px 25px;
    margin-bottom: 18px;
    background-color: #fffde1;
    border-radius: 6px;
    line-height: 18px;
    margin-top: 32px;
    color: #d88c00;
    font-weight: bold;
    padding-top: 11px;
    padding-bottom: 13px
}

.minimumOrderChargeAlert.minimumOrderCouponChargeAlert {
    margin-top: -14px;
    background-color: transparent;
    height: 31px;
    color: #e6a01f;
    font-weight: bold;
    text-align: left;
    padding: 0
}

.checkout-offer .minimumOrderChargeAlert {
    background: transparent;
    text-align: left;
    margin: 0 0 0 4px;
    padding-left: 0;
    color: #d58325;
    white-space: normal;
    font-size: 14px
}

.rtl .checkout-offer .minimumOrderChargeAlert {
    text-align: right;
    padding-right: 15px;
    margin-bottom: -14px;
}

.header-loyalty-value {
    display: none
}

.loyalty-details footer {
    display: none
}

.home-collection {
    position: relative;
    display: block
}

.home-collection:not(:has(.descBlock)) {
    /* display: none; */
}

.home-collection.layout4 .title,
.home-collection.layout3 .title {
    /* position: absolute; */
    /* width: 100%; */
    /* height: 100%; */
    /* color: #fff; */
    /* display: table-cell; */
    /* vertical-align: bottom; */
}

.home-collection.layout3 .title {
    /* height: auto; */
}

.home-collection.layout3 .title.noprod {
    /* bottom: 10px; */
    /* top: 98px; */
}

.home-collection.layout4 .title span,
.home-collection.layout3 .title span {
    /* position: absolute; */
    /* transform: translate3d(-50%, 10px, 10px); */
    /* left: 50%; */
    /* text-shadow: rgba(0, 0, 0, 0.36) 4px 3px 17px, rgba(0, 0, 0, 0.38) 0 3px 6px; */
    /* bottom: 122px; */
    /* font-size: 42px; */
    /* line-height: 37px; */
    /* text-align: center; */
}

.home-collection.layout3 .title span {
    /* font-size: 40px; */
    /* width: calc(100% - 93px); */
    /* font-weight: bold; */
    /* line-height: 54px; */
}

.home-collection.layout4 {
    width: calc(50% - 15px);
    /* margin-top: 42px; */
    display: inline-block;
    padding-right: 15px;
    position: relative;
}

.home-collection.layout4:nth-of-type(2) {
    padding-right: 0
}

.home-collection.layout4 img {
    width: 100%;
    height: auto
}

.home-collection .title {
    margin-top: 22px;
}

.home-collection .title {
    position: relative;
    display: block;
    font-size: 27px;
    text-transform: capitalize;
    font-family: textfont;
    color: var(--secondary-color);
    padding-bottom: 19px;
    text-decoration: none;
    font-weight: bold !important;
    z-index: 1;
    box-sizing: border-box;
}

.home-collection.layout8,
.home-collection.layout7,
.home-collection.layout6,
.home-collection.layout9 {
    /* float:left; */
    width: calc(19vw - 12px);
    display: inline-block;
}

.home-collection.layout7 {
    /* float:left; */
    width: calc(23.7vw - 12px);
    display: inline-block;
}

.home-collection.layout6 {
    /* float:left; */
    width: calc(31.5vw - 12px);
    display: inline-block;
}

.home-collection.layout9 {
    /* float:left; */
    width: calc(31.5vw - 12px);
    display: inline-block;
}

.home-collection.layout8 .title,
.home-collection.layout7 .title,
.home-collection.layout6 .title,
.home-collection.layout9 .title {
    width: calc(100vw - 114px);
    text-align: center;
}

.lwr .home-collection .title {
    display: none !important;
}

.home-collection.layout8 .coimg,
.home-collection.layout7 .coimg,
.home-collection.layout6 .coimg {
    width: 100%;
    overflow: hidden;
}

.home-collection.layout8~.home-collection.layout8 .title,
.home-collection.layout7~.home-collection.layout7 .title,
.home-collection.layout6~.home-collection.layout6 .title,
.home-collection.layout9~.home-collection.layout9 .title {
    visibility: hidden;
    width: auto !important;
    display: block;
}

.home-collection.layout8~.home-collection.layout8,
.home-collection.layout7~.home-collection.layout7,
.home-collection.layout6~.home-collection.layout6,
.home-collection.layout9~.home-collection.layout9 {
    margin-left: 10px;
    margin-bottom: 62px;
}

.rtl .home-collection .title {
    direction: rtl;
    text-align: right;
    /* padding-right: 24px; */
}

.relations .title {
    position: relative;
    display: block;
    font-size: 24px;
    text-transform: capitalize;
    font-family: textfont;
    color: var(--secondary-color);
    padding-bottom: 19px;
    text-decoration: none;
    font-weight: bold !important
}

.market .ymliketitle,
.market .ymlike {
    display: inline-block
}

@media only screen and (max-width:768px) {
    .home-collection>.title {
        font-size: 22px;
        letter-spacing: normal;
        text-align: left;
        padding-left: 12px;
        padding-top: 27px
    }

    .home-collection>a.title {
        /* width: calc(100vw - 123px); */
        /* font-size: 24px; */
        /* line-height: 24px; */
        /* box-sizing: border-box; */
    }

.rtl .home-collection .title {
    padding-right: 17px;
}

    .home-collection.layout8~.home-collection.layout8 .title,
    .home-collection.layout7~.home-collection.layout7 .title,
    .home-collection.layout6~.home-collection.layout6 .title,
    .home-collection.layout9~.home-collection.layout9 .title {
        display: none;
    }

    .home-collection.layout3 .title,
    .home-collection.layout4 .title {
        /* height: calc(100% - 391px); */
        /* margin-left: 0px !Important; */
        /* margin-right: 0px !important; */
    }

    .home-collection .title span {
        /* font-size: 26px; */
        /* line-height: 24px; */
        /* bottom: 102px; */
        /* font-weight: bold; */
        /* text-shadow: rgba(0, 0, 0, 0.25) 4px 3px 20px, rgba(0, 0, 0, 0.22) -2px -1px 20px; */
    }
}

.home-collection .view-more {
    position: absolute;
    top: 0px;
    right: 15px;
    background-color: #fff;
    text-align: center;
    min-width: 55px;
    height: 32px;
    border-radius: 9px;
    font-size: 12px;
    text-decoration: none;
    color: #000;
    line-height: 32px;
    box-shadow: rgba(204, 204, 204, 0.24) 0 0 4px;
    border: 1px solid #eee;
    padding-left: 20px;
    padding-right: 18px;
    z-index: 2;
}

.fnb .home-collection .view-more {
    display: none;
}

.home-collection.layout8 .view-more,
.home-collection.layout7 .view-more,
.home-collection.layout6 .view-more,
.home-collection.layout9 .view-more {
    border: 0px;
    box-shadow: none;
    top: auto;
    bottom: 32px;
    width: 100%;
    text-align: center;
    left: 0px;
    right: auto;
    min-width: auto;
    padding: 0px !important;
    font-size: 17px;
    font-weight: bold;
    display: block;
    background-color: transparent;
}

.home-collection.layout8 img,
.home-collection.layout7 img,
.home-collection.layout6 img,
.home-collection.layout9 img {
    width: 100%;
    height: auto;
    margin-bottom: 74px;
}

.home-collection.layout4 .view-more,
.home-collection.layout3 .view-more {
    /* background-color: transparent; */
    /* border-width: 0 0 2px; */
    /* border-top-style: initial; */
    /* border-right-style: initial; */
    /* border-left-style: initial; */
    /* border-top-color: initial; */
    /* border-right-color: initial; */
    /* border-left-color: initial; */
    /* border-image: initial; */
    /* position: absolute; */
    /* transform: translate3d(-50%, 10px, 10px); */
    /* left: 50%; */
    /* text-shadow: rgba(0, 0, 0, 0.36) 4px 3px 17px, rgba(0, 0, 0, 0.38) 0 3px 6px; */
    /* bottom: 61px; */
    /* font-size: 17px; */
    /* color: #000; */
    /* font-weight: bold; */
    /* border-bottom-style: solid; */
    /* border-bottom-color: #fff; */
    /* border-radius: 0; */
    /* display: inline-table; */
    /* top: auto; */
}

.home-collection.layout3 .view-more {
    /* bottom: 668px; */
}

.home-collection.layout3 .view-more.noprod {
    /* bottom: 63px; */
}

.rtl .home-collection .view-more {
    right: auto;
    left: 13px;
}

.home-collection.layout3 .view-more {
    /* bottom: auto; */
    /* top: -6px; */
    /* right: 20px!important; */
    /* transform: none; */
    /* left: auto!important; */
}

.rtl .home-collection.layout3 .view-more {
    /* right: auto!important; */
    /* left: 20px!important; */
}

.homePid .gridSystem .case {}

@media(min-width: 769px) {
    .homePid .content {
        padding-bottom: 60px;
        margin-top: 0
    }

    .rtl .homePid .content {
        float: right
    }

    .menuontop .pheadline {
        padding-left: 57px;
        box-sizing: border-box
    }
}

.delivery-date {
    text-align: left;
    font-size: 13px;
    margin-top: -12px;
    color: #777;
    margin-bottom: 12px;
    display: none;
}

.no-asap-order .delivery-date {
    display: block;
}

.rtl .delivery-date {
    direction: rtl;
    text-align: right!important;
}

.pickupmode .delivery-date {
    display: none
}

.scroll-up {
    width: 60px;
    height: 60px;
    background-color: var(--primary-color);
    position: fixed;
    bottom: -258px;
    left: 34px;
    border-radius: 100%;
    cursor: pointer;
    box-shadow: rgba(0, 0, 0, 0.5) 5px 8px 20px;
    z-index: 4;
    transition: all .3s cubic-bezier(0.93, 0.01, 0.24, 1.27) 0s
}

.rtl .scroll-up {
    right: 34px;
    left: auto
}

.scroll-up.show {
    transition: all .3s cubic-bezier(0.93, 0.01, 0.24, 1.27) 0s;
    bottom: 82px;
    display: none;
}

.scroll-up::after {
    display: inline-block;
    font: 18px / 1 Material-Design-Iconic-Font;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    content: "\F303";
    width: 50px;
    position: absolute;
    right: 5px;
    top: 20px;
    pointer-events: none;
    color: #fff;
    text-align: center
}

.normalForm .select-list select {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    padding-left: 12px;
    color: #4d4d4c;
    font-size: 13px;
    background-color: #f6f6f6
}

.signupform .select-list select {
    background-color: #fff;
    color: #999;
    padding-left: 20px;
}

.inputWrap.select-list .label {
    right: 10px;
    opacity: .2
}

@media(min-width:1301px) {
    .checkoutbag {
        display: none
    }
}
    @media(min-width:1271px) {
    .genBtn:hover {
        filter: brightness(1.1)
    }
}

.zmdi-facebook::before {
    background-image: url("../images/facebook.png");
    width: 28px;
    height: 28px;
    display: inline-block;
    background-size: cover;
    content: "" !important
}

.zmdi-instagram::before {
    background-image: url("../images/instagram.png");
    width: 28px;
    height: 28px;
    display: inline-block;
    background-size: cover;
    content: "" !important
}

.zmdi-twitter::before {
    background-image: url("../images/twitter.png");
    width: 28px;
    height: 28px;
    display: inline-block;
    background-size: cover;
    content: "" !important
}

.hot-line::after {
    content: "";
    background-image: url("../images/phone.png");
    width: 26px;
    height: 26px;
    display: inline-block;
    background-size: contain;
    background-position: 0 0;
    background-repeat: no-repeat;
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%)
}

.whatsapps .hot-line::after {
    content: "whatsapp";
    visibility: visible;
    z-index: 1;
    position: absolute;
    right: 34px;
    font-size: 18px;
    line-height: 8px;
    top: 2px
}

.whatsapp .hot-line::after {
    content: "\F405";
    background-image: none;
    font-size: 28px;
    box-sizing: border-box;
    height: 45px;
    visibility: visible;
    right: 0;
    padding-left: 14px;
    line-height: 44px;
    width: auto;
    background-color: #5eb620;
    border-radius: 5px;
    padding-right: 12px
}

.retail .genBtn.quickadd.ng-scope {
    display: none
}

.retail.large-menu-img .itemsList .itemGrid .descBlock .title {
    font-size: 14px;
    line-height: 15px;
    font-family: textfont;
    white-space: normal;
    color: #333;
    margin-top: 2px;
    padding-bottom: 0 !important;
    font-weight: 400 !important;
}

.retail.large-menu-img .newsCtrl .itemsList .itemGrid .descBlock .description {
    display: block;
    padding-right: 0
}

.newsCtrl .activecat {
    display: none
}

.itemsList .itemGrid .descBlock .brand {
    font-size: 15px;
    margin-top: 12px;
    color: #333;
    /* margin-bottom: 6px; */
    white-space: normal;
    font-weight: bold
}

.rtl .itemsList .itemGrid .descBlock .brand {
    text-align: right;
}

.retail .itemsList .itemGrid .descBlock .brand {
    margin-bottom: 0;
    font-size: 14px
}

.retail .itemsList .itemGrid .priceWrap .price {
    text-align: left;
    /* padding-left: 12px; */
    font-weight: normal;
    color: #999;
    margin-left: 0px;
}

.rtl.retail .itemsList .itemGrid .priceWrap .price {
    text-align: left !important;
}

.retail.menuontop .itemsList .itemGrid .priceWrap .price {
    padding-left: 3px
}

.retail .retailonly {
    display: block
}

.retail .customizedID .addRemoveWrap .addRemove {
    display: none
}

.retail .customizedID {
    width: calc(100vw - 715px);
    min-width: 955px;
}

.retail .customizedID .genBtn {
    width: 50%;
    display: none
}

.retail .customizedID .genBtn.editmode {
    display: block
}

.retail .customizedID .genBtn.retailonly {
    display: block;
    position: relative;
    height: 50px;
    border-radius: 4px;
    width: 100%;
    float: left;
    text-align: center;
    line-height: 50px;
    margin-bottom: 22px;
    font-weight: bold
}

.market.productpage .customizedID .genBtn.retailonly {
    display: block;
    position: relative;
    height: 50px;
    border-radius: 4px;
    width: 100%;
    float: left;
    text-align: center;
    line-height: 58px;
    margin-bottom: 22px;
    font-weight: bold;
    height: 58px;
    border-radius: 7px;
    width: calc(100% - 142px);
    margin-top: -93px;
    left: 131px;
    z-index: 0;
    padding-left: 34px;
}

.rtl.market.productpage .customizedID .genBtn.retailonly {
    left: auto;
    right: 130px;
    padding-left: 0px;
    padding-right: 15px;
}

.classicproduct .customizedID .genBtn.retailonly {
    width: 100%;
    float: right;
    border-radius: 0 4px 4px 0;
    max-width: 280px;
}

.rtl.classicproduct .customizedID .genBtn.retailonly {
    border-radius: 4px 0px 0px 4px;
}

.meta .title {
    font-family: 'titlefont';
    font-size: 31px;
    width: 100%;
    margin-bottom: 19px;
    max-width: 444px;
}

.meta .sku {
    text-transform: uppercase;
    font-size: 11px;
    color: #ddd;
    /* margin-top: 10px; */
    margin-bottom: 2px;
}

.retail .meta .sku {
    /* margin-top: -1px!important; */
}

.meta .brand {
    margin-bottom: -1px;
    color: #000;
    margin-top: 7px;
    font-size: 22px;
    font-weight: bold
}

.retail .retailonly.meta .brand {
    font-size: 18px;
    margin-bottom: 3px
}

.retail .customizedID .data {
    display: none
}

.retail .customizedID .picture {
    max-height: 100%;
    height: 100%;
    margin-bottom: 0;
    /* position: absolute; */
    border: 0;
    /* background-color: #f2f2f2; */
}

.retail .customizedID .picture .swiper-container {
    position: relative;
    display: block;
    margin: 0;
    /* height: 100%; */
    /* border: 15px solid #f6f6f6; */
    box-sizing: border-box;
    overflow: hidden !important
}

.market .customizedID .picture .swiper-container {
    height: 100%;
    display: block
}

.retail .customizedID .picture .swiper-slide {
    /* background-color: #eee; */
    display: table;
    /* height: 100% !important; */
}

.market .customizedID .picture .swiper-slide {
    background-color: #fff;
    /* display: table; */
    /* height: 100% !important; */
    max-width: 100%;
}

.retail .customizedID .picture .pinch-zoom {
    display: table-cell;
    vertical-align: middle;
}

.market .customizedID .picture .pinch-zoom {
    /* vertical-align: middle; */
    display: flex;
    /* justify-content: center; */
    align-items: center;
    /* height: inherit; */
    height: 100%;
}

.retail .customizedID .head .wrap {
    height: 100% !important
}

.retail .customizedID .wrap-c {
    display: inline-block;
    width: 100%;
    background-color: #fff;
}

.retail .customizedID .head {
    width: 50%;
    height: 100%;
    background-color: #f6f6f6;
    max-width: 650px;
    box-sizing: border-box;
    padding-right: 2px;
}

.retail .customizedID .cont {
    width: 50%;
    min-height: 100%;
    float: left;
    box-sizing: border-box;
    background-color: #fff;
    height: auto;
    padding-bottom: 0;
    padding-left: 28px;
    padding-right: 0;
    padding-top: 44px;
    box-sizing: border-box;
}

.retail.productpage .customizedID .cont {
    padding-top: 0px;
}

.retail .customizedID .backg {
    position: relative;
    left: auto;
    transform: none;
    cursor: zoom-in
}

.retail .wrapCustom {
    margin-top: 38px
}

.retail .wrapCustom {
    /* opacity: 0; */
    transition: all 0.5s;
}

.retail .wrapCustom:has(.relationsinline) {
    opacity: 1;
}

.retail .wrapCustom .description {
    font-size: 14px;
    color: #444;
    margin-bottom: 32px;
    display: inline-block;
    line-height: 23px;
    margin-top: 18px;
    font-weight: normal;
}

.retail.rtl .wrapCustom .description img {
    width: 100%;
    height: auto;
}

.retail .column_cust .bTitle {
    border-bottom: 0;
    margin-bottom: 4px;
    text-transform: uppercase;
    font-size: 12px;
    display: none
}

.retail .formPart .lines .line {
    border-bottom: 1px solid #eee;
    break-inside: avoid;
    overflow: hidden
}

.retail .formPart .lines .line .check {
    top: -2px
}

.line.sold-out {
    opacity: .5
}

.retail .formPart .lines .line:last-child {
    border-bottom: 0
}

.retail .formPart .lines {
    background-color: #fff;
    border-radius: 4px;
    box-shadow: rgba(36, 36, 36, 0.07) 0 3px 23px;
    overflow: hidden;
    box-sizing: border-box;
    min-height: 41px
}

.classicproduct .formPart .lines {
    border-radius: 0
}

.retail .formPart .lines .line {
    padding: 13px;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0
}

.retail.classicproduct .formPart .lines .line {
    margin-bottom: 10px;
}

.classicproduct.retail .formPart .lines {
    background-color: transparent
}

.retail .formPart .lines .line:last-child:first-child {
    width: 100%;
    min-height: 38px !important
}

.tinyselect {
    display: none
}

.checked .tinyselect {
    display: block;
    z-index: 1;
    border-radius: 7px;
}

.price.nearadd .tinyselect {
    margin-top: -7px;
    border-radius: 4px;
    border-color: #fff;
    overflow: visible;
    width: 117px !important;
    margin-right: -15px !important
}

.retail .tinyselect.lastitem {
    visibility: hidden
}

.retail .tinyselect.lastitem::before {
    content: "last item";
    position: absolute;
    visibility: visible;
    font-family: inherit;
    font-size: 11px;
    text-transform: uppercase;
    background-color: #666;
    height: 20px;
    line-height: 20px;
    padding-left: 7px;
    padding-right: 7px;
    border-radius: 4px;
    right: -5px;
    left: auto;
    letter-spacing: .5px;
    color: #fff !important;
    top: 1px !important
}

.retail .tinyselect.fx {
    bottom: 18px;
    position: fixed;
    left: 0;
    z-index: 999999;
    display: block;
    background: #fff;
    border-color: #fff
}

.price.nearadd .tinyselect select {
    background: #fff;
    color: #333;
    border: none;
    pointer-events: none;
    /* padding-left: 47% !important; */
    text-align: center;
    width: 100% !important;
    text-align-last: center;
    padding-left: 0px;
}

.rtl.retail .tinyselect select {
    transform: translateZ(0px);
    /* padding-left: 0 !important; */
    /* padding-right: 47% !important; */
}

.tinyselect.fx select {
    background: #fff;
    color: #333
}

.tinyselect.fx::before {
    color: #333
}

.retail .tinyselect::before {
    color: #fff;
    display: none
}

.retail .formPart .price {
    text-align: right;
    top: 3px
}

.retail .categoryPid .titleAndLegend {
    display: block;
    margin-top: 0;
    z-index: 2;
    width: calc(100% - 222px);
    padding-bottom: 0;
    margin-bottom: 12px
}

.rtl.retail .categoryPid .titleAndLegend {
    direction: rtl;
    float: right
}

.retail .customizedID .addToFav .txt {
    line-height: 50px
}

.retail .customizedID .onRight {
    display: none
}

.retail .meta .discountpercent {
    position: relative;
    left: auto;
    top: auto;
    bottom: auto;
    border-radius: 5px;
    height: 33px;
    line-height: 33px;
    font-weight: bold;
    float: left;
    margin-right: 9px
}

.classicproduct.productpage .meta .discountpercent {
    /* zoom: .8; */
    margin-top: 15px;
}

.rtl.classicproduct.productpage .meta .discountpercent {
    float: right;
    margin-left: 17px;
}

.meta .price {
    float: left;
    /* box-shadow: rgba(36, 36, 36, 0.1) 0 3px 23px; */
    /* background-color: #fff; */
    height: 33px;
    /* border-radius: 5px; */
    font-size: 15px;
    width: auto;
    /* padding-left: 12px; */
    padding-right: 8px;
    line-height: 32px;
    color: var(--primary-color);
    /* font-weight: bold; */
}

.rtl .meta .price {
    float: right;
    margin-right: 24px;
    padding-right: 0px;
    margin-right: 0px;
}

.customizedID .picture .discountpercent {
    display: none
}

.meta .oldprice {
    display: inline-block;
    position: relative;
    float: left;
    font-size: 14px;
    height: 33px;
    line-height: 33px;
    margin-left: -2px;
    height: 33px;
    line-height: 33px;
    margin-top: 15px;
}

.retail .meta .oldprice {
    margin-top: 0px;
}

.rtl .meta .oldprice {
    float: right;
    margin-right: 13px;
}

.retail .myBagModule .itemBags .itemBag .casePic .backg {
    height: 100%
}

.retail .myBagModule .itemBags .itemBag .casePic .backg img {
    top: 0;
    transform: none;
    position: relative
}

.retail .myBagModule .itemBags .itemBag .casePic {
    height: unset
}

.retail .deskmenu li a {
    font-size: 17px
}

.retail .socials .social {
    filter: invert();
    opacity: .7
}

.socials.mobi .social {
    filter: none;
    opacity: 1
}

.retail .filter .zmdi {
    color: var(--primary-color)
}

.retail .itemsList .genBtn.customize {
    display: none
}

.retail .oldprice {
    float: left;
    margin-left: 0px;
}

.retail body.s-active.isSearching {
    overflow: visible !important
}

.retail .homeFilter.ontop {
    width: 335px;
    border-radius: 100px;
    background-color: #f3f3f3;
    margin-top: 10px
}

.rtl.logoontop .homeFilter.ontop {
    left: auto;
    right: 22px;
    width: 246px
}

.retail .homeFilter .filter input::placeholder {
    color: #999
}

.retail .MenuParts .parts .bot {
    background-color: #fff;
    border-bottom: 1px solid #f6f6f6;
    height: 70px
}

.retail .myBagModule .bagTitle .clear-bag {
    display: none
}

.retail .myBagModule .bagTitle {
    margin-top: -6px
}

.userbar.icons {
    position: relative;
    top: auto;
    width: auto;
    transform: none;
    left: auto;
    background: transparent;
    float: right
}

.userbar.icons .userpages {
    float: right;
}

.userbar.icons .menuList.signedIn {
    margin-top: 9px;
    float: left;
}

.retail .nbHolding span {
    color: #fff;
    padding: 0;
    width: 100%;
    font-size: 13px;
    line-height: 19px;
}

.retail .showBag .userbar {
    /* display: none!important; */
}

.retail .userbar.icons {
    display: block;
    border: 0;
    padding-top: 19px;
    width: auto !important;
}

.retail .userbar.icons .md-fav {
    margin-right: 7px;
    color: var(--primary-color);
}

.userbar.icons .md-src {
    margin-right: 7px;
    color: #666;
    display: none
}

.menuontop .userbar.icons .md-src {
    display: block;
    /* right: 47px; */
    color: #000;
    -webkit-text-stroke: 0.9px;
}

.menuontop body:not(.notsignedin) .userbar.icons .md-src {}

.retail .menuList.signin::before {
    content: "\F207";
    font-size: 28px;
    opacity: 1;
    top: 0px;
    font-family: 'Material-Design-Iconic-Font';
}

.retail .nbHolding {
    margin-right: 0;
    content: "";
    width: 25px;
    height: 20px;
    border-radius: 3px 3px 5px 5px;
    z-index: 1;
    position: absolute;
    top: 35px;
    left: 5px;
    font-size: 28px !important
}

.nbHolding.animate::after {
    display: none
}

.retail .showBag .menuList.bag span::after {
    border: 2px solid var(--primary-color)
}

.retail .deskmenu {
    top: 0px;
    margin-bottom: 35px;
    /* position: fixed; */
    overflow: auto;
    height: fit-content;
    /* display: block; */
    width: 285px;
}

.deskmenu::-webkit-scrollbar {
    width: 4px;

}

.deskmenu::-webkit-scrollbar-thumb {
    background-color: rgb(243 243 243);
    border-radius: 10px
}

.deskmenu::-webkit-scrollbar-track {
    background: rgb(255 255 255);
    background-clip: content-box;
    border-radius: 10px
}

.logoontop .deskmenu .logo {
    display: none;
}

.retail .zmdi-star-outline::before {
    content: "\F15E"
}

.retail .zmdi-star::before {
    content: "\F15F"
}

.retail #wrapper {
    padding-top: 71px;
    margin-top: 0;
    box-sizing: border-box;
}

.shopmenu {
    display: none
}

.retail .homeFilter .filter input {
    padding-left: 27px;
    color: #333
}

.rtl.logoontop .homeFilter .filter input {
    padding-left: 0 !important
}

.retail .deskmenu .menu li ul li {
    min-height: 30px;
    line-height: 30px;
}

.retail .deskmenu .menu li ul li a {
    font-size: 14px
}

.retail .deskmenu .menu li:last-child {
    border-bottom: 0
}

.retail .deskmenu .menu li.colle a {
    font-size: 15px;
    color: var(--primary-color)
}

.customizedID .genBtn.retailonly {
    display: none
}

.customizedID .picture .swiper-container {
    position: relative;
    width: 100%;
    /* background-color: #eee; */
}

pre.description.retailonly {
    font-family: inherit;
    white-space: break-spaces
}

.market .noCustomization.largetxt .data .description {
    display: block
}

.noCustomization.largetxt .cont {
    display: block;
}

.largetxt .cont .description {
    font-size: 14px;
    line-height: 24px;
    margin-bottom: 22px;
    white-space: normal;
    display: block !important;
    color: #444;
}

.fnb .cont .data {
    display: none;
}

.market .largetxt .cont .description.retailonly {
    display: none !important
}

@keyframes blink {
    0% {
        color: rgba(173, 173, 173, 0)
    }

    50% {
        color: #adadad
    }

    100% {
        color: rgba(173, 173, 173, 0)
    }
}

.inputWrap.floor {
    width: calc(50% - 3px);
    display: inline-block;
    vertical-align: top
}

.inputWrap.appt {
    width: calc(50% - 2px);
    display: inline-block
}

.ship.name input {
    width: 100%;
    appearance: none;
    border: 0;
    height: 43px;
    line-height: 43px;
    background-color: #faf8f8;
    padding-left: 98px;
    border-radius: 5px;
    color: #333;
    box-sizing: border-box
}

.rtl .ship.name input {
    padding-right: 117px;
    padding-left: 0
}

.ship.name::before {
    content: attr(data-text);
    position: absolute;
    left: 16px;
    font-size: 14px;
    color: #999;
    top: 0;
    height: 43px;
    line-height: 43px;
    border-right: 2px solid #fff;
    padding-right: 12px
}

.rtl .ship.name::before {
    left: auto;
    right: 0;
    border-left: 2px solid #fff;
    border-right: 0;
    padding-left: 32px
}

.ship.name {
    position: relative;
    margin-bottom: 25px;
    display: none
}

.retail .ship.name {
    display: block
}

@keyframes shine {
    0% {
        transform: translateX(-100%)
    }

    100% {
        transform: translateX(100%)
    }
}

.loadinga::after {
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0) 99%, rgba(255, 255, 255, 0) 100%);
    content: "";
    top: 0;
    transform: translateX(100%);
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
    animation: 1s ease 0s infinite normal none running shine
}

.retail .pickordel .input {
    border: 1px dotted #ccc;
    height: 51px;
    display: block;
    padding-left: 24px;
    line-height: 60px;
    padding-top: 34px;
    font-weight: bold;
    cursor: pointer;
    width: calc(50% - 45px) !important
}

.retail .pickordel .input.checked {
    border-width: 2px;
    border-style: solid;
    border-image: initial;
    border-color: var(--primary-color)
}

.retail .pickordel .input .label {
    font-weight: bold;
    text-transform: capitalize;
    font-size: 16px
}

.retail .pickordel .input.checked .label {
    color: var(--primary-color)
}

.retail .pickordel .input .check {
    left: 16px;
    top: 33px
}

.retail .pickordel {
    height: 128px;
    display: block
}

.retail .delivery-date {
    display: none
}

.retail .box_date.schedule-order {
    display: none
}

@media(max-width: 768px) {
    body {
        visibility: visible
    }

.rtl .mobileMenuWrap .applinks {
    display: block;
    margin-left: auto;
    margin-right: 18px;
}

    .case .pheadline {
        width: 100% !important;
        height: auto;
    }

    .retail .orderstt {}

    .retail .tabled {
        width: 100% !Important;
    }

    .orderdash {
        padding-top: 4px;
        zoom: 0.9;
        padding-bottom: 18px;
    }

    .trackingLayout .orderdash {
        height: 0px;
        transition: all 0.3s;
        zoom: 0.9;
    }

    .trackingLayout .orderdash:has(.cancel),
    .trackingLayout .orderdash:has(.zmdi-edit),
    .trackingLayout .orderdash:has(.reorder) {
        height: 104px !important;
    }

    .trackingLayout .closeit {
        display: none;
    }

    .subTotalBox {
        padding-left: 10px;
        padding-right: 10px;
    }

    .orderdet {
        /* height: auto; */
    }

    .giftcards .gc-title {
        font-size: 23px !important;
    }

    .orderdetails .elt .zmdi {}

    i.zmdi.zmdi-comment-outline {}

    .itemsList .itemGrid .picture.has-swiper .swiper-button-prev,
    .itemsList .itemGrid .picture.has-swiper .swiper-button-next {
        display: none !important;
    }

    .addRemoveWrap.onright {
        display: none;
    }

    .market .customizedID .data .sku {
        margin: auto;
    }

    .moreResults {
        margin-bottom: 14px !important;
        padding-bottom: 14px !important;
    }

    .market .customizedID.largetxt .data .description {
        border-top: 1px solid #eee;
        font-size: 13.5px;
    }

    .market.productpage .customizedID .data .sku {
        margin: auto;
    }

    .col-description {
        padding-left: 13px !important;
    }

    .market .oldprice {
        /* margin-top: -36px; */
        margin-left: -4px;
    }

    .box_date.pickordel .order-method {
        padding-left: 0px !important;
    }

    .loginRegisterID .error {
        position: relative;
    }

    .newAddress.nonead.add {
        background-color: #fff;
    }

    #customizedModalID .swiper-button-prev,
    #customizedModalID .swiper-button-next {
        bottom: 30px;
        top: auto !important;
        display: none;
    }

    .retail .itemsList .itemGrid .priceWrap {
        margin-top: -14px;
        padding-left: 14px;
        /* position: absolute; */
        /* bottom: 0px; */
        /* left: 0px; */
    }

    .retail .itemsList .itemGrid .priceWrap .wrap {
        /* padding-left: 5px; */
    }

    .retail .d-w {
        padding-left: 14px !important;
    }

    .retail.has-retail-quick-add .itemsList .itemGrid .genBtn.quickadd {
        /* display: none!Important; */
    }

    .branchesCtrl {
        background-color: #f6f6f6;
    }

    .homePid {
        background-color: #f6f6f6;
    }

    .scannerenabled.homePid {
        background: transparent;
    }

    body.categoryPid {
        background-color: #f6f6f6;
    }

    .clear-bag {
        padding-bottom: 7px;
        padding-top: 13px;
        width: fit-content;
        margin: auto;
    }

    .reviewBox .myBagModule .itemBags .itemBag {
        max-width: calc(100% - 20px);
        margin-left: auto;
        margin-right: auto;
        box-shadow: 0 0 16px rgba(204, 204, 204, 0.24);
    }

    .recommendedItems {
        padding-left: 0px;
        margin-top: 0;
    }

    .maerket .myBagModule .itemBags .addRemoveWrap .addRemove {
        width: 75px;
        float: left;
        margin-top: 6px;
        margin-left: 13px;
    }

    .fnb .pwrap .discountpercent {
        bottom: 68px;
    }

    .sumhead div {
        font-size: 13px;
    }

    .itemGrid .product-labels-container .product-labels {
        margin-top: -1px !important;
        border-radius: 5px;
        font-size: 11px !important;
        line-height: 16px !important;
    }

    .home-collection.layout8,
    .home-collection.layout7,
    .home-collection.layout6,
    .home-collection.layout9 {
        width: calc(33vw + 1px);
        margin: 0px !important;
        /* margin-bottom: 62px!important; */
    }

    .selectedpayment.ng-scope {}

    span.ptnl.ng-scope {
        margin-top: 8px;
    }

    .instagram_profile {
        width: 100%
    }

    .instagram_profile {
        padding-left: 23px
    }

    p.instagram_username a {
        font-size: 20px
    }

    div#instagramfeed {
        width: 100%;
        padding: 16px;
        box-sizing: border-box;
        overflow-x: hidden;
    }

    .pickordel .radio {
        padding-right: 17px;
        margin-left: -2px !important
    }

    .reviewbagbut {
        display: none !important
    }

    .productpage .relationsinline {
        min-height: 0 !important
    }

    .price.nearadd {
        margin-bottom: 27px;
        width: 100% !important;
        border-color: #ddd !important;
    }

    .home-collection.layout4 {
        padding: 0;
        width: calc(50%);
    }

    .home-collection.layout4:nth-of-type(2) {
        padding-right: 0
    }

    .layout3 .collimg {
        margin-bottom: 0
    }

    .retail body.s-active {
        overflow: hidden !important
    }

    .rtl.market .customizedID.largetxt .data .pwrap {
        text-align: center !important
    }

    .notloggedin .sumhead {
        margin-bottom: 9px;
        /* padding-left: 19px; */
    }

    .enablesorting .categoryPid .ngviewstyle.subempty .content {
        padding-top: 56px
    }

    #ui-datepicker-div {
        box-shadow: rgba(0, 0, 0, 0.49) 0 1px 0 1000px;
        width: 100vw;
        box-sizing: border-box;
        border-radius: 0;
        z-index: 300 !important;
        position: fixed !important;
        bottom: 0 !important;
        top: auto !important;
        left: -19px !important;
    }

    .retail .categoryPid .sorter {
        /* margin-top: -60px; */
    }

    #loyaltyDetailsModalID.loyalty-details .loyalty-w,
    #loyaltyMoreDetailsModalID.loyalty-details .loyalty-w {
        border-radius: 0;
        margin-bottom: 0 !important;
        min-height: calc(100vh - 80px) !important;
    }

    .tinyselect {
        margin-right: 0
    }

    .fnb .largetxt .cont .description {
        display: none !important;
    }

    .tabled {
        display: block;
        height: auto
    }

    .retail .customizedID .wrap form {
        margin-top: 0
    }

    .rtl.retail .customizedID .wrap form {
        margin-top: 48px
    }

    .show-footer-menu main {
        padding-bottom: 64px !important
    }

    .offerclose {
        left: 12px !important
    }

    .market.cols3mob .itemsList .itemGrid .nb {
        /* transform: translateX(-10px); */
        text-align: center;
        width: 60px
    }

    .market.cols3mob .addRemoveWrap.black .minus {
        transform: translateX(67px);
    }

    .market.cols3mob .active .addRemoveWrap.black .minus {
        transform: translateX(0px);
    }

    .market.cols3mob .addRemoveWrap {
        transform: translateX(-50%);
        left: calc(50% + 3px);
        position: relative;
        z-index: 2;
    }

    .myBagModule .itemBags .addRemoveWrap {
        /* transform: none; */
        /* left: 16px; */
        /* position: absolute; */
    }

    .market.cols3mob .addRemoveWrap.black .plus {
        transform: translateX(-22%);
    }

    .market.cols3mob .active .addRemoveWrap.black .plus {
        transform: scale(1) translateX(0px);
        transition: all .2s linear 0s;
        background-color: #ccc
    }

    .rtl .myAccountPid .addAddress .newAddress .text {
        padding-right: 11px
    }

    .market .largetxt .cont .description {
        /* display: none!important */
    }

    .market .modal.noCustomization.largetxt .cont {
        display: none;
    }

    .payment-container {
        height: calc(100vh - 80px)
    }

    .market .myBagModule .itemBags .price {
        padding-left: 13px;
    }

    .retail .column_cust.hide-product-options .tinyselect {
        margin-left: 0;
        margin-right: 0 !important
    }

    .price.nearadd .tinyselect {
        width: calc(100% - 23px) !important
    }

    .pinching .tinyselect {
        opacity: 0
    }

    .classicproduct.retail .formPart .lines .line:last-child {
        margin-top: 0
    }

    .retail .myBagModule .itemBags .customPart .drp-quantity-container {
        margin-left: 31px;
        top: 51px
    }

    .column_cust.hide-product-options .price .tinyselect.no-price {
        top: 0px;
    }

    .retail .deskmenu li a {
        font-size: 18px;
        display: block
    }

    #offerId .cont {
        min-height: calc(100vh - 80px);
        box-sizing: border-box;
        margin-bottom: 0 !important;
        border-radius: 0 !important
    }

    .retail .myBagModule .itemBags .customPart .drp-quantity-container {
        left: 12px !important;
        bottom: -48px !important;
        display: inline-block;
    }

    .ot-container .ot-prgress-status-ctn {
        /* height: 266px; */
    }

    .textTerms {
        padding: 32px;
        overflow-y: auto;
        box-shadow: none;
        height: calc(100vh - 80px) !important;
        border-radius: 0 !important
    }

    .termsID {
        min-width: unset;
        width: 100vw
    }

    .classicproduct.retail .formPart .lines {
        background-color: transparent
    }

    .createAccountID .parts {
        border-radius: 0
    }

    .createAccountID .head {
        padding-top: 35px;
        padding-left: 7px;
        padding-right: 7px;
    }

    .createAccountID .normalForm {
        width: 88%;
        margin: 35px auto auto
    }

    .modal.closeNew {
        padding-top: 80px
    }

    .modal.show {
        transform: translate3d(-50%, 0px, 0px);
        top: 0
    }

body:has(.iti--fullscreen-popup) .loginRegisterID .btnClose {
    display: none;
}

    #sizeGuideModalID {
        max-width: 100vw !Important;
    }

    .modal.show.smallType2 {
        transform: translate3d(-50%, -50%, 0px);
        top: 50%
    }

    .modal.show.smallType1 {
        transform: translate3d(-50%, -50%, 0px);
        top: 50%
    }

    .modal.closeNew .btnClose {
        top: 20px !important;
    }

    .android.cordova .modal.closeNew .btnClose {
        top: 15px !important
    }

    .retail .myBagModule .itemBags .customPart .line {
        margin-bottom: 6px
    }

    .retail .myBagModule .itemBags .customPart .line:nth-child(2) {
        margin-top: -9px
    }

    .retail .myBagModule .itemBags .customPart {
        width: calc(100% - 108px)
    }

    .retail .related-items .heart {
        display: none
    }

    .layerPop {
        width: 100vw
    }

    .layerPop .popup {
        display: inline-block;
        height: auto
    }

    .customDropDown.open .drop_options {
        height: 222px;
        bottom: -44px;
    }

    .offerslist {
        margin-top: 3px;
        height: 108px !important;
    }

    .checkoutID .offerslist {
        height: 114px !important
    }

    .deskmenu .link.collections {
        margin-bottom: 100px
    }

    .column_cust.hide-product-options .line {
        width: 100% !important
    }

    .related-items {
        width: calc(100% + 20px);
        margin-bottom: 22px
    }

    .relationsinline .related-items {
        margin-bottom: -7px
    }

    .related-items .title {
        text-align: left;
        border-bottom: 0 !important;
        margin-bottom: 9px !important;
        text-align: left;
    }

    .retail .customizedID .picture .pinch-zoom {
        border: 0;
    }

    .customizedID .wrap form {
        position: relative;
        margin-top: 12px;
        width: calc(100%) !important
    }

    .market .customizedID .wrap form {
        width: calc(100%) !important
    }

    .related-items[data-group~="Colors"] .itemGrid,
    .related-items[data-group~="Color"] .itemGrid,
    .related-items[data-group~="colors"] .itemGrid,
    .related-items[data-group~="color"] .itemGrid {
        width: calc(51vw - 2px) !important
    }

    .relationsinline .related-items .itemsList .itemGrid.selected-product {
        height: 22px;
        box-sizing: border-box;
        margin-top: -3px
    }

    .relations {
        width: 100vw !important;
        display: block !important
    }

    .retail .wrapCustom {
        margin-top: 33px;
        box-sizing: border-box
    }

    .retail .customizedID .cont {
        height: auto;
        padding-top: 13px !important;
        width: 100vw !important;
        min-height: unset !important;
        padding-left: 0px;
    }

    .retail .customizedID .picture {
        height: auto;
        background-color: #eee;
    }

    .retail .related-items .itemsList .itemGrid .picture {
        background-color: transparent
    }

    html.retail div#customizedModalID {
        padding-bottom: 50px !important
    }

    .meta .title,
    .meta .brand {
        text-align: center;
        width: 100%
    }

    .retail .meta .title,
    .retail .meta .brand {
        text-align: left
    }

    .retail .meta .brand {
        font-size: 12px;
        margin-bottom: 0;
        font-weight: bold;
        color: #333
    }

    .retail .meta .title {
        font-size: 25px !Important;
        width: calc(100% - 46px);
        margin-bottom: 5px;
        font-weight: 400;
        margin-top: -3px;
        line-height: 28px !important;
    }

    .rtl.retail .meta .title {
        padding-right: 0px;
        font-weight: bold;
        color: #999;
        margin-top: -4px;
        float: right;
    }

    .retail .userbar.icons {
        position: absolute;
        width: 30px !important;
        background: transparent !important;
        top: -6px !important;
        right: 40px !important
    }

    .retail .userbar.icons.has-waitinglist {
        width: 85px !important;
    }

    .retail .userpages .md-fav::before {
        color: var(--primary-color)
    }

    .menuontop .userpages .md-src::before {
        color: var(--primary-color)
    }

    .retail .userpages .md-wl::before {
        color: var(--primary-color);
        font-size: 27px !important;
    }

    .menuontop .userpages li {
        margin-left: 3px;
    }

    .customizedID .picture .swiper-container {
        overflow: visible !important
    }

    .retail #wrapper {
        padding-top: 66px;
        margin-top: 0;
        box-sizing: border-box;
    }

    .aoffer:only-child {
        width: calc(100% - 14px);
        margin-left: 7px !important
    }

    .termsID {
        height: auto
    }

    .subcats ul.link.collections {
        display: none
    }

    .retail .customizedID .picture .swiper-container {
        border: 0;
        overflow: visible !important
    }

    .customizedID .swiper-zoom-container {
        overflow: visible !important
    }

    .customizedID .picture .swiper-container {
        width: 100vw
    }

    .customizedID .backg {
        transition: transform .3s linear 0s
    }

    .retail .pickordel .input {
        box-sizing: border-box;
        width: calc(50% - 2px) !important;
        height: 73px !important;
        padding-top: 24px !important
    }

    .retail .oldprice {
        /* position: absolute; */
        /* z-index: 1; */
        color: #666;
        /* line-height: 35px; */
        /* opacity: .5; */
        /* left: 18px; */
    }

    .meta .oldprice {
        /* top: -112px; */
        /* right: 3px; */
        /* z-index: 2; */
        /* left: auto !important; */
    }

    .meta .price {
        /* position: absolute; */
        /* top: -75px; */
        /* left: 20px; */
    }

    .retail .meta .price {
        /* padding-left: 9px !important; */
    }

    .retail .meta .discountpercent {
        position: absolute;
        top: -76px;
        z-index: 3;
        right: 21px
    }

    .retail .wrapCustom .description {
        text-align: left;
        margin-top: -4px;
        margin-bottom: 42px;
        padding-top: 7px !important
    }

    .rtl.retail .wrapCustom .description {
        direction: rtl;
        text-align: right;
        width: 100%;
    }

    .retail .wrap-c {
        position: relative;
        display: inline-block;
        width: 100vw !important
    }

    .retail #customizedModalID .addToFav {
        margin-left: 0;
        margin-top: 0;
        top: 10px !important;
        right: 13px !important;
        box-shadow: none !important;
    }

    .rtl.retail #customizedModalID .addToFav {
        left: 16px !important;
        top: 0 !important
    }

    .retail .homePid .flmenubtn.retailonly {
        transform: translate(0px)
    }

    .retail .homePid .flmenubtn.retailonly .activecat {
        transform: translateY(100px)
    }

    .retail .flmenubtn.retailonly .filter {
        background-color: var(--primary-color);
        transition: all .6s ease 0s
    }

    .retail .homePid.s-active .flmenubtn.retailonly .filter {
        background-color: #fff
    }

    .retail .homePid.s-active .flmenubtn.retailonly .zmdi {
        color: var(--primary-color)
    }

    .retail .flmenubtn.retailonly .zmdi {
        color: #fff
    }

    .retail .s-active .flmenubtn.retailonly .zmdi {
        color: var(--primary-color)
    }

    .meta.retailonly {
        position: relative;
        padding-left: 25px;
        padding-right: 17px;
        padding-bottom: 16px;
        z-index: 1;
        transform: translate3d(0px, 0px, 1px);
        transition: all .2s linear 0s
    }

    .pinching .meta.retailonly {
        opacity: 0;
        transform: scale(2)
    }

    .retail .customizedID .genBtn.retailonly {
        display: none
    }

    .retail .customizedID {
        min-width: unset
    }

    .retail .customizedID .head {
        height: auto !important
    }

    .retail.large-menu-img .itemsList .itemGrid .descBlock .title {
        font-family: textfont;
        display: contents;
        padding-bottom: 0 !important
    }

    .retail.large-menu-img .homePid .itemsList .itemGrid .descBlock .title {
        font-size: 13px
    }

    .userbar.icons.retailonly .menuList {
        display: none !important
    }

    .retail .homeFilter.ontop {
        background-color: #fff;
        height: 46px;
        display: none !important
    }
}

.retail .menuMob .zmdi {
    color: var(--primary-color)
}

.retail .homePid .categories ul>li a.picture {
    border-radius: 100%;
    height: 98px;
    border: 1px solid #eee;
    box-shadow: rgba(0, 0, 0, 0.12) 1px 5px 8px
}

.retail .homePid .categories ul>li {
    box-shadow: none;
    background-color: transparent;
    margin-left: 8px;
    margin-right: 8px;
    width: 98px !important;
    padding: 6px;
}

.retail .homePid .categories ul>li img {
    width: 200%;
    margin-top: 12px
}

.retail .categories {
    min-height: 100px
}

.retail .itemBag .hide-product-options .drp-quantity-container::before {
    margin-left: -31px !important;
}

.retail .myBagModule .itemBags .customPart .drp-quantity-container select {
    cursor: pointer;
    border: 0 solid #fff;
    font-size: 15px;
    appearance: none;
    font-family: inherit;
    padding-top: 0;
    background: #fff;
    color: #333;
    pointer-events: none
}

.retail .myBagModule .itemBags .customPart .drp-quantity-container {
    cursor: pointer
}

.rtl.retail .myBagModule .itemBags .customPart .drp-quantity-container {
    /* text-align: right; */
    padding-right: 19px;
}

.retail .myBagModule .itemBags .customPart .drp-quantity-container::before {
    content: "x";
    color: #333;
    font-size: 13px;
    font-weight: 400;
    margin-left: 11px;
}

#offerId .offer .picture img {
    width: 100%;
    margin-bottom: -6px
}

#offerId .offer .picture {
    box-shadow: rgba(0, 0, 0, 0.1) 0 16px 15px;
    border-radius: 9px;
    overflow: hidden;
    position: relative;
    max-width: 375px;
    margin: auto
}

#offerId .cont {
    margin-bottom: 80px;
    background-color: #fff;
    padding: 25px 25px 35px;
    border-radius: 7px
}

.rtl #offerId .cont * {
    direction: rtl;
    text-align: right!important;
}

#offerId .offer {
    text-align: center
}

#offerId .offer .title {
    padding: 19px;
    font-size: 19px;
    font-family: textfont;
    font-weight: bold
}

#offerId .offer .desc {
    margin-top: 38px;
    margin-bottom: 27px;
    font-size: 16px;
    color: #333;
    line-height: 24px;
    padding: 3px;
    overflow: hidden
}

#offerId .offer .genBtn {
    margin: auto;
    min-width: 150px;
    height: 50px;
    font-size: 23px;
    font-family: titlefont;
    white-space: nowrap;
    padding-left: 22px;
    padding-right: 22px;
    box-sizing: content-box
}

.rtl #offerId .offer .genBtn {
    margin-right: 0;
}

#offerId .offer .genBtn.disabled {

    opacity: 0.25;

    pointer-events: none;
}

.auto-apply .offer .genBtn {
    display: none
}

#offerId .offer .genBtn.loading {
    opacity: .3;
    animation: .9s ease-in-out 0s infinite normal none running fadeOut
}

#offerId .offer .genBtn.claimed {
    opacity: .2
}

#offerId .offer .terms {
    margin-top: 12px;
    margin-bottom: 32px;
    font-size: 13px;
    color: #666;
    line-height: 24px;
    overflow: hidden
}

#offerId .offer .termstitle {
    margin-top: 32px;
    overflow: hidden;
    display: none
}

#offerId .offer .howitworks {
    border-bottom: 1px solid;
    display: inline-block;
    width: auto;
    color: var(--primary-color);
    cursor: pointer;
    overflow: hidden
}

.offers-wrap .offer {
    width: calc(50% - 11px);
    display: inline-block;
    margin-bottom: 22px;
    box-shadow: rgba(0, 0, 0, 0.04) 0 7px 10px, rgba(0, 0, 0, 0.04) 0 0 6px;
    margin-left: 3px;
    margin-right: 6px;
    position: relative;
    /* border: 1px dashed #ccc; */
    border-radius: 6px;
    cursor: pointer;
    vertical-align: bottom;
    overflow: hidden;
}

.offers-wrap .offer.in-store-coupon-item {
    display: none
}

.offers-wrap .offer:hover {
    opacity: .9
}

.offers-wrap .offer .claimed {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    background-color: rgba(255, 255, 255, 0.2);
    z-index: 1;
    top: 0;
    display: flex;
    align-items: center;
    pointer-events: none;
    margin-top: 9px;
}

.offers-wrap .offer .claimed span {
    background-color: var(--secondary-color);
    padding: 6px 10px;
    border-radius: 7px;
    color: #fff;
    font-weight: bold;
    opacity: .8;
    top: 11px;
    position: absolute;
    right: 12px;
    zoom: 0.8;
}

.offers-wrap .offer .claimed span::before {
    content: "\F26B";
    font: 14px / 1 Material-Design-Iconic-Font;
    margin-right: 9px
}

.rtl body.offers .offers-wrap .offer .claimed span::before {
    margin-right: -2px;
    margin-left: 9px;
}

.offers-wrap .offer .picture {
    width: 100%;
    min-height: 79px;
    background: #f2f2f2;
    font-size: 0px;
}

.offers-wrap .offer .title {
    padding: 10px;
    color: #333;
    font-weight: bold;
    min-height: 43px;
    margin-top: -11px;
    /* border-top: 1px dashed #ddd; */
    text-align: center;
    align-items: center;
    display: flex;
    place-content: center;
    font-size: 15px;
}

body.offers .offers-wrap .offer .rules {
    width: calc(100% - 79px);
    box-sizing: border-box;
    color: #888888;
    font-size: 14px;
    line-height: 19px;
    text-align: left;
}

body.offers .offers-wrap .offer:not(.offer-is-active):not(.offer-is-claimed):not(.offer-is-processing)::after {
    content: attr(data-button);
    position: relative;
    top: auto;
    right: auto;
    background-color: var(--main-color);
    color: #fff;
    text-transform: uppercase;
    font-family: "titlefont";
    font-size: 15px;
    padding: 2px 9px;
    border-radius: 7px;
    margin-top: 0px;
    min-width: 75px;
    margin-top: 10px;
}
.offers-wrap .offer .picture img {
    width: 100%;
    text-align: left;
}

.offers-wrap {
    padding: 5px;
    margin: 14px auto auto;
    text-align: center
}

.aoffer {
    width: calc(100% - 41px);
    border: 1px dashed #ddd;
    margin: 5px -3px auto 9px;
    overflow: hidden;
    box-sizing: border-box;
    position: relative;
    display: inline-block;
    opacity: 1;
    cursor: pointer
}

.aoffer .inner-aoffer {
    padding: 10px;
    position: relative;
    display: block;
    min-height: 70px;
    background-color: #fff;
    text-align: left
}

.rtl .aoffer .inner-aoffer {
    direction: rtl;
    text-align: right;
}

.aoffer .inner-aoffer .choose-change-product {
    position: relative;
    display: block;
    margin-left: 27px;
    font-size: 13px;
    text-transform: capitalize;
}

.aoffer .inner-aoffer .choose-change-product .choose-product-title,
.aoffer .inner-aoffer .choose-change-product .change-product-title {
    border-bottom: 1px dotted #444;
    cursor: pointer;
    position: relative;
    display: inline-block;
    padding-bottom: 3px;
    font-size: 10px;
    text-transform: uppercase;
}

.homePid .aoffer .inner-aoffer .choose-change-product {
    color: #acacac;
    margin-left: 100px;
}

.homePid .aoffer .inner-aoffer.no-image .choose-change-product {
    margin-left: 0px;
    position: absolute;
    top: 8px;
    right: 40px;
}


.checkoutID .auto-apply .inner-aoffer,
.checkoutID .auto-apply .aoffer {
    min-height: 0;
    background: #fff
}
.checkoutID .auto-apply .aoffer:has(.minimumOrderChargeAlert),.checkoutID .auto-apply .aoffer:has(.minimumOrderCouponChargeAlert),.checkoutID .auto-apply .inner-aoffer:has(.minimumOrderChargeAlert),.checkoutID .auto-apply .inner-aoffer:has(.minimumOrderCouponChargeAlert){
    background: #f7eedb;
}
.checkoutID .auto-apply {
    height: auto !important
}

.aoffer.on {
    box-shadow: rgba(0, 0, 0, 0.07) 0 2px 10px, rgba(0, 0, 0, 0.1) 0 0 2px;
    opacity: 1;
    border-color: var(--primary-color)
}

.aoffer:last-child {
    margin-right: 22px
}

.aoffer:last-child:first-child {
    margin-right: 0
}

.homePid .aoffer:first-child {
    margin-left: 10px;
}

.checkoutID .aoffer:only-child {
    width: 100%;
    border-radius: 6px;
    position: relative;
    display: block;
    margin-left: 0 !important
}

.aoffer .zmdi {
    position: absolute;
    top: 4px;
    right: 7px;
    font-size: 27px;
    color: var(--primary-color);
    display: none
}

.auto-apply .aoffer .zmdi {
    display: none !important
}

.auto-apply .aoffer .subject {
    display: none !important
}

.aoffer.on .zmdi {
    display: block
}

.auto-apply.aoffer.on .zmdi {
    display: none
}

.aoffer img {
    height: 68px;
    width: auto;
    border-radius: 5px;
    float: left;
    margin-right: 13px;
    margin-bottom: 9px;
}

.checkoutID .aoffer img {
    height: 48px;
}

.aoffer.on .subject,
.auto-apply .subject {
    color: var(--primary-color);
    font-weight: bold;
    padding-top: 0;
    padding-right: 0;
    padding-bottom: 0;
    margin: 0;
    text-transform: capitalize;
    border: 0 !important;
    padding-left: 0 !important
}

.aoffer img:not([src]) {
    width: 0;
    margin-right: 4px;
    height: 44px
}

.enabled img:not([src]) {
    width: 23px;
    visibility: hidden
}

.checkoutID .aoffer img:not([src]) {
    height: 26px
}

.aoffer .title {
    margin-top: 2px;
    color: #666;
    white-space: normal;
    font-size: 15px;
    font-weight: bold;
}

.rtl .checkoutID .aoffer .inner-aoffer .title {
    padding-right: 15px;
    padding-top: 3px;
    /* line-height: 45px; */
}

.checkoutID .aoffer .inner-aoffer .title {
    /* padding-top: 9%!important; */
    /* transform: translateY(-50%); */
    height: 100%;
    padding-top: 3px;
}

.offerslist {
    width: 100%;
    white-space: nowrap;
    overflow: auto hidden;
    height: 120px;
    position: relative;
    top: auto;
    left: auto
}

.checkoutID .auto-apply .aoffer {
    cursor: default
}

.checkoutID .aoffer.enabled {
    border: 1px solid #71a368
}

.checkoutID .aoffer.enabled::before {
    content: "\F269";
    font-family: Material-Design-Iconic-Font;
    color: #71a368;
    position: absolute;
    z-index: 2;
    font-size: 21px;
    left: 14px;
    top: 11px;
    animation: .6s linear 0s 1 normal forwards running fadeInUp;
    /* -webkit-text-stroke: 1px #fff; */
}

.isSearching .offerslist {
    display: none
}

.aoffer .subject {
    color: var(--primary-color);
    border: 1px dashed var(--primary-color);
    display: inline-block;
    padding-left: 7px;
    padding-right: 9px;
    border-radius: 3px;
    margin-bottom: 2px;
    line-height: 22px;
    text-transform: capitalize;
}

.aoffer .subject.processing{
    opacity:0.8;
    color:#000;
}
.retail .aoffer .subject {
    float: right;
    margin-left: 9px
}

.retail .aoffer.on .subject {
    float: none;
    margin-left: 0
}

.retail .d-w {
    min-height: 30px;
    display: block;
    float: left;
    text-align: left;
    /* margin-left: -10px; */
    padding-bottom: 13px;
}

@media(min-width:769px) {
    .retail .flmenubtn.retailonly {
        display: none !important
    }

    .logoontop .homeFilter.ontop {
        left: 27px;
        transform: translateX(0px);
        background: transparent;
        top: 73px;
    }

    .menuontop .deskmenu li a {
        text-transform: capitalize;
        /* margin-left: 20px; */
        /* margin-right: 20px; */
        font-size: 15px !important
    }

    .menuontop .deskmenu li a span {
        font-size: 14px !important
    }

    .menuontop .deskmenu .menu li ul li {
        margin-top: -8px !important
    }

    .menuontop .deskmenu .menu li ul li:last-child {
        margin-bottom: 6px
    }

    .menuontop .deskmenu .menu li ul li span {
        color: #777 !important
    }

    .menuontop .deskmenu .menu li ul li:first-child {
        margin-top: -17px !important
    }

    .menuontop a.whatsapp-r {
        position: absolute;
        width: max-content;
        background-color: #fff;
        top: 11px;
        right: 123px;
        z-index: 2;
        min-width: 220px;
        text-align: right
    }

    .menuontop .deskmenu .menu li.colle a span {
        text-transform: capitalize
    }

    .logoontop .homeFilter .filter input {
        padding-left: 38px !important
    }

    .menuontop .homeFilter .filter input {
        color: #333;
        font-size: 19px;
        padding-left: 23px !important
    }

    .logoontop .deskmenu {
        margin-top: 80px;
        height: calc(100vh - 295px);
    }

    .menuontop .deskmenu {
        height: 41px;
        z-index: 3;
        background: #fff;
    }

    .menuontop .deskmenu .menu {
        background-color: #fff;
        margin-top: 60px;
        min-width: 900px;
        padding: 51px;
        transform: translateY(100px);
        opacity: 0;
        transition: all .2s linear 0s;
        box-shadow: rgba(0, 0, 0, 0.16) 0 0 14px -1px;
        height: fit-content;
        max-width: 900px;
        z-index: 1;
        pointer-events: none;
    }

    .menuontop .topmenuopen .deskmenu .menu {
        transform: translateY(0px);
        opacity: 1;
        transition: all .3s ease-in-out 0s;
        pointer-events: all;
    }

    .menuontop.slimmenu .deskmenu .menu {
        left: 0px;
        transform: none;
        position: absolute;
    }

    .menuontop .topmenuopen .deskmenu .menu:hover {
        transform: translateY(0px);
        opacity: 1;
        transition: all .3s ease-in-out 0s
    }

    .logoontop .deskmenu .menu::before {
        position: absolute;
        top: -68px;
        width: 100%;
        background-color: red;
        height: 70px;
        left: 50%;
        transform: translateX(-50%)
    }

    .menuontop .deskmenu .link {
        margin: auto auto auto 0;
        display: inline-block;
        text-align: left;
        column-count: 3;
        position: relative;
        width: 100%
    }

    .menuontop .deskmenu .link.collections {
        margin-top: 72px;
        background-color: #f2f2f2
    }

    .menuontop .deskmenu {
        position: fixed;
        width: 100%;
        /* background-color: #fff; */
        text-align: center;
        top: 71px;
        height: 50px;
        border-bottom: 1px solid #ddd;
        transition: all .2s linear 0s;
        z-index: 12;
        margin-top: 0;
        margin-bottom: 0;
        overflow: hidden;
    }

    .menuontop.slimmenu .deskmenu {
        top: 15px;
        z-index: 14;
        border-bottom: 0px;
        width: calc(100vw - 1082px);
        overflow: visible;
    }

    .topmenuopen .deskmenu {
        overflow: visible !important;
    }

    .menuontop .deskmenu .pages li {
        display: inline-block;
        text-transform: capitalize;
        font-weight: normal;
        font-size: 15px;
        height: 100%;
        line-height: 50px;
        margin-top: 0 !important;
        padding-left: 15px;
        padding-right: 15px;
        width: auto;
        height: auto;
    }

    .menuontop .deskmenu .pages li.shopmenu {
        height: 200px;
    }

    .menuontop .shopmenu {
        /* margin-right: -20px; */
    }

    .menuontop .deskmenu .pages li:first-child {
        /* margin-left: 20px; */
        /* margin-right: 20px; */
    }

    .topmenuopen .menuontop .deskmenu {
        pointer-events: none
    }

    .topmenuopen .shopmenu::after {
        height: 100%;
        width: 100% !important
    }

    .menuontop .hot-line {
        border-bottom: 0;
        color: var(--primary-color);
        margin-right: 0;
        display: block;
        margin-top: -11px !important
    }

    .menuontop .bot .hot-line {
        display: none !important
    }

    .menuontop .searchopen .deskmenu {
        top: 126px;
        transition: all .2s linear 0s
    }

    .menuontop.slimmenu .searchopen .deskmenu {
        top: -109px;
    }

    li.shopmenu {
        /* padding-left: 20px; */
        /* padding-right: 20px; */
        position: relative
    }

    li.shopmenu::after {
        position: absolute;
        content: "";
        width: 100%;
        height: 100px;
        left: 0;
        top: 0
    }
}

.market .d-w {
    display: inline-block;
    width: 100%;
    /* min-height: 80px; */
    /* padding-bottom: 15px; */
    padding-top: 7px;
    /* margin-bottom: 21px; */
}

.market .d-w .brand {
    margin-left: -5px;
    font-size: 13px !important;
    color: #555 !important;
    font-weight: normal !important;
    margin-top: 0px !important;
    margin-bottom: 5px;
}

@media(max-width:1550px) {

    .loginor {
        display: none;
    }

    .right.rBox .loginor {
        display:
            block !important;
        margin-top: -43px !important;
        padding-bottom: 26px;
    }

    .reviewBox .rBox,
    .reviewBox .rBox.left {
        width: 100% !important;
        margin-top: 16px !important;
    }

    .reviewBox .rBox,
    .reviewBox .rBox.left {
        margin-top: 0px !important;
    }

    .notloggedin .reviewBox .left.rBox {
        margin-top: 14px !important;
    }

    .orderdetails .reviewBox .rBox.left {
        padding-top: 14px;
        margin-top: -35px !important;
        animation: .3s cubic-bezier(0.42, 0, 0.14, 0.93) .5s 1 normal both running fadeInUp2;
        margin: auto !important;
    }

    .rtl .reviewBox .rBox.left {
        margin-right: -14px
    }

    .retail .formPart .lines {
        column-count: 1
    }
}

.checkoutID .allCoupons .aoffer {
    display: inline-block;
    width: 100%;
    margin: auto !important
}

.column_cust.hide-product-options .bTitle {
    display: none !important
}

.column_cust.hide-product-options .check {
    display: none !important
}

.column_cust.hide-product-options .label {
    display: none !important
}

.column_cust.hide-product-options .line:last-child {
    border-bottom: 0 !important
}

.column_cust.hide-product-options .line {
    width: calc(200%+8px)
}

.column_cust.hide-product-options .price {
    width: 100% !important
}

.column_cust.hide-product-options .price .tinyselect.no-price {
    border-color: #fff;
    background: #fff;
    width: 100% !important;
    right: auto;
}

.column_cust.hide-product-options .price .tinyselect.no-price.lastitem::before {
    background-color: #fff;
    right: auto;
    transform: translateX(-50%);
    color: #333 !important;
    top: 1px !important;
    left: 50% !important
}

.retail .column_cust.hide-product-options .price .tinyselect.no-price.lastitem {
    display: none
}

.retail .column_cust.hide-product-options .price.price-lastitem::after {
    content: attr(data-last-item);
    margin-top: -4px;
    margin-bottom: 4px
}

.column_cust.hide-product-options .price .tinyselect::before {
    color: #333
}

.column_cust.hide-product-options .price .tinyselect::before {
    top: -1px
}

.column_cust.hide-product-options .price .tinyselect.no-price select {
    color: #333;
    background: #fff;
    font-size: 19px;
    font-weight: 400;
    width: 100% !important;
    /* padding-left: 50% !important; */
    text-align: left;
}

.itemBag .hide-product-options .type {
    visibility: hidden
}

.itemBag .hide-product-options .name {
    display: none;
}

.retail .myBagModule .itemBags .icons {
    margin-left: 0px;
}

.product-sold-out:not(.hasWaitingList) .column_cust {
    display: none !important
}

.product-sold-out .sold-out-btn {
    background: transparent !important;
    color: #999 !important;
    border: 1px solid #ccc !important;
    cursor: default !important;
    /* border-radius: 6px!important; */
}

.formPart .line.sold-out {
    pointer-events: none !important
}

.formPart .line.sold-out .price {
    display: none !important
}

.formPart .line .sold-out-item {
    display: none
}

.classicproduct .formPart .line .sold-out-item {
    display: none !important
}

.formPart .line.sold-out .sold-out-item .label {
    color: #999
}

.formPart .line.sold-out .sold-out-item .check .zmdi::before {
    color: #ccc
}

.formPart .line.sold-out .sold-out-item {
    display: block;
    position: relative;
    float: right;
    font-size: 14px;
    margin-top: -16px;
    color: #999
}

.market .formPart .line.sold-out .sold-out-item {
    margin-top: -21px;
    font-size: 12px;
    margin-right: 29px;
}

li.retailonly.hotl {
    position: relative;
    color: var(--primary-color);
    height: auto
}

li.retailonly.hotl label::after {
    display: none
}

li.retailonly.hotl .whatsapp-r {
    margin-left: -38px;
    color: #56a61e;
    margin-top: -18px;
    font-weight: bold;
    display: none
}

.whatsapp li.retailonly.hotl .whatsapp-r {
    display: block
}

li.retailonly.hotl .whatsapp-r::before {
    content: "\F405";
    padding-left: 13px;
    font: 21px / 1 Material-Design-Iconic-Font;
    color: #56a61e;
    margin-right: 7px
}

li.retailonly.hotl::after {
    font: 16px / 1 Material-Design-Iconic-Font;
    content: "\F2BE";
    position: absolute;
    left: -22px;
    top: 8px
}

.rtl li.retailonly.hotl::after {
    left: auto;
    right: -17px
}

.home-collection.layout3 .gITems ul {
    white-space: normal
}

.home-collection.layout3 .gITems ul {
    display: flex !important;
    margin-left: -1px;
    /* justify-content: center; */
    min-width: calc(100% - 14px) !important;
    grid-template-columns: none;
    overflow-x: overlay;
    scroll-snap-type: both mandatory;
    overscroll-behavior-x: contain;
}

.layout3 .itemGrid {
    width: calc(25% - 11px) !important
}

.layout3 .itemGrid {
    min-width: calc(25% - 12px);
    /* margin-left: 15px; */
    width: 100% !important
}

.layout3 .itemGrid {
    margin-left: 0;
    min-width: calc(33% - 5px) !important;
}

.homePid .home-collection.layout3.ng-scope .gITems .itemGrid:last-child {
    margin-right: 0 !important
}

div#wrapperb .contentb {
    display: inline-block;
    width: 100%
}

.contentb {}

.userbar.icons {
    transform: translateY(-150%);
    transition: all .2s cubic-bezier(0, 0, 0.65, 1.32) 0s;
    backdrop-filter: none;
}

.showBag .userbar.icons {
    transition: all .2s cubic-bezier(0, 0, 0.65, 1.32) 0s;
    transform: translateY(0%);
}

.relations {
    background-color: #f6f6f6;
    display: block;
    margin-top: -4px;
    padding: 20px;
    box-sizing: border-box;
    width: 100%;
    transform: translateY(0px);
    transition: all .4s cubic-bezier(0.46, 0.03, 0.52, 0.96) 0s;
    /* min-height: 400px; */
}

.relations.ready {
    transform: translateY(0px);
    transition: all .4s cubic-bezier(0.46, 0.03, 0.52, 0.96) 0s;
    min-height: 400px;
}

.retail .itemsList .itemGrid {
    /* width: calc(25% - 14px); */
    box-shadow: none;
}



.retail .related-items .itemsList .itemGrid {
    /* width: calc(25% - 14px); */
    box-shadow: none;
}

.retail .related-items .itemsList .itemGrid .heart .zmdi {
    bottom: 9px
}

.relationsinline .related-items .itemsList .itemGrid {
    width: 54px !important;
    max-width: 54px;
    min-width: auto !important;
    border-radius: 6px;
    margin-right: 6px;
}

.relationsinline .related-items .itemsList .itemGrid.selected {
    border: 2px solid #000;
}

.relationsinline .related-items .itemsList .itemGrid.selected.showRGB {
    border: none;
}

.relationsinline .related-items .itemsList .itemGrid.selected.showRGB .picture {
    border: 2px solid #000;
}

.related-items .itemsList .itemGrid.selected-product {
    display: none
}

.relationsinline .related-items .itemsList .itemGrid.selected-product {
    border: 3px solid #000;
    display: inline-flex
}

.retail .related-items .heart {
    position: absolute;
    top: 26px;
    z-index: 1
}

.relationsinline .heart {
    display: none
}

.retail .related-items .descBlock {
    padding-top: 0;
    padding-bottom: 0;
    float: none;
}

.retail .related-items .itemsList .itemGrid .picture {
    float: left;
    width: 100%;
    text-align: left;
    position: relative;
    margin: 0;
    height: 100%;
    box-sizing: border-box;
    padding-bottom: 0 !important;
}

.retail .related-items .itemsList .itemGrid .wrap {
    padding: 0
}

.related-items .picture {
    top: 0 !important
}

.retail .related-items .itemsList .itemGrid .priceWrap .wrap {
    /* padding-left: 11px; */
}

.retail .related-items .itemsList .itemGrid .priceWrap .wrap .oldprice {
    padding-left: 6px;
    margin-right: 13px
}

.retail .related-items .itemsList .itemGrid .d-w {
    position: relative;
    padding: 0 10px 10px;
    min-height: 22px;
    margin-top: -2px;
    margin-left: 0px!important;
    padding-left: 0px!important;
}

.retail .related-items .itemsList .itemGrid .priceWrap {
    padding-left: 0px;
}

.related-items .title {
    margin-bottom: 21px;
    padding-bottom: 13px;
    /* text-transform: uppercase; */
    font-size: 18px;
    min-height: unset !important;
    text-align: left!important;
}

.relationsinline .related-items .title {
    font-size: 13px;
    margin-bottom: 1px;
    color: #999;
}

.rtl .related-items .title {
    direction: rtl;
    text-align: right;
    box-sizing: border-box;
    padding-right: 22px !important
}

.related-items[data-group~="Colors"] .d-w,
.related-items[data-group~="Color"] .d-w,
.related-items[data-group~="Colors"] .priceWrap,
.related-items[data-group~="Color"] .priceWrap .related-items[data-group~="colors"] .d-w,
.related-items[data-group~="color"] .d-w,
.related-items[data-group~="colors"] .priceWrap,
.related-items[data-group~="color"] .priceWrap {
    display: none !important
}

.related-items[data-group~="Colors"] .itemGrid,
.related-items[data-group~="Color"] .itemGrid,
.related-items[data-group~="colors"] .itemGrid,
.related-items[data-group~="color"] .itemGrid {
    width: 160px
}

.related-items[data-group~="Colors"] .itemGrid.not-available::before,
.related-items[data-group~="Color"] .itemGrid.not-available::before,
.related-items[data-group~="colors"] .itemGrid.not-available::before,
.related-items[data-group~="color"] .itemGrid.not-available::before {
    box-shadow: none;
    width: 100%;
    height: 25px;
    border-radius: 0;
    bottom: 0;
    transform: none;
    left: 0;
    opacity: .6;
    font-size: 11px;
    text-transform: uppercase;
    line-height: 10px;
    font-weight: bold;
    top: auto;
    padding-top: 7px;
    background-color: #000;
    color: #fff;
    content: "out of stock" !important
}

.retail #customizedModalID .addToFav {
    /* background-color: transparent; */
    position: absolute;
    /* top: 0; */
    border: 0;
    right: 48px;
    /* transform: scale(1.2); */
    z-index: 2;
    transition: all .5s ease 0s;
    width: 30px !important;
    top: 9px;
    /* box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px; */
    border-radius: 50%;
    height: 30px;
    /* left: 19px; */
}

.rtl.retail #customizedModalID .addToFav {
    left: -11px
}

.retail #customizedModalID .addToFav .txt {
    display: none
}

@media(max-width:1399px) {
    body {
        visibility: visible
    }

.rtl .applinks {
    /* float: none; */
    /* margin-top: 42px; */
    /* width: 100%; */
}

    body.receiptPid {
        background: #f3f3f3;
    }

    .orders.normal .order {
        width: calc(50% - 23px);
        animation: .3s cubic-bezier(0.42, 0, 0.14, 0.93) 0.5s 1 normal both running fadeInUp2;
    }

    .retail .itemsList .itemGrid {
        /* width: calc(33% - 11px); */
        /* max-width: 300px; */
    }



    .sumhead {
        text-align: center
    }

    .retail .newsCtrl .itemsList .itemGrid {
        width: calc(50% - 15px)
    }
}

@media(max-width:1550px) {
    .retail div#customizedModalID.show {
        /* transform: translate3d(-50%, 0px, 0px); */
        /* top: 0; */
    }

    .delivery-date {
        padding-top: 9px
    }
}


.is-offer .customized {
    left: auto;
    right: 77px
}

.is-discounted .customized {
    left: 80px
}

.modal.disable-close .btnClose {
    display: none
}

.itemsList .itemGrid.not-available::before {
    content: attr(data-title) !important
}

.fullThankyou .transaction-number-note {
    display: none;
    color: #555;
    font-size: 14px;
    text-align: center
}

.fullThankyou .transaction-receipt-note {
    display: none;
    margin-top: 24px;
    color: #676767;
    font-size: 16px;
    text-align: center;
    max-width: 617px;
    margin-left: auto;
    margin-right: auto;
    font-weight: normal;
    line-height: 26px;
    padding: 22px
}

.wrap-c {
    display: flex;
}

.fnb .wrap-c {}

.market .wrap-c {
    background-color: #fafafa
}

.subTotalBox {
    padding-bottom: 0;
    margin-bottom: 0;
    padding-top: 0px !important;
    /* padding-left: 10px; */
    /* padding-right: 10px; */
}

.subTotalBox .totalPrice {
    position: relative
}

.loggedin .totalPrice[data-text="Total"] {
    padding-bottom: 36px;
}

.totalPrice.has-seccond-currency {
    padding-bottom: 0 !important;
    margin-bottom: 0px!important;
}

.rtl .subTotalBox .totalPrice {
    direction: rtl;
    text-align: left;
}

.subTotalBox .totalPrice.secondcurr {
    padding-top: 10px
}

.subTotalBox .totalPrice.has-seccond-currency::after {
    display: none
}

.transaction-number-note[content="receipt.transactionnumbernote"] {
    display: none !important
}

.transaction-receipt-note[content="receipt.transactionreceiptnote"] {
    display: none !important
}

.sm-pages .text {
    color: #666 !important;
    font-size: 14px !important;
    font-family: textfont !important;
    font-weight: normal !important;
}

.sm-pages:nth-child(1) {
    border-top: 0 solid #ddd !important
}

.sm-pages {
    margin-top: 19px;
    padding-top: 12px;
    margin-bottom: 46px;
    order: 99;
}

.sm-pages:not(:has(*)) {
    display: none;
}

html.disable-ui {
    overflow: hidden
}

html.disable-ui::before {
    content: " ";
    position: absolute;
    width: 100%;
    height: 100vh;
    z-index: 1000000;
    background-color: rgba(0, 0, 0, 0.32)
}

html.disable-ui::after {
    content: "";
    position: absolute;
    width: 32px;
    height: 32px;
    border-width: 3px;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.58) rgba(224, 224, 224, 0.69) rgba(0, 0, 0, 0.58) rgba(0, 0, 0, 0.58);
    border-image: initial;
    border-radius: 100%;
    animation-name: rotate;
    animation-duration: .4s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    transition: all .2s linear 0s;
    margin-left: -15px;
    left: 50%;
    top: 50%;
    margin-top: -15px
}

.tinyselect .fieldMinus {
    position: absolute;
    width: 50px;
    height: 40px;
    left: -6px;
    top: -10px;
    line-height: 40px;
    text-align: center;
    font-size: 35px;
    z-index: 2;
    background-color: #fff;
    transform: translate3d(0px, 0px, 1px);
    cursor: pointer
}

.tinyselect .fieldPlus {
    position: absolute;
    width: 50px;
    height: 40px;
    right: -8px;
    top: -10px;
    line-height: 40px;
    text-align: center;
    font-size: 25px;
    z-index: 2;
    background-color: #fff;
    transform: translate3d(0px, 0px, 1px);
    cursor: pointer
}

.retail:not(.classicproduct) .tinyselect .fieldPlus {
    .retail: not(.classicproduct) .tinyselect;
}

.retail:not(.classicproduct) .tinyselect {
    width: 111px;
    border: 0px;
    margin-top: -7px;
    right: -11px;
}

.retail:not(.classicproduct) .tinyselect select {
    padding-left: 0px !Important;
    width: 100%!important;
    border: 0px;
}

.tinyselect .fieldPlus:hover,
.tinyselect .fieldMinus:hover {
    color: var(--primary-color)
}

.noOrder .customizedID .cont {
    display: none
}

.noOrder .customizedID .genBtn {
    display: none
}

.noOrder .userbar{
    display: none
}
.noOrder .userbar,
.noOrder.fnb .itemsList .itemGrid .heart,
.noOrder .customizedID .onRight{
    display: none
}

.noOrder #wrapper{
	padding-top: 90px;
}
.noOrder customizedModalID,
.noOrder.fnb .modal.noCustomization{
    max-width: 600px !important;
}
.noOrder .customizedID .data .price{
	margin-bottom: 20px;
}
@media (min-width: 769px) {
.noOrder .share-product.onimg{
	top: 76px !important;
	right: 8px !important;!i;!;
}
}

.gm-style div:first-child div:first-child div:last-child {
    z-index: 11 !important
}

@media(max-width:768px) {
    .editAddAddress .parts {
        padding-top: 30px !important;
        margin-top: 106px;
    }

    .customizedID .cont .data {
        display: none !Important;
        padding-top: 50px;
    }
}

.editAddAddress .googleMap img {
    width: 100%;
    height: auto;
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
}

@media(max-width: 1023px) and (min-width: 768px) {
    body {
        visibility: visible;
        /* zoom: 0.8; */
        -webkit-text-size-adjust: none;
    }

.sub-categories-container-wrapper {
    display:none;
}

.market .categoryPid .content .sorter {
    bottom: auto! Important;
    top: 9px;
}

    .giftcards .gc-top-part .gc-title,
    .giftcards .gc-bottom-part .gc-title {
        font-size: 27px;
    }

    .giftcards .gc-top-part .gc-list-wrapper .gc-list-item {
        min-width: 190px;
    }

    .reachPID {
        width: calc(100% - 317px);
    }

    .fnb .swiper-slide.pinch-zoom-parent {}

    .fnb .customizedID .backg {
        width: 100% !important;
        height: auto !important;
    }

    .content,
    .contentb {
        /* min-height: calc(100vh - 153px) !important; */
    }

    .menuontop .categoryPid .content {
        max-width: 809px;
    }

    .aoffer:last-child:first-child {
        width: calc(100% - 29px) !important;
        max-width: initial;
        margin-left: 14px !important;
    }

    .giftcards .gc-top-part .gc-list-wrapper .gc-list-item {
        width: calc(33% - 22px) !important
    }

    .giftcards .gc-bottom-part .gc-button {
        max-width: none !important
    }

    .giftcards .gc-bottom-part .gc-mobile-wrapper,
    .giftcards .gc-bottom-part .gc-email-wrapper {
        max-width: none !Important
    }

    .userpages li {
        margin-right: 18px
    }

    .deskmenu {
        height: auto
    }

    .menuontop .deskmenu .tabled .menu .link {
        min-width: auto !Important;
        column-count: 2;
    }

    .menuontop .deskmenu .tabled {
        width: calc(100vw - 23px);
    }

    .retail .hot-line {
        font-size: 13px;
        right: -14px;
    }

    .retail .hot-line:after {
        display: none;
    }

    .menuontop .topmenuopen .tabled .menu {
        min-width: 800px;
    }

    .aoffer {
        max-width: 320px
    }

    .header-loyalty-value {
        margin-right: 22px
    }

    a.callUsNb.hot-line {
        /* top: 6px; */
        /* margin-right: 14px; */
        /* overflow: hidden; */
        /* width: 50px; */
        /* padding-right: 0 !important; */
    }

    div#offerId {
        max-width: 585px
    }

    div#offerId .cont {
        min-height: unset;
        border-radius: 8px !important
    }

    .fnb .categoryPid.subPage .content {
        /* padding-top: 5px; */
    }

    .editAddAddress .parts {
        border-radius: 8px
    }

    .editAddAddress .part {
        display: inline-block;
        width: 50% !important
    }

    .editAddAddress .left.part {
        margin-right: 10px;
        width: calc(50% - 10px) !important
    }

    .loginRegisterID .parts {
        border-radius: 8px;
        min-height: auto !important
    }

    div#createAccountModalID .parts {
        border-radius: 8px;
        min-height: auto !important
    }

    .noOrder .langswitcher {
        right: 25px;
        margin-top: 15px;
        position: fixed
    }

    .noOrder .bigPrice.overbtn.show {
        display: none !important
    }

    .customizedID .picture .swiper-container {
        /* max-width: 600px!important */
    }

    div#customizedModalID {
        /* max-width: calc(100vw - 23px)!important; */
        min-width: auto;
    }

    .noCustomization#customizedModalID .head,
    .noCustomization#customizedModalID .cont,
    .noCustomization#customizedModalID .genBtn {
        width: 100% !important;
    }

    .market .content .itemsList .genBtn.customize {
        margin-top: -213px
    }

    .homePid .categories ul>li a.picture {
        height: 83px;
        width: 100%
    }

    .homePid .categories ul>li {
        width: 23% !important
    }

    .market .content li.itemGrid {
        margin-bottom: 23px;
        /* width: calc(25vw - 5px) !important; */
        margin-left: 2px !important;
        margin-right: 0 !important
    }

    .market .home-collection .itemsList .itemGrid {
        /* width: calc(33% - 5px) !important; */
    }

    .multibranch .homeFilter.ontop {
        min-width: 409px !Important;
    }

    .mobileMenuWrap {
        width: 0
    }

    .holder.ssm-nav-visible {
        width: 300px !important
    }

    .is-navOpen .mobileMenuWrap {
        width: 300px;
    }

    div#loginRegisterModalID,
    div#createAccountModalID {
        max-width: 375px;
        margin: auto !important;
        min-height: auto !important;
        border-radius: 8px !important
    }

    .modal.show {
        top: 50%;
        transform: translate3d(-50%, -50%, 0px)
    }

    div#AddAddressModalID {
        border-radius: 8px;
        overflow: hidden
    }

    #customizedModalID .addToFav {
        width: 100%;
        margin-top: 2px
    }

    .customizedID .head {
        width: 100%
    }

    #customizedModalID .addToFav {
        width: 50%;
        margin-top: 2px
    }

    .customizedID .head {
        width: 50%;
    }

    .fnb .customizedID .cont {
        width: 50%;
        height: 734px !important;
    }

    .customizedID .genBtn {
        height: 55px;
        width: 50% !important;
    }

    .customizedID .genBtn::before {
        content: attr(data-nbofcalories);
        position: fixed;
        left: 22px;
        font-weight: 700;
        opacity: 1;
        color: #000;
        height: 58px;
        line-height: 59px;
        font-size: 13px;
        z-index: 3;
        letter-spacing: 0
    }

    .customizedID {
        max-width: none
    }

    .modal.noCustomization {
        max-width: unset !important
    }

    .homePid .categories ul>li img {
        height: 160%;
        width: auto
    }

    .mobileMenuWrap .holder {
        width: 300px
    }
}

.box.mobileEdit {
    /* min-height: 199px !important; */
    padding-bottom: 42px !important;
}

.box.mobileEdit .genBtn {
    bottom: -15px !important;
    font-size: 13px !important;
    top: auto !important
}

.disable-mobile-verification .inputWrap.verifymobilewrap {
    border: 0;
    padding-bottom: 0;
    background: 0 center;
    margin-bottom: 16px;
    padding-top: 0px;
}

.disable-mobile-verification .verify-mobile-caption {
    display: none
}

.disable-mobile-verification .iti {
    background: #f6f6f6;
    width: 100%;
    padding-left: 6px;
}

.rtl .disable-mobile-verification .iti {
    padding-left: 0px;
    padding-right: 6px;
}

.signupform .disable-mobile-verification .iti {
    margin-left: 0;
    background: #fff
}

.disable-mobile-verification .iti .missing {
    right: 16px;
    margin-right: 0px !Important;
}

.verifymobilewrap .input {
    z-index: 3;
    border-bottom: 0;
    /* padding-left: 14px; */
}

.verifymobilewrap .input:has(.iti) {
    padding-left: 12px!important;
}

.rtl .verifymobilewrap .input {
    padding-left: 0px;
    /* padding-right: 14px; */
}

.rtl .verifymobilewrap .input:has(.iti){
    padding-right:12px
}

.signupform.smssent .verifymobilewrap .input {
    margin-top: 4px !important
}

.order-detailspickup-button-container {
    display: flex;
    justify-content: center
}

.order-detailspickup-button {
    margin-top: 25px;
    width: auto;
    padding-left: 15px;
    padding-right: 15px;
    height: 52px;
    line-height: 52px;
    margin-bottom: 4px;
}

.pickup-identifier-container {
    padding-left: 20px;
    padding-right: 20px;
    position: relative;
    display: flex;
    width: calc(100% - 40px) !important;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    animation: .3s cubic-bezier(0.42, 0, 0.14, 0.93) 1s 1 normal both running fadeInUp2;
    border-bottom: 15px solid #f6f6f6;
    margin-right: 0px;
    padding-top: 28px;
}

.cncld .pickup-identifier-container {
    display: none;
}

.pickup-identifier-container .input-wrapper {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    column-gap: 10px;
}

.pickup-identifier-container .input-wrapper .input-container {
    width: 100%;
}

.pickup-identifier-container .input-wrapper input {
    position: relative;
    display: block;
    border: 1px solid #ccc;
    padding-left: 10px;
    padding-right: 10px;
    height: 40px;
    border-radius: 6px;
    background-color: #f1f1f1;
    width: 100%;
    box-sizing: border-box;
}

.catinmenu.lineLink li {
    list-style: none;
    height: 28px;
}

.catinmenu.lineLink li.selected span {
    color: var(--primary-color)
}

.catinmenu.lineLink li.colls a {
    color: var(--secondary-color)
}

.catinmenu.lineLink li a {
    text-decoration: none;
    display: block
}

.catinmenu.lineLink li:last-child a span {
    font-size: 14px !important
}

.lineLink.catinmenu {
    display: none;
    padding-bottom: 22px
}

.showmobilecategories .catinmenu {
    display: none
}

.showmobilecategories .catinmenu {
    display: table
}

.showmobilecategories .menum {
    display: none
}

/* .pickup-identifier-container {
    display: none
}

.show-pickup-identifiers .pickup-identifier-container {
    display: block
} */

@media(max-width:768px) {
    .retail .oldprice {
        /* position: absolute; */
        /* z-index: 1; */
        /* color: #333; */
        /* mix-blend-mode: difference; */
        /* opacity: .5; */
        /* right: 1px !important; */
        /* left: auto !important; */
    }

    .retail .priceWrap .oldprice {
        opacity: 1;
        padding-right: 33px;
        color: #999 !important;
        mix-blend-mode: unset !important;
        margin-top: -5px;
        margin-left: 0px;
    }

    .rtl.retail .priceWrap .oldprice {
        padding-right: 0px;
    }

    .retail.has-retail-quick-add .priceWrap .oldprice {
        right: auto !important;
        left: 6px !important
    }
}

.offers-category-wrap .offer-category {
    width: calc(50% - 11px);
    display: none;
    margin-bottom: 22px;
    box-shadow: rgba(0, 0, 0, 0.09) 0 7px 10px, rgba(0, 0, 0, 0.09) 0 0 6px;
    margin-left: 3px;
    margin-right: 6px;
    position: relative;
    border-radius: 6px;
    cursor: pointer;
    vertical-align: top;
    min-width: 310px
}

.offers-category-wrap .offer-category:hover {
    opacity: .9
}

.offers-category-wrap .offer-category .picture {
    width: 100%
}

.offers-category-wrap .offer-category .title {
    padding: 10px;
    color: #333;
    font-weight: bold;
    min-height: 43px;
    margin-top: -4px;
    text-align: center;
    align-items: center;
    display: flex;
    place-content: center
}

.offers-category-wrap .offer-category .picture img {
    width: 100%;
    text-align: left
}

.offers-category-wrap {
    padding: 5px;
    margin: 24px auto auto;
    text-align: center
}

@media(max-width:768px) {
    .retail .oldprice {
        justify-content: center
    }

.retail .meta .oldprice {
    margin-top: 0px;
}
}

.countdown-container {
    margin-top: 26px
}

.countdown-container .barCode {
    display: none
}

.countdown-container .date {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 25px;
    text-transform: uppercase
}

.countdown-container .countdown {
    font-size: 80px;
    font-family: titlefont;
    margin-bottom: 22px
}

.online-vouchers-title,
.in-store-coupons-title {
    font-family: titlefont;
    color: var(--secondary-color);
    position: relative;
    font-size: 22px;
    line-height: 35px;
    text-align: center;
    padding-left: 7px;
    width: calc(100% - 19px);
    margin: 2px auto 23px;
    font-weight: normal !important;
}

.offers-section:not(.online-vouchers-page) .online-vouchers-title {
    display: none;
}

.in-store-coupons-title {
    display: none
}

.in-store-coupons-page .online-vouchers-title {
    display: none
}

.online-vouchers-page .in-store-coupons-title {
    display: none
}

.delivery-address-note {
    position: relative;
    display: block;
    margin-bottom: 10px;
    margin-top: 36px;
    font-size: 15px;
}

.rtl .delivery-address-note {
    direction: rtl
}

.delivery-address-note .address-edit {
    float: right;
    margin-right: 4px;
    cursor: pointer;
    text-decoration: none;
    border-bottom: 1px dotted #666
}

.rtl .delivery-address-note .address-edit {
    float: left
}

.offerclose {
    font-family: titlefont;
    color: var(--primary-color);
    width: 33px;
    height: 33px;
    text-align: center;
    border-radius: 20px;
    font-size: 25px;
    position: absolute;
    left: 2px;
    top: 23px;
    cursor: pointer;
    z-index: 1;
    display: none
}

.in-store-coupons-page .offerclose {
    color: var(--secondary-color)
}

.footermenu {
    display: none;
}

.footermenu a {
    display: inline-block;
    font-family: textfont;
    font-size: 11px;
    flex: 1 1 0;
    text-align: center;
    padding-top: 6px;
    color: #999;
    text-decoration: none;
    text-transform: capitalize
}

.footermenu a.ft-sch {
    display: none
}

.display-scheduled-order .footermenu a.ft-sch {
    display: inline-block
}

.footermenu a::before {
    font-family: Ionicons;
    display: block;
    font-size: 28px;
    margin-bottom: 2px;
    color: #777
}

.footermenu a.active,
.footermenu a.active::before {
    color: var(--primary-color)
}

.footermenu a.ft-hom::before {
    content: "\F30C"
}

.footermenu a.ft-fav::before {
    content: "\F4B3"
}

.footermenu a.ft-sch::before {
    content: "\F3F4"
}

.footermenu a.ft-ord::before {
    content: "\F454"
}

.footermenu a.ft-acc::before {
    content: "\F345"
}

.footermenu a.ft-add::before {
    content: "\F1E5"
}

.userpages .md-schedule {
    display: none
}

.display-scheduled-order .userpages .md-schedule {
    display: block
}

.userpages .md-schedule::before {
    font-family: Ionicons;
    content: "\F3F4";
    font-size: 24px;
    margin-right: 10px;
    position: absolute;
    top: -3px
}

@media(max-width:768px) {
    .show-footer-menu .footermenu {
        position: fixed;
        width: 100%;
        height: 80px;
        background-color: #fafafa;
        bottom: 0;
        border-top: 1px solid #eee;
        display: flex;
        z-index: 9
    }

    .show-footer-menu .inproduct .footermenu {
        /* display: none; */
        transform: translateY(200px);
        transition: all 0.3s ease 0s;
    }

    /* .show-footer-menu .content::after,
    .contentb::after {
        content: "";
        background-color: red;
        display: block;
        height: 100px !important;
        position: absolute !important;
        bottom: -100px !important
    } */

    .show-footer-menu.market .checkoutID.subPage .content {
        padding-bottom: 90px !important
    }
}

@media(max-width:768px) {
    .show-footer-menu .offers-wrap {
        padding-bottom: 90px
    }

    .closed {
        width: calc(100vw - 122px)
    }

    .offers-wrap {
        /* display: none; */
    }

    .offers-category-wrap .offer-category {
        display: inline-block
    }

    .online-vouchers-page .offers-category-wrap .offer-category,
    .in-store-coupons-page .offers-category-wrap .offer-category {
        display: none
    }

    .online-vouchers-page .offers-wrap,
    .in-store-coupons-page .offers-wrap {
        display: block
    }

    .online-vouchers-page .offerclose,
    .in-store-coupons-page .offerclose {
        display: block;
        z-index: 2
    }

    .disableClose .offerclose {
        display: none
    }

    .offers-wrap .offer {
        display: none;
        min-height: 163px;
    }

    .online-vouchers-page .offers-wrap .offer.online-voucher-item {
        display: inline-block;
    }

    .in-store-coupons-page .offers-wrap .offer.in-store-coupon-item {
        display: inline-block
    }

    .in-store-coupons-page .in-store-coupons-title {
        display: block
    }
}

.orders .order .withTitle {
    text-transform: capitalize;
    width: 100%;
    min-height: 15px;
    height: auto
}

@media only screen and (min-device-width:834px) and (max-device-width:834px) and (orientation:portrait) and (-webkit-min-device-pixel-ratio:2) {
    body {
        visibility: visible
    }

    .retail.menuontop .reviewbagbut {
        display: block !important;
    }

    .retail.menuontop .reviewbag .reviewbagbut {
        display: none !important;
    }

    .retail.menuontop .myBagModule.stick {
        display: block;
    }

    .giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-amount-wrapper .gc-custom-amount {
        width: 28px !important;
    }

    div#customizedModalID {
        max-width: 780px;
    }

    .orders.normal .order {
        margin-right: 0;
        width: 100%
    }

    .checkoutID .reviewbagbut {
        display: none
    }

    .categoryPid .titleAndLegend {
        display: none
    }

    .content,
    .contentb {
        width: 531px;
        margin-left: -16px;
        padding-right: 0 !important
    }

    .pheadline {
        width: 28%;
    }

    .homePid .itemsList .itemGrid,
    .itemsList .itemGrid {
        width: calc(100% - 16px);
        margin-left: 0 !important
    }

    .itemsList .itemGrid {
        width: 100%
    }

    .retail .priceWrap .oldprice {
        margin: -6px;
        position: absolute;
        left: 21px !important
    }

    .myAccountPid .whiteBox .boxes .box {
        width: 100% !important
    }

    .footer {
        display: none
    }

    .retail .customizedID .genBtn.retailonly {
        margin-bottom: 22px
    }

    .retail .customizedID {
        min-width: unset
    }

    .productpage div#customizedModalID,
    .productpage div#customizedModalID.rigid {
        max-width: 790px;
    }



}

.tabled {
    display: block;
    height: 100%;
    width: 100%;
    transition: all .2s ease 0s
}

.tabled {
    position: fixed;
    width: 262px;
    overflow: visible;
    height: calc(100vh - 765px);
}

.tabled {}

.retail .tabled {
    width: 220px;
    height: fit-content;
    position: relative;
    overflow: hidden;
}

.tabled::-webkit-scrollbar-thumb {
    background-color: rgb(232, 233, 235);
    border-radius: 16px;
    border: 9px solid #f6f6f6;
    border-top: 150px solid #f6f6f6
}

.tabled::-webkit-scrollbar-track {
    background: rgb(246 246 246);
}

.tabled::-webkit-scrollbar {
    background-color: #fff;
    width: 22px;

}

.fnb .checkoutID .tabled::-webkit-scrollbar-thumb {
    background-color: rgb(255 255 255);
    border-radius: 16px;
    border: 9px solid #eeeeee;
    border-top: 150px solid #eeeeee
}

.fnb .checkoutID .tabled::-webkit-scrollbar-track {
    background: rgb(238 238 238);
}

.market .categoryPid .tabled::-webkit-scrollbar-track {
    background: rgb(255 255 255);
}

.market .categoryPid .tabled::-webkit-scrollbar-thumb {
    border: 9px solid #ffffff;
    border-top: 150px solid #ffffff
}

.market .checkoutID .tabled::-webkit-scrollbar-track {
    background: rgb(238 238 238);
}

.market .checkoutID .tabled::-webkit-scrollbar-thumb {
    border: 9px solid #eeeeee;
    border-top: 150px solid #eeeeee
}


.langswitcher {
    margin-top: 29px;
    margin-right: 18px;
    color: #fff;
    display: block;
    border: 2px solid #fff;
    height: 25px;
    width: 33px;
    border-radius: 7px;
    float: left
}

.onelanguage .langswitcher {
    display: none;
}

.selection .selectDate {
    width: 150px
}

.rtl .selection .selectDate {
    width: 150px
}

.no-asap-order #time-now {
    display: none
}

.no-asap-order #time-sched {
    display: none
}

.no-asap-order .box_date .title {
    display: block !important
}

.myAccountPid .no-items-found {
    text-align: center;
    font-size: 15px;
    margin-top: 122px
}

.myAccountPid .no-items-found::before {
    font: 119px / 1 Material-Design-Iconic-Font;
    content: "\F109";
    margin-right: 10px;
    color: #eee;
    display: block;
    margin-bottom: 25px
}

.no-items-found .genBtn {
    margin-left: auto;
    margin-right: auto;
    min-width: 310px;
    min-height: 50px;
    margin-top: 42px
}

.rtl.market .itemsList .itemGrid .priceWrap .wrap .price {
    float: left
}

.rtl.market .itemsList .itemGrid .priceWrap .wrap .oldprice {
    float: none;
    display: block;
}

.myBagModule .itemBags .itemBag .brand {
    font-weight: bold;
    font-family: textfont;
    color: #666;
    font-size: 12px !important
}

.myBagModule .itemBags .itemBag .brand:empty {
    display: none;
}

.rtl .myBagModule .itemBags .itemBag .brand {
    text-align: right
}

.market.rtl .itemsList .itemGrid {
    margin-left: 0;
}

.market .bagph::after {
    content: "\F1C9"
}

.rtl.retail .d-w {
    float: right
}

.cancel-edit-order {
    position: relative;
    display: block;
    float: right;
    font-size: 11px;
    text-transform: uppercase;
    border-bottom: 1px dashed #878787;
    color: #878787;
    margin-top: 19px;
    padding-bottom: 3px;
    cursor: pointer;
    font-weight: bold;
    margin-right: 39px
}

.cancel-edit-order.address-itb {
    margin-top: 7px;
    margin-right: 10px;
    margin-bottom: 9px;
}
@media(min-width:769px) {
    .retail .layout1 li {
        min-width: 280px;
    }

    .home-collection.layout2 .gITems ul {
        white-space: normal;
        /* grid-template-columns: 300px 300px 300px 300px 300px 300px 300px 300px 300px 300px!important; */
    }

    .cancel-edit-order:hover {
        color: var(--primary-color)
    }
}

.auto-login-from-back .socials.menuList {
    display: none
}

.auto-login-from-back .MenuParts .callUsNb {
    display: none !important
}

.auto-login-from-back .logo {
    display: none !important
}

.auto-login-from-back .deskmenu .bottom {
    display: none
}

.auto-login-from-back:not(.retail) .deskmenu {
    margin-top: 26px
}

.auto-login-from-back footer {
    display: none !important
}

.auto-login-from-back .subPage .titleAndLegend {
    display: none !important
}

.auto-login-from-back .deskmenu {
    position: fixed;
    top: 90px;
    overflow: hidden auto;
    display: block;
    height: calc(100% - 116px) !important
}

.auto-login-from-back .content {
    margin-left: 280px
}

.auto-login-from-back .cancel-edit-order {
    display: none
}

.auto-login-from-back .paymentMethods {
    display: none
}

.auto-login-from-back:not(.retail) .userpages a {
    margin-left: -28px;
    width: 34px;
    display: block;
    overflow: hidden;
    position: absolute;
    opacity: 0;
    background-color: #fff;
    height: 29px;
    color: #fafafa !important;
    line-height: 7px !important
}

.auto-login-from-back .userpages .md-fav::before {
    color: #666 !important
}

.auto-login-from-back #gb-widget-2748{
    display:none!important
}

.auto-login-from-back .MenuParts .menuList {
    display: none
}

.auto-login-from-back:not(.retail) .homeFilter {
    margin-top: 105px;
    left: 30px;
    width: 244px;
    transform: none;
    position: fixed;
    top: -92px;
    visibility: visible;
    background-color: rgba(44, 44, 44, 0.05)
}

.auto-login-from-back:not(.retail) .MenuParts .parts .bot {
    visibility: hidden
}

.auto-login-from-back #wrapper {
    margin-top: 4px
}

.auto-login-from-back:not(.retail) .userbar {
    top: 51px;
    left: 25px !important;
    border-bottom: 0 !important;
    transform: none !important
}

.auto-login-from-back.productpage.hide-bag:not(.menuontop) body.inproduct .layerPop{padding-left: 271px;}

.auto-login-from-back .auto-login-from-back .deskmenu {
    top: 107px;
    height: calc(100% - 134px) !important
}
.auto-login-from-back.productpage.hide-bag:not(.menuontop) div#customizedModalID, .productpage.hide-bag:not(.menuontop) div#customizedModalID.rigid{
    padding-top:16px
}

.auto-login-from-back:not(.retail) .subPage .MenuParts {
    width: 293px
}

.auto-login-from-back .userpages {
    float: none;
    width: 100% !important
}

.auto-login-from-back .subPage .userbar {
    width: 100%;
    background: 0 center
}

.auto-login-from-back:not(.retail) .myBagModule.stick {
    top: -13px;
}

.auto-login-from-back .mCSB_container {
    height: calc(100% - 136px)
}

.auto-login-from-back .filter input {
    color: #333
}

.auto-login-from-back body {
    background: #fff
}

.auto-login-from-back.retail .itemsList .itemGrid .picture{
    margin-top:0px;
}

.auto-login-from-back.retail .itemsList .itemGrid .picture{
    padding-bottom:85%
}

.auto-login-from-back.retail .homeFilter.ontop {
    left: 50%;
}


.auto-login-from-back .homeFilter .filter .zmdi {
    color: #333
}

.auto-login-from-back:not(.retail) .userpages li {
    margin-right: 54px;
    width: 0
}

.auto-login-from-back.fnb .checkoutID .userpages li,
.auto-login-from-back.market .checkoutID .userpages li {
    display: block
}

.auto-login-from-back li.md-schedule {
    display: none !important
}

.auto-login-from-back li.md-reorder {
    display: none !important
}

.auto-login-from-back .delivery-date {
    display: none !important
}

.auto-login-from-back.fnb .subPage.checkoutID .content,
.auto-login-from-back.market .subPage.checkoutID .content {
    margin-top: -15px
}

.auto-login-from-back .userpages .md-orders::before {
    pointer-events: none
}

.auto-login-from-back .userbar {
    background: transparent
}

@media (min-width:769px) {
    #bobPaymentsModalID.payment-type-checkout,
    #fibPaymentsModalID.payment-type-checkout {
        max-width: 640px;
        max-height: 480px;
        border-radius: 0
    }

    #bobPaymentsModalID.payment-type-checkout .normalForm,
    #fibPaymentsModalID.payment-type-checkout .normalForm {
        height: 425px
    }

    #bobPaymentsModalID.payment-type-urway,
    #fibPaymentsModalID.payment-type-urway {
        max-width: 455px;
        max-height: 600px;
        border-radius: 0
    }

    #bobPaymentsModalID.payment-type-urway .normalForm,
    #fibPaymentsModalID.payment-type-urway .normalForm {
        height: 600px
    }

                #bobPaymentsModalID.payment-type-suyool {
                max-width: 455px;
                max-height: 800px;
                border-radius: 0
            }

            #bobPaymentsModalID.payment-type-suyool .normalForm{
                height: 800px
            }

                    #bobPaymentsModalID.payment-type-montypay {
                max-width: 455px;
                max-height: 850px;
                border-radius: 0
            }

            #bobPaymentsModalID.payment-type-montypay .normalForm{
                height: 850px
            }
}

.fnb .cont .data {
    display: none;
}

.fnb .largetxt .cont .data,
.fnb .largetxt .cont .description {
    display: block;
}

.fnb .description.retailonly {
    display: none !important;
}

.fnb .largetxt .cont .description {
    /* display: none!important; */
}

.fnb .customizedID.largetxt .data .description {
    display: block
}

.no-asap-order .delivery-date {
    color: #999;
    font-weight: normal;
    font-size: 15px;
    padding-bottom: -1px;
    display: block;
    position: relative;
    padding-top: 0px;
    /* text-align: left !Important; */
    opacity: 0.8;
    padding-left: 2px;
    text-transform: lowercase;
    margin-bottom: 4px !important;
}

.box_date .radio .label:last-child {
    min-width: 0;
    margin-bottom: 0;
    font-size: 17px;
    line-height: 19px;
}

.box_date .radio {
    width: auto
}

#promotionId .btnClose .zmdi {
    display: block !important
}

.closed {
    background-color: rgba(255, 249, 233, 0.92);
    position: absolute;
    padding: 10px 38px 11px;
    border: 1px solid #f2cece;
    border-radius: 6px;
    font-size: 14px;
    color: #c54d4d;
    display: none;
    margin-top: -11px
}

.no-asap-order .closed {
    display: block
}

.closed .l1 {
    font-weight: bold;
    font-size: 16px
}

.rtl .closed .l1 {
    direction: rtl;
}

.closed .l1::before {
    font: 20px / 1 Material-Design-Iconic-Font;
    content: "\F1F7";
    margin-right: 8px;
    margin-bottom: 10px;
    position: absolute;
    left: 12px
}

.closed .l2 {
    font-size: 13px;
    margin-top: 5px;
    color: #666
}

.retail .closed {
    display: none
}

.paused {
    background-color: rgba(255, 249, 233, 0.92);
    position: absolute;
    padding: 10px 38px 11px;
    border: 1px solid #f2cece;
    border-radius: 6px;
    font-size: 14px;
    color: #c54d4d;
    display: block;
    margin-top: -11px
}

.paused .l1 {
    font-weight: bold;
    font-size: 16px
}

.paused .l1::before {
    font: 20px / 1 Material-Design-Iconic-Font;
    content: "\F1F7";
    margin-right: 8px;
    margin-bottom: 10px;
    position: absolute;
    left: 12px
}

.paused .l2 {
    font-size: 13px;
    margin-top: 5px
}

.retail .paused {
    display: none
}

.normalForm .inputWrap.date.disabled {
    cursor: default
}

.normalForm .inputWrap.date.disabled input {
    cursor: default;
    color: #999;
    text-align: left;
}

.normalForm .inputWrap.date.disabled .zmdi-calendar-alt {
    cursor: default;
    color: #999 !important
}

.header.noslides {
    display: none
}

.fnb .picture.nopimgb {
    height: 168px;
}

@media(max-width:768px) {
    .swiper-container.main-swiper .headbackimg.desktop-img {
        display: none
    }

    .swiper-container.main-swiper .headbackimg.mobile-img {
        display: block;
    }
}

@media(min-width:769px) {
    .swiper-container.main-swiper .headbackimg.desktop-img {
        display: block;
    }

    .menuontop img.headbackimg {
        width: 100vw !important;
    }

    .swiper-container.main-swiper .headbackimg.mobile-img {
        display: none
    }
}

.retail .size-guide-container {
    position: relative;
    display: flex;
    text-align: right;
    justify-content: flex-end
}

.classicproduct .size-guide-container {
    text-align: left;
    flex-direction: row-reverse;
    margin-bottom: 0
}

.rtl.classicproduct .size-guide-container {
    text-align: right !Important;
    width: 100%;
    display: block;
}

.retail .size-guide-container[data-unit=""] {
    /* display: none; */
}

.size-guide-button {
    position: relative;
    display: block;
    font-size: 14px;
    color: #666;
    cursor: pointer;
    margin-right: 8px;
    padding-top: 1px;
    border-bottom: 1px dashed #ccc;
    height: 24px;
    margin-bottom: 17px;
}

.classicproduct .size-guide-button {
    text-transform: uppercase;
    font-size: 13px;
    color: #999
}

#sizeGuideModalID {
    padding: 0;
    max-width: 998px;
    width: 1024px !important;
    height: 0px;
}

.classicproduct div#sizeGuideModalID {
    box-shadow: 2px -2px 26px 9999px rgba(0, 0, 0, 0.1);
    /* margin-top: 82px; */
    overflow: hidden;
    display: none;
    transform: translate3d(-50%, 10%, 0);
}

.classicproduct div#sizeGuideModalID.show {
    transform: translate3d(-50%, -50.5%, 0) !important;
    top: 430px !important;
}

.classicproduct div#sizeGuideModalID.show {
    height: auto;
    border-right: 3px solid rgb(0 0 0 / 13%);
    border-bottom: 3px solid rgb(0 0 0 / 13%);
}

div#sizeGuideModalID .btnClose .zmdi {
    color: #000;
    margin-top: 6px;
}

#sizeGuideModalID .parts {
    padding: 0px;
    overflow: hidden;
    width: 100%;
    box-sizing: border-box;
}

.classicproduct #sizeGuideModalID .parts {
    border-radius: 0;
    overflow: auto;
}

#sizeGuideModalID .wrap {
    padding-bottom: 0;
    padding: 42px;
    padding-top: 59px;
}

#sizeGuideModalID img.desktop {
    /* max-height: 470px; */
    max-width: 100%;
    display: block !important;
}

#sizeGuideModalID img.mobile {
    max-height: 470px;
    max-width: 100%;
    display: none !important;
}

@media(max-width:768px) {
    #sizeGuideModalID img.desktop {
        display: none !important
    }

    #sizeGuideModalID img.mobile {
        display: block !important;
        height: auto !important;
        /* max-height: 100%; */
        max-width: none;
    }
}

.you-will-earn-points {
    position: relative;
    display: block;
    font-size: 13px;
    color: #999;
    text-align: right;
    font-weight: normal;
    margin-top: -36px;
}

.rtl .you-will-earn-points {
    text-align: left;
}

.you-will-earn-points .l-left-side {}

.mcolls {
    margin-top: 22px
}

.mobileMenuWrap .lineLink .mcolls .text {
    color: #999 !important;
    font-size: 13px !important
}

.hide-coll-on-homepage {
    display: none
}

.loyaltyl.loyaltyl-bottom {
    display: block
}

.l-join {
    width: 100%;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.76);
    position: fixed;
    bottom: -100vh;
    text-align: center;
    z-index: 99;
    opacity: 0;
    display: none
}

.l-join.lj-fade {
    display: block;
    opacity: 1;
    transition: all .3s linear 0s;
    bottom: 0
}

.l-join img {
    width: 295px;
    margin: 34px auto auto
}

@media only screen and (max-width:375px) {
    .l-join img {
        width: 268px;
        margin: 30px auto auto
    }
}

@media only screen and (max-width:320px) {
    .l-join img {
        width: 235px;
        margin: 20px auto auto
    }
}

.loyalty-w {
    background-image: none;
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center bottom;
    min-height: calc(100vh - 136px);
    background-attachment: fixed;
    text-align: center;
    display: inline-block;
    width: 100%;
    margin-top: 52px
}

.loyalty-w .loyalty-logo img {
    width: 90px;
    height: auto;
    margin-top: 18%
}

.loyalty-w .loyalty-logo {
    text-align: center;
    margin-top: 0
}

.lvl1 td.l-name::before {
    content: "Rook"
}

td.l-name {
    text-align: right
}

.lvl2 td.l-name::before {
    content: "Knight"
}

.lvl3 td.l-name::before {
    content: "King"
}

.lvl1 td.l-icon {
    background-image: url("../../config/images/level-1.png");
    background-size: 100px 100px;
    height: 186px;
    width: 184px;
    background-repeat: no-repeat;
    background-position: center center
}

.lvl2 td.l-icon {
    background-image: url("../../config/images/level-2.png");
    background-size: 100px 100px;
    height: 186px;
    width: 184px;
    background-repeat: no-repeat;
    background-position: center center
}

.lvl3 td.l-icon {
    background-image: url("../../config/images/level-3.png");
    background-size: 100px 100px;
    height: 186px;
    width: 184px;
    background-repeat: no-repeat;
    background-position: center center
}

.current-level {
    vertical-align: middle;
    font-size: 42px;
    font-family: titlefont;
    font-weight: normal;
    position: relative;
    display: inline-block;
    text-align: center;
    line-height: 53px;
    margin-bottom: 8px;
    height: 70px;
    background-color: #bc7f4c;
    color: #fff;
    border-radius: 8px;
    overflow: hidden;
    width: 70px;
}

.current-level .zmdi {
    position: relative;
    display: block;
    margin-top: 14px;
}

.lvl1 .current-level {
    background-color: #bc7f4c;
}

.lvl2 .current-level {
    background-color: #91989e
}

.lvl3 .current-level {
    background-color: #f5a732
}

.lvl4 .current-level {
    background-color: #3c1a2f
}

.loyaltylvl1.header-loyalty-value {
    background-color: #bc7f4c
}

.loyaltylvl2.header-loyalty-value {
    background-color: #91989e
}

.loyaltylvl3.header-loyalty-value {
    background-color: #f5a732
}

.loyaltylvl4.header-loyalty-value {
    background-color: #3c1a2f
}

.current-level::before {
    position: absolute;
    content: "";
    width: 45px;
    height: 293px;
    background-color: #fafafa;
    transform: rotate(45deg);
    opacity: .1;
    left: 50%;
    top: -132px;
}

.current-level::after {
    animation: 5s ease-in-out 0s infinite normal forwards running shine;
    content: "";
    position: absolute;
    top: -110%;
    left: -210%;
    width: 200%;
    height: 200%;
    opacity: 0;
    transform: rotate(30deg);
    background: linear-gradient(to right, rgba(255, 255, 255, 0.13) 0, rgba(255, 255, 255, 0.13) 77%, rgba(255, 255, 255, 0.5) 92%, rgba(255, 255, 255, 0) 100%)
}

@keyframes shine {
    10% {
        opacity: 1;
        top: -30%;
        left: -30%;
        transition-property: left, top, opacity;
        transition-duration: .7s, 0.7s, 0.15s;
        transition-timing-function: ease
    }

    100% {
        opacity: 0;
        top: -30%;
        left: -30%;
        transition-property: left, top, opacity
    }
}

.current-level-unit {
    font-size: 21px;
    font-family: titlefont;
    font-weight: normal;
    position: relative;
    display: block;
    color: #333;
    text-align: center;
    text-transform: uppercase
}

.p2next {
    text-align: center;
    color: #333;
    font-family: textfont;
    font-size: 14px;
    margin-top: 10px;
    min-height: 17.6px
}

.lvl1 span.nln::before {
    content: "SILVER"
}

.lvl2 span.nln::before {
    content: "GOLD"
}

.lvl3 .p2next {
    display: none
}

.p2nexti li {
    list-style: none;
    width: 55px;
    display: inline-block !important
}

.p2nexti li.active {
    opacity: 1
}

li.lvl-1 {
    opacity: .6
}

li.lvl-1 .zmdi {
    color: #b57139
}

.p2nexti li img {
    width: 45px
}

.p2nexti li .name {
    font-family: titlefont;
    font-size: 14px;
    position: relative;
    display: block;
    text-align: center;
    margin-top: -3px;
    text-transform: uppercase;
    position: absolute;
    width: 52px;
}

.p2nexti li.lvl-1 .name {
    color: #ad7139
}

.p2nexti li.lvl-2 .name {
    color: #91989e
}

.p2nexti li.lvl-3 .name {
    color: #f5a71d
}

.p2nexti li.lvl-4 .name {
    color: var(--primary-color)
}

.p2nexti li.bar1,
.p2nexti li.bar2,
.p2nexti li.bar3 {
    width: 94px;
    height: 4px;
    margin-top: 43px;
    vertical-align: top;
    margin-left: -13px;
    margin-right: -13px;
    background-color: #e6e6e6
}

.p2nexti.nb-of-levels-4 li.bar1,
.p2nexti.nb-of-levels-4 li.bar2,
.p2nexti.nb-of-levels-4 li.bar3 {
    width: 60px;
    margin-left: -14px;
    margin-right: -9px;
}

.p2nexti li.bar1 .bfiller,
.p2nexti li.bar2 .bfiller,
.p2nexti li.bar3 .bfiller {
    height: 4px;
    margin-top: 0;
    background-color: var(--secondary-color)
}

.loyalty-w .p-summary {
    display: block;
    float: none;
    margin-top: 10px;
    text-align: center;
    padding: 11px;
    color: #666
}

.p2nexti {
    margin-top: 20px;
    text-align: center
}

.p2nexti .zmdi {
    font-size: 44px;
    margin-bottom: 11px;
    margin-top: 22px;
}

.p2nexti .l1 {
    text-align: center
}

.l-dynamics .ld-title {
    color: #a61815;
    background-color: #fff;
    display: block;
    text-align: center;
    margin: -9px auto auto;
    width: 193px;
    font-weight: bold;
    font-size: 15px
}

.l-dynamics {
    border-top: 1px solid #a0a0a0;
    margin-top: 24px;
    padding-bottom: 96px
}

.d-desc {
    text-align: center;
    padding: 16px;
    color: #666
}

.p-summary .lking {
    color: green;
    display: none
}

.lvl3 .p-summary .r-k {
    display: none
}

.lvl3 .p-summary .lking {
    display: block
}

.l-footer {
    text-align: center;
    background-color: var(--primary-color);
    padding-top: 21px;
    position: fixed;
    width: 100%;
    height: 56px;
    padding-left: 30px;
    padding-right: 30px;
    box-sizing: border-box;
    bottom: 0;
    color: #fff;
    font-size: 15px;
    cursor: pointer
}

.rd-title {
    position: relative;
    display: block;
    text-align: center;
    font-family: titlefont;
    font-size: 13px;
    margin-bottom: 6px;
    color: var(--primary-color);
    margin-top: calc(100vh - 635px)
}

.rd-amount {
    position: relative;
    display: flex;
    text-align: center;
    align-items: center;
    justify-content: center
}

.rd-amount .l-btn {
    position: relative;
    display: inline-block;
    text-align: center;
    min-width: 150px;
    margin-left: auto;
    margin-right: auto;
    color: #333;
    font-family: textfont, sans-serif;
    font-size: 21px;
    padding: 4px 15px;
    width: auto;
    border-radius: 6px;
    align-items: center;
    justify-content: center;
    min-height: 41px;
    line-height: 41px;
    border: 1px dotted var(--primary-color)
}

.rd-button {
    display: block;
    margin-top: 41px;
    background-color: #a61815;
    color: #fff;
    height: 53px;
    line-height: 53px;
    font-size: 16px;
    font-weight: bold;
    border-radius: 4px;
    border-top: 1px solid #e06868
}

@media only screen and (min-width:769px) {
    .loyalty-w {
        margin: auto;
        padding-top: 82px;
        width: calc(100% - 604px);
        vertical-align: top;
        position: relative;
    }

    .menuontop .loyalty-w {
        width: 100%
    }

    .header-loyalty-value {
        margin-right: 17px
    }

    .loyalty-details .loyalty-w {
        background-image: none !important
    }

    .rd-title {
        margin-top: 62px !important
    }

    .loyalty-w .loyalty-logo {
        margin-top: 0
    }

    .loyalty-w .loyalty-logo img {
        margin-top: 22px
    }

    .loyalty-popup {
        width: 460px;
        height: 647px;
        padding-top: 0;
        transform: translateY(-50%);
        top: 50%;
        min-height: auto !important
    }

    .loyalty-popup .l-footer {
        display: block
    }

    .l-footer {
        display: none
    }
}

.rd-how-it-works {
    position: relative;
    display: inline-block;
    text-align: center;
    font-family: titlefont;
    font-size: 15px;
    padding-bottom: 14px;
    color: var(--primary-color);
    margin-top: 30px;
    text-decoration: none;
    cursor: pointer
}

.rd-how-it-works.expiry::after {
    display: none
}

.rd-how-it-works.expiry {
    font-size: 15px
}

.rd-how-it-works::after {
    content: "";
    position: absolute;
    bottom: 9px;
    left: 0;
    height: 1px;
    width: 100%;
    background-color: var(--primary-color);
    opacity: .5
}

@media(max-width:768px) {
    #wrapper {
        height: auto;
        min-height: 100vh;
    }

    #wrapper {
        background-color: transparent;
    }

    body.favoritePid,
    .favoritePid #wrapper {
        background: #f6f6f6;
    }

    .cordova .homePid #wrapper {
        /* padding-top: 136px; */
    }

    .retail.cordova .homePid #wrapper {
        padding-top: 66px;
    }

    .subPage .titleAndLegend {
        display: none !important
    }
}

.loyalty-details h2 {
    font-size: 27px;
    font-family: titlefont;
    font-weight: normal;
    position: relative;
    display: block;
    color: var(--primary-color);
    text-align: center;
    margin-top: 25px
}

.loyalty-details .loyalty-w {
    margin-top: 0
}

#loyaltyDetailsModalID.loyalty-details .loyalty-w,
#loyaltyMoreDetailsModalID.loyalty-details .loyalty-w {
    padding: 25px 0 0;
    margin-top: 0;
    position: relative;
    display: block;
    margin-bottom: 59px;
    width: 100% !important
}

.loyalty-details .l-description {
    position: relative;
    display: block;
    width: 80%;
    margin-right: auto;
    margin-left: auto;
    text-align: center
}

.loyalty-details p {
    font-size: 15px;
    color: #8c532e;
    font-weight: 600;
    line-height: 16px;
    margin-top: 8px
}

.loyalty-details p img {
    position: relative;
    display: block;
    margin: 11px auto 15px
}

.loyalty-details .loyalty-w h3 {
    position: relative;
    display: inline-block;
    text-align: center;
    font-family: titlefont;
    font-size: 15px;
    padding-bottom: 14px;
    color: var(--primary-color);
    margin-top: 31px;
    text-decoration: none;
    cursor: pointer
}

.loyalty-details .l-description {
    padding-bottom: 100px
}

.loyalty-w li.lvl-2,
.loyalty-w li.lvl-3,
.loyalty-w li.lvl-4 {
    opacity: .4
}

li.lvl-2 .zmdi {
    color: #91989e
}

li.lvl-3 .zmdi {
    color: #f5a732
}

li.lvl-4 .zmdi {
    color: var(--primary-color)
}

.loyalty-w li.lvl-2.active,
.loyalty-w li.lvl-3.active,
.loyalty-w li.lvl-4.active {
    opacity: 1
}

.header-loyalty-value {
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center center;
    height: 45px;
    min-width: 55px;
    position: relative;
    background-size: contain;
    top: 20px;
    padding-left: 5px;
    padding-right: 5px;
    text-align: center;
    font-size: 12px;
    color: #fff;
    font-weight: bold;
    cursor: pointer;
    background-color: #b57139;
    border-radius: 5px;
    overflow: hidden;
    box-sizing: border-box;
    width: 57px;
    margin-right: 20px;
}

.loyalty.subPage .header-loyalty-value {
    display: none
}

.loyalty-icon {
    font-size: 21px;
    margin-top: 5px
}

.header-loyalty-value span {
    position: absolute;
    text-align: center;
    bottom: 3px;
    width: 100%;
    left: 0
}

.header-loyalty-value::before {
    position: absolute;
    content: "";
    width: 20px;
    height: 100px;
    background-color: #fafafa;
    transform: rotate(45deg);
    opacity: .1;
    left: 50%;
    top: -37px
}

.box_delivery .btm .loyalty {
    display: none
}

.kangaroo-loyalty-points .lp-points-container {
    position: relative;
    display: block;
    height: 47px;
    background-color: #fff;
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: right center;
    /* margin-top: 14px; */
    /* padding-bottom: 4px; */
    border-bottom: 1px solid #dfdfdf;
    border-radius: 9px !important;
    overflow: hidden;
    margin-bottom: 23px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 2px;
    box-sizing: border-box;
}

.kangaroo-loyalty-points .lp-points-container .lp-title {
    font-family: titlefont;
    color: #fff;
    font-size: 18px;
    margin-left: 20px;
    position: relative;
    padding-top: 16px;
    display: none
}

.kangaroo-loyalty-points .lp-points-container .input {
    /* margin-left: 12px; */
    position: relative;
    display: block;
    /* margin-top: 13px; */
    /* padding-left: 20px; */
    cursor: pointer;
    height: 100%;
}

.kangaroo-loyalty-points .lp-points-container .input .label {
    font-size: 14px !important;
    color: #666;
    position: absolute;
    top: 12px !important;
    left: 26px;
    /* text-transform: initial!important; */
    text-transform: capitalize;
}

.rtl .kangaroo-loyalty-points .lp-points-container .input .label {
    top: 16px;
}

.kangaroo-loyalty-points .lp-points-container .input .zmdi-dot-circle {
    color: var(--primary-color);
    font-size: 21px;
    width: 17px;
    height: 17px
}

.kangaroo-loyalty-points .lp-points-container .input .zmdi-circle-o {
    color: #999;
    font-size: 21px;
    width: 17px;
    height: 17px
}

.kangaroo-loyalty-points .lp-points-container .input .check {
    position: absolute;
    top: 11px;
    cursor: pointer
}

.lp-redeemable-amount {
    position: absolute;
    display: block;
    /* bottom: 3px; */
    margin-left: 0;
    height: 34px;
    max-width: 250px;
    /* padding-left: 15px; */
    /* padding-top: 13px; */
    right: 0;
    /* top: 50%; */
    /* transform: translateY(-50%); */
    z-index: 1;
    margin-top: 16px;
    bottom: 6px;
}

.lp-redeemable-amount.off {
    margin-top: -1px;
    right: 4px;
}

.lp-redeemable-amount .lpr-title {
    position: relative;
    color: var(--primary-color);
    font-family: titlefont;
    float: left;
    font-size: 14px;
    display: none;
    pointer-events: none
}

.lpr-amount-container {
    position: relative;
    display: flex;
    /* float: right; */
    /* padding-top: 10px; */
    margin-right: 10px;
    align-items: center;
    height: 100%;
}

.lpr-amount-container .lpr-minus {
    position: relative;
    color: var(--primary-color);
    font-size: 39px;
    border-radius: 50%;
    /* width: 16px; */
    height: 29px;
    text-align: center;
    /* line-height: 28px; */
    margin-right: 9px;
    cursor: pointer;
    user-select: none;
    margin-top: -23px;
}

.lpr-amount-container .lpr-plus {
    position: relative;
    color: var(--primary-color);
    font-size: 30px;
    border-radius: 50%;
    /* width: 16px; */
    /* height: 16px; */
    text-align: center;
    line-height: 29px;
    margin-left: 5px;
    cursor: pointer;
    user-select: none;
    margin-top: -4px;
}

.lpr-amount-container .lpr-value {
    position: relative;
    /* font-size: 15px; */
    /* border-radius: 6px; */
    /* padding: 11px 8px 8px; */
    /* height: 17px; */
    /* line-height: 16px; */
    /* margin-top: -3px; */
    /* font-family: titlefont; */
    min-width: 50px;
    /* text-align: end; */
    color: #000000;
    font-family: inherit;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 12px;
    /* padding-right: 0; */
    /* padding-left: 0; */
    /* line-height: 6px; */
}

.lpr-amount-container .disable-btn {
    cursor: default
}

.kangaroo-loyalty-points .lp-redeemable-amount.disabled .lpr-minus {
    display: none
}

.kangaroo-loyalty-points .lp-redeemable-amount.disabled .lpr-plus {
    display: none
}

.kangaroo-loyalty-points .lp-points-container.disabled .input .check {
    display: none
}

.kangaroo-loyalty-points .lp-points-container.disabled .input .label {
    left: 0
}

.loyalty-popup h2.l-title {
    font-size: 28px;
    font-family: titlefont;
    font-weight: normal;
    position: relative;
    display: block;
    color: #f5a71d;
    text-align: center;
    margin-top: 18px;
    line-height: 27px;
    width: 255px;
    margin-left: auto;
    margin-right: auto
}

.loyalty-popup .l-description {
    position: relative;
    display: block;
    margin-right: auto;
    margin-left: auto;
    text-align: center
}

.loyalty-popup .loyalty-w {
    background-image: url("../../config/images/loyalty-bg.png")
}

.loyalty-popup p.l-details {
    font-size: 15px;
    color: #8c532e;
    font-weight: 600;
    line-height: 16px;
    margin-top: 8px
}

.loyalty-popup p.l-details img {
    position: relative;
    display: block;
    margin: 11px auto 15px;
    width: 33px
}

.loyalty-sub-logo img {
    width: 65px;
    margin-top: 13px
}

.loyalty-sub-logo {
    text-align: center
}

.loyalty-popup {
    background-position: center bottom;
    min-height: 100vh;
    background-image: url("../../config/images/loyalty-bg.png");
    position: relative;
    display: block;
    background-attachment: unset
}

.loyalty-popup .loyalty-header {
    position: relative;
    display: block;
    height: 100px;
    background-color: #ed7800;
    background-image: url("../../config/images/checkout-loyalty-crown.png");
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: right center
}

.loyalty-popup .loyalty-header .l-header-text {
    vertical-align: middle;
    font-size: 35px;
    font-family: titlefont;
    color: #fff;
    padding-left: 33px;
    padding-top: 33px;
    text-align: left
}

.loyalty-popup .loyalty-logo img {
    width: 171px;
    margin-top: 26px
}

.loyalty-popup .l-footer {
    position: absolute
}

@media(max-width:360px) {
    .loyalty-popup h2.l-title {
        padding-left: 0;
        padding-right: 0
    }

    .loyalty-popup .loyalty-logo img {
        width: 160px;
        margin-top: 21px
    }

    .loyalty-popup h2.l-title {
        margin-top: 13px
    }
}

@keyframes bounce {

    0%,
    20%,
    53%,
    80%,
    100% {
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        transform: translate3d(0px, 0px, 0px)
    }

    40%,
    43% {
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        transform: translate3d(0px, -30px, 0px)
    }

    70% {
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        transform: translate3d(0px, -15px, 0px)
    }

    90% {
        transform: translate3d(0px, -4px, 0px)
    }
}

.bounce {
    animation-name: bounce;
    transform-origin: center bottom
}

.checkoutID .totalPrice::before {
    content: attr(data-text);
    text-transform: uppercase;
    font-family: textfont;
    position: absolute;
    left: 0
}

.rtl .checkoutID .totalPrice::before {
    left: auto!important;
    right: 0;
    font-family: inherit;
}

.kangaroo-loyalty-points .totalPrice::before {
    content: "SUBTOTAL";
}

.subTotalBox .totalPrice {
    text-align: right;
    font-size: 14px
}

.orderdetails .subTotalBox .totalPrice {
    text-align: center;
    margin-top: -9px !important;
    font-size: 24px !important;
    margin-bottom: 4px;
}

.orderdetails .subTotalBox .totalPrice.inusd {
    opacity: 0.3;
    /* margin-top: -35px !Important; */
}

.kangaroo-loyalty-points {
    position: relative;
    margin-bottom: 16px;
}

.kangaroo-loyalty-points .wrap {
    position: relative;
    display: block;
    width: 100% !important
}

.kangaroo-loyalty-points .wrap .totalPrice {
    margin-top: -3px
}

.kangaroo-loyalty-points .loggedin .totalPrice::before {
    content: "SUB TOTAL"
}

.loading-opacity {
    opacity: .3;
    transition: opacity 1s ease-in-out 0s
}

@media(max-width:1300px) and (min-width:769px) {
    .loyalty-w {
        width: calc(100% - 360px);
        margin-right: 0
    }
}

@media(min-width:769px) {

    #loyaltyDetailsModalID.loyalty-details .loyalty-w,
    #loyaltyMoreDetailsModalID.loyalty-details .loyalty-w {
        min-height: 510px;
        max-height: 510px;
        height: auto;
        overflow-y: auto
    }
}

#updateRewardsInfoId .label {
    opacity: .4;
    right: 10px;
    display: block !important
}

.loyalty-w.lvl1 li.lvl-1 {
    opacity: 1
}

.loyalty-w.lvl2 li.lvl-1,
.loyalty-w.lvl2 li.lvl-2 {
    opacity: 1
}

.loyalty-w.lvl3 li.lvl-1,
.loyalty-w.lvl3 li.lvl-2,
.loyalty-w.lvl3 li.lvl-3 {
    opacity: 1
}

.loyalty-w.lvl4 li.lvl-1,
.loyalty-w.lvl4 li.lvl-2,
.loyalty-w.lvl4 li.lvl-3,
.loyalty-w.lvl4 li.lvl-4 {
    opacity: 1
}

div#loyaltyDetailsModalID {
    box-shadow: none
}

.referrals-section {
    position: relative;
    padding-top: 45px;
    background-color: #fff
}

.cordova .referrals-section {
    padding-top: 90px
}

.referrals-section .rf-top-part {
    position: relative;
    display: block;
    border-bottom: 1px solid #ddd;
    padding: 0 20px 75px;
    text-align: center
}

.referrals-section .rf-top-part .rf-icon-container {
    font-size: 80px;
    color: var(--primary-color);
    position: relative;
    display: block
}

.referrals-section .rf-top-part .rf-sub-title-container {
    position: relative;
    display: block;
    font-weight: bold;
    font-size: 19px;
    color: #000;
    margin-bottom: 10px;
    font-family: titlefont
}

.referrals-section .rf-top-part .rf-description-container {
    position: relative;
    display: block;
    color: #777;
    font-size: 13px;
    margin-bottom: 35px;
    line-height: 21px;
    padding-left: 15px;
    padding-right: 15px
}

.referrals-section .rf-top-part .rf-buttons-container {
    position: relative;
    display: block
}

.referrals-section .rf-top-part .rf-buttons-container .rf-btn {
    position: relative;
    display: inline-block;
    width: 140px;
    height: 40px;
    border: 1px solid var(--primary-color);
    text-align: center;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: bold;
    /* padding-top: 4px; */
    border-radius: 5px;
    cursor: pointer;
    vertical-align: top;
    line-height: 40px;
}

.rtl .referrals-section .rf-top-part .rf-buttons-container rf-copy-btn {
    padding-top: 4px;
    padding-bottom: 6px
}

.referrals-section .rf-top-part .rf-buttons-container .rf-share-btn {
    margin-right: 15px;
    color: #fff;
    background-color: var(--primary-color);
    padding-top: 0;
    height: 40px;
}

.referrals-section .rf-top-part .rf-buttons-container .rf-share-btn .rf-share-inner-btn {
    position: relative;
    display: block;
    line-height: 40px;
}

.referrals-section .rf-top-part .rf-buttons-container .rf-copy-btn {
    color: var(--primary-color);
    background-color: #fff;
}

.referrals-section .rf-top-part .rf-buttons-container .rf-copy-btn::before {
    display: none;
    position: absolute;
    z-index: 1000001;
    height: 5px;
    color: rgba(0, 0, 0, 0.8);
    pointer-events: none;
    content: "";
    top: calc(100% - 1px);
    right: calc(50% - 5px);
    clear: both;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #000
}

.referrals-section .rf-top-part .rf-buttons-container .rf-copy-btn::after {
    display: none;
    position: absolute;
    font-size: 12px;
    z-index: 1000000;
    padding: 5px 8px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    text-shadow: none;
    text-transform: none;
    letter-spacing: normal;
    overflow-wrap: break-word;
    white-space: pre;
    pointer-events: none;
    content: attr(aria-label);
    background: rgba(0, 0, 0, 0.8);
    border-radius: 3px;
    -webkit-font-smoothing: subpixel-antialiased;
    top: 110%;
    right: 50%;
    margin-top: 5px;
    transform: translateX(50%);
    font-weight: normal
}

.referrals-section .rf-top-part .rf-buttons-container .rf-copy-btn.tooltipped::before {
    display: inline-block;
    text-decoration: none
}

.referrals-section .rf-top-part .rf-buttons-container .rf-copy-btn.tooltipped::after {
    display: block
}

.referrals-section .rf-top-part .rf-sharing-options {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    transition: opacity .5s linear 0s;
    width: 190px;
    left: -25px;
    top: 52px;
    background-color: #fff;
    border-radius: 4px
}

.referrals-section .rf-top-part .rf-sharing-options.show {
    visibility: visible;
    opacity: 1;
    transition: opacity .5s linear 0s
}

.referrals-section .rf-top-part .rf-sharing-options::before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    left: calc(50% - 7px);
    top: -7px;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #fff;
    clear: both
}

.referrals-section .rf-bottom-part {
    position: relative;
    display: block;
    background-color: #fff
}

.referrals-section .rf-bottom-part .rf-statistics-container {
    position: relative;
    display: block;
    padding-top: 28px;
    text-align: center;
    padding-bottom: 60px
}

.referrals-section .rf-bottom-part .rf-statistics-container .rf-joined-container {
    position: relative;
    display: inline-block;
    margin-right: 56px
}

.referrals-section .rf-bottom-part .rf-statistics-container .rf-ordered-container {
    position: relative;
    display: inline-block
}

.referrals-section .rf-bottom-part .rf-statistics-container .rf-statistics-number {
    position: relative;
    display: block;
    color: var(--primary-color);
    font-size: 50px;
    font-weight: bold
}

.referrals-section .rf-bottom-part .rf-statistics-container .rf-statistics-title {
    position: relative;
    display: block;
    color: #999;
    font-size: 10px;
    text-transform: uppercase
}

.rtl .referrals-section .rf-bottom-part .rf-statistics-container .rf-statistics-title {
    font-size: 12px
}

.referrals-section .rf-bottom-part .rf-vouchers-container {
    position: relative;
    display: block;
    padding-left: 10px;
    white-space: nowrap;
    padding-bottom: 15px;
    width: calc(100% - 15px);
    overflow-x: scroll
}

.referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher {
    position: relative;
    display: inline-block;
    width: 211px;
    height: 93px;
    border: 1px solid var(--primary-color);
    border-radius: 5px;
    padding: 10px 10px 14px;
    white-space: initial;
    margin-right: 15px;
    cursor: pointer
}

.referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher .rf-voucher-button-container .rf-voucher-button {
    position: relative;
    display: none;
    width: 87px;
    height: 16px;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: bold;
    border-radius: 2px;
    text-align: center;
    padding-top: 3px
}

.referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher .rf-voucher-button-container .rf-voucher-locked {
    border: 1px dotted #c6c6c6;
    color: #c6c6c6
}

.referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher .rf-voucher-button-container .rf-voucher-claim {
    display: block;
    border: 1px solid var(--primary-color);
    color: #fff;
    background-color: var(--primary-color)
}

.referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher .rf-voucher-title {
    position: relative;
    display: block;
    color: #878787;
    font-size: 10px;
    text-transform: uppercase;
    padding-top: 5px
}

.referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher .rf-voucher-description {
    position: relative;
    display: block;
    color: #444;
    font-size: 14px;
    text-transform: uppercase;
    padding-top: 17px;
    font-weight: bold
}

.referrals-share-section {
    position: relative;
    display: block;
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 150px;
    text-align: center
}

.referrals-share-section .rfs-name {
    position: relative;
    display: block;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 18px;
    color: #000;
    margin-bottom: 7px
}

.referrals-share-section .rfs-sub-name {
    position: relative;
    display: block;
    color: #444;
    font-size: 14px
}

.referrals-share-section .rfs-icon-container {
    margin: 65px auto;
    position: relative;
    display: block;
    width: 190px
}

.referrals-share-section .rfs-description-container {
    position: relative;
    display: block;
    color: #444;
    font-size: 14px;
    margin-bottom: 35px
}

.referrals-share-section .rfs-btn {
    position: relative;
    display: inline-block;
    width: 212px;
    height: 30px;
    border: 1px solid var(--primary-color);
    background-color: var(--primary-color);
    text-align: center;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: bold;
    padding-top: 10px;
    border-radius: 5px;
    cursor: pointer;
    color: #fff
}

@media(max-width:768px) {
    body.referrals {
        height: calc(100vh - 143px);
        min-height: calc(100vh - 143px);
        background-color: #fff
    }

    body.referrals #wrapper {
        /* margin-top: 72px; */
    }
}

@media(min-width:769px) {
    .referrals-section .rf-bottom-part .rf-vouchers-container {
        white-space: unset;
        overflow-x: unset
    }

    .referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher {
        margin-bottom: 15px
    }

    .referrals-section .rf-top-part .rf-buttons-container .rf-btn {
        cursor: pointer
    }

    .referrals-section .rf-top-part .rf-buttons-container .rf-btn:hover {
        filter: brightness(1.1)
    }

    .referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher .rf-voucher-button-container .rf-voucher-button {
        cursor: default
    }

    .referrals-section .rf-bottom-part .rf-vouchers-container .rf-voucher .rf-voucher-button-container .rf-voucher-claim {
        cursor: pointer
    }
}

.resp-sharing-button__link,
.resp-sharing-button__icon {
    display: inline-block
}

.resp-sharing-button__link {
    text-decoration: none;
    color: #fff;
    margin: .5em
}

.resp-sharing-button {
    border-radius: 5px;
    transition: all 25ms ease-out 0s;
    padding: .5em .75em;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
}

.resp-sharing-button__icon {
    stroke: #fff;
    fill: none
}

.resp-sharing-button__icon--solid,
.resp-sharing-button__icon--solidcircle {
    fill: #fff;
    stroke: none
}

.resp-sharing-button__icon .zmdi::before {
    width: 17px;
    height: 22px;
    font-size: 20px
}

.resp-sharing-button__icon .zmdi-facebook::before {
    content: "\F343" !important;
    background: none !important
}

.resp-sharing-button__icon .zmdi-twitter::before {
    content: "\F360" !important;
    background: none !important
}

.resp-sharing-button--twitter {
    background-color: #55acee
}

.resp-sharing-button--twitter:hover {
    background-color: #2795e9
}

.resp-sharing-button--facebook {
    background-color: #3b5998
}

.resp-sharing-button--facebook:hover {
    background-color: #2d4373
}

.resp-sharing-button--facebook {
    background-color: #3b5998;
    border-color: #3b5998
}

.resp-sharing-button--facebook:hover,
.resp-sharing-button--facebook:active {
    background-color: #2d4373;
    border-color: #2d4373
}

.resp-sharing-button--twitter {
    background-color: #55acee;
    border-color: #55acee
}

.resp-sharing-button--twitter:hover,
.resp-sharing-button--twitter:active {
    background-color: #2795e9;
    border-color: #2795e9
}

.resp-sharing-button--email {
    background-color: #777;
    border-color: #777
}

.resp-sharing-button--email:hover,
.resp-sharing-button--email:active {
    background-color: #5e5e5e;
    border-color: #5e5e5e
}

@media(max-width:768px) {
    .referrals-section .rf-top-part .rf-sharing-options {
        display: none
    }
}

.ref-button {
    border: 1px dashed var(--primary-color);
    width: calc(100% - 44px);
    margin: 12px auto auto;
    padding: 7px 7px 7px 56px;
    border-radius: 5px;
    min-height: 45px;
    box-sizing: border-box;
    position: relative;
    line-height: 29px;
    font-size: 12px;
    text-transform: uppercase;
    /* font-family: textfont; */
    font-weight: bold;
    color: #444;
    letter-spacing: normal
}

.rtl .ref-button {
    text-align: right;
    padding-right: 12px;
    margin-left: auto;
    margin-right: 19px;
    direction: rtl;
    padding: 7px 56px 7px 7px;
}

.rtl .ref-button * {
}

.ref-button::before {
    content: "\F208";
    font-family: Material-Design-Iconic-Font;
    position: absolute;
    left: 10px;
    color: var(--primary-color);
    font-size: 32px;
    font-weight: inherit
}

.rtl .ref-button::before {position: absolute;right: 11px;}

#addressFormId .error-container .error {
    bottom: 0;
    position: relative;
    display: none;
    padding-bottom: 8px;
    font-size: 13px;
    color: #ee2e22 !important
}

#addressFormId .wrap {
    box-sizing: border-box
}

#AddAddressModalID.no-map.no-shipping-countries #addressFormId .wrap {
    /* height: 325px; */
}

#addressFormId .googleMap {
    margin-top: 0
}

#addressFormId .inputWrap {
    display: inline-block;
    width: 100%
}

.inputWrap.phonead {
    display: none !important
}

.small-inputWrap {
    position: relative;
    display: flex
}

.small-inputWrap.bldg .inputWrap {
    margin-left: 0;
    margin-right: 0 !important
}

.delivered-informative-tab {
    position: relative;
    display: block;
    width: calc(100% - 100px);
    height: 30px;
    line-height: 30px;
    background: #c4c4c4;
    color: #fff;
    padding: 16px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: calc(50vh - 60px);
    font-size: 17px;
    font-family: Roboto, sans-serif
}

.delivered-informative-tab.loading {
    background-color: #3e9459 !important
}

@media(max-width:768px) {
    div#AddAddressModalID {
        max-width: 631px
    }

    .home-collection.layout2 .gITems ul {
        width: 100vw !important;
        max-width: 100vw !important
    }
}

@media(max-width:768px) {
    div#AddAddressModalID {
        max-width: 10000px
    }

    #addressFormId .wrap {
        display: flex;
        flex-flow: column wrap;
        box-sizing: border-box;
        height: auto !important
    }

    #addressFormId .inputWrap {
        margin-right: 0;
        width: 100%
    }

    #addressFormId .small-inputWrap {
        width: 100%
    }

    #addressFormId .googleMap {
        max-width: 100%;
        width: 100%
    }
}

.small-inputWrap .inputWrap {
    display: flex;
    width: 100% !important
}

#addressFormId .small-inputWrap .inputWrap:first-child {
    display: inline-block;
    flex-shrink: 2;
    width: 100%;
    margin-right: 5px
}

.small-inputWrap.bldg .inputWrap:first-child {
    margin-right: 5px !important
}

.small-inputWrap.bldg .inputWrap:nth-child(2) {
    flex-shrink: 1;
    max-width: 92px;
    margin-right: 5px !important
}

.small-inputWrap.bldg .inputWrap:last-child {
    max-width: 62px;
    flex-shrink: 1 !important
}

#addressFormId .small-inputWrap .inputWrap:last-child {
    display: inline-block;
    flex-shrink: 4;
    width: 100%;
    margin-right: 0
}

#registerFormID .small-inputWrap .inputWrap:first-child {
    display: inline-block;
    flex-shrink: 2;
    width: 100%;
    margin-right: 0
}

#registerFormID .small-inputWrap .inputWrap:last-child {
    display: inline-block;
    flex-shrink: 2;
    margin-left: 5px;
    width: 100%;
    margin-right: 0
}

.rtl #registerFormID .small-inputWrap .inputWrap:last-child {
    margin-left: 0px;
    margin-right: 5px;
}

.receipt-loyalty-earned {
    position: relative;
    display: block;
    text-align: center;
    font-size: 13px;
    margin-bottom: 2px;
    /* position: fixed; */
    /* bottom: 312px; */
    width: 100%;
    text-transform: capitalize;
    font-weight: bold;
    margin-top: 50px;
}

.receipt-loyalty-earned:before {
    content: '\f005';
    font-weight: 900;
    font-family: 'Font Awesome 5 Free';
    color: #ccc;
    display: block;
    margin-bottom: 13px;
    font-size: 27px;
}

.orderdetails .myBagModule .genBtn {
    display: none
}

.listing-nutrition-facts-wrapper {
    position: relative;
    display: flex;
    margin-top: 8px;
    /* justify-content: space-between; */
    align-items: center;
    /* margin-left: -5px; */
    margin-bottom: 8px;
}

.customizedID .listing-nutrition-facts-wrapper {
    position: relative;
    display: flex;
    margin-top: 8px;
    justify-content: center;
    align-items: center;
    margin-bottom: 8px
}

.listing-nutrition-facts-wrapper .ingredients-container {
    position: relative;
    display: flex !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    min-width: 0 !important;
    overflow: hidden;
}

.listing-nutrition-facts-wrapper .ingredients-container .ingredient-item {
    position: relative;
    width: 22px;
    height: 22px;
    margin-right: 5px;
    list-style: none
}

.listing-nutrition-facts-wrapper .ingredients-container .ingredient-item img {
    width: 22px
}

.listing-nutrition-facts-wrapper .calories-fact {
    position: relative;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    /* margin-top: 2px; */
    color: var(--secondary-color);
}

.popup-calories-fact {
    display: none
}

.listing-macronutrients-wrapper {
    position: relative;
    display: flex;
    margin-top: 34px;
    justify-content: center;
    align-items: center;
    margin-bottom: 39px;
}

.listing-macronutrients-wrapper .macronutrients-container {
    position: relative;
    display: flex !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    min-width: 0 !important
}

.listing-macronutrients-wrapper .macronutrients-container .macronutrients-item {
    position: relative;
    margin-right: 11px;
    list-style: none;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
}

.listing-macronutrients-wrapper .macronutrients-container .macronutrients-item:last-child {
    margin-right: 0
}

.listing-macronutrients-wrapper .macronutrients-container .macronutrients-item .macronutrients-item-info {
    position: relative;
    display: block;
    border-radius: 100%;
    border: 2px solid var(--primary-color);
    width: 37px;
    height: 37px;
    line-height: 37px;
    font-size: 11px;
    margin-bottom: 7px;
    text-align: center;
    padding: 2px;
}

.listing-macronutrients-wrapper .macronutrients-container .macronutrients-item .macronutrients-item-title {
    font-weight: bold;
    font-size: 14px;
    color: #444;
    position: relative;
    display: block
}

.addtobagbtn::before {
    content: attr(data-nbofcalories);
    position: fixed;
    left: 22px;
    font-weight: 700;
    opacity: 1;
    color: #fff;
    height: 58px;
    line-height: 59px;
    font-size: 13px;
    z-index: 3;
    letter-spacing: 0;
    transition: all .5s linear 0s;
    transform: translateY(100px);
}

.addtobagbtn.show::before {
    transition: all 1s linear .5s;
    transform: translateY(0px);
    pointer-events: none;
    opacity: 1 !important;
}

.customizedID .listing-nutrition-facts-wrapper .ingredients-container .ingredient-item {
    width: 24px;
    height: 24px;
    filter: none;
}

.customizedID .listing-nutrition-facts-wrapper .ingredients-container .ingredient-item img {
    width: 24px
}

#ingredientsModalID {
    height: 340px;
    border-radius: 4%;
    overflow: visible;
    z-index: 1000;
    top: 50%;
    left: 50%;
    width: 330px !important;
    transform: translate3d(-50%, -50%, 0px) !important
}

#ingredientsModalID .parts {
    height: auto;
    border-radius: 12px;
    min-height: 237px !important
}

#ingredientsModalID .parts .part {
    padding: 0
}

#ingredientsModalID .parts .part .wrap {
    padding-top: 10px
}

#ingredientsModalID .product-title {
    position: relative;
    display: block;
    font-weight: bold;
    font-size: 19px;
    margin-bottom: 20px
}

#ingredientsModalID .product-sub-title {
    position: relative;
    display: block;
    margin-top: 25px;
    font-size: 14px;
    margin-bottom: 10px;
    font-weight: bold
}

#ingredientsModalID .close-btn {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    text-align: center;
    height: 37px;
    border-top: 1px solid #efefef;
    padding-top: 18px;
    color: var(--primary-color);
    text-transform: uppercase;
    cursor: pointer;
    font-size: 16px;
    font-weight: bold
}

.ingredients-listing-container {
    position: relative;
    display: flex;
    justify-content: flex-start
}

.ingredients-listing-container .ingredient-item {
    position: relative;
    display: flex;
    text-align: center;
    flex-direction: column;
    align-items: center;
    margin-right: 16px
}

.ingredients-listing-container .ingredient-item img {
    width: 45px;
    position: relative;
    display: block
}

.ingredients-listing-container .ingredient-item span {
    position: relative;
    display: block;
    font-size: 11px;
    margin-top: 5px
}

.rtl.market.large-menu-img .itemsList .itemGrid .descBlock .title {
    text-align: right
}

.rtl.market.large-menu-img .itemsList .itemGrid .descBlock .title {
    text-align: right
}

.rtl.market .customizedID .data .title {
    text-align: right
}

.rtl.market .customizedID .data .sku {
    text-align: right;
    margin-right: 0px;
    margin-left: auto;
}

.rtl.market .customizedID.largetxt .data .pwrap {
    text-align: right
}

.rtl.market .noCustomization.largetxt .cont .description {
    text-align: right;
    direction: rtl
}

.column_cust .formPart .input.disabled {
    opacity: .5
}

.column_cust .formPart .input.disabled.checked {
    opacity: 1
}

span.caladd {
    float: right;
    padding-left: 15px;
    font-size: 12px !important;
    color: #333 !important
}

span.caladd {
    float: right;
    padding-left: 15px;
    display: none;
    color: #333 !important
}

.input.checked span.caladd {
    display: block
}

.retail .input.checked span.caladd {
    display: none
}

body.show-inner-popup #popupID::after {
    content: " ";
    width: 100%;
    height: 100vh;
    position: fixed;
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.376);
    z-index: 9
}

body.show-inner-popup {
    overflow: hidden !important
}

body.show-inner-popup::after {
    content: " ";
    width: 100%;
    height: 96px;
    position: fixed;
    left: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.376);
    z-index: 10000
}

body.show-inner-popup #customizedModalID {
    max-height: calc(100vh - 54px);
    overflow: hidden
}

body.show-inner-popup #popupID {
    overflow: hidden
}

#ingredientsModalID {
    transform: translate3d(-50%, -50%, 0px) !important
}

body.show-inner-popup::after {
    display: none
}

body.show-inner-popup {
    max-height: calc(100vh - 5px)
}

.ingredients-listing-container .ingredient-item img {
    width: 40px
}

.ingredients-listing-container .ingredient-item span {
    font-size: 10px
}

#ingredientsModalID .product-title {
    font-size: 17px
}

#ingredientsModalID .product-sub-title {
    position: relative;
    display: block;
    margin-top: 18px;
    font-size: 12px;
    margin-bottom: 8px;
    font-weight: bold
}

.menuontop .MenuParts .bag {
    display: none
}

.menuontop .MenuParts .bag.minicv {
    display: block;
    margin-right: -11px
}

#ingredientsModalID .parts .part .wrap {
    padding-top: 0
}

#ingredientsModalID .parts {
    min-height: 250px !important
}

#ingredientsModalID .close-btn {
    padding-top: 20px;
    font-size: 14px
}

.productpage .meta .price {
    box-shadow: none;
    padding-left: 0px;
    font-size: 16px;
    margin-top: 11px;
    margin-bottom: 15px;
    display: inline-block;
    margin-top: 15px;
    height: 33px;
    line-height: 33px;
}

.productpage .relations .title {
    font-family: titlefont;
    font-size: 31px;
    font-weight: 600 !important
}

.productpage .meta .title {
    /* font-family: 'Crimson Text'; */
    font-size: 37px;
    /* margin-bottom: -4px; */
    font-weight: 600;
    line-height: 38px;
}

.menuontop .deskmenu li a span {
    font-weight: bold;
    display: inline-block;
    position: relative;
    font-size: 15px !important
}

.menuontop .titleAndLegend .title {
    font-family: titlefont, serif;
    /* text-transform: uppercase; */
    font-size: 35px;
    font-weight: normal !important
}

.menuontop .d-w,
.menuontop .priceWrap {
    /* margin-left: -8px; */
}

.menuontop .titleAndLegend .title {
    font-family: titlefont, serif;
    /* text-transform: uppercase; */
    font-size: 35px;
    font-weight: normal !important;
    margin-bottom: 20px;
}

.menuontop .d-w,
.menuontop .priceWrap {
    /* margin-left: -9px; */
}

.menuontop main.content {
    background-color: #fff;
    width: 100%;
}

.relationsinline .itemGrid .wrap {
    height: 100%
}

p.instagram_username::before {
    background-image: url("../images/instagram.png");
    width: 11px;
    height: 11px;
    display: inline-block;
    background-size: cover;
    filter: invert(1);
    padding: 7px;
    position: absolute;
    left: -42px;
    top: 5px;
    content: "" !important
}

p.instagram_username {
    position: relative;
    display: inline-block
}

p.instagram_username a {
    text-decoration: none;
    color: #333;
    border-bottom: 1px dotted #ccc
}

div#instagramfeed {
    background-color: #f6f6f6;
    display: none;
}

img.instagram_profile_image {
    display: none
}

.instagram_profile {
    padding-top: 39px;
    padding-bottom: 32px;
    font-size: 24px
}

.subPage #instagramfeed {
    display: none
}

.instagram_gallery {
    width: calc(100% - 600px);
    margin: auto
}

.menuontop .instagram_gallery {
    max-width: 1200px;
    margin: auto
}

.price.nearadd {
    display: none
}

.market.productpage .price.nearadd {
    width: 181px;
    border: 1px solid #eee;
    height: 49px;
    margin-right: 10px;
    border-radius: 5px;
}

.classicproduct .price.nearadd {
    position: relative;
    display: inline-block;
    width: 138px;
    height: 48px;
    background: #fff;
    border: 1px solid var(--primary-color);
    margin-top: 0;
    flex-shrink: 0;
    text-align: center
}

.price.nearadd.price-lastitem::before {
    content: attr(data-last-item);
    text-align: center;
    line-height: 46px;
    text-transform: uppercase;
    font-size: 13px;
    font-weight: bold
}

.price.nearadd.price-lastitem .tinyselect {
    display: none
}

.price.nearadd .tinyselect {
    display: block;
    margin-top: 11px;
    left: 8px
}

.price.nearadd .tinyselect .fieldPlus {
    background-color: transparent
}

.genbtnw {
    display: flex;
    width: 100%
}

.market .genbtnw {
    /* display: none; */
}

.relationsinline li.itemGrid {
    height: 64px !important;
    display: inline-flex;
    width: 100px !important;
}

.productpage .relationsinline.ng-scope {
    min-height: 170px
}

.retail .relationsinline.exist {
    min-height: 116px !important;
    display: block !important;
}

.productpage .relationsinline:not(:has(*)) {
    display: none;
}

.signupform {
    /* margin-top: -19px; */
}

.signupform .normalForm {
    margin-top: 0px;
}

.fnb .signupform .normalForm {
    margin-top: 0px;
}

.signupform .wrap {
    display: flex;
    flex-wrap: wrap;
    margin: 0 !important;
    width: 100% !important
}

.signupform .genBtn {
    background-color: #fff;
    width: 100%;
    border-radius: 0;
    height: 173px;
    color: #000;
    text-transform: lowercase;
    letter-spacing: normal;
    padding-top: 58px
}

.signupform .genBtn::before {
    visibility: visible;
    content: "+";
    position: absolute;
    background-color: #000;
    width: 40px;
    height: 40px;
    text-align: center;
    border-radius: 100%;
    font-size: 22px;
    line-height: 40px;
    box-sizing: border-box;
    top: 55px;
    color: #fff;
    padding-left: 1px !important;
    font-family: arial, sans-serif;
    font-weight: bold;
}

.signupform .genBtn:hover::before {
    background-color: var(--primary-color)
}

.loginbut {
    background-color: #fff;
    width: 150px;
    height: 43px;
    line-height: 43px;
    position: relative;
    padding-left: 42px;
    padding-right: 12px;
    border-radius: 6px;
    margin-bottom: 23px;
    cursor: pointer
}

.loginbut i {
    margin-right: 10px;
    font-size: 25px;
    line-height: 44px;
    position: absolute;
    left: 13px
}

.loginor {
    color: #333;
    padding-bottom: 12px;
    text-align: right;
    font-size: 15px;
    margin-top: -62px;
    position: absolute;
    right: 3px;
}

.retail .loginor {
    margin-top: -64px;
}

.fnb .loginor {
    /* margin-top: -69px; */
}

.right.rBox .loginor {
    position: relative;
    margin-top: 0px;
    display: none;
}

.loginor span:last-child {
    color: var(--primary-color);
    margin-left: 7px;
    font-weight: bold;
    border-bottom: 1px dashed;
    padding-bottom: 6px;
    cursor: pointer;
}

.rtl .loginor span:last-child {
    margin-right: 7px;
}

@media(min-width:1600px) and (max-width:1800px) {
    .menuontop .checkoutID .content {
        margin: 56px auto auto;
        width: calc(100% - 602px) !important
    }
}

.relationsinline .related-items {
    display: none
}

.relationsinline .related-items[data-group~="Colors"],
.relationsinline .related-items[data-group~="Color"],
.relationsinline .related-items[data-group~="colors"],
.relationsinline .related-items[data-group~="color"] {
    display: block;
    background-color:transparent
}

.relationsinline .related-items {
    display: none
}

.relations .related-items[data-group~="Colors"],
.relations .related-items[data-group~="Color"],
.relations .related-items[data-group~="colors"],
.relation .related-items[data-group~="color"] {
    display: none;
}

.legacyproduct .relationsinline {
    display: none !important;
}

.reviewbagbut {
    display: none
}

.reviewbagbut {
    position: absolute;
    bottom: 79px;
    text-align: center;
    width: auto;
    font-size: 15px;
    border-bottom: 1px dotted #666;
    left: 50%;
    transform: translateX(-50%);
    height: 23px;
    cursor: pointer;
    display: block
}

.reviewbagbut {
    position: absolute;
    top: 23px;
    border-bottom: 1px solid #cacaca;
    text-decoration: none;
    padding-bottom: 8px;
    width: auto;
    overflow: visible;
    display: inline;
    color: #666;
    font-size: 11px;
    text-transform: uppercase;
    height: 14px;
    transform: none;
    left: 13px;
    background-color: #fff;
    padding-left: 7px;
    padding-right: 9px;
    border-radius: 9px;
    line-height: 21px;
    text-align: center;
    font-family: inherit;
    min-width: 91px;
}

.market .reviewbagbut {
    top: 30px;
}

.orderdetails .reviewbagbut {
    display: none
}

.checkoutID .reviewbagbut {
    bottom: 20px;
}

.reviewbag .reviewbagbut {
    display: none !important
}

.continueshoppingbut {
    position: absolute;
    right: 300px;
    width: 246px;
    height: 55px;
    background-color: #fff;
    border: 1px solid #ddd;
    bottom: 8px;
    border-radius: 6px;
    text-align: center;
    line-height: 53px;
    cursor: pointer;
    display: none !important
}

.reviewbag .continueshoppingbut {
    display: block !important
}

.password-field .label {
    margin-right: 22px
}

.rtl .password-field .label {
    margin-left: 22px;
    margin-right: 0px;
}

.password-field i.zmdi {
    position: absolute;
    right: 8px;
    cursor: pointer
}

.rtl .password-field i.zmdi {
    left: 8px;
    right: auto;
}

.signupform .password-field i.zmdi {
    right: 18px
}

.rtl .signupform .password-field i.zmdi {
    left: 18px;
    right: auto;
}

h1.metadesc {
    display: none
}

.myAccountPid .whiteBox .boxes .box.removeMap {
    min-height: 202px !important;
}

.whiteBox .boxes.deliverBoxID .box.removeMap .top {
    margin-top: 33px
}

.rtl .whiteBox .boxes.deliverBoxID .box.removeMap .top {
    margin-right: 18px !important;
    text-align: right;
}

input:focus::placeholder {
    color: #f6f6f6 !important
}

.p-t-25 {
    padding-top: 25px;
}

.custom-max.highlighted {
    color: rgba(255, 0, 0, 0.73)
}

.lp-points-container.disabled::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    opacity: .5
}

.lp-redeemable-amount.disabled,
.lp-points-container.disabled {
    pointer-events: none
}

.rd-redeem-wrapper {
    margin-top: 25px
}

.rd-redeem-wrapper .rd-title {
    margin-top: 25px;
    margin-bottom: 0
}

.rd-redeem-wrapper .rd-sub-title {
    display: block;
    font-size: 13px;
    color: #333;
    margin-top: 6px;
    font-family: textfont;
    font-weight: bold
}

.rd-redeem-wrapper .rd-redeem-items {
    position: relative;
    margin-top: 15px;
    display: block;
    flex-direction: row;
    width: 100%;
    overflow: auto;
    padding-bottom: 20px;
    white-space: nowrap
}

.rd-redeem-wrapper .rd-redeem-items .rd-redeem-item {
    position: relative;
    border: 5px solid var(--primary-color);
    border-radius: 10px;
    background-color: #fff;
    width: calc(100% - 115px);
    margin-right: 20px;
    list-style: none;
    display: inline-block;
    max-width: 250px
}

.rd-redeem-wrapper .rd-redeem-items .rd-redeem-item:first-child {
    margin-left: 20px
}

.rd-redeem-wrapper .rd-redeem-items .rd-redeem-item.disabled::after {
    content: "";
    position: absolute;
    left: -5px;
    top: -5px;
    width: calc(100% + 10px);
    height: calc(100% + 10px);
    background-color: rgba(255, 255, 255, 0.463)
}

.rd-redeem-wrapper .rd-redeem-items .rd-redeem-item .rd-redeem-item-title {
    position: relative;
    display: block;
    width: 140px;
    margin: 17px auto 13px;
    font-size: 17px;
    text-transform: uppercase;
    white-space: pre-wrap;
    text-align: center
}

.rd-redeem-wrapper .rd-redeem-items .rd-redeem-item .rd-redeem-item-points {
    position: relative;
    display: block;
    margin-left: auto;
    margin-right: auto;
    color: var(--primary-color);
    text-transform: lowercase;
    font-size: 17px;
    margin-bottom: 10px
}

.rd-redeem-wrapper .rd-redeem-items .rd-redeem-item .rd-redeem-item-btn {
    position: relative;
    display: block;
    cursor: pointer;
    font-size: 15px;
    color: #fff;
    background-color: var(--primary-color);
    margin-left: auto;
    margin-right: auto;
    width: 120px;
    padding: 10px;
    border-radius: 6px;
    margin-bottom: 12px
}

.rd-redeem-wrapper .rd-redeem-items .rd-redeem-item .rd-redeem-item-btn.loading {
    opacity: .4;
    pointer-events: none
}

.rd-title.has-redeem-options {
    margin-top: 18px
}

@media(min-width:769px) {
    .rd-redeem-wrapper .rd-redeem-items {
        overflow: visible;
        white-space: unset
    }

    .rd-redeem-wrapper .rd-redeem-items .rd-redeem-item {
        margin-bottom: 20px
    }

    .rd-redeem-wrapper .rd-redeem-items .rd-redeem-item:first-child {
        margin-left: 0
    }
}

.market.productpage div#customizedModalID {
    /* max-width: 600px; */
    /* top: 153px!IMportant; */
    height: auto;
    padding-left: 15px;
    padding-top: 11px;
}

.market .deskmenu .menu li.colle a {
    font-size: 16px
}

.market .customizedID .backg {
    max-height: 850px;
    width: auto;
}

.market .customizedID.largetxt .backg {
    /* max-height: calc(100vh - 300px); */
    width: 100%;
    object-fit: scale-down;
}



@media(max-width:768px) {
    .cordova .giftcards {
        height: calc(100vh - 131px)
    }

    .cordova .giftcards .content {
        height: calc(100vh - 131px)
    }

    .giftcards {
        min-height: 0;
        height: calc(100vh - 118px)
    }

    .cordova .giftcards .gc-top-part {
        /* height: calc(100vh - 452px) */
    }

    .cordova .giftcards .gc-big-top .gc-top-part {
        /* height: calc(100vh - 398px); */
    }

    .giftcards .gc-top-part .gc-sub-title {
        max-width: 300px;
        line-height: 20px
    }

    .giftcards .gc-top-part .gc-list-wrapper .gc-list-item {
        width: calc(50% - 22px)
    }

    .giftcards .gc-top-part .gc-list-wrapper .gc-list-item.custom-amount-wrapper {
        width: calc(50% - 20px)
    }

    .market.cols3mob .homePid .ymlike .itemGrid {
        width: calc(33vw - 2px) !important
    }
}

.giftcards .gc-payments-wrapper {
    position: fixed;
    bottom: -5000px;
    left: 0;
    width: calc(100% - 30px);
    background-color: #fff;
    padding: 25px 15px 92px;
    box-shadow: #000 0 0 10px -6px;
    z-index: 10;
    transition: bottom .5s ease-out 0s
}

.giftcards .gc-payments-wrapper .gc-close {
    position: absolute;
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 36px;
    height: 36px;
    font-size: 33px;
    left: calc(50% - 18px);
    top: -48px;
    color: #fff;
    text-align: center;
    cursor: pointer
}

.giftcards .gc-payments-wrapper .gc-title {
    text-align: center;
    margin-bottom: 21px;
    color: #4d4d4c;
    font-size: 22px
}

.giftcards .gc-payments-wrapper .gc-payments-items {
    position: relative;
    display: block;
    list-style: none
}

.giftcards .gc-payments-wrapper .gc-payments-items .gc-payments-item {
    position: relative;
    display: block;
    font-size: 15px;
    padding-bottom: 8px;
    padding-top: 8px;
    margin-bottom: 10px;
    border-radius: 4px;
    padding-left: 12px;
    color: #333;
    border: 1px solid var(--primary-color);
    font-weight: bold;
    cursor: pointer
}

.giftcards .gc-shadow {
    position: fixed;
    left: 0;
    top: -50000px;
    width: 100%;
    height: 100vh;
    background: #000;
    z-index: 9;
    opacity: 0;
    transition: opacity 1s ease-out 0s
}

.giftcards .gc-shadow.show {
    top: 0;
    opacity: .8;
    transition: opacity .6s ease-out 0s
}

.giftcards .gc-payments-wrapper.show {
    bottom: 0;
    transition: bottom .6s ease-out 0s
}

.giftcards .gcr-top-part {
    position: relative;
    display: block;
    padding-top: 45px;
    height: calc(100vh - 300px);
    overflow: auto;
    text-align: center
}

.giftcards .gc-title {
    position: relative;
    display: block;
    font-size: 34px;
    font-weight: bold;
    color: #000
}

.rtl .giftcards .gc-title {
    text-align: right;
    padding-right: 15px;
    direction: rtl;
}

.giftcards .gc-top-part {
    position: relative;
    display: block;
    padding-left: 13px;
    padding-top: 70px;
}

.giftcards .gc-big-top .gc-top-part {
    /* height: calc(100vh - 385px); */
}

.rtl .giftcards .gc-big-top .gc-top-part {
    direction: rtl;
}

.giftcards .hosted-session-big-wrapper.gc-big-top .gc-top-part {
    height: calc(100vh - 470px)
}

.giftcards .gc-top-part .gc-sub-title {
    position: relative;
    display: block;
    font-size: 14px;
    color: rgba(119, 119, 119, 0.81);
    margin-top: 5px
}

.rtl .giftcards .gc-top-part .gc-sub-title {
    text-align: right;
    padding-right: 19px;
}

.giftcards .gc-top-part .gc-list-wrapper {
    position: relative;
    list-style: none;
    display: flex;
    margin-top: 12px;
    flex-wrap: wrap;
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item {
    position: relative;
    width: 231px;
    height: 128px;
    border: 1px solid #aaa;
    background-color: #fff;
    margin-right: 13px;
    margin-bottom: 15px;
    border-radius: 10px;
    box-sizing: border-box;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    cursor: pointer;
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item.selected {
    border: 2px solid var(--primary-color)
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-check {
    position: absolute;
    right: 10px;
    height: 15px;
    width: 15px;
    top: 10px
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-check .zmdi {
    position: relative;
    display: block;
    font-size: 21px
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-check .zmdi-circle-o {
    color: #777
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-check .zmdi-check-circle {
    display: none
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item.selected .gc-check .zmdi-circle-o {
    display: none
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item.selected .gc-check .zmdi-check-circle {
    display: block;
    color: var(--primary-color)
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-amount-wrapper {
    position: absolute;
    left: 0px;
    bottom: 10px;
}

.rtl .giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-amount-wrapper {
    right: -1px;
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-custom-amount-title {
    display: none
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-amount-wrapper .gc-custom-amount {
    content: "";
    position: relative;
    display: inline-block;
    height: 23px;
    width: 48px;
    background-color: #ddd;
    vertical-align: middle
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-amount-wrapper .gc-custom-amount input {
    position: relative;
    display: block;
    border: 0;
    height: calc(100% - 4px);
    width: calc(100% - 12px);
    background: transparent;
    font-size: 19px;
    font-weight: bold;
    padding: 2px 6px;
    overflow: hidden;
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item.selected .gc-amount-wrapper .gc-custom-amount {
    background-color: var(--primary-color)
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item .gc-amount-wrapper .gc-amount {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    font-weight: bold;
    line-height: 23px;
    margin-left: 4px
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item.custom-amount-wrapper {
    /* width: 163px; */
    /* height: 96px; */
    background: transparent;
    border: 1px dashed #aaa !important;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item.custom-amount-wrapper .gc-custom-amount-title {
    display: block;
    position: relative;
    font-weight: bold;
    font-size: 16px;
    color: #4a4a4a;
    margin-top: 8px;
    margin-left: 10px;
    max-width: 94px;
    line-height: 16px;
    text-transform: lowercase
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item.custom-amount-wrapper .gc-amount-wrapper {
    left: 10px;
    bottom: 10px;
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item.custom-amount-wrapper .gc-amount-wrapper .gc-amount {
    color: #666
}

.giftcards .gc-top-part .gc-list-wrapper .gc-list-item.custom-amount-wrapper .gc-amount-wrapper .gc-custom-amount {
    height: 33px;
    width: 100px;
    background: #eee;
    min-width: 80px;
}

.giftcards .gc-bottom-part {
    position: relative;
    width: calc(100% - 31px);
    padding-left: 15px;
    padding-right: 15px;
    bottom: 0;
    left: 0;
    background: #fff;
    padding-bottom: 12px;
}

.giftcards .gc-big-top .gc-bottom-part {
    min-height: 250px
}

.giftcards .hosted-session-big-wrapper.gc-big-top .gc-bottom-part {
    min-height: 335px
}

.giftcards .gc-bottom-part .gc-message-wrapper {
    height: 70px;
    border-bottom: 1px solid #efefef;
    margin-bottom: 15px;
}

.giftcards .gc-bottom-part .gc-message-wrapper textarea {
    height: calc(100% - 25px);
    width: 100%;
    border: 0;
    color: #333;
    padding-top: 25px;
    font-size: 13px;
    background: transparent;
}

.giftcards .gc-bottom-part .gc-message-wrapper textarea::placeholder {
    color: #666
}

.giftcards .gc-bottom-part .gc-title {
    margin-bottom: 15px
}

.giftcards .gc-bottom-part .gc-mobile-wrapper {
    position: relative;
    display: block;
    height: 45px;
    background-color: #f6f6f6;
    font-weight: bold;
    border-radius: 4px;
    margin-bottom: 10px;
    border-bottom: 1px solid #ececec;
    max-width: 400px
}

.giftcards .gc-bottom-part .gc-mobile-wrapper .iti {
    position: relative;
    display: block;
    width: calc(100% - 8px);
    height: 100%;
    border: 0;
    background: transparent;
    padding-left: 8px
}

.giftcards .gc-bottom-part .gc-mobile-wrapper .iti label.missing {
    right: 8px
}

.giftcards .gc-bottom-part .gc-mobile-wrapper .iti input {
    position: relative;
    display: block;
    border: 0;
    background-color: transparent;
    width: 100%;
    font-size: 13px;
    top: 15px;
}

.giftcards .gc-bottom-part .gc-email-wrapper {
    position: relative;
    display: block;
    height: 45px;
    background-color: #f6f6f6;
    font-weight: bold;
    border-radius: 4px;
    margin-bottom: 15px;
    border-bottom: 1px solid #ececec;
    max-width: 400px
}

.giftcards .gc-bottom-part .gc-email-wrapper input {
    position: relative;
    display: block;
    width: calc(100% - 30px);
    height: 100%;
    border: 0;
    background: transparent;
    padding-left: 15px;
    padding-right: 15px;
    font-size: 13px
}

.giftcards .gc-bottom-part .gc-button {
    position: relative;
    display: block;
    text-align: center;
    height: 52px;
    background-color: var(--primary-color);
    text-transform: uppercase;
    font-weight: bold;
    font-size: 16px;
    color: #fff;
    padding-top: 0;
    border-radius: 4px;
    border: 0;
    width: 100%;
    cursor: pointer;
    max-width: 400px;
    margin-top: 18px;
    margin-bottom: 30px
}

.giftcards .gc-bottom-part .gc-button.loading {
    opacity: .5;
    pointer-events: none
}

@media(max-width:768px) {
    .cordova .giftcards {
        height: calc(100vh - 131px)
    }

    .cordova .giftcards .content {
        height: calc(100vh - 131px)
    }

    .giftcards {
        min-height: 0;
        height: calc(100vh - 118px)
    }

    .giftcards .gc-top-part {
        /* height: calc(100vh - 452px) */
        padding-top: 19px;
        box-sizing: border-box;
    }

    .cordova .giftcards .gc-big-top .gc-top-part {
        /* height: calc(100vh - 398px); */
    }

    .giftcards .gc-top-part .gc-sub-title {
        max-width: 400px;
        line-height: 18px
    }

    .giftcards .gc-top-part .gc-list-wrapper .gc-list-item {
        width: calc(50% - 15px);
        height: 100px;
    }

    .giftcards .gc-top-part .gc-list-wrapper .gc-list-item.custom-amount-wrapper {
        width: calc(50% - 15px);
    }

    .market.cols3mob .homePid .ymlike .itemGrid {
        width: calc(33vw - 2px) !important
    }
}

.giftcards .gc-payments-wrapper {
    position: fixed;
    bottom: -5000px;
    left: 0;
    width: calc(100% - 30px);
    background-color: #fff;
    padding: 25px 15px 92px;
    box-shadow: #000 0 0 10px -6px;
    z-index: 10;
    transition: bottom .5s ease-out 0s;
    box-sizing: border-box;
}

.giftcards .gc-payments-wrapper .gc-close {
    position: absolute;
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 36px;
    height: 36px;
    font-size: 33px;
    left: calc(50% - 18px);
    top: -48px;
    color: #fff;
    text-align: center;
    cursor: pointer
}

.giftcards .gc-payments-wrapper .gc-title {
    text-align: center;
    margin-bottom: 21px;
    color: #4d4d4c;
    font-size: 22px
}

.giftcards .gc-payments-wrapper .gc-payments-items {
    position: relative;
    display: block;
    list-style: none
}

.giftcards .gc-payments-wrapper .gc-payments-items .gc-payments-item {
    position: relative;
    display: block;
    font-size: 15px;
    padding-bottom: 8px;
    padding-top: 8px;
    margin-bottom: 10px;
    border-radius: 4px;
    padding-left: 12px;
    color: #333;
    border: 1px solid var(--primary-color);
    font-weight: bold;
    cursor: pointer
}

.giftcards .gc-shadow {
    position: fixed;
    left: 0;
    top: -50000px;
    width: 100%;
    height: 100vh;
    background: #000;
    z-index: 9;
    opacity: 0;
    transition: opacity 1s ease-out 0s
}

.giftcards .gc-shadow.show {
    top: 0;
    opacity: .8;
    transition: opacity .6s ease-out 0s
}

.giftcards .gc-payments-wrapper.show {
    bottom: 0;
    transition: bottom .6s ease-out 0s
}

.giftcards .gcr-top-part {
    position: relative;
    display: block;
    padding-top: 45px;
    height: calc(100vh - 300px);
    overflow: auto;
    text-align: center
}

.giftcards .gcr-top-part .gcr-title {
    position: relative;
    display: block;
    font-size: 23px;
    font-weight: bold;
    color: #000;
    width: 190px;
    margin-left: auto;
    margin-right: auto
}

.giftcards .gcr-top-part .gcr-sub-title {
    position: relative;
    display: block;
    font-size: 14px;
    color: rgba(119, 119, 119, 0.81);
    margin-top: 8px;
    width: 210px;
    margin-left: auto;
    margin-right: auto
}

.giftcards .gcr-top-part .gcr-envelope {
    position: absolute;
    display: block;
    width: 209px;
    background-image: url("../images/envelope-back.png");
    height: 190px;
    background-position: center center;
    left: 50%;
    top: calc(50% + 55px);
    transform: translate(-50%, -50%);
}

.giftcards .gcr-top-part .gcr-envelope::after {
    content: "";
    position: absolute;
    width: 209px;
    background-image: url("../images/envelope-front.png");
    height: 106px;
    background-position: center center;
    left: 0;
    bottom: 0;
}

.giftcards .gcr-top-part .gcr-envelope .gcr-item {
    position: absolute;
    width: 161px;
    height: 94px;
    border: 2px solid var(--primary-color);
    background-color: #eee;
    border-radius: 10px;
    left: 50%;
    bottom: 66px;
    transform: translateX(-50%)
}

.giftcards .gcr-top-part .gcr-envelope .gcr-item::before {
    font-family: Material-Design-Iconic-Font;
    content: "\F1BC";
    transform: rotate(90deg);
    position: absolute;
    font-size: 24px;
    top: -14px;
    right: 22px;
    color: var(--primary-color)
}

.giftcards .gcr-top-part .gcr-envelope .gcr-item .gcr-amount-wrapper {
    position: absolute;
    left: -2px;
    top: 55px
}

.giftcards .gcr-top-part .gcr-envelope .gcr-item .gcr-amount-wrapper .gcr-custom-amount {
    position: relative;
    display: inline-block;
    height: 23px;
    width: 50px;
    background-color: var(--primary-color);
    vertical-align: middle
}

.giftcards .gcr-top-part .gcr-envelope .gcr-item .gcr-amount-wrapper .gcr-amount {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    font-size: 17px;
    font-weight: bold;
    line-height: 23px;
    margin-left: 4px;
    color: #666
}

.giftcards .gcr-bottom-part {
    text-align: center;
    position: relative
}

.giftcards .gcr-bottom-part .gcr-sub-title {
    position: relative;
    display: block;
    font-size: 14px;
    color: rgba(119, 119, 119, 0.81);
    margin-top: 8px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 25px;
    padding-right: 25px;
    text-align: center
}

.giftcards .gcr-bottom-part .gcr-buttons-wrapper {
    position: relative;
    display: block;
    margin-top: 22px
}

.giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-button {
    position: relative;
    display: inline-block;
    width: 140px;
    height: 30px;
    border: 1px solid var(--primary-color);
    text-align: center;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: bold;
    padding-top: 4px;
    border-radius: 5px;
    cursor: pointer;
    vertical-align: top;
    padding-bottom: 6px
}

.giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-button-copy {
    color: var(--primary-color);
    background-color: #fff;
    padding-top: 9px;
    padding-bottom: 2px
}

.giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-button-copy::before {
    display: none;
    position: absolute;
    z-index: 1000001;
    height: 5px;
    color: rgba(0, 0, 0, 0.8);
    pointer-events: none;
    content: "";
    top: -7px;
    right: calc(50% - 5px);
    clear: both;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #000
}

.giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-button-copy::after {
    display: none;
    position: absolute;
    font-size: 12px;
    z-index: 1000000;
    padding: 5px 8px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    text-shadow: none;
    text-transform: none;
    letter-spacing: normal;
    overflow-wrap: break-word;
    white-space: pre;
    pointer-events: none;
    content: attr(aria-label);
    background: rgba(0, 0, 0, 0.8);
    border-radius: 3px;
    -webkit-font-smoothing: subpixel-antialiased;
    top: -36px;
    right: 50%;
    margin-top: 5px;
    transform: translateX(50%);
    font-weight: normal
}

.giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-button-copy.tooltipped::before {
    display: inline-block;
    text-decoration: none
}

.giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-button-copy.tooltipped::after {
    display: block
}

.giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-button-share {
    margin-right: 15px;
    color: #fff;
    background-color: var(--primary-color);
    padding-top: 0;
    height: 35px
}

.giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-button-share .gcr-share-inner-btn {
    position: relative;
    display: block;
    padding-top: 10px;
    padding-bottom: 10px
}

.giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-sharing-options {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    transition: opacity .5s linear 0s;
    width: 190px;
    left: -25px;
    top: -62px;
    background-color: #fafafa;
    border-radius: 4px
}

.giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-sharing-options.show {
    visibility: visible;
    opacity: 1;
    transition: opacity .5s linear 0s
}

.giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-sharing-options::before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    left: calc(50% - 7px);
    bottom: -7px;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 7px solid #fafafa;
    clear: both
}

.giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-sharing-options .resp-sharing-button__link {
    text-decoration: none;
    color: #fff;
    margin: .5em
}

@media(max-width:768px) {
    .giftcards .gcr-bottom-part .gcr-buttons-wrapper .gcr-sharing-options {
        display: none
    }
}

@media(min-width:769px) {
    .giftcards .gc-payments-wrapper {
        bottom: unset;
        max-width: 400px;
        border-radius: 8px;
        left: 50%;
        padding-bottom: 40px;
        height: auto;
        transform: translate3d(-50%, -50%, 0);
        transition: all 0s ease-out 0s;
        top: 5000px
    }

    .giftcards .gc-payments-wrapper.show {
        top: 50%;
        bottom: unset;
        transition: all .8s ease-out 0s
    }

    .giftcards .gc-shadow.show {
        transition: opacity .3s ease-out 0s
    }

    .giftcards .gcr-top-part {
        height: 340px
    }

    .giftcards .gc-top-part {
        height: auto !important;
        margin-bottom: 16px
    }

    .giftcards .gc-bottom-part {
        position: relative;
        bottom: unset;
        left: unset;
        background-color: transparent
    }

    .giftcards .gc-bottom-part .gc-mobile-wrapper {
        max-width: none;
        width: calc(50% - 5px);
        float: left;
        margin-right: 5px;
        background: #fff;
        padding-left: 10px;
        box-sizing: border-box;
    }

    .rtl .giftcards .gc-bottom-part .gc-mobile-wrapper {
        float: right;
        direction: rtl;
    }

    .giftcards .gcr-top-part .gcr-envelope {
        position: relative;
        transform: unset;
        top: unset;
        left: unset;
        display: block;
        margin-left: auto;
        margin-right: auto;
        margin-top: 15px
    }
}

.order-from-table-section {
    position: relative;
    display: block;
    text-align: center;
    background-color: #fff;
    min-height: calc(100vh - 120px) !important;
}

.order-from-table-section .oft-title {
    position: relative;
    display: block;
    padding-top: calc(10vh);
    font-size: 16px;
    /* font-weight: bold; */
    padding-left: 20px;
    padding-right: 20px
}

.oft-title b,
.oft-title>span {
    display: block;
    font-family: 'textfont';
    font-size: 26px;
}

.oft-title b {
    color: var(--primary-color);
}

.order-from-table-section .oft-details-container {
    position: relative;
    display: block;
    margin-top: 28px
}

.order-from-table-section .oft-details-container .oft-table-title {
    position: relative;
    display: block;
    color: #777;
    font-size: 18px;
    font-weight: bold
}

.order-from-table-section .oft-details-container .oft-table-title::after {
    content: "";
    position: relative;
    display: block;
    height: 1px;
    background-color: #ddd;
    width: 215px;
    margin: 10px auto
}

.order-from-table-section .oft-details-container .oft-table-name {
    position: relative;
    display: block;
    color: #777;
    font-size: 24px
}

.order-from-table-section .oft-description {
    position: relative;
    display: block;
    color: #333;
    font-size: 14px;
    margin-bottom: 45px;
    width: calc(100% - 80px);
    margin: auto;
    margin-bottom: 61px;
    margin-top: 38px;
}

.oft-description {}

.oft-description {
    list-style: none;
    counter-reset: my-awesome-counter;
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
}

.oft-description li {
    counter-increment: my-awesome-counter;
    display: flex;
    font-size: 14px;
    /* margin-bottom: 0.5rem; */
    border-bottom: 1px solid #eee;
    align-content: center;
    align-items: center;
    min-height: 52px;
    text-align: left;
}

.oft-description li::before {
    content: counter(my-awesome-counter);
    font-weight: bold;
    font-size: 28px;
    margin-right: 14px;
    font-family: 'titlefont';
    line-height: 39px;
    color: var(--primary-color);
}

.order-from-table-section .oft-button {
    position: relative;
    display: block;
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
    height: 35px;
    width: 185px;
    background-color: var(--primary-color);
    color: #fff;
    border-radius: 5px;
    font-size: 15px;
    font-weight: bold;
    padding-top: 15px;
    text-transform: uppercase;
    cursor: pointer
}

.order-from-table-section .oft-button-cancel {
    /* position: fixed; */
    margin-left: auto;
    margin-right: auto;
    font-size: 13px;
    color: #999;
    border-bottom: 1px solid #999;
    width: 52px;
    text-align: center;
    bottom: 30px;
    left: calc(50% - 26px);
    text-transform: capitalize;
    text-decoration: none;
    margin-top: 21px;
}

.has-oft .accname {
    display: none
}

.oft-head-container {
    left: 50%;
    transform: translateX(-50%);
    top: 0;
    text-align: center;
    display: none;
    font-size: 13px;
    position: absolute;
    cursor: pointer
}

.has-oft .oft-head-container {
    display: block
}

.oft-head-container .oft-head-title {
    color: #fff;
    width: 100%;
    border-bottom: 1px dashed #fff;
    box-sizing: border-box;
    height: 20px;
    line-height: 20px;
    padding-left: 5px;
    text-transform: uppercase;
    font-size: 13px;
    padding-right: 5px;
    margin-bottom: 3px
}

.oft-head-container .oft-head-subtitle {
    display: inline-block;
    color: var(--primary-color);
    box-sizing: border-box;
    text-transform: lowercase;
    font-size: 14px;
    line-height: 14px;
    font-weight: bold;
    overflow: hidden;
    vertical-align: top;
    background-color: #fff;
    padding-right: 12px;
    padding-left: 12px;
    border-radius: 16px;
    padding-top: 4px;
    height: 22px;
    margin-top: 2px;
    margin-right: 3px
}

.oft-head-container .zmdi-close-circle {
    font-size: 26px;
    color: #fff;
    display: inline-block;
    vertical-align: top;
    height: 26px
}

.has-oft .box_date.pickordel,
.has-oft .box_delivery,
.has-oft .ship.name,
.has-oft .box_date,
.has-oft .delivery-address-note .address-edit {
    display: none
}

.notloggedin.has-oft .box_delivery.loget-out-user-sign-button {
    display: block;
}

.tips-wrapper {
    position: relative;
    display: block;
    margin-bottom: 20px;
    /* padding-top: 22px; */
}

.tips-wrapper .tips-header {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
}

.tips-wrapper .tips-title {
    font-size: 15px;
    color: #000;
    position: relative;
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 10px
}

.tips-wrapper .tips-amount {
    font-size: 15px;
    color: #000;
    position: relative;
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 10px
}

.tips-wrapper .tips-subtitle {
    margin-bottom: 15px;
    font-size: 13px;
    color: rgba(119, 119, 119, 0.796);
    display: none
}

.tips-wrapper .tips-options {
    position: relative;
    list-style: none;
    display: flex;
    flex-flow: row nowrap;
    place-content: space-around space-between;
    justify-content: flex-start;
    gap: 10px;
}

.tips-wrapper .tips-options .tips-option-item {
    border: 1px solid #ddd;
    background-color: #fff;
    width: calc(25% - 7px);
    height: 41px;
    text-align: center;
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    align-items: center;
    border-radius: 9px;
    cursor: pointer;
    max-width: 91px;
    box-sizing: border-box
}

.tips-wrapper .tips-options .tips-option-item.selected-tips {
    border: 2px solid var(--primary-color);
}

.tips-wrapper .tips-options .tips-option-item.tips-option-other .tips-other-main-title {
    color: #333;
    font-size: 14px;
    font-weight: bold;
    width: 100%;
    height: 100%;
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-evenly;
    align-items: center
}

.tips-wrapper .tips-options .tips-option-item .tips-other-choosed-title,
.tips-wrapper .tips-options .tips-option-item .zmdi,
.tips-wrapper .tips-options .tips-option-item .tips-other-amount {
    display: none
}

.tips-wrapper .tips-options .tips-option-item .tips-option-item-title {
    font-size: 14px;
    font-weight: bold;
    color: #333;
    margin-bottom: 8px
}

.tips-wrapper .tips-options .tips-option-item .tips-option-item-subtitle {
    font-size: 14px;
    color: #333
}

.tips-wrapper.tips-choose-option-other .tips-option-item {
    display: none
}

.tips-wrapper.tips-choose-option-other .tips-option-item.tips-option-other {
    display: block;
    width: 100%;
    max-width: 10000px
}

.tips-wrapper.tips-choose-option-other .tips-options .tips-option-item.tips-option-other .tips-other-main-title {
    display: none
}

.tips-wrapper.tips-choose-option-other .tips-option-item .tips-other-choosed-title {
    display: block;
    color: #333;
    font-weight: bold;
    font-size: 13px;
    margin-top: 11px;
    margin-bottom: 11px;
    position: absolute;
    right: 14px
}

.tips-wrapper.tips-choose-option-other .tips-option-item .zmdi {
    display: block;
    position: absolute;
    left: 9px;
    top: 8px;
    color: #aaa;
    font-size: 24px
}

.tips-wrapper.tips-choose-option-other .tips-option-item .tips-other-amount {
    display: block;
    height: 39px;
    width: calc(100% - 20px);
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    border: 0;
    background: transparent;
    font-size: 16px
}

.orderfromtable {
    height: calc(100vh - 270px);
    min-height: 0
}

.orderfromtable #wrapper {
    height: calc(100vh - 270px);
    min-height: 0
}

@media(max-width:768px) {
    .has-oft .header-loyalty-value {
        display: none
    }
}

.has-loyalty .oft-head-container {
    left: 50%
}

@media(min-width:769px) {
    .order-from-table-section {
        display: inline-block
    }

    .order-from-table-section .oft-title {
        margin-top: 40px
    }

    .order-from-table-section .oft-button-cancel {
        position: relative;
        left: unset;
        bottom: unset;
        margin-top: 80px;
        cursor: pointer
    }

    .has-oft .oft-head-container {
        left: 30%;
        top: 15px
    }

    .tips-wrapper .tips-options {
        /* max-width: 350px; */
    }
}

/* .insta .addtobagbtn.show {
    transform: translateY(-120px);
    display: none !important
} */



.insta .editableMap .mylocation-big-map {
    bottom: 150px
}

.insta .editableMap .close-big-map {
    bottom: 150px
}

.insta .onRight .genBtn.trigger-addtobag {
    display: none !important
}

.insta .addAddressID.editAddAddress .genBtn {
    margin-bottom: 100px
}

.insta.market .onRight {
    display: block;
    position: relative;
    float: left
}

.insta.market .customizedID .genBtn.trigger-addtobag,
.insta.fnb .customizedID .genBtn.trigger-addtobag {
    text-align: center;
    line-height: 53px;
    width: calc(100% - 22px);
    transform: translateX(-11px);
    border-radius: 6px;
    margin-bottom: 120px;
    bottom: auto;
    margin-top: -42px
}

.insta .onRight .genBtn.trigger-addtobag {
    display: none !important
}

.insta.fnb .customizedID .genBtn.trigger-addtobag {
    margin-bottom: 0;
    margin-top: 123px
}

.insta .bigPrice.overbtn.show {
    display: none !important
}

.insta .errorCustomization {
    bottom: 100px;
    border-radius: 4px;
    width: calc(100% - 63px);
    margin-left: 24px
}

.insta .wrapCustom .column_cust {
    margin-bottom: 32px
}

@media(max-width:376px) {
    .order-from-table-section .oft-description {
        margin-top: 30px
    }
}

@mediamin-width:769px) {
    .order-from-table-section .oft-button {
        display: inline-block
    }

    .order-from-table-section .oft-button#oft-copy-button {
        margin-right: 10px
    }

    .order-from-table-section .oft-description {
        margin-top: 40px
    }
}

.loginor .zmdi {
    margin-right: 10px;
    font-size: 17px;
    display: none;
}

#checkoutRegisterFormID .ordering-type {
    position: relative;
    display: flex;
    width: 100%;
    flex-flow: row nowrap;
    place-content: center space-between;
    height: 110px
}

.rtl #checkoutRegisterFormID .ordering-type {
    direction: rtl;
}

#checkoutRegisterFormID .ordering-type .input {
    position: relative;
    cursor: pointer;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    outline: #ddd solid 1px;
    outline-offset: -13px;
    padding-left: 16px
}

.rtl #checkoutRegisterFormID .ordering-type .input {
    padding-right: 25px;
    padding-left: 0;
}

#checkoutRegisterFormID .ordering-type .input .check {
    position: relative;
    display: inline-block;
    top: auto;
    left: auto;
    vertical-align: top;
    margin-top: 15px;
    margin-left: 15px;
    margin-bottom: 15px;
    width: 20px;
    height: 20px
}

.rtl #checkoutRegisterFormID .ordering-type .input .check {
    margin-left: 0;
    margin-right: 15px;
}

#checkoutRegisterFormID .ordering-type .input .label {
    display: inline-block;
    position: relative;
    left: auto;
    top: auto;
    vertical-align: top;
    margin-top: 5px;
    margin-left: 9px;
    line-height: normal;
    height: auto;
    text-transform: capitalize;
    font-size: 18px
}

.rtl #checkoutRegisterFormID .ordering-type .input .label {
    float: right;
    margin-left: 0;
}

.bagph .itemsinbag {
    display: none
}

.reviewbag .bagph .itemsinbag {
    display: block;
    position: absolute;
    top: 20px;
    left: 15px;
    font-size: 22px;
    color: var(--primary-color)
}

.receipt-pickup-infos {
    position: relative;
    display: none;
    margin: 3px auto;
    text-align: center;
    width: 80%;
    font-size: 16px;
    color: #666
}

.fnb .receipt-pickup-infos {
    display: block
}

.receipt-pickup-infos .receipt-pickup-date {
    /* font-weight: bold; */
    margin-bottom: 15px
}

.receipt-pickup-infos .receipt-pickup-branch-title {
    /* font-weight: bold; */
    margin-bottom: 2px
}

.receipt-pickup-infos .receipt-pickup-branch {
    margin-bottom: 3px
}

.receipt-pickup-infos .receipt-pickup-address {
    position: relative;
    display: block;
    color: #666;
    text-decoration: none;
    cursor: pointer
}

.receipt-pickup-infos .receipt-pickup-title {
    margin-top: 42px;
    margin-bottom: 6px;
}

.receipt-pickup-infos .receipt-pickup-date {
    /* font-weight: bold; */
    margin-bottom: 15px;
    font-size: 16px;
    color: #333;
    margin-top: 20px;
    background: #fff;
    width: fit-content;
    margin: auto;
    margin-top: 29px;
    padding: 11px;
    padding-left: 21px;
    padding-right: 19px;
    border-radius: 6px;
    border: 1px solid #eee;
    line-height: 19px;
    padding-bottom: 15px;
}

.receipt-pickup-infos .receipt-pickup-branch-title {
    margin-top: 10px;
    margin-bottom: 3px;
}

.receipt-pickup-infos .receipt-pickup-branch {
    margin-bottom: 3px;
    font-weight: bold;
    color: #333;
}

.receipt-pickup-infos .receipt-pickup-address {
    position: relative;
    display: inline-block;
    color: #868686;
    text-decoration: none;
    cursor: pointer;
    font-weight: bold;
    border-bottom: 1px dotted #ccc;
    padding-bottom: 8px;
    margin-bottom: 6px;
    font-weight: normal;
    text-transform: lowercase;
    font-size: 12px;
    margin-top: 2px;
    /* background: #fff; */
    /* box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px; */
    /* padding: 14px; */
    max-width: 250px;
}

.thebig-ul.loading {
    min-height: 400px !important
}

.box_instruction.hosted-session {
    background-color: transparent;
    border: 0;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.gc-bottom-part .box_instruction.hosted-session {
    padding-top: 0;
    padding: 0px !important;
}

.gc-bottom-part .box_instruction.paymentMethods.hosted-session.byDefaultSavedCard {
    margin-bottom: -38px
}

.gc-bottom-part .box_instruction.paymentMethods.hosted-session.byDefaultSavedCard.expanded {
    margin-bottom: 0
}

.box_instruction.hosted-session .dateForm {
    height: 0;
    overflow: hidden;
    padding-bottom: 0
}

.box_instruction.hosted-session.showHostedSessionPayment .dateForm {
    height: 40px;
    padding-bottom: 10px;
}

.box_instruction.hosted-session .title {
    color: #333
}

.box_instruction .input.saved-card {
    background-color: #fff;
    margin-bottom: 12px;
    border-radius: 5px;
    position: relative;
    display: flex;
    flex-flow: row nowrap;
    place-content: center flex-start;
    padding-top: 5px;
    padding-bottom: 16px;
    margin-right: auto;
    width: 100%;
    align-items: center;
}

.box_instruction .hosted-payment-wrapper {
    margin-bottom: 12px;
    position: relative;
    width: 100%;
    height: 44px;
    overflow: hidden
}

.box_instruction .input.saved-card {
    margin-bottom: 2px !important;
}

.box_instruction .input.saved-card .check {
    top: 3px;
}

.box_instruction .input.saved-card .card-provider-img {
    margin-left: 0;
    height: 13px
}

.box_instruction.expanded .input.saved-card .card-provider-img {
    padding-left: 28px
}

.box_instruction .input.saved-card .label {
    padding-left: 10px;
    margin-bottom: 0;
    font-size: 14px;
    color: #888;
    line-height: 16px
}

.box_instruction .input.saved-card .zmdi-delete {
    position: relative;
    font-size: 15px;
    color: #aaa;
    margin-left: 13px
}

.box_instruction.hosted-session.expanded .input.saved-card .zmdi-delete {
    left: auto;
    right: 0;
    position: absolute;
    top: 2px;
}

.box_instruction.hosted-session .other-payments {
    position: absolute;
    top: 55px;
    right: 3px;
    border-bottom: 1px dashed #ddd;
    margin-top: 14px;
    font-size: 12px;
    color: #444;
    padding-bottom: 5px;
    z-index: 6;
    cursor: pointer;
}

.box_instruction.hosted-session.showHostedSessionPayment .other-payments {
    position: relative;
    display: inline-block;
    top: -6px;
    right: auto;
}

.box_instruction.hosted-session.byDefaultSavedCard .other-payments {
    top: 56px;
}

.gc-bottom-part .box_instruction.hosted-session.byDefaultSavedCard .other-payments {
    top: 0;
    margin-top: 7px;
    right: 13px
}

.gc-bottom-part .box_instruction.hosted-session .other-payments {
    top: 0;
    margin-top: 0;
    right: 13px
}

.gc-bottom-part .box_instruction.hosted-session.showHostedSessionPayment .other-payments {
    top: unset;
    right: auto;
    margin-bottom: 10px
}

.box_instruction.hosted-session.expanded .dateForm {
    height: auto
}

.box_instruction.hosted-session.expanded .selectedpayment {
    display: none;
}

.box_instruction.hosted-session.expanded .other-payments {
    display: none
}

.box_instruction.hosted-session:not(.expanded) .input.saved-card.checked {
    border-color: transparent;
    min-height: 32px;
    padding-left: 0;
    width: calc(100% - 30px)
}

.box_instruction.hosted-session:not(.expanded) .input.saved-card.checked .check {
    display: none
}

.box_instruction .hosted-payment-wrapper::before {
    content: "$";
    width: 30px;
    height: 20px;
    background-color: var(--primary-color);
    position: absolute;
    left: 0;
    top: 6px;
    z-index: 1;
    text-align: center;
    color: #fff;
    font-size: 13px;
    font-weight: bold;
    line-height: 20px;
    border-radius: 2px
}

.box_instruction .hosted-payment-wrapper.currency-lbp::before {
    content: 'LBP';
    font-size: 12px;
}

.box_instruction .hosted-payment-wrapper .input-field.cardnumber {
    height: 32px;
    border-top: 0;
    border-right: 0;
    border-left: none;
    border-image: initial;
    border-bottom: 1px solid #ddd;
    padding-left: 38px;
    padding-right: 5px;
    font-size: 12px;
    width: 194px;
    position: relative;
    font-style: normal;
    margin-right: 3px;
    background: transparent;
}

.box_instruction .hosted-payment-wrapper .gw-proxy-number {
    position: relative;
    display: inline-block;
    width: 237px !important;
    height: 33px !important
}

.box_instruction .hosted-payment-wrapper .input-field.month {
    height: 32px;
    border-top: 0;
    border-right: 0;
    border-left: none;
    border-image: initial;
    border-bottom: 1px solid #ddd;
    width: 28px;
    text-align: center;
    font-size: 12px;
    position: relative;
    margin-right: 3px;
    background: transparent;
}

.box_instruction .hosted-payment-wrapper .gw-proxy-expiryMonth {
    position: relative;
    display: inline-block;
    width: 28px !important;
    height: 33px !important
}

.box_instruction .hosted-payment-wrapper .input-field.year {
    background: transparent;
    height: 32px;
    border-top: 0;
    border-right: 0;
    border-left: none;
    border-image: initial;
    border-bottom: 1px solid #ddd;
    width: 28px;
    text-align: center;
    font-size: 12px;
    position: relative;
    margin-right: 3px;
}

.box_instruction .hosted-payment-wrapper .gw-proxy-expiryYear {
    position: relative;
    display: inline-block;
    width: 30px !important;
    height: 33px !important
}

.box_instruction .hosted-payment-wrapper .input-field.cvv {
    height: 32px;
    border-top: 0;
    border-right: 0;
    border-left: none;
    border-image: initial;
    border-bottom: 1px solid #ddd;
    width: 34px;
    text-align: center;
    font-size: 12px;
    position: relative;
    background: transparent;
}

.box_instruction .hosted-payment-wrapper .gw-proxy-securityCode {
    position: relative;
    display: inline-block;
    width: 34px !important;
    margin: 0 !important;
    height: 33px !important
}

.retail .customizedID .waitingList-button-container {
    position: relative;
    display: block;
    margin-bottom: 20px;
    width: 100%;
}

.retail .customizedID .waitingList-button-container .w-description {
    position: relative;
    display: block;
    font-size: 14px;
    margin-top: 15px;
    color: #666;
    line-height: 20px;
}

.retail .customizedID .waitingList-button-container .genBtn {
    display: block;
    position: relative;
    width: 100%;
    text-align: center;
    padding-top: 15px;
    height: 50px;
    border-radius: 0px 4px 4px 0px;
}

.hasWaitingList .formPart .line.sold-out {
    pointer-events: unset !important
}

.bigPrice.overbtn.ng-hide {
    display: none !important
}

@media(max-width:768px) {
    .retail .customizedID .waitingList-button-container .genBtn {
        display: none
    }

    .hosted-session-wrapper {
        position: relative;
        display: block;
        background-color: #fff;
        padding-left: 15px;
        margin-left: -14px;
        padding-right: 15px;
        /* margin-right: -11px; */
        padding-bottom: 39px;
        margin-bottom: -28px;
        box-shadow: rgba(204, 204, 204, 0.09) 0 -4px 3px;
        padding-top: 15px;
        margin-top: 37px;
        width: calc(100vw - 2px);
        box-sizing: border-box;
    }

    .gc-bottom-part .hosted-session-wrapper {
        position: relative;
        display: block;
        background-color: #fff;
        padding-left: 11px;
        padding-right: 11px;
        box-shadow: none;
        margin-bottom: 0;
        padding-bottom: 0
    }
}

.selectedpayment .selected .zmdi-dot-circle {
    color: var(--primary-color);
    display: block;
    opacity: 1
}

@media(min-width:769px) {
    .box_instruction.hosted-session .other-payments {
        top: 28px;
    }

    .gc-bottom-part .box_instruction.hosted-session.showHostedSessionPayment .other-payments {
        position: absolute;
        left: auto;
        right: 22px;
        top: 18px;
    }

    .box_instruction.hosted-session.byDefaultSavedCard .other-payments {
        top: 42px
    }

    .box_instruction.hosted-session.expanded .input.saved-card .zmdi-delete {
        left: auto;
        right: auto;
        top: auto;
        position: relative;
        margin-left: 50px
    }

    .box_instruction.hosted-session.showHostedSessionPayment .dateForm {
        height: 28px;
    }

    .gc-bottom-part .box_instruction .dateform {
        margin-bottom: 6px;
    }

    .box_instruction.hosted-session.expanded .dateForm {
        height: auto
    }

    .gc-bottom-part .box_instruction.hosted-session {
        margin-bottom: 0;
        background: #fff;
        padding: 16px !important;
        border-radius: 3px;
    }

    .giftcards .hosted-session-big-wrapper.content {
        height: auto
    }

    .giftcards .hosted-session-big-wrapper.gc-big-top .gc-bottom-part {
        height: auto
    }

    .tips-wrapper.tips-choose-option-other .tips-option-item .zmdi {
        top: 8px
    }
}

.totalPrice.discount-price {
    font-size: 13px !important
}

.gc-bottom-part .box_instruction.hosted-session .dateForm {
    width: 100%
}

.gc-bottom-part .box_instruction.hosted-session .input {
    margin-right: 0;
    width: 100% !Important
}

.add-towl-guideline {
    font-family: inherit;
    font-size: 18px;
    color: #b1b1b1;
    text-align: center;
    max-width: 264px;
    margin: auto;
}

li.add-towl-guideline::before {
    font: 119px / 1 Material-Design-Iconic-Font;
    content: "\f3ac";
    margin-right: 10px;
    color: #eee;
    display: block;
    margin-bottom: 25px;
}

.rtl #wrapper {
    position: relative;
}

.whiteBox .boxes .box.customer-profile .mid .view {
    display: block;
    padding-left: 0;
    width: 100%;
}

.whiteBox .customer-profile .userdata .lblText {
    text-transform: capitalize;
}



.lwr {
    margin-bottom: 52px;
    white-space: nowrap;
    overflow-y: hidden;
    overflow-x: auto;
}

.lwr .ltitle {
    font-size: 29px;
    font-family: 'titlefont';
    padding: 20px;
    margin-bottom: 22px;
    white-space: initial;
    text-align: center;
}

.itemGrid .product-labels-container {
    position: absolute;
    left: 10px;
    top: 17px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: flex-start;
    align-items: flex-start;
    z-index: 1;
}

.itemGrid .product-labels-container .product-labels {
    padding-left: 9px;
    padding-right: 9px;
    padding-top: 4px;
    padding-bottom: 4px;
    margin-right: 9px;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    border-radius: 5px;
}

.fnb:not(.large-menu-img) .itemGrid .product-labels-container{
    zoom: 0.7;
    top: 8px;
}

.customizedID .product-labels-container {
    position: absolute;
    left: 17px;
    top: 17px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: flex-start;
    align-items: flex-start;
    z-index: 1;
}

.customizedID .product-labels-container .product-labels {
    padding-left: 9px;
    padding-right: 9px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-right: 9px;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    cursor: default;
    border-radius: 5px;
}



.filters-wrapper {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    margin-bottom: 20px;
    margin-top: 26px;
    padding-top: 10px;
    padding-bottom: 14px;
    padding-left: 11px;
    margin-bottom: 1px;
    min-height: 35px;
    box-sizing: border-box;
    border-radius: 6px 6px 0px 0px;
    z-index: 1;
}

.filters-wrapper:not(:has(.filter-title)) {
    display: none;
}

.rtl .filters-wrapper {
    /* display: none; */
    direction: rtl;
}

.retail .filters-wrapper {
    padding-left: 0px;
    margin-left: 0px;
    margin-top: 27px;
}

.filters-wrapper.showMobileFilter {
    display: block;
}

.market.filters-wrapper {
    background-color: #fff;
}

.enablesorting .filters-wrapper {
    /* width: calc(100% - 11px); */
}

.filters-wrapper .filter-item {
    position: relative;
    display: block;
    margin-right: 10px;
    padding-left: 10px;
    padding-right: 10px;
    cursor: pointer;
    background-color: #fff;
    border: 1px solid #eee;
    box-sizing: border-box;
    border-radius: 5px;
    height: 35px;
}

.filters-wrapper .filter-item.opened {
    background-color: #fff;
    box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 8%);
}

.filters-wrapper .filter-item .filter-title {
    font-size: 14px;
    color: #333;
    /* padding-bottom: 10px; */
    padding-right: 70px;
    /* padding-top: 10px; */
    /* border-bottom: 1px solid #ddd; */
    position: relative;
    height: 35px;
    line-height: 34px;
}

.filters-wrapper .filter-item.opened:before {
    /* content:""; */
    width: calc(100% + 20px);
    height: 40px;
    position: absolute;
    left: -10px;
    top: 0;
    background-color: #fff;
    z-index: 0;
    box-shadow: 0px 0px 10px 0px #ccc;
}

.filters-wrapper .filter-item.opened .filter-title {
    border: none;
}

.filters-wrapper .filter-item.opened .filter-title:before {
    content: "";
    width: calc(100% + 20px);
    height: 20px;
    position: absolute;
    background-color: #fff;
    z-index: 3;
    bottom: -10px;
    left: -10px;
}

.filters-wrapper .filter-item .filter-title:after {
    font: 19px / 1 Material-Design-Iconic-Font;
    content: "\f2f9";
    position: absolute;
    top: 7px;
    right: 0;
    color: var(--primary-color);
    pointer-events: none;
}

.filters-wrapper .filter-item.opened .filter-title:after {
    content: "\f2fc";
}

.filters-wrapper .filter-item .filter-title .filters-count {
    position: absolute;
    top: 7px;
    right: 18px;
    width: 41px;
    height: 18px;
    font-size: 13px;
    background-color: var(--primary-color);
    color: #fff;
    border-radius: 5px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
}

.filters-wrapper .filter-item.price-layout .filter-title .filters-count {
    width: auto;
}

.filters-wrapper .filter-item .filter-title .filters-count .filter-count-number {
    width: 20px;
    height: 18px;
    text-align: center;
    font-size: 12px;
    margin-top: 2px;
    padding-left: 1px;
    line-height: 15px;
}

.filters-wrapper .filter-item .filter-title .filters-count .filter-count-close {
    width: 19px;
    border-left: 1px solid rgb(255 255 255 / 26%);
    height: 15px;
    text-align: center;
    font-size: 13px;
    margin-right: 1px;
    margin-top: 2px;
    margin-bottom: 1px;
    line-height: 13px;
}

.filters-wrapper .filter-item.price-layout .filter-title .filters-count .filter-count-close {
    border: none;
    margin-right: 0;
}

.filters-wrapper .filter-item .filter-popup {
    position: absolute;
    display: none;
    height: 0;
    z-index: 2;
    background-color: #fff;
    padding-left: 10px;
    padding-bottom: 10px;
    padding-right: 10px;
    padding-top: 20px;
    top: 40px;
    left: 0;
    overflow: hidden;
    min-width: 239px;
}

.filters-wrapper .filter-item.opened .filter-popup {
    height: auto;
    box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 8%);
    display: block;
    padding-bottom: 5px;
}

.filters-wrapper .filter-item .filter-popup .filter-search {
    position: relative;
    display: block;
    border-bottom: 1px dotted #eee;
    padding-left: 15px;
    margin-bottom: 10px;
}

.filters-wrapper .filter-item .filter-popup .filter-search:before {
    font: 18px / 1 Material-Design-Iconic-Font;
    content: "\f1c3";
    position: absolute;
    left: 0;
    top: 8px;
    color: var(--primary-color);
    pointer-events: none;
    opacity: 0.32;
}

.filters-wrapper .filter-item .filter-popup .filter-search input {
    position: relative;
    display: block;
    border: none;
    width: calc(100% - 25px);
    padding-left: 5px;
    padding-right: 5px;
    height: 20px;
    padding-top: 5px;
    margin-bottom: 11px;
    margin-top: -7px;
    font-size: 14px;
}

.filters-wrapper .filter-item .filter-popup .filter-list-wrapper {
    max-height: 315px;
    overflow-y: auto;
}

.filters-wrapper .filter-item .filter-popup .filter-subcategory {
    position: relative;
    display: block;
    font-size: 14px;
    margin-bottom: 8px;
    margin-top: 15px;
    font-weight: bold;
    text-transform: capitalize;
}

.filters-wrapper .filter-item .filter-popup .filter-options {
    list-style: none;
    position: relative;
    display: block;
    font-size: 13px;
    color: var(--primary-color);
}

.filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper {
    position: relative;
    display: flex;
    margin-bottom: 6px;
}

.rtl .filter-option-title {
    padding-right: 11px;
}

.filters-wrapper .filter-item.price-layout .filter-popup .filter-options .filter-option-wrapper {
    /* width: 200px; */
    height: 34px;
    /* border: 1px solid var(--primary-color); */
    margin-bottom: 8px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    /* background: #f6f6f6; */
}

.filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-check {
    position: relative;
}

.filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-check:before {
    font: 21px / 1 Material-Design-Iconic-Font;
    content: "\f279";
    color: #555;
}

.filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper.checked .filter-check:before {
    font: 21px / 1 Material-Design-Iconic-Font;
    content: "\f26a";
}

.filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-option-title {
    margin-left: 12px;
    text-transform: capitalize;
    color: #555;
    font-size: 14px;
    line-height: 22px;
}

.filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-price-title {
    position: relative;
    display: block;
    /* text-transform: uppercase; */
    width: 53px;
    /* border-right: 1px solid var(--primary-color); */
    text-align: left;
    padding-top: 11px;
    padding-bottom: 10px;
    font-size: 14px;
    padding-left: 3px;
    color: #666;
}

.filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-price-amount-wrapper {
    position: relative;
    display: block;
    width: 148px;
    height: 33px;
    margin-top: 1px;
    margin-right: 14px;
    margin-bottom: 1px;
}

.filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-price-amount-wrapper:after {
    font: 19px / 1 Material-Design-Iconic-Font;
    content: "\f2f9";
    position: absolute;
    top: 8px;
    right: 10px;
    color: #999999;
    pointer-events: none;
}

.filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-price-amount-wrapper select {
    width: 100%;
    height: 100%;
    border: none;
    color: #aaaaaa;
    font-size: 14px;
    padding-left: 10px;
}

.rtl .filter-price-amount-wrapper select {
    /* direction: ltr; */
    text-align: left;
}

.itemsList .itemGrid .priceWrap .sku {
    display: none;
}

#registerFormID .inputWrap.textarea.focused .label {
    display: block !important;
}

.relationsinline .product-labels {
    display: none
}

.filters-mobile {
    display: none;
}

.filter-mobile-title,
.filter-btn-wrapper,
.filter-mobile-applied {
    display: none;
}

.has-pdf {
    color: var(--primary-color) !important;
}

.market .customizedID .data .sku.has-pdf {
    border-bottom: 1px solid var(--primary-color);
    display: unset;
}

@media (max-width: 768px) {
    .filters-mobile {
        display: block;
        margin-left: 5px;
        margin-bottom: 20px;
        position: absolute;
        left: 0;
        top: -44px;
        background: #fff;
        height: 35px;
        border: 1px solid #eee;
        border-radius: 5px;
        padding-left: 29px;
        padding-right: 15px;
        line-height: 30px;
        box-sizing: border-box;
    }

    .filters-mobile span {
        padding-left: 7px;
        font-size: 13.33px;
    }

    .filters-mobile.subempty {
        top: -40px;
    }

    .retail .filters-mobile.subempty {
        top: -47px;
    }

    .filters-wrapper {
        display: block;
        opacity: 0;
        position: fixed;
        background-color: #fff;
        width: 100vw !important;
        height: 100vh;
        z-index: 1500;
        top: -5000px;
        left: 0;
        transition: opacity 0.4s;
        margin-top: 0px;
    }

    .filters-wrapper.filter-show {
        top: 0px;
        display: block;
        opacity: 1;
        margin-top: 0px;
        border-radius: 0px;
        padding-top: 0px;
    }

    .cordova:not(android) .filters-wrapper.filter-show {
        padding-top: 52px;
    }

    .filter-mobile-title {
        display: block;
        padding-top: 16px;
        padding-left: 17px;
        border-bottom: 1px solid #eee;
        padding-bottom: 16px;
        font-weight: bold;
        font-size: 18px;
    }

    .filter-mobile-title .zmdi-close {
        position: absolute;
        right: 30px;
        top: 17px;
        font-size: 20px;
    }

    .cordova:not(android) .filter-mobile-title .zmdi-close {
        top: 68px;
    }

    .filters-wrapper .filter-item .filter-popup .filter-list-wrapper {
        max-height: 1000px;
        height: calc(100vh - 277px);
        overflow-y: scroll;
        margin-top: 15px;
        margin-bottom: 15px;
    }

    .filters-wrapper .filter-item {

        padding-left: 0;

        padding-right: 0;

        margin-right: 0;

        background: transparent;

        border-radius: 0px;

        border: 0px;

        height: auto;

    }

    .filters-wrapper .filter-item.opened {box-shadow: none;position: absolute;width: 100%;top: 55px;background: #fff;z-index: 1;height: calc(100vh - 179px);}

    .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-price-amount-wrapper {width: calc(100% - 55px);}

    .filters-wrapper .filter-item .filter-title {
        padding-bottom: 13px;
        padding-top: 13px;
        padding-left: 19px;
        color: #333;
        font-weight: normal;
        border-bottom: 1px solid #eee;
        font-size: 18px;
    }

    .filters-wrapper .filter-item .filter-title:after {right: 32px;top: 20px;color: #333;font-size: 23px;}

    .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper {

        margin-bottom: 8px;
    }

    .filters-wrapper .filter-item .filter-title .filters-count {

        top: 20px;

        right: 50px;

        font-weight: normal;

        width: 50px;

        height: 22px;
    }

    .filters-wrapper .filter-item .filter-title .filters-count .filter-count-number {
        height: 18px;
        padding-top: 0px;
        font-size: 14px;
        line-height: 19px;
    }

    .filters-wrapper .filter-item .filter-title .filters-count .filter-count-close {
        height: 16px;
        padding-top: 2px;
        font-size: 15px;
    }

    .filters-wrapper .filter-item.opened .filter-popup {
        box-shadow: none;
        top: auto;
        padding-top: 0;
        position: relative;
        left: auto;
        display: block;
        min-width: calc(100% - 20px);
        margin-left: 11px;
    }

    .filters-wrapper .filter-item.opened .filter-title:before {
        display: none;
    }

    .filters-wrapper .filter-item .filter-popup .filter-search {

        border-bottom: 1px solid #ddd;

        width: calc(100% - 24px);

    }

    .filters-wrapper .filter-item .filter-popup .filter-search:before {

        color: #666;

        font-size: 25px;

    }

    .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-check:before {
        color: #333;
        font-size: 21px !important;
    }

    .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-option-title {
        color: #333;
        font-size: 15px;
    }

    .filters-wrapper .filter-item .filter-popup .filter-options .filter-option-wrapper .filter-price-title {
        border-right-color: #666;
        color: #666;
    }

    .filters-wrapper .filter-item.price-layout .filter-popup .filter-options .filter-option-wrapper {
        border-color: #666;
        width: calc(100% - 10px);
    }

    .filters-wrapper .filter-btn-wrapper {
        position: absolute;
        bottom: 0;
        left: 0;
        padding-top: 20px;
        padding-bottom: 20px;
        width: 100%;
        display: block;
        border-top: 1px solid #ccc;
    }

    .cordova:not(android) .filter-btn-wrapper {
        padding-bottom: 50px;
    }

    .filters-wrapper .filter-item .filter-popup .filter-subcategory {

        font-size: 16px;
    }

    .filters-wrapper .filter-btn-wrapper .filter-btn-inner-wrapper {

        position: relative;

        display: flex;

        flex-direction: row;

        flex-wrap: wrap;

        justify-content: space-around;

        align-items: flex-start;
    }

    .filters-wrapper .filter-item .filter-popup .filter-search input {

        font-size: 16px;

        padding-left: 10px;
    }

    .filters-wrapper .filter-btn-wrapper .filter-clear-all {
        position: relative;
        /* border: 1px solid #999; */
        padding-top: 15px;
        padding-bottom: 15px;
        text-align: center;
        min-width: 170px;
        color: #999;
    }

    .filters-wrapper .filter-btn-wrapper .filter-apply {
        position: relative;
        border: 1px solid transparent;
        padding-top: 15px;
        padding-bottom: 15px;
        text-align: center;
        min-width: 170px;
        color: #fff;
        background-color: var(--primary-color);
        border-radius: 5px;
    }

    .filters-wrapper .filter-btn-wrapper.filter-opened .filter-clear-all {
        display: none;
    }

    .filters-wrapper .filter-btn-wrapper.filter-opened .filter-apply {
        width: 350px;
    }

    .filter-mobile-applied {
        display: flex;
        margin-top: 8px;
        margin-bottom: 8px;
        position: relative;
        /* height: 61px; */
        overflow-x: scroll;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-start;
        padding-left: 8px;
        padding-right: 10px;
        overflow-y: hidden;
        align-items: flex-start;
    }

    .filter-mobile-applied .filter-applied-item {
        position: relative;
        border: 1px solid #eee;
        padding-left: 12px;
        padding-right: 35px;
        /* padding-top: 12px; */
        /* padding-bottom: 12px; */
        margin-right: 6px;
        list-style: none;
        font-size: 12px;
        width: auto;
        display: block;
        text-transform: capitalize;
        background: #fff;
        height: 24px;
        line-height: 24px;
        border-radius: 39px;
        color: #555;
    }

    .filter-mobile-applied .filter-applied-item span {
        white-space: nowrap;
    }

    .filter-mobile-applied .filter-applied-item .zmdi-close {
        position: absolute;
        right: 10px;
        top: 4px;
        font-size: 16px;
        font-weight: normal;
        opacity: 0.8;
    }

    .filters-wrapper .filter-item.price-layout .filter-title .filters-count .filter-count-close {

        width: 22px;
    }
}

.retail.insta .genbtnw {
    display: block;
}

.signupform .normalForm .textarea .label {
    display: block;
}

.signupform .inputWrap.textarea.focused .label {
    display: block !important;
}

.signupform .inputWrap.textarea .input textarea {
    height: 59px;
}

.scanqrcode {
    background-color: transparent !important;
    background-image: url("../../assets/images/image-scanner-frame.png");
    background-size: 240px;
    background-position: center;
    background-repeat: no-repeat;
}

.scanqrcode #wrapper {
    background-color: transparent;
}

.qr-wrapper {
    height: calc(100vh - 119px);
    background-color: var(--primary-color);
    color: #fff;
    background-image: url('../../config/images/qr-bg.png');
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: contain;
}

.qr-title {
    position: relative;
    display: block;
    text-align: center;
    padding-top: 179px;
    font-size: 40px;
    font-family: 'titlefont';
    font-weight: bold;
}

.qr-title:before {
    content: "";
    position: absolute;
    top: 42px;
    left: -33px;
    width: 115%;
    height: 264px;
    background-image: url('../../config/images/confeti-qr.png');
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: contain;
}

.qr-description {
    position: relative;
    display: block;
    text-align: center;
    padding-top: 90px;
    font-size: 23px;
    padding-left: 30px;
    padding-right: 30px;
    font-family: 'titlefont';
}

.qr-code-menu {
    display: none;
}

.cordova .qr-code-menu {
    display: block;
}

.pay-in-store-menu {
    display: none;
}

.cordova .pay-in-store-menu {
    display: block;
}

.pay-in-store-menu .fa-qrcode {
    font-size: 19px;
}

@media (max-width:768px) {
    .insta.fnb .customizedID .genbtnw .genBtn.trigger-addtobag {
        display: block !important
    }

    .insta.market .customizedID .genBtn.trigger-addtobag {
        display: block !important
    }

    .insta.retail .customizedID .genBtn.trigger-addtobag {
        /* display: block !important; */
        max-width: 100%;
        border-radius: 5px;
    }

    .retail.insta .customizedID .show-waitinglist .genBtn.trigger-addtobag {
        display: none !important
    }

    .retail.insta .customizedID .show-waitinglist .waitingList-button-container .genBtn {
        display: block !important;
        /* width: 210px; */
        margin-bottom: 30px;
        width: 100%;
        border-radius: 5px;
    }
}

.cb-wrapper {
    position: fixed;
    width: 448px;
    top: 20px;
    left: -800px;
    z-index: 999999999;
    background: #fff;
    border-radius: 5px;
    padding-bottom: 60px;
    border-bottom: 1px solid #ccc;
    box-shadow: 0px 0px 15px 0px #00000030;
    transition: all .3s ease 0s;
}

.cb-wrapper.show {
    left: 20px;
}

.cb-wrapper .cb-header {
    position: relative;
    display: block;
    /* border-bottom: 1px solid #eeeeee; */
    color: #333;
    /* font-weight: bold; */
    font-size: 19px;
    padding-top: 18px;
    padding-left: 21px;
    padding-bottom: 14px;
    /* margin-bottom: 14px; */
    font-family: 'titlefont';
}

.cb-wrapper .cb-map-container {
    position: relative;
    display: block;
    height: 157px;
    overflow: hidden;
    width: calc(100% - 30px);
    margin: auto;
    border-radius: 6px;
    margin-top: 15px;
}

.cb-wrapper.location-not-detected .cb-map-container {
    /* height: 60px; */
    background-color: #efefef;
}

.cb-wrapper .cb-map-container .cb-map {
    position: relative;
    display: block;
    height: auto;
    width: 448px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.cb-wrapper .cb-map-container .cb-map-buttons {
    position: absolute;
    display: flex;
    right: 14px;
    bottom: 18px;
    height: 40px;
}

.cb-wrapper .cb-map-container .cb-map-buttons .cb-map-b-big {
    position: relative;
    display: block;
    background-color: #fff;
    margin-right: 7px;
    color: #545454;
    /* font-weight: bold; */
    font-size: 13px;
    padding-left: 14px;
    padding-right: 14px;
    text-transform: uppercase;
    font-family: 'titlefont';
    height: 45px;
    box-shadow: 1px 1px 2px 0px #ccc;
    cursor: pointer;
    min-width: 121px;
    line-height: 45px;
    margin-bottom: 2px;
    text-align: center;
}

.rtl .cb-map-b-big {
    font-family: 'arabicfont' !important;
}

.cb-wrapper .cb-map-container .cb-map-buttons .cb-map-b-small {
    position: relative;
    display: block;
    height: 45px;
    width: 45px;
    background-color: #ffffff;
    box-shadow: 1px 1px 2px 0px #ccc;
}

.cb-wrapper .cb-map-container .cb-map-buttons .cb-map-b-small:before {
    content: '!';
    position: absolute;
    background-color: #A61815;
    color: #fff;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    text-align: center;
    font-weight: bold;
    right: -4px;
    top: -4px;
    font-size: 14px;
}

.cb-wrapper .cb-map-container .cb-map-buttons .cb-map-b-small.gps-detected:before {
    content: '\f26b';
    font: normal normal normal 18px/1 'Material-Design-Iconic-Font';
    position: absolute;
    background-color: #85B200;
    color: #fff;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    text-align: center;
    font-weight: bold;
    right: -4px;
    top: -4px;
}

.cb-wrapper .cb-map-container .cb-map-buttons .cb-map-b-small .zmdi {
    font-size: 18px;
    position: relative;
    display: block;
    height: 29px;
    padding-top: 11px;
    cursor: pointer;
}

.cb-wrapper .cb-branches {
    position: relative;
    display: block;
    padding-left: 19px;
    list-style: none;
    padding-right: 14px;
    padding-bottom: 20px;
    max-height: calc(100vh - 335px);
    overflow-y: auto;
    margin-bottom: 0px;
}

.cb-wrapper .cb-branches .cb-branches-item {
    position: relative;
    display: block;
    margin-top: 20px;
    padding-top: 4px;
    min-height: 40px;
}

.rtl .cb-wrapper .cb-branches .cb-branches-item {transform: scaleX(-1);}

.rtl .cb-wrapper .cb-branches .cb-branches-item * {
    transform: scaleX(-1);
    text-align: right;
    direction: rtl;
}

.cb-wrapper .cb-branches .cb-branches-item:first-child .cb-item-button {
    background: var(--primary-color)!important;
    color: #fff!important;
    font-weight: bold;
}

.cb-wrapper .cb-branches .cb-branches-item:not(:first-child) .cb-item-button {
    background: #fff !important;
    color: #474747;
    border: 1px solid;
}

.cb-wrapper .cb-branches .cb-branches-item .cb-item-button {
    height: 41px;
    color: #fff;
    background-color: var(--primary-color);
    position: absolute;
    top: 0;
    right: 0;
    /* font-family: 'titlefont'; */
    font-size: 11px;
    padding-right: 10px;
    padding-left: 10px;
    /* padding-top: 7px; */
    cursor: pointer;
    border-radius: 7px;
    line-height: 41px;
    min-width: 90px;
    text-align: center;
    box-sizing: border-box;
}

.cb-wrapper .cb-branches .cb-branches-item .cb-item-direction {

    position: absolute;

    right: 107px;

    font-size: 24px;

    color: #999;

    top: 5px;
}

.cb-wrapper .cb-branches .cb-branches-item .cb-item-direction .fa-diamond-turn-right {}

.cb-item-button.olater {
    background-color: #fff !Important;
    color: var(--primary-color) !important;
    border: 1px solid var(--primary-color);
}

.cb-wrapper .cb-branches .cb-branches-item .cb-item-title {
    position: relative;
    display: block;
    font-weight: bold;
    font-size: 16px;
    max-width: 180px;
}

.cb-wrapper .cb-branches .cb-branches-item .cb-item-address {
    position: relative;
    display: block;
    font-size: 14px;
    color: #888;
    max-width: 180px;
    margin-top: 2px;
    line-height: 19px;
}

.cb-wrapper .cb-branches .cb-branches-item .cb-item-info {
    position: relative;
    display: flex;
    width: 100%;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 11px;
    font-weight: bold;
    margin-top: 5px;
}

.cb-wrapper .cb-branches .cb-branches-item .cb-item-info .cb-item-info-details {
    margin-right: 5px;
    text-transform: uppercase;
    font-size: 11px;
    margin-top: 3px;
    font-weight: normal;
    letter-spacing: 1.1px;
}

.cb-wrapper .cb-branches .cb-branches-item .cb-item-info .cb-yellow {
    color: #D9A300;
}

.cb-wrapper .cb-branches .cb-branches-item .cb-item-info .cb-green {
    color: #59B200;
}

.cb-wrapper .cb-branches .cb-branches-item .cb-item-info .cb-grey {
    color: #999999;
}

.cb-wrapper .cb-view-other-branches {
    position: relative;
    display: inline-block;
    margin-left: 30px;
    font-size: 13px;
    color: #bababa;
    border-bottom: 1px dotted;
    margin-bottom: 10px;
    cursor: pointer;
}

.cb-wrapper .cb-nodelivernopickup {

    position: relative;

    display: flex;

    margin-left: 30px;

    margin-right: 14px;

    margin-top: 20px;

    margin-bottom: 10px;

    justify-content: space-between;

    align-items: center;

    flex-wrap: nowrap;

    flex-direction: row;
}

.cb-wrapper .cb-nodelivernopickup .cb-nf-np-button {
    height: 41px;
    color: #fff;
    background-color: #A61815;
    position: relative;
    font-size: 14px;
    padding-right: 10px;
    padding-left: 10px;
    cursor: pointer;
    min-width: 130px;
    text-align: center;
    line-height: 40px;
    border-radius: 4px;
}

.cb-wrapper .cb-nodelivernopickup .cb-nf-np-text {
    position: relative;
    font-size: 13px;
    font-weight: bold;
    /* color: #999999; */
}

.cb-current-location .editableMap {
    visibility: visible;
    left: 0;
    z-index: 88999999999;
}

.main-swiper img {
    animation: none;
}

.market .relationsinline .related-items {
    display: block;
}

.market .relationsinline .related-items .itemsList .itemGrid .priceWrap {
    display: none;
}

.market .relationsinline .related-items .itemsList .itemGrid .picture {
    width: 100%;
    max-height: 100%;
    margin-left: 0;
}

@media (max-width:600px) {
    .cb-wrapper {
        width: 100%;
        border-radius: 0;
        top: 15px;
        height: calc(100vh - 45px);
    }

    .cb-wrapper.show {
        left: 15px;
        width: calc(100vw - 30px);
        top: 45px;
        height: calc(100vh - 140px);
        /* opacity: 0.95; */
        border-radius: 6px;
        transition: all .3s ease 0s;
        z-index: 88888888888;
    }

    body:has(.cb-wrapper.show) {
        overflow: hidden !important;
    }

    .cb-wrapper:has(.order-method-wrap.checked)>.cb-header {
        height: 0px;
        overflow: hidden;
        padding-top: 0px;
        transition: all 0.3s;
        padding-bottom: 0px;
    }

    .cb-wrapper .cb-map-container .cb-map {
        width: 119%;
        height: auto;
        margin-left: -34px;
    }
}

.customizedID .addRemoveWrap input.nb {
    border: none;
    /* display: none; */
    width: 80px;
}

/* .wholesale .customizedID .addRemoveWrap input.nb {
    border: none;
    display: block;
}

.wholesale .customizedID .addRemoveWrap div.nb {
    display: none;
} */

.wholesale .addRemove {
    width: 90px;
}

#currentEditMap .gm-style::after,
#addressEditMap .gm-style::after {
    position: absolute;
    width: 29px;
    height: 42px;
    left: calc(50% - 14.7px);
    top: calc(50% - 31.4px);
    font: 50px / 1 Material-Design-Iconic-Font;
    content: "\f1ab";
    z-index: 5;
    color: var(--primary-color);
    pointer-events: none;
    line-height: 46px;
}

#currentEditMap.standing-marker .gm-style::after,
#addressEditMap.standing-marker .gm-style::after {
    transform: translateY(-12px);
    animation-name: pinbounce-marker;
    animation-duration: .3s;
    animation-timing-function: ease;
    animation-delay: 0;
    animation-iteration-count: 1;
}

#currentEditMap .gm-style::before,
#addressEditMap .gm-style::before {
    content: "";
    width: 250px;
    height: 250px;
    position: absolute;
    top: 4px;
    bottom: 0;
    right: 0;
    left: 3px;
    z-index: 2;
    margin: auto;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    pointer-events: none;
    transition: all .2s ease-in-out;
    /* -webkit-box-shadow: 0 0 0 90px var(--primary-color); */
    /* box-shadow: 0px 0px 0px 90px var(--primary-color); */
    background-color: var(--primary-color);
    opacity: .1;
    -webkit-backface-visibility: hidden;
}

#currentEditMap.animate-marker .gm-style::after,
#addressEditMap.animate-marker .gm-style::after {
    top: calc(50% - 65px);
}

#currentEditMap.animate-marker .gm-style::before,
#addressEditMap.animate-marker .gm-style::before {
    /*box-shadow: 0 0 0 3px var(--primary-color);*/
    width: 8px;
    height: 8px;
    background-color: var(--primary-color);
    opacity: 1;
}

.register-privacy-and {
    margin-left: 2px;
    margin-right: 2px;
}

.register-privacy-and,
.register-privacy {
    display: none;
}

@media (max-width:768px) {
    .cb-wrapper .cb-map-container .cb-map-buttons .cb-map-b-big {
        /* padding-top: 14px; */
        /* height: 26px; */
    }

    .cb-wrapper .cb-nodelivernopickup .cb-nf-np-button {
        /* padding-top: 8px; */
        /* height: 20px; */
    }

    .cb-wrapper .cb-branches .cb-branches-item .cb-item-button {
        /* padding-top: 8px; */
        /* height: 20px; */
    }

    .auto-login-from-back .content {
        margin-left: 0;
    }
}

.gmnoprint {
    display: none;
}

button.gm-control-active.gm-fullscreen-control {
    display: none;
}

.gotomarker {
    display: none;
}

.olaternopickup {
    filter: grayscale();
    background-color: #fff !Important;
    color: var(--primary-color) !important;
    border: 1px solid var(--primary-color);
}

.products-details-cal {
    position: relative;
    display: none;
}

.orders .order .oNbItems,
.orders .order .withTitle {
    width: 100% !important;
}


/* .myAccountPid .iti {
    background-color: transparent;
    width: 100%;
} */

.pay-with-apple-pay {
    background-size: 50% 30%;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    border-radius: 5px;
    padding: 0px;
    box-sizing: border-box;
    min-width: 200px;
    min-height: 32px;
    max-height: 50px;
    color: white;
    background-image: -webkit-named-image(apple-pay-logo-white);
    background-color: black;
    border: .5px solid black;
}

.hosted-session .pay-with-apple-pay {
    margin-bottom: 20px !important;
}

apple-pay-button {
    --apple-pay-button-width: 100%;
    --apple-pay-button-height: 50px;
    --apple-pay-button-border-radius: 3px;
    --apple-pay-button-padding: 0px 0px;
    --apple-pay-button-box-sizing: border-box;
}

.itemsList .itemGrid .priceWrap .download-pdf {
    display: none;
}

.hasdatasheet .itemsList .itemGrid .priceWrap .download-pdf {
    display: block;
    position: absolute;
    right: 15px;
    font-size: 28px;
    top: -42px;
    color: var(--primary-color);
}

.customizedID .data .download-pdf {
    display: none;
}

.fnb .data .sku {
    display: none;
}

.hasdatasheet .customizedID .data .download-pdf {
    display: block;
    position: relative;
    font-size: 32px;
    color: var(--primary-color);
}

.hide-inst-box.no-map.box_delivery {
    min-height: 100px !important;
}

.hide-inst-box.no-map.box_delivery .boxData {
    min-height: 100px;
}

.hide-inst-box.no-map.box_delivery .office {
    height: 100px;
}

.hide-inst-box.no-map.box_delivery .googleMap {
    display: none;
}

.hide-inst-box.no-map.box_delivery .box_instruction {
    display: none;
}

.cash-card-notice {
    position: relative;
    display: block;
    text-align: center;
    margin-top: 10px;
    font-size: 13px;
}

.column_cust .block .bSmallTitle .custom-min {
    display: none;
}

.contactus {
    display: none !important;
}

.opt-plus-minus {
    display: none;
}

.checked .opt-plus-minus {
    display: flex;
    z-index: 1;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    width: 100px;
}

.opt-plus-minus .minus {
    width: 25px;
    text-align: center;
    font-size: 30px;
    height: 22px;
    line-height: 18px;
    color: #333;
    -webkit-user-select: none;
}

.opt-plus-minus .nb {
    width: 42px;
    border: 1px solid #ccc;
    text-align: center;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 4px;
    padding-right: 4px;
    height: 12px;
    font-size: 11px;
}

.opt-plus-minus .plus {
    width: 25px;
    text-align: center;
    font-size: 25px;
    height: 22px;
    line-height: 20px;
    color: #333;
    -webkit-user-select: none;
}

.opt-plus-minus .max-qty-tooltip {
    display: none;
    position: absolute;
    top: -29px;
    min-width: 67px;
    width: auto;
    white-space: nowrap;
    right: 10px;
    font-size: 10px;
    background: #fff;
    padding: 5px;
    line-height: 10px;
    border-bottom: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 0px 6px 1px #efefef;
    text-align: center;
    padding-left: 20px;
    color:
        var(--primary-color);
}

.opt-plus-minus .max-qty-tooltip.reached-max {
    display: block;
}

.opt-plus-minus .max-qty-tooltip:before {
    content: "\f1f8";
    font: 15px / 1 Material-Design-Iconic-Font;
    position: absolute;
    height: 8px;
    width: 8px;
    bottom: 9px;
    left: 4px;
    color: var(--primary-color);
}

.opt-plus-minus .max-qty-tooltip:after {
    content: "";
    position: absolute;
    height: 8px;
    width: 8px;
    bottom: -6px;
    right: 34px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    transform: rotate(45deg);
    background-color: #fff;
}

.opt-plus-minus .long-press-tooltip {
    display: none;
    position: absolute;
    top: -29px;
    min-width: 115px;
    right: 0;
    font-size: 10px;
    background: #fff;
    padding: 5px;
    line-height: 10px;
    border-bottom: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 0px 6px 1px #efefef;
}


.opt-plus-minus .long-press-tooltip:after {
    content: "";
    position: absolute;
    height: 8px;
    width: 8px;
    bottom: -6px;
    right: 7px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    transform: rotate(45deg);
    background-color: #fff;
}

.opt-plus-minus .plus:hover .long-press-tooltip {
    display: block;
    animation: hideMe 0s ease-in 2s forwards;
}

@keyframes hideMe {
    to {
        opacity: 0;
    }
}

.disable-product-qty .minus,
.disable-product-qty .plus {
    display: none;
}

.disable-product-qty .nb {
    width: 100%;
}

.products-listing .addRemoveWrap .addRemove .nb {
    width: auto !important;
    padding-left: 5px;
    padding-right: 5px;
}

.products-listing .addRemoveWrap .addRemove input.nb {
    width: 24px !important;
    margin-right: 6px;
    margin-left: 2px;
    border: 1px solid #ddd;
    margin-top: -2px;
    transition: font-size .5s;
    border-radius: 5px;
}

.products-listing .addRemoveWrap .addRemove input.nb.ftz-15 {
    font-size: 15px;
    transition: font-size .5s;
}

.pt-plus-minus .max-qty-tooltip {
    display: none;
    position: absolute;
    top: -44px;
    min-width: 67px;
    width: auto;
    white-space: nowrap;
    left: 50%;
    font-size: 14px;
    background: #fff;
    padding: 10px;
    line-height: 12px;
    border-bottom: 1px solid #ccc;
    border-radius: 5px;
    box-shadow: 0 0px 12px 4px rgb(0 0 0 / 8%);
    text-align: center;
    padding-left: 28px;
    color:
        var(--primary-color);
    transform: translateX(-50%);
    animation: fadeInUp;
}

.pt-plus-minus .max-qty-tooltip.reached-max {
    display: block;
}

.pt-plus-minus .max-qty-tooltip:before {
    content: "\f1f8";
    font: 20px / 1 Material-Design-Iconic-Font;
    position: absolute;
    height: 8px;
    width: 8px;
    bottom: 17px;
    left: 6px;
    color:
        var(--primary-color);
}

.pt-plus-minus .max-qty-tooltip:after {
    content: "";
    position: absolute;
    height: 8px;
    width: 8px;
    bottom: -6px;
    left: 50%;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    transform: rotate(45deg);
    background-color: #fff;
}

.pt-plus-minus .long-press-tooltip {
    display: none;
    position: absolute;
    color: #444;
    top: -41px;
    min-width: 137px;
    right: 12px;
    font-size: 14px;
    background: #fff;
    padding: 8px;
    line-height: 14px;
    border-bottom: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 0px 12px 4px rgb(0 0 0 / 8%);
    white-space: nowrap;
}


.pt-plus-minus .long-press-tooltip:after {
    content: "";
    position: absolute;
    height: 8px;
    width: 8px;
    bottom: -6px;
    right: 7px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    transform: rotate(45deg);
    background-color: #fff;
}

.pt-plus-minus .plus:hover .long-press-tooltip {
    display: block;
    animation: hideMe 0s ease-in 2s forwards;
}



.products-listing .max-qty-tooltip {
    display: none;
    position: absolute;
    top: -43px;
    min-width: 67px;
    width: auto;
    white-space: nowrap;
    right: 3px;
    font-size: 14px;
    background: #fff;
    padding: 7px;
    line-height: 13px;
    border-bottom: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 0px 6px 1px #efefef;
    text-align: center;
    padding-left: 24px;
    color:
        var(--primary-color);
    padding-bottom: 7px;
    padding-top: 6px;
}

.products-listing .max-qty-tooltip.reached-max {
    display: block;
}

.products-listing .max-qty-tooltip:before {
    content: "\f1f8";
    font: 16px / 1 Material-Design-Iconic-Font;
    position: absolute;
    height: 8px;
    width: 8px;
    bottom: 13px;
    left: 6px;
    color:
        var(--primary-color);
}

.products-listing .max-qty-tooltip:after {
    content: "";
    position: absolute;
    height: 8px;
    width: 8px;
    bottom: -6px;
    right: 34px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    transform: rotate(45deg);
    background-color: #fff;
}

.products-listing .long-press-tooltip {
    display: none;
    position: absolute;
    color: #555;
    top: -30px;
    min-width: 87px;
    right: 0px;
    font-size: 10px;
    background: #fff;
    padding: 5px;
    line-height: 10px;
    border-bottom: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: 0 0px 9px 3px rgb(0 0 0 / 4%);
}


.products-listing .long-press-tooltip:after {
    content: "";
    position: absolute;
    height: 8px;
    width: 8px;
    bottom: -6px;
    right: 7px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    transform: rotate(45deg);
    background-color: #fff;
}

.products-listing .plus:hover .long-press-tooltip {
    display: block;
    animation: hideMe 0s ease-in 2s forwards;
}

.myBagModule .itemBags .addRemoveWrap input.nb {
    width: 51px;
    height: 22px;
    margin-top: 4px;
    transition: font-size .5s;
    border: 1px solid #999;
    line-height: 22px !Important;
    box-sizing: border-box;
}

.myBagModule .itemBags .addRemoveWrap input.nb.ftz-15 {
    font-size: 13px;
    transition: font-size .5s;
}


.myBagModule .max-qty-tooltip {
    display: none;
    position: absolute;
    top: -27px;
    min-width: 67px;
    width: auto;
    white-space: nowrap;
    left: -2px;
    font-size: 10px;
    background: #fff;
    padding: 5px;
    line-height: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 0px 6px 1px #efefef;
    text-align: center;
    padding-left: 20px;
    color:
        var(--primary-color);
}

.myBagModule .max-qty-tooltip.reached-max {
    display: block;
}

.myBagModule .max-qty-tooltip:before {
    content: "\f1f8";
    font: 15px / 1 Material-Design-Iconic-Font;
    position: absolute;
    height: 8px;
    width: 8px;
    bottom: 9px;
    left: 4px;
    color: var(--primary-color);
}

.myBagModule .max-qty-tooltip:after {
    content: "";
    position: absolute;
    height: 8px;
    width: 8px;
    bottom: -6px;
    left: 31px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    transform: rotate(45deg);
    background-color: #fff;
}

.myBagModule .long-press-tooltip {
    display: none;
    position: absolute;
    top: -23px;
    min-width: 115px;
    left: -15px;
    font-size: 10px;
    background: #fff;
    padding: 5px;
    line-height: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 0px 6px 1px #efefef;
}


.myBagModule .long-press-tooltip:after {
    content: "";
    position: absolute;
    height: 8px;
    width: 8px;
    bottom: -6px;
    left: 14px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    transform: rotate(45deg);
    background-color: #fff;
}

.myBagModule .plus:hover .long-press-tooltip {
    display: block;
    animation: hideMe 0s ease-in 2s forwards;
}

.delete-account-btn {
    min-width: 200px;
    width: 200px;
    height: 40px;
    margin-top: 7px;
    background-color: #ffffff;
    border-color: #eee;
    color: #666 !important;
    font-size: 12px;
    margin-bottom: 20px;
}

.rtl .delete-account-btn {
    margin-bottom: 40px;
    /* margin-left: 23px; */
}

#deleteMyAccountModalID.smallType1 {
    min-width: 296px;
    border-radius: 9px;
}

#deleteMyAccountModalID.smallType1 .custText {
    width: 85%;
}

#deleteMyAccountModalID.smallType1 .genBtn {
    background-color: #d11a2a;
}

#deleteMyAccountModalID.smallType1 .moreBtn {
    border-color: #fff;
    color: #666;
}

#deleteMyAccountModalID.smallType1 .moreBtn:hover {
    background-color: transparent;
}

@media (max-width:768px) {
    .delete-account-btn {
        margin-bottom: 100px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 69px;
    }

    .rtl .delete-account-btn {}
}

@media only screen and (min-width: 820px) and (orientation: portrait) {
    body {
        zoom: 0.8;
    }

    .market body {
        zoom: 0.88;
    }

    .footer {
        display: none;
    }
}

#notificationModalID2 .title {
    margin-bottom: 15px;
}

#notificationModalID2 .messageContainer {
    font-weight: normal;
    text-align: center;
}

.for-free .itembagfooter {
    /* display: none; */
}

.no-map .customDropDown.open .drop_options {
    bottom: auto;
}

.box_delivery .office {
    z-index: 4
}

.box_delivery .office:has(.open) {
    z-index: 5;
}

.wautocomplete .list-group {
    position: absolute;
    top: 45px;
    left: 0px;
    width: 100%;
    box-shadow: 0 3px 19px 0px rgb(0 0 0 / 7%);
    z-index: 20;
    max-height: 170px;
    overflow-y: auto;
    background: #fff;
}

.wautocomplete .list-group .list-group-item {
    list-style-type: none;
    color: #666;
}


.wautocomplete .list-group .list-group-item:hover {
    background-color: #f6f6f6;

}

.wautocomplete .list-group li.list-group-item {
    width: calc(100% - 22px);
    border-bottom: 1px solid #fffdfd;
    font-weight: 400;
    padding: 10px;
    position: relative;
    cursor: pointer;
    font-size: 12px;
}

.lds-ellipsis {
    display: block;
    position: absolute;
    z-index: 1;
    width: 30px;
    height: 100%;
    right: 0;
    top: 0;
    padding-right: 4px;
    background: #f6f6f6;
}

.lds-ellipsis div {
    position: absolute;
    top: 20px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #333;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis div:nth-child(1) {
    left: 0;
    animation: lds-ellipsis1 0.6s infinite;
}

.lds-ellipsis div:nth-child(2) {
    left: 0px;
    animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(3) {
    left: 8px;
    animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(4) {
    left: 16px;
    animation: lds-ellipsis3 0.6s infinite;
}

@keyframes lds-ellipsis1 {
    0% {
        transform: scale(0);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes lds-ellipsis3 {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(0);
    }
}

@keyframes lds-ellipsis2 {
    0% {
        transform: translate(0, 0);
    }

    100% {
        transform: translate(8px, 0);
    }
}


@media(max-width: 1300px) and (min-width: 769px) {

    .right.rBox .loginor {
        display: block !important;
        /* margin-top: -27px !important; */
        padding-bottom: 26px;
    }

    .market .right.rBox .loginor {
        margin-top: -16px !important;
    }

    .retail .right.rBox .loginor {
        margin-top: -1px !important;
        /* width: calc(100% - 13px); */
    }

    .checkoutID .reviewBox .rBox {
        margin-left: 0px;
    }

    .retail .deskmenu {
        padding-right: 0px !important;
    }

    .fnb .right.rBox .loginor {
        /* margin-top: -15px !important; */
    }
}

.footer .topFoot {
    display: none;
}

.hide-add-button .addRemoveWrap {
    display: none;
}

/* .hide-add-button .customizedID .onRight{
    display:none;
}.hide-add-button .addtobagbtn.show{
    display:none !important;
} */
.trackingDisabled .orderdet {
    /* display: none; */
    width: 100%;
    height: auto;
    padding-bottom: 37px;
}

.trackingDisabled .orderstat {
    display: none;
}

.trackingDisabled .ot-background {
    min-height: 342px !Important;
}

.currencyonleft .itemsList .itemGrid .priceWrap .price {
    direction: rtl;
}

.currencyonleft .customizedID .data .price {
    direction: rtl;
}

.currencyonleft .myBagModule .itemBags .total {
    direction: rtl;
}

.currencyonleft .sumhead div:nth-child(1),
.currencyonleft .sumhead div:nth-child(2) {
    /* direction: rtl; */
    /* float: left; */
}


.currencyonleft .subTotalBox .totalPrice:nth-child(2) {
    /* direction: rtl; */
}

.currencyonleft .myBagModule .itemBags .price {
    direction: rtl;
}

.currencyonleft .minitotal .mtprice {
    direction: rtl;
}

.currencyonleft .myBagModule .priceonbtn {
    direction: rtl;
}

.currencyonleft .myBagModule .subtotal .subPrice {
    direction: rtl;
}


.currencyonleft .customizedID .bigPrice {
    direction: rtl;
}

.currencyonleft .hissubtotal div {
    display: inline-block;
    direction: rtl;
}

.currencyonleft .itemsList .itemGrid .priceWrap .price {
    direction: rtl;
}

.currencyonleft .customizedID .data .price {
    direction: rtl;
}

.currencyonleft .myBagModule .itemBags .total {
    direction: rtl;
}

.currencyonleft .sumhead div:nth-child(1),
.sumhead div:nth-child(2) {
    /* direction: rtl; */
    /* float: left; */
}

.wrp:not(:has(*)) {
    display: none !important;
}

.currencyonleft.subTotalBox .totalPrice:nth-child(2) {
    direction: rtl;
}

.currencyonleft .myBagModule .itemBags .price {
    direction: rtl;
}

.currencyonleft .minitotal .mtprice {
    direction: rtl;
}

.currencyonleft .myBagModule .priceonbtn {
    direction: rtl;
}

.currencyonleft .myBagModule .subtotal .subPrice {
    direction: rtl;
}

.currencyonleft .customizedID .bigPrice {
    direction: rtl;
}



.hide-add-button .checkboxCol .formPart .lines .line .check {
    display: none;
}

.hide-add-button .checkboxCol .formPart .lines .line .label {
    padding-left: 0;
}

.hide-add-button .checkboxCol .formPart .lines .line {
    pointer-events: none;
    opacity: 0.7;
}

.hide-add-button .checkboxCol .formPart .lines .line .input {
    cursor: default;
}

.hide-add-button .customnote {
    display: none;
}

.hide-add-button .formPart .line.sold-out .sold-out-item {
    display: none;
}

.hide-add-button .bigPrice.overbtn {
    display: none !important;
}

.footer {
    height: auto;
    background-color: #fafafa;
}

.market.productpage .inproduct .footer {
    display: none;
}

.orderdetails .footer {
    display: none;
}

.footer .topFoot {
    position: relative;
    width: 100%;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-around;
    max-width: 1120px;
    margin-left: auto;
    margin-right: auto;
    min-height: 250px;
}

.footer .topFoot .column {}

.footer .topFoot .column .logo {
    position: relative;
    display: block;
    width: 50px;
    cursor: pointer;
}

.footer .topFoot .column .logo img {
    position: relative;
    display: block;
    width: auto;
    max-height: 28px;
}

.footer .topFoot .column .links .title {
    position: relative;
    display: block;
    font-weight: bold;
    font-size: 17px;
    line-height: 17px;
    margin-bottom: 22px;
    padding-bottom: 17px;
}

.footer .topFoot .column .links .title:after {
    content:
        '';
    position:
        absolute;
    left: 0;
    bottom: -2px;
    width: 48px;
    height: 2px;
    background-color: #222222;
}

.footer .topFoot .column .links .link-item {
    position: relative;
    display: block;
    font-size: 14px;
    line-height: 14px;
    margin-bottom: 8px;
    cursor: pointer;
    text-transform: capitalize;

}

li.link-item.phones-box.ng-scope {
    padding-top: 11px;
}


.footer .topFoot .column .links .link-item a {
    text-decoration: none;
    color: #222;
    text-transform: capitalize;
}

.footer .topFoot .column .links .link-item a:hover {
    color: #333;
}

.footer .address-box {
    padding-left: 35px;
    margin-bottom: 22px !important;
}

.footer .address-box::before {
    position: absolute;
    content: "";
    background-image: url(../images/location.png);
    width: 18px;
    height: 26px;
    background-repeat: no-repeat;
    background-size: contain;
    top: 0;
    left: 0px;
}

.footer .phones-box {
    padding-left: 35px;
    margin-bottom: 20px !important;
}

.footer .phones-box::before {
    position: absolute;
    content: "";
    background-image: url(../images/phone-footer.png);
    width: 19px;
    height: 20px;
    background-repeat: no-repeat;
    background-size: contain;
    top: 0;
    left: 0px;
}

.footer .emails-box {
    padding-left: 35px;
    margin-bottom: 10px !important;
}

.footer .emails-box::before {
    position: absolute;
    content: "";
    background-image: url(../images/mail.png);
    width: 19px;
    height: 16px;
    background-repeat: no-repeat;
    background-size: contain;
    top: 0;
    left: 0px;
}

.relationsinline .related-items .itemsList .itemGrid.showRGB {
    background-color: transparent !important;
    border-top: none;
}

.relationsinline .heart {
    display: none !important;
}

.relationsinline .heart {
    display: none;
}


.retail .related-items .itemsList .itemGrid.showRGB .picture {
    width: 45px;
    height: 45px;
    margin-left: 0px;
    margin-top: 10px;
    border-radius: 50%;
    min-width: 0px;
    min-height: 0px;
    border: 1px solid #eee;
}


.top-categories {
    display: none;
}

.top-categories {
    background-color: #fff;
    padding: 8px 0px 10px;
    width: 100%;
    box-shadow: rgb(204 204 204 / 20%) 0 12px 8px;
    height: 28px;
    position: fixed;
    z-index: 3;
    top: 118px;
}

.retail .top-categories {
    top: 66px;
}

.top-categories ul {
    overflow: auto;
    width: 100%;
    white-space: nowrap;
    height: 45px;
}

.top-categories li {
    list-style: none;
    padding-bottom: 7px;
    padding-top: 6px;
    display: inline-block;
    padding-right: 25px;
    font-weight: bold;
    position: relative;
    width: auto;
    height: 21px;
    transition: all .2s linear 0s;
}

.top-categories li.selected,
.top-categories li.selected {
    transition: all .2s linear 0s;
}

.top-categories li.selected, .top-categories li:first-child {
    margin-left: 11px;
}

.top-categories a {
    color: #333;
    text-decoration: none;
    font-size: 14px;
    transition: all .2s linear 0.5s;
    height: 25px;
    display: inline-block;
}

.top-categories li.selected a {
    color: var(--primary-color);
    transition: all .2s linear 0s;
    border-bottom: 2px solid var(--primary-color);
}

@media (min-width: 769px) {
    .top-categories {
        display: none !important;
    }
}

.share-product {
    height: 30px;
    width: 30px;
    border-radius: 50%;
    /* display: flex; */
    /* display: none; */
    border: 4px solid #fff;
    position: absolute;
    top: 38px;
    right: 84px;
    align-items: center;
    justify-content: space-around;
    cursor: pointer;
}

.cont .share-product {
    /* display: none; */
    /* filter: invert(1); */
    left: 41px !important;
    margin-left: 0px;
    top: 17px;
}

.market .cont .share-product {
    display: none;
}

.fnb .cont .share-product {
    display: none;
}

.share-product .zmdi-share:before {
    font-size: 20px;
    color: #fff;
    font-size: 20px;
    margin-left: -8px;
    top: 6px;
    position: absolute;
    content: '\f35b';
}

.retail .share-product .zmdi-share:before {
    color: #000;
}
.fnb .itemsList .itemGrid:only-of-type {
    max-width: 432px;
}

.market .itemsList .itemGrid:only-of-type {
    max-width: 270px;
}
@media (max-width: 768px) {
    .share-product {
        height: 30px;
        width: 30px;
        top: 11px;
        left: 55px;
        right: auto;
        z-index: 100;
    }

    .cont .share-product {
        display: none;
    }
.market .itemsList .itemGrid:only-child {
    max-width: 500px;
    width: 100vw!important;
}

    .market .home-collection.layout1 .swiper-container ul.case:has(.itemGrid:only-child){
        width: 100vw!important;
    }

}



.pinch-zoom {
    font-size: 0;
}

.zmdi-linkedin::before {
    background-image: url(../images/linkedin.png);
    width: 28px;
    height: 28px;
    display: inline-block;
    background-size: cover;
    content: "" !important;
}

.zmdi-snapchat::before {
    background-image: url(../images/snapchat.png);
    width: 28px;
    height: 28px;
    display: inline-block;
    background-size: cover;
    content: "" !important;
}

.zmdi-tiktok::before {
    background-image: url(../images/tiktok.png);
    width: 28px;
    height: 28px;
    display: inline-block;
    background-size: cover;
    content: "" !important;
}

.col-description {
    position: relative;
    display: block;
    padding-left: 0px;
    padding-right: 30px;
    margin-bottom: 0;
    margin-top: -13px;
    padding-bottom: 30px;
}



.rtl .col-description {
    direction: rtl;
    padding-right: 0px;
}

.home-collection .swiper-container {
    /* width: calc(100% - 20px); */
    position: relative;
    /* overflow: hidden !important; */
    list-style: none;
    z-index: 1;
    display: inline-block;
    left: auto;
    /* margin-right: 20px; */
}

.rtl .home-collection .swiper-container {
    margin-right: 0px;
}

.showSwiperArrows .home-collection .swiper-container {
    width: calc(100% - 60px);
    margin-left: 30px;
    margin-right: 30px;
}

.home-collection .swiper-container .swiper-wrapper {
    position: relative;
    z-index: 1;
    display: flex !important;
    /* transition-property: transform, -webkit-transform; */
    /* grid-gap: 10px; */
    max-width: unset !Important;
    padding-bottom: 21px!important;
}

.market .home-collection.layout1 .swiper-container ul.case.products-listing {
    display: flex;
    align-items: stretch;
}

.home-collection .swiper-container .swiper-scrollbar {
    opacity: 1 !important;
    background-color: transparent;
    height: 5px;
}

.home-collection .swiper-container .swiper-scrollbar .swiper-scrollbar-drag {
    background-color: rgb(222 222 222);
}

.home-collection .swiper-button-prev {
    background: none;
    left: 0px;
    font-size: 30px;
    padding: 5px;
    width: 20px;
    height: 29px;
    top: 33%;
    z-index: 1;
}

.home-collection .swiper-button-next {
    background: none;
    right: 0px;
    font-size: 30px;
    padding: 5px;
    width: 20px;
    height: 29px;
    top: 33%;
    z-index: 1;
}

.market .home-collection .swiper-button-prev,
.market .home-collection .swiper-button-next {
    top: 50%;
}

.home-collection .swiper-button-prev,
.home-collection .swiper-button-next {
    display: none;
}

.showSwiperArrows .home-collection .swiper-button-prev,
.showSwiperArrows .home-collection .swiper-button-next {
    display: block;
}

#customizedModalID .swiper-button-prev {
    background: none;
    left: 12px;
    font-size: 30px;
    /* padding: 5px; */
    width: 30px;
    height: 30px;
    z-index: 1;
    background: #fff;
    border-radius: 5px;
    /* opacity: 1; */
    box-sizing: border-box;
    padding-right: 2px;
    border: 1px solid #f6f6f6;
    right: 58px;
    left: auto;
}

.rtl #customizedModalID .swiper-button-prev {
    right: auto;
    left: 21px;
}

.rtl #customizedModalID .swiper-button-next {
    right: auto;
    left: 56px;
}

#customizedModalID .swiper-button-next {
    background: none;
    right: 21px;
    font-size: 30px;
    /* padding: 5px; */
    width: 30px;
    height: 30px;
    z-index: 1;
    background: #fff;
    border-radius: 5px;
    /* opacity: 1; */
    box-sizing: border-box;
    padding-left: 4px;
    border: 1px solid #f6f6f6;
    left: auto;
}

.rtl #customizedModalID .swiper-button-next {
    right: auto;
    left: 61px;
}

#customizedModalID .oneItem .swiper-button-prev {
    display: none;
}

#customizedModalID .oneItem .swiper-button-next {
    display: none;
}

#customizedModalID .swiper-button-prev,
#customizedModalID .swiper-button-next {
    /* display: none; */
    top: 44px;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}

.showSwiperArrows #customizedModalID .swiper-button-prev,
.showSwiperArrows #customizedModalID .swiper-button-next {
    display: block;
}

.langswitcher-label {
    display: none;
}

@media(max-width:768px) {


    .home-collection .swiper-container {
        width: calc(100%);
        /* margin: 0 auto; */
        position: relative;
        /* overflow: hidden !important; */
        list-style: none;
        /* padding: 0; */
        z-index: 1;
        display: inline-block;
        left: auto;
        /* padding-left: 4px; */
        /* padding-right: 4px; */
        /* margin-left: 15px; */
        /* margin-right: 15px; */
    }

    .market .d-w .brand {
        margin-top: 12px !important;
    }
}

@media(min-width:769px) {
    .retail .layout1 li {
        max-width: 300px;
    }

    .market.has-loyalty-points .itemsList .itemGrid .priceWrap .price.has-points {
        position: absolute;
        left: 14px;
        top: -34px;
    }

    .market.has-loyalty-points .itemsList .itemGrid .priceWrap .points-price {
        position: absolute;
        left: 14px;
        top: -9px;
    }
}

@media(min-width:1024px) {
    .market.has-loyalty-points .itemsList .itemGrid .priceWrap .price.has-points {
        position: absolute;
        left: 14px;
        top: -11px;
    }

    .market.has-loyalty-points .itemsList .itemGrid .priceWrap .points-price {
        position: absolute;
        left: 14px;
        top: 13px;
    }
}


@media(max-width:768px) {
    .market .itemsList .itemGrid .priceWrap .price {
        position: absolute;
        left: 14px;
        /* top: -34px; */
    }

    .market.cols3mob .itemsList .itemGrid .priceWrap .price {
        position: absolute;
        left: 14px;
        top: -22px;
    }

    .market.has-loyalty-points .itemsList .itemGrid .priceWrap .points-price {
        position: absolute;
        left: 14px;
        top: -11px;
    }
}


.has-loyalty-points .customizedID .data .price.has-points {
    margin-bottom: 0;
}

.customizedID .data .points-price-details {
    margin-top: 2px;
    margin-bottom: 52px;
    font-size: 13px;
    color: var(--secondary-color);
    position: relative;
    display: none;
    text-transform: lowercase;
}


.has-loyalty-points .customizedID .data .points-price-details {
    display: block;
}

.has-loyalty-points .bigPrice.overbtn.show .bigPriceValue.has-points {
    position: relative;
    display: block;
    top: 7px;
}

.bigPrice.overbtn.show .points-price-big-details {
    position: relative;
    display: none;
    top: 7px;
    text-transform: lowercase;
}

.has-loyalty-points .bigPrice.overbtn.show .points-price-big-details {
    display: block;
}

.has-loyalty-points .customizedID .bigPrice .bigPriceValue.has-points {
    position: relative;
    display: block;
    top: -9px;
    height: 22px;
}

.customizedID .bigPrice .points-price-big-details {
    position: relative;
    display: none;
    top: -14px;
    text-transform: lowercase;
    font-weight: normal;
    font-size: 14px;
}

.has-loyalty-points .customizedID .bigPrice .points-price-big-details {
    display: block;
}

.has-loyalty-points .myBagModule .itemBags .price.has-points {
    float: left;
    margin-top: 5px;
    cursor: pointer;
}

.has-loyalty-points .myBagModule .itemBags .price.has-points.selected {
    color: var(--secondary-color);
    transition: color 0.1s ease;
}

.myBagModule .itemBags .price-points-toggle {
    outline: 0;
    display: none;
    /* user-select: none; */
    cursor: pointer;
    height: 18px;
    background-color: #efefef;
    border-radius: 9px;
    width: 36px;
    position: relative;
    margin-bottom: 0;
    transition: all 0.4s ease;
    float: left;
    margin-left: 8px;
    margin-top: 4px;
}

.has-loyalty-points .myBagModule .itemBags .price-points-toggle {
    display: block;
}

.has-loyalty-points .myBagModule .itemBags .price-points-toggle:before {
    display: block;
    content: "";
    width: 14px;
    height: 14px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 2px;
    right: auto;
    background-color: var(--secondary-color);
    border-radius: 12px;
    transition: all 0.4s ease;
}

.has-loyalty-points .myBagModule .itemBags .price-points-toggle.disabled {
    /* pointer-events: none;
    opacity: 0.6; */
}

.has-loyalty-points .myBagModule .itemBags .price-points-toggle.disabled:before {
    background-color: #ccc;
}

.has-loyalty-points .myBagModule .itemBags .price-points-toggle.toggled:before {
    left: 50%;
}

.myBagModule .itemBags .points-price {
    display: none;
    margin-top: 2px;
    font-size: 13px;
    color: #999;
    text-align: left;
    float: left;
    margin-left: 8px;
    text-transform: lowercase;
    margin-top: 5px;
    cursor: pointer;
}

.has-loyalty-points .myBagModule .itemBags .points-price {
    display: block;
}

.has-loyalty-points .myBagModule .itemBags .points-price.selected {
    color: var(--secondary-color);
    transition: color 0.1s ease;
}

.header-loyalty-value .progressbar {
    display: none;
}

@media (min-width:769px) {
    .has-loyalty-points .myBagModule .itemBags .price.has-points {
        /* float: none; */
        margin-top: 5px;
        cursor: pointer;
        font-size: 11px;
    }

    .has-loyalty-points .myBagModule .itemBags .price-points-toggle {
        /* float: none; */
        /* margin-left:0; */
        /* margin-right: 0; */
        margin-top: 8px;
        width: 24px;
        margin-left: 4px;
        height: 12px;
    }

    .has-loyalty-points .myBagModule .itemBags .price-points-toggle:before {
        width: 11px;
        height: 11px;
    }

    .has-loyalty-points .myBagModule .itemBags .points-price {
        /* float:none; */
        margin-left: 4px;
        /* margin-top: 4px; */
        font-size: 11px;
    }

    .has-loyalty-points .myBagModule .itemBags .itemBag .top.has-points {
        text-align: left;
    }
}

.orderdetails .myBagModule .itemBags .price-points-toggle {
    display: none !important;
}

.orderdetails .myBagModule .itemBags .points-price {
    display: none !important;
}

.myBagModule .itemBags .invoice-pts-price {
    display: none !important;
}

.orderdetails .myBagModule .itemBags .invoice-pts-price {
    display: block !important;
    padding-left: 30px;
}

.orderdetails .myBagModule .itemBags .price.has-points {
    display: none !important;
}


.tinyselect .max-qty-tooltip {
    display: none;
    position: absolute;
    top: -29px;
    min-width: 67px;
    width: auto;
    white-space: nowrap;
    right: 10px;
    font-size: 10px;
    background: #fff;
    padding: 5px;
    line-height: 10px;
    border-bottom: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 0px 6px 1px #efefef;
    text-align: center;
    padding-left: 20px;
    color: var(--primary-color);
    z-index: 5;
}

.tinyselect .max-qty-tooltip.reached-max {
    display: block;
}

.tinyselect .max-qty-tooltip:before {
    content: "\f1f8";
    font: 15px / 1 Material-Design-Iconic-Font;
    position: absolute;
    height: 8px;
    width: 8px;
    bottom: 9px;
    left: 4px;
    color: var(--primary-color);
}

.tinyselect .max-qty-tooltip:after {
    content: "";
    position: absolute;
    height: 8px;
    width: 8px;
    bottom: -6px;
    right: 34px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    transform: rotate(45deg);
    background-color: #fff;
}

.tinyselect .long-press-tooltip {
    display: none;
    position: absolute;
    top: -29px;
    min-width: 115px;
    right: 0;
    font-size: 10px;
    background: #fff;
    padding: 5px;
    line-height: 10px;
    border-bottom: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 0px 6px 1px #efefef;
}


.tinyselect .long-press-tooltip:after {
    content: "";
    position: absolute;
    height: 8px;
    width: 8px;
    bottom: -6px;
    right: 7px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    transform: rotate(45deg);
    background-color: #fff;
}

.tinyselect .fieldPlus:hover .long-press-tooltip {
    display: block;
    animation: hideMe 0s ease-in 2s forwards;
}

.tinyselect .nb {
    border: none;
    text-align: center;
}





.checkout-green-box {
    background-color: var(--primary-color);
}

.checkout-green-box .title {
    color: #fff;
    font-size: 23px;
    font-weight: bold;
}

.checkout-green-box .sub-title {
    color: #fff;
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 45px;
}

.checkout-green-box .choices-container {
    position: relative;
    display: block;
    color: #fff;
    margin-bottom: 15px;
}

.checkout-green-box .choice-title {
    position: relative;
    display: block;
    font-family: 'Roboto', sans-serif;
    font-size: 15px;
    font-weight: bold;
    padding-bottom: 17px;
    border-bottom: 1px solid var(--secondary-color);
    margin-bottom: 12px;
}

.checkout-green-box .input {
    position: relative;
    display: block;
    font-family: 'Roboto', sans-serif;
    font-size: 15px;
    font-weight: bold;
    padding-bottom: 17px;
    border-bottom: 1px solid var(--secondary-color);
    width: 100%;
    float: unset;
    margin-right: 0;
    margin-bottom: 12px;
}

.checkout-green-box .input:last-child {
    border-bottom: none;
}

.checkout-green-box .input .check .zmdi-circle-o,
.checkout-green-box .input .check .zmdi-square-o,
.checkout-green-box .input.checked .zmdi-check-square,
.checkout-green-box .input.checked .zmdi-dot-circle {
    color: #fff;
}

.checkout-green-box .label {
    padding-top: 1px;
    color: #fff;
    margin-bottom: 0;
}

.checkout-green-box.receipt .label {
    cursor: default;
}

.checkout-green-box.receipt .input {
    cursor: default;
}


.rtl .checkout-green-box .sub-title {
    text-align: right;
}

.rtl .checkout-green-box .choice-title {
    text-align: right;
}

.rtl .checkout-green-box .check {
    left: unset;
    right: 0;
}

.rtl .checkout-green-box .input .label {
    padding-left: 0;
    padding-right: 22px;
}

.rtl .newsCtrl .titleAndLegend {
    direction: rtl;
    float: right
}

.rtl .newsCtrl .itemsList .itemGrid .wrap {
    padding-right: 14px;
    padding-left: 19px;
}

.newsCtrl .itemsList .itemGrid .descBlock .date {
    font-size: 12px;
    /* margin-top: -5px; */
    pointer-events: none;
    color: #ccc;
}

.newsCtrl .itemsList .itemGrid {
    margin-bottom: 15px;
    float: none;
    background-color: #fff;
    padding-bottom: 0px;
}

.newsCtrl .itemsList .itemGrid .descBlock {
    float: none;
    background-color: #fff;
    padding-bottom: 16px;
    padding-top: 16px;
    margin-top: -4px;
}

.newsCtrl .itemsList .itemGrid .wrap {
    float: none;
}

.newsCtrl .itemsList .genBtn {
    float: none;
    margin-top: 15px
}

.news-section .itemsList .genBtn[ng-href="Home"],
.news-section .itemsList .genBtn[ng-href="home"] {
    display: none;
}

.rtl .newsCtrl .itemsList .genBtn {
    margin-right: 0;
}

.newsCtrl .itemsList .itemGrid .picture.ng-scope {
    float: none;
    padding-bottom: 100% !important;
    max-height: fit-content;
    overflow: hidden;
    height: 0px;
    margin-bottom: 0px;
    background: rgb(119 119 119 / 6%);
    width: 100%;
    -webkit-mask: none;
    margin-left: 0px;
    margin-top: 0px;
}

.checkoutID .pay-delivery-with-loyalty {
    display: none;
}

.has-loyalty-points .checkoutID .pay-delivery-with-loyalty {
    display: flex;
    position: relative;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: flex-start;
    margin-top: 15px;
    margin-bottom: 10px;
    flex-direction: row;
    cursor: pointer;
}

.checkoutID .pay-delivery-with-loyalty .check {
    position: relative;
    display: block;
    top: auto;
    left: auto;
    height: 20px;
    width: 20px;
    margin-right: 12px;
}

.checkoutID .pay-delivery-with-loyalty .delivery-fees {
    cursor: pointer;
}

.checkoutID .pay-delivery-with-loyalty .delivery-fees.selected {
    color: var(--secondary-color);
    transition: color 0.1s ease;
}

.checkoutID .pay-delivery-with-loyalty .delivery-fees-by-points {
    cursor: pointer;
}

.checkoutID .pay-delivery-with-loyalty .delivery-fees-by-points.selected {
    color: var(--secondary-color);
    transition: color 0.1s ease;
}

.checkoutID .pay-delivery-with-loyalty .price-points-toggle {
    outline: 0;
    display: block;
    cursor: pointer;
    height: 18px;
    background-color: #efefef;
    border-radius: 9px;
    width: 36px;
    position: relative;
    margin-bottom: 0;
    transition: all 0.4s ease;
    margin-left: 15px;
    margin-top: 3px;
    margin-right: 15px;
}


.checkoutID .pay-delivery-with-loyalty .price-points-toggle:before {
    display: block;
    content: "";
    width: 14px;
    height: 14px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 2px;
    right: auto;
    background-color: var(--secondary-color);
    border-radius: 12px;
    transition: all 0.4s ease;
}

.checkoutID .pay-delivery-with-loyalty .price-points-toggle.disabled {
    pointer-events: none;
    opacity: 0.6;
}

.checkoutID .price-points-toggle.disabled:before {
    background-color: #ccc;
}

.checkoutID .pay-delivery-with-loyalty .price-points-toggle.toggled:before {
    left: 50%;
}

.checkoutID .pay-delivery-with-loyalty .delivery-fees-description {
    position: relative;
    display: block;
    width: 100%;
    text-align: left;
    text-transform: capitalize;
    color: #666;
    font-size: 14px;
}

.checkoutID .pay-delivery-with-loyalty .delivery-fees-description span {
    color: var(--secondary-color);
    text-transform: none;
}

.inner-customization-wrapper {
    position: relative;
    width: 100%;
    height: auto;
}

.inner-customization-wrapper .head {
    position: relative;
    display: block;
    width: 100%;
    float: none;
    min-height: 0;
    background: none;
}

.inner-customization-wrapper .picture {
    width: 40%;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.inner-customization-wrapper .picture .swiper-container {
    width: 100%;
}

.inner-customization-wrapper .picture .swiper-slide {
    width: 100% !important;
}

.fnb .cont .inner-customization-wrapper .data {
    display: block !important;
    padding-top: 20px;
}


@media (max-width:768px) {
    .hide-on-mobile {
        display: none;
    }

    .oc-scroll {
        width: 100% !important;
        /* display: none; */
        height: 66px;
        z-index: 10;
        pointer-events: none !important;
        /* overflow: hidden !important; */
        top: auto;
        bottom: 0px;
        left: auto;
    }

    .oc-preview {
        width: 100%;
        height: 100%;
        right: auto;
        top: 0;
    }

    .oc-preview img {
        transform: none;
        margin-top: 16px;
        width: auto;
        margin-left: auto;
        margin-right: auto;
        display: block;
        height: 80%;
    }

    .swiper-pagination-pc {
        bottom: 5px;
    }

    .pc-wrapper.active .oc-selector {
        height: 400px;
    }
}

.age-restricted {
    display: none;
}

.cordova .age-restricted,
.show-age-restriction .age-restricted {
    position: absolute;
    display: block;
    width: 26px;
    height: 30px;
    right: 20px;
    top: 20px;
    z-index: 111;
    background-color: #454545;
    color: #fff;
    font-size: 13px;
    border-radius: 50%;
    text-align: center;
    line-height: 27px;
    font-weight: bold;
    padding-right: 4px;
    pointer-events: none;
    opacity: 1;
}

.cordova .age-restricted::before,
.show-age-restriction .age-restricted::before
{
    content: '+';
    position: absolute;
    right: 1px;
    width: 10px;
    height: 10px;
    font-size: 10px;
    line-height: 12px;
    top: 7px;
    font-weight: normal;
}

.cordova .age-restricted::after,
.show-age-restriction .age-restricted::after
 {
    content: attr(data-title);
    position: absolute;
    bottom: 2px;
    left: 9px;
    font-size: 6px;
    line-height: 9px;
    font-weight: normal;
    text-transform: uppercase;
}

.market .age-restricted {
    top: 45px;
    right: 10px;
}

.categories .age-restricted {
    top: 10px;
    right: 10px;
}

.cordova .product-age-restricted ,
.show-age-restriction .product-age-restricted
{
    /* opacity:0.05 !important; */
}

.age-restricted-overlay {
    display: none;
}

.cordova .product-age-restricted .age-restricted-overlay,
.show-age-restriction .product-age-restricted .age-restricted-overlay
 {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    background-color: #fffffff0;
}

.age-restricted-confirmed .product-age-restricted .age-restricted-overlay {
    display: none;
}

.age-restricted-confirmed .product-age-restricted {
    opacity: 1 !important;
}

.force-login-overlay {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    opacity: 0;
    background-color: #ffffff;
    cursor: pointer;
}

.cordova.age-restricted-not-confirmed .category-is-age-restricted,
.show-age-restriction.age-restricted-not-confirmed .category-is-age-restricted,
.cordova.age-restricted-not-confirmed .collection-is-age-restricted,
.show-age-restriction.age-restricted-not-confirmed .collection-is-age-restricted,
.cordova.age-restricted-not-confirmed .product-age-restricted,
.show-age-restriction.age-restricted-not-confirmed .product-age-restricted
 {
    display: none !important;
}

.customizedID .age-restricted {
    z-index: 25;
    top: 90px;
    right: 25px;
}

.errorpopup.show .btnClose {
    top: -42px !important;
}

.myBagModule .itemBags .customPart .inner-product {
    margin-top: 10px;
    position: relative;
    display: block;
    margin-bottom: 8px;
}

.myBagModule .itemBags .customPart .inner-product .part {
    min-height: 50px;
    padding-bottom: 8px;
}

.myBagModule .itemBags .itemBag .customPart .inner-product .casePic {
    width: 69px;
    height: 59px;
}

.myBagModule .itemBags .itemBag .customPart .inner-product .casePic .picture {
    width: 50px;
    height: 35px;
}

.myBagModule .itemBags .itemBag .customPart .inner-product .casePic .picture .backg {}

.myBagModule .itemBags .itemBag .customPart .inner-product .casePic .picture .backg .innerbagimg {}

.myBagModule .itemBags .customPart .inner-product .part .casedata {}

.myBagModule .itemBags .customPart .inner-product .part .casedata .top {
    text-align: -webkit-left;
}

.myBagModule .itemBags .customPart .inner-product .part .casedata .category {
    width: 100%;
    text-transform: uppercase;
    font-size: 10px !important;
    font-weight: bold;
    /* color: #4e4e4e; */
    text-align: left;
    margin-top: 0;
}

.myBagModule .itemBags .customPart .inner-product .part .casedata .title {
    font-size: 12px !important;
    color: #4d4d4c;
    font-weight: bold;
    width: auto;
    margin-left: 0;
    display: inline-block;
    float: none;
    padding-top: 8px;
}

.myBagModule .itemBags .customPart .inner-product .part .casedata .nb {
    font-size: 14px;
    padding-top: 6px;
    margin-right: 2px;
    float: none;
}

.myBagModule .itemBags .customPart .inner-product .part .casedata .quantity {
    width: 100%;
}

.myBagModule .itemBags .customPart .inner-product .part .casedata .price {
    width: 100%;
    float: none;
    text-align: left;
    display: block;
    font-size: 12px;
    color: #999;
    margin-top: 0;
}

.inner-customize {
    font-size: 20px;
    position: absolute;
    right: -11px;
    top: -9px;
    padding-top: 6px;
    padding-bottom: 6px;
    padding-right: 12px;
    padding-left: 12px;
}

.price.move-it-left {
    right: 35px;
}

.discountpercent:before {
    content: "";
}

@media(min-width: 959px) and (max-width: 978px) {
    body {
        visibility: visible;
        zoom: 0.95 !important;
    }
}

@media(min-width: 908px) and (max-width: 958px) {
    body {
        visibility: visible;
        zoom: 0.94 !important;
    }
}

@media(min-width: 906px) and (max-width: 948px) {
    body {
        visibility: visible;
        zoom: 0.89 !important;
    }
}

.mobileMenuWrap .applinks {
    margin-left: 25px;
    zoom: 0.9;
}

.cordova .mobileMenuWrap .applinks {
    display: none;
}

.mobileMenuWrap .lineLink.my-addresses {
    display: none;
}

.reachLocations .item .address-picture {
    position: relative;
    display: block;
    width: calc(100% + 40px);
    height: 200px;
    margin-bottom: 20px;
    left: -20px !important;
    margin-top: -20px;
}

.reachLocations .item .address-picture img {

    position: relative;

    display: block;

    width: 100%;

    height: 100%;

    object-fit: cover;
}

.reachLocations .service-type {
    position: relative;
    display: block;
    float: left;
    width: 100%;
    margin-top: 10px;
    border-top: 1px solid #eee;
    padding-top: 15px;
}

.rtl .reachLocations .service-type {
    text-align: left;
}

.reachLocations .service-type .service {
    color: #666;
    margin-right: 12px;
    padding-bottom: 16px;
    display: inline-block;
}

.rtl .reachLocations .service-type .service {
    transform: rotateY(180deg);
}

.reachLocations .service-type .service .zmdi {
    color: var(--secondary-color);
    margin-right: 2px;
    font-size: 19px;
}

.rtl .reachLocations .service-type .service .zmdi {
    float: right;
    margin-left: 6px;
    transform: rotateY(180deg);
}

.reachLocations .working-hours {
    position: relative;
    display: block;
    float: left;
    margin-top: 3px;
    color: #666;
    font-weight: bold;
    width: 100%;
    color: green;
}

.rtl .reachLocations .working-hours {
    transform: rotateY(180deg);
    text-align: right;
}

.reachLocations .working-hours .working-hours-list {
    position: relative;
    display: block;
    margin-top: 16px;
    font-size: 14px;
    font-weight: normal;
    color: #000;
}

.reachLocations .working-hours .working-hours-list .working-hours-item {
    width: 100%;
    margin-bottom: 11px;
    margin-left: 0px !Important;
    color: #333;
}

.rtl .working-hours-item {
    /* direction: ltr; */
}

.rtl .working-hours-item span {
    margin-left: 11px;
}

.reachLocations .working-hours .working-hours-list .working-hours-item .working-hours-item-day {
    width: 90px;
    display: inline-block;
}

.menuontop .cat-description {
    font-family: textfont, serif;
    font-weight: normal !important;
    font-size: 15px;
    position: relative;
    color: #666;
    margin-bottom: 20px;
    margin-top: -15px;
    display: none;
}

@media (max-width: 1300px) {
    .menuontop .MenuParts .bag {
        display: block !important;
    }

    .menuontop .MenuParts .bag.minicv {
        display: none !important;
    }
}


.multiple-brands {
    width: calc(100vw - 69px) !important;
    max-width: 361px;
}

.multiple-brands .countrieslist li.thecountry {
    font-size: 17px;
    font-weight: bold;
    color: #333;
    height: 82px;
    padding-left: 10px;
    line-height: 17px !important;
    border-bottom: 1px solid #eee;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
}

.multiple-brands .brand-logo {
    width: 100px;
    height: auto;
    margin-right: 20px;
    max-height: 70px;
    object-fit: contain;
}



.retail.has-retail-quick-add .itemsList .itemGrid {
    width: 100%;
    display: grid;
    align-content: space-between;
    margin-bottom: 0;
    /* max-width: 300px; */
    /* padding-bottom: 47px; */
    margin-bottom: 20px;
}

.retail.has-retail-quick-add .itemsList .itemGrid .genBtn.quickadd {
    position: relative;
    display: block;
    padding-top: 8px;
    float: right;
    margin-right: 12px;
    margin-top: 2px;
    text-align: center;
    width: auto;
    padding-right: 15px;
    padding-left: 15px;
    height: 32px;
    pointer-events: all;
    border-radius: 3px;
}

.rtl.retail.has-retail-quick-add .itemsList .itemGrid .genBtn.quickadd {
    padding-top: 4px;
}

.retail.has-retail-quick-add ul.case.products-listing {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(235px, 1fr));
    justify-content: space-between;
    grid-gap: 18px;
}

.relationsinline .products-listing {
    display: block !important;
}

.relationsinline .products-listing li {
    float: left;
}

.retail.has-retail-quick-add .home-collection.layout1 .swiper-container ul.case.products-listing {
    display: flex;
    align-items: stretch;
    grid-gap: 0;
}

.retail.has-retail-quick-add .home-collection.layout1 .swiper-container ul.case.products-listing .itemGrid {
    margin-bottom: 21px;
}

.retail.has-retail-quick-add .heart {
    position: absolute;
    right: 14px;
    display: inline-block;
    top: 13px;
    left: auto;
    bottom: auto;
    z-index: 22 !Important;
}

.retail .cont .heart {
    top: -4px;
    right: 0px;
}

.retail.has-retail-quick-add .favoriteBox.addToFavorites {
    bottom: -13px;
    right: 25px;
}

.sub-categories-container {
    position: relative;
    display: none;
    width: 100%;
    /* left: 303px; */
    overflow: auto !important;
    /* padding-bottom: 9px; */
    /* top: 245px; */
}

.categoryPid .sub-categories-container {
    display: block;
}

.enablesorting .categoryPid .sub-categories-container {
    /* width: calc(100% - 164px); */
    margin-left: 0px;
}

.categoryPid .sub-categories-container::-webkit-scrollbar {
    display: none;
}

.market .sub-categories-container {
    margin-top: 8px;
    /* border-bottom: 1px solid #eeeeee; */
    margin-bottom: 0px;
}

.retail .sub-categories-container {
    /* left: 305px; */
    /* width: calc(100% - 635px); */
    /* top: 131px; */
    /* border-bottom: 1px solid #eeeeee; */
}

.retail.menuontop .sub-categories-container {
    /* left: 118px; */
    /* width: calc(100% - 250px); */
    /* top: 195px; */
    /* border-bottom: 1px solid #eeeeee; */
    margin-bottom: 20px;
}

.sub-categories-container .sub-categories {
    list-style: none;
    align-items: start;
    justify-content: start;
    margin-top: 4px;
    margin-bottom: 14px;
    display: flex;
    flex-wrap: wrap;
    row-gap: 10px;
}

.rtl .sub-categories-container .sub-categories {
    direction: rtl;
}

.sub-categories-container .sub-categories .link-container {
    border-bottom: 1px solid #ddd;
    border-radius: 9px;
    /* box-shadow: 0px 0px 6px -2px #000; */
    width: fit-content;
    background-color: #fff;
    margin-right: 10px;
    cursor: pointer;
}

.rtl .sub-categories-container .sub-categories .link-container {
    margin-right: unset;
    margin-left: 10px;
}

.sub-categories-container .sub-categories .link-container.selected {
    border: 2px solid var(--primary-color);
    /* height: 22px; */
    line-height: 23px;
    /* margin-top: 1px; */
    background-color: transparent;
    box-sizing: border-box;
    display: inline-block;
}

.sub-categories-container .sub-categories .link-container .link {
    position: relative;
    display: block;
    padding-left: 16px;
    padding-right: 16px;
    /* padding-top: 8px; */
    text-decoration: none;
    font-size: 15px;
    color: #333;
    line-height: 25px;
    height: 25px;
}

.retail .sub-categories-container .sub-categories .link-container .link {
    zoom: 1.1;
}

.sub-categories-container .sub-categories .link-container.selected .link {
    color: var(--primary-color);
    font-weight: bold;
    box-sizing: border-box;
    height: 23px;
    line-height: 23px;
}

.sub-categories-container .swiper-scrollbar {
    bottom: 0;
    height: 1px;
    background-color: #eee;
}

.sub-categories-container .swiper-scrollbar .swiper-scrollbar-drag {
    background: var(--primary-color);
    box-shadow: none;
}

.sub-category-title {
    font-size: 26px;
    color: var(--primary-color);
    padding-left: 16px;
    position: relative;
}

.retail .sub-category-title {
    font-size: 20px;
    padding-left: 16px;
}

.retail.menuontop .sub-category-title {
    font-size: 30px;
    padding-left: 20px;
}

.sub-category-title:before {
    content: "»";
    color: var(--primary-color);
    position: absolute;
    display: inherit;
    left: 0;
    top: -4px;
}

.retail .sub-category-title:before {
    font-size: 23px;
}

.retail.menuontop .sub-category-title:before {
    font-size: 30px;
}

.isSearching .sub-categories-container,
.searchopen .sub-categories-container {
    display: none;
}


@media (min-width:769px) {
    body {
        background-color: #f6f6f6;
    }

    .zmdi-star:before {
        /* content: "" !important; */
    }

    .categoryPid:not(.isSearching):not(.searchopen) .has-subcategories .titleAndLegend {
        /* padding-bottom: 50px; */
    }

    .market .categoryPid:not(.isSearching):not(.searchopen) .has-subcategories .titleAndLegend {
        /* padding-bottom: 60px; */
    }

    .retail .categoryPid:not(.isSearching):not(.searchopen) .has-subcategories .titleAndLegend {
        margin-bottom: 20px;
        padding-bottom: 0;
        margin-top: 11px;
    }

    .retail.menuontop .categoryPid:not(.isSearching):not(.searchopen) .has-subcategories .titleAndLegend {
        margin-bottom: 10px;
        padding-bottom: 0;
    }

    .mobile-only {
        display: none !important;
    }

    .sub-categories-container .swiper-scrollbar {
        opacity: 1 !important;
        /* margin-top: 10px; */
        background-color: transparent;
        display: none;
    }
}

@media (max-width:1300px) {
    .sub-categories-container {
        /* width:calc(100% - 342px); */
    }

    .sub-category-title {
        display: none;
    }
}

@media (max-width:768px) {

    .sub-categories-container,
    .categoryPid .sub-categories-container {
        display: none;
    }

    .sub-categories-container.show-for-mobile {
        display: block;
        left: 0;
        width: calc(100% - 10px);
        top: 155px;
        position: fixed;
        padding-top: 25px;
        background-color: rgb(246 246 246 / 89%);
        padding-left: 5px;
        padding-right: 5px;
        /* box-shadow: rgba(204, 204, 204, 0.2) 0 12px 8px; */
        z-index: 2;
    }

    .enablesorting .categoryPid .content.has-subsubcategories {
        padding-top: 95px;
    }

    .enablesorting .categoryPid .content.has-subsubcategories {
        padding-top: 162px;
    }

    .retail.enablesorting .categoryPid .content.has-subsubcategories {
        padding-top: 136px;
    }
}


.pay-in-store-page.loading:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4)
}

.pay-in-store-page.loading::after {
    content: "";
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40px;
    height: 40px;
    margin-top: -20px;
    margin-left: -20px;
    border-radius: 50%;
    border-top: 2px solid #fff;
    border-right: 2px solid transparent;
    animation: .6s linear 0s infinite normal none running spinner;
    display: block;
}

.payinstore .bag, .payinstore .homeFilter, .payinstore #instagramfeed, .payinstore .flmenubtn {
    display: none !important;
}

.payinstore .MenuParts {
    /* height: 80px; */
}

.payinstore .MenuParts .parts {
    /* height: 76px; */
}

.payinstore .MenuParts .parts .bot {
    /* height: 77px; */
}

.pay-in-store-page {
    position: relative;
    display: block;
    width: 100%;
    height: calc(100vh - 80px);
    margin-top: 0;
}

.payinstore #wrapper {
    /* padding-top: 66px; */
}

.pay-in-store-page .pis-header {
    position: relative;
    display: block;
    height: auto;
    padding-top: 10px;
    padding-bottom: 10px;
}

.pay-in-store-page .pis-header .pis-title {
    font-family: titlefont;
    position: relative;
    display: block;
    text-align: center;
    font-size: 19px;
    color: #000;
}

.pay-in-store-page .pis-header .pis-sub-title {
    font-family: titlefont;
    position: relative;
    display: block;
    text-align: center;
    font-size: 12px;
    color: #bcbcbc;
    margin-top: 7px;
}

.pay-in-store-page .pis-body {
    background-image: url('../../config/images/pis-bg.jpg');
    height: calc(100% - 57px);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: center;
    padding-bottom: 25px;
}

.pay-in-store-page .pis-body.show-rewards-page {
    background: none;
    margin-top: -3px;
    padding-top: 0;
    height: auto;
    padding-bottom: 100px;
}

.pay-in-store-page .pis-body .pis-results-failed {
    position: absolute;
    width: calc(90% - 100px);
    left: 5%;
    bottom: 160px;
    background: #fff;
    border-radius: 11px;
    box-shadow: 0px 4px 9px #00000029;
    padding-top: 15px;
    padding-bottom: 25px;
    padding-left: 50px;
    padding-right: 50px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    align-content: center;
}

.pay-in-store-page .pis-body .pis-results-failed .pis-results-title {
    font-family: titlefont;
    position: relative;
    display: block;
    text-align: center;
    font-size: 35px;
    color: var(--primary-color);
}

.pay-in-store-page .pis-body .pis-results-failed .pis-results-text {
    font-family: textfont;
    font-weight: bold;
    position: relative;
    display: block;
    text-align: center;
    font-size: 15px;
    color: #555555;
    line-height: 19px;
    margin-top: 10px;
}

.pay-in-store-page .pis-body .pis-results-failed .pis-results-button {
    font-family: titlefont;
    position: relative;
    display: flex;
    text-align: center;
    font-size: 15px;
    color: var(--primary-color);
    height: 18px;
    margin-top: 16px;
    padding-top: 13px;
    padding-bottom: 13px;
    padding-left: 30px;
    padding-right: 30px;
    text-transform: uppercase;
    border: 1px solid var(--primary-color);
    border-radius: 11px;
    box-shadow: 0px 4px 9px #00000029;
    width: auto;
    flex-direction: row;
    align-items: center;
}

.pay-in-store-page .pis-body .pis-results-succeded {
    position: relative;
    width: calc(90% - 60px);
    background: #000;
    border-radius: 11px;
    box-shadow: 0px 4px 9px #00000029;
    padding-top: 25px;
    padding-bottom: 15px;
    padding-left: 30px;
    padding-right: 30px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    align-content: center;
    border: 1px solid var(--primary-color);
    margin-top: 10px;
}

.pay-in-store-page .pis-body .pis-results-succeded .fa-star,
.pay-in-store-page .pis-body .pis-results-succeded .fa-trophy {
    font-size: 21px;
    color: var(--main-color);
}

.pay-in-store-page .pis-body .pis-results-succeded .pis-results-text {
    font-family: textfont;
    font-weight: bold;
    position: relative;
    display: block;
    text-align: center;
    font-size: 15px;
    color: #888888;
    line-height: 25px;
    margin-top: 15px;
    /* padding-bottom: inherit; */
}

.pay-in-store-page .pis-body .pis-results-succeded .pis-results-text .pisc-active {
    color: var(--main-color);
    text-transform: capitalize;
}

.pay-in-store-page .pis-body .pis-results-succeded .pis-results-text.bottom-line {
    padding-bottom: 15px;
}

.pay-in-store-page .pis-body .pis-results-succeded .pis-results-text.bottom-line:after {
    content: "";
    position: absolute;
    display: block;
    width: 120%;
    height: 1px;
    background-color: #707070;
    margin-top: 15px;
    margin-bottom: 15px;
    left: -10%;
    bottom: -15px;
}

.pay-in-store-page .pis-body .pis-results-succeded .pis-results-button {
    font-family: titlefont;
    position: relative;
    display: block;
    color: var(--main-color);
    font-size: 15px;
    border-bottom: 1px dotted;
    padding-bottom: 5px;
    padding-top: 12px;
}

.pay-in-store-page .pis-body .pis-button {
    position: relative;
    width: 90%;
    height: 58px;
    color: #fff;
    background-color: var(--primary-color);
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-around;
    align-items: center;
    border-radius: 11px;
    box-shadow: 0px 4px 9px #00000029;
    margin-top: 30px;
}

.pay-in-store-page .pis-body .pis-button .fa-credit-card {
    font-size: 21px;
    position: absolute;
    left: 27px;
    top: 17px;
}

.pay-in-store-page .pis-body .pis-button .pis-button-text {
    font-family: titlefont;
    font-size: 15px;
}

.far-distance-notice {
    position: absolute;
    bottom: 100px;
    background-color: #fbfbc9;
    padding-top: 20px;
    left: 13px;
    z-index: 16;
    padding-bottom: 20px;
    padding-left: 20px;
    padding-right: 80px;
    height: auto;
    max-width: 270px;
    width: calc(100% - 121px);
    left: 11px;
    border-radius: 7px;
    color: #444;
    display: none;
    box-shadow: 1px 1px 13px 0px rgb(0 0 0 / 15%);
    animation: .3s linear 0s 1 normal forwards running fadeInUp2;
}

.far-distance-notice.show {
    display: block;
    animation: .3s linear 0s 1 normal forwards running fadeInUp2;
}

.far-distance-notice:before {
    content: "";
    position: absolute;
    bottom: -33px;
    left: 8px;
    /* Position the arrow to the right of the container */
    margin-top: -10px;
    /* Adjust this value to vertically center the arrow */
    border-width: 17px;
    border-style: solid;
    border-color: #fbfbc9 transparent transparent transparent;
}

.far-distance-notice .fa-circle-xmark {
    position: absolute;
    display: block;
    right: 14px;
    width: 20px;
    height: 20px;
    z-index: 22;
    color: #000;
    top: 14px;
    font-size: 22px;
}

.payinstore.checkoutID .checkoutbag,
.payinstore.checkoutID .loget-out-user-sign-button,
.payinstore.checkoutID .right.rBox,
.payinstore.checkoutID .left.rBox .loginform,
.payinstore.checkoutID .left.rBox .box_delivery,
.payinstore.checkoutID .left.rBox .secondcurr {
    display: none;
}

.payinstore.checkoutID .pay-in-store-btn {
    display: flex !important;
    opacity: 1 !important;
    font-size: 16px;
}

.payinstore.checkoutID .pay-in-store-btn.inProgress {
    opacity: 0.3 !important;
}

.payinstore.checkoutID .allCoupons {
    margin-top: 0;
}

.payinstore.checkoutID .left.rBox {
    padding-top: 0;
    margin-top: 20px !important;
}

.payinstore.checkoutID .pisc-header {
    position: relative;
    display: block;
    text-align: center;
    border-bottom: 1px solid #70707038;
    background-color: #fff;
    padding-bottom: 25px;
    padding-top: 12px;
}

.payinstore.checkoutID .pisc-header .pisc-h-title-wrapper {
    position: relative;
    display: block;
}

.payinstore.checkoutID .pisc-header .pisc-h-title-wrapper .pisc-h-title {
    font-size: 19px;
    font-family: 'titlefont';
    font-weight: bold;
    line-height: 25px;
    color: #000000;
}

.payinstore.checkoutID .pisc-header .pisc-h-title-wrapper .pisc-h-order-number {
    font-size: 19px;
    font-family: 'titlefont';
    font-weight: bold;
    line-height: 25px;
    color: var(--primary-color);
    margin-left: 4px;
}

.payinstore.checkoutID .pisc-header .pisc-h-sub-title {
    font-family: 'textfont';
    color: #BCBCBC;
    font-size: 12px;
    line-height: 15px;
    margin-top: 5px;
}

.pisc-prices-wrapper {
    list-style: none;
    position: relative;
    background-color: #fff;
    padding-top: 20px;
    padding-bottom: 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: center;
    margin-bottom: 20px;
}

.pisc-prices-wrapper .pisc-price {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    column-gap: 5px;
}



.pisc-prices-wrapper .pisc-price .pisc-price-amount {
    color: #888888;
    font-size: 16px;
    position: relative;
}

.pisc-prices-wrapper .pisc-price.checked .pisc-price-amount {
    color: #171717;
    font-weight: bold;
}

.pisc-prices-wrapper .pisc-price .zmdi {
    font-size: 19px;
}

.pisc-prices-wrapper .pisc-price.checked .zmdi.zmdi-circle-o {
    display: none;
}

.pisc-prices-wrapper .pisc-price:not(.checked) .zmdi.zmdi-circle-o {
    display: block;
    color: #888888;
}

.pisc-prices-wrapper .pisc-price.checked .zmdi.zmdi-dot-circle {
    display: block;
    color: var(--primary-color);
}

.pisc-prices-wrapper .pisc-price:not(.checked) .zmdi.zmdi-dot-circle {
    display: none;
}

.notloggedin .you-will-earn-points {
    display: none;
}

.notloggedin .pay-in-store-login-opt-wrapper {
    position: relative;
    display: block;
    background-color: #fff;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 10px;
    border-radius: 8px;
    margin-top: 25px;
    box-shadow: 0px 1px 1px 0px #ddd;
}

.notloggedin .pay-in-store-login-opt-wrapper:after {
    content: "Optional";
    color: #8a8a8a73;
    font-size: 12px;
    position: absolute;
    right: 20px;
    bottom: 21px;
}

.payinstore .you-will-earn-points {
    margin-top: 5px;
}

.notloggedin .pay-in-store-login-opt-wrapper .you-will-earn-points {
    display: flex;
    position: relative;
    margin-top: 0;
    height: 35px;
    border-bottom: 1px solid #70707038;
    padding-top: 21px;
    font-size: 15px;
    color: #888888;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    column-gap: 6px;
}


.notloggedin .pay-in-store-login-opt-wrapper .pisc-guest-email {
    width: 100%;
    padding-top: 8px;
    padding-bottom: 8px;
    font-size: 15px;
    border: none;
    margin-top: 13px;
}

.notloggedin .pay-in-store-login-notice-wrapper {
    position: relative;
    display: block;
    margin-top: 14px;
    font-size: 13px;
    color: #888888;
    text-align: center;
}

.notloggedin .pay-in-store-login-notice-wrapper span {
    color: var(--primary-color);
    border-bottom: 1px dotted var(--primary-color);
}

.you-will-earn-points .fa-star {
    color: var(--primary-color);
    font-size: 21px;
}

.rpis-wrapper {
    position: relative;
    display: block;
    /* margin-top: 20px; */
    min-height: calc(100vh - 70px);
    background-color: #F6F6F6;
}

.rpis-wrapper .pisc-header {
    position: relative;
    display: block;
    text-align: center;
    border-bottom: 1px solid #70707038;
    background-color: #fff;
    padding-bottom: 25px;
    padding-top: 12px;
}

.rpis-wrapper .pisc-header .pisc-h-title-wrapper {
    position: relative;
    display: block;
}

.rpis-wrapper .pisc-header .pisc-h-title-wrapper .pisc-h-title {
    font-size: 19px;
    font-family: 'titlefont';
    font-weight: bold;
    line-height: 25px;
    color: #000000;
}

.rpis-wrapper .pisc-header .pisc-h-title-wrapper .pisc-h-order-number {
    font-size: 19px;
    font-family: 'titlefont';
    font-weight: bold;
    line-height: 25px;
    color: var(--primary-color);
    margin-left: 4px;
}

.rpis-wrapper .pisc-header .pisc-h-sub-title {
    font-family: 'textfont';
    color: #BCBCBC;
    font-size: 12px;
    line-height: 15px;
    margin-top: 5px;
}

.rpis-wrapper .pisc-body {
    text-align: center;
    position: relative;
    display: block;
    margin-top: 30px;
    padding-bottom: 70px;
}

.rpis-wrapper .pisc-body .fa-check {
    color: var(--primary-color);
    font-size: 51px;
}

.rpis-wrapper .pisc-body .pics-title {
    color: #171717;
    font-size: 29px;
    font-family: 'titlefont';
    font-weight: bold;
    margin-top: 10px;
}

.rpis-wrapper .pisc-body .pisc-receipt-wrapper {
    position: relative;
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    background-color: #fff;
    width: 250px;
    height: auto;
    box-shadow: 0px 0px 24px #0000000A;
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px 10px 0px 0px;
    padding-top: 30px;
    padding-bottom: 0;
    padding-left: 20px;
    padding-right: 20px;
}

.rpis-wrapper .pisc-body .pisc-receipt-wrapper:after {
    content: " ";
    --mask:
        radial-gradient(29.00px at 50% calc(100% - 41.00px), #000 99%, #0000 101%) calc(50% - 40px) 0/80px 100%,
        radial-gradient(29.00px at 50% calc(100% + 21.00px), #0000 99%, #000 101%) 50% calc(100% - 20px)/80px 100% repeat-x;
    -webkit-mask: var(--mask);
    mask: var(--mask);
    position: absolute;
    width: 100%;
    height: 80px;
    left: 0;
    bottom: -75px;
    background-color: #fff;
    box-shadow: 0px 0px 21px 0px #ccc;
    z-index: 9;
}

.rpis-wrapper .pisc-body .pisc-receipt-wrapper:before {
    content: " ";
    position: absolute;
    width: 100%;
    height: 30px;
    left: 0;
    bottom: -39px;
    box-shadow: 0px 0px 24px #0000000A;
    z-index: 1;
}

.rpis-wrapper .pisc-body .pisc-receipt-wrapper .pisc-line-wrapepr {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.rpis-wrapper .pisc-body .pisc-receipt-wrapper .pisc-line-wrapepr .pisc-line-title {
    color: #888888;
    font-size: 15px;
}

.rpis-wrapper .pisc-body .pisc-receipt-wrapper .pisc-line-wrapepr .pisc-line-amount {
    color: #888888;
    font-size: 13px;
    font-family: titlefont;
}

.rpis-wrapper .pisc-body .pisc-receipt-wrapper .pisc-line-wrapepr.pisc-active .pisc-line-title,
.rpis-wrapper .pisc-body .pisc-receipt-wrapper .pisc-line-wrapepr.pisc-active .pisc-line-amount {
    color: var(--primary-color);
}

.rpis-wrapper .pisc-body .pisc-receipt-wrapper .pisc-line-wrapepr.pisc-total {
    border-top: 1px solid #7070704d;
    padding-top: 14px;
    margin-top: 6px;
}

.rpis-wrapper .pisc-body .pisc-receipt-wrapper .pisc-line-wrapepr.pisc-total.no-subtotal {
    border-top: none;
    padding-top: 0;
    margin-top: 0;
}

.rpis-wrapper .pisc-body .pisc-receipt-wrapper .pisc-line-wrapepr.pisc-total .pisc-line-title,
.rpis-wrapper .pisc-body .pisc-receipt-wrapper .pisc-line-wrapepr.pisc-total .pisc-line-amount {
    color: #171717;
    font-weight: bold;
}

.rpis-wrapper .pisc-body .pisc-receipt-wrapper .pisc-line-wrapepr.pisc-total .pisc-line-title {
    font-size: 13px;
}


.rpis-wrapper .pisc-body .pisc-receipt-wrapper .pisc-line-wrapepr.pisc-total .pisc-line-amount {
    font-size: 15px;
}


.box {
    --mask:
        radial-gradient(29.00px at 50% calc(100% - 41.00px), #000 99%, #0000 101%) calc(50% - 40px) 0/80px 100%,
        radial-gradient(29.00px at 50% calc(100% + 21.00px), #0000 99%, #000 101%) 50% calc(100% - 20px)/80px 100% repeat-x;
    -webkit-mask: var(--mask);
    mask: var(--mask);
}

.rpis-wrapper .pisc-footer {
    text-align: center;
    position: relative;
    display: flex;
    margin-top: 50px;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
}

.rpis-wrapper .pisc-footer.has-prize {
    margin-top: 80px;
}

.rpis-wrapper .pisc-footer .fa-star {
    position: relative;
    display: block;
    font-size: 21px;
    color: var(--primary-color);
    margin-bottom: 6px;
}

.rpis-wrapper .pisc-footer .pisc-fotter-title {
    color: var(--primary-color);
    font-size: 15px;
    font-family: 'titlefont';
    margin-bottom: 15px;
    margin-top: 2px;
    border-bottom: 1px dotted var(--primary-color);
    padding-bottom: 6px;
}

.rpis-wrapper .pisc-footer .pisc-points-to-earn {
    color: #888888;
    font-size: 15px;
    margin-right: 30px;
    margin-left: 30px;
    max-width: 300px;
    line-height: 20px;
}

.rpis-wrapper .pisc-footer .pisc-active {
    color: var(--primary-color);
}

.rpis-wrapper .pisc-footer .pisc-underline {
    border-bottom: 1px dotted var(--primary-color);
}


.itemsList .itemGrid .picture.has-swiper .swiper-container {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    margin-left: 0px;
    margin-right: 0px;
}

.itemsList .itemGrid .picture.has-swiper .swiper-container:has(.swiper-slide:nth-child(1).swiper-slide-active) .swiper-slide:nth-child(2) {
    /* transform: translateX(50%); */
    /* position: absolute; */
    z-index: 80;
}



.itemsList .itemGrid .picture.has-swiper .swiper-button-prev {
    background: none;
    left: 0px;
    font-size: 30px;
    padding: 5px;
    width: 20px;
    height: 29px;
    top: 33%;
    z-index: 1;
    color: #333;
}

.itemsList .itemGrid .picture.has-swiper .swiper-button-next {
    background: none;
    right: 0px;
    font-size: 30px;
    padding: 5px;
    width: 20px;
    height: 29px;
    top: 33%;
    z-index: 1;
    color: #333;
}


.itemsList .itemGrid .picture.has-swiper .swiper-button-prev,
.itemsList .itemGrid .picture.has-swiper .swiper-button-next {
    top: 50%;
    display: block;
    opacity: 0;
}

.itemsList .itemGrid .picture.has-swiper .swiper-button-prev {
    transform: translateX(20px);
}

.itemsList .itemGrid .picture.has-swiper .swiper-button-next {
    transform: translateX(-20px);
}


.itemsList .itemGrid .picture.has-swiper .swiper-button-prev:before {
    content: '\f2fa';
    color: #fff;
    font-weight: normal;
    font-size: 30px;
    text-shadow: 0px 0px 4px rgb(57 57 57 / 40%);

}

.itemsList .itemGrid .picture.has-swiper .swiper-button-next:before {
    content: '\f2fb';
    color: #fff;
    font-weight: normal;
    font-size: 30px;
    text-shadow: 0px 0px 4px rgb(57 57 57 / 40%);
}

#customizedModalID .related-items .swiper-button-prev,
#customizedModalID .related-items .swiper-button-next {
    display: none;
}

.switchers {
    position: absolute;
    right: 15px;
    box-shadow: rgb(0 0 0 / 7%) 0 0 9px 0px;
    width: fit-content;
    top: 24px;
    padding-left: 0px;
    padding-right: 0px;
    height: 26px;
}

.switchers>div:first-child {
    border-right: 1px solid #f2f2f2;
}

.countryswitcher.inmenu:has(.multibrands) {}

.countryswitcher.inmenu.multibrands {
    width: auto;
    padding-right: 11px;
    padding-left: 20px;
}

.countryswitcher.inmenu.multibrands:after {
    left: 5px;
    right: auto;
}

.switchers>div:nth-child(2) {
    border-right: 1px solid #f2f2f2;
}





@media (min-width: 769px) {

    .itemGrid:hover .picture.has-swiper .swiper-button-prev,
    .itemsList .itemGrid:hover .picture.has-swiper .swiper-button-next {
        opacity: 1;
        transition: all 0.2s;
        transform: translateX(0px) translateY(0px);
    }

    .itemsList .itemGrid .picture.has-swiper .swiper-container:hover .swiper-button-prev,
    .itemsList .itemGrid .picture.has-swiper .swiper-container:hover .swiper-button-next {
        opacity: 1;
        /* z-index: 51; */
    }

    .hide-bag .bagph {
        top: 70px !important;
        height: calc(100vh - 70px) !important;
        z-index: 11;
        transform: translateX(400px);
        transition: all .2s ease-in 0s;
    }

    .rtl.hide-bag .bagph {
        transform: translateX(-310px);
    }

    .hide-bag .showminicart .bagph {
        transform: translateX(0px);
        transition: all .2s ease-out 0s;
    }

    .hide-bag .content, .market.hide-bag .content {
        width: calc(100% - 304px);
    }

    .retail.hide-bag .content {
        /* padding-left: 300px; */
        width: calc(100% - 289px);
    }

    .retail.menuontop.hide-bag .content {
        width: 100vw;
    }

    .retail .content {
        min-height: calc(100vh - 192px);
    }

    .hide-bag .footer {
        width: 100%;
        z-index: 7;
    }

    .hide-bag img.headbackimg {
        width: calc(100vw - 301px);
    }

    .hide-bag .checkoutID .bagph,
    .hide-bag .checkoutID .myBagModule.stick {
        z-index: 4;
        transform: translateX(0px);
        transition: all .3s ease 0s;
    }

    .hide-bag .checkoutID .content {
        background-color: #eee;
        width: calc(100% - 600px);
        margin-bottom: 62px;
    }

    .retail .checkoutID {
        background-color: #888;
    }

    .retail.hide-bag:not(.menuontop).checkoutID .content {
        padding-left: 312px;
        width: calc(100% - 360px);
    }
}

.reviewBox.cssType2 {
    /* min-height: calc(100vh - 170px); */
}

.reviewBox.inProgress:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100vh - 55px);
    background-color: rgb(238 238 238 / 35%);
    z-index: 100;
}

.reviewBox.inProgress::after {
    content: "";
    box-sizing: border-box;
    position: fixed;
    top: 50%;
    left: 50%;
    width: 40px;
    height: 40px;
    margin-top: -20px;
    margin-left: -20px;
    border-radius: 50%;
    border-top: 2px solid #000;
    border-right: 2px solid transparent;
    animation: .6s linear 0s infinite normal none running spinner;
    display: block;
    z-index: 101;
}

.payinstore .subTotalBox .totalPrice {
    font-size: 19px;
    font-weight: bold;
    font-family: titlefont;
}

.payinstore .subTotalBox .totalPrice:before {
    font-size: 15px;
    text-transform: capitalize;
}

.payinstore .subTotalBox .totalPrice.discount-price {
    margin-bottom: 15px;
}

.payinstore.checkoutID .auto-apply {
    margin-bottom: 20px;
}


.tips-validation {
    position: absolute;
    top: -12px;
    font-size: 10px;
    color: #333;
    right: 15px;
    border-radius: 3px;
    padding-top: 4px;
    padding-bottom: 4px;
    z-index: 2;
    text-transform: uppercase;
    box-shadow: rgba(0, 0, 0, 0.05) 0 3px 6px, rgba(0, 0, 0, 0.05) 0 3px 6px;
    background-color: #fffad3 !important;
    padding-left: 6px !important;
    padding-right: 6px !important;
}


.legacyproduct .no-price .inner-price {
    display: none
}

.legacyproduct .customizedID .genBtn.retailonly {
    width: 100%;
    float: right;
    border-radius: 0 4px 4px 0;
    max-width: 280px;
}

.legacyproduct .formPart .lines {
    border-radius: 0
}

.legacyproduct.retail .formPart .lines {
    background-color: transparent
}

.legacyproduct.productpage .meta .discountpercent {
    zoom: .8;
    margin-top: 3px
}

.legacyproduct.retail .formPart .lines .line:last-child {
    margin-top: 0
}

.legacyproduct.retail .formPart .lines {
    background-color: transparent
}

.legacyproduct .formPart .line .sold-out-item {
    display: none !important
}

.legacyproduct .size-guide-container {
    text-align: left;
    flex-direction: row-reverse;
    margin-bottom: 0
}

.legacyproduct div#sizeGuideModalID {
    box-shadow: 2px -2px 26px 9999px rgba(0, 0, 0, 0.1);
    /* margin-top: 82px; */
    overflow: hidden;
}

.legacyproduct #sizeGuideModalID .parts {
    border-radius: 0;
    overflow: auto;
}

.legacyproduct .price.nearadd {
    position: relative;
    display: inline-block;
    width: 138px;
    height: 48px;
    background: #fff;
    border: 1px solid var(--primary-color);
    margin-top: 0;
    flex-shrink: 0;
    text-align: center
}

.retail .legacyproduct .wrapCustom.add-border {
    margin-top: 0;
    padding-top: 28px;
    border-top: 1px solid #eee;
}

.customizedID .variations-wrapper {
    position: relative;
    display: block;
}

.customizedID .variations-wrapper .v-sizes-wrapper {
    position: relative;
    display: block;
    margin-bottom: 30px;
}

.customizedID .variations-wrapper .v-sizes-wrapper .v-sizes-selected-value {
    position: relative;
    display: block;
    font-size: 13px;
    color: var(--primary-color);
    text-transform: capitalize;
    margin-bottom: 14px;
}

.customizedID .variations-wrapper .v-sizes-wrapper .v-sizes-options-list {
    position: relative;
    display: flex;
    list-style: none;
    column-gap: 10px;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    row-gap: 10px;
}

.customizedID .variations-wrapper .v-sizes-wrapper .v-sizes-options-list .v-sizes-option {
    border: 1px solid #dddddd;
    height: 44px;
    padding-left: 15px;
    padding-right: 15px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #444444;
    cursor: pointer;
    border-radius: 4px;
}

.customizedID .variations-wrapper .v-sizes-wrapper .v-sizes-options-list .v-sizes-option:after {
    content: "";
    width: 100%;
    height: 100%;
    border: 2px solid #444444;
    position: absolute;
    left: -2px;
    top: -2px;
    opacity: 0;
    transition: opacity .25s ease-in-out 0s;
}

.customizedID .variations-wrapper .v-sizes-wrapper .v-sizes-options-list .v-sizes-option.selected:after {
    opacity: 1;
    border-radius: 4px;
}

.customizedID .variations-wrapper .v-sizes-wrapper .v-sizes-options-list .v-sizes-option.soldout {
    background: linear-gradient(to bottom right, transparent calc(50% - 1px), #dddddd 50%, transparent calc(50% + 1px)) no-repeat;
}

.customizedID .variations-wrapper .v-colors-wrapper {
    position: relative;
    display: block;
    margin-bottom: 50px;
}

.rtl .customizedID .variations-wrapper .v-colors-wrapper {
    direction: rtl;
}

.customizedID .variations-wrapper .v-colors-wrapper .v-colors-selected-value {
    position: relative;
    display: block;
    font-size: 13px;
    color: var(--primary-color);
    text-transform: capitalize;
    margin-bottom: 14px;
}

.customizedID .variations-wrapper .v-colors-wrapper .v-colors-options-list {
    position: relative;
    display: flex;
    list-style: none;
    column-gap: 10px;
}

.customizedID .variations-wrapper .v-colors-wrapper .v-colors-options-list .v-colors-option {
    border: 1px solid #dddddd;
    height: 36px;
    position: relative;
    display: block;
    color: #444444;
    cursor: pointer;
    border-radius: 50%;
    width: 36px;
}

.customizedID .variations-wrapper .v-colors-wrapper .v-colors-options-list .v-colors-option:after {
    content: "";
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    border: 2px solid #444444;
    position: absolute;
    left: -4px;
    top: -4px;
    opacity: 0;
    border-radius: 50%;
    transition: opacity .25s ease-in-out 0s;
}

.customizedID .variations-wrapper .v-colors-wrapper .v-colors-options-list .v-colors-option.selected {
    border: none;
    height: 38px;
    width: 38px;
}

.customizedID .variations-wrapper .v-colors-wrapper .v-colors-options-list .v-colors-option.selected:after {
    opacity: 1;
}

.customizedID .variations-wrapper .v-colors-wrapper .v-colors-options-list .v-colors-option.soldout:before {
    content: "";
    width: 1px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    background-color: #fff;
    transform: rotate(45deg);
}

.customizedID .variations-wrapper .v-colors-wrapper .v-colors-options-list .v-colors-option.iswhite.soldout:before {
    background-color: #dddddd;
}


.address-types-wrapper {
    position: relative;
    display: flex;
    width: 100%;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-around;
    height: 46px;
    margin-bottom: 18px;
    column-gap: 3px;
}

.address-types-wrapper.disabled {
    pointer-events: none;
    opacity: 0.7;
}

.address-types-wrapper .address-type {
    position: relative;
    display: flex;
    width: 33%;
    flex-wrap: nowrap;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    background-color: #f6f6f6;
    height: 100%;
    color: #777;
    cursor: pointer;
    box-sizing: border-box;
}

.address-types-wrapper.squirrelSpecialCase .address-type {
    width: 50%;
}

.address-types-wrapper .address-type:first-of-type {
    border-radius: 6px 0px 0px 6px;
}

.address-types-wrapper .address-type:last-of-type {
    border-radius: 0px 6px 6px 0px;
}

.address-types-wrapper .address-type.selected {
    border: 2px solid var(--primary-color);
    color: var(--primary-color);
}

.address-types-wrapper .address-type.disabled {
    pointer-events: none;
    opacity: 0.4;
    /* background-color: #f6f6f6; */
}

.address-types-wrapper .address-type label {
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
    line-height: 45px;
}



#loginFormID .inputWrap.verifyOTPmobilewrap {
    background: none;
    border: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

#loginFormID .verifyOTPmobilewrap .genBtn {
    margin-top: 20px;
    float: none;
    display: block;
}

#loginFormID .verifyOTPmobilewrap .text-countdown {
    top: 14px;
    right: 10px;
}

#loginFormID .verifyOTPmobilewrap .input.verify {
    width: 100% !important;
    margin: 0;
    background: none;
    border: none;
    margin-top: 12px;
    margin-bottom: 15px;
    float: none;
    position: relative;
    display: block;
}

#loginFormID .verifyOTPmobilewrap .input.verify .explain-mobile-caption {
    float: none;
}

#loginFormID .verifyOTPmobilewrap .input.verify input {
    margin-top: 12px;
    float: none;
    border: 1px solid transparent;
    border-bottom: 1px solid #ececec;
    -webkit-box-flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 100%;
    height: 46px;
    background-color: #f6f6f6;
    box-sizing: border-box;
    border-radius: 5px;
    padding-left: 12px;
}

#loginFormID .verifyOTPmobilewrap .verify-mobile {
    background: none;
    color: var(--primary-color);
    padding-right: 0;
    padding-left: 0;
    right: 12px;
    border-bottom: 1px solid var(--primary-color);
    padding-bottom: 0;
    height: auto;
    top: 17px;
    font-size: 12px;
}

#loginFormID .small-inputWrap {
    margin-top: 18px;
}

#loginFormID .small-inputWrap .inputWrap:first-child {
    display: inline-block;
    flex-shrink: 2;
    width: 100%;
    margin-right: 0
}

#loginFormID .small-inputWrap .inputWrap:last-child {
    display: inline-block;
    flex-shrink: 2;
    margin-left: 5px;
    width: 100%;
    margin-right: 0
}

#loginFormID .input.verify label.missing {
    top: 17px;
    right: 5px;
}

.cb-current-location .order-methods {
    position: relative;
    display: flex;
    list-style: none;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: bold;
    padding-top: 17px;
    padding-bottom: 18px;
    padding-left: 18px;
    padding-right: 18px;
    gap: 15px;
    justify-content: flex-start;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
}

.cb-current-location .order-methods .order-method-wrap {
    padding-left: 16px;
    /* margin-left: 30px; */
    cursor: pointer;
    white-space: nowrap;
    font-size: 13px;
    position: relative;
    width: 100%;
}

.cb-current-location .order-methods .order-method-wrap.dine-in-method{
    /* display:none; */
}
.cordova .cb-current-location .order-methods .order-method-wrap.dine-in-method{
    display:block;
}
.cb-current-location .order-methods .order-method-wrap .fa-regular {
    margin-right: 6px;
    font-size: 16px;
}

.cb-current-location .order-methods .order-method-wrap .fa-regular:before {
    position: absolute;
    margin-top: -13px;
    left: 0px;
}

.addresses-wrapper .cb-header {
    margin-bottom: 15px;
    display: none;
}

.cb-wrapper .addresses-wrapper .addresses-list {
    position: relative;
    display: flex;
    flex-direction: column;
    list-style: none;
    margin-left: 20px;
    width: calc(100% - 40px);
    margin-right: 20px;
}

.cb-wrapper .addresses-wrapper .addresses-list .address-item {
    position: relative;
    display: flex;
    width: calc(100% - 93px);
    border-bottom: 1px solid #d2d2d2;
    padding-left: 21px;
    padding-right: 60px;
    padding-top: 0px;
    padding-bottom: 10px;
    flex-direction: column;
    margin-bottom: 15px;
}

.cb-wrapper .addresses-wrapper .addresses-list .address-item:last-child {
    margin-bottom: 0px;
}

.cb-wrapper .addresses-wrapper .addresses-list .address-item .address-item-wrap {}

.cb-wrapper .addresses-wrapper .addresses-list .address-item .fa-circle,
.cb-wrapper .addresses-wrapper .addresses-list .address-item .fa-circle-dot {
    position: absolute;
    left: 0;
    top: 2px;
    font-size: 16px;
}

.cb-wrapper .addresses-wrapper .addresses-list .address-item .title {
    position: relative;
    display: block;
    font-size: 15px;
    cursor: pointer;
    margin-bottom: 6px;
    /* text-transform: uppercase; */
    font-weight: bold;
}

.cb-wrapper .addresses-wrapper .addresses-list .address-item .desc {
    position: relative;
    display: block;
    font-size: 14px;
    color: #888;
    text-transform: capitalize;
}

.cb-wrapper .addresses-wrapper .addresses-list .address-item .fa-pen {
    position: absolute;
    right: 22px;
    color: #999;
    font-size: 14px;
    padding: 10px;
    top: 0;
    z-index: 5;
    cursor: pointer;
}
.cb-wrapper .addresses-wrapper .addresses-list .address-item .fa-trash {
    position: absolute;
    right: -10px;
    color: #999;
    font-size: 14px;
    padding: 10px;
    top: 0;
    z-index: 5;
    cursor: pointer;
}
.cb-wrapper .addresses-wrapper .addAddress {
    position: relative;
    display: block;
    color: var(--primary-color);
    font-size: 12px;
    margin-top: 17px;
    cursor: pointer;
    margin-bottom: 14px;
    /* border-bottom: 1px dashed #ccc; */
    display: block;
    width: fit-content;
    margin-left: 23px;
    margin-right: auto;
    padding-bottom: 8px;
    text-transform: uppercase;
    font-weight: bold;
}

.cb-wrapper .addresses-wrapper .start-ordering {
    position: relative;
    display: flex;
    background-color: var(--primary-color);
    color: #fff;
    text-align: center;
    width: calc(100% - 30px);
    margin-left: auto;
    margin-right: auto;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    height: 46px;
    text-transform: uppercase;
    border-radius: 6px;
    margin-top: 24px;
    margin-bottom: 10px;
    font-size: 14px;
    cursor: pointer;
}

.cb-wrapper .addresses-wrapper .start-ordering.disabled {
    cursor: default;
    opacity: 0.4;
    pointer-events: none;
}


.cb-current-location .pickup-branches-filter {
    position: relative;
    display: flex;
    list-style: none;
    text-transform: uppercase;
    font-size: 20px;
    font-weight: bold;
    justify-content: flex-start;
    padding-top: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid #eee;
}

.cb-current-location .pickup-branches-filter .pickup-branches-filter-wrap {
    padding-left: 0;
    margin-left: 30px;
    cursor: pointer;
    font-size: 13px;
    position: relative;
    padding-left: 25px;
}

.cb-current-location .pickup-branches-filter .pickup-branches-filter-wrap .fa-regular {
    margin-right: 6px;
    font-size: 15px;
}

.pickup-branches-filter-wrap .fa-regular {
    position: absolute;
    left: 0px;
}

.pickup-branches-filter-wrap .zmdi-info {
    font-size: 22px;
    position: absolute;
    right: -29px;
    color: var(--primary-color);
    top: -3px;
}

.cb-current-location .locationerror {
    position: absolute;
    top: 0;
    height: 33px;
    background-color: rgba(202, 19, 103, 0.8);
    font-size: 12px;
    width: 100%;
    left: 0;
    line-height: 30px;
    text-align: center;
    overflow: hidden;
    color: #fff !important;
}

.confirming-start-over.errorpopup.has-title .title::before {
    display: none;
}

.box_date.pickordel .order-method {
    position: relative;
    display: flex;
    column-gap: 19px;
    align-items: flex-start;
    flex-direction: row;
    justify-content: flex-start;
    border-bottom: 1px solid #eee;
    padding-bottom: 15px;
    color: #4c4c4c;
    padding-right: 20px;
    padding-left: 15px;
}

.rtl .box_date.pickordel .order-method {
    direction: rtl;
}

.box_date.pickordel .order-method:has(.di) {
    border-bottom: 0px;
}

.box_date.pickordel .order-method .order-method-title {
    font-weight: bold;
    font-size: 16px;
    text-transform: uppercase;
}

.box_date.pickordel .order-method .order-method-deliveryspan {
    font-size: 16px;
    /* padding-top: 2px; */
}

.box_date.pickordel .order-method .fa-solid {
    position: absolute;
    right: -6px;
    font-size: 15px;
    top: 3px;
    cursor: pointer;
}

.rtl .box_date.pickordel .order-method .fa-solid {
    right: auto;
    left: 22px;
}

.box_date.pickordel .order-method .fa-solid:hover {}


.box_date.pickordel .order-method .order-method-closed {
    display: none
}

.no-asap-order .box_date.pickordel .order-method .order-method-closed {
    display: block;
    color: #d68a00;
    padding-top: 1px;
    font-size: 14px;
    padding-right: 6px;
}

.rtl .no-asap-order .box_date.pickordel .order-method .order-method-closed {
}

.retail .box_date.pickordel .order-method .order-method-closed {
    display: none
}

.box_date.pickordel .order-method .order-method-paused {
    display: block;
    padding-top: 2px;
}

.box_date.pickordel .order-method .order-method-paused .l1 {}

.box_date.pickordel .order-method .order-method-paused .l2 {}

.retail .box_date.pickordel .order-method .order-method-paused {
    display: none
}

.box_delivery.force-hide-map {
    min-height: 0 !important;
}

.box_delivery.force-hide-map.not-loaded {
    min-height: 72px !important;
    height: 12px;
    overflow: hidden;
}

.box_delivery.force-hide-map.not-loaded .loadinga {
    bottom: 207px;
    left: -5px;
}

.box_delivery.force-hide-map .boxData {
    min-height: 0;
}

.box_delivery.force-hide-map .boxData .location {
    min-height: 71px;
}

.box_delivery.force-hide-map .boxData .customDropDown .drop_description {
    height: 22px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
    width:100%;
}

.box_delivery.force-hide-map .boxData .customDropDown .drop_item_direction {
    font-size: 17px;
    color: #aaa;
    margin-left: 9px;
    display: none;
}

.box_delivery.force-hide-map .boxData .customDropDown {
    height: 71px;
}
.box_delivery.force-hide-map .boxData .customDropDown.has-cancel-edit-order {
    height: 60px;
}

.box_delivery.force-hide-map .drop-select {
    padding-top: 2px;
}

.box_delivery.force-hide-map .boxData .btm {
    display: none;
}

.box_delivery.force-hide-map.not-loaded .boxData {
    min-height: 301px;
}

.box_delivery.force-hide-map .boxData .office {
    margin-bottom: 0;
    height: auto;
}

.far-distance-notice.show-on-bottom {
    top: 78px;
    bottom: auto;
    border-bottom: 2px solid #ecf107;
}

.far-distance-notice.show-on-bottom:before {
    top: -20px;
    bottom: auto;
    border-color: transparent transparent #fbfbc9 transparent;
}

.customDropDown .drop_arrow .fa-angle-right {
    position: absolute;
    right: 15px;
    font-size: 21px;
    top: -3px;
    color: #4c4c4c;
}

#loginRegisterModalID .explain-mobile-caption {
    margin-bottom: 12px;
}

.errorpopup.confirming-start-over .title {
    font-size: 23px;
    color: #333;
    padding-right: 20px;
    padding-left: 20px;
    margin-bottom: 25px;
}

.errorpopup.confirming-start-over.ebottom.multiple-buttons .button {
    width: calc(50% - 5px) !important;
    margin-left: 0px;
    margin-right: 0px;
    font-weight: bold;
    font-size: 12px;
}

.errorpopup.confirming-start-over.ebottom.multiple-buttons .button:nth-child(3) {
    margin-right: 8px;
}

:root {
    --okicon-color: #85b13e;
}

:root {
    --tracking-color: var(--primary-color);
}

.approve_icon {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: block;
    stroke-width: 2;
    stroke: #fff;
    stroke-miterlimit: 10;
    margin: 40px auto;
    box-shadow: inset 0px 0px 0px var(--okicon-color);
    animation: fill 0.4s ease-in-out 0.3s forwards, scale 0.3s ease-in-out 0.9s both;
    margin-bottom: -7px;
}

.approve_icon_circle {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    stroke-width: 2;
    stroke-miterlimit: 10;
    stroke: var(--okicon-color);
    fill: none;
    animation: stroke 0.9s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.approve_icon_check {
    transform-origin: 50% 50%;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}

@keyframes stroke {
    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes scale {

    0%,
    100% {
        transform: none;
    }

    50% {
        transform: scale3d(2, 2, 1);
    }
}

@keyframes fill {
    100% {
        box-shadow: inset 0px 0px 0px 30px var(--okicon-color);
    }
}

#offerId.no-image {
    max-width: 400px;
}

#offerId.no-image .offer .picture {
    display: block;
    margin-left: 4px;
    margin-right: 0 !important;
    box-shadow: none;
    margin-bottom: 0 !important;
}

#offerId.no-image .offer .picture .title {
    padding-left: 0;
    text-transform: capitalize;
}

.myAccountPid #updateContactInfoId .inputWrap.focused .label {
    display: none !important;
}

@media (min-width: 769px) {

    .box_date.pickordel .order-method .fa-solid:hover {
    opacity: 0.8;
}
        .landingfixedlayout body[act-as="landing-page"] .content .user-greeting-wrapper{
            display:none!Important
        
    }

    .landingfixedlayout body[act-as="landing-page"] .content .header .swiper-container{
        position:relative!important;
        top: 0px!important;
    }

    body .landing-cards{
        display:none!Important 
    }
    
    .market.productpage .cont .description.retailonly {
        display: block !important;
    }

    #offerId.no-image .offer .right-side-container {
        width: 100% !important
    }
    .addresses-wrapper.no-order-method {
        display:none;
    }
}

:root {
    --tracking-color: var(--primary-color);
}

.more-descriptions-inline {
    position: relative;
    display: none;
}

.more-descriptions-inline .mr-item {
    position: relative;
    display: block;
}

.more-descriptions-inline .mr-item .mr-title {
    font-family: 'titlefont';
    font-weight: bold;
    font-size: 15px;
    border-bottom: 1px solid #000;
    margin-bottom: 14px;
    padding-bottom: 10px;
    padding-left: 30px;
    cursor: pointer;
    color: #000;
}

.more-descriptions-inline .mr-item.opened .mr-title {
    color: #000;
    border-bottom: 1px solid #000;
}

.more-descriptions-inline .mr-item .mr-title:before {
    content: '\f2f9';
    font: normal normal normal 14px/1 'Material-Design-Iconic-Font';
    position: absolute;
    left: 10px;
    top: 4px;
    font-size: 19px;
    font-weight: normal;
    transition: all .25s ease-in-out 0s;
}

.more-descriptions-inline .mr-item.opened .mr-title:before {
    content: '\f2fc';
    transition: all .25s ease-in-out 0s;
}

.more-descriptions-inline .mr-item .mr-description {
    max-height: 0;
    transition: max-height 0.35s ease-out;
    overflow: hidden;
}

.more-descriptions-inline .mr-item.opened .mr-description {
    max-height: 5000px;
    transition: max-height 0.35s ease-in;
    padding-bottom: 25px
}

.mr-description {
    font-size: 14px;
    color: #444;
    line-height: 24px;
}

.mr-description p,
h2,
h1,
h3 {
    margin-top: 22px;
}




.more-descriptions-fullpage {
    position: relative;
    display: none;
    padding-bottom: 100px;
    /* margin-top: 20px; */
}

.more-descriptions-fullpage .mr-tabs-wrapper {
    position: relative;
    display: flex;
    list-style: none;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    column-gap: 10px;
    border-bottom: 1px solid #ccc;
    padding-left: 22px;
    box-sizing: border-box;
}

.more-descriptions-fullpage .mr-tabs-item {
    padding-top: 14px;
    padding-bottom: 14px;
    color: #555555;
    font-family: 'titlefont';
    font-size: 15px;
    cursor: pointer;
    font-weight: bold;
    transition: all .25s ease-in-out 0s;
    border-bottom: 2px solid transparent;
    /* padding-left: 14px; */
    padding-right: 14px;
}

.more-descriptions-fullpage .mr-tabs-item.opened {
    color: #333;
    font-weight: bold;
    border-bottom: 2px solid #333;
    transition: all .25s ease-in-out 0s;
}

.more-descriptions-fullpage .mr-description {
    position: relative;
    display: block;
    margin-top: 25px;
    transition: all .25s ease-in-out 0s;
    font-size: 15px;
    padding-left: 22px;
}

.more-descriptions-fullpage .mr-description p {
    margin-bottom: 12px;
    line-height: 141%;
}

.more-descriptions-fullpage .mr-description h3,
.more-descriptions-fullpage .mr-description h2 {
    margin-bottom: 22px;
    margin-top: 27px;
    font-size: 16px;
}

.more-descriptions-fullpage .mr-description h1 {
    font-size: 18px;
}

.more-detals-inline .more-descriptions-inline {
    display: block;
}

.more-detals-full-page .more-descriptions-fullpage {
    display: block;
    background-color: #f0f0f0;
}

@media (max-width: 768px) {
    .rtl .box_date.pickordel .order-method{
        padding-right: 0px;
    }
    .rtl .box_date.pickordel .order-method .fa-solid {
    right: auto;
    left: 10px;
}

    .more-detals-full-page .more-descriptions-inline {
        display: block;
    }

    .more-detals-full-page .more-descriptions-fullpage {
        display: none;
    }
}

#mpgsPaymentsModalID.modal-parent-checkout {
    top: 80px;
}

.fnb .customizedID .sku {
    display: none;
}

.missing-notice {
    font-size: 15px;
    margin-bottom: 29px;
    text-align: center;
    color: #e1b82c;
}

.cb-current-location .cb-wrapper .close-btn {
    position: absolute;
    bottom: 19px;
    text-align: center;
    color: var(--primary-color);
    cursor: pointer;
    padding-top: 20px;
    z-index: 25;
    border-bottom: 1px dashed #666;
    font-size: 14px;
    left: 50%;
    transform: translateX(-50%);
    text-transform: capitalize;
    padding-bottom: 7px;
}

.cb-current-location .cb-wrapper .close-btn i {
    font-size: 32px;
    position: relative;
    display: block;
}

.mobile-menu-loyalty-value {
    display: none;
}

#loyaltyDetailsModalID .ph-main-title {
    display: none;
}

#loyaltyDetailsModalID .points-history {
    display: none;
}

.header-loyalty-value .how-it-works-opener {
    display: none;
}

.errorpopup .countrieslist li.thecountry .subTitle {
    position: relative;
    display: block;
    width: 100%;
    margin-top: 6px;
    font-size: 13px;
    color: #2e2e2e;
    font-weight: normal;
}

.menuontop .deskmenu .pages li.md-src.onmenu {
    position: relative;
    /* float: left; */
    width: 0px;
    display: none;
}

.menuontop.slimmenu .socials.menuList {
    display: none;
}

.market .zmdi-star-outline:before {
    content: '\e500';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    opacity: 0.95;
    margin-left: -9px;
    /* opacity: 0; */
}

.market .menuqlinks .zmdi-star-outline:before {
    content: '\f004';
    opacity: 1;
    font-size: 25px;
}

.market .zmdi-star:before {
    content: '\f004';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    opacity: 0.95;
    margin-left: -7px;
}

@media (max-width: 1400px) and (min-width: 768px) {
    .menuontop.slimmenu .MenuParts.fix .parts {
        width: calc(100% - 30px);
    }

    .menuontop.slimmenu .MenuParts .logo.ontop {
        left: 46px;
    }

    .menuontop.slimmenu .deskmenu {
        left: 10%;
    }

}

@media (max-width: 1280px) and (min-width: 768px) {
    .menuontop.slimmenu .MenuParts.fix .parts {
        width: calc(100% - 30px);
    }

    .menuontop.slimmenu .MenuParts .logo.ontop {
        left: 29px;
    }

    .menuontop.slimmenu .deskmenu {
        left: 100px;
    }

}

.share-product.onimg {
    display: block;
    top: 71px;
    right: 21px;
    left: auto;
    background: rgb(0 0 0 / 31%);
}

.market.productpage .share-product.onimg {}



.share-product .zmdi-share:before {
    font-size: 20px;
    margin-left: 6px;
    top: 5px;
    position: absolute;
    content: '\f35b';
    color: #fff !important;
}

.share-product.onimg .zmdi-share:before {
    content: '\f35b';
}

.camplace {
    /* position: absolute; */
    background: transparent;
    color: #000;
    width: calc(100vw - 60px);
    margin: auto;
    height: calc(100% - 232px);
    border-radius: 6px;
    text-align: center;
    /* padding-top: calc(50% - 32px); */
    box-sizing: border-box;
    text-align: center;
    display: none;
    position: relative;
    margin-top: 15px;
    margin-bottom: 15px;
}

.addresses-wrapper {
    padding-top: 14px;
    width: calc(100% - 30px);
    background: #f7f7f7;
    margin: auto;
    border-radius: 7px;
    padding-bottom: 14px;
    margin-top: 20px;
}

.branchdetect {
    width: 270px;
    text-align: center;
    margin: auto;
    font-size: 18px;
    margin-top: 14px;
}

.branchdetect .out:before,
.branchdetect .off:before {
    content: '\f1f0';
    font-family: 'Material-Design-Iconic-Font';
    font-size: 30px;
    /* margin-top: 30%; */
    display: block;
    color: orange;
    margin-bottom: 14px;
}

.branchdetect .out,
.branchdetect .off {
    position: absolute;
    top: 50%;
    transform: translateY(-50%) translatex(-50%);
    left: 50%;
    margin-top: -25px;
}

.branchdetect .out span,
.branchdetect .off span {
    /* color: var(--primary-color); */
}

.branchdetect .out a,
.branchdetect .off>a {
    display: block;
    border: 1px solid var(--primary-color);
    width: fit-content;
    padding: 5px;
    border-radius: 5px;
    padding-left: 10px;
    padding-right: 10px;
    margin: auto;
    margin-top: 17px;
    color: var(--primary-color);
}

.branchdetect .off>div>a {
    color: var(--primary-color);
    font-weight: bold;
    text-decoration: underline;
    text-underline-offset: 4px;
    display: block;
    margin-bottom: 5px;
}

.branchdetect b {
    display: block;
}

.scantostart {
    width: 200px;
    margin: auto;
    font-size: 15px;
    color: #666;
    display: block;
    text-align: center;
    display: none;
}

.scannerenabled {
    background: transparent !important;
}

.scannerenabled .scantostart {
    display: block;
}

.tdet {
    font-size: 13px;
    color: #999;
    margin-top: -11px;
}

.fa-car-title.ng-scope {
    margin-bottom: 23px;
    padding-top: 7px;
}

.scannerenabled .cb-current-location .camplace {
    background-color: #000;
    /* width: calc(100vw - 0px); */
    /* margin-left: 0; */
    /* margin-right: 0; */
    display: block;
    color: #fff;
    text-decoration: none;
}

.camplace .fa-solid {
    font-size: 51px;
    display: block;
    margin-bottom: 14px;
    text-decoration: none;
    position: absolute;
    width: 100%;
    top: 50%;
    transform: translateY(-50%);
    margin-top: -17px;
}

.camplace span {
    position: absolute;
    width: 100%;
    top: 50%;
    transform: translateY(-50%);
    text-align: center;
    left: 0px;
    margin-top: 30px;
}

@media only screen and (-webkit-device-pixel-ratio: 3) and (min-device-height: 812px) and (max-device-width: 700px), only screen and (-webkit-device-pixel-ratio: 2) and (min-device-height: 896px) and (min-device-width: 414px) and (max-device-width: 700px), only screen and (-webkit-device-pixel-ratio: 3) and (min-device-height: 896px) and (min-device-width: 414px) and (max-device-width: 700px),only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3), only screen and (device-width: 320px) and (device-height: 693px) and (-webkit-device-pixel-ratio: 3) {
    html.cordova {
        background: transparent !important;
        background-color: transparent !important;
        --ion-background-color: transparent !important;
        --background: transparent !important;
    }

.cordova .has-subsubcategories .sub-categories-container.show-for-mobile {
    margin-top: 94px!important;
}
}

.receipt-pickup-branch-desc.ng-scope {
    /* width: 306px; */
    font-size: 15px;
    text-align: center;
    margin: auto;
    color: #888;
    text-align: left;
    margin-bottom: 7px;
    font-size: 14px;
    color: #404040;
    opacity: 0.41;
}

.orderstt {
    position: fixed;
    bottom: 0px;
    background: #fff;
    width: 100%;
    padding-top: 21px;
    height: 233px;
    padding-left: 16px;
    padding-right: 11px;
    box-sizing: border-box;
    border-top: 1px solid #eee;
    transition: all 0.5s linear;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
}

.orderstt {
    animation: .3s cubic-bezier(0.42, 0, 0.14, 0.93) 2s 1 normal both running fadeInUp2;
}

.receiptPid .transit .fullThankyou .case>div:not(.orderstt) {
    opacity: 0;
    transform: translateY(-260px) !important;
    transition: all 0.5s cubic-bezier(0.42, 0, 0.23, 1) 0s;
}

.receiptPid .fullThankyou .case>div:not(.orderstt) {
    transition: all 0.5s cubic-bezier(0.42, 0, 0.23, 1) 0s;
}

.receiptPid .transit .orderstt {
    height: calc(100vh);
    transition: all 0.5s cubic-bezier(0.42, 0, 0.23, 1) 0s;
}

.receiptPid .transit .orderstt>div,
.receiptPid .transit .orderstt>a {
    opacity: 0;
    transition: all 0.3s linear 0s;
}

.orderprogress {
    margin-top: 22px;
    padding-bottom: 34px;
    display: block;
    display: none;
}

a.morestt {
    /* right: 16px; */
    text-decoration: none;
    font-size: 13px;
    border: 1px solid #eee;
    padding: 14px;
    border-radius: 4px;
    padding-right: 14px;
    padding-left: 14px;
    color: var(--primary-color);
    font-weight: bold;
    position: relative;
    margin-top: 15px;
    width: calc(100% - 40px);
    display: block;
    text-align: center;
    background: var(--primary-color);
    color: #fff;
    cursor: pointer;
}

a.morestt:before {
    content: '';
    height: 100%;
    width: 0%;
    background: #fff;
    position: absolute;
    top: 0px;
    left: 0px;
    animation: 12s cubic-bezier(0.42, 0, 0.14, 0.93) 0s 1 normal both running fillleft;
    opacity: 0.3;
}

.orderprogress>div {
    height: 8px;
    width: calc(33% - 3px);
    background: #f3f3f3;
    border-radius: 23px;
    float: left;
    margin-right: 4px;
}

.orderprogress .bar1 {
    background: var(--primary-color);
}

.orderfromtable .deiveringfrom {
    display: none;
}

.views {
    display: inline-block;
    width: 125px;
    background: red;
    float: left;
    height: 35px;
    margin-right: 7px;
    padding-left: 12px;
    color: #333;
    border: 1px solid #eee;
    border-radius: 4px;
    line-height: 33px;
    background-color: #fff;
    padding-right: 7px;
    box-sizing: border-box;
    /* display: block!important; */
}

.fnb .views {
    display: block!important;
}

.rtl .views > * {float: right;}

.rtl .views > div {
    margin-left: auto;
    margin-right: 12px;
}

.views span {
    font-size: 14px;
}

.views .th {
    border-radius: 4px;
    height: 17px;
    width: 17px;
    margin-top: 8px;
    background: #333;
}

.large-menu-img .li {
    opacity: 0.2;
}

html:not(.large-menu-img) .th {
    opacity: 0.2;
}

.views .li {
    background: transparent;
    position: relative;
}

.views .li:after {
    display: inline-block;
    font: 22px / 1 Material-Design-Iconic-Font;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    content: "\F197";
    width: 19px;
    position: absolute;
    right: 3px;
    top: 0px;
    pointer-events: none;
}

.views>div {
    float: right;
    width: 22px;
    height: 22px;
    background: #ccc;
    margin-top: 6px;
    margin-left: 14px;
    cursor: pointer;
}

.sort {
    position: relative;
    float: left;
    cursor: pointer;
}

.withTitle.opayment {
    display: none;
}






.tracking-wrapper {
   display: none;
}

.homePid .tracking-wrapper {
    display: block;
    padding-top: 2px;
}
.trackingLayout .tracking-wrapper{
    display: block;
    background: #ffffff;
    padding-bottom: 11px;
}

.trackingLayout .tracking-wrapper:has(.ot-progress-4) {
    padding-bottom: 0px;
}

.tracking-wrapper .tracking-header {
    position: relative;
    display: flex;
    height: 77px;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    padding-left: 20px;
    padding-right: 20px;
    background-color: #fafafa;
    display: none;
}

.tracking-wrapper .tracking-header .order-number {
    font-size: 24px;
}

.tracking-wrapper .tracking-header .order-date {
    font-size: 14px;
    color: #404040;
    opacity: 0.41;
}

.tracking-wrapper .tracking-map {
    height: calc(100% - 114px);
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 15px;
    border-radius: 6px;
    animation: .5s cubic-bezier(0.42, 0, 0.14, 0.93) 2s 1 normal both running fadeInUp2;
}

.tracking-wrapper .tracking-footer {
    position: relative;
    display: block;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
    transition: all 0.5s ease-in-out;
    height: 158px;
}

.tracking-wrapper .tracking-footer:has(.ot-progress-4) {
    height: 151px;
}

.tracking-wrapper .tracking-footer:has(.ot-progress-4) .order-eta-title {
    border: 0px;
}

.tracking-wrapper .tracking-footer:has(.ot-progress-0) {
    height: 106px;
}

.tracking-wrapper .tracking-footer:has(.ot-progress-2) {
    height: 174px;
}

/* .tracking-wrapper .tracking-footer:has(.ot-progress-1) {
    height: 100px;
} */

.tracking-wrapper .tracking-footer:has(.ot-progress-3) {
    height: 480px;
    transition: all 0.5s ease-in-out;
}

.tracking-wrapper.ispickup .tracking-footer {
    height: 115px !important;
}

.tracking-wrapper .order-status {
    font-size: 19px;
    color: #404040;
    padding-bottom: 15px;
}

.tracking-wrapper .order-progress {
    position: relative;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.tracking-wrapper .order-progress>span {
    overflow: hidden;
}

.tracking-wrapper .order-progress .part-1 {
    width: 18%;
    height: 7px;
    background-color: #efefef;
    border-radius: 5px;
}

.tracking-wrapper .order-progress .part-2 {
    width: 18%;
    height: 7px;
    background-color: #efefef;
    border-radius: 5px;
}

.tracking-wrapper .order-progress .part-3 {
    width: 60%;
    height: 7px;
    background-color: #efefef;
    border-radius: 5px;
}

.tracking-wrapper .order-progress.ot-progress-3 .part-3.pr1:after {
    width: 10%;
}

.tracking-wrapper .order-progress.ot-progress-3 .part-3.pr2:after {
    width: 90%;
}

.tracking-wrapper .order-progress.ot-progress-1 .part-1:after,
.tracking-wrapper .order-progress.ot-progress-2 .part-2:after{
    content: '';
    height: 100%;
    width: 10px;
    position: relative;
    display: block;
    /* margin-left: auto; */
    /* margin-right: auto; */
    border-radius: 5px;

    @keyframes fadeInUp {
        0% {
            opacity: 0;
            transform: translate3d(100%, 0px, 0px)
        }

        70% {
            opacity: 0;
            transform: translate3d(100%, 0px, 0px)
        }

        100% {
            opacity: 1;
            transform: translate3d(0px, 0px, 0px)
        }
    }

    ;
    animation: backnforth 0.5s ease-in-out alternate infinite;
    background: var(--tracking-color);
}

.tracking-wrapper .order-progress.ot-progress-2 .part-1:after,
.tracking-wrapper .order-progress.ot-progress-3 .part-2:after {
    content: '';
    height: 100%;
    width: 100%;
    background-color: var(--primary-color);
    position: relative;
    display: block;
    /* margin-left: auto; */
    /* margin-right: auto; */
    border-radius: 5px;
    transition: all 0.2s;
}

.tracking-wrapper .order-progress.ot-progress-2 .part-2:after {
    content: '';
    height: 100%;
    width: 10px;
    background-color: var(--tracking-color);
    position: relative;
    display: block;
    /* margin-left: 15px; */
    border-radius: 5px;
}

.tracking-wrapper .order-progress.ot-progress-3 .part-1:after,
.tracking-wrapper .order-progress.ot-progress-3 .part-2:after {
    content: '';
    height: 100%;
    width: 100%;
    background-color: var(--tracking-color);
    position: relative;
    display: block;
    margin-left: auto;
    margin-right: auto;
    border-radius: 5px;
}

.tracking-wrapper .order-progress.ot-progress-3 .part-3>span {
    height: 100%;
    width: 0%;
    background-color: var(--tracking-color);
    position: relative;
    display: block;
    border-radius: 5px;
    transition: all 3s ease-out;
    /* animation: 1000s cubic-bezier(0, 0, 0, 0.97) 1s 1 normal both running fillleft; */
}

/* .tracking-wrapper .order-progress.ot-progress-3 .part-3>span.go {
    width: 100% !important;
    transition: width 1000s cubic-bezier(0, 0, 0, 0.97);
} */

/* .tracking-wrapper.ispickup .order-progress.ot-progress-3 .part-3:after {
    width: 100% !important;
    animation: unset;
} */

.tracking-wrapper .order-progress.ot-progress-4 .part-1:after,
.tracking-wrapper .order-progress.ot-progress-4 .part-2:after,
.tracking-wrapper .order-progress.ot-progress-4 .part-3:after {
    content: '';
    height: 100%;
    width: 100%;
    background-color: var(--tracking-color);
    position: relative;
    display: block;
    margin-left: auto;
    margin-right: auto;
    border-radius: 5px;
}

.tracking-wrapper .order-status-subtitle {
    font-size: 14px;
    color: #404040;
    opacity: 0.41;
    padding-bottom: 16px;
}

.tracking-wrapper .order-status-subtitle.with-waarning {
    color: #ffaa00;
    opacity: 1;
}

.tracking-wrapper .order-eta-title {
    border-top: 1px solid #dad9d9;
    padding-top: 15px;
    text-align: left;
    font-size: 14px;
    color: #000000;
    margin-bottom: 3px;
}

.ispickup .order-eta-title {
    display: none;
}

.tracking-wrapper .order-eta {
    font-size: 18px;
    color: #000000;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    position:relative;
}

.ispickup .order-eta {
    display: none;
}

.tracking-wrapper .order-eta .fa-clock {
    margin-right: 5px;
    font-size: 18px;
}

.trackingLayout .orderstat {
    display: none;
}

.trackingLayout .orderdet {
    width: 100%;
    border-top: 16px solid #f6f6f6;
}

.trackingLayout .orderReview .orders .order {
    /* min-height:111px; */
    height: auto;
}

.categoriesSlider {
    overflow-x: auto !important;
}

.snap-container {
    display: flex;
    align-items: stretch;
    width: 100%;
    overflow: auto;
    scroll-snap-type: x mandatory;
}

.snap-container>div {
    width: 100%;
    flex-shrink: 0;
    scroll-snap-align: start;
    scroll-snap-stop: always;
    /* transition: display 0s linear 0.5s; */
}

.snap-container>div.current+div~div {
    display: none;
}

.scanqrcode #wrapper .deskmenu {
    display: none !important;
}

.orderdetails .elt .ttl {
    margin-top: 7px;
}

.orderdetails .elt .timing {
    font-size: 13px;
    opacity: 0.4;
    font-weight: bold;
    margin-top: -2px;
    display: block;
}

.categoriesSlider.swiper-container .swiper-wrapper .swiper-slide.no-products {
    height: calc(100vh - 150px);
    /* background: linear-gradient(45deg, #f9f9f9, #f5f5f5, #f0f0f0, #ffffff, #e6e6e6, #e6e6e6, #ebebeb, #f0f0f0, #f5f5f5, #f9f9f9); */
    /* background-size: 400% 400%; */
    /* animation: gradientAnimation 3s ease infinite; */
    background: transparent;
}

.itemsList.categoriesSlider img {
    animation: none;
}

.previous-added-items {
    position: relative;
    display: block;
    width: calc(100% - 22px);
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
    padding-left: 16px;
    padding-right: 18px;
    padding-top: 20px;
    border-radius: 10px 10px 0px 0px;
    box-shadow: 0px 0px 24px #0000000A;
    height: auto;
    margin-bottom: 25px;
    margin-top: 50px;
    padding-bottom: 30px;
    box-sizing: border-box;
}


.previous-added-items .pai-header {
    position: relative;
    display: flex;
    column-gap: 4px;
    align-items: baseline;
}

.previous-added-items .pai-header .pai-view,
.previous-added-items .pai-header .pai-hide {
    display: none;
    font-size: 15px;
    color: var(--primary-color);
    border-bottom: 1px dotted;
    padding-bottom: 3px;
    position: absolute;
    right: 0;
    top: 3px;
}

.previous-added-items:not(.show) .pai-header .pai-view {
    display: block;
}

.previous-added-items.show .pai-header .pai-hide {
    display: block;
}

.previous-added-items .pai-header-nb {
    font-size: 24px;
    font-weight: bold;
    color: var(--primary-color);
    line-height: 22px;
    min-width: 20px;
}

.previous-added-items .pai-header-title {
    color: #2A2A2A;
    font-size: 15px;
    font-weight: bold;
    position: relative;
    display: block;
    width: 100%;
}

.previous-added-items .pai-products {
    position: relative;
    display: block;
    padding-bottom: 0px;
    max-height: 0;
    transition: max-height 0.5s ease;
    overflow: hidden;
}

.previous-added-items.show .pai-products {
    max-height: 2000px;
    transition: max-height 1s ease;
}

.previous-added-items .pai-products .pai-item {
    position: relative;
    display: flex;
    column-gap: 4px;
    align-items: baseline;
    margin-top: 12px;
}

.previous-added-items .pai-products .pai-item.last-product {
    /* margin-bottom: 30px; */
}

.previous-added-items .pai-products .pai-item .pai-item-nb {
    font-size: 18px;
    font-weight: bold;
    color: var(--primary-color);
    width: 20px;
}

.previous-added-items .pai-products .pai-item .pai-item-data {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    padding-bottom: 12px;
    align-items: flex-start;
    flex-wrap: wrap;
}

.previous-added-items .pai-products .pai-item.first-product .pai-item-data {
    padding-top: 25px;
    margin-top: 10px;
}

.previous-added-items .pai-products .pai-item .pai-item-data:after {
    content: '';
    height: 1px;
    width: 100%;
    background-color: #707070;
    position: absolute;
    bottom: 0;
    left: 0;
    opacity: 0.14;
}

.previous-added-items .pai-products .pai-item.first-product .pai-item-data:before {
    content: '';
    height: 1px;
    width: 100%;
    background-color: #707070;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.14;
}

.previous-added-items .pai-products .pai-item .pai-item-data .pai-item-title {
    color: #2A2A2A;
    font-size: 15px;
    font-weight: normal;
    position: relative;
    display: block;
}


.previous-added-items .pai-products .pai-item .pai-item-data .pai-item-price {
    color: #888888;
    font-size: 13px;
    position: relative;
    display: block;
}

.previous-added-items .pai-products .pai-item .pai-item-data .pai-item-price.set-as-bold {
    color: #070707;
    font-size: 14px;
}

.previous-added-items .pai-products .pai-item .pai-item-data .pai-cust-item {
    position: relative;
    display: flex;
    width: 100%;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 10px;
}

.previous-added-items .pai-products .pai-item .pai-item-data .pai-cust-item.first-item {
    margin-top: 30px;
}

.previous-added-items .pai-products .pai-item .pai-item-data .pai-cust-item .pai-cust-type {
    color: #7B7676;
    font-size: 11px;
    text-transform: uppercase;
    width: 23%;
    margin-right: 2%;
}

.previous-added-items .pai-products .pai-item .pai-item-data .pai-cust-item .pai-cust-elements {
    position: relative;
    display: block;
    width: 75%;
}

.previous-added-items .pai-products .pai-item .pai-item-data .pai-cust-item .pai-cust-elements .pai-cust-element {}

.previous-added-items .pai-products .pai-item .pai-item-data .pai-cust-item .pai-cust-elements .pai-cust-element .pai-cust-element-data {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2px;
}

.previous-added-items .pai-products .pai-item .pai-item-data .pai-cust-item .pai-cust-elements .pai-cust-element .pai-cust-element-data .pai-cust-name {
    color: #B4B4B4;
    font-size: 11px;
    text-transform: uppercase;
    margin-right: 5px;
}

.previous-added-items .pai-products .pai-item .pai-item-data .pai-cust-item .pai-cust-elements .pai-cust-element .pai-cust-element-data .pai-cust-price {
    color: #888888;
    font-size: 13px;
    text-align: right;
}

.previous-added-items .pai-products .pai-item .pai-item-data .pai-item-total-price {
    color: #070707;
    font-size: 14px;
    font-weight: bold;
    width: 100%;
    text-align: right;
}

.previous-added-items:after {
    content: " ";
    --mask: radial-gradient(29px at 50% calc(100% - 41px), #000 99%, #0000 101%) calc(50% - 40px) 0/80px 100%,
        radial-gradient(29.00px at 50% calc(100% + 21.00px), #0000 99%, #000 101%) 50% calc(100% - 20px)/80px 100% repeat-x;
    -webkit-mask: var(--mask);
    mask: var(--mask);
    position: absolute;
    width: 100%;
    height: 35px;
    left: 0;
    bottom: -28px;
    background-color: #fff;
    /* box-shadow: 0px 0px 21px 0px #ccc; */
    z-index: 9;
}

.btn-actions-wrapper {
    background-color: #fff;
    padding-top: 5px;
    padding-bottom: 30px;
}

.btn-actions-wrapper .genBtn {
    width: calc(100% - 20px) !important;
    margin-bottom: 0px !important;
}

.btn-actions-wrapper .genBtn.action-1 {
    background: transparent;
    border: 1px solid var(--primary-color);
    color: #000;
}

.genBtn.full.action-1 {
    background-color: #fff!important;
    color: var(--main-color)!important;
    border: 1px solid var(--main-color)!important;
}

.btn-actions-wrapper .dine-in-payment-note {
    font-size: 15px;
    text-align: center;
    width: calc(100% - 72px);
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
}

.market .inproduct #wrapper {
    background: #fff;
}


.pia-partial-receipt {
    position: relative;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    padding-top: 62px;
    padding-bottom: 82px;
}

.pia-partial-receipt .okicon .approve_icon {
    margin-top: 0;
    margin-bottom: 15px;
}

.pia-partial-receipt .pia-pr-title {
    position: relative;
    display: block;
    font-size: 26px;
    color: #000000;
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 15px;
}

.pia-partial-receipt .pia-pr-description {
    font-size: 15px;
    text-align: center;
    padding-right: 10%;
    padding-left: 10%;
    margin-bottom: 5px;
}

.pia-partial-receipt .pia-pr-bold {
    font-weight: bold;
}

.pia-pr-btns-wrapper {
    position: relative;
    display: flex;
    column-gap: 10px;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-evenly;
    width: calc(100% - 12px);
    margin: auto;
}

.pia-pr-btns-wrapper .genBtn.pia-pr-pay-btn {
    background-color: #000;
}

.pia-pr-btns-wrapper .genBtn.pia-pr-pay-btn:before {
    content: "\f09d";
    font-family: "Font Awesome 6 Free";
    margin-right: 16px;
    font-size: 17px;
}

/**
 * ==============================================
 * Dot Falling
 * ==============================================
 */
.dot-falling {
    position: relative;
    display: block;
    width: 40px;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
    margin-top: 10px;
    margin-bottom: 5px;
}

.dot-falling-1 {
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: var(--primary-color);
    color: var(--primary-color);
    animation: dot-falling-before 1s infinite linear;
    animation-delay: 0s;
    display: inline-block;
    position: relative;
}

.dot-falling-2 {
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: var(--primary-color);
    color: var(--primary-color);
    animation: dot-falling 1s infinite linear;
    animation-delay: 0.1s;
    display: inline-block;
    position: relative;
}

.dot-falling-3 {
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: var(--primary-color);
    color: var(--primary-color);
    animation: dot-falling-after 1s infinite linear;
    animation-delay: 0.2s;
    display: inline-block;
    position: relative;
}

.postalCode-autocomplete .input {
    width: 100% !important;
}

.postalCode-autocomplete .input .getAddress_autocomplete_container {
    position: relative;
    display: block;
    width: calc(100% - 10px);
    height: 100%;
    padding-left: 10px;
}

.getAddress_autocomplete_list {
    top: 47px;
    max-height: 192px !important;
    overflow: auto;
    padding: 0;
    /* padding-top: 4px; */
    padding-bottom: 4px;
    border-radius: 0px 0px 10px 10px;
    width: calc(100% + 4px);
    box-shadow: 0 0 0 1px #ddd;
    border: 0px !important;
    left: -1px;
}

.getAddress_autocomplete_suggestion {
    position: relative;
    display: block;
    font-size: 13px;
    padding-bottom: 8px;
    border-bottom: 1px solid #eee;
    background-color: transparent;
    padding-top: 8px;
    color: #222;
    padding: 8px 13px 8px 13px;
}

.getAddress_autocomplete_suggestion:last-child {
    border-bottom: 0px solid #eee;
}

.getAddress_autocomplete_suggestion:hover,
.getAddress_autocomplete_suggestion_focused {
    background-color: #efefef;
}

#AddAddressModalID #addressFormId .wrap.haspostalcodeservice {
    display: flex;
    column-gap: 20px;
    flex-direction: column;
    justify-content: space-around;
}


.getAddress_autocomplete_list::-webkit-scrollbar {
    width: 7px;
}

.getAddress_autocomplete_list::-webkit-scrollbar-thumb {
    background: #ddd;
    border-radius: 7px;
}

::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0;
}

::-webkit-scrollbar-corner {
    background-color: transparent;
}

div#AddAddressModalID.postal-code-service {
    overflow: visible;
}

div#AddAddressModalID.postal-code-service .parts {
    min-width: 350px;
}

@media (min-width: 1551px) {
    body {
        visibility: visible
    }

    .checkoutID .reviewBox .rBox.left {
        margin-left: 10px;
        width: calc(40% - 10px);
    }
}

/* total width */
.layout3 ul::-webkit-scrollbar {
    background-color: transparent;
    width: 2px;
}

.layout3 ul::-webkit-scrollbar-track {
    background-color: transparent width: 2px;
}

/* scrollbar itself */
.layout3 ul::-webkit-scrollbar-thumb {
    background-color: #dedede;
    border: 6px solid transparent;
    border-radius: 9px;
    background-clip: content-box;
}

/* set button(top and bottom of the scrollbar) */
.layout3 ul::-webkit-scrollbar-button {
    display: none;
}

.retail .classic-retail .meta .price {
    margin-bottom: 0px;
    float: none;
}

.box.passedit.ng-scope {}

.categoriesSlider {
    overflow-x: auto !important;
}

.snap-container {
    display: flex;
    align-items: stretch;
    width: 100%;
    overflow: auto;
    scroll-snap-type: x mandatory;
}

.snap-container>div {
    width: 100%;
    flex-shrink: 0;
    scroll-snap-align: start;
}

@media (max-width: 460px) {
    .box_instruction.hosted-session .other-payments {
        margin-top: 5px;
    }
}

@media (max-width: 380px) {
    .box_instruction .hosted-payment-wrapper .gw-proxy-number {
        width: 194px !important;
    }

    .multibranch .deiveringfrom {
        width: 128px !important;
    }
}

.box_instruction .hosted-payment-wrapper {
    width: 102%;
}


.scanqrcode .header-loyalty-value {
    display: none;
}

.scanqrcode .accname,
.payinstore .accname {
    display: flex;
}

.payinstore .header-loyalty-value {
    right: 14px!important;
}


.pay-in-store-page .reward-wrapper.loyalty-rewards .reward-page-title {}

.pay-in-store-page .reward-wrapper.loyalty-rewards .reward-page-title:after {
    content: '';
    display: none !important;
}

.pay-in-store-page .reward-wrapper.loyalty-rewards .reward-page-instructions {
    /* color: #fff; */
    font-weight: bold;
    margin-top: 70px;
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
}

.orderdetails .location .edit .dir {
    top: 0;
    height: 100%;
    display: flex;
    text-decoration: none;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
}

.m-b-0 {
    margin-bottom: 0 !important;
}

.m-t-0 {
    margin-top: 0 !important;
}

/* #region Challenges */
.challenges-wrapper {
    color: #000;
    /* padding-top: 22px; */
    padding-bottom: 120px;
}

.challenges-wrapper .page-title {
    /* color: #fff; */
    font-family: "titlefont";
    font-size: 34px;
    line-height: 41px;
    margin-top: 60px;
    text-align: center;
    /* color: #333; */
}

.challenges-wrapper .page-title::before {
    content: "\f5a2";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: var(--fa-display, inline-block);
    font-style: normal;
    font-variant: normal;
    line-height: 1;
    text-rendering: auto;
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    display: block;
    /* color: #000; */
    margin-bottom: 17px;
    opacity: 0.89;
    margin-top: -34px;
}

.challenges-wrapper .page-subtitle {
    color: #979797;
    margin-top: 2px;
    text-align: center;
    font-size: 16px;
    line-height: 19px;
    max-width: 250px;
    margin: auto;
}

.challenge-item {
    display: flex;
    padding: 21px;
    border-radius: 8px;
    overflow: hidden;
    align-items: center;
}

.rtl .challenge-item {
    direction: rtl;
}

.challenges-listing {
    padding: 0 13px;
    margin-top: 45px;
}

.challenge-item~.challenge-item {
    /* margin-top: 30px; */
}

.challenge-item .challenge-img {
    margin-bottom: 10px;
    width: 80px;
    overflow: hidden;
    text-align: center;
}

.challenge-item:not(.challenge-completed) .challenge-img {
    opacity: 0.7;
}

.challenge-img img {
    width: 100%;
}

.challenge-item .challenge-title {
    /* color: #111; */
    font-family: "titlefont";
    font-size: 16px;
    line-height: 14px;
    max-width: 60px;
    text-align: center;
}

.challenge-item .challenge-subtitle {
    font-weight: bold;
    font-size: 14px;
    line-height: 19px;
    text-transform: uppercase;
    margin-bottom: 3px;
    width: 100%;
    /* color: #000; */
}

.challenge-item .challenge-description {
    font-size: 14px;
    line-height: 19px;
    color: rgb(114 114 114);
    margin-bottom: 0px;
    width: 100%;
}

.challenge-item .challenge-steps {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 10px;
    column-gap: 10px;
    margin-top: 5px;
}

.challenge-item .challenge-step {
    font-size: 18px;
    color: rgb(139 138 138 / 25%);
}

.challenge-item .challenge-step .fa-circle-check {
    color: var(--main-color);
}

.challenges-wrapper .fa-circle-check.pending {
    opacity:0.4;
}

.challenge-item .challenge-step.challenge-completed {
    color: var(--highlighted-color);
}

.challenge-item .challenge-step~.challenge-step {
    margin-left: 0;
}

.challenge-item .challenge-step~.challenge-step .fa-circle-check {
    /* color: var(--primary-color); */
}

.challenge-item:not(.challenge-completed) .challenge-action {
    display: none;
}

.challenge-item .challenge-action {
    background-color: var(--highlighted-color);
    font-family: "titlefont";
    font-size: 15px;
    line-height: 23px;
    border-radius: 5px;
    color: #000;
    min-width: 75px;
    display: block;
    text-align: center;
}

.challenge-item .challenge-section:first-child {
    min-width: 96px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.challenge-section:has(img:not([src])) {
    display: none!important;
}

.challenge-item .challenge-section:nth-child(2) {
    padding: 0 10px;
    display: flex;
    flex-wrap: wrap;
    column-gap: 18px;
}

.challenge-progress {
    position: relative;
    display: block;
    height: 6px;
    width: 140px;
    background-color: #9494943d;
    margin-top: 30px;
    margin-left: 7px;
    border-radius: 10px;
}

.challenge-progress .fa-location-pin {
    position: absolute;
    font-size: 20px;
    top: -20px;
    color: var(--main-color);
    left: var(--location-pos);
}

.challenge-completed .challenge-progress .fa-location-pin {
    color: var(--highlighted-color);
    left: calc(100% - 7.5px) !important;
}

.challenge-progress .challenge-progress-bar {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    max-width: 100%;
    background-color: var(--highlighted-color);
    border-radius: 10px;
    width: var(--pos);
}
.challenge-progress .pending-amount {
    position: absolute;
    top: 0;
    height: 100%;
    max-width: 100%;
    background-color: var(--main-color);
    /* opacity: 0.4; */
    z-index: 5;
    border-radius: 10px;
    left: var(--pos);
    width: var(--pending-width);
}
.challenge-info{
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    margin:auto;
    justify-content: space-around;
    background-color: #ebebeb;
    padding-top: 30px;
    padding-bottom: 30px;
    border-radius: 10px;
    margin-top: 80px;
    animation: 0.3s cubic-bezier(0.42, 0, 0.14, 0.93) 1s 1 normal both running fadeInUp2;
    max-width: 318px;
    margin-bottom: 110px;
}
.challenges-listing .challenge-info .challenge-info-type{
    
position: relative;
    
display: flex;
    
flex-direction: row;
    
flex-wrap: nowrap;
    
align-items: center;
    
justify-content: flex-start;
    
column-gap: 5px;
}
.challenges-listing .challenge-info .challenge-info-type i{
    color: var(--main-color);
    margin-right: 4px;
    font-size: 18px;
}
.challenges-listing .challenge-info .challenge-info-type i.fa-circle{
    opacity:0.4;
}
/* #endregion */

/* #region Spin The Wheel */
body.spinthewheel {
    background-image: url("../images/spin-the-wheel-center-background.svg") !important;
    background-position: center !important;
    ox; */
}

body.spinthewheel .MenuParts .parts .bot {
    background-color: transparent;
}

body.spinthewheel #wrapper {
    background-color: transparent;
    min-height: calc(100vh - 29px);
}

html.show-footer-menu body.spinthewheel .footermenu {
    display: none;
}

.spin-the-wheel-wrapper {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-content: center;
    align-items: center;
    height: calc(100vh - 110px);
}

.spin-the-wheel-wrapper .page-title {
    font-family: "titlefont";
    color: #fff;
    font-size: 52px;
    line-height: 63px;
    text-align: center;
    margin-bottom: -10px;
}

.spin-the-wheel-wrapper .page-title::before {
    content: "SPIN";
    display: block;
    color: var(--main-color);
    margin-bottom: -17px;
}

.spin-the-wheel-wrapper .wheel {
    position: relative;
    animation-name: fade-in-animation;
    animation-duration: 4s;
}

.spin-the-wheel-wrapper .wheel-frame {
    position: absolute;
    z-index: 1;
    width: calc(100% + 68px);
    height: calc(100% + 70px);
    background-image: url("../images/spin-the-wheel-frame.png") !important;
    background-position: center;
    top: -32px;
    margin: auto;
    left: -35px;
    background-repeat: no-repeat;
    background-size: 100%;
    pointer-events: none;
}

.spin-the-wheel-wrapper .wheel-canvas:before {
    content: '';
    position: absolute;
    display: block;
    z-index: 3;
    width: 32px;
    height: 42px;
    background-image: url("../images/wheel-marker.png");
    background-position: center;
    top: -25px;
    margin: auto;
    left: calc(50% - 18px);
    background-repeat: no-repeat;
    background-size: contain;
}

.spin-the-wheel-wrapper .wheel-canvas canvas{
    z-index: 2;
}

.spin-the-wheel-wrapper .wheel-canvas:after{
    content:'';
    position:absolute;
    width: calc(100% - 6px);
    height: calc(100% - 6px);
    background: #fff;
    z-index: 1;
    border-radius: 100%;
    left: 3px;
    top: 3px;
}

.spin-the-wheel-wrapper .wheel-canvas {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 2;
}

.spin-the-wheel-wrapper .wheel-center {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 3;
    width: 60px;
    height: 60px;
    background-image: url("../images/spin-the-wheel-center.svg");
    top: 40px;
    bottom: 0;
    margin: auto;
    left: 0;
    right: 0;
}

.spin-the-wheel-wrapper .page-close {
    margin-top: 10px;
    color: #fff;
    font-size: 17px;
    text-align: center;
    transition: all 0.2s;
    position: relative;
    text-decoration: underline;
    cursor: pointer;
}

.spin-the-wheel-wrapper .reward-wrapper {
    position: relative;
    width: 100%;
    padding: 0 16px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    top: 0;
    margin-top: 51px;
}

.spin-the-wheel-wrapper .reward-page-title {
    font-family: "titlefont";
    color: #fff;
    font-size: 52px;
    line-height: 48px;
    text-align: center;
    max-width: 282px;
}

.spin-the-wheel-wrapper .reward-page-title.reward-page-title-highlighted:after {
    position: absolute;
    /* background: #fff; */
    content: "";
    width: 100%;
    height: 332px;
    left: 0;
    /* transform: translateX(-50%); */
    background: url(../../config/images/win.gif?1);
    top: 30px;
    animation: 1s cubic-bezier(0.42, 0, 0.14, 0.93) 0s 1 normal both running zoomIn;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.spin-the-wheel-wrapper .reward-lost-wrapper .reward-page-title.hardluck:before{
    content: "";
    width: 148px;
    height: 13px;
    background-color: var(--main-color);
    margin: auto;
    display: block;
    margin-bottom: 10px;
}

.spin-the-wheel-wrapper .reward-page-title.reward-page-title-highlighted{
    color: var(--main-color);
}

.spin-the-wheel-wrapper .reward-lost-wrapper .reward-page-title.reward-page-title-highlighted:after{
    content: "";
    width: 148px;
    height: 13px;
    background-color: var(--main-color);
    margin: auto;
    display: block;
    margin-bottom: 5px;
}

.spin-the-wheel-wrapper .reward-prize-wrapper .reward-title:before,
.spin-the-wheel-wrapper .reward-prize-wrapper .reward-title:after{
    content: "";
    width: 108px;
    height: 8px;
    background-color: var(--main-color);
    margin: auto;
    display: block;
}

.spin-the-wheel-wrapper .reward-prize-wrapper .reward-title:before{
    margin-bottom: 15px;
}

.spin-the-wheel-wrapper .reward-prize-wrapper .reward-title:after{
    margin-top: 15px;
}

.spin-the-wheel-wrapper .reward-image-wrapper {
    background-color: transparent;
    border-radius: 9px;
    max-height: calc(100vw - 40px);
    max-width: calc(100% - 20px);
    padding: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 13px;
    pointer-events: none;
    overflow: hidden;
    border: 3px solid var(--highlighted-color);
    display: none;
}

.spin-the-wheel-wrapper .reward-img {
    border-radius: 9px;
    max-width: 100%;
    object-fit: contain;
    max-height: 100%;
}

.spin-the-wheel-wrapper .reward-title {
    /* font-weight: bold; */
    color: #fff;
    font-size: 22px;
    line-height: 30px;
    margin-top: 50px;
    margin-bottom: 33px;
    text-transform: uppercase;
    font-family: "titlefont";
    font-size: 37px;
    animation: 0.6s cubic-bezier(0.42, 0, 0.14, 0.93) 0.6s 1 normal both running zoomIn;
    position: relative;
}

.spin-the-wheel-wrapper .reward-title:before {
    /* content: ""; */
    /* position: absolute; */
}

.spin-the-wheel-wrapper .reward-page-instructions {
    color: #a8a8a8;
    font-size: 17px;
    line-height: 25px;
    text-align: center;
    max-width: 350px;
    margin-top: 23px;
    max-width: 332px;
}

.spin-the-wheel-wrapper .reward-page-instructions-icon {
    color: #fff;
    display: block;
    margin-bottom: 16px;
}

.spin-the-wheel-wrapper.show-reward .page-title,
.spin-the-wheel-wrapper.show-reward .wheel,
.spin-the-wheel-wrapper:not(.show-reward) .reward-wrapper {
    opacity: 0;
    animation-name: fade-out-animation;
    animation-duration: 1s;
    display: none;
}

.spin-the-wheel-wrapper.show-reward .reward-wrapper {
    transform: translateY(0);
    opacity: 1;
    animation-name: fade-in-animation;
    animation-duration: 2s;
}

@keyframes fade-in-animation {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fade-out-animation {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

/* #region Rotating everything in order to match js */
.spin-the-wheel-wrapper .wheel {
    /* height: calc(100vw - 30px); */
    /* width: calc(100vw - 30px); */
}

.spin-the-wheel-wrapper .wheel-frame {}

.spin-the-wheel-wrapper .wheel-canvas {
    /* background: #fff; */
    /* border-radius: 100%; */
    /* width: 100%; */
}

.spin-the-wheel-wrapper .wheel-center {
    right: 0;
    top: 0;
}

/* #endregion */


html.lvl-one .spin-the-wheel-wrapper .wheel-frame{
    width: calc(100% + 12px);
    height: calc(100% + 12px);
    left: -6px;
    top: -6px;
    border-radius: 50%;
    background-image: none !important;
    background-color: #7EB363;
}

.spin-the-wheel-wrapper .wheel-center, 
.loyaltylvl1.spin-the-wheel-wrapper .wheel-center{
    background-image: none;
}

.spin-the-wheel-wrapper .wheel-center:before{
    content: 'TAP';
    box-shadow: none;
    font-family: "titlefont";
    font-size: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    position: relative;
    max-width: 60px;
    max-height: 60px;
    color: #FFF;
}

html.lvl-one .spin-the-wheel-wrapper .wheel-center:before{
    background-color: #7EB363;
    color: #FFF;
}


/* #endregion */


.user-greeting span {
    display: flex;
    font-family: "titlefont";
    /* color: #fff; */
    padding-left: 14px;
    /* padding-top: 15px; */
    flex-direction: row;
    box-sizing: border-box;
    width: 100%;
}

.rtl .user-greeting span {
    padding-left: 0px;
    padding-right: 14px;
}

.user-greeting-wrapper .user-greeting {
    /* display: flex; */
    /* font-size: 40px; */
    width: calc(100% - 40px);
    /* margin-bottom: 5px; */
}

.user-greeting-wrapper .user-greeting .static-greeting {
    color: var(--primary-color);
    /* height: 22px; */
    font-size: 21px;
    /* font-weight: bold; */
    padding-top: 13px;
}

.user-greeting-wrapper .user-greeting .dynamic-greeting {
    /* margin-top: -13px; */
    display: block;
    line-height: 25px;
    color: var(--primary-color);
    font-size: 21px;
    font-weight: normal;
    padding-bottom: 12px;
}

.user-greeting-wrapper .user-greeting .dynamic-greeting.no-static-greeting {
    margin-top: 3px;
    line-height: 40px;
}

.user-greeting-wrapper .user-loyalty {
    margin-left: auto;
    /* display: flex; */
    /* flex-wrap: wrap; */
    align-items: flex-start;
    justify-content: flex-end;
    color: var(--primary-color);
    position: absolute;
    right: 13px;
    width: auto;
    font-family: "titlefont";
    text-align: right;
    top: 14px;
}

.user-greeting-wrapper .user-loyalty .loyalty-icon {
    color: var(--primary-color);
    margin-top: 0;
    font-size: 19px;
    padding-top: 5px;
    float: left;
}

.user-greeting-wrapper .user-loyalty .loyalty-points {
    display: block;
    margin-bottom: -3px;
    font-size: 29px;
    margin-left: 4px;
    min-height: 34px;
    float: left;
}

.user-greeting-wrapper .user-loyalty .loyalty-status {
    width: 100%;
    text-align: right;
    /* margin-top: -6px; */
    font-size: 18px;
    /* line-height: 45px; */
}

.instore .landing-cards {
    display: flex !important;
    padding: 0 15px;
    flex-direction: column;
    padding-top: 15px;
    /* 421px */
    position: relative;
    z-index: 2;
    transition: 0.3s all linear;
    padding-bottom: 20px;
    margin-top: -102px;
}

.not-logged-in .landing-cards {
    /* padding-top: 40px; */
}

.landing-cards::before {
    content: "";
    width: 50px;
    height: 1px;
    background-color: rgba(255, 255, 255, 0.22);
    border-radius: 5px;
    margin: auto;
    margin-bottom: 12px;
    display: block;
}

.landing-card {
    background: #ffffff 0% 0% no-repeat padding-box;
    border: 1px solid #ddd;
    border-radius: 9px;
    color: #fff;
    font-size: 16px;
    padding: 22px;
    width: calc(100% - 23px);
    min-height: 112px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* animation: .3s cubic-bezier(0.42, 0, 0.14, 0.93) 1s 1 normal both running fadeInUp2; */
    position: relative;
    margin-left: auto;
    margin-right: auto;
}

.rtl .landing-card {
    direction: rtl;
}

.landing-card[card-for="track-delivery"] {display: block;cursor: pointer;}

.landing-card {}

.landing-card:nth-child(1) {
    animation: .3s cubic-bezier(0.42, 0, 0.14, 0.93) 1s 1 normal both running fadeInUp2;
}

.landing-card:nth-child(2) {
    animation: .3s cubic-bezier(0.42, 0, 0.14, 0.93) 1.2s 1 normal both running fadeInUp2;
}

.landing-card:nth-child(3) {
    animation: .3s cubic-bezier(0.42, 0, 0.14, 0.93) 1.5s 1 normal both running fadeInUp2;
}

.landing-card.no-animation {
    animation: none;
}

.landing-card~.landing-card {
    margin-top: 15px;
    gap: 15px;
}

.landing-card .highlighted {
    color: var(--primary-color);
    font-weight: bold;
    text-transform: uppercase;
}

.landing-card .subtitle, .landing-card .title {
    color: #777;
    font-size: 15px;
}

.landing-card .subtitle {
    margin-top: 5px;
}

.landing-card-info {
    padding-right: 17px;
}

.landing-card-info.tracking-wrapper {
    width: calc(100% - 92px);
}

.landing-card .action-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    color: rgba(0, 0, 0, 0.73);
    font-weight: bold;
    border-radius: 6px;
    padding: 7px 0px;
    box-shadow: 0px 4px 9px #0000000d;
    text-transform: uppercase;
    font-size: 10px;
    border: 1px solid #ffffff;
    white-space: nowrap;
    width: 82px;
}

.landing-card[card-for="track-delivery"] .landing-card-action {
    position: absolute;
    bottom: 46px;
    right: 12px;
    width: 53px;
    font-weight: bold;
    border: 1px solid #eee;
}

.landing-card[card-for="track-delivery"] .action-btn {
    width: 100%;
}

.landing-card .action-btn~.action-btn {
    margin-top: 9px;
}

.landing-card .action-btn.inverted {
    background-color: transparent;
    border-color: #6e6e6e;
    color: #ffffff;
    white-space: nowrap;
}

.landing-card .action-btn.inverted .action-btn-icon {
    color: rgba(255, 255, 255, 0.89);
    margin-right: 11px;
    font-size: 16px;
}

.landing-card .steps {
    display: flex;
    margin-top: 8px;
    margin-bottom: 8px;
}

.landing-card .step {
    width: 53px;
    height: 7px;
    border-radius: 5px;
    background-color: rgba(255, 255, 255, 0.2);
}

.landing-card .ot-progress-2 .step-1,
.landing-card .ot-progress-3 .step-1,
.landing-card .ot-progress-3 .step-2,
.landing-card .ot-progress-4 .step-1,
.landing-card .ot-progress-4 .step-2,
.landing-card .ot-progress-4 .step-3 {
    background-color: var(--highlighted-color);
}

.landing-card .step~.step {
    margin-left: 7px;
}

.landing-card .eta-label {
    font-size: 15px;
    /* opacity: 0.4; */
}

.landing-card .eta-time {
    font-size: 14px;
    margin-left: 2px;
    opacity: 0.3;
}

.landing-card .action-scan {
    background-color: #fff;
    border-radius: 6px;
    width: 64px;
    /* height: 82px; */
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: #3e3e3e;
    text-align: center;
}

.landing-card .action-scan-title {
    font-weight: bold;
    font-size: 10px;
    margin-top: 1px;
    text-transform: uppercase;
}

.landing-card[card-for="spin-the-wheel"] .landing-card-action {
    position: relative;
    height: calc(119px - 50px);
    width: 1px;
}

.landing-card[card-for="spin-the-wheel"] .action-img {
    position: absolute;
    right: -25px;
    top: -18px;
    height: 106px;
}
@media (max-width: 769px){
.landingfixedlayout body[act-as="landing-page"] .content .header {
    height: calc(85vw + 121px);
    touch-action: pan-x;
    top: -70px;
}
}
@media (min-width: 450px) {
.landingfixedlayout body[act-as="landing-page"] .content .user-greeting-wrapper {
    top: calc(96vw + 8px)!important;
}
}

.landingfixedlayout body[act-as="landing-page"] .content .header .swiper-pagination {
    position: fixed;
    top: calc(100vw - 40px);
}


.landingfixedlayout body[act-as="landing-page"] .content .header .swiper-container {
    position: fixed;
    top: 71px;
    z-index: 1;
}

.landingfixedlayout body[act-as="landing-page"] .content .user-greeting-wrapper {
    position: fixed;
    top: calc(98vw + 8px);
    /* background-color: #000; */
    z-index: 1;
    width: 100%;
}

.rtl .user-greeting-wrapper {
    transform: scaleX(-1);
}

.rtl .user-greeting-wrapper > * {
    transform: scaleX(-1);
    direction: rtl;
}




.hybrid-home-page .user-greeting-wrapper {
    /* display: flex!important; */
}

.hybrid-home-page .landing-cards {
    display: block !important;
}


.fnb .not-available .genBtn {
    display: none;
}

.fnb .not-available .heart {
    left: 14px !Important;
}

.fnb .not-available a.descBlock {
    pointer-events: none;
}

.fnb .itemsList .itemGrid.not-available:before {
    margin-top: -26px;
    zoom: 1.2;
    -webkit-backdrop-filter: blur(10px);
}

.fnb body:has(.modal-product-sold-out) .addtobagbtn {
    filter: brightness(0.6);
    pointer-events: none;
    color: rgb(255 255 255 / 0%)
}

.fnb body:has(.modal-product-sold-out) .addtobagbtn:before {
    content: "Sold Out";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.fnb .modal-product-sold-out .addRemoveWrap {
    display: none;
}

.modal-product-sold-out .price.nearadd {
    display: none;
}

.itemsList .products-listing .itemGrid.not-available .genBtn.quickadd {
    display: none;
}

@media(max-width:360px) {
    .box_instruction .hosted-payment-wrapper .input-field.cardnumber {
        width: 170px;
    }

    .challenge-progress {
        width: 125px;
    }
}

.fnb .qttyinbag {
    display: block!important;
    position: absolute;
    bottom: 24px;
    right: 16px;
    background: var(--primary-color);
    width: 33px;
    height: 33px;
    line-height: 33px;
    text-align: center;
    border-radius: 19px;
    color:#fff;
    font-family:inherit;
    z-index: 1;
}

.box_delivery.force-hide-map .boxData .customDropDown .drop_item_direction:before {
    content: "";
    position: absolute;
    background: transparent;
    height: 31px;
    width: 41px;
    margin-left: -5px;
}

.loyalty-rewards-footer{
    color: #a8a8a8;
    text-align: center;
    margin-top: 10px;
}
.loyalty-rewards-footer .fa-star{
    color: #fff;
}

.loyalty-rewards-footer .pisc-points-to-earn{
    

}

.loyalty-rewards-footer .pisc-points-to-earn .pisc-active{
    font-weight: bold;
}

.loyalty-rewards-footer .pisc-points-to-earn .pisc-active.pisc-underline{
    text-decoration: underline;
}


.customizedID .data .customnote{
    float: none;
    margin-bottom: 30px;
}

customizedID .data .customnote .block{
}
.customizedID .data .customnote.column_cust .block .textarea{
    margin-top:0;
}


.checkoutID .addAddress.withEdit.ck-pickup-filters{
    
margin-left: 22px;
}

.checkoutID .addAddress.withEdit .ck-pickup-branches-filter {
    position: relative;
    display: flex;
    list-style: none;
    font-size: 20px;
    font-weight: bold;
    justify-content: flex-start;
    padding-top: 14px;
    padding-bottom: 4px;
    align-items: center;
    flex-direction: row;
    column-gap: 30px;
}

.checkoutID .addAddress.withEdit .ck-pickup-branches-filter .ck-pickup-branches-filter-wrap {
    padding-left: 0;
    cursor: pointer;
    font-size: 13px;
    position: relative;
    padding-left: 23px;
}

.checkoutID .addAddress.withEdit .ck-pickup-branches-filter .ck-pickup-branches-filter-wrap .fa-regular {
    margin-right: 5px;
    font-size: 16px;
}

.checkoutID .addAddress.withEdit .ck-pickup-branches-filter-wrap .fa-regular {
    position: absolute;
    left: 0px;
}

.checkoutID .addAddress.withEdit .ck-pickup-branches-filter-wrap .zmdi-info {
    font-size: 19px;
    position: absolute;
    right: -25px;
    color: var(--primary-color);
    top: -1px;
}

@media (max-width: 768px) {
    .checkoutID .addAddress.withEdit.ck-pickup-filters {
        margin-left: 0px;
    }

    .categoryPid .subcats.has-main-categories {
        margin-top: 45px;
    }

.categoryPid .subcats.sub-sub-cats.has-main-categories {
    margin-top: 115px!important;
}

.has-subsubcategories .sub-categories-container.show-for-mobile {
    padding-top: 16px!important;
    margin-top: 52px!important;
    transition: all 0.3s;
}

.scrolld .has-subsubcategories .sub-categories-container.show-for-mobile {
    transform: translateY(-72px);
}

.categoryPid .sub-categories-container .swiper-scrollbar {}

.retail .has-subsubcategories .sub-categories-container.show-for-mobile {
    top: 102px;
}

    .has-subsubcategories .sub-categories-container .sub-categories {
        overflow-x: visible!important;
      overflow-y: visible!important;

    }

  .has-subsubcategories .sub-categories-container .sub-categories .link-container .link {
    zoom: 1;
}

.has-subsubcategories .sub-categories-container .sub-categories {
    overflow-x: auto;
    height: 28px;
    white-space: nowrap;
    flex-wrap: nowrap;
    overflow-y: hidden;
}

.enablesorting .categoryPid .content.has-subsubcategories {
    padding-top: 162px;
}


.landingfixedlayout body[act-as="landing-page"]:before {
    content: "";
    position: fixed;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: 2;
    transition: all 0.5s;
    pointer-events: none;
}

.landingfixedlayout body.homePid[act-as="landing-page"].fixSearch:before {
    top: 0;
    opacity: 0.9;
    backdrop-filter: blur(30px);
    transition: all 0.5s;
    background: #000;
    height: 100vh;
}
    
}

.orderdetails .orders .order .withTitle .highlight{
    margin-left:3px;
    margin-right:3px;
}

.orders.normal .order.is-title{
    background: none;
    box-shadow: none;
    height: auto;
    min-height: 0;
    color: #000;
    font-size: 24px;
    font-weight: bold;
    font-family: 'titlefont';
}
.orders.normal .order.is-title .split-title.past-orders-title{
    margin-top: 30px;
}


.spin-the-wheel-wrapper .wheel-center:before{
    content:'';
    position: absolute;
    left: 18px;
    top: 18px;
    width: 25px;
    height: 24px;
    border-radius: 100%;
    box-shadow: 0px 0px 26px 15px #fff;
}

.spin-the-wheel-wrapper .wheel-frame{
    width: calc(100% + 18px);
    height: calc(100% + 18px);
    left: -9px;
    top: -9px;
    border-radius: 50%;
    background-image: none !important;
}



.spin-the-wheel-wrapper .wheel-center{
    /* width: calc(100% - 300px); */
    /* height: calc(100% - 300px); */
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.spin-the-wheel-wrapper .wheel-center, 
.loyaltylvl1.spin-the-wheel-wrapper .wheel-center{
    background-image: none;
}

.spin-the-wheel-wrapper .wheel-center:before{
    content: 'TAP';
    box-shadow: none;
    font-family: "titlefont";
    font-size: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    left: 0;
    top: 0;
    height: 56px;
    width: 60px;
    position: relative;
    box-shadow: 0px 0px 57px #000;
    padding-top: 4px;
}

html.lvl-one .spin-the-wheel-wrapper .wheel-center:before{
    color: #FFF;
}

.loyaltylvl1.spin-the-wheel-wrapper  .wheel-center:before{
    background-color: #7EB564;
}

.loyaltylvl2.spin-the-wheel-wrapper  .wheel-center:before{
    background-color: #FFB20D;
}

.loyaltylvl3.spin-the-wheel-wrapper  .wheel-center:before{
    background-color: #B90845;
}

.loyaltylvl4.spin-the-wheel-wrapper  .wheel-center:before{
    background-color: #36B0C9;
}

.spin-the-wheel-wrapper .page-title::before{
    display: none;
}

.spin-the-wheel-wrapper .page-title span{
    color: var(--main-color);
}

.spin-the-wheel-wrapper .wheel-canvas{
    border-radius: 50%;
}

.spin-the-wheel-wrapper{
    justify-content: space-evenly;
}

.spin-the-wheel-wrapper .page-close{
    border: 2px solid var(--main-color);
    background-color: #000;
    text-transform: uppercase;
    font-family: "titlefont";
    font-size: 28px;
    border-radius: 6px;
    padding: 8px 25px;
    text-decoration: none;
}

/* #region Fix Menu when footer is visible */
@media (min-width: 769px) {
    html.visible-footer.market .tabled, 
    html.visible-footer.fnb .tabled {
        overflow: auto;
        /* height: calc(100vh - 195px); */
        height: calc(100vh - (152px + 61px) );
    }

    html:not(.visible-footer).market .tabled, 
    html:not(.visible-footer).fnb .tabled {
        overflow: auto;
        /* height: calc(100vh - 195px); */
        height: calc(100vh - 152px);
    }
    html:not(.visible-footer).market .onBottom .tabled, 
    html:not(.visible-footer).fnb  .onBottom .tabled {
        height: calc(100vh - 220px);
    }
    .accname{
        display:none!important;
        opacity:0!important;
    }
}
/* #endregion */

#redirectTo3ds1AcsSimple{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:700px;
    z-index: 5555555555;
}

  .scanqrcode {
  z-index:2!important
  }
  .scanqrcode > *{
  visibility:hidden!important
  }
.scanqrcode .MenuParts.fix, .scanqrcode .flmenubtn, .scanqrcode .mobileMenuWrap {
    visibility: visible !important;
}
#threedsChallengeRedirect {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    z-index: 200;
}

@media (min-width: 1900px) {
    .fnb .subPage.checkoutID .content .wrap1260, .market .subPage.checkoutID .content .wrap1260 {
        max-width: 1200px;
    }
    .giftcards .content {
        padding-left: 22px;
        max-width: 1020px;
        transform: translateX(-50%);
        left: calc(33% - 22px);
    }
}
.tracking-footer .eta-map{
    position: absolute;
    right: 0;
    bottom: 4px;
    cursor: pointer;
    font-size: 14px;
    color: var(--primary-color);
    text-decoration: none;
}

.tracking-footer .re-center-map{
    position: absolute;
    right: 36px;
    bottom: 27px;
    background-color: #fff;
    padding: 5px;
    padding-left: 10px;
    padding-right: 10px;
    border: 1px solid var(--primary-color);
    border-radius: 26px;
    box-shadow: 0px 0px 2px #999;
    cursor: pointer;
    font-size: 14px;
    color:var(--primary-color);
}

.landing-card .eta-map{
        color:rgba(0, 0, 0, 0.73);
        font-weight: bold;
        text-transform: uppercase;
        font-size: 10px;
        text-decoration: none;
    }

.rating-popup .for-bad-rating{
    opacity: 0;
    pointer-events: none;
}   

.rating-popup.got-bad-rating .for-bad-rating{
    display: block;
    opacity: 1;
    transform: translateY(0);
    margin-top: 0px;
    transition: opacity 0.3s ease-out 0.4s, margin-top 0.3s ease-out 0.1s, transform 0.3s ease-out 0.4s;
    pointer-events: all;
}

.rating-popup .for-bad-rating {
    /* opacity: 0; */
    transition: all 0.1s ease-out 0s;
    transform: translateY(-32px);
    width: calc(100% - 27px);
    margin: auto;
    margin-top: -242px;
}

.sub-title-bad-rating.for-bad-rating.ng-scope {
    font-size: 20px;
    font-weight: bold;
}

textarea#rating-message {
    height: 90px;
    padding: 11px;
    margin-top: 19px;
    margin-bottom: 16px;
    color: #666;
    box-sizing: border-box;
    background: #ffffff;
    border-radius: 6px;
    border: 1px solid #ddd;
    font-size: 14px;
}

select#rating-reason-id {
    height: 42px;
    padding: 11px;
    margin-top: 19px;
    margin-bottom: 16px;
    color: #999;
    border-radius: 6px;
    background: #ffffff;
    border: 1px solid #ddd;
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20fill%3D%22%23ccc%22%20d%3D%22M7.41%208.59%2012%2013.17l4.59-4.58L18%2010l-6%206-6-6z%22%2F%3E%3C%2Fsvg%3E');
    background-repeat: no-repeat;
    background-position: right 12px top 50%;
    background-size: 22px auto;
    font-size: 14px;
}


select#rating-reason-id:after {
    content: '>';
    position: absolute;
    right: 22px;
    top: 0px;
} 

.enableviews .views{
    display:block!important
}

.customDropDown.open .drop_options .drop_item a.mapdir{
    float: none;
    margin: 0;
    position: absolute;
    right: 13px;
    transform: translate3d(0px, -50%, 0px);
    top: 24px;
    float: left;
    font-size: 23px;
}
.customDropDown .drop_select a.mapdir{
    float: none;
    margin: 0;
    position: relative;
    /* right: 11px; */
    /* top: 63px; */
    font-size: 20px;
    margin-left: 11px;
    top: -2px;
}

.rtl .customDropDown .drop_select a.mapdir {
}

.customDropDown.open .drop_options .drop_item .pickup-distance{
    color: #999;
    font-size: 10px;
    width: auto;
    display: inline-block;
    position: absolute;
    top: 16px;
    right: 41px;
    /* text-transform: uppercase; */
}
.customDropDown .drop_select .pickup-distance{
    color: #ccc;
    font-size: 12px;
    display: none;
}
@media (max-width: 768px) {
    .customDropDown .drop_select a.mapdir{
        /* right: -15px; */
        /* top: 58px; */
    }
}

.offerslist.auto-apply.not-applicable{
    display:none !important;
}
.rd-expiry-notice{
    position: relative;
    display: block;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
    font-size: 13px;
    margin-top: 21px;
}

@media(min-width:769px) {
    .cb-current-location .cb-wrapper {
        top: 6000px;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .cb-wrapper {
    padding: 20px;
    padding-bottom: 60px;
    zoom:1.1;
}

    .cb-current-location .cb-wrapper.show {
        top: 50%;
    }
    .cb-wrapper .cb-header {
        font-size: 22px;
        color: #000;
        padding-left: 17px;
    }

    .cb-wrapper .cb-branches {
        margin-bottom: 5px;
        max-height: calc(100vh - 952px);
        min-height: 318px;
    }
    .fullThankyou .orderProc span{
        top: -75px !important;
    }
    .orderstt {
        bottom: 60px !important;
    }
}

@media(min-width:1600px){

    .box_instruction.hosted-session.expanded .dateForm{
      overflow: unset !important;
    }
  
  }
img[src="assets/images/driver.svg"] {width: 50px!important;height: 68px!important;}
img[src="assets/images/destination.svg"] {width: 22px!important;height: 29px!important;}


.landing-card[card-for="track-delivery"] {
    margin-top: 16px;
}

.landing-card[card-for="track-delivery"] .highlighted:before{
    content:"order"
}

.download-app-popup{
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0s linear 0.3s;
}
@media(max-width:768px){
    .download-app-popup.show{
        visibility: visible;
        opacity: 1;
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        left: 0;
        background-color: rgba(0, 0, 0, 0.5);
        transition: opacity 0.3s ease;
        transform: none;
        border-radius: 0 !important;
        padding: 0 !important;

    }
    .download-app-popup .popup-container{
        position: absolute;
        left: 0;
        bottom: -3000px;
        width: 100%;
        height: 250px;
        background-color: #fff;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        border-top-left-radius: 30px;
        border-top-right-radius: 30px;
        padding: 15px;
        box-sizing: border-box;
        transition: bottom 1s ease;
    }
    .download-app-popup.show .popup-container{
        bottom: 0%;
    }
    .download-app-popup .popup-container .logo-container{
        max-width: 90px;
        background-color: #fff;
        border-radius: 30px;
        padding: 5px;
        border: 1px solid #0000003b;
        position: absolute;
        top: -56px;
        overflow: hidden;
    }
    .download-app-popup .popup-container .logo-container img{
        width: 100%;
    }

    .download-app-popup .popup-container .title{
        font: inherit;
        margin-top: 50px;
        font-size: 23px;
        font-weight: bold;
        width: 270px;
    }
    .download-app-popup .popup-container .buttons-container{
        display: flex;
        align-items: center;
        justify-content: space-around;
        width: 100%;
    }
    .download-app-popup .popup-container .buttons-container .button.nav{
        background-color: var(--primary-color);
        color: #fff;
        font: inherit;
        font-size: 15px;
        margin-left: 0;
        margin-right: 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .download-app-popup .popup-container .buttons-container .button{
        font-size: 15px;
        margin-left: 0;
        margin-right: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
    }
    .download-app-popup .popup-container hr{
        width: 100%;
        border: 1px solid rgba(0, 0, 0, 0.1);
        margin-top: 35px;
        margin-bottom: 35px;
    }
    .download-app-popup .popup-container .bottom-link{
        font: inherit;
        font-size: 21px;
        color: rgb(0, 0, 0);
        text-decoration: none;
    }
}


div#fibPaymentsModalID .normalForm{
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 600px;
    justify-content: center;
    flex-wrap: nowrap;
    align-items: center;
    }
    
    div#fibPaymentsModalID .head{
        display:none;
    }
    #fibPaymentsModalID .qrcode-wrapper{
    position: relative;
    display: flex;
    width: 150px;
    height: 150px;
    padding: 10px;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    border: 1px solid #ccc;
    border-radius: 5px;
    }
    #fibPaymentsModalID .qrcode-wrapper img{
    position: relative;
    width: 100%;
    height: 100%;
    border: none;
    outline: 0;
    }
    #fibPaymentsModalID .code-wrapper{
    position: relative;
    color:var(--primary-color);
    border: 1px dashed #ccc;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 10px;
    padding-bottom: 10px;
    }
    #fibPaymentsModalID .link-wrapper{
    margin-top: 18px;
    position: relative;
    display: block;
    }
    #fibPaymentsModalID .link-wrapper.m-t-0{
        margin-top:0;
    }
    #fibPaymentsModalID .link-wrapper a{
    color: #fff;
    text-decoration: none;
    padding-left: 20px;
    background-color: var(--primary-color);
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    position: relative;
    display: block;
    font-size: 15px;
    border-radius: 5px;
    }
    #fibPaymentsModalID .cancel-wrapper{
    position: relative;
    display: block;
    margin-top: 80px;
    border-bottom: 1px solid;
    color: #333;
    cursor: pointer;
    }
    #fibPaymentsModalID .instructions{
position: relative;
display: block;
margin-top: 35px;
margin-bottom: 15px;
font-size: 15px;
color: #333;
    }
    #fibPaymentsModalID .instructions:first-child{
        margin-top:0;
    }

@media (min-width: 769px) {
div#fibPaymentsModalID {
    max-width: 500px;
    padding-top: 0;
}

div#fibPaymentsModalID .normalForm{
    padding-top: 40px;
    margin-top: 0px;
    padding-bottom: 40px;
}
}


@media (max-width: 380px) {
    div#fibPaymentsModalID .normalForm{
        margin-top: 0;
        padding-top: 30px;
        justify-content: flex-start;
        }
    #fibPaymentsModalID .cancel-wrapper{
        margin-top: 25px;
        }
        #fibPaymentsModalID .instructions{
        margin-top: 15px;
        margin-bottom: 10px;
        }
}

.order-from-table-loader{
    display:none;
}
.order-from-table-loader.loading {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - 190px);
}

.order-from-table-loader.loading::before {
    content: "";
    box-sizing: border-box;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border-top: 2px solid #999;
    border-right: 2px solid transparent;
    animation: .6s linear 0s infinite normal none running spinner
}

.scanqrcode .has-oft .oft-head-container{
    display:none;
}
.multibranch .has-oft .deiveringfrom {
    display:none;
}

.orders.normal .order.is-title{
    width: 100% !important;
}


.payment-type-cybersource .normalForm {
background-color:#F5F5F5;
}
.payment-type-cybersource .normalForm #paymentiframe {
    min-height: calc(100vh - 130px);
}
@media (min-width: 768px) {
    .payment-type-cybersource .normalForm #paymentiframe {
        padding-top:50px;
    }
}
.box_instruction .input.saved-card{
    background-color:transparent;
}

.uk-currency-layout .itemsList .itemGrid .priceWrap .price {
    direction: rtl;
}

.uk-currency-layout .customizedID .data .price {
    direction: rtl;
}

.uk-currency-layout .myBagModule .itemBags .total {
    direction: rtl;
}

.uk-currency-layout .sumhead div:nth-child(1),
.uk-currency-layout .sumhead div:nth-child(2) {
    direction: rtl;
    float: left;
}

.uk-currency-layout .subTotalBox .totalPrice:nth-child(2) {
    direction: rtl;
}

.uk-currency-layout .myBagModule .itemBags .price {
    direction: rtl;
}

.uk-currency-layout .minitotal .mtprice {
    direction: rtl;
}

.uk-currency-layout .myBagModule .priceonbtn {
    direction: rtl;
}

.uk-currency-layout .myBagModule .subtotal .subPrice {
    direction: rtl;
}


.uk-currency-layout .customizedID .bigPrice {
    direction: rtl;
}

.favorites-empty-btn{
    display: none;
}

.locationName-chosen-branch{
    display: none;
}

@media(min-width: 769px) and (max-height:760px){
    .orderstt {
        position: relative;
        margin-top: 50px;
        margin-left: auto !important;
        margin-right: auto !important;
        left: 0;
    }
}

.description.small-description{
    margin-bottom: 15px;
    display: none;
}

.track-wrapper{
    display: flex;
        align-items: center;
        justify-content: center;
}
.track-order{
    text-decoration: none;
    width: 200px;
    background-color: var(--primary-color);
    height: 32px;
    color: #fff;
    position: relative;
    cursor: pointer;
    border: 1px solid transparent;
    box-flex: 1;
    display: flex;
    font-weight: 400;
    font-size: 13px;
    color: #fff;
    box-sizing: border-box;
    transform: translate3d(0, 0, 0);
    transition: color .3s ease-in, background-color .3s ease-out;
    -webkit-display: -webkit-box;
    -webkit-display: -webkit-flex;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    border-radius: 6px;
}

.cb-wrapper .cb-map-container .cb-map-buttons .cb-map-b-big.gps-detected{
    animation: none;
}

/* #region iti customization */
.iti {
    --iti-path-flags-1x: url('/assets/intlTelInput/img/flags.webp');
    --iti-path-flags-2x: url('/assets/intlTelInput/img/flags@2x.webp');
    --iti-path-globe-1x: url('/assets/intlTelInput/img/globe.webp');
    --iti-path-globe-2x: url('/assets/intlTelInput/img/globe@2x.webp');
  }

.iti.iti--container{
    font-family: 'textfont', 'arabicfont', sans-serif;
    font-weight: bold;
}
.iti.iti--container.iti--fullscreen-popup{
    width: 100vw;
    padding-left: 0;
    padding-right: 0;
    padding-top: 80px;
    padding-bottom: 0;
}

.cordova .iti.iti--container.iti--fullscreen-popup{
    padding-top: 110px;
}

.iti.iti--container.iti--fullscreen-popup:before{
    content: '\f134';
    display: inline-block;
    font: normal normal normal 14px / 1 'Material-Design-Iconic-Font';
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #fff;
    position: absolute;
    top: 19px;
    font-size: 37px;
    left: 50%;
    transform: translateX(-50%);
    width: 31px;
}

.cordova .iti.iti--container.iti--fullscreen-popup:before{
    top: 58px;
}

.iti.iti--container .iti--flexible-dropdown-width .iti__country-list{
    max-height: calc(100% - 83px);
    overflow-x: hidden;
}

.iti.iti--container input, .iti.iti--container input[type="tel"], .iti.iti--container input[type="text"]{
    height: 57px;
    margin: 12px;
    border-radius: 9px;
    border: 1px solid #BBBBBB;
    width: calc(100% - 24px);
    padding-left: 15px;
    padding-right: 15px;
    text-align: left;
}

.iti--fullscreen-popup .iti__dropdown-content:after{
    content: '\f1c3';
    display: inline-block;
    font: normal normal normal 14px / 1 'Material-Design-Iconic-Font';
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #BBBBBB;
    position: absolute;
    right: 30px;
    top: 26px;
    font-size: 30px;
}

.iti.iti--container.iti--fullscreen-popup .iti__country{
    padding: 17px 23px;
    position: relative;
}

.iti.iti--container.iti--fullscreen-popup .iti__country ~ .iti__country:before{
    content: "";
    width: 100%;
    height: 1px;
    background-color : #BBBBBB;
    position: absolute;
    top: 0;
}

.iti.iti--container.iti--fullscreen-popup .iti__country .iti__flag{
    transform: scale(1.5);
}

.iti.iti--container.iti--fullscreen-popup .iti__country .iti__country-name{
    margin-left: 30px;
}

.iti.iti--container.iti--fullscreen-popup .iti__country .iti__dial-code{
    margin-left: auto;
    color: #222222;
}

.input.input-with-intlTelInput .iti {
    width: 100%;
}

.input.input-with-intlTelInput .iti .iti__flag{
    order: 1;
}

.iti.iti--container .iti__country .iti__flag{
    box-shadow: none;
}

.iti.iti--container.iti--fullscreen-popup .iti__search-input:placeholder-shown ~ .iti__country-list .iti__country.iti__highlight{
    background: transparent;
}

/* #endregion */

@media(max-width: 768px){
    div#AddAddressModalID.modal{
        transform: translate3d(-50%, 200%, 0px)!important;
        position: fixed;
        top: 0 !important;
        right: 0;
        bottom: 0;
        left: 50%;
        z-index: 1050;
        overflow: hidden;
        outline: 0;
        padding: 0 !important;
        width: 100% !important;
    }

div#AddAddressModalID.modal.show {
    transform: translate3d(-50%, 0%, 0px) !important;
}

    div#AddAddressModalID.modal .modal-dialog{
        width: calc(100% - 0px);
        display: flex;
        /* align-items: center; */
        /* min-height: calc(100% -(.5rem* 2)); */
        min-height: 100%;
        /* padding: 0 11px; */
    }

    div#AddAddressModalID.modal .modal-dialog::before {
        display: block;
        /* height: calc(100vh -(.5rem* 2)); */
        height: 100%;
        content: "";
    }
}

.hissubtotal div div{
    line-height: 25px;
}

@media only screen and (-webkit-device-pixel-ratio: 3) and (min-device-height: 812px) and (max-device-width: 700px), only screen and (-webkit-device-pixel-ratio: 2) and (min-device-height: 896px) and (min-device-width: 414px) and (max-device-width: 700px), only screen and (-webkit-device-pixel-ratio: 3) and (min-device-height: 896px) and (min-device-width: 414px) and (max-device-width: 700px),only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3), only screen and (device-width: 320px) and (device-height: 693px) and (-webkit-device-pixel-ratio: 3) {
    .cordova.ios .modal.closeNew{
      padding-top: 110px;
    }
  
    .cordova.ios .modal.closeNew .btnClose{
      top: 58px !important;
    }
  
    .cordova .loginRegisterID .parts,
    .cordova  .createAccountID .parts, .cordova .editAddAddress .parts{
      min-height: calc(100vh - 110px);
    }
}

.reviewBox .rBox .genBtn.full.btn-receipt-order-more-items{
    background-color: transparent;
    border: 1px solid var(--main-color);
    color: var(--main-color);
}

.branchdetect.trying-again .out a{
    opacity: 0.3;
    pointer-events: none;
}

body.isSearching .user-greeting-wrapper{
    display: none !important;
}

.rpis-wrapper .pisc-body .pisc-receipt-wrapper .pisc-line-wrapepr.pisc-total .pisc-line-title{
    font-size: 22px;
}

.rpis-wrapper .pisc-body .pisc-receipt-wrapper .pisc-line-wrapepr.pisc-total .pisc-line-amount{
    font-size: 24px;
}

@media (max-width: 768px) {
    .receiptPid  #wrapper {
        padding-top: 72px !important;
    }
        .retail .products-listing:not(.swiper-wrapper):has(.itemGrid:only-of-type) {
        display: block!important;
    }
    .sumhead {
    height: auto;
    padding-right: 11px;
    padding-left: 12px;
    box-sizing: border-box
}
}

.multibranch .deiveringfrom.dine-in .dinein-close {
    color: #fff;
    position: absolute;
    top: 4px;
    right: 1px;
    display: none;
}

.iti--fullscreen-popup.iti--container {
    animation: .3s cubic-bezier(0.42, 0, 0.14, 0.93) 0s 1 normal both running fadeInUp2;
}

.landing-card .landing-card-action .action-scan-icon img {
  /* display: none; */
  width: calc(100% - 22px);
}


.landing-card:after {
  content: '' !important;
  position: absolute;
  width: 50px;
  height: 50px;
  background-size: contain;
  background-repeat: no-repeat;
  right: 36px;
  top: 50%;
  transform:translateY(-50%);
  background-position: center;
}

.landing-card[card-for="track-delivery"]:after {
  /* background-image: url(images/vespa.png); */
}

.newsheader {
    color: #555;
    font-weight: bold;
    font-size: 18px;
    font-family: 'titlefont';
}

.homenews {
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 52px;
}

.newsitem {
    list-style: none;
    margin-bottom: 20px;
}

.newstitle {
    margin-bottom: 9px;
    color: #555;
    font-weight: bold;
}

.newsdescription {
    color: #999;
    margin-bottom: 9px;
    line-height: 21px;
}

.newsdate {
    color: #ccc;
    font-size: 13px;
}

.homecollections {
    margin-bottom: 42px;
}

.user-greeting-wrapper .loyalty-progress {
    width: 273px;
    background: #eee;
    height: 10px;
    position: absolute;
    left: 18px;
    border-radius: 7px;
    display: none;
}

.not-logged-in .loyalty-progress,.not-logged-in .loyalty-tonext {
    display: none!important;
}

.progressbar-filler{
    height: 100%;
    border-radius: 5px;
    display: block;
}

.loyaltylvl1 .progressbar-filler{
    background-color:#CD7F59;
}

.loyaltylvl2 .progressbar-filler{
    background-color:#BEBEBE;
}

.loyaltylvl3 .progressbar-filler{
    background-color:#E3AF36;
}

.loyaltylvl4 .progressbar-filler{
    background-color:#5A5A5A;
}

.loyalty-tonext {
    width: 300px;
    white-space: nowrap;
    margin-top: 23px;
    padding-left: 13px;
    font-size: 15px;
    color: #888;
    display: none;
}

.loyalty-tonext div {
    width: 100%;
    white-space: nowrap;
    display: flex;
    flex-direction: row;
    gap: 6px;
}



.progress-circle svg {
  height: 289px;
  margin: auto;
  display: block;
}

.progress-circle path {
  stroke-linecap: round;
  stroke-width: 4px;
}

.progress-circle path.grey {
  stroke: #E1E1E1;
}

.progress-circle path.purple {
  stroke: purple;
  transition: stroke-dasharray 1s ease;
}

.progressvalue {
    width: 100%;
    margin-top: -59px;
    font-size: 14px;
    font-weight: bold;
    color: #999;
}

.progressvalue span {
    color: var(--primary-color);
}

.fillup-0 {
    opacity: 0;
}

.challenges-listing:not(:has(.challenge-item)) .challenge-info {
    display: none;
}

.challenges-listing:not(:has(.challenge-item)):after {
   content:"Check back soon for exciting challenges and rewards!";
   text-align:center;
   width: 100%;
   display: block;
   color: #999;
}

.offers-wrap > ul:not(:has(*)):before{
  content: "No offers are currently available. Check back soon!";
color: #888;
  
display: block;
  
padding: 8px;
  
width: calc(100% - 54px);
  
font-size: 18px;
  
margin: auto;
  
padding-top: 12px;
}

@media (max-width: 768px) {
    .manage-qty-fixed-pos.show {
        /* display: flex !important; */
        opacity: 1;
        transform: translateY(0px);
    }
}

.manage-qty-fixed-pos {
    position: fixed;
    height: 45px;
    z-index: 9999;
    left: 19px;
    bottom: 34px;
    color: #fff;
    font-family: "textfont";
    font-weight: bold;
    font-size: 14px;
    width: 80px;
    justify-content: space-between;
    align-items: center;
    transform: translateY(100px);
    transition: all 0.5s linear 0s;
    opacity: 0;
}

.mobilemenuitems {
    display: flex;
    flex-direction: column;
    margin-bottom: 32px;
}


.sumhead {
    height: auto;
    box-sizing: border-box
}


.sumhead>div {
    margin-bottom: -3px;
    box-sizing: border-box;
    width: 100%;
    text-align: right;
}

.sumhead div {
    margin: 0px !important;
    display: block;
}

.sumhead>div:nth-child(1):before {
    content: attr(data-txt);
    float: left;
}

.sumhead>div:nth-child(2):before {
    content: attr(data-txt);
    float: left;
}


.sumhead>div[ng-if="CurrentBasket.extraChargeAmount > 0"]:before {
    content: attr(data-txt);
    float: left;
}

.sumhead>span,
.sumhead br,
.sumhead>div div:nth-child(1),
.sumhead>div div:nth-child(3),
.sumhead>div div:nth-child(4),
.sumhead>div div:nth-child(5) {
    display: none;
}

/* Start: Gift Cards */
@media(max-width: 767px){
    .giftcards .gc-top-part{
        padding-left: 0;
        padding-bottom: 19px;
    }
    .giftcards .gc-title,
    .giftcards .gc-sub-title{
        padding-left: 13px;
    }
    .gc-list-wrapper-swiper-container{
        opacity: 0;
        min-height: 128px;
        animation: fadeIn 1s ease-in-out forwards 1s;
    }
    /* Define the keyframes */
    @keyframes fadeIn {
        from {
          opacity: 0;
        }
        to {
          opacity: 1;
        }
      }
    .giftcards .gc-top-part .gc-list-wrapper{
        flex-wrap: nowrap;
    }
    .giftcards .gc-top-part .gc-list-wrapper .gc-list-item{
        transform: scale(0.7);
        opacity: 0.6;
        transition: transform 0.3s ease, opacity 0.3s ease;
        margin: 0;
        width: 231px;
        height: 128px;
        background-color: #FFF!important;
    }
    .giftcards .gc-top-part .gc-list-wrapper .gc-list-item.swiper-slide-active {
        transform: scale(1);
        opacity: 1;
        z-index: 1;
        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
    }
    .giftcards .gc-top-part .gc-list-wrapper .gc-list-item.swiper-slide-prev{
        transform: translate3d(60px, 0px, -200px) rotate(0deg) rotateY(-15deg) scale(0.7);
    }
    .giftcards .gc-top-part .gc-list-wrapper .gc-list-item.swiper-slide-next{
        transform: translate3d(-60px, 0px, -200px) rotate(0deg) rotateY(-15deg) scale(0.7);
    }

    .gc-list-wrapper-swiper-container{
        opacity: 0;
    }
    .gc-list-wrapper-swiper-container.swiper-initialized{
        opacity: 1;
    }
}

/* End: Gift Cards */

.far-distance-notice.global-check {
    bottom: auto;
    top: 16px;
}

@media(min-width: 769px){
    .far-distance-notice.global-check {
        top: 68px;
        left: 20px;
    }
                .multibranch .loggedin .filter.normal{
                float:right
            }
}
.far-distance-notice.global-check:before {
    top: 0;
    bottom: auto;
    left: calc(50% - 20px);
    margin-top: -33px;
    border-color: transparent transparent #fbfbc9 transparent;
}

.far-distance-notice.global-check .fa-circle-xmark {
}

.sub-sub-cats{
    display: none;
}
@media(max-width: 768px){
    html.show-all-mobile-categories .subcats{
        margin-top: 44px;
    }
    html.show-all-mobile-categories .subcats.sub-sub-cats{
        margin-top: 89px;
        background-color: #f6f6f6;
        box-shadow: none;
        transition: all 0.5s;
    }
    html.show-all-mobile-categories body.scrolld .subcats.sub-sub-cats{
        height: 0px;
        overflow: hidden;
        /* z-index: -1; */
        opacity: 0;
        pointer-events: none;
    }
    html.show-all-mobile-categories .sub-categories-container-wrapper{
        display: none;
    }
    html.show-all-mobile-categories.enablesorting body.has-mobile-sub-sub-categories.categoryPid .content.has-subsubcategories{
        padding-top: 200px;
    }
    .subcats.sub-sub-cats li a span{
        position: relative;
        background: #fff;
        padding: 5px 10px 5px 10px;
        border-radius: 16px;
        font-size: 12px;
        border-bottom: 1px solid #ccc;
    }

.subcats.sub-sub-cats li.selected span {
    border: 1.5px solid var(--primary-color);
}

.subcats.sub-sub-cats li.selected a {
    border-bottom: 0px!important;
}
}
.retail .meta .description{
    font-family: 'textfont', 'arabicfont', sans-serif;
    font-size: 14px;
    color: #444;
    margin-bottom: 32px;
    display: block;
    line-height: 23px;
    margin-top: 0;
    font-weight: normal;
    margin-bottom: 8px;
    width: 100%;
}

.iti input.iti__tel-input, .iti input.iti__tel-input[type=tel], .iti input.iti__tel-input[type=text] {
    direction: ltr;
}
.promo-discount-price{
    display: none;
}
.orders .order .withTitle .order-description{
    display: none;
}
@media (min-width: 769px) {
.landing-cards, .hybrid-home-page .landing-cards {
    display: none!important;
}
}

.challenge-info-type .fa-circle-check {
    color: var(--main-color);
}
/* region competition */
.competition .competition-header{
    width: 100vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 7px;
    padding-top: 26px;
    padding-bottom: 26px;
    box-sizing: border-box;
  }
  .competition .competition-header .competition-heading{
    font-family: 'titlefont';
    font-size: 55px;
    font-weight: normal;
    color: var(--primary-color);
    text-transform: uppercase;
    letter-spacing: 3.5px;
  }
  .competition .competition-header .competition-heading.and{
    font-size: 15px;
    line-height: 18px;
    font-weight: bold;
    margin-top: -14px;
    margin-bottom: -14px;
  }
  .competition .competition-header .competition-header-description {
    font-size: 16px;
    line-height: 19px;
    color: var(--primary-color);
    font-family: 'textfont';
    text-align: center;
    font-weight: medium;
    padding-left: 53px;
    padding-right: 35px;
  }
  body:has(.reachPID.competition) .homeFilter .filter .zmdi{
    display: none !important;
  }
  .competition .competition-body{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100vw;
    gap: 7px;
  }
  .competition .competition-body .competition-title{
    font-family: 'titlefont';
    margin-top: 42px;
    font-size: 19px;
    line-height: 123px;
    text-align: center;
    font-weight: normal;
    color: var(--primary-color);
  }

  .competition .competition-body .competition-status{
    font-family: 'textfont';
    font-size: 12px;
    text-align: center;
    color: var(--secondary-color);
    text-transform: uppercase;
    margin-top: 20px;
    font-weight: medium;
    opacity: .71;
  }
  .competition .competition-body  .competition-date{
    font-family: 'textfont';
    font-size: 12px;
    text-align: center;
    color: #CCCCCC;
    text-transform: uppercase;
    font-weight: medium;
    opacity: .71;
  }
  .competition .competition-body .competition-progress-bar-container{
    width: 156px;
    height: 7px;
    position: relative;
    background-color: rgba(255, 255, 255, 0.16);
    margin-top: 5px;
  }
  .competition .competition-body .competition-progress-bar-container .competition-progress-bar{
    position: absolute;
    left: 0;
    top: 0px;
    height: 8px;
    background-color: var(--secondary-color);
    opacity: 1;
    border-radius: 2px;
    transition: width ease-in-out 1s;
  }
  .competition .competition-body .competition-description{
      font-family: 'textfont';
      font-size: 15px;
      line-height: 19px;
      color: #fff;
      width: 100%;
      max-width: 256px;
      text-align: center;
      margin-top: 20px;
  }
  .competition .competition-body .competition-terms{
    font-family: 'textfont';
    color: #CCCCCC;
    font-size: 12px;
    line-height: 19px;
    border-bottom: 1px solid #CCCCCC;
    cursor: pointer;
    opacity: .71;
  }
  .competition .competition-body .competition-join-button{
    width: 99px;
    height: 33px;
    background: #FFFFFF;
    border: 1px solid #707070;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    line-height: 22px;
    font-weight: normal;
    color: #000000;
    font-family: 'textfont';
    margin-top: 25px;
    text-transform: uppercase;
    font-weight: bold;
  }
  .competition .competition-body .competition-leaderboard-title{
    font-family: 'titlefont';
    font-size: 26px;
    line-height: 31px;
    font-weight: normal;
    color: var(--primary-color);
    margin-top: 47px;
  }
  .competition .competition-body .competition-leaderboard-container{
    margin-top: 13px;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    gap: 14px;
    width: 100vw;
    box-sizing: border-box;
    position: relative;
    height: 100%;
    padding-bottom:25px;
  }
  .competition .competition-body .competition-leaderboard-container .competition-leaderboard-card{
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    line-height: 18px;
    color: #fff;
    font-family: 'textfont';
    flex-wrap: nowrap;
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
    font-weight: medium;
  }
  .competition .competition-body .competition-leaderboard-container .competition-leaderboard-card .leaderboard-card-left{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 15px;
  }
  .competition .competition-body .competition-leaderboard-container .competition-leaderboard-card.first{
    font-size: 18px;
  }
  .competition .competition-body .competition-leaderboard-container .competition-leaderboard-card.sticky{
    position: sticky;
    bottom: 5px;
    left: 0;
    background-color: var(--primary-color);
    border: 1px solid var(--secondary-color);
  }
  .competition .competition-body .competition-leaderboard-container .competition-leaderboard-card.sticky.fixed{
    position: fixed;
    bottom: 5px;
    left: 0;
    background-color: var(--primary-color);
    border: 1px solid var(--secondary-color);
  }
  .competition .competition-body .competition-joined-member{
    width: 100vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    margin-top: 27px;
  }
  .competition .competition-body .competition-joined-member .competition-joined-date{
    font-family: 'textfont';
    color: var(--secondary-color);
    font-size: 15px;
    line-height: 21px;
    text-transform: uppercase;
  }
  .competition .competition-body .competition-joined-member .competition-username{
    font-family: 'textfont';
    color: #CCCCCC;
    font-size: 12px;
    line-height: 19px;
    opacity: .71;
  }
  .competition .competition-body .competition-winner-result{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    margin-top: 40px;
  }
  .competition .competition-body .competition-winner-result .competition-you-win{
    font-size: 19px;
    color: #fff;
    font-family: 'textfont';
    line-height: 30px;
    margin-top: 2px;
  }
  .competition .competition-body .competition-winner-result .competition-win-label{
    font-size: 19px;
    font-family: 'textfont';
    line-height: 30px;
    color: var(--secondary-color);
    font-weight: medium;

  }
  .competition .competition-body .competition-winner-result .competition-winner-username{
    font-size: 16px;
    color: #fff;
    font-family: 'textfont';
    margin-top: -8px;
  }
  .competition .competition-body .competition-winner-result .competition-claim-prize{
    width: 100%;
    max-width: 116px;
    height: 32px;
    background-color: var(--secondary-color);
    color: var(--primary-color);
    margin-top: 15px;
    text-transform: uppercase;
    font-size: 16px;
    font-family: 'textfont';
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    border-radius: 4px;
  }
  .competition-join-modal-container{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: -1;
    opacity: 0;
    transition: all ease-in-out .1s;
  }
  .competition-join-modal-container.show{
    z-index: 6;
    opacity: 1;
  }
  .competition-join-modal-container .competition-join-modal{
    width: 100% !important;
    height: 266px;
    position: absolute;
    bottom: -1000px;
    left: 0;
    background-color: #fff;
    display: flex !important;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    padding-top: 24px;
    gap: 12px;
    opacity: 0;
    transition: all ease-in-out .5s;
  }
  .competition-join-modal-container.show .competition-join-modal{
    opacity: 1;
    bottom: 0;
  }
  .competition-join-modal-container .competition-join-modal .btnClose{
    top: -57px !important;
  }
  .competition-join-modal-container .competition-join-modal .competition-first-heading{
    font-family: 'textfont';
    font-size: 12px;
    line-height: 14px;
    color: var(--primary-color);
    text-transform: uppercase;
    font-weight: bold;
  }
  .competition-join-modal-container .competition-join-modal .competition-name{
    font-family: 'titlefont';
    font-size: 19px;
    font-size: 23px;
    color: var(--primary-color);
    text-transform: uppercase;
    font-weight: normal;
  }
  .competition-join-modal-container .competition-join-modal .competition-second-heading{
    font-family: 'titlefont';
    font-size: 19px;
    line-height: 23px;
    color: var(--primary-color);
    text-transform: uppercase;
    margin-top: -8px;
    font-weight: normal;

  }
  .competition-join-modal-container .competition-join-modal .competition-join-input-container{
    width: 100%;
    max-width: 303px;
    height: 44px;
    border-radius: 8px;
    position: relative;
    margin-top: 9px;
  }
.competition-join-input-container label.missing{
    
right: 115px;
}
  .competition-join-modal-container .competition-join-modal .competition-join-input-container .competition-join-input{
    width: 100%;
    height: 100%;
    max-width: 303px;
    border: none;
    background-color: #F4F4F4;
    padding-left: 10px;
    padding-right: 10px;
    box-sizing: border-box;
    border-radius: 8px;
    border: 1px solid #E5E5E5;
  }
  .competition-join-modal-container .competition-join-modal .competition-join-input-container .competition-join-input::placeholder{
    font-family: 'textfont';
    color: var(--primary-color);
    font-weight: bold;
    opacity: 0.5;
    font-size: 13px;
    line-height: 16px;
  }
  
  .competition-join-modal-container .competition-join-modal .competition-join-input-container .competition-join-button{
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100px;
    height: 33px;
    background-color: var(--secondary-color);
    color: var(--primary-color);
    border: 1px solid var(--primary-color);
    right: 7px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    line-height: 22px;
    font-family: 'textfont';
    text-transform: uppercase;
    font-weight: bold;
    border-radius: 4px;
  }
  .competition-join-modal-container .competition-join-modal .competition-join-modal-description{
    font-family: 'textfont';
    font-size: 12px;
    line-height: 19px;
    color: #959595;
    text-align: center;
    max-width: 300px;
  }
  .competition-join-modal-container .competition-join-modal .competition-terms{
    color: #CCCCCC;
    font-family: 'textfont';
    font-size: 15px;
    text-align: center;
    text-decoration: underline;
    margin-top: 4px;
    opacity: .71;
  }
  .competition .competition-body .competition-leaderboard-container .competition-leaderboard-card .leaderboard-card-left .leaderboard-ranking{
    font-size: 18px;
  }
  .competition .competition-body .claimed-prize{
    font-family: 'textfont';
    font-size: 15px;
    line-height: 19px;
    color: #fff;
    text-align: center;
    margin-top: 20px;
  }
  /* endregion */

  .userpages .md-competition::before {
    font: 24px / 1 'FontAwesome';
    content: '\f091';
    margin-left: 3px;
    position: absolute;
    top: 4px;
    opacity: 0.7;
    font-size: 20px !important;
}

.modal.customizedID .head-on-scroll{
    display: none;
}
@media(min-width: 769px){
    .subPage.loyalty .homeFilter.ontop,
    .subPage.branchesCtrl .homeFilter.ontop{
        display: none;
    }
}