    #nprogress {
        pointer-events: none;
    }
    #nprogress .bar {
        background: #29d;
        position: fixed;
        z-index: 1031;
        top: 0;
        left: 0;
        width: 100%;
        height: 2px;
    }
    #nprogress .peg {
        display: block;
        position: absolute;
        right: 0;
        width: 100px;
        height: 100%;
        box-shadow: 0 0 10px #29d, 0 0 5px #29d;
        opacity: 1;
        transform: rotate(3deg) translateY(-4px);
    }
    #nprogress .spinner {
        display: block;
        position: fixed;
        z-index: 1031;
        top: 15px;
        right: 15px;
    }
    #nprogress .spinner-icon {
        width: 18px;
        height: 18px;
        box-sizing: border-box;
        border: 2px solid transparent;
        border-top-color: #29d;
        border-left-color: #29d;
        border-radius: 50%;
        animation: a 0.4s linear infinite;
    }
    .nprogress-custom-parent {
        overflow: hidden;
        position: relative;
    }
    .nprogress-custom-parent #nprogress .bar,
    .nprogress-custom-parent #nprogress .spinner {
        position: absolute;
    }
    @keyframes a {
        0% {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(1turn);
        }
    }
    :root {
        --blue: #007bff;
        --indigo: #6610f2;
        --purple: #6f42c1;
        --pink: #e83e8c;
        --red: #dc3545;
        --orange: #fd7e14;
        --yellow: #ffc107;
        --green: #28a745;
        --teal: #20c997;
        --cyan: #17a2b8;
        --gray: #6c757d;
        --gray-dark: #343a40;
        --primary: #ff6c6c;
        --secondary: #ffa2a2;
        --success: #28a745;
        --info: #17a2b8;
        --warning: #ffc107;
        --danger: #dc3545;
        --light: #f8f9fa;
        --dark: #000;
        --white: #fff;
        --black: #000;
        --indigo-100: #f0e7f9;
        --indigo-200: #e1d0f3;
        --indigo-300: #c1acdb;
        --indigo-400: #9a86b7;
        --indigo-500: #695787;
        --indigo-600: #513f74;
        --indigo-700: #3b2b61;
        --indigo-800: #281b4e;
        --indigo-900: #1b1040;
        --indigo: #695787;
        --coral-100: #ffe8dd;
        --coral-200: #fcb;
        --coral-300: #fa9;
        --coral-400: #ff8a7f;
        --coral-500: #f55;
        --coral-600: #db3e4b;
        --coral-700: #b72a43;
        --coral-800: #931b3a;
        --coral-900: #7a1035;
        --coral: #f55;
        --charcoal-100: #f5f2f7;
        --charcoal-200: #ebe6ef;
        --charcoal-300: #cac4d1;
        --charcoal-400: #9c97a3;
        --charcoal-500: #605c66;
        --charcoal-600: #4a4357;
        --charcoal-700: #362e49;
        --charcoal-800: #251d3b;
        --charcoal-900: #191130;
        --charcoal: #605c66;
        --lime-100: #ebfde5;
        --lime-200: #d3fbcc;
        --lime-300: #b3f3b0;
        --lime-400: #97e89a;
        --lime-500: #75d982;
        --lime-600: #55ba6c;
        --lime-700: #3a9c59;
        --lime-800: #257d49;
        --lime-900: #16683f;
        --lime: #75d982;
        --aqua-100: #ccfcef;
        --aqua-200: #9bf9e7;
        --aqua-300: #67ede0;
        --aqua-400: #40dcd9;
        --aqua-500: #0bbac6;
        --aqua-600: #0892aa;
        --aqua-700: #056f8e;
        --aqua-800: #034f72;
        --aqua-900: #023a5f;
        --aqua: #0bbac6;
        --honey-100: #fff5d8;
        --honey-200: #ffe9b2;
        --honey-300: #ffd98c;
        --honey-400: #ffca6f;
        --honey-500: #ffb140;
        --honey-600: #db8d2e;
        --honey-700: #b76d20;
        --honey-800: #934f14;
        --honey-900: #7a3b0c;
        --honey: #ffb140;
        --chili-100: #fddecd;
        --chili-200: #fbb59c;
        --chili-300: #f5826a;
        --chili-400: #ec5345;
        --chili-500: #e00d0d;
        --chili-600: #c00919;
        --chili-700: #a10621;
        --chili-800: #810424;
        --chili-900: #6b0226;
        --chili: #e00d0d;
        --transparent: transparent;
        --red: red;
        --soft-red: #ff6c6c;
        --dark-red: #f55;
        --white2: #eee;
        --white3: #ddd;
        --soft-pink4: #fff5d8;
        --soft-grey: #ededf4;
        --grey: #444;
        --purple-rum: #695787;
        --purple: #b18fa1;
        --soft-green4: #ebfde5;
        --soft-purple: #b6b6ef;
        --kimberly: #7878a5;
        --header: #fff;
        --dove-grey: #6e6e6e;
        --dark-blue: #1c3c81;
        --default-grey: #999;
        --soft-grey-2: #ccc;
        --soft-grey-3: #f5f5f5;
        --soft-grey-5: #f5f6f8;
        --dark-grey-3: #444;
        --dark-grey-5: #444;
        --dark-grey: #666;
        --dark-grey4: #605c66;
        --dark2: #1a1a1a;
        --chalice: #b2b2b2;
        --common-grey: #ededf4;
        --common-grey2: #f7f7ff;
        --common-grey3: #666;
        --mantis: #66cc6e;
        --pink: #ffeded;
        --darker-red: #f55;
        --breakpoint-xs: 0;
        --breakpoint-sm: 320px;
        --breakpoint-md: 360px;
        --breakpoint-lg: 375px;
        --breakpoint-xl: 411px;
        --breakpoint-xxl: 500px;
        --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
        --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    }
    * {
        box-sizing: border-box;
    }
    html {
        font-family: sans-serif;
        line-height: 1.15;
        -webkit-text-size-adjust: 100%;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    }
    article,
    footer,
    header,
    main,
    nav,
    section {
        display: block;
    }
    body {
        font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif;
        font-size: 1rem;
        color: #212529;
        text-align: left;
        background-color: #fff;
    }
    hr {
        box-sizing: content-box;
        height: 0;
        overflow: visible;
    }
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        margin-top: 0;
        margin-bottom: 0.5rem;
    }
    p {
        margin-top: 0;
        margin-bottom: 1rem;
    }
    address {
        font-style: normal;
        line-height: inherit;
    }
    address,
    dl,
    ol,
    ul {
        margin-bottom: 1rem;
    }
    dl,
    ol,
    ul {
        margin-top: 0;
    }
    ol ol,
    ol ul,
    ul ol,
    ul ul {
        margin-bottom: 0;
    }
    dt {
        font-weight: 700;
    }
    b,
    strong {
        font-weight: bolder;
    }
    small {
        font-size: 80%;
    }
    sub {
        position: relative;
        font-size: 75%;
        line-height: 0;
        vertical-align: baseline;
    }
    sub {
        bottom: -0.25em;
    }
    a {
        color: #007bff;
        text-decoration: none;
        background-color: transparent;
    }
    a:hover {
        color: #0056b3;
        text-decoration: underline;
    }
    a:not([href]):not([tabindex]),
    a:not([href]):not([tabindex]):focus,
    a:not([href]):not([tabindex]):hover {
        color: inherit;
        text-decoration: none;
    }
    a:not([href]):not([tabindex]):focus {
        outline: 0;
    }
    code {
        font-family: SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
        font-size: 1em;
    }
    img {
        border-style: none;
    }
    img,
    svg {
        vertical-align: middle;
    }
    svg {
        overflow: hidden;
    }
    table {
        border-collapse: collapse;
    }
    caption {
        padding-top: 0.75rem;
        padding-bottom: 0.75rem;
        color: #6c757d;
        text-align: left;
        caption-side: bottom;
    }
    th {
        text-align: inherit;
    }
    label {
        display: inline-block;
        margin-bottom: 0.5rem;
    }
    button {
        border-radius: 0;
    }
    button:focus {
        outline: 1px dotted;
        outline: 5px auto -webkit-focus-ring-color;
    }
    button,
    input,
    select,
    textarea {
        margin: 0;
        font-family: inherit;
        font-size: inherit;
        line-height: inherit;
    }
    button,
    input {
        overflow: visible;
    }
    button,
    select {
        text-transform: none;
    }
    select {
        word-wrap: normal;
    }
    [type="button"],
    [type="reset"],
    [type="submit"],
    button {
        -webkit-appearance: button;
    }
    [type="button"]:not(:disabled),
    [type="reset"]:not(:disabled),
    [type="submit"]:not(:disabled),
    button:not(:disabled) {
        cursor: pointer;
    }
    [type="button"]::-moz-focus-inner,
    [type="reset"]::-moz-focus-inner,
    [type="submit"]::-moz-focus-inner,
    button::-moz-focus-inner {
        padding: 0;
        border-style: none;
    }
    input[type="checkbox"],
    input[type="radio"] {
        box-sizing: border-box;
        padding: 0;
    }
    input[type="date"],
    input[type="month"],
    input[type="time"] {
        -webkit-appearance: listbox;
    }
    textarea {
        overflow: auto;
        resize: vertical;
    }
    legend {
        display: block;
        width: 100%;
        max-width: 100%;
        padding: 0;
        margin-bottom: 0.5rem;
        font-size: 1.5rem;
        line-height: inherit;
        color: inherit;
        white-space: normal;
    }
    progress {
        vertical-align: baseline;
    }
    [type="number"]::-webkit-inner-spin-button,
    [type="number"]::-webkit-outer-spin-button {
        height: auto;
    }
    [type="search"] {
        outline-offset: -2px;
        -webkit-appearance: none;
    }
    [type="search"]::-webkit-search-decoration {
        -webkit-appearance: none;
    }
    summary {
        display: list-item;
        cursor: pointer;
    }
    [hidden] {
        display: none !important;
    }
    .container {
        width: 100%;
        padding-right: 8px;
        padding-left: 8px;
        margin-right: auto;
        margin-left: auto;
    }
    @media (min-width: 320px) {
        .container {
            max-width: 100vw;
        }
    }
    @media (min-width: 360px) {
        .container {
            max-width: 100vw;
        }
    }
    @media (min-width: 375px) {
        .container {
            max-width: 500px;
        }
    }
    @media (min-width: 411px) {
        .container {
            max-width: 500px;
        }
    }
    .row {
        display: flex;
        flex-wrap: wrap;
    }
    .no-gutters,
    .row {
        margin-right: 0;
        margin-left: 0;
    }
    .no-gutters > .col,
    .no-gutters > [class*="col-"] {
        padding-right: 0;
        padding-left: 0;
    }
    @media (min-width: 320px) {
        .col-1 {
            flex: 0 0 25%;
            max-width: 25%;
        }
        .col-2 {
            flex: 0 0 50%;
            max-width: 50%;
        }
        .col-3 {
            flex: 0 0 75%;
            max-width: 75%;
        }
        .col-4 {
            flex: 0 0 100%;
            max-width: 100%;
        }
    }
    @media (min-width: 360px) {
        .col-1 {
            flex: 0 0 16.66667%;
            max-width: 16.66667%;
        }
        .col-2 {
            flex: 0 0 33.33333%;
            max-width: 33.33333%;
        }
        .col-3 {
            flex: 0 0 50%;
            max-width: 50%;
        }
        .col-4 {
            flex: 0 0 66.66667%;
            max-width: 66.66667%;
        }
        .col-6 {
            flex: 0 0 100%;
            max-width: 100%;
        }
    }
    @media (min-width: 375px) {
        .col-1 {
            flex: 0 0 12.5%;
            max-width: 12.5%;
        }
        .col-2 {
            flex: 0 0 25%;
            max-width: 25%;
        }
        .col-3 {
            flex: 0 0 37.5%;
            max-width: 37.5%;
        }
        .col-4 {
            flex: 0 0 50%;
            max-width: 50%;
        }
        .col-6 {
            flex: 0 0 75%;
            max-width: 75%;
        }
    }
    @media (min-width: 411px) {
        .col-1 {
            flex: 0 0 12.5%;
            max-width: 12.5%;
        }
        .col-2 {
            flex: 0 0 25%;
            max-width: 25%;
        }
        .col-3 {
            flex: 0 0 37.5%;
            max-width: 37.5%;
        }
        .col-4 {
            flex: 0 0 50%;
            max-width: 50%;
        }
        .col-6 {
            flex: 0 0 75%;
            max-width: 75%;
        }
    }
    .col {
        flex-basis: 0;
        flex-grow: 1;
        max-width: 100%;
    }
    .col-1 {
        flex: 0 0 25%;
        max-width: 25%;
    }
    .col-2 {
        flex: 0 0 50%;
        max-width: 50%;
    }
    .col-3 {
        flex: 0 0 75%;
        max-width: 75%;
    }
    .col-4 {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .order-1 {
        order: 1;
    }
    @media (min-width: 320px) {
        .col-sm-1 {
            flex: 0 0 25%;
            max-width: 25%;
        }
        .col-sm-2 {
            flex: 0 0 50%;
            max-width: 50%;
        }
    }
    @media (min-width: 360px) {
        .col-md-1 {
            flex: 0 0 25%;
            max-width: 25%;
        }
        .col-md-3 {
            flex: 0 0 75%;
            max-width: 75%;
        }
    }
    @media (min-width: 375px) {
        .col-lg-1 {
            flex: 0 0 16.66667%;
            max-width: 16.66667%;
        }
        .col-lg-4 {
            flex: 0 0 66.66667%;
            max-width: 66.66667%;
        }
    }
    .col,
    .col-1,
    .col-2,
    .col-3,
    .col-4,
    .col-lg-1,
    .col-lg-4,
    .col-md-1,
    .col-md-3,
    .col-sm-1,
    .col-sm-2 {
        position: relative;
        width: 100%;
        padding-right: 8px;
        padding-left: 8px;
    }
    .btn {
        display: inline-block;
        font-weight: 400;
        color: #212529;
        text-align: center;
        vertical-align: middle;
        user-select: none;
        background-color: transparent;
        border: 1px solid transparent;
        padding: 0.375rem 0.75rem;
        font-size: 1rem;
        line-height: 1.5;
        border-radius: 0.25rem;
        transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    }
    @media (prefers-reduced-motion: reduce) {
        .btn {
            transition: none;
        }
    }
    .btn:hover {
        color: #212529;
        text-decoration: none;
    }
    .btn.focus,
    .btn:focus {
        outline: 0;
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
    }
    .btn.disabled,
    .btn:disabled {
        opacity: 0.65;
    }
    a.btn.disabled {
        pointer-events: none;
    }
    .btn-soft-red {
        color: #212529;
        background-color: #ff6c6c;
        border-color: #ff6c6c;
    }
    .btn-soft-red:hover {
        color: #fff;
        background-color: #ff4646;
        border-color: #ff3939;
    }
    .btn-soft-red.focus,
    .btn-soft-red:focus {
        box-shadow: 0 0 0 0.2rem rgba(222, 97, 98, 0.5);
    }
    .btn-soft-red.disabled,
    .btn-soft-red:disabled {
        color: #212529;
        background-color: #ff6c6c;
        border-color: #ff6c6c;
    }
    .btn-soft-red:not(:disabled):not(.disabled).active,
    .btn-soft-red:not(:disabled):not(.disabled):active {
        color: #fff;
        background-color: #ff3939;
        border-color: #ff2c2c;
    }
    .btn-soft-red:not(:disabled):not(.disabled).active:focus,
    .btn-soft-red:not(:disabled):not(.disabled):active:focus {
        box-shadow: 0 0 0 0.2rem rgba(222, 97, 98, 0.5);
    }
    .btn-outline-soft-red {
        color: #ff6c6c;
        border-color: #ff6c6c;
    }
    .btn-outline-soft-red:hover {
        color: #212529;
        background-color: #ff6c6c;
        border-color: #ff6c6c;
    }
    .btn-outline-soft-red.focus,
    .btn-outline-soft-red:focus {
        box-shadow: 0 0 0 0.2rem hsla(0, 100%, 71%, 0.5);
    }
    .btn-outline-soft-red.disabled,
    .btn-outline-soft-red:disabled {
        color: #ff6c6c;
        background-color: transparent;
    }
    .btn-outline-soft-red:not(:disabled):not(.disabled).active,
    .btn-outline-soft-red:not(:disabled):not(.disabled):active {
        color: #212529;
        background-color: #ff6c6c;
        border-color: #ff6c6c;
    }
    .btn-outline-soft-red:not(:disabled):not(.disabled).active:focus,
    .btn-outline-soft-red:not(:disabled):not(.disabled):active:focus {
        box-shadow: 0 0 0 0.2rem hsla(0, 100%, 71%, 0.5);
    }
    .btn-sm {
        padding: 0.25rem 0.5rem;
        font-size: 0.875rem;
        line-height: 1.5;
        border-radius: 0.2rem;
    }
    .btn-block {
        display: block;
        width: 100%;
    }
    .btn-block + .btn-block {
        margin-top: 0.5rem;
    }
    input[type="button"].btn-block,
    input[type="reset"].btn-block,
    input[type="submit"].btn-block {
        width: 100%;
    }
    .align-bottom {
        vertical-align: bottom !important;
    }
    .bg-primary {
        background-color: #ff6c6c !important;
    }
    a.bg-primary:focus,
    a.bg-primary:hover,
    button.bg-primary:focus,
    button.bg-primary:hover {
        background-color: #ff3939 !important;
    }
    .bg-secondary {
        background-color: #ffa2a2 !important;
    }
    a.bg-secondary:focus,
    a.bg-secondary:hover,
    button.bg-secondary:focus,
    button.bg-secondary:hover {
        background-color: #ff6f6f !important;
    }
    .bg-success {
        background-color: #28a745 !important;
    }
    a.bg-success:focus,
    a.bg-success:hover,
    button.bg-success:focus,
    button.bg-success:hover {
        background-color: #1e7e34 !important;
    }
    .bg-info {
        background-color: #17a2b8 !important;
    }
    a.bg-info:focus,
    a.bg-info:hover,
    button.bg-info:focus,
    button.bg-info:hover {
        background-color: #117a8b !important;
    }
    .bg-warning {
        background-color: #ffc107 !important;
    }
    a.bg-warning:focus,
    a.bg-warning:hover,
    button.bg-warning:focus,
    button.bg-warning:hover {
        background-color: #d39e00 !important;
    }
    .bg-danger {
        background-color: #dc3545 !important;
    }
    a.bg-danger:focus,
    a.bg-danger:hover,
    button.bg-danger:focus,
    button.bg-danger:hover {
        background-color: #bd2130 !important;
    }
    .bg-light {
        background-color: #f8f9fa !important;
    }
    a.bg-light:focus,
    a.bg-light:hover,
    button.bg-light:focus,
    button.bg-light:hover {
        background-color: #dae0e5 !important;
    }
    .bg-dark,
    a.bg-dark:focus,
    a.bg-dark:hover,
    button.bg-dark:focus,
    button.bg-dark:hover {
        background-color: #000 !important;
    }
    a.bg-white:focus,
    a.bg-white:hover,
    button.bg-white:focus,
    button.bg-white:hover {
        background-color: #e6e6e6 !important;
    }
    .bg-black,
    a.bg-black:focus,
    a.bg-black:hover,
    button.bg-black:focus,
    button.bg-black:hover {
        background-color: #000 !important;
    }
    .bg-indigo-100 {
        background-color: #f0e7f9 !important;
    }
    a.bg-indigo-100:focus,
    a.bg-indigo-100:hover,
    button.bg-indigo-100:focus,
    button.bg-indigo-100:hover {
        background-color: #d7beef !important;
    }
    .bg-indigo-200 {
        background-color: #e1d0f3 !important;
    }
    a.bg-indigo-200:focus,
    a.bg-indigo-200:hover,
    button.bg-indigo-200:focus,
    button.bg-indigo-200:hover {
        background-color: #c7a7e9 !important;
    }
    .bg-indigo-300 {
        background-color: #c1acdb !important;
    }
    a.bg-indigo-300:focus,
    a.bg-indigo-300:hover,
    button.bg-indigo-300:focus,
    button.bg-indigo-300:hover {
        background-color: #a688cc !important;
    }
    .bg-indigo-400 {
        background-color: #9a86b7 !important;
    }
    a.bg-indigo-400:focus,
    a.bg-indigo-400:hover,
    button.bg-indigo-400:focus,
    button.bg-indigo-400:hover {
        background-color: #7f66a4 !important;
    }
    .bg-indigo-500 {
        background-color: #695787 !important;
    }
    a.bg-indigo-500:focus,
    a.bg-indigo-500:hover,
    button.bg-indigo-500:focus,
    button.bg-indigo-500:hover {
        background-color: #514368 !important;
    }
    .bg-indigo-600 {
        background-color: #513f74 !important;
    }
    a.bg-indigo-600:focus,
    a.bg-indigo-600:hover,
    button.bg-indigo-600:focus,
    button.bg-indigo-600:hover {
        background-color: #3a2d53 !important;
    }
    .bg-indigo-700 {
        background-color: #3b2b61 !important;
    }
    a.bg-indigo-700:focus,
    a.bg-indigo-700:hover,
    button.bg-indigo-700:focus,
    button.bg-indigo-700:hover {
        background-color: #261b3e !important;
    }
    .bg-indigo-800 {
        background-color: #281b4e !important;
    }
    a.bg-indigo-800:focus,
    a.bg-indigo-800:hover,
    button.bg-indigo-800:focus,
    button.bg-indigo-800:hover {
        background-color: #150e28 !important;
    }
    .bg-indigo-900 {
        background-color: #1b1040 !important;
    }
    a.bg-indigo-900:focus,
    a.bg-indigo-900:hover,
    button.bg-indigo-900:focus,
    button.bg-indigo-900:hover {
        background-color: #0a0617 !important;
    }
    .bg-indigo {
        background-color: #695787 !important;
    }
    a.bg-indigo:focus,
    a.bg-indigo:hover,
    button.bg-indigo:focus,
    button.bg-indigo:hover {
        background-color: #514368 !important;
    }
    .bg-coral-100 {
        background-color: #ffe8dd !important;
    }
    a.bg-coral-100:focus,
    a.bg-coral-100:hover,
    button.bg-coral-100:focus,
    button.bg-coral-100:hover {
        background-color: #ffc6aa !important;
    }
    .bg-coral-200 {
        background-color: #fcb !important;
    }
    a.bg-coral-200:focus,
    a.bg-coral-200:hover,
    button.bg-coral-200:focus,
    button.bg-coral-200:hover {
        background-color: #ffa688 !important;
    }
    .bg-coral-300 {
        background-color: #fa9 !important;
    }
    a.bg-coral-300:focus,
    a.bg-coral-300:hover,
    button.bg-coral-300:focus,
    button.bg-coral-300:hover {
        background-color: #ff8066 !important;
    }
    .bg-coral-400 {
        background-color: #ff8a7f !important;
    }
    a.bg-coral-400:focus,
    a.bg-coral-400:hover,
    button.bg-coral-400:focus,
    button.bg-coral-400:hover {
        background-color: #ff5b4c !important;
    }
    .bg-coral-500 {
        background-color: #f55 !important;
    }
    a.bg-coral-500:focus,
    a.bg-coral-500:hover,
    button.bg-coral-500:focus,
    button.bg-coral-500:hover {
        background-color: #f22 !important;
    }
    .bg-coral-600 {
        background-color: #db3e4b !important;
    }
    a.bg-coral-600:focus,
    a.bg-coral-600:hover,
    button.bg-coral-600:focus,
    button.bg-coral-600:hover {
        background-color: #c22431 !important;
    }
    .bg-coral-700 {
        background-color: #b72a43 !important;
    }
    a.bg-coral-700:focus,
    a.bg-coral-700:hover,
    button.bg-coral-700:focus,
    button.bg-coral-700:hover {
        background-color: #8e2034 !important;
    }
    .bg-coral-800 {
        background-color: #931b3a !important;
    }
    a.bg-coral-800:focus,
    a.bg-coral-800:hover,
    button.bg-coral-800:focus,
    button.bg-coral-800:hover {
        background-color: #681329 !important;
    }
    .bg-coral-900 {
        background-color: #7a1035 !important;
    }
    a.bg-coral-900:focus,
    a.bg-coral-900:hover,
    button.bg-coral-900:focus,
    button.bg-coral-900:hover {
        background-color: #4d0a21 !important;
    }
    .bg-coral {
        background-color: #f55 !important;
    }
    a.bg-coral:focus,
    a.bg-coral:hover,
    button.bg-coral:focus,
    button.bg-coral:hover {
        background-color: #f22 !important;
    }
    .bg-charcoal-100 {
        background-color: #f5f2f7 !important;
    }
    a.bg-charcoal-100:focus,
    a.bg-charcoal-100:hover,
    button.bg-charcoal-100:focus,
    button.bg-charcoal-100:hover {
        background-color: #ddd2e4 !important;
    }
    .bg-charcoal-200 {
        background-color: #ebe6ef !important;
    }
    a.bg-charcoal-200:focus,
    a.bg-charcoal-200:hover,
    button.bg-charcoal-200:focus,
    button.bg-charcoal-200:hover {
        background-color: #d2c7db !important;
    }
    .bg-charcoal-300 {
        background-color: #cac4d1 !important;
    }
    a.bg-charcoal-300:focus,
    a.bg-charcoal-300:hover,
    button.bg-charcoal-300:focus,
    button.bg-charcoal-300:hover {
        background-color: #b0a7bb !important;
    }
    .bg-charcoal-400 {
        background-color: #9c97a3 !important;
    }
    a.bg-charcoal-400:focus,
    a.bg-charcoal-400:hover,
    button.bg-charcoal-400:focus,
    button.bg-charcoal-400:hover {
        background-color: #827c8b !important;
    }
    .bg-charcoal-500 {
        background-color: #605c66 !important;
    }
    a.bg-charcoal-500:focus,
    a.bg-charcoal-500:hover,
    button.bg-charcoal-500:focus,
    button.bg-charcoal-500:hover {
        background-color: #47444b !important;
    }
    .bg-charcoal-600 {
        background-color: #4a4357 !important;
    }
    a.bg-charcoal-600:focus,
    a.bg-charcoal-600:hover,
    button.bg-charcoal-600:focus,
    button.bg-charcoal-600:hover {
        background-color: #312d3a !important;
    }
    .bg-charcoal-700 {
        background-color: #362e49 !important;
    }
    a.bg-charcoal-700:focus,
    a.bg-charcoal-700:hover,
    button.bg-charcoal-700:focus,
    button.bg-charcoal-700:hover {
        background-color: #1f1a2a !important;
    }
    .bg-charcoal-800 {
        background-color: #251d3b !important;
    }
    a.bg-charcoal-800:focus,
    a.bg-charcoal-800:hover,
    button.bg-charcoal-800:focus,
    button.bg-charcoal-800:hover {
        background-color: #100c19 !important;
    }
    .bg-charcoal-900 {
        background-color: #191130 !important;
    }
    a.bg-charcoal-900:focus,
    a.bg-charcoal-900:hover,
    button.bg-charcoal-900:focus,
    button.bg-charcoal-900:hover {
        background-color: #05040a !important;
    }
    .bg-charcoal {
        background-color: #605c66 !important;
    }
    a.bg-charcoal:focus,
    a.bg-charcoal:hover,
    button.bg-charcoal:focus,
    button.bg-charcoal:hover {
        background-color: #47444b !important;
    }
    .bg-lime-100 {
        background-color: #ebfde5 !important;
    }
    a.bg-lime-100:focus,
    a.bg-lime-100:hover,
    button.bg-lime-100:focus,
    button.bg-lime-100:hover {
        background-color: #c7f9b6 !important;
    }
    .bg-lime-200 {
        background-color: #d3fbcc !important;
    }
    a.bg-lime-200:focus,
    a.bg-lime-200:hover,
    button.bg-lime-200:focus,
    button.bg-lime-200:hover {
        background-color: #aaf79d !important;
    }
    .bg-lime-300 {
        background-color: #b3f3b0 !important;
    }
    a.bg-lime-300:focus,
    a.bg-lime-300:hover,
    button.bg-lime-300:focus,
    button.bg-lime-300:hover {
        background-color: #88ec84 !important;
    }
    .bg-lime-400 {
        background-color: #97e89a !important;
    }
    a.bg-lime-400:focus,
    a.bg-lime-400:hover,
    button.bg-lime-400:focus,
    button.bg-lime-400:hover {
        background-color: #6ddf71 !important;
    }
    .bg-lime-500 {
        background-color: #75d982 !important;
    }
    a.bg-lime-500:focus,
    a.bg-lime-500:hover,
    button.bg-lime-500:focus,
    button.bg-lime-500:hover {
        background-color: #4dce5e !important;
    }
    .bg-lime-600 {
        background-color: #55ba6c !important;
    }
    a.bg-lime-600:focus,
    a.bg-lime-600:hover,
    button.bg-lime-600:focus,
    button.bg-lime-600:hover {
        background-color: #409c55 !important;
    }
    .bg-lime-700 {
        background-color: #3a9c59 !important;
    }
    a.bg-lime-700:focus,
    a.bg-lime-700:hover,
    button.bg-lime-700:focus,
    button.bg-lime-700:hover {
        background-color: #2c7744 !important;
    }
    .bg-lime-800 {
        background-color: #257d49 !important;
    }
    a.bg-lime-800:focus,
    a.bg-lime-800:hover,
    button.bg-lime-800:focus,
    button.bg-lime-800:hover {
        background-color: #195632 !important;
    }
    .bg-lime-900 {
        background-color: #16683f !important;
    }
    a.bg-lime-900:focus,
    a.bg-lime-900:hover,
    button.bg-lime-900:focus,
    button.bg-lime-900:hover {
        background-color: #0d3e26 !important;
    }
    .bg-lime {
        background-color: #75d982 !important;
    }
    a.bg-lime:focus,
    a.bg-lime:hover,
    button.bg-lime:focus,
    button.bg-lime:hover {
        background-color: #4dce5e !important;
    }
    .bg-aqua-100 {
        background-color: #ccfcef !important;
    }
    a.bg-aqua-100:focus,
    a.bg-aqua-100:hover,
    button.bg-aqua-100:focus,
    button.bg-aqua-100:hover {
        background-color: #9cf9e0 !important;
    }
    .bg-aqua-200 {
        background-color: #9bf9e7 !important;
    }
    a.bg-aqua-200:focus,
    a.bg-aqua-200:hover,
    button.bg-aqua-200:focus,
    button.bg-aqua-200:hover {
        background-color: #6bf6db !important;
    }
    .bg-aqua-300 {
        background-color: #67ede0 !important;
    }
    a.bg-aqua-300:focus,
    a.bg-aqua-300:hover,
    button.bg-aqua-300:focus,
    button.bg-aqua-300:hover {
        background-color: #39e8d7 !important;
    }
    .bg-aqua-400 {
        background-color: #40dcd9 !important;
    }
    a.bg-aqua-400:focus,
    a.bg-aqua-400:hover,
    button.bg-aqua-400:focus,
    button.bg-aqua-400:hover {
        background-color: #24c5c2 !important;
    }
    .bg-aqua-500 {
        background-color: #0bbac6 !important;
    }
    a.bg-aqua-500:focus,
    a.bg-aqua-500:hover,
    button.bg-aqua-500:focus,
    button.bg-aqua-500:hover {
        background-color: #088d96 !important;
    }
    .bg-aqua-600 {
        background-color: #0892aa !important;
    }
    a.bg-aqua-600:focus,
    a.bg-aqua-600:hover,
    button.bg-aqua-600:focus,
    button.bg-aqua-600:hover {
        background-color: #066879 !important;
    }
    .bg-aqua-700 {
        background-color: #056f8e !important;
    }
    a.bg-aqua-700:focus,
    a.bg-aqua-700:hover,
    button.bg-aqua-700:focus,
    button.bg-aqua-700:hover {
        background-color: #03485d !important;
    }
    .bg-aqua-800 {
        background-color: #034f72 !important;
    }
    a.bg-aqua-800:focus,
    a.bg-aqua-800:hover,
    button.bg-aqua-800:focus,
    button.bg-aqua-800:hover {
        background-color: #022d40 !important;
    }
    .bg-aqua-900 {
        background-color: #023a5f !important;
    }
    a.bg-aqua-900:focus,
    a.bg-aqua-900:hover,
    button.bg-aqua-900:focus,
    button.bg-aqua-900:hover {
        background-color: #011c2d !important;
    }
    .bg-aqua {
        background-color: #0bbac6 !important;
    }
    a.bg-aqua:focus,
    a.bg-aqua:hover,
    button.bg-aqua:focus,
    button.bg-aqua:hover {
        background-color: #088d96 !important;
    }
    .bg-honey-100 {
        background-color: #fff5d8 !important;
    }
    a.bg-honey-100:focus,
    a.bg-honey-100:hover,
    button.bg-honey-100:focus,
    button.bg-honey-100:hover {
        background-color: #ffe8a5 !important;
    }
    .bg-honey-200 {
        background-color: #ffe9b2 !important;
    }
    a.bg-honey-200:focus,
    a.bg-honey-200:hover,
    button.bg-honey-200:focus,
    button.bg-honey-200:hover {
        background-color: #ffda7f !important;
    }
    .bg-honey-300 {
        background-color: #ffd98c !important;
    }
    a.bg-honey-300:focus,
    a.bg-honey-300:hover,
    button.bg-honey-300:focus,
    button.bg-honey-300:hover {
        background-color: #ffc859 !important;
    }
    .bg-honey-400 {
        background-color: #ffca6f !important;
    }
    a.bg-honey-400:focus,
    a.bg-honey-400:hover,
    button.bg-honey-400:focus,
    button.bg-honey-400:hover {
        background-color: #ffb73c !important;
    }
    .bg-honey-500 {
        background-color: #ffb140 !important;
    }
    a.bg-honey-500:focus,
    a.bg-honey-500:hover,
    button.bg-honey-500:focus,
    button.bg-honey-500:hover {
        background-color: #ff9c0d !important;
    }
    .bg-honey-600 {
        background-color: #db8d2e !important;
    }
    a.bg-honey-600:focus,
    a.bg-honey-600:hover,
    button.bg-honey-600:focus,
    button.bg-honey-600:hover {
        background-color: #b7721f !important;
    }
    .bg-honey-700 {
        background-color: #b76d20 !important;
    }
    a.bg-honey-700:focus,
    a.bg-honey-700:hover,
    button.bg-honey-700:focus,
    button.bg-honey-700:hover {
        background-color: #8c5318 !important;
    }
    .bg-honey-800 {
        background-color: #934f14 !important;
    }
    a.bg-honey-800:focus,
    a.bg-honey-800:hover,
    button.bg-honey-800:focus,
    button.bg-honey-800:hover {
        background-color: #66370e !important;
    }
    .bg-honey-900 {
        background-color: #7a3b0c !important;
    }
    a.bg-honey-900:focus,
    a.bg-honey-900:hover,
    button.bg-honey-900:focus,
    button.bg-honey-900:hover {
        background-color: #4c2507 !important;
    }
    .bg-honey {
        background-color: #ffb140 !important;
    }
    a.bg-honey:focus,
    a.bg-honey:hover,
    button.bg-honey:focus,
    button.bg-honey:hover {
        background-color: #ff9c0d !important;
    }
    .bg-chili-100 {
        background-color: #fddecd !important;
    }
    a.bg-chili-100:focus,
    a.bg-chili-100:hover,
    button.bg-chili-100:focus,
    button.bg-chili-100:hover {
        background-color: #fbbe9c !important;
    }
    .bg-chili-200 {
        background-color: #fbb59c !important;
    }
    a.bg-chili-200:focus,
    a.bg-chili-200:hover,
    button.bg-chili-200:focus,
    button.bg-chili-200:hover {
        background-color: #f9906b !important;
    }
    .bg-chili-300 {
        background-color: #f5826a !important;
    }
    a.bg-chili-300:focus,
    a.bg-chili-300:hover,
    button.bg-chili-300:focus,
    button.bg-chili-300:hover {
        background-color: #f25a3a !important;
    }
    .bg-chili-400 {
        background-color: #ec5345 !important;
    }
    a.bg-chili-400:focus,
    a.bg-chili-400:hover,
    button.bg-chili-400:focus,
    button.bg-chili-400:hover {
        background-color: #e62918 !important;
    }
    .bg-chili-500 {
        background-color: #e00d0d !important;
    }
    a.bg-chili-500:focus,
    a.bg-chili-500:hover,
    button.bg-chili-500:focus,
    button.bg-chili-500:hover {
        background-color: #b00a0a !important;
    }
    .bg-chili-600 {
        background-color: #c00919 !important;
    }
    a.bg-chili-600:focus,
    a.bg-chili-600:hover,
    button.bg-chili-600:focus,
    button.bg-chili-600:hover {
        background-color: #8f0713 !important;
    }
    .bg-chili-700 {
        background-color: #a10621 !important;
    }
    a.bg-chili-700:focus,
    a.bg-chili-700:hover,
    button.bg-chili-700:focus,
    button.bg-chili-700:hover {
        background-color: #700417 !important;
    }
    .bg-chili-800 {
        background-color: #810424 !important;
    }
    a.bg-chili-800:focus,
    a.bg-chili-800:hover,
    button.bg-chili-800:focus,
    button.bg-chili-800:hover {
        background-color: #500216 !important;
    }
    .bg-chili-900 {
        background-color: #6b0226 !important;
    }
    a.bg-chili-900:focus,
    a.bg-chili-900:hover,
    button.bg-chili-900:focus,
    button.bg-chili-900:hover {
        background-color: #390114 !important;
    }
    .bg-chili {
        background-color: #e00d0d !important;
    }
    a.bg-chili:focus,
    a.bg-chili:hover,
    button.bg-chili:focus,
    button.bg-chili:hover {
        background-color: #b00a0a !important;
    }
    a.bg-transparent:focus,
    a.bg-transparent:hover,
    button.bg-transparent:focus,
    button.bg-transparent:hover {
        background-color: transparent !important;
    }
    .bg-red {
        background-color: red !important;
    }
    a.bg-red:focus,
    a.bg-red:hover,
    button.bg-red:focus,
    button.bg-red:hover {
        background-color: #c00 !important;
    }
    .bg-soft-red {
        background-color: #ff6c6c !important;
    }
    a.bg-soft-red:focus,
    a.bg-soft-red:hover,
    button.bg-soft-red:focus,
    button.bg-soft-red:hover {
        background-color: #ff3939 !important;
    }
    .bg-dark-red {
        background-color: #f55 !important;
    }
    a.bg-dark-red:focus,
    a.bg-dark-red:hover,
    button.bg-dark-red:focus,
    button.bg-dark-red:hover {
        background-color: #f22 !important;
    }
    .bg-white2 {
        background-color: #eee !important;
    }
    a.bg-white2:focus,
    a.bg-white2:hover,
    button.bg-white2:focus,
    button.bg-white2:hover {
        background-color: #d5d5d5 !important;
    }
    .bg-white3 {
        background-color: #ddd !important;
    }
    a.bg-white3:focus,
    a.bg-white3:hover,
    button.bg-white3:focus,
    button.bg-white3:hover {
        background-color: #c4c4c4 !important;
    }
    .bg-soft-pink4 {
        background-color: #fff5d8 !important;
    }
    a.bg-soft-pink4:focus,
    a.bg-soft-pink4:hover,
    button.bg-soft-pink4:focus,
    button.bg-soft-pink4:hover {
        background-color: #ffe8a5 !important;
    }
    .bg-soft-grey {
        background-color: #ededf4 !important;
    }
    a.bg-soft-grey:focus,
    a.bg-soft-grey:hover,
    button.bg-soft-grey:focus,
    button.bg-soft-grey:hover {
        background-color: #cdcde1 !important;
    }
    .bg-grey {
        background-color: #444 !important;
    }
    a.bg-grey:focus,
    a.bg-grey:hover,
    button.bg-grey:focus,
    button.bg-grey:hover {
        background-color: #2b2b2b !important;
    }
    .bg-purple-rum {
        background-color: #695787 !important;
    }
    a.bg-purple-rum:focus,
    a.bg-purple-rum:hover,
    button.bg-purple-rum:focus,
    button.bg-purple-rum:hover {
        background-color: #514368 !important;
    }
    .bg-purple {
        background-color: #b18fa1 !important;
    }
    a.bg-purple:focus,
    a.bg-purple:hover,
    button.bg-purple:focus,
    button.bg-purple:hover {
        background-color: #9c7188 !important;
    }
    .bg-soft-green4 {
        background-color: #ebfde5 !important;
    }
    a.bg-soft-green4:focus,
    a.bg-soft-green4:hover,
    button.bg-soft-green4:focus,
    button.bg-soft-green4:hover {
        background-color: #c7f9b6 !important;
    }
    .bg-soft-purple {
        background-color: #b6b6ef !important;
    }
    a.bg-soft-purple:focus,
    a.bg-soft-purple:hover,
    button.bg-soft-purple:focus,
    button.bg-soft-purple:hover {
        background-color: #8c8ce6 !important;
    }
    .bg-kimberly {
        background-color: #7878a5 !important;
    }
    a.bg-kimberly:focus,
    a.bg-kimberly:hover,
    button.bg-kimberly:focus,
    button.bg-kimberly:hover {
        background-color: #5e5e8c !important;
    }
    .bg-header {
        background-color: #fff !important;
    }
    a.bg-header:focus,
    a.bg-header:hover,
    button.bg-header:focus,
    button.bg-header:hover {
        background-color: #e6e6e6 !important;
    }
    .bg-dove-grey {
        background-color: #6e6e6e !important;
    }
    a.bg-dove-grey:focus,
    a.bg-dove-grey:hover,
    button.bg-dove-grey:focus,
    button.bg-dove-grey:hover {
        background-color: #555 !important;
    }
    .bg-dark-blue {
        background-color: #1c3c81 !important;
    }
    a.bg-dark-blue:focus,
    a.bg-dark-blue:hover,
    button.bg-dark-blue:focus,
    button.bg-dark-blue:hover {
        background-color: #132957 !important;
    }
    .bg-default-grey {
        background-color: #999 !important;
    }
    a.bg-default-grey:focus,
    a.bg-default-grey:hover,
    button.bg-default-grey:focus,
    button.bg-default-grey:hover {
        background-color: gray !important;
    }
    .bg-soft-grey-2 {
        background-color: #ccc !important;
    }
    a.bg-soft-grey-2:focus,
    a.bg-soft-grey-2:hover,
    button.bg-soft-grey-2:focus,
    button.bg-soft-grey-2:hover {
        background-color: #b3b3b3 !important;
    }
    .bg-soft-grey-3 {
        background-color: #f5f5f5 !important;
    }
    a.bg-soft-grey-3:focus,
    a.bg-soft-grey-3:hover,
    button.bg-soft-grey-3:focus,
    button.bg-soft-grey-3:hover {
        background-color: #dcdcdc !important;
    }
    .bg-soft-grey-5 {
        background-color: #f5f6f8 !important;
    }
    a.bg-soft-grey-5:focus,
    a.bg-soft-grey-5:hover,
    button.bg-soft-grey-5:focus,
    button.bg-soft-grey-5:hover {
        background-color: #d7dbe3 !important;
    }
    .bg-dark-grey-3 {
        background-color: #444 !important;
    }
    a.bg-dark-grey-3:focus,
    a.bg-dark-grey-3:hover,
    button.bg-dark-grey-3:focus,
    button.bg-dark-grey-3:hover {
        background-color: #2b2b2b !important;
    }
    .bg-dark-grey-5 {
        background-color: #444 !important;
    }
    a.bg-dark-grey-5:focus,
    a.bg-dark-grey-5:hover,
    button.bg-dark-grey-5:focus,
    button.bg-dark-grey-5:hover {
        background-color: #2b2b2b !important;
    }
    .bg-dark-grey {
        background-color: #666 !important;
    }
    a.bg-dark-grey:focus,
    a.bg-dark-grey:hover,
    button.bg-dark-grey:focus,
    button.bg-dark-grey:hover {
        background-color: #4d4d4d !important;
    }
    .bg-dark-grey4 {
        background-color: #605c66 !important;
    }
    a.bg-dark-grey4:focus,
    a.bg-dark-grey4:hover,
    button.bg-dark-grey4:focus,
    button.bg-dark-grey4:hover {
        background-color: #47444b !important;
    }
    .bg-dark2 {
        background-color: #1a1a1a !important;
    }
    a.bg-dark2:focus,
    a.bg-dark2:hover,
    button.bg-dark2:focus,
    button.bg-dark2:hover {
        background-color: #010101 !important;
    }
    .bg-chalice {
        background-color: #b2b2b2 !important;
    }
    a.bg-chalice:focus,
    a.bg-chalice:hover,
    button.bg-chalice:focus,
    button.bg-chalice:hover {
        background-color: #999 !important;
    }
    .bg-common-grey {
        background-color: #ededf4 !important;
    }
    a.bg-common-grey:focus,
    a.bg-common-grey:hover,
    button.bg-common-grey:focus,
    button.bg-common-grey:hover {
        background-color: #cdcde1 !important;
    }
    .bg-common-grey2 {
        background-color: #f7f7ff !important;
    }
    a.bg-common-grey2:focus,
    a.bg-common-grey2:hover,
    button.bg-common-grey2:focus,
    button.bg-common-grey2:hover {
        background-color: #c4c4ff !important;
    }
    .bg-common-grey3 {
        background-color: #666 !important;
    }
    a.bg-common-grey3:focus,
    a.bg-common-grey3:hover,
    button.bg-common-grey3:focus,
    button.bg-common-grey3:hover {
        background-color: #4d4d4d !important;
    }
    .bg-mantis {
        background-color: #66cc6e !important;
    }
    a.bg-mantis:focus,
    a.bg-mantis:hover,
    button.bg-mantis:focus,
    button.bg-mantis:hover {
        background-color: #40bf4a !important;
    }
    .bg-pink {
        background-color: #ffeded !important;
    }
    a.bg-pink:focus,
    a.bg-pink:hover,
    button.bg-pink:focus,
    button.bg-pink:hover {
        background-color: #ffbaba !important;
    }
    .bg-darker-red {
        background-color: #f55 !important;
    }
    a.bg-darker-red:focus,
    a.bg-darker-red:hover,
    button.bg-darker-red:focus,
    button.bg-darker-red:hover {
        background-color: #f22 !important;
    }
    .bg-white {
        background-color: #fff !important;
    }
    .bg-transparent {
        background-color: transparent !important;
    }
    .border {
        border: 1px solid #dee2e6 !important;
    }
    .border-top {
        border-top: 1px solid #dee2e6 !important;
    }
    .border-right {
        border-right: 1px solid #dee2e6 !important;
    }
    .border-bottom {
        border-bottom: 1px solid #dee2e6 !important;
    }
    .border-left {
        border-left: 1px solid #dee2e6 !important;
    }
    .border-0 {
        border: 0 !important;
    }
    .border-top-0 {
        border-top: 0 !important;
    }
    .border-right-0 {
        border-right: 0 !important;
    }
    .border-bottom-0 {
        border-bottom: 0 !important;
    }
    .border-left-0 {
        border-left: 0 !important;
    }
    .border-primary {
        border-color: #ff6c6c !important;
    }
    .border-secondary {
        border-color: #ffa2a2 !important;
    }
    .border-success {
        border-color: #28a745 !important;
    }
    .border-info {
        border-color: #17a2b8 !important;
    }
    .border-warning {
        border-color: #ffc107 !important;
    }
    .border-danger {
        border-color: #dc3545 !important;
    }
    .border-light {
        border-color: #f8f9fa !important;
    }
    .border-black,
    .border-dark {
        border-color: #000 !important;
    }
    .border-indigo-100 {
        border-color: #f0e7f9 !important;
    }
    .border-indigo-200 {
        border-color: #e1d0f3 !important;
    }
    .border-indigo-300 {
        border-color: #c1acdb !important;
    }
    .border-indigo-400 {
        border-color: #9a86b7 !important;
    }
    .border-indigo-500 {
        border-color: #695787 !important;
    }
    .border-indigo-600 {
        border-color: #513f74 !important;
    }
    .border-indigo-700 {
        border-color: #3b2b61 !important;
    }
    .border-indigo-800 {
        border-color: #281b4e !important;
    }
    .border-indigo-900 {
        border-color: #1b1040 !important;
    }
    .border-indigo {
        border-color: #695787 !important;
    }
    .border-coral-100 {
        border-color: #ffe8dd !important;
    }
    .border-coral-200 {
        border-color: #fcb !important;
    }
    .border-coral-300 {
        border-color: #fa9 !important;
    }
    .border-coral-400 {
        border-color: #ff8a7f !important;
    }
    .border-coral-500 {
        border-color: #f55 !important;
    }
    .border-coral-600 {
        border-color: #db3e4b !important;
    }
    .border-coral-700 {
        border-color: #b72a43 !important;
    }
    .border-coral-800 {
        border-color: #931b3a !important;
    }
    .border-coral-900 {
        border-color: #7a1035 !important;
    }
    .border-coral {
        border-color: #f55 !important;
    }
    .border-charcoal-100 {
        border-color: #f5f2f7 !important;
    }
    .border-charcoal-200 {
        border-color: #ebe6ef !important;
    }
    .border-charcoal-300 {
        border-color: #cac4d1 !important;
    }
    .border-charcoal-400 {
        border-color: #9c97a3 !important;
    }
    .border-charcoal-500 {
        border-color: #605c66 !important;
    }
    .border-charcoal-600 {
        border-color: #4a4357 !important;
    }
    .border-charcoal-700 {
        border-color: #362e49 !important;
    }
    .border-charcoal-800 {
        border-color: #251d3b !important;
    }
    .border-charcoal-900 {
        border-color: #191130 !important;
    }
    .border-charcoal {
        border-color: #605c66 !important;
    }
    .border-lime-100 {
        border-color: #ebfde5 !important;
    }
    .border-lime-200 {
        border-color: #d3fbcc !important;
    }
    .border-lime-300 {
        border-color: #b3f3b0 !important;
    }
    .border-lime-400 {
        border-color: #97e89a !important;
    }
    .border-lime-500 {
        border-color: #75d982 !important;
    }
    .border-lime-600 {
        border-color: #55ba6c !important;
    }
    .border-lime-700 {
        border-color: #3a9c59 !important;
    }
    .border-lime-800 {
        border-color: #257d49 !important;
    }
    .border-lime-900 {
        border-color: #16683f !important;
    }
    .border-lime {
        border-color: #75d982 !important;
    }
    .border-aqua-100 {
        border-color: #ccfcef !important;
    }
    .border-aqua-200 {
        border-color: #9bf9e7 !important;
    }
    .border-aqua-300 {
        border-color: #67ede0 !important;
    }
    .border-aqua-400 {
        border-color: #40dcd9 !important;
    }
    .border-aqua-500 {
        border-color: #0bbac6 !important;
    }
    .border-aqua-600 {
        border-color: #0892aa !important;
    }
    .border-aqua-700 {
        border-color: #056f8e !important;
    }
    .border-aqua-800 {
        border-color: #034f72 !important;
    }
    .border-aqua-900 {
        border-color: #023a5f !important;
    }
    .border-aqua {
        border-color: #0bbac6 !important;
    }
    .border-honey-100 {
        border-color: #fff5d8 !important;
    }
    .border-honey-200 {
        border-color: #ffe9b2 !important;
    }
    .border-honey-300 {
        border-color: #ffd98c !important;
    }
    .border-honey-400 {
        border-color: #ffca6f !important;
    }
    .border-honey-500 {
        border-color: #ffb140 !important;
    }
    .border-honey-600 {
        border-color: #db8d2e !important;
    }
    .border-honey-700 {
        border-color: #b76d20 !important;
    }
    .border-honey-800 {
        border-color: #934f14 !important;
    }
    .border-honey-900 {
        border-color: #7a3b0c !important;
    }
    .border-honey {
        border-color: #ffb140 !important;
    }
    .border-chili-100 {
        border-color: #fddecd !important;
    }
    .border-chili-200 {
        border-color: #fbb59c !important;
    }
    .border-chili-300 {
        border-color: #f5826a !important;
    }
    .border-chili-400 {
        border-color: #ec5345 !important;
    }
    .border-chili-500 {
        border-color: #e00d0d !important;
    }
    .border-chili-600 {
        border-color: #c00919 !important;
    }
    .border-chili-700 {
        border-color: #a10621 !important;
    }
    .border-chili-800 {
        border-color: #810424 !important;
    }
    .border-chili-900 {
        border-color: #6b0226 !important;
    }
    .border-chili {
        border-color: #e00d0d !important;
    }
    .border-transparent {
        border-color: transparent !important;
    }
    .border-red {
        border-color: red !important;
    }
    .border-soft-red {
        border-color: #ff6c6c !important;
    }
    .border-dark-red {
        border-color: #f55 !important;
    }
    .border-white2 {
        border-color: #eee !important;
    }
    .border-white3 {
        border-color: #ddd !important;
    }
    .border-soft-pink4 {
        border-color: #fff5d8 !important;
    }
    .border-soft-grey {
        border-color: #ededf4 !important;
    }
    .border-grey {
        border-color: #444 !important;
    }
    .border-purple-rum {
        border-color: #695787 !important;
    }
    .border-purple {
        border-color: #b18fa1 !important;
    }
    .border-soft-green4 {
        border-color: #ebfde5 !important;
    }
    .border-soft-purple {
        border-color: #b6b6ef !important;
    }
    .border-kimberly {
        border-color: #7878a5 !important;
    }
    .border-header {
        border-color: #fff !important;
    }
    .border-dove-grey {
        border-color: #6e6e6e !important;
    }
    .border-dark-blue {
        border-color: #1c3c81 !important;
    }
    .border-default-grey {
        border-color: #999 !important;
    }
    .border-soft-grey-2 {
        border-color: #ccc !important;
    }
    .border-soft-grey-3 {
        border-color: #f5f5f5 !important;
    }
    .border-soft-grey-5 {
        border-color: #f5f6f8 !important;
    }
    .border-dark-grey-3,
    .border-dark-grey-5 {
        border-color: #444 !important;
    }
    .border-dark-grey {
        border-color: #666 !important;
    }
    .border-dark-grey4 {
        border-color: #605c66 !important;
    }
    .border-dark2 {
        border-color: #1a1a1a !important;
    }
    .border-chalice {
        border-color: #b2b2b2 !important;
    }
    .border-common-grey {
        border-color: #ededf4 !important;
    }
    .border-common-grey2 {
        border-color: #f7f7ff !important;
    }
    .border-common-grey3 {
        border-color: #666 !important;
    }
    .border-mantis {
        border-color: #66cc6e !important;
    }
    .border-pink {
        border-color: #ffeded !important;
    }
    .border-darker-red {
        border-color: #f55 !important;
    }
    .border-white {
        border-color: #fff !important;
    }
    .rounded-sm {
        border-radius: 8px !important;
    }
    .header .search-bar,
    .rounded {
        border-radius: 0.25rem !important;
    }
    .rounded-circle {
        border-radius: 50% !important;
    }
    .rounded-pill {
        border-radius: 50rem !important;
    }
    .rounded-0 {
        border-radius: 0 !important;
    }
    .clearfix:after {
        display: block;
        clear: both;
        content: "";
    }
    .d-none {
        display: none !important;
    }
    .d-inline {
        display: inline !important;
    }
    .d-inline-block {
        display: inline-block !important;
    }
    .d-block {
        display: block !important;
    }
    .d-table {
        display: table !important;
    }
    .d-flex {
        display: flex !important;
    }
    .d-inline-flex {
        display: inline-flex !important;
    }
    .flex-row {
        flex-direction: row !important;
    }
    .flex-column {
        flex-direction: column !important;
    }
    .flex-row-reverse {
        flex-direction: row-reverse !important;
    }
    .flex-column-reverse {
        flex-direction: column-reverse !important;
    }
    .flex-wrap {
        flex-wrap: wrap !important;
    }
    .flex-nowrap {
        flex-wrap: nowrap !important;
    }
    .flex-fill {
        flex: 1 1 auto !important;
    }
    .flex-grow-1 {
        flex-grow: 1 !important;
    }
    .justify-content-start {
        justify-content: flex-start !important;
    }
    .justify-content-end {
        justify-content: flex-end !important;
    }
    .justify-content-center {
        justify-content: center !important;
    }
    .justify-content-between {
        justify-content: space-between !important;
    }
    .justify-content-around {
        justify-content: space-around !important;
    }
    .align-items-start {
        align-items: flex-start !important;
    }
    .align-items-end {
        align-items: flex-end !important;
    }
    .align-items-center {
        align-items: center !important;
    }
    .align-items-baseline {
        align-items: baseline !important;
    }
    .align-items-stretch {
        align-items: stretch !important;
    }
    .align-content-center {
        align-content: center !important;
    }
    .align-content-stretch {
        align-content: stretch !important;
    }
    .align-self-center {
        align-self: center !important;
    }
    .align-self-baseline {
        align-self: baseline !important;
    }
    .align-self-stretch {
        align-self: stretch !important;
    }
    .float-right {
        float: right !important;
    }
    .overflow-auto {
        overflow: auto !important;
    }
    .overflow-hidden {
        overflow: hidden !important;
    }
    .position-relative {
        position: relative !important;
    }
    .position-absolute {
        position: absolute !important;
    }
    .position-fixed {
        position: fixed !important;
    }
    .fixed-top {
        position: fixed;
        top: 0;
    }
    .fixed-bottom,
    .fixed-top {
        right: 0;
        left: 0;
        z-index: 1030;
    }
    @supports (position: sticky) {
        .sticky-top {
            position: sticky;
            top: 0;
            z-index: 1020;
        }
    }
    .shadow-sm {
        box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
    }
    .shadow {
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
    }
    .h-40 {
        height: 40px !important;
    }
    .mw-100 {
        max-width: 100% !important;
    }
    .mt--16 {
        margin-top: -16px !important;
    }
    .ml--16 {
        margin-left: -16px !important;
    }
    .mt--8 {
        margin-top: -8px !important;
    }
    .ml--8 {
        margin-left: -8px !important;
    }
    .alert .close,
    .m-0 {
        margin: 0 !important;
    }
    .mt-0,
    .my-0 {
        margin-top: 0 !important;
    }
    .mr-0,
    .mx-0 {
        margin-right: 0 !important;
    }
    .mb-0,
    .my-0 {
        margin-bottom: 0 !important;
    }
    .ml-0,
    .mx-0 {
        margin-left: 0 !important;
    }
    .mt-2,
    .my-2 {
        margin-top: 2px !important;
    }
    .mr-2,
    .mx-2 {
        margin-right: 2px !important;
    }
    .mb-2,
    .my-2 {
        margin-bottom: 2px !important;
    }
    .ml-2,
    .mx-2 {
        margin-left: 2px !important;
    }
    .mt-4,
    .my-4 {
        margin-top: 4px !important;
    }
    .mr-4,
    .mx-4 {
        margin-right: 4px !important;
    }
    .mb-4,
    .my-4 {
        margin-bottom: 4px !important;
    }
    .ml-4,
    .mx-4 {
        margin-left: 4px !important;
    }
    .mt-6 {
        margin-top: 6px !important;
    }
    .mr-6,
    .mx-6 {
        margin-right: 6px !important;
    }
    .mb-6 {
        margin-bottom: 6px !important;
    }
    .ml-6,
    .mx-6 {
        margin-left: 6px !important;
    }
    .m-8 {
        margin: 8px !important;
    }
    .mt-8,
    .my-8 {
        margin-top: 8px !important;
    }
    .express-mart.checkout-item-section .className-number-picker .text-number-picker,
    .mr-8,
    .mx-8,
    .near-store-section .store-item:first-child .flat-store {
        margin-right: 8px !important;
    }
    .mb-8,
    .my-8 {
        margin-bottom: 8px !important;
    }
    .express-mart.checkout-item-section .className-number-picker .text-number-picker,
    .ml-8,
    .mx-8,
    .near-store-section .store-item:last-child .flat-store {
        margin-left: 8px !important;
    }
    .mt-10 {
        margin-top: 10px !important;
    }
    .mr-10,
    .mx-10 {
        margin-right: 10px !important;
    }
    .mb-10 {
        margin-bottom: 10px !important;
    }
    .mx-10 {
        margin-left: 10px !important;
    }
    .mt-12,
    .my-12 {
        margin-top: 12px !important;
    }
    .mr-12,
    .mx-12 {
        margin-right: 12px !important;
    }
    .mb-12,
    .my-12 {
        margin-bottom: 12px !important;
    }
    .ml-12,
    .mx-12 {
        margin-left: 12px !important;
    }
    .mb-14 {
        margin-bottom: 14px !important;
    }
    .m-16 {
        margin: 16px !important;
    }
    .mt-16,
    .my-16 {
        margin-top: 16px !important;
    }
    .mr-16,
    .mx-16,
    .near-store-section .store-item:last-child .flat-store {
        margin-right: 16px !important;
    }
    .mb-16,
    .my-16 {
        margin-bottom: 16px !important;
    }
    .ml-16,
    .mx-16,
    .near-store-section .store-item:first-child .flat-store {
        margin-left: 16px !important;
    }
    .mt-19 {
        margin-top: 19px !important;
    }
    .mb-19 {
        margin-bottom: 19px !important;
    }
    .mt-21 {
        margin-top: 21px !important;
    }
    .mb-21 {
        margin-bottom: 21px !important;
    }
    .m-24 {
        margin: 24px !important;
    }
    .mt-24 {
        margin-top: 24px !important;
    }
    .mr-24,
    .mx-24 {
        margin-right: 24px !important;
    }
    .mb-24 {
        margin-bottom: 24px !important;
    }
    .ml-24,
    .mx-24 {
        margin-left: 24px !important;
    }
    .mt-32,
    .my-32 {
        margin-top: 32px !important;
    }
    .mr-32 {
        margin-right: 32px !important;
    }
    .mb-32,
    .my-32 {
        margin-bottom: 32px !important;
    }
    .ml-32 {
        margin-left: 32px !important;
    }
    .wallet-container {
        margin-bottom: 36px !important;
    }
    .mt-40 {
        margin-top: 40px !important;
    }
    .mr-40 {
        margin-right: 40px !important;
    }
    .mt-48 {
        margin-top: 48px !important;
    }
    .mr-48,
    .mx-48 {
        margin-right: 48px !important;
    }
    .mb-48 {
        margin-bottom: 48px !important;
    }
    .ml-48,
    .mx-48 {
        margin-left: 48px !important;
    }
    .mr-50 {
        margin-right: 50px !important;
    }
    .ml-50 {
        margin-left: 50px !important;
    }
    .mt-56 {
        margin-top: 56px !important;
    }
    .mx-56 {
        margin-right: 56px !important;
    }
    .mb-56 {
        margin-bottom: 56px !important;
    }
    .mx-56 {
        margin-left: 56px !important;
    }
    .mt-64 {
        margin-top: 64px !important;
    }
    .mb-64 {
        margin-bottom: 64px !important;
    }
    .mb-72 {
        margin-bottom: 72px !important;
    }
    .mb-80 {
        margin-bottom: 80px !important;
    }
    .mb-88 {
        margin-bottom: 88px !important;
    }
    .mt-128 {
        margin-top: 128px !important;
    }
    .alert .close,
    .p-0 {
        padding: 0 !important;
    }
    .pt-0,
    .py-0 {
        padding-top: 0 !important;
    }
    .pr-0,
    .px-0 {
        padding-right: 0 !important;
    }
    .pb-0,
    .py-0 {
        padding-bottom: 0 !important;
    }
    .pl-0,
    .px-0 {
        padding-left: 0 !important;
    }
    .p-2 {
        padding: 2px !important;
    }
    .pt-2,
    .py-2 {
        padding-top: 2px !important;
    }
    .pr-2,
    .px-2 {
        padding-right: 2px !important;
    }
    .pb-2,
    .py-2 {
        padding-bottom: 2px !important;
    }
    .pl-2,
    .px-2 {
        padding-left: 2px !important;
    }
    .p-4 {
        padding: 4px !important;
    }
    .pt-4,
    .py-4 {
        padding-top: 4px !important;
    }
    .pr-4,
    .px-4,
    .store-tag-info:not(:last-child) {
        padding-right: 4px !important;
    }
    .pb-4,
    .py-4 {
        padding-bottom: 4px !important;
    }
    .pl-4,
    .px-4,
    .store-tag-info:not(:first-child) {
        padding-left: 4px !important;
    }
    .p-6 {
        padding: 6px !important;
    }
    .pt-6 {
        padding-top: 6px !important;
    }
    .pr-6 {
        padding-right: 6px !important;
    }
    .pb-6 {
        padding-bottom: 6px !important;
    }
    .p-8 {
        padding: 8px !important;
    }
    .pt-8,
    .py-8 {
        padding-top: 8px !important;
    }
    .pr-8,
    .px-8 {
        padding-right: 8px !important;
    }
    .pb-8,
    .py-8 {
        padding-bottom: 8px !important;
    }
    .pl-8,
    .px-8 {
        padding-left: 8px !important;
    }
    .pt-10,
    .py-10 {
        padding-top: 10px !important;
    }
    .px-10 {
        padding-right: 10px !important;
    }
    .pb-10,
    .py-10 {
        padding-bottom: 10px !important;
    }
    .px-10 {
        padding-left: 10px !important;
    }
    .p-12 {
        padding: 12px !important;
    }
    .pt-12,
    .py-12 {
        padding-top: 12px !important;
    }
    .pr-12,
    .px-12 {
        padding-right: 12px !important;
    }
    .pb-12,
    .py-12 {
        padding-bottom: 12px !important;
    }
    .pl-12,
    .px-12 {
        padding-left: 12px !important;
    }
    .pt-14,
    .py-14 {
        padding-top: 14px !important;
    }
    .pb-14,
    .py-14 {
        padding-bottom: 14px !important;
    }
    .pl-14 {
        padding-left: 14px !important;
    }
    .p-16 {
        padding: 16px !important;
    }
    .pt-16,
    .py-16,
    .swiper-prod-detail-image-swiper {
        padding-top: 16px !important;
    }
    .pr-16,
    .px-16,
    .swiper-prod-detail-image-swiper {
        padding-right: 16px !important;
    }
    .pb-16,
    .py-16 {
        padding-bottom: 16px !important;
    }
    .pl-16,
    .px-16,
    .swiper-prod-detail-image-swiper {
        padding-left: 16px !important;
    }
    .pt-19 {
        padding-top: 19px !important;
    }
    .pb-19 {
        padding-bottom: 19px !important;
    }
    .p-21 {
        padding: 21px !important;
    }
    .pt-21 {
        padding-top: 21px !important;
    }
    .pr-21,
    .px-21 {
        padding-right: 21px !important;
    }
    .pb-21 {
        padding-bottom: 21px !important;
    }
    .pl-21,
    .px-21 {
        padding-left: 21px !important;
    }
    .pt-24,
    .py-24 {
        padding-top: 24px !important;
    }
    .pr-24,
    .px-24 {
        padding-right: 24px !important;
    }
    .pb-24,
    .py-24,
    .swiper-prod-detail-image-swiper {
        padding-bottom: 24px !important;
    }
    .pl-24,
    .px-24 {
        padding-left: 24px !important;
    }
    .pt-30 {
        padding-top: 30px !important;
    }
    .pt-32,
    .py-32 {
        padding-top: 32px !important;
    }
    .pr-32,
    .px-32 {
        padding-right: 32px !important;
    }
    .pb-32,
    .py-32 {
        padding-bottom: 32px !important;
    }
    .pl-32,
    .px-32 {
        padding-left: 32px !important;
    }
    .pt-40 {
        padding-top: 40px !important;
    }
    .pr-40 {
        padding-right: 40px !important;
    }
    .pb-40 {
        padding-bottom: 40px !important;
    }
    .pl-40 {
        padding-left: 40px !important;
    }
    .pb-42 {
        padding-bottom: 42px !important;
    }
    .px-44 {
        padding-right: 44px !important;
    }
    .px-44 {
        padding-left: 44px !important;
    }
    .pt-48 {
        padding-top: 48px !important;
    }
    .pr-48,
    .px-48 {
        padding-right: 48px !important;
    }
    .pb-48 {
        padding-bottom: 48px !important;
    }
    .px-48 {
        padding-left: 48px !important;
    }
    .pb-50 {
        padding-bottom: 50px !important;
    }
    .pt-56 {
        padding-top: 56px !important;
    }
    .pb-56 {
        padding-bottom: 56px !important;
    }
    .pt-64,
    .py-64 {
        padding-top: 64px !important;
    }
    .pr-64 {
        padding-right: 64px !important;
    }
    .pb-64,
    .py-64 {
        padding-bottom: 64px !important;
    }
    .pl-64 {
        padding-left: 64px !important;
    }
    .pb-72 {
        padding-bottom: 72px !important;
    }
    .pl-72 {
        padding-left: 72px !important;
    }
    .pb-80 {
        padding-bottom: 80px !important;
    }
    .pt-88 {
        padding-top: 88px !important;
    }
    .pb-88 {
        padding-bottom: 88px !important;
    }
    .pl-88 {
        padding-left: 88px !important;
    }
    .pb-96 {
        padding-bottom: 96px !important;
    }
    .pb-112 {
        padding-bottom: 112px !important;
    }
    .hs-wrapper .hs-title,
    .m-auto,
    .onboarding-content-wrapper .img {
        margin: auto !important;
    }
    .mt-auto,
    .my-auto {
        margin-top: auto !important;
    }
    .mr-auto,
    .mx-auto {
        margin-right: auto !important;
    }
    .my-auto {
        margin-bottom: auto !important;
    }
    .ml-auto,
    .mx-auto {
        margin-left: auto !important;
    }
    .text-monospace {
        font-family: SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace !important;
    }
    .text-justify {
        text-align: justify !important;
    }
    .text-wrap {
        white-space: normal !important;
    }
    .text-nowrap {
        white-space: nowrap !important;
    }
    .text-truncate {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .text-left {
        text-align: left !important;
    }
    .text-right {
        text-align: right !important;
    }
    .text-center {
        text-align: center !important;
    }
    @media (min-width: 320px) {
        .text-sm-left {
            text-align: left !important;
        }
        .text-sm-right {
            text-align: right !important;
        }
        .text-sm-center {
            text-align: center !important;
        }
    }
    @media (min-width: 360px) {
        .text-md-left {
            text-align: left !important;
        }
        .text-md-right {
            text-align: right !important;
        }
        .text-md-center {
            text-align: center !important;
        }
    }
    @media (min-width: 375px) {
        .text-lg-left {
            text-align: left !important;
        }
        .text-lg-right {
            text-align: right !important;
        }
        .text-lg-center {
            text-align: center !important;
        }
    }
    @media (min-width: 411px) {
        .text-xl-left {
            text-align: left !important;
        }
        .text-xl-right {
            text-align: right !important;
        }
        .text-xl-center {
            text-align: center !important;
        }
    }
    @media (min-width: 500px) {
        .text-xxl-left {
            text-align: left !important;
        }
        .text-xxl-right {
            text-align: right !important;
        }
        .text-xxl-center {
            text-align: center !important;
        }
    }
    .text-lowercase {
        text-transform: lowercase !important;
    }
    .text-uppercase {
        text-transform: uppercase !important;
    }
    .text-capitalize {
        text-transform: capitalize !important;
    }
    .font-weight-normal {
        font-weight: 400 !important;
    }
    .font-weight-bold {
        font-weight: 700 !important;
    }
    .font-italic {
        font-style: italic !important;
    }
    .text-primary {
        color: #ff6c6c !important;
    }
    a.text-primary:focus,
    a.text-primary:hover {
        color: #ff2020 !important;
    }
    .text-secondary {
        color: #ffa2a2 !important;
    }
    a.text-secondary:focus,
    a.text-secondary:hover {
        color: #ff5656 !important;
    }
    .text-success {
        color: #28a745 !important;
    }
    a.text-success:focus,
    a.text-success:hover {
        color: #19692c !important;
    }
    .text-info {
        color: #17a2b8 !important;
    }
    a.text-info:focus,
    a.text-info:hover {
        color: #0f6674 !important;
    }
    .text-warning {
        color: #ffc107 !important;
    }
    a.text-warning:focus,
    a.text-warning:hover {
        color: #ba8b00 !important;
    }
    .text-danger {
        color: #dc3545 !important;
    }
    a.text-danger:focus,
    a.text-danger:hover {
        color: #a71d2a !important;
    }
    .text-light {
        color: #f8f9fa !important;
    }
    a.text-light:focus,
    a.text-light:hover {
        color: #cbd3da !important;
    }
    .text-dark,
    a.text-dark:focus,
    a.text-dark:hover {
        color: #000 !important;
    }
    .text-white {
        color: #fff !important;
    }
    a.text-white:focus,
    a.text-white:hover {
        color: #d9d9d9 !important;
    }
    .text-black,
    a.text-black:focus,
    a.text-black:hover {
        color: #000 !important;
    }
    .text-indigo-100 {
        color: #f0e7f9 !important;
    }
    a.text-indigo-100:focus,
    a.text-indigo-100:hover {
        color: #caaaea !important;
    }
    .text-indigo-200 {
        color: #e1d0f3 !important;
    }
    a.text-indigo-200:focus,
    a.text-indigo-200:hover {
        color: #ba93e3 !important;
    }
    .text-indigo-300 {
        color: #c1acdb !important;
    }
    a.text-indigo-300:focus,
    a.text-indigo-300:hover {
        color: #9977c4 !important;
    }
    .text-indigo-400 {
        color: #9a86b7 !important;
    }
    a.text-indigo-400:focus,
    a.text-indigo-400:hover {
        color: #735a97 !important;
    }
    .text-indigo-500 {
        color: #695787 !important;
    }
    a.text-indigo-500:focus,
    a.text-indigo-500:hover {
        color: #453958 !important;
    }
    .text-indigo-600 {
        color: #513f74 !important;
    }
    a.text-indigo-600:focus,
    a.text-indigo-600:hover {
        color: #2e2442 !important;
    }
    .text-indigo-700 {
        color: #3b2b61 !important;
    }
    a.text-indigo-700:focus,
    a.text-indigo-700:hover {
        color: #1b142c !important;
    }
    .text-indigo-800 {
        color: #281b4e !important;
    }
    a.text-indigo-800:focus,
    a.text-indigo-800:hover {
        color: #0b0715 !important;
    }
    .text-indigo-900 {
        color: #1b1040 !important;
    }
    a.text-indigo-900:focus,
    a.text-indigo-900:hover {
        color: #010103 !important;
    }
    .text-indigo {
        color: #695787 !important;
    }
    a.text-indigo:focus,
    a.text-indigo:hover {
        color: #453958 !important;
    }
    .text-coral-100 {
        color: #ffe8dd !important;
    }
    a.text-coral-100:focus,
    a.text-coral-100:hover {
        color: #ffb491 !important;
    }
    .text-coral-200 {
        color: #fcb !important;
    }
    a.text-coral-200:focus,
    a.text-coral-200:hover {
        color: #ff936f !important;
    }
    .text-coral-300 {
        color: #fa9 !important;
    }
    a.text-coral-300:focus,
    a.text-coral-300:hover {
        color: #ff6a4d !important;
    }
    .text-coral-400 {
        color: #ff8a7f !important;
    }
    a.text-coral-400:focus,
    a.text-coral-400:hover {
        color: #f43 !important;
    }
    .text-coral-500 {
        color: #f55 !important;
    }
    a.text-coral-500:focus,
    a.text-coral-500:hover {
        color: #ff0909 !important;
    }
    .text-coral-600 {
        color: #db3e4b !important;
    }
    a.text-coral-600:focus,
    a.text-coral-600:hover {
        color: #ac202c !important;
    }
    .text-coral-700 {
        color: #b72a43 !important;
    }
    a.text-coral-700:focus,
    a.text-coral-700:hover {
        color: #791c2c !important;
    }
    .text-coral-800 {
        color: #931b3a !important;
    }
    a.text-coral-800:focus,
    a.text-coral-800:hover {
        color: #520f21 !important;
    }
    .text-coral-900 {
        color: #7a1035 !important;
    }
    a.text-coral-900:focus,
    a.text-coral-900:hover {
        color: #360718 !important;
    }
    .text-coral {
        color: #f55 !important;
    }
    a.text-coral:focus,
    a.text-coral:hover {
        color: #ff0909 !important;
    }
    .text-charcoal-100 {
        color: #f5f2f7 !important;
    }
    a.text-charcoal-100:focus,
    a.text-charcoal-100:hover {
        color: #d1c3da !important;
    }
    .text-charcoal-200 {
        color: #ebe6ef !important;
    }
    a.text-charcoal-200:focus,
    a.text-charcoal-200:hover {
        color: #c6b7d1 !important;
    }
    .text-charcoal-300 {
        color: #cac4d1 !important;
    }
    a.text-charcoal-300:focus,
    a.text-charcoal-300:hover {
        color: #a399af !important;
    }
    .text-charcoal-400 {
        color: #9c97a3 !important;
    }
    a.text-charcoal-400:focus,
    a.text-charcoal-400:hover {
        color: #766f7e !important;
    }
    .text-charcoal-500 {
        color: #605c66 !important;
    }
    a.text-charcoal-500:focus,
    a.text-charcoal-500:hover {
        color: #3a383e !important;
    }
    .text-charcoal-600 {
        color: #4a4357 !important;
    }
    a.text-charcoal-600:focus,
    a.text-charcoal-600:hover {
        color: #25222c !important;
    }
    .text-charcoal-700 {
        color: #362e49 !important;
    }
    a.text-charcoal-700:focus,
    a.text-charcoal-700:hover {
        color: #13101a !important;
    }
    .text-charcoal-800 {
        color: #251d3b !important;
    }
    a.text-charcoal-800:focus,
    a.text-charcoal-800:hover {
        color: #050408 !important;
    }
    .text-charcoal-900 {
        color: #191130 !important;
    }
    a.text-charcoal-900:focus,
    a.text-charcoal-900:hover {
        color: #000 !important;
    }
    .text-charcoal {
        color: #605c66 !important;
    }
    a.text-charcoal:focus,
    a.text-charcoal:hover {
        color: #3a383e !important;
    }
    .text-lime-100 {
        color: #ebfde5 !important;
    }
    a.text-lime-100:focus,
    a.text-lime-100:hover {
        color: #b4f89e !important;
    }
    .text-lime-200 {
        color: #d3fbcc !important;
    }
    a.text-lime-200:focus,
    a.text-lime-200:hover {
        color: #96f585 !important;
    }
    .text-lime-300 {
        color: #b3f3b0 !important;
    }
    a.text-lime-300:focus,
    a.text-lime-300:hover {
        color: #73e96e !important;
    }
    .text-lime-400 {
        color: #97e89a !important;
    }
    a.text-lime-400:focus,
    a.text-lime-400:hover {
        color: #58da5d !important;
    }
    .text-lime-500 {
        color: #75d982 !important;
    }
    a.text-lime-500:focus,
    a.text-lime-500:hover {
        color: #39c84c !important;
    }
    .text-lime-600 {
        color: #55ba6c !important;
    }
    a.text-lime-600:focus,
    a.text-lime-600:hover {
        color: #388a4b !important;
    }
    .text-lime-700 {
        color: #3a9c59 !important;
    }
    a.text-lime-700:focus,
    a.text-lime-700:hover {
        color: #256439 !important;
    }
    .text-lime-800 {
        color: #257d49 !important;
    }
    a.text-lime-800:focus,
    a.text-lime-800:hover {
        color: #144227 !important;
    }
    .text-lime-900 {
        color: #16683f !important;
    }
    a.text-lime-900:focus,
    a.text-lime-900:hover {
        color: #092919 !important;
    }
    .text-lime {
        color: #75d982 !important;
    }
    a.text-lime:focus,
    a.text-lime:hover {
        color: #39c84c !important;
    }
    .text-aqua-100 {
        color: #ccfcef !important;
    }
    a.text-aqua-100:focus,
    a.text-aqua-100:hover {
        color: #84f8d8 !important;
    }
    .text-aqua-200 {
        color: #9bf9e7 !important;
    }
    a.text-aqua-200:focus,
    a.text-aqua-200:hover {
        color: #53f5d6 !important;
    }
    .text-aqua-300 {
        color: #67ede0 !important;
    }
    a.text-aqua-300:focus,
    a.text-aqua-300:hover {
        color: #23e5d2 !important;
    }
    .text-aqua-400 {
        color: #40dcd9 !important;
    }
    a.text-aqua-400:focus,
    a.text-aqua-400:hover {
        color: #20afad !important;
    }
    .text-aqua-500 {
        color: #0bbac6 !important;
    }
    a.text-aqua-500:focus,
    a.text-aqua-500:hover {
        color: #07767e !important;
    }
    .text-aqua-600 {
        color: #0892aa !important;
    }
    a.text-aqua-600:focus,
    a.text-aqua-600:hover {
        color: #055361 !important;
    }
    .text-aqua-700 {
        color: #056f8e !important;
    }
    a.text-aqua-700:focus,
    a.text-aqua-700:hover {
        color: #023544 !important;
    }
    .text-aqua-800 {
        color: #034f72 !important;
    }
    a.text-aqua-800:focus,
    a.text-aqua-800:hover {
        color: #011b27 !important;
    }
    .text-aqua-900 {
        color: #023a5f !important;
    }
    a.text-aqua-900:focus,
    a.text-aqua-900:hover {
        color: #000c14 !important;
    }
    .text-aqua {
        color: #0bbac6 !important;
    }
    a.text-aqua:focus,
    a.text-aqua:hover {
        color: #07767e !important;
    }
    .text-honey-100 {
        color: #fff5d8 !important;
    }
    a.text-honey-100:focus,
    a.text-honey-100:hover {
        color: #ffe18c !important;
    }
    .text-honey-200 {
        color: #ffe9b2 !important;
    }
    a.text-honey-200:focus,
    a.text-honey-200:hover {
        color: #ffd366 !important;
    }
    .text-honey-300 {
        color: #ffd98c !important;
    }
    a.text-honey-300:focus,
    a.text-honey-300:hover {
        color: #ffc040 !important;
    }
    .text-honey-400 {
        color: #ffca6f !important;
    }
    a.text-honey-400:focus,
    a.text-honey-400:hover {
        color: #ffae23 !important;
    }
    .text-honey-500 {
        color: #ffb140 !important;
    }
    a.text-honey-500:focus,
    a.text-honey-500:hover {
        color: #f38f00 !important;
    }
    .text-honey-600 {
        color: #db8d2e !important;
    }
    a.text-honey-600:focus,
    a.text-honey-600:hover {
        color: #a1651c !important;
    }
    .text-honey-700 {
        color: #b76d20 !important;
    }
    a.text-honey-700:focus,
    a.text-honey-700:hover {
        color: #764615 !important;
    }
    .text-honey-800 {
        color: #934f14 !important;
    }
    a.text-honey-800:focus,
    a.text-honey-800:hover {
        color: #502b0b !important;
    }
    .text-honey-900 {
        color: #7a3b0c !important;
    }
    a.text-honey-900:focus,
    a.text-honey-900:hover {
        color: #341905 !important;
    }
    .text-honey {
        color: #ffb140 !important;
    }
    a.text-honey:focus,
    a.text-honey:hover {
        color: #f38f00 !important;
    }
    .text-chili-100 {
        color: #fddecd !important;
    }
    a.text-chili-100:focus,
    a.text-chili-100:hover {
        color: #faad83 !important;
    }
    .text-chili-200 {
        color: #fbb59c !important;
    }
    a.text-chili-200:focus,
    a.text-chili-200:hover {
        color: #f87e52 !important;
    }
    .text-chili-300 {
        color: #f5826a !important;
    }
    a.text-chili-300:focus,
    a.text-chili-300:hover {
        color: #f04622 !important;
    }
    .text-chili-400 {
        color: #ec5345 !important;
    }
    a.text-chili-400:focus,
    a.text-chili-400:hover {
        color: #cf2515 !important;
    }
    .text-chili-500 {
        color: #e00d0d !important;
    }
    a.text-chili-500:focus,
    a.text-chili-500:hover {
        color: #980909 !important;
    }
    .text-chili-600 {
        color: #c00919 !important;
    }
    a.text-chili-600:focus,
    a.text-chili-600:hover {
        color: #77060f !important;
    }
    .text-chili-700 {
        color: #a10621 !important;
    }
    a.text-chili-700:focus,
    a.text-chili-700:hover {
        color: #570312 !important;
    }
    .text-chili-800 {
        color: #810424 !important;
    }
    a.text-chili-800:focus,
    a.text-chili-800:hover {
        color: #37020f !important;
    }
    .text-chili-900 {
        color: #6b0226 !important;
    }
    a.text-chili-900:focus,
    a.text-chili-900:hover {
        color: #20010b !important;
    }
    .text-chili {
        color: #e00d0d !important;
    }
    a.text-chili:focus,
    a.text-chili:hover {
        color: #980909 !important;
    }
    .text-transparent,
    a.text-transparent:focus,
    a.text-transparent:hover {
        color: transparent !important;
    }
    .text-red {
        color: red !important;
    }
    a.text-red:focus,
    a.text-red:hover {
        color: #b30000 !important;
    }
    .text-soft-red {
        color: #ff6c6c !important;
    }
    a.text-soft-red:focus,
    a.text-soft-red:hover {
        color: #ff2020 !important;
    }
    .text-dark-red {
        color: #f55 !important;
    }
    a.text-dark-red:focus,
    a.text-dark-red:hover {
        color: #ff0909 !important;
    }
    .text-white2 {
        color: #eee !important;
    }
    a.text-white2:focus,
    a.text-white2:hover {
        color: #c8c8c8 !important;
    }
    .text-white3 {
        color: #ddd !important;
    }
    a.text-white3:focus,
    a.text-white3:hover {
        color: #b7b7b7 !important;
    }
    .text-soft-pink4 {
        color: #fff5d8 !important;
    }
    a.text-soft-pink4:focus,
    a.text-soft-pink4:hover {
        color: #ffe18c !important;
    }
    .text-soft-grey {
        color: #ededf4 !important;
    }
    a.text-soft-grey:focus,
    a.text-soft-grey:hover {
        color: #bebed7 !important;
    }
    .text-grey {
        color: #444 !important;
    }
    a.text-grey:focus,
    a.text-grey:hover {
        color: #1e1e1e !important;
    }
    .text-purple-rum {
        color: #695787 !important;
    }
    a.text-purple-rum:focus,
    a.text-purple-rum:hover {
        color: #453958 !important;
    }
    .text-purple {
        color: #b18fa1 !important;
    }
    a.text-purple:focus,
    a.text-purple:hover {
        color: #90647b !important;
    }
    .text-soft-green4 {
        color: #ebfde5 !important;
    }
    a.text-soft-green4:focus,
    a.text-soft-green4:hover {
        color: #b4f89e !important;
    }
    .text-soft-purple {
        color: #b6b6ef !important;
    }
    a.text-soft-purple:focus,
    a.text-soft-purple:hover {
        color: #7777e1 !important;
    }
    .text-kimberly {
        color: #7878a5 !important;
    }
    a.text-kimberly:focus,
    a.text-kimberly:hover {
        color: #53537d !important;
    }
    .text-header {
        color: #fff !important;
    }
    a.text-header:focus,
    a.text-header:hover {
        color: #d9d9d9 !important;
    }
    .text-dove-grey {
        color: #6e6e6e !important;
    }
    a.text-dove-grey:focus,
    a.text-dove-grey:hover {
        color: #484848 !important;
    }
    .text-dark-blue {
        color: #1c3c81 !important;
    }
    a.text-dark-blue:focus,
    a.text-dark-blue:hover {
        color: #0e1f42 !important;
    }
    .text-default-grey {
        color: #999 !important;
    }
    a.text-default-grey:focus,
    a.text-default-grey:hover {
        color: #737373 !important;
    }
    .text-soft-grey-2 {
        color: #ccc !important;
    }
    a.text-soft-grey-2:focus,
    a.text-soft-grey-2:hover {
        color: #a6a6a6 !important;
    }
    .text-soft-grey-3 {
        color: #f5f5f5 !important;
    }
    a.text-soft-grey-3:focus,
    a.text-soft-grey-3:hover {
        color: #cfcfcf !important;
    }
    .text-soft-grey-5 {
        color: #f5f6f8 !important;
    }
    a.text-soft-grey-5:focus,
    a.text-soft-grey-5:hover {
        color: #c8ced9 !important;
    }
    .text-dark-grey-3 {
        color: #444 !important;
    }
    a.text-dark-grey-3:focus,
    a.text-dark-grey-3:hover {
        color: #1e1e1e !important;
    }
    .text-dark-grey-5 {
        color: #444 !important;
    }
    a.text-dark-grey-5:focus,
    a.text-dark-grey-5:hover {
        color: #1e1e1e !important;
    }
    .text-dark-grey {
        color: #666 !important;
    }
    a.text-dark-grey:focus,
    a.text-dark-grey:hover {
        color: #404040 !important;
    }
    .text-dark-grey4 {
        color: #605c66 !important;
    }
    a.text-dark-grey4:focus,
    a.text-dark-grey4:hover {
        color: #3a383e !important;
    }
    .text-dark2 {
        color: #1a1a1a !important;
    }
    a.text-dark2:focus,
    a.text-dark2:hover {
        color: #000 !important;
    }
    .text-chalice {
        color: #b2b2b2 !important;
    }
    a.text-chalice:focus,
    a.text-chalice:hover {
        color: #8c8c8c !important;
    }
    .text-common-grey {
        color: #ededf4 !important;
    }
    a.text-common-grey:focus,
    a.text-common-grey:hover {
        color: #bebed7 !important;
    }
    .text-common-grey2 {
        color: #f7f7ff !important;
    }
    a.text-common-grey2:focus,
    a.text-common-grey2:hover {
        color: #ababff !important;
    }
    .text-common-grey3 {
        color: #666 !important;
    }
    a.text-common-grey3:focus,
    a.text-common-grey3:hover {
        color: #404040 !important;
    }
    .text-mantis {
        color: #66cc6e !important;
    }
    a.text-mantis:focus,
    a.text-mantis:hover {
        color: #39ac42 !important;
    }
    .text-pink {
        color: #ffeded !important;
    }
    a.text-pink:focus,
    a.text-pink:hover {
        color: #ffa1a1 !important;
    }
    .text-darker-red {
        color: #f55 !important;
    }
    a.text-darker-red:focus,
    a.text-darker-red:hover {
        color: #ff0909 !important;
    }
    .text-body {
        color: #212529 !important;
    }
    .text-muted {
        color: #6c757d !important;
    }
    .text-black-50 {
        color: rgba(0, 0, 0, 0.5) !important;
    }
    .text-white-50 {
        color: hsla(0, 0%, 100%, 0.5) !important;
    }
    .text-hide {
        font: 0/0 a;
        color: transparent;
        text-shadow: none;
        background-color: transparent;
        border: 0;
    }
    .text-decoration-none {
        text-decoration: none !important;
    }
    .text-break {
        word-break: break-word !important;
        overflow-wrap: break-word !important;
    }
    .text-reset {
        color: inherit !important;
    }
    .visible {
        visibility: visible !important;
    }
    .invisible {
        visibility: hidden !important;
    }
    .swiper-container {
        margin-left: auto;
        margin-right: auto;
        position: relative;
        overflow: hidden;
        list-style: none;
        padding: 0;
        z-index: 1;
    }
    .swiper-container-no-flexbox .swiper-slide {
        float: left;
    }
    .swiper-container-vertical > .swiper-wrapper {
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .swiper-wrapper {
        position: relative;
        width: 100%;
        height: 100%;
        z-index: 1;
        display: -ms-flexbox;
        display: flex;
        transition-property: transform;
        box-sizing: content-box;
    }
    .swiper-container-android .swiper-slide,
    .swiper-wrapper {
        transform: translateZ(0);
    }
    .swiper-container-multirow > .swiper-wrapper {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    .swiper-container-free-mode > .swiper-wrapper {
        transition-timing-function: ease-out;
        margin: 0 auto;
    }
    .swiper-slide {
        -ms-flex-negative: 0;
        flex-shrink: 0;
        width: 100%;
        height: 100%;
        position: relative;
        transition-property: transform;
    }
    .swiper-container-autoheight,
    .swiper-container-autoheight .swiper-slide {
        height: auto;
    }
    .swiper-container-autoheight .swiper-wrapper {
        -ms-flex-align: start;
        align-items: flex-start;
        transition-property: transform, height;
    }
    .swiper-container-3d {
        perspective: 1200px;
    }
    .swiper-container-3d .swiper-cube-shadow,
    .swiper-container-3d .swiper-slide,
    .swiper-container-3d .swiper-slide-shadow-bottom,
    .swiper-container-3d .swiper-slide-shadow-left,
    .swiper-container-3d .swiper-slide-shadow-right,
    .swiper-container-3d .swiper-slide-shadow-top,
    .swiper-container-3d .swiper-wrapper {
        transform-style: preserve-3d;
    }
    .swiper-container-3d .swiper-slide-shadow-bottom,
    .swiper-container-3d .swiper-slide-shadow-left,
    .swiper-container-3d .swiper-slide-shadow-right,
    .swiper-container-3d .swiper-slide-shadow-top {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        pointer-events: none;
        z-index: 10;
    }
    .swiper-container-3d .swiper-slide-shadow-left {
        background-image: linear-gradient(270deg, rgba(0, 0, 0, 0.5), transparent);
    }
    .swiper-container-3d .swiper-slide-shadow-right {
        background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.5), transparent);
    }
    .swiper-container-3d .swiper-slide-shadow-top {
        background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5), transparent);
    }
    .swiper-container-3d .swiper-slide-shadow-bottom {
        background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5), transparent);
    }
    .swiper-container-wp8-horizontal,
    .swiper-container-wp8-horizontal > .swiper-wrapper {
        -ms-touch-action: pan-y;
        touch-action: pan-y;
    }
    .swiper-container-wp8-vertical,
    .swiper-container-wp8-vertical > .swiper-wrapper {
        -ms-touch-action: pan-x;
        touch-action: pan-x;
    }
    .swiper-container-rtl .swiper-button-next {
        background-image: url(data:image/svg+xml;charset=utf-8,%3Csvg xmlns=http://www.w3.org/2000/svg viewBox=0 0 27 44%3E%3Cpath d=M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z fill=%23007aff/%3E%3C/svg%3E);
        left: 10px;
        right: auto;
    }
    .swiper-container-rtl .swiper-button-prev {
        background-image: url(data:image/svg+xml;charset=utf-8,%3Csvg xmlns=http://www.w3.org/2000/svg viewBox=0 0 27 44%3E%3Cpath d=M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z fill=%23007aff/%3E%3C/svg%3E);
        right: 10px;
        left: auto;
    }
    .swiper-container-rtl .swiper-button-next.swiper-button-white {
        background-image: url(data:image/svg+xml;charset=utf-8,%3Csvg xmlns=http://www.w3.org/2000/svg viewBox=0 0 27 44%3E%3Cpath d=M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z fill=%23fff/%3E%3C/svg%3E);
    }
    .swiper-container-rtl .swiper-button-prev.swiper-button-white {
        background-image: url(data:image/svg+xml;charset=utf-8,%3Csvg xmlns=http://www.w3.org/2000/svg viewBox=0 0 27 44%3E%3Cpath d=M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z fill=%23fff/%3E%3C/svg%3E);
    }
    .swiper-container-rtl .swiper-button-next.swiper-button-black {
        background-image: url(data:image/svg+xml;charset=utf-8,%3Csvg xmlns=http://www.w3.org/2000/svg viewBox=0 0 27 44%3E%3Cpath d=M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z/%3E%3C/svg%3E);
    }
    .swiper-container-rtl .swiper-button-prev.swiper-button-black {
        background-image: url(data:image/svg+xml;charset=utf-8,%3Csvg xmlns=http://www.w3.org/2000/svg viewBox=0 0 27 44%3E%3Cpath d=M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z/%3E%3C/svg%3E);
    }
    .swiper-pagination {
        position: absolute;
        text-align: center;
        transition: opacity 0.3s;
        transform: translateZ(0);
        z-index: 10;
    }
    .swiper-pagination.swiper-pagination-hidden {
        opacity: 0;
    }
    .swiper-container-horizontal > .swiper-pagination-bullets,
    .swiper-pagination-custom,
    .swiper-pagination-fraction {
        bottom: 10px;
        left: 0;
        width: 100%;
    }
    .swiper-pagination-bullets-dynamic {
        overflow: hidden;
        font-size: 0;
    }
    .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
        transform: scale(0.33);
        position: relative;
    }
    .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,
    .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
        transform: scale(1);
    }
    .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
        transform: scale(0.66);
    }
    .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
        transform: scale(0.33);
    }
    .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
        transform: scale(0.66);
    }
    .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
        transform: scale(0.33);
    }
    .swiper-pagination-bullet {
        width: 8px;
        height: 8px;
        display: inline-block;
        border-radius: 100%;
        background: #000;
        opacity: 0.2;
    }
    button.swiper-pagination-bullet {
        border: none;
        margin: 0;
        padding: 0;
        box-shadow: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
    }
    .swiper-pagination-clickable .swiper-pagination-bullet {
        cursor: pointer;
    }
    .swiper-pagination-bullet-active {
        opacity: 1;
        background: #007aff;
    }
    .swiper-container-vertical > .swiper-pagination-bullets {
        right: 10px;
        top: 50%;
        transform: translate3d(0, -50%, 0);
    }
    .swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
        margin: 6px 0;
        display: block;
    }
    .swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
        top: 50%;
        transform: translateY(-50%);
        width: 8px;
    }
    .swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
        display: inline-block;
        transition: transform 0.2s, top 0.2s;
    }
    .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
        margin: 0 4px;
    }
    .swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
        left: 50%;
        transform: translateX(-50%);
        white-space: nowrap;
    }
    .swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
        transition: transform 0.2s, left 0.2s;
    }
    .swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
        transition: transform 0.2s, right 0.2s;
    }
    .swiper-pagination-progressbar {
        background: rgba(0, 0, 0, 0.25);
        position: absolute;
    }
    .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
        background: #007aff;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        transform: scale(0);
        transform-origin: left top;
    }
    .swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
        transform-origin: right top;
    }
    .swiper-container-horizontal > .swiper-pagination-progressbar,
    .swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
        width: 100%;
        height: 4px;
        left: 0;
        top: 0;
    }
    .swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
    .swiper-container-vertical > .swiper-pagination-progressbar {
        width: 4px;
        height: 100%;
        left: 0;
        top: 0;
    }
    .swiper-pagination-white .swiper-pagination-bullet-active {
        background: #fff;
    }
    .swiper-pagination-progressbar.swiper-pagination-white {
        background: hsla(0, 0%, 100%, 0.25);
    }
    .swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill {
        background: #fff;
    }
    .swiper-pagination-black .swiper-pagination-bullet-active {
        background: #000;
    }
    .swiper-pagination-progressbar.swiper-pagination-black {
        background: rgba(0, 0, 0, 0.25);
    }
    .swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill {
        background: #000;
    }
    .swiper-pagination-lock {
        display: none;
    }
    .swiper-container-horizontal > .swiper-scrollbar {
        position: absolute;
        left: 1%;
        bottom: 3px;
        z-index: 50;
        height: 5px;
        width: 98%;
    }
    .swiper-container-vertical > .swiper-scrollbar {
        position: absolute;
        right: 3px;
        top: 1%;
        z-index: 50;
        width: 5px;
        height: 98%;
    }
    .swiper-zoom-container {
        width: 100%;
        height: 100%;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-align: center;
        align-items: center;
        text-align: center;
    }
    .swiper-zoom-container > canvas,
    .swiper-zoom-container > img,
    .swiper-zoom-container > svg {
        max-width: 100%;
        max-height: 100%;
        -o-object-fit: contain;
        object-fit: contain;
    }
    .swiper-lazy-preloader {
        width: 42px;
        height: 42px;
        position: absolute;
        left: 50%;
        top: 50%;
        margin-left: -21px;
        margin-top: -21px;
        z-index: 10;
        transform-origin: 50%;
        animation: b 1s steps(12) infinite;
    }
    .swiper-lazy-preloader:after {
        display: block;
        content: "";
        width: 100%;
        height: 100%;
        background-image: url(data:image/svg+xml;charset=utf-8,%3Csvg viewBox=0 0 120 120 xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink%3E%3Cdefs%3E%3Cpath id=a stroke=%236c6c6c stroke-width=11 stroke-linecap=round d=M60 7v20/%3E%3C/defs%3E%3Cuse xlink:href=%23a opacity=.27/%3E%3Cuse xlink:href=%23a opacity=.2730 60 60/%3E%3Cuse xlink:href=%23a opacity=.2760 60 60/%3E%3Cuse xlink:href=%23a opacity=.2790 60 60/%3E%3Cuse xlink:href=%23a opacity=.27120 60 60/%3E%3Cuse xlink:href=%23a opacity=.27150 60 60/%3E%3Cuse xlink:href=%23a opacity=.37180 60 60/%3E%3Cuse xlink:href=%23a opacity=.46210 60 60/%3E%3Cuse xlink:href=%23a opacity=.56240 60 60/%3E%3Cuse xlink:href=%23a opacity=.66270 60 60/%3E%3Cuse xlink:href=%23a opacity=.75300 60 60/%3E%3Cuse xlink:href=%23a opacity=.85330 60 60/%3E%3C/svg%3E);
        background-position: 50%;
        background-size: 100%;
        background-repeat: no-repeat;
    }
    @keyframes b {
        to {
            transform: rotate(1turn);
        }
    }
    .swiper-container .swiper-notification {
        position: absolute;
        left: 0;
        top: 0;
        pointer-events: none;
        opacity: 0;
        z-index: -1000;
    }
    .swiper-container-fade.swiper-container-free-mode .swiper-slide {
        transition-timing-function: ease-out;
    }
    .swiper-container-fade .swiper-slide {
        pointer-events: none;
        transition-property: opacity;
    }
    .swiper-container-fade .swiper-slide .swiper-slide {
        pointer-events: none;
    }
    .swiper-container-fade .swiper-slide-active,
    .swiper-container-fade .swiper-slide-active .swiper-slide-active {
        pointer-events: auto;
    }
    .swiper-container-cube {
        overflow: visible;
    }
    .swiper-container-cube .swiper-slide {
        pointer-events: none;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        z-index: 1;
        visibility: hidden;
        transform-origin: 0 0;
        width: 100%;
        height: 100%;
    }
    .swiper-container-cube .swiper-slide .swiper-slide {
        pointer-events: none;
    }
    .swiper-container-cube.swiper-container-rtl .swiper-slide {
        transform-origin: 100% 0;
    }
    .swiper-container-cube .swiper-slide-active,
    .swiper-container-cube .swiper-slide-active .swiper-slide-active {
        pointer-events: auto;
    }
    .swiper-container-cube .swiper-slide-active,
    .swiper-container-cube .swiper-slide-next,
    .swiper-container-cube .swiper-slide-next + .swiper-slide,
    .swiper-container-cube .swiper-slide-prev {
        pointer-events: auto;
        visibility: visible;
    }
    .swiper-container-cube .swiper-slide-shadow-bottom,
    .swiper-container-cube .swiper-slide-shadow-left,
    .swiper-container-cube .swiper-slide-shadow-right,
    .swiper-container-cube .swiper-slide-shadow-top {
        z-index: 0;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }
    .swiper-container-cube .swiper-cube-shadow {
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        background: #000;
        opacity: 0.6;
        filter: blur(50px);
        z-index: 0;
    }
    .swiper-container-flip {
        overflow: visible;
    }
    .swiper-container-flip .swiper-slide {
        pointer-events: none;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        z-index: 1;
    }
    .swiper-container-flip .swiper-slide .swiper-slide {
        pointer-events: none;
    }
    .swiper-container-flip .swiper-slide-active,
    .swiper-container-flip .swiper-slide-active .swiper-slide-active {
        pointer-events: auto;
    }
    .swiper-container-flip .swiper-slide-shadow-bottom,
    .swiper-container-flip .swiper-slide-shadow-left,
    .swiper-container-flip .swiper-slide-shadow-right,
    .swiper-container-flip .swiper-slide-shadow-top {
        z-index: 0;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }
    .swiper-container-coverflow .swiper-wrapper {
        -ms-perspective: 1200px;
    }
    .campaigns .header-section {
        padding: 16px;
    }
    @media (max-width: 359.98px) {
        .campaigns .header-section {
            padding: 8px;
        }
    }
    .campaigns .product-background {
        pointer-events: none;
        width: 100%;
        max-width: 500px;
        height: 112px;
        position: absolute;
    }
    .campaign-center {
        background-position: 50% !important;
        background-repeat: no-repeat !important;
        background-size: cover !important;
    }
    .hero-banner-section {
        width: 100%;
    }
    .hero-banner-section.onload {
        padding-top: 66.66667%;
    }
    @media (max-width: 359.98px) {
        .hero-banner-section-container {
            min-height: 214px;
        }
    }
    @media (min-width: 360px) and (max-width: 374.98px) {
        .hero-banner-section-container {
            min-height: 240px;
        }
    }
    @media (min-width: 375px) {
        .hero-banner-section-container {
            min-height: 250px;
        }
    }
    @media (min-width: 411px) {
        .hero-banner-section-container {
            min-height: 276px;
        }
    }
    @media (min-width: 500px) {
        .hero-banner-section-container {
            min-height: 334px;
        }
    }
    @media (max-width: 359.98px) {
        .regular-banner-section.loading {
            height: 104px;
        }
    }
    @media (min-width: 360px) and (max-width: 374.98px) {
        .regular-banner-section.loading {
            height: 112px;
        }
    }
    @media (min-width: 375px) {
        .regular-banner-section.loading {
            height: 117px;
        }
    }
    @media (min-width: 411px) {
        .regular-banner-section.loading {
            height: 130px;
        }
    }
    .progress-container {
        background-color: #cac4d1;
        border-radius: 4px;
        height: 8px;
        position: relative;
    }
    .progress-container .progress-bar {
        background-color: #f55;
        border-radius: 4px;
        height: 8px;
        position: absolute;
    }
    .header {
        position: fixed;
        z-index: 200;
        padding: 8px 0 8px 16px;
        width: 100%;
        max-width: 500px;
        transition: all 0.3s;
        color: #fff;
        min-height: 48px;
        top: 0;
    }
    .header .search-bar {
        outline: 0;
        width: 100%;
        border: none;
        height: 32px;
        padding: 8px 12px;
    }
    .header .search-bar:focus {
        outline-color: transparent;
    }
    .header .left-icon {
        margin: 0 4px 0 8px;
    }
    .floating-right-corner-close {
        position: absolute;
        top: -16px;
        right: -16px;
    }
    .absolute-right-top-close {
        position: absolute;
        top: -4px;
        right: 0;
    }
    .absolute-right-close {
        position: absolute;
        top: 0;
        right: 0;
    }
    .absolute-left-top-search {
        position: absolute;
        top: 0;
        left: 4px;
    }
    .circle-notification {
        position: absolute;
        background-color: red;
        border-radius: 50%;
        border: 2px solid #fff;
        width: 12px;
        height: 12px;
    }
    .circle-notification.bel {
        transform: translate(-16px, 2px);
    }
    .circle-notification.cart {
        transform: translate(-13px, 2px);
    }
    .dropdown-commerce {
        background-color: #fff;
        border-radius: 4px;
        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
        position: absolute;
        width: 200px;
        right: 48px;
        top: 48px;
    }
    .dropdown-commerce.bell {
        right: 46px;
    }
    .dropdown-commerce .menu {
        border-bottom: 1px solid #f5f5f5;
        font-family: Modern Era;
        font-size: 14px;
        font-weight: 700;
        line-height: 17px;
    }
    .dropdown-commerce-wrapper {
        height: 100%;
        width: 100%;
    }
    .dropdown-overlay {
        background-color: rgba(0, 0, 0, 0.2) !important;
    }
    .filter-container {
        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
        font-weight: 700;
        width: 100px;
        left: calc(50% - 50px);
        bottom: 68px;
        border-radius: 16px;
        color: #605c66;
        max-width: 500px;
        padding: 8px 16px;
    }
    .header-shadow {
        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1) !important;
    }
    .header-text {
        width: 100%;
        max-width: 500px;
        position: fixed;
        top: 0;
        height: 48px;
        z-index: 200;
        align-items: center !important;
    }
    .header-text .header-title-text {
        color: #fff;
        font-size: 14px;
        font-weight: 600;
        letter-spacing: 0.5px;
        line-height: 20px;
        width: 100%;
        text-align: left;
        margin-left: 8px;
        margin-bottom: 0;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }
    .modal-custom-header {
        height: 20px;
    }
    .footer-commerce {
        font-size: 13px;
        line-height: 16px;
        text-align: center;
    }
    .footer-commerce .FAQ {
        padding-right: 13px;
    }
    .footer-commerce .SnK {
        padding: 0 13px;
    }
    .footer-commerce .PP {
        padding-left: 13px;
    }
    .footer-commerce .line-space {
        width: 1px;
        border: 1px solid #8e8ec2;
    }
    .wallet-container {
        position: relative;
    }
    .wallet-container .wallet {
        position: absolute;
        top: -24px;
        left: 0;
        right: 0;
        margin: auto;
        padding: 8px;
        z-index: 2;
        background: #fff;
        border-radius: 3px;
        width: calc(100% - 32px);
        height: 48px;
        box-shadow: 0 2px 8px 0 rgba(72, 72, 99, 0.25);
    }
    @media (max-width: 359.98px) {
        .wallet-container .wallet {
            width: calc(100% - 16px);
        }
    }
    .wallet-container .wallet .value {
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.38px;
        line-height: 14px;
        text-align: left;
    }
    .you-saved {
        position: fixed;
        bottom: 63px;
        z-index: 999;
        width: 100%;
        padding: 4px;
    }
    @media (max-width: 359.98px) {
        .product-highlight {
            width: 132px;
            height: 176px;
        }
        .product-highlight.loading {
            height: 179px;
        }
    }
    @media (min-width: 360px) and (max-width: 374.98px) {
        .product-highlight {
            width: 156px;
            height: 186px;
        }
        .product-highlight.loading {
            height: 179px;
        }
    }
    @media (min-width: 375px) {
        .product-highlight {
            width: 156px;
            height: 186px;
        }
        .product-highlight.loading {
            height: 179px;
        }
    }
    @media (min-width: 411px) and (max-width: 499.98px) {
        .product-highlight {
            width: 180px;
            height: 207px;
        }
        .product-highlight.loading {
            height: 200px;
        }
    }
    .product-title {
        font-weight: 700;
        /*! autoprefixer: off */
        -webkit-box-orient: vertical;
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        margin: 0 8px 2px;
        font-size: 10px;
        line-height: 12px;
    }
    .product-title.loading {
        margin: 4px 8px 2px;
        font-size: 0;
    }
    @media (min-width: 411px) {
        .product-title {
            font-size: 11.54px;
            line-height: 13.85px;
        }
    }
    .discount-amount {
        font-weight: 700;
        font-size: 8px;
        line-height: 16px;
    }
    @media (min-width: 411px) {
        .discount-amount {
            font-size: 9.23px;
            line-height: 18.46px;
        }
    }
    .original-price {
        font-weight: 700;
        font-size: 9px;
        line-height: 16px;
    }
    @media (min-width: 411px) {
        .original-price {
            font-size: 9.23px;
            line-height: 18.46px;
        }
    }
    .price {
        position: absolute;
        bottom: 8px;
        font-size: 12px;
        line-height: 16px;
        width: calc(100% - 16px);
    }
    @media (min-width: 411px) {
        .price {
            font-size: 13.85px;
            line-height: 18.46px;
        }
    }
    .product-highlight {
        z-index: 1;
    }
    .brand-holder {
        height: 48px;
        width: 70px;
        top: -24px;
        position: absolute !important;
    }
    .brand-tile-grid {
        display: flex;
        width: 70px;
        flex-direction: column;
        align-items: center;
        margin-right: calc(33% - 70px);
    }
    @media screen and (min-width: 500px) {
        .brand-tile-grid {
            margin-right: calc(25% - 70px);
        }
    }
    .brand-list-grid {
        margin-top: 0;
        margin-bottom: 28px;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }
    .brand-list-grid:after {
        content: "";
        width: 70px;
    }
    .brand-tile-img {
        height: 48px;
        width: 70px;
    }
    .brand-name,
    .brand-promotion {
        font-size: 10px;
        line-height: 12px;
    }
    @media (min-width: 411px) {
        .brand-name,
        .brand-promotion {
            font-size: 11.04px;
            line-height: 13.25px;
        }
    }
    .width50 {
        width: 50%;
    }
    .width-right-element {
        width: 100%;
    }
    .width-left-element {
        width: 112px;
    }
    .swiper-prod-detail.loading:after {
        background-size: 500px 400px !important;
    }
    .add-to-cart.loading,
    .buy.loading {
        border-color: #ccc !important;
    }
    .swiper-first-zoom {
        transition-duration: 0.3s;
        transform: translateZ(0);
    }
    @media only screen and (max-width: 320px) {
        .width-left-element {
            width: calc(100% - 160px);
        }
        .width-right-element {
            width: calc(100% - 8px);
        }
    }
    .outline-transparent {
        outline: transparent;
    }
    .position-right,
    .text-counter-error,
    .text-counter-no-error {
        float: right;
    }
    .product-image {
        background-size: 100%;
        border-radius: 8px;
        width: 70px;
        height: 70px;
        object-fit: cover;
    }
    .oos-filter {
        opacity: 0.5;
    }
    .text-bold {
        font-family: Modern Era;
        color: #6e6e6e;
        font-size: 12px;
        font-weight: 700;
        line-height: 14px;
    }
    .text-center {
        text-align: center;
    }
    .text-middle {
        vertical-align: middle;
    }
    .text-product-title {
        font-weight: 700;
    }
    .text-product-title .item-title {
        max-width: calc(100% - 32px);
    }
    .text-product {
        font-family: Modern Era;
        color: #1a1a1a;
        font-size: 12px;
        font-weight: 400;
        line-height: 16px;
    }
    .text-amount {
        color: #6e6e6e;
    }
    .text-amount,
    .text-currency-cart {
        font-family: Modern Era;
        font-size: 14px;
        font-weight: 700;
        line-height: 16px;
    }
    .text-currency-cart {
        color: #666;
    }
    .text-subtotal {
        margin-top: 5px;
    }
    .text-currency {
        color: #f55;
        font-size: 14px;
        line-height: 16px;
    }
    .text-currency,
    .text-error {
        font-family: Modern Era;
        font-weight: 700;
    }
    .text-error {
        color: red;
        font-size: 10px;
        line-height: 12px;
    }
    .text-input {
        font-family: Modern Era;
        font-size: 12px;
        font-weight: 400;
        line-height: 14px;
    }
    .text-count,
    .text-counter-error,
    .text-counter-no-error {
        font-family: Modern Era;
        color: #b2b2b2;
        font-size: 10px;
        font-weight: 700;
        line-height: 12px;
    }
    .text-pcs {
        font-family: Modern Era;
        color: #b2b2b2;
        font-size: 12px;
        font-weight: 400;
        line-height: 16px;
    }
    .text-counter-error {
        color: red;
        line-height: 12px;
    }
    .text-counter-error,
    .text-counter-no-error {
        font-family: Modern Era;
        font-weight: 700;
        font-size: 10px;
    }
    .text-counter-no-error {
        color: #b2b2b2;
    }
    .text-message-error {
        font-family: Modern Era;
        font-weight: 700;
        color: red;
        font-size: 10px;
    }
    .text-message-no-error {
        display: none;
    }
    input::-webkit-inner-spin-button,
    input::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }
    input[type="number"] {
        -moz-appearance: textfield;
    }
    .input-cart-amount {
        border: none;
        border-bottom: 1px solid #ff6c6c !important;
        width: 32px;
    }
    .amount-section,
    .container-border-bottom {
        border: none;
        border-bottom: 1px solid #f5f5f5;
    }
    .button-prod-red {
        background-color: #f55;
    }
    .button-prod-red,
    .button-prod-white {
        font-family: Modern Era;
        color: #fff;
        font-size: 12px;
        font-weight: 700;
        line-height: 14px;
        border: none;
        border-radius: 8px;
        padding: 8px;
        cursor: pointer;
        width: 100%;
        height: 36px;
    }
    .button-prod-white {
        background-color: #b2b2b2;
        margin-top: 14px;
    }
    .flex-column {
        display: flex;
        flex-direction: column;
    }
    .inline {
        display: inline;
    }
    .check-box-cart-item {
        position: absolute;
        z-index: 2;
        top: -16px;
        left: -16px;
    }
    .container-image {
        float: left;
    }
    .container-image,
    .container-product-title {
        position: relative;
    }
    .cart-action-topright {
        position: absolute;
        top: -12px;
        right: 0;
    }
    .cursor-pointer {
        cursor: pointer;
    }
    .cart-modal-title {
        color: #666;
        font-weight: 400;
        line-height: 18px;
    }
    .cart-modal-button,
    .cart-modal-title {
        font-family: Modern Era;
        font-size: 12px;
        text-align: center;
    }
    .cart-modal-button {
        flex: 50%;
        padding: 10px;
        font-weight: 700;
        line-height: 16px;
        width: 80px;
        border-top: 1px solid #f5f5f5;
    }
    .cart-modal-button .batal {
        color: #b2b2b2;
    }
    .cart-modal-button .hapus {
        color: #f55;
    }
    .border-right {
        border-right: solid;
    }
    .cart-empty-container {
        height: 100%;
        position: relative;
    }
    .cart-empty-container .button-container {
        width: 100%;
        position: fixed;
        bottom: 0;
        max-width: 500px;
    }
    .cart-empty-container .button {
        background-color: #f55;
        border-radius: 8px;
        width: calc(100% - 16px);
        height: 36px;
        color: #fff;
        font-weight: 400;
        line-height: 14px;
        text-align: center;
        font-size: 11px;
        display: block;
        padding: 10px;
        margin: 8px;
        cursor: pointer;
    }
    .cart-container {
        min-height: 100vh;
        background-color: #ededf4;
    }

    .out-of-stock {
        background-color: hsla(0, 0%, 100%, 0.5);
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
        border-radius: 8px;
    }
    .out-of-stock-label {
        background-color: rgba(0, 0, 0, 0.6);
        position: absolute;
        z-index: 2;
        bottom: 0;
        width: 100%;
        padding: 4px;
        text-align: center;
        font-weight: 700;
        font-size: 10px;
        line-height: 14px;
    }
    .bottom-arrow {
        background: url(ArrowRight.svg) no-repeat;
        width: 32px;
        height: 32px;
        position: absolute;
        margin-top: -8px;
        transform: rotate(90deg);
    }

    .pdp-section-separator {
        margin-left: -16px;
        margin-right: -16px;
        padding: 16px;
        margin-bottom: 16px;
        border-bottom: 8px solid #f5f5f5;
    }
    .image-holder {
        width: 70px;
        height: 70px;
    }
    .flash-sale-indicator {
        height: 56px;
    }
    .product-tile {
        position: relative;
        font-size: 0;
        height: 100%;
    }
    .product-tile.sm-tile {
        width: 104px;
    }
    .product-tile.sm-tile .image-container {
        width: 104px;
        height: 112px;
    }
    @media (min-width: 411px) and (max-width: 499.98px) {
        .product-tile.sm-tile {
            width: 120px;
        }
        .product-tile.sm-tile .image-container {
            width: 120px;
            height: 129px;
        }
    }
    @media (max-width: 359.98px) {
        .product-tile.md-tile {
            width: 118px;
        }
        .product-tile.md-tile .image-container {
            width: 118px;
            height: 118px;
        }
        .product-tile.md-tile .brand-holder {
            margin: 0 24.5px;
        }
    }
    @media (min-width: 360px) and (max-width: 374.98px) {
        .product-tile.md-tile {
            width: 125px;
        }
        .product-tile.md-tile .image-container {
            width: 125px;
            height: 125px;
        }
        .product-tile.md-tile .brand-holder {
            margin: 0 27.5px;
        }
    }
    @media (min-width: 375px) {
        .product-tile.md-tile {
            width: 130px;
        }
        .product-tile.md-tile .image-container {
            width: 130px;
            height: 130px;
        }
        .product-tile.md-tile .brand-holder {
            margin: 0 30px;
        }
    }
    @media (min-width: 411px) and (max-width: 499.98px) {
        .product-tile.md-tile {
            width: 138px;
        }
        .product-tile.md-tile .image-container {
            width: 138px;
            height: 138px;
        }
        .product-tile.md-tile .brand-holder {
            margin: 0 34px;
        }
    }
    .product-tile.lg-tile .original-price {
        font-size: 10px;
        line-height: 16px;
        letter-spacing: 0.5px;
    }
    .product-tile.lg-tile .image-container {
        width: 100%;
    }
    @media screen and (min-width: 501px) {
        .product-tile.lg-tile .image-container {
            height: 234px;
        }
    }
    @media screen and (max-width: 500px) {
        .product-tile.lg-tile .image-container {
            height: 46vw;
        }
    }
    .product-tile.lg-tile .out-of-stock-label {
        font-size: 12px;
        padding: 6px;
    }
    .product-tile:last-child:after {
        content: "";
        width: 16px;
        height: 1px;
        position: absolute;
        left: 100%;
        top: 0;
    }
    @media (max-width: 359.98px) {
        .product-tile:last-child:after {
            width: 8px;
        }
    }
    .category-list {
        flex: 0 0 auto;
    }
    .category-list .icon {
        position: relative;
        border-radius: 50%;
    }
    .category-list .no-thumbnail {
        background-image: linear-gradient(180deg, #ffa1a2, #f55);
    }
    .category-list:last-child .icon:after {
        content: "";
        width: 16px;
        height: 1px;
        position: absolute;
        left: 100%;
        top: 0;
    }
    @media (max-width: 359.98px) {
        .category-list:last-child .icon:after {
            width: 8px;
        }
    }
    .category-list p {
        /*! autoprefixer: off */
        -webkit-box-orient: vertical;
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        width: 56px;
    }
    .category-list p.loading {
        font-size: 0;
        height: 36px;
    }
    .category-list .category-carousel-icon {
        width: 32px;
        height: 32px;
        margin-left: auto;
        margin-right: auto;
    }
    .modal {
        position: relative;
        left: 0;
        right: 0;
        margin: 0 auto;
        display: flex;
        opacity: 0;
        align-items: center;
        width: 100%;
        height: 100%;
        max-width: 500px;
        z-index: 1050;
    }
    .modal.from-top {
        top: 0;
    }
    .modal.from-bottom {
        bottom: 0;
    }
    .modal.with-transition {
        transition: all 0.3s ease;
    }
    .modal.confirmation-modal-commerce .modal-container {
        border-radius: 8px;
        max-width: 280px !important;
    }
    .modal.confirmation-modal-commerce .modal-title {
        font-size: 14px;
        font-weight: 700;
        line-height: 20px;
        color: #605c66;
        letter-spacing: normal;
    }
    .modal.confirmation-modal-commerce .modal-title.title-only {
        font-weight: 400;
        text-align: center;
        color: #362e49;
    }
    .modal.confirmation-modal-commerce .modal-warning {
        border-top: 1px solid #ebe6ef;
    }
    .modal.confirmation-modal-commerce .modal-warning > p {
        font-size: 10px;
        line-height: 16px;
        padding: 8px;
        color: #605c66;
        margin-bottom: 0;
        background-color: #ffe9b2;
        border-radius: 4px;
    }
    .modal.confirmation-modal-commerce .modal-action-buttons {
        border-top: 1px solid #ebe6ef;
    }
    .modal.confirmation-modal-commerce .modal-action-buttons > button {
        width: 100%;
        padding: 12px 24px;
        border-right: 1px solid #ebe6ef;
        color: #f55;
        outline: none;
    }
    .modal.confirmation-modal-commerce .modal-action-buttons > button:last-child {
        border-right: 0;
    }
    .modal.confirmation-modal-commerce .modal-action-buttons > button.btn-reject {
        color: #9c97a3;
    }
    .modal.confirmation-modal-commerce .modal-action-buttons.destructive-type {
        flex-direction: row-reverse;
    }
    .modal.confirmation-modal-commerce .modal-action-buttons.destructive-type > button {
        color: #e00d0d;
        border-right: 0;
        border-left: 1px solid #ebe6ef;
    }
    .modal.confirmation-modal-commerce .modal-action-buttons.destructive-type > button:last-child {
        border: 0;
    }
    .modal.confirmation-modal-commerce .modal-action-buttons.destructive-type .btn-reject {
        color: #9c97a3;
    }
    .modal.modal-bottom-drawer {
        font-family: Modern Era;
        align-items: unset;
    }
    .modal.modal-bottom-drawer .modal-container {
        transform: translateY(100%);
        position: absolute;
        bottom: 0;
        width: 100%;
        border-radius: 16px 16px 0 0;
        padding: 8px 22px 0;
        max-height: calc(100% + 32px);
        overflow-y: hidden;
        transition: transform 0.5s ease;
    }
    .modal.modal-bottom-drawer .with-overlay-bottom-handler {
        margin-bottom: -80px;
    }
    .modal.modal-bottom-drawer .orderer-container {
        overflow-y: scroll;
        color: #666;
        font-family: Modern Era;
        font-size: 12px;
        line-height: 16px;
        margin-top: 31px;
    }
    .modal.modal-bottom-drawer .orderer-container ol {
        padding: 0 0 0 20px;
    }
    .modal.modal-bottom-drawer .orderer-container ol li {
        margin-bottom: 12px;
        padding-left: 8px;
    }
    .modal.modal-bottom-drawer .orderer-container::-webkit-scrollbar {
        height: 0;
        padding: 0;
        width: 0;
    }
    .modal.modal-bottom-drawer .modal-overlay {
        background-color: rgba(0, 0, 0, 0.75);
    }
    .modal .modal-overlay {
        width: 100%;
        height: 100%;
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        background: rgba(0, 0, 0, 0.5);
        z-index: calc($zindex-modal - 1);
    }
    .modal .fixed-footer {
        position: fixed;
        padding-left: 12px;
        padding-right: 12px;
        background-color: #f5f5f5;
        max-width: 500px;
        width: 100%;
        bottom: 0;
        border-top: 1px solid #ddd;
        z-index: 100;
    }
    .modal .fixed-footer .button-action {
        margin-left: 8px;
        margin-top: 14px;
        margin-bottom: 14px;
        background-color: #e00d0d;
        border: 1px solid #e00d0d;
        border-radius: 8px;
        width: 50%;
        height: 36px;
        color: #fff;
        font-family: Modern Era;
        font-size: 12px;
        font-weight: 400;
        line-height: 14px;
    }
    .modal .modal-container {
        position: relative;
        background-color: #fff;
        border-radius: 8px;
        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
        width: 328px;
        height: auto;
        margin: 0 auto;
        max-height: 100vh;
        overflow-y: auto;
        z-index: 1050;
        scrollbar-width: thin;
    }
    .modal .modal-container::-webkit-scrollbar {
        width: 8px;
    }
    .modal .modal-container::-webkit-scrollbar-thumb {
        background: #aaa;
        border-radius: 20px;
    }
    .modal .modal-container::-webkit-scrollbar-track {
        background: #ccc;
        border-radius: 20px;
        margin: 20px 10px 20px 0;
        right: 10px;
    }
    .modal .modal-container.top {
        padding: 16px;
    }
    .modal .modal-container.no-transform {
        transform: none;
    }
    .modal .modal-container .modal-icon {
        margin-bottom: 32px;
    }
    .modal .modal-container .modal-icon a {
        font-size: 24px;
        color: #000;
    }
    .modal .modal-container .modal-subtitle {
        color: #605c66;
        text-align: center;
        font-family: Modern Era, sans-serif;
        font-size: 14px;
        font-weight: 700;
        letter-spacing: 0.5px;
        line-height: 20px;
        width: 296px;
    }
    .modal .modal-container .line {
        border-bottom: 1px solid #ebe6ef;
    }
    .modal .modal-container .group-button {
        display: flex;
        justify-content: center;
    }
    .modal .modal-container .modal-button {
        color: #9c97a3;
        font-family: Modern Era, sans-serif;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.59px;
        line-height: 16px;
        width: 80px;
        text-align: center;
        margin-left: 15%;
        border: none;
        background: no-repeat;
    }
    .modal.modal-apps {
        background: #000;
    }
    .modal.modal-fullscreen {
        z-index: 1050;
        transform: translateY(100%);
    }
    .modal.modal-fullscreen .modal-container {
        height: 100%;
        margin: 0 auto;
        max-height: none;
        border-radius: 0;
        width: 100%;
        overflow: auto;
        box-shadow: none;
    }
    .modal.modal-fullscreen .modal-container .modal-icon a {
        color: #000;
    }
    .modal.show {
        visibility: visible;
        opacity: 1;
        transform: translateY(0);
    }
    .modal.show.modal-bottom-drawer .modal-container {
        transition: transform 0.5s ease;
        transform: translateY(0);
    }
    .modal.show .modal-container.no-transform {
        transform: none;
    }
    .modal-image-preview .modal-overlay {
        background: #000;
    }
    .modal-image-preview .modal-container {
        width: 100%;
        border-radius: 0;
        background-color: transparent;
    }
    .modal-image-preview .modal-container .header {
        height: 56px;
        position: fixed;
        top: 0;
        background: rgba(0, 0, 0, 0.5);
    }
    .modal-image-preview .image-section {
        height: 100%;
    }
    .modal-image-preview .image-description-container {
        width: calc(100% - 112px);
        margin: 2px 0;
    }
    .modal-image-preview .title {
        color: #fff;
        font-weight: 600;
        font-size: 18px;
        letter-spacing: 0.5px;
        line-height: 24px;
        font-family: Asap Condensed;
    }
    .modal-image-preview .subtitle {
        font-size: 12px;
        font-weight: 400;
        color: #fff;
        letter-spacing: 0.5px;
        line-height: 16px;
    }
    .modal-image-preview .m-6-0 {
        margin: 6px 0;
    }
    .modal-image-preview .filter-white {
        filter: brightness(1.7) grayscale(1);
    }
    .custom-overlay {
        background: #695787 !important;
    }
    .custom-height {
        height: 100vh !important;
        top: -64px !important;
    }
    .swiper-handle {
        width: 33px;
        background-color: #e1e1e1;
        height: 4px;
        margin: auto;
        border-radius: 2.5px;
    }
    .swiper-modal-handle {
        position: absolute;
        width: 100%;
        height: 38px !important;
        top: 0;
        left: 0;
    }
    .modal-close-with-swiper {
        position: relative;
        z-index: 1;
    }
    .loading-modal {
        width: auto !important;
        padding: 24px;
        border-radius: 4px !important;
        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
    }
    .no-overlay {
        background: none !important;
    }
    .toast-center-wrapper {
        position: fixed;
        width: 100%;
        bottom: 84px;
        height: 32px;
    }
    .toast-center-wrapper .toast-center {
        background-color: #444;
        border-radius: 8px;
        width: 190px;
        height: 32px;
    }
    .toast-center-wrapper .message {
        color: #fff;
        font-family: Modern Era;
        font-size: 12px;
        font-weight: 400;
        line-height: 16px;
        text-align: center;
    }
    .toast {
        bottom: -200%;
        position: fixed;
        transition: bottom 0.3s ease;
        width: 100%;
        max-width: 500px;
        z-index: 9999;
    }
    .toast.toast-center {
        bottom: 43%;
        display: none;
        transition: none;
    }
    .toast.toast-center.toast-promo {
        bottom: 80px !important;
    }
    .toast.toast-center.toast-promo .wrapper {
        max-width: fit-content;
        padding: 12px 16px;
        background-color: rgba(54, 46, 73, 0.9);
    }
    .toast.toast-center.voucher-toast .wrapper {
        max-width: fit-content;
        padding: 12px 16px;
    }
    .toast.toast-center.voucher-toast.bottom {
        bottom: 112px !important;
        opacity: 0.72;
    }
    .toast.toast-center.voucher-toast.bottom.no-footer-bottom {
        bottom: 24px !important;
    }
    .toast.toast-center.voucher-toast.bottom.opaque {
        opacity: 1 !important;
    }
    .toast.toast-center.voucher-toast.bottom .wrapper {
        height: 36px;
    }
    .toast.toast-center.with-navbar-filter {
        bottom: 118px !important;
    }
    .toast.toast-center.with-navbar-filter .wrapper {
        max-width: fit-content;
        padding: 12px 16px;
        background-color: rgba(54, 46, 73, 0.9);
    }
    .toast.toast-center.without-navbar {
        bottom: 16px !important;
    }
    .toast.toast-center.without-navbar .wrapper {
        max-width: fit-content;
        padding: 12px 16px;
        background-color: rgba(54, 46, 73, 0.9);
    }
    .toast.toast-center .wrapper {
        max-width: 75%;
        border-radius: 8px;
        text-align: center;
        opacity: 0;
        padding: 8px 16px;
    }
    .toast.toast-center .wrapper .message {
        width: 100%;
    }
    .toast.toast-center.bottom {
        bottom: 10% !important;
        opacity: 0.8;
    }
    .toast.toast-center.bottom .wrapper {
        height: 32px;
    }
    .toast.show {
        bottom: 0;
    }
    .toast.show.cart-toast {
        bottom: 80px;
    }
    .toast.show.redemption-toast {
        bottom: 24px;
    }
    .toast.show.tile-toast {
        bottom: 118px;
    }
    .toast.show.address-toast {
        bottom: 84px;
    }
    .toast.show.with-margin-bottom {
        bottom: 16px;
    }
    .toast.show.toast-center {
        bottom: 43%;
        display: block;
    }
    .toast.show.toast-center .wrapper {
        opacity: 1;
    }
    .toast .wrapper {
        display: flex;
        align-items: center;
        background: #fff;
        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
        color: #666;
        margin: 0 auto;
        padding: 16px;
        z-index: 99;
        width: calc(100% - 32px);
        border-radius: 4px;
        box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.1);
    }
    .toast .wrapper.info {
        background: #666;
    }
    .toast .wrapper.full-width-message .message {
        width: 100% !important;
    }
    .toast .wrapper.cart-info {
        padding: 12px 16px;
        background-color: rgba(54, 46, 73, 0.9);
    }
    .toast .wrapper.cart-info .action {
        color: #fff;
    }
    .toast .wrapper.cart-error {
        padding: 12px 16px;
        color: #fff;
        background-color: rgba(224, 13, 13, 0.9);
    }
    .toast .wrapper.cart-error .action {
        color: #fff;
    }
    .toast .wrapper.cart-error.align-center .message {
        width: 100% !important;
    }
    .toast .wrapper.address-info {
        padding: 8px !important;
        background: rgba(68, 68, 68, 0.92);
    }
    .toast .wrapper.address-info .message {
        text-align: center;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    .toast .wrapper.address-info .action {
        color: #fff;
    }
    .toast .wrapper.success {
        background: #e7faf2;
    }
    .toast .wrapper.error {
        background: #ff6c6c;
    }
    .toast .wrapper.bottom {
        bottom: 10% !important;
    }
    .toast .wrapper .message {
        color: #fff;
        font-weight: 400;
        width: 80%;
    }
    .toast .wrapper .action,
    .toast .wrapper .message {
        font-family: Modern Era;
        font-size: 12px;
        line-height: 16px;
    }
    .toast .wrapper .action {
        font-weight: 700;
        text-align: right;
        white-space: nowrap;
    }
    .toast .wrapper.express-mart {
        background: #362e49 !important;
        text-align: left;
    }
    .toast .wrapper.express-mart .message {
        width: 80% !important;
    }
    .rp-toast-container {
        bottom: 72px !important;
        display: block;
    }
    .repurchase-toast.wrapper {
        background-color: #362e49;
        text-align: left !important;
        max-width: calc(100% - 32px) !important;
        padding: 16px !important;
        opacity: 0.9 !important;
        border-radius: 4px !important;
    }
    @media (min-width: 375px) {
        .repurchase-toast.wrapper {
            width: 468px;
        }
    }
    .repurchase-toast.wrapper a {
        color: #fff;
        font-weight: 700;
    }
    .order-section {
        font-family: Modern Era;
        background-color: #ededf4;
        min-height: 100vh;
    }
    .order-section .text {
        color: #6e6e6e;
        font-size: 14px;
        font-weight: 700;
        line-height: 16px;
        text-align: left;
    }
    .order-section .tab-section {
        background-color: #fff;
    }
    .order-section .tab-section .scroll-section {
        overflow-y: auto;
    }
    .order-section .tab-section .flex-none {
        flex: none;
    }
    .order-section .tab-section .list {
        color: #6e6e6e;
        font-size: 12px;
        font-weight: 400;
        line-height: 14px;
        text-align: left;
    }
    .order-section .tab-section .list .list-text {
        display: inline;
    }
    .order-section .tab-section .list .badge {
        padding-top: 1px;
        float: right;
        background-color: #f55;
        border-radius: 8px;
        color: #fff;
        font-weight: 700;
        text-align: center;
        padding: 0 3px;
    }
    .order-section .tab-section .button-active {
        background-color: #f55;
        color: #fff;
    }
    .order-section .tab-section .button-active,
    .order-section .tab-section .button-inactive {
        border: 1px solid #f55;
        border-radius: 13px;
        font-size: 10px;
        font-weight: 400;
        line-height: 12px;
        text-align: left;
        padding: 4px;
        margin-right: 8px;
        cursor: pointer;
    }
    .order-section .tab-section .button-inactive {
        background-color: #fff;
        color: #f55;
    }
    .order-section .item-section {
        background-color: #fff;
    }
    .order-section .item-section .data-section {
        display: flex;
        flex-wrap: nowrap;
    }
    .order-section .item-section .data-section .first-container {
        background-color: #d8d8d8;
        border-radius: 100%;
        width: 24px;
        height: 24px;
    }
    .order-section .item-section .data-section .second-container .store-name-text {
        color: #6e6e6e;
        font-size: 12px;
        font-weight: 700;
        line-height: 16px;
        text-align: left;
    }
    .order-section .item-section .data-section .second-container .date-time-order-text {
        color: #6e6e6e;
        font-size: 10px;
        font-weight: 400;
        line-height: 16px;
        text-align: left;
    }
    .order-section .item-section .data-section .third-container {
        width: 300px;
    }
    .order-section .item-section .data-section .third-container .order-code,
    .order-section .item-section .data-section .third-container .order-from-text {
        color: #6e6e6e;
        font-size: 10px;
        font-weight: 700;
        line-height: 16px;
        text-align: right;
    }
    .order-section .item-section .info-order-text {
        color: #6e6e6e;
        font-size: 12px;
        font-weight: 400;
        line-height: 16px;
        text-align: left;
    }
    .order-section .item-section .invoice-number {
        color: #6e6e6e;
        font-size: 12px;
        font-weight: 400;
        line-height: 16px;
        text-align: left;
    }
    .order-section .item-section .invoice-link {
        color: #f55;
        font-size: 12px;
        font-weight: 700;
        line-height: 16px;
        text-align: right;
        cursor: pointer;
    }
    .order-section .item-section .success-action .text-label {
        color: #6e6e6e;
        font-size: 12px;
        font-weight: 400;
        line-height: 16px;
        width: 156px;
        text-align: left;
    }
    .order-section .item-section .success-action .text-total {
        color: #f55;
        font-size: 14px;
        font-weight: 700;
        line-height: 16px;
        text-align: right;
    }
    .order-section .item-section .button-rincian-pengiriman {
        background-color: #f55;
        border-radius: 8px;
        height: 36px;
        text-align: center;
        display: table-cell;
        vertical-align: middle;
        width: calc(100vw - 32px);
        cursor: pointer;
    }
    .order-section .item-section .button-rincian-pengiriman .text {
        color: #fff;
        font-size: 12px;
        font-weight: 700;
        line-height: 14px;
    }
    .button-call-us {
        border: 1px solid #f55;
        border-radius: 8px;
        height: 36px;
        text-align: center !important;
        display: table-cell !important;
        vertical-align: middle;
        width: calc(100vw - 32px);
        cursor: pointer;
    }
    .button-call-us .caption {
        font-weight: 700;
        line-height: 14px;
    }
    .order-border-top {
        border-top: 1px solid #eee;
    }
    .order-border-bottom {
        border-bottom: 1px solid #eee;
    }
    .order-empty-container {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .order-empty-container .ilustration {
        left: 50%;
        width: 256px;
        height: 256px;
    }
    .order-empty-container .text {
        color: #6e6e6e;
        font-size: 12px;
        font-weight: 400;
        line-height: 24px;
        width: 328px;
        text-align: center;
    }
    .invoice.invoice-logo {
        position: absolute;
        top: 72px;
    }
    .invoice .invoice-id {
        font-size: 12px;
        line-height: 24px;
    }
    .invoice .invoice-header {
        font-size: 8px;
        line-height: 12px;
    }
    .invoice .invoice-footer {
        margin-left: 42.35%;
    }
    .invoice .invoice-total {
        font-size: 10px;
    }
    .invoice .invoice-destination {
        line-height: 24px;
    }
    .invoice .invoice-delivery {
        background-color: #f7f7ff;
        border-radius: 4px;
        width: 100%;
    }
    .invoice .invoice-product {
        border-bottom: 1px solid #eee;
        border-top: 1px solid #eee;
        padding: 20px 0;
    }
    .invoice .invoice-product .product-name {
        width: 40%;
    }
    .invoice .invoice-product .product-qty {
        width: 15%;
        text-align: center;
    }
    .invoice .invoice-product .product-price,
    .invoice .invoice-product .product-subtotal {
        width: 22.5%;
        text-align: center;
    }
    .border-radius-13 {
        border-radius: 13px;
    }
    .tracker-class {
        color: #6e6e6e;
    }
    .tracker-class .tracker-wave {
        left: 5px;
        transform: translateY(3px);
    }
    .tracker-class .tracker-data {
        font-size: 12px;
        line-height: 14px;
    }
    .tracker-class .tracker-time {
        font-size: 10px;
        line-height: 14px;
        min-width: 70px;
    }
    .tracker-class .tracker-description {
        font-size: 12px;
        line-height: 16px;
    }
    .tracker-class .tracker-icon {
        left: 17px;
        transform: translateY(-7px);
    }
    .tracker-class .tracker-line {
        width: 2px;
        transform: translateY(11px);
    }
    .tracker-class .sonar-wrapper {
        left: 0;
        transform: translateY(-17px);
        position: relative;
        z-index: 0;
        overflow: hidden;
    }
    .tracker-class .sonar-emitter {
        position: relative;
        margin: 16px;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background-color: #695787;
    }
    .tracker-class .sonar-wave {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 50%;
        background-color: #695787;
        opacity: 0;
        z-index: -1;
        pointer-events: none;
    }
    .tracker-class .sonar-wave1 {
        animation: c 2s linear infinite;
    }
    .tracker-class .sonar-wave2 {
        animation: c 2s 0.5s linear infinite;
    }
    .tracker-class .sonar-wave3 {
        animation: c 2s 1s linear infinite;
    }
    @keyframes c {
        0% {
            opacity: 0.4;
        }
        to {
            transform: scale(4);
            opacity: 0;
        }
    }
    .prod-detail-title {
        color: #1a1a1a;
        font-size: 12px;
    }
    .prod-detail-price,
    .prod-detail-title {
        font-family: Modern Era;
        font-weight: 700;
        line-height: 16px;
    }
    .prod-detail-price {
        color: #ff6c6c;
        font-size: 14px;
        float: left;
    }
    .prod-detail-price.with-free-product {
        line-height: 20px;
        align-self: flex-end;
    }
    .prod-detail-stock {
        color: #000;
        font-family: Modern Era;
        font-size: 10px;
        font-weight: 700;
        line-height: 12px;
        float: right;
    }
    .prod-detail-subtitle {
        color: #6e6e6e;
        font-size: 14px;
        font-weight: 700;
    }
    .prod-detail-description,
    .prod-detail-subtitle {
        font-family: Modern Era;
        line-height: 16px;
        text-align: left;
    }
    .prod-detail-description {
        color: #666;
        font-size: 12px;
        font-weight: 400;
        padding-bottom: 68px;
    }
    .prod-detail-description.with-discount {
        padding-bottom: 100px;
    }
    .prod-detail-description div img {
        object-fit: contain;
        width: 100%;
        border-top: 1px solid #eee;
        padding-top: 16px;
        margin-top: 16px;
        border-bottom: 1px solid #eee;
        padding-bottom: 16px;
        margin-bottom: 16px;
    }
    .prod-detail-spesification {
        color: #666;
        font-family: Modern Era;
        font-size: 12px;
        font-weight: 400;
        line-height: 14px;
        text-align: left;
    }
    .prod-detail-spesification .spec-name {
        padding-left: 8px;
        width: 37.5%;
    }
    .prod-detail-spesification tr td {
        padding-top: 8px;
        padding-bottom: 8px;
    }
    .prod-detail-spesification tr td a {
        color: #ff6c6c !important;
        font-weight: 700;
    }
    .prod-detail-footer {
        z-index: 100;
        position: fixed;
        border-top: 1px solid #ddd;
        padding-left: 12px;
        padding-right: 12px;
        background-color: #f5f5f5;
        bottom: 0;
        width: 100%;
        max-width: 500px;
    }
    .prod-detail-footer button {
        outline: 0;
    }
    .prod-detail-footer .buy {
        margin-right: 8px;
        background-color: #f5f5f5;
        color: #f55;
    }
    .prod-detail-footer .add-to-cart,
    .prod-detail-footer .buy {
        margin-top: 14px;
        margin-bottom: 14px;
        border: 1px solid #f55;
        border-radius: 8px;
        width: 50%;
        height: 36px;
        font-size: 12px;
        font-weight: 700;
        line-height: 14px;
        cursor: pointer;
    }
    .prod-detail-footer .add-to-cart {
        margin-left: 8px;
        background-color: #f55;
        color: #fff;
        font-family: Modern Era;
    }
    .prod-detail-footer-button {
        color: #f55;
        font-family: Modern Era;
        font-size: 12px;
        font-weight: 700;
        line-height: 14px;
        text-align: center;
    }
    .swiper-prod-detail-image-swiper {
        max-height: 360px !important;
        object-fit: contain !important;
    }
    .swiper-prod-detail .swiper-container {
        width: 100%;
        height: 100%;
    }
    .swiper-prod-detail .swiper-slide {
        text-align: center;
        font-size: 18px;
        background: #fff;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .swiper-prod-detail .swiper-pagination-bullet {
        background: transparent;
        border: 2px solid #695787;
        opacity: 1;
    }
    .swiper-prod-detail .swiper-pagination-bullets {
        bottom: 0;
    }
    .swiper-prod-detail .swiper-pagination-bullet-active {
        background: #695787;
    }
    .swiper-prod-detail.swiper-white-bullet .swiper-pagination-bullet {
        background: transparent;
        border: 2px solid #fff;
        opacity: 1;
    }
    .swiper-prod-detail.swiper-white-bullet .swiper-pagination-bullets {
        bottom: 8px;
    }
    .swiper-prod-detail.swiper-white-bullet .swiper-pagination-bullet-active {
        background: #fff;
    }
    .scroll-container {
        position: fixed;
        bottom: 73px;
        height: 24px;
        width: 100%;
        max-width: 500px;
        z-index: 100;
    }
    .scroll-container.with-discount {
        bottom: 94px;
    }
    .scroll-to-top {
        background: url(../../../static/images/icons/arrow-top.svg) no-repeat;
        width: 24px;
        height: 24px;
        float: right;
        margin-right: 11.11%;
        max-width: 500px;
        transition: opacity 0.5s;
        -webkit-transition: opacity 0.5s;
        opacity: 1;
    }
    .scroll-to-top-hide {
        opacity: 0;
    }
    .odd {
        background-color: #f5f5f5;
    }
    .float-right {
        float: right;
    }
    .w-100 {
        width: 100%;
    }
    .disabled-button {
        background-color: #ccc !important;
        color: #fff !important;
    }
    .disabled-button,
    .disabled-outline-button {
        border: 1px solid #ccc !important;
        font-weight: 700;
    }
    .disabled-outline-button {
        color: #ccc !important;
    }
    .max-content-place {
        width: max-content;
    }
    .side-bar {
        width: 20vw;
        max-height: 133.35px;
        max-width: 100px;
        padding: 16px 8px 8px;
    }
    .side-bar .pointer {
        cursor: pointer;
    }
    .side-bar.side-bar-active {
        width: 20vw;
        max-height: 133.35px;
        max-width: 100px !important;
        background-color: #fff;
        box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.15);
    }
    .side-bar .icon {
        align-items: center;
        object-fit: contain;
        max-width: 66.65px;
        max-height: 66.65px;
        width: 32px;
        height: 32px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 8px;
    }
    .side-bar .name {
        color: #6e6e6e;
        font-family: Modern Era;
        font-size: 10px;
        font-weight: 400;
        line-height: 12px;
        text-align: center;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
    .category-scroll-container {
        max-width: 500px;
    }
    .category-scroll-container .pointer {
        cursor: pointer;
    }
    .category-scroll-container .category-scroll-left {
        overflow-y: overlay !important;
        background-color: #f5f5f5;
        position: fixed;
        padding-top: 48px;
        top: 0;
        bottom: 0;
        height: 100%;
        max-width: 100px;
        width: 20vw;
        z-index: 1;
        padding-bottom: 56px;
    }
    .category-scroll-container .category-scroll-left::-webkit-scrollbar {
        width: 0;
        height: 0;
    }
    .category-scroll-container .category-scroll-right {
        overflow-y: scroll !important;
        position: fixed;
        padding-top: 48px;
        top: 0;
        height: 100%;
        width: 100%;
        max-width: 500px;
        padding-bottom: 56px;
    }
    .category-scroll-container .category-scroll-right .collapse-level2,
    .category-scroll-container .category-scroll-right .expand-level2 {
        overflow: hidden;
        display: block;
    }
    .category-scroll-container .category-scroll-right .wrap {
        max-width: 32px;
        right: 0;
        margin-right: 10px;
    }
    .category-scroll-container .category-scroll-right .wrap .right-arrow {
        background: url(../../../static/images/icons/ArrowRight.svg) no-repeat;
        width: 32px;
        height: 32px;
        float: right;
        cursor: pointer;
    }
    .category-scroll-container .category-scroll-right .wrap-level {
        float: right;
        width: 100%;
        padding-left: 20%;
        font-family: Modern Era;
    }
    .category-scroll-container .category-scroll-right .wrap-level .level1 {
        color: #444 !important;
        font-size: 12px;
        font-weight: 700;
        line-height: 14px;
        text-align: left;
        cursor: pointer;
    }
    .category-scroll-container .category-scroll-right .wrap-level.level2 {
        font-size: 10px;
        font-weight: 700;
        line-height: 12px;
        text-align: left;
    }
    .category-scroll-container .category-scroll-right .wrap-level.level2 .level2 {
        color: #6e6e6e !important;
    }
    .category-scroll-container .category-scroll-right .wrap-level.level2 .marked {
        background-color: #87e6be;
        border-radius: 3px;
        width: 8px;
        height: 16px;
    }
    .category-scroll-container .category-scroll-right .wrap-level .level3 {
        color: #6e6e6e;
        font-size: 10px;
        font-weight: 400;
        line-height: 12px;
        text-align: left;
        cursor: pointer;
        margin-bottom: 3px;
    }
    .category-scroll-container .category-scroll-right .wrap-level .wrap-stroke {
        margin-right: 26px !important;
    }
    .category-scroll-container .category-scroll-right .wrap-level .stroke {
        width: 100%;
        height: 1px;
        margin-right: 26px;
        margin-top: 3px;
    }
    .category-scroll-container .category-scroll-right .wrap-level .stroke.soft-grey-3 {
        background-color: #f5f5f5;
    }
    .category-scroll-container .category-scroll-right .wrap-level .stroke.white {
        background-color: #fff;
    }
    .service-shipment {
        cursor: pointer;
    }
    .service-shipment:before {
        content: url(../../static/images/icons/Commerce/dot-unselect.svg);
        border-radius: 50%;
        vertical-align: middle;
        display: inline-block;
        margin-right: 8px;
    }
    .service-shipment.active:before {
        content: url(../../static/images/icons/Commerce/dot-select.svg);
    }
    .payment-instruction ol {
        counter-reset: a;
    }
    .payment-instruction ol > li {
        counter-increment: a;
        position: relative;
        margin-bottom: 8px;
    }
    .payment-instruction ol > li:before {
        background-color: #b18fa1 !important;
        width: 20px;
        height: 20px;
        padding: 3px;
        border-radius: 50%;
        color: #fff;
        content: counter(a);
        display: inline-block;
        text-align: center;
        position: absolute;
        left: -22px;
        top: -2px;
    }
    .card-shadow {
        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
    }
    .collapse .right-arrow,
    .collapse .top-arrow {
        background: url(../../../static/images/icons/ArrowRight.svg) no-repeat;
        width: 32px;
        height: 32px;
        float: right;
    }
    .collapse .top-arrow {
        transform: rotate(-90deg);
    }
    .collapse .m-minus-8 {
        margin-top: -8px;
    }
    .voucher-icon-transform {
        transform: translateY(-4px);
    }
    .progress-state {
        background-color: #fff;
        height: 64px;
        display: flex;
    }
    .progress-state .progress-item {
        width: 33.33333%;
        position: relative;
        text-align: center;
        font-weight: 700;
        color: #695787;
    }
    .progress-state .progress-item.disable-inactive-label {
        color: #999;
    }
    .progress-state .progress-item.active,
    .progress-state .progress-item.success {
        color: #695787;
    }
    .progress-state .progress-item:first-child:after {
        content: none;
    }
    .progress-state .progress-item.active:after,
    .progress-state .progress-item.success:after {
        background-color: #fff;
    }
    .progress-state .progress-item.active:before,
    .progress-state .progress-item.success:before {
        border: 2px solid #fff;
    }
    .progress-state .progress-item.success:before {
        content: url(../../static/images/icons/Commerce/check-circle.svg);
        border: none;
    }
    .progress-state .progress-item.active:before {
        content: url(../../static/images/icons/Commerce/dot-select.svg);
        border: none;
    }
    .progress-state .progress-item:before {
        content: "";
        width: 14px;
        height: 14px;
        line-height: 14px;
        border-radius: 50%;
        display: block;
        margin: 10px auto 4px;
        border: 2px solid #b2b2b2;
        background: #fff;
        z-index: 1;
        position: relative;
    }
    .progress-state .progress-item:after {
        content: "";
        position: absolute;
        width: 100%;
        height: 2px;
        top: 16px;
        left: -50%;
        background-color: #b2b2b2;
    }
    .checkout-voucher-section {
        font-family: Modern Era;
        font-size: 12px;
        color: #6e6e6e;
        font-weight: 700;
        line-height: 14px;
        text-align: left;
    }
    .checkout-voucher-section ::placeholder {
        color: #b2b2b2;
        font-weight: 1;
    }
    .checkout-voucher-section .card-voucher {
        box-shadow: 0 1px 4px 0 rgba(72, 72, 99, 0.1);
    }
    .checkout-voucher-section .close-voucher-container {
        float: right;
        margin-right: 32px;
    }
    .checkout-voucher-section .close-voucher {
        position: absolute;
        float: right;
    }
    .checkout-voucher-section .form-voucher {
        border: 1px solid #f55;
        border-radius: 4px;
    }
    .checkout-voucher-section .input-voucher {
        width: calc(100% - 80px);
        color: #b2b2b2;
    }
    .checkout-voucher-section .input-voucher-text {
        width: 100%;
        outline: transparent;
        border: none;
        padding: 10px;
        color: #6e6e6e;
        font-size: 11px;
        font-weight: 700;
        height: 10px;
        margin-top: 8px;
    }
    .checkout-voucher-section .button {
        font-size: 11px;
        background-color: #f55;
        border-radius: 0 2px 2px 0;
        padding-top: 10px;
        width: 80px;
        height: 36px;
        color: #fff;
        font-weight: 400;
        line-height: 14px;
        text-align: center;
        cursor: pointer;
    }
    .checkout-address-section {
        font-family: Modern Era;
        font-size: 12px;
        color: #6e6e6e;
        line-height: 14px;
        text-align: left;
        font-weight: 700;
    }
    .checkout-address-section .address-info {
        width: calc(100% - 90px);
    }
    .checkout-address-section .address-detail {
        font-weight: 1;
        color: #b2b2b2;
    }
    .checkout-address-section .info {
        color: #b2b2b2;
        font-weight: 400;
        line-height: 16px;
    }
    .checkout-address-section .button {
        background-color: #f55;
        border-radius: 8px;
        width: 100%;
        height: 36px;
        color: #fff;
        font-weight: 400;
        line-height: 14px;
        text-align: center;
        padding-top: 10px;
        cursor: pointer;
    }
    .checkout-address-section .link {
        cursor: pointer;
        color: #f55;
        width: 90px;
    }
    .checkout-item-section {
        font-size: 12px;
        text-align: left;
        border-top: 8px solid #f5f5f5;
    }
    .checkout-item-section .item-section {
        border-top: 4px solid #ffcbcb;
    }
    .checkout-item-section .item-title {
        font-weight: 700;
    }
    .checkout-item-section .label-quantity {
        color: #6e6e6e;
        font-weight: 700;
        line-height: 16px;
    }
    .checkout-item-section .label-subtotal {
        color: #666;
        font-size: 14px;
        font-weight: 700;
        line-height: 16px;
    }
    .checkout-item-section .payment-method-title {
        color: #6e6e6e;
        font-weight: 700;
        line-height: 14px;
    }
    .checkout-item-section .payment-method-title.box {
        font-weight: 400;
        border: 1px solid #ebe6ef;
        border-radius: 4px;
    }
    .checkout-item-section .checkbox-title {
        color: #6e6e6e;
        font-weight: 700;
        line-height: 14px;
    }
    .checkout-item-section .address-warning {
        width: 100%;
        color: #999;
        font-size: 11px;
        font-weight: 400;
        line-height: 12px;
    }
    .checkout-item-section .total-section {
        border-top: 1px solid #f5f5f5;
    }
    .checkout-item-section .link {
        cursor: pointer;
        color: #f55;
        width: 90px;
    }
    .checkout-border-bottom {
        border-bottom: 1px solid #f5f5f5;
    }
    .float-right-center {
        float: right;
        margin-top: 6px;
    }
    .info-communicate {
        width: calc(100% - 18px);
        text-align: center;
        margin: auto;
    }
    .single-button-section {
        height: 64px;
        background-color: #f5f5f5;
        padding: 14px 16px;
    }
    .delete-image {
        position: absolute;
        right: 0;
    }
    .prod-bundle-container {
        width: calc(100% - 86px);
    }
    .prod-bundle-title {
        /*! autoprefixer: off */
        -webkit-box-orient: vertical;
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        width: 80%;
        color: #1a1a1a;
        font-size: 12px;
        line-height: 16px;
        font-weight: 700;
        padding-top: 4px;
    }
    .prod-bundle-qty {
        position: absolute;
        bottom: 20px;
        width: 100%;
        color: #6e6e6e;
        font-size: 12px;
        line-height: 16px;
    }
    .text-inner-elipsis-normal p {
        /*! autoprefixer: off */
        -webkit-box-orient: vertical;
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 5;
    }
    .text-inner-elipsis p {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .voucher-ellispis-container {
        max-width: calc(100% - 16px);
    }
    .voucher-button {
        border: 1px solid #ebe6ef;
        border-radius: 4px;
    }
    .voucher-button-ellipsis {
        width: calc(100% - 32px);
    }
    .general-ellipsis-text {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .search-address-box {
        width: 100%;
        height: 32px;
    }
    .search-address-box input {
        color: #444;
        font-size: 11px;
        letter-spacing: 0.5px;
        line-height: 16px;
    }
    .search-address-box.border {
        border: 1px solid #eee;
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.5);
    }
    .search-address-box.border-bottom {
        border-bottom: 1px solid #ebe6ef !important;
    }
    .close-circle-grey {
        background-image: url(close-circle-grey.svg);
        width: 24px;
        height: 24px;
        margin-top: 4px;
    }
    .translateX-left-8 {
        transform: translateX(-8px);
    }
    .close-grey-modal {
        background-image: url(close1.svg);
        width: 32px;
        height: 32px;
    }
    .search-icon-input {
        background-image: url(search.svg);
        width: 24px;
        height: 24px;
    }
    .height-48 {
        height: 48px;
    }
    .list-suggestion-select {
        height: 1px;
        position: fixed;
        min-height: calc(100% - 1px);
        overflow-y: scroll;
        padding-bottom: 169px;
        width: 100vw;
        max-width: 484px;
    }
    .translateY-up-66 {
        transform: translateY(-66px);
    }
    .location-marked-address {
        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
        background-color: #fff;
        border-radius: 50%;
        width: 32px;
        height: 32px;
    }
    .location-marked-address .text-location-marked {
        color: #7878a5;
        font-family: Chivo;
        font-size: 10px;
        font-weight: 400;
        line-height: 16px;
        text-align: center;
    }
    .address-container-2 {
        background-color: #fff !important;
        font-family: Modern Era;
    }

    .address-container-2 .commerce-address {
        transform: translateX(-8px);
        margin-top: 2px;
    }
    .address-container-2::-webkit-scrollbar {
        width: 0;
        height: 0;
    }
    .address-container-2 .save-button {
        border: 0;
        background-color: #f55;
        border-radius: 8px;
        width: 100%;
        height: 36px;
        color: #fff;
        font-size: 12px;
        font-weight: 400;
        line-height: 14px;
        text-align: center;
        outline: 0;
    }
    .address-container-2 .disabled-button {
        background-color: #b2b2b2 !important;
        border: 1px solid #b2b2b2 !important;
        color: #fff !important;
        font-weight: 700;
    }
    .address-container-2 .bottom-arrow {
        background-image: url(ArrowRight.svg);
        width: 32px;
        height: 28px;
        float: right;
        transform: rotate(90deg);
    }
    .address-container-2 .label {
        color: #6e6e6e;
        font-size: 12px;
        font-weight: 700;
        line-height: 14px;
        text-align: left;
        outline: 0;
        resize: none;
    }
    .address-container-2 .label.placeholder {
        color: #444;
        font-weight: 400;
    }
    .address-container-2 .label.placeholder::placeholder {
        color: #cac4d1;
    }
    .address-container-2 .label.address-textarea {
        padding-top: 8px;
        height: 64px;
    }
    .address-container-2 .address-modal {
        border: 1px solid #eee;
        border-radius: 4px;
        width: 100%;
        height: 32px;
    }
    .address-container-2 .google-maps {
        width: 100%;
        color: transparent;
    }
    .maps-current-location {
        right: 16px;
    }
    @media screen and (max-width: 375px) {
        .hide-less-375 {
            display: block !important;
        }
    }
    @media screen and (min-width: 376px) {
        .hide-more-376 {
            display: block !important;
        }
    }
    .address-container {
        background-color: #f5f5f5 !important;
        height: 100%;
    }
    .address-item-section {
        font-family: Modern Era;
        font-size: 12px;
        font-weight: 400;
        line-height: 16px;
        text-align: left;
        background-color: #fff !important;
    }
    .address-item-section .top-section .top-action-info {
        color: #695787;
        border: 0.8px solid #695787;
        font-size: 9px;
        border-radius: 9px;
        width: 85px;
        height: 18px;
        text-align: center;
    }
    .address-item-section .title {
        font-weight: 800;
    }
    .address-item-section .detail,
    .address-item-section .title {
        color: #6e6e6e;
        font-size: 12px;
        line-height: 16px;
        text-align: left;
    }
    .address-item-section .detail {
        width: 100%;
        font-weight: 200;
    }
    .address-item-section .bottom-action {
        color: #f55;
        width: 100%;
        border-bottom: 8px solid #f5f5f5;
        text-align: center;
        font-weight: 600;
        cursor: pointer;
    }
    .address-border-bottom {
        border-bottom: 1px solid #eee;
    }
    .overflow-y {
        overflow-y: scroll;
    }
    .address-footer-section {
        position: fixed;
        bottom: 0;
        background-color: #fff;
        width: 100%;
        height: 68px;
    }
    .address-footer-section .footer-address-action {
        background-color: #f55;
        border-radius: 8px;
        width: 100%;
        height: 36px;
        text-align: center;
        padding-top: 4px;
        cursor: pointer;
    }
    .address-footer-section .footer-address-action .label {
        color: #fff;
        font-size: 12px;
        font-weight: 400;
        line-height: 14px;
    }
    .search-result-recomendation-section .text {
        color: #1a1a1a;
        font-family: Modern Era;
        font-size: 12px;
        line-height: 14px;
        cursor: pointer;
    }
    .brand-section {
        font-family: Modern Era;
        overflow-x: auto;
    }
    .brand-section .brand-container {
        background-color: #fff;
        border-radius: 4px;
        box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2);
        width: 70px;
        height: 48px;
        cursor: pointer;
    }
    .brand-section .brand-text {
        color: #6e6e6e;
        font-size: 9px;
        font-weight: 400;
        line-height: 12px;
        text-align: center;
    }
    .brand-section .image-fit {
        object-fit: contain;
    }
    .filter {
        font-family: Modern Era;
    }
    .filter .middle {
        position: relative;
        width: 100%;
        max-width: 500px;
        height: 12px;
        margin-top: 22px;
    }
    .filter .slider {
        position: relative;
        z-index: 1;
        height: 4px;
        margin: 0 16px;
    }
    .filter .slider.fake {
        margin: 0;
        position: absolute;
        width: 100%;
    }
    .filter .slider .track {
        z-index: 1;
        background-color: #ddd;
    }
    .filter .slider .range,
    .filter .slider .track {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        border-radius: 5px;
    }
    .filter .slider .range {
        z-index: 2;
        background-color: #695787;
    }
    .filter .slider .thumb {
        position: absolute;
        z-index: 3;
        width: 16px;
        height: 16px;
        background-color: #fff;
        border-radius: 100%;
        box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2);
    }
    .filter .slider .thumb.left {
        left: 0;
        transform: translate(-16px, -6px);
    }
    .filter .slider .thumb.right {
        right: 0;
        transform: translate(16px, -6px);
    }
    .filter input[type="range"] {
        position: absolute;
        pointer-events: none;
        -webkit-appearance: none;
        z-index: 2;
        height: 4px;
        width: 100%;
        opacity: 0;
    }
    .filter input[type="range"]::-webkit-slider-thumb {
        pointer-events: all;
        width: 16px;
        height: 16px;
        -webkit-appearance: none;
        background-color: red;
    }
    .filter input[type="range"]::-moz-range-thumb {
        pointer-events: all;
        width: 16px;
        height: 16px;
        background-color: red;
    }
    .filter .subtitle {
        color: #6e6e6e;
        font-size: 14px;
        font-weight: 700;
        line-height: 17px;
        text-align: left;
    }
    .filter .radio-button {
        padding-top: 20px;
        padding-bottom: 12px;
        border-bottom: 1px solid #f5f5f5;
    }
    .filter .radio-button:last-child {
        border-bottom: 0;
    }
    .filter .radio-button:first-child {
        padding-top: 16px;
    }
    .filter .placeholder {
        border: none;
        outline: none;
        background-color: transparent;
        font-family: Modern Era;
        font-size: 11px;
        letter-spacing: 0.5px;
        line-height: 16px;
        text-align: left;
        width: 100%;
    }
    .filter .text {
        font-size: 12px;
        font-weight: 700;
        line-height: 14px;
        text-align: left;
    }
    .filter .text.active {
        color: #966981;
    }
    .filter .text.inactive {
        color: #b2b2b2;
    }
    .filter .icon.active {
        background: url(../../static/images/icons/Commerce/dot-select.svg) no-repeat;
        width: 16px;
        height: 16px;
    }
    .filter .icon.inactive {
        background: url(../../static/images/icons/Commerce/dot-unselect.svg) no-repeat;
        width: 16px;
        height: 16px;
    }
    .filter .placeholder {
        color: #444;
        font-weight: 400;
    }
    .filter .placeholder::placeholder {
        color: #b2b2b2;
    }
    .faq-container {
        height: 100vh;
    }
    .faq-container,
    .faq-container .faq-section {
        background-color: #fff !important;
    }
    .faq-container .faq-section .title-body {
        font-weight: 700;
        line-height: 16px;
    }
    .faq-container .faq-section .title-link {
        font-weight: 400;
        line-height: 16px;
    }
    .faq-container .faq-section .title-question {
        font-weight: 700;
        line-height: 16px;
    }
    .faq-container .faq-section .number-question {
        background-color: #695787;
        border-radius: 100%;
        font-weight: 400;
        width: 20px;
        height: 20px;
        text-align: center;
    }
    .faq-container .faq-section .number-question .number {
        vertical-align: middle;
        padding-top: 3px;
    }
    .faq-container .faq-section .text-content {
        font-weight: 400;
        line-height: 16px;
    }
    .collapse-question .top-arrow {
        transform: rotate(-90deg);
    }
    .collapse-question .bottom-arrow,
    .collapse-question .top-arrow {
        background: url(../../../static/images/icons/ArrowRight.svg) no-repeat;
        width: 32px;
        height: 32px;
        float: right;
    }
    .collapse-question .bottom-arrow {
        transform: rotate(90deg);
    }
    .collapse-question .m-minus-8 {
        margin-top: -8px;
    }
    .box-shadow-container {
        filter: drop-shadow(2px 2px 4px rgba(0, 0, 0, 0.2));
    }
    .box-shadow-container .top-masking {
        mask-image: radial-gradient(circle at left top, transparent 0, transparent 8px, #000 0), radial-gradient(circle at right top, transparent 0, transparent 8px, #000 0);
        -webkit-mask-image: radial-gradient(circle at left top, transparent 0, transparent 8px, #000 0), radial-gradient(circle at right top, transparent 0, transparent 8px, #000 0);
        mask-composite: intersect;
        -webkit-mask-composite: destination-in;
    }
    .box-shadow-container .bottom-masking {
        mask-image: radial-gradient(circle at left bottom, transparent 0, transparent 8px, #000 0), radial-gradient(circle at right bottom, transparent 0, transparent 8px, #000 0);
        -webkit-mask-image: radial-gradient(circle at left bottom, transparent 0, transparent 8px, #000 0), radial-gradient(circle at right bottom, transparent 0, transparent 8px, #000 0);
        mask-composite: intersect;
        -webkit-mask-composite: destination-in;
    }
    .width-special {
        max-width: calc(50% - 70px);
    }
    .voucher-section-home {
        padding-left: 28px;
        align-items: center;
        flex: 1;
        flex-direction: row;
        border-left: 1px solid #9c97a3;
    }
    @media (max-width: 320px) {
        .voucher-section-home {
            padding-left: 12px;
        }
    }
    .voucher-card-content {
        justify-content: center;
    }
    .voucher-border {
        border-top: 1px solid rgba(0, 0, 0, 0.1);
    }
    .with-shadow {
        box-shadow: 0 -2px 4px 0 rgba(0, 0, 0, 0.1);
    }
    .card-banner {
        height: 44.52vw;
        max-height: 223px;
        object-fit: cover;
    }
    .detail-banner {
        max-height: 256px;
        object-fit: cover;
    }
    .promo-terms ol {
        margin: 0;
        padding-left: 16px;
        padding-top: 8px;
    }
    .promo-terms ol li {
        padding-left: 8px;
        padding-bottom: 16px;
    }
    .promo-card-desc p {
        display: none;
    }
    .promo-card-desc p:first-child {
        display: block;
    }
    .promotion-section {
        margin-top: -16px;
    }
    .promotion-section .bundle-promotion-header {
        border-top: 1px solid #ebe6ef;
        padding-top: 16px;
    }
    .promotion-section .collapse .top-arrow {
        transform: rotate(-90deg);
    }
    .promotion-section .collapse .bottom-arrow,
    .promotion-section .collapse .top-arrow {
        background: url(ArrowRight.svg) no-repeat;
        width: 32px;
        height: 32px;
        float: right;
    }
    .promotion-section .collapse .bottom-arrow {
        transform: rotate(90deg);
        position: unset;
    }
    .promotion-section .collapse .m-minus-8 {
        margin-top: -8px;
    }
    .promotion-section .product-card-list {
        margin-bottom: 16px;
        padding-bottom: 16px;
        border-bottom: 1px solid #f5f5f5;
    }
    .promotion-section .product-card-list:last-child {
        border: none;
        padding-bottom: 0;
        margin-bottom: 0;
    }
    .promotion-section .product-card-list .product-information {
        position: relative;
        width: calc(100% - 96px);
    }
    .promotion-section .product-card-list .product-information .bottom-text {
        position: absolute;
        bottom: 2px;
        width: 100%;
    }
    .bundle-section {
        overflow-x: auto;
        height: 160px;
    }
    .bundle-section .image-container {
        background-color: #fff;
        border-radius: 4px;
        box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2);
        width: 112px;
        height: 112px;
        margin-right: 8px;
        margin-top: 1px;
        margin-left: 1px;
    }
    .bundle-section .image-fit {
        object-fit: contain;
    }
    .email-capture {
        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
        border-radius: 8px;
    }
    .email-capture .email-button {
        border: 1px solid #f55;
        border-radius: 8px;
        width: 97px;
        height: 40px;
        color: #f55;
    }
    .modal-email-capture .justify-center {
        justify-content: center;
    }
    .modal-email-capture .input-container {
        border: 1px solid #ebe6ef;
        border-radius: 4px;
        height: 32px;
    }
    .modal-email-capture .button-enable {
        border-radius: 8px;
        width: 73px;
        height: 40px;
        background-color: #f55;
    }
    .modal-email-capture .button-disable {
        border-radius: 8px;
        width: 73px;
        height: 40px;
        background-color: #cac4d1;
    }
    .wishlist-information {
        width: calc(100% - 86px);
    }
    .wishlist-information .title-wishlist-information {
        width: calc(100% - 96px);
    }
    .wishlist-information .price-wishlist-information {
        align-self: flex-end;
    }
    .image-shadow {
        box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2);
    }
    .wishlist-position {
        cursor: pointer;
        position: absolute;
        bottom: 8px;
        right: 16px;
        padding: 12px;
        border-radius: 50%;
        z-index: 9;
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
        background-color: #fff;
    }
    .wishlist-position.tile-wishlist {
        bottom: 10px;
        right: 8px;
    }
    .points-section-home {
        flex: 1;
        align-items: center;
    }

    @media (max-width: 280px) {
        .point-card {
            padding: 16px !important;
        }
    }
    @media (max-width: 320px) {
        .point-card .card-text {
            font-size: 11px !important;
        }
        .point-card .point-section {
            margin-top: 12px !important;
            margin-bottom: 14px !important;
        }
    }
    @media (min-width: 360px) {
        .point-card {
            background-size: 468px auto;
        }
    }
    .point-tab-bar {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
        height: 32px;
        border-radius: 34px;
        background-color: #ebe6ef;
        box-shadow: inset 0 1px 4px rgba(25, 17, 48, 0.1);
    }
    .point-tab-bar .point-tab-item {
        cursor: pointer;
        display: flex;
        flex: 1;
        margin: 4px;
        align-items: center;
        justify-content: center;
    }
    .point-tab-bar .active {
        height: 24px;
        border-radius: 34px;
        background-color: #fff;
        box-shadow: 1px 1px 14px rgba(0, 0, 0, 0.1);
    }
    .point-history-item {
        background-color: #fff;
        margin-bottom: 8px;
        padding: 12px 16px;
        display: flex;
        flex-direction: row;
        cursor: pointer;
    }
    .point-history-item .detail-section {
        display: flex;
        flex-direction: column;
        color: #6e6e6e !important;
        flex: 1;
    }
    .point-history-item .amount-section {
        display: flex;
        flex-direction: column;
        flex: 0.3;
        justify-content: flex-end;
        align-items: flex-end;
    }
    .point-faq .border-bottom {
        border-bottom: 1px solid #ebe6ef;
    }
    .point-faq .border-top {
        border-top: 1px solid #ebe6ef;
    }
    .empty-illust-container {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        height: 90vh;
    }
    .empty-illust-container.with-flex-1 {
        height: auto !important;
        flex: 1;
    }
    .store-avatar {
        border-radius: 50% !important;
    }
    .store-tag-info:not(:last-child) {
        border-right: 1px solid #f5f5f5;
    }
    .catalog-product-selection:not(:last-child) {
        border-bottom: 1px solid #f5f5f5;
    }
    .catalog-product-selection .className-number-picker {
        height: auto !important;
    }
    .catalog-product-selection .product-image-wrapper {
        height: 69px;
        width: 69px;
    }
    .catalog-product-selection img.disabled {
        filter: opacity(0.3);
    }
    .catalog-product-selection .btn-grey-default {
        background-color: #cac4d1 !important;
        border-color: #cac4d1 !important;
    }
    .catalog-banner.onload {
        min-height: 66px;
    }
    .catalog-banner img {
        max-height: 66px !important;
        object-fit: cover;
    }
    @media (min-width: 375px) {
        .catalog-banner img {
            max-height: 80px !important;
        }
    }
    @media (min-width: 500px) {
        .catalog-banner img {
            max-height: 94px !important;
        }
    }
    .other-store .store-item:not(:last-child) > a > div {
        border-bottom: 0.8px solid #ebebeb;
    }
    .shipping-location {
        cursor: pointer;
        height: 48px;
    }
    .express-mart-content-section {
        margin-top: -10px;
        border-bottom-left-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }
    .express-mart-content-section .homepage-banner {
        min-height: 82px;
    }
    .card.flat-store {
        width: 125px;
        height: 100%;
    }
    .card.flat-store .store-img {
        width: 100%;
        height: 125px;
    }
    .card.flat-store .store-img img {
        object-fit: cover;
        border-bottom-left-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }
    .card.flat-store .store-img .badge-simple {
        bottom: 6px;
        left: 6px;
    }
    .list-store .store-img {
        width: 70px;
        height: 70px;
        text-align: center;
    }
    .list-store .store-img img {
        object-fit: cover;
    }
    .express-homepage-header {
        background-repeat: no-repeat;
        background-size: 100%;
    }
    .full-width-search-bar {
        width: calc(100% - 50px);
    }
    .onboarding-content-wrapper {
        padding: 0 8px;
        margin: 0 auto;
        min-height: 100vh;
    }
    @media (min-width: 320px) {
        .onboarding-content-wrapper {
            padding: 48px 48px 83px !important;
        }
    }
    @media (min-width: 360px) {
        .onboarding-content-wrapper {
            padding: 80px 32px 32px !important;
        }
    }
    @media (min-width: 375px) {
        .onboarding-content-wrapper {
            padding: 48px 32px 32px !important;
        }
    }
    .onboarding-content-wrapper .img {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 200px;
    }
    @media (min-width: 375px) {
        .onboarding-content-wrapper .img {
            min-width: 264px;
        }
    }
    @media (min-width: 500px) {
        .onboarding-content-wrapper .img {
            min-width: 338px;
        }
    }
    .onboarding-content-wrapper .title {
        color: #695787;
        font-family: Modern Era Bold, sans-serif;
        font-size: 20px;
        font-weight: 600;
        line-height: 24px;
        margin-top: 73px;
    }
    @media (min-width: 320px) {
        .onboarding-content-wrapper .title {
            margin-top: 27px;
        }
    }
    @media (max-width: 359.98px) {
        .onboarding-content-wrapper .title {
            font-size: 15px;
            line-height: 16px;
        }
    }
    @media (min-width: 360px) {
        .onboarding-content-wrapper .title {
            margin-top: 29px;
        }
    }
    @media (min-width: 375px) {
        .onboarding-content-wrapper .title {
            margin: 29px 32px 0;
        }
    }
    .onboarding-content-wrapper .caption {
        color: #605c66;
        font-family: Modern Era, sans-serif;
        font-size: 12px;
        font-weight: 400;
        line-height: 16px;
        margin: 29px 17px 26px;
    }
    @media (max-width: 359.98px) {
        .onboarding-content-wrapper .caption {
            font-size: 10px;
            line-height: 16px;
        }
    }
    @media (min-width: 320px) {
        .onboarding-content-wrapper .caption {
            margin: 17px 0;
        }
    }
    @media (min-width: 360px) {
        .onboarding-content-wrapper .caption {
            margin: 23px 0;
        }
    }
    @media (min-width: 375px) {
        .onboarding-content-wrapper .caption {
            margin: 23px 48px;
        }
    }
    @media (min-width: 500px) {
        .onboarding-content-wrapper .caption {
            margin: 23px 76px;
        }
    }
    @media (min-width: 375px) {
        .onboarding-content-wrapper .onboarding-pagination-wrapper {
            margin: 0 76px;
        }
    }
    .onboarding-content-wrapper .onboarding-pagination-wrapper .pagination-thumb {
        width: 8px;
        height: 8px;
        border: 2px solid #695787;
        border-radius: 100%;
        display: inline-block;
        background: #fff;
        margin-right: 8px;
        cursor: pointer;
    }
    .onboarding-content-wrapper .onboarding-pagination-wrapper .pagination-thumb.active {
        background: #695787;
    }
    .onboarding-content-wrapper .onboarding-button-wrapper {
        display: flex;
        justify-content: center;
    }
    .onboarding-content-wrapper .onboarding-button-wrapper .onboarding-button {
        width: 100%;
        height: 40px;
        max-width: 500px;
    }
    @media (min-width: 360px) {
        .onboarding-content-wrapper .onboarding-button-wrapper .onboarding-button {
            position: relative;
        }
    }
    .modal-product-info .modal-container {
        overflow-x: hidden !important;
    }
    .modal-product-info .header {
        left: 0;
    }
    .modal-product-info .product-info .product-desc p {
        margin-bottom: 4px;
    }
    .modal-product-info .slider-container {
        height: 360px;
    }
    .modal-product-info .slider-container .swiper-wrapper img {
        cursor: auto !important;
        height: 360px;
        object-fit: contain;
        padding: 30px 35px;
    }
    .modal-product-info .slider-container .swiper-pagination {
        background: none;
    }
    .modal-product-info .slider-container .swiper-pagination .swiper-pagination-bullet {
        border: 2px solid #695787;
    }
    .modal-product-info .slider-container .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
        background-color: #695787 !important;
    }
    .modal-product-info .float-tools {
        bottom: 0;
        width: 100%;
    }
    .modal-product-info .className-number-picker {
        height: auto;
    }
    .modal-product-info .btn-grey-default {
        background-color: #cac4d1 !important;
        border-color: #cac4d1 !important;
    }
    .exmart-modal-store-info .modal-container {
        padding: 0 !important;
    }
    .exmart-modal-store-info .modal-container .modal-location .map-link {
        background: hsla(0, 1%, 52%, 0.5);
        right: 16px;
        bottom: 24px;
    }
    .exmart-modal-store-info .modal-container .modal-location .map-container {
        position: absolute;
        pointer-events: none;
        z-index: -1;
        width: 100%;
        top: 0;
    }
    .exmart-modal-store-info .modal-container .modal-location .map-store-name {
        text-shadow: 0 0 0.5px #605c66;
        top: calc(50% - 16px);
        left: calc(50% + 12px);
    }
    .exmart-modal-store-info .modal-container .modal-operational .hours-item {
        text-transform: uppercase;
        border-radius: 4px;
    }
    .exmart-modal-store-info .modal-container .modal-shipping .ship-method-img {
        width: 60px;
        height: 40px;
    }
    .modal-container .modal-list-screen {
        overflow: auto;
    }
    @media (min-height: 500px) {
        .modal-container .modal-list-screen {
            height: 70vh;
        }
    }
    @media (min-height: 660px) {
        .modal-container .modal-list-screen {
            height: 67vh;
        }
    }
    @media (min-height: 730px) {
        .modal-container .modal-list-screen {
            height: 62vh;
        }
    }
    @media (min-height: 812px) {
        .modal-container .modal-list-screen {
            height: 57vh;
        }
    }
    @media (min-width: 500px) {
        .modal-container .modal-list-screen {
            height: 60vh;
        }
    }
    @media (min-width: 1024px) and (min-height: 1366px) {
        .modal-container .modal-list-screen {
            height: 80vh;
        }
    }
    .confirmation-alert-shipping .modal-container {
        padding: 0 !important;
        border-radius: 8px !important;
    }
    .confirmation-alert-shipping .card {
        background-color: #fff;
        border-radius: 10px;
        margin-bottom: 16px;
        box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.2);
    }
    .confirmation-alert-shipping .card.card-header {
        border-radius: 0 0 10px 10px;
        box-shadow: unset;
    }
    .confirmation-alert-shipping .card .header-card {
        border-bottom: 1px solid #eee;
    }
    .confirmation-alert-shipping .card .footer {
        display: flex;
        border-top: 1px solid #eee;
        margin-bottom: 0 !important;
    }
    .confirmation-alert-shipping .card .footer span {
        width: 50%;
    }
    .express-mart.checkout-item-section .className-number-picker {
        height: auto !important;
    }
    .express-mart.checkout-item-section .className-number-picker .text-number-picker {
        width: 32px !important;
        border-bottom: 1px solid #ebebeb !important;
    }
    .express-mart.checkout-item-section img.disabled {
        filter: opacity(0.3);
    }
    .express-mart.checkout-item-section .btn-grey-default {
        background-color: #cac4d1 !important;
        border-color: #cac4d1 !important;
    }
    .picker-container .picker-inner {
        position: relative;
        display: flex;
        justify-content: center;
        height: 100%;
        -webkit-mask-box-image: linear-gradient(0deg, transparent, transparent 5%, #fff 20%, #fff 80%, transparent 95%, transparent);
    }
    .picker-container .picker-column {
        flex: 1 1;
        position: relative;
        max-height: 100%;
        overflow: hidden;
        text-align: center;
    }
    .picker-container .picker-column .picker-scroller {
        transition: 0.2s;
        transition-timing-function: ease-out;
    }
    .picker-container .picker-column .picker-item {
        position: relative;
        white-space: nowrap;
        color: #cac4d1;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .picker-container .picker-column .picker-item.picker-item-selected {
        color: #695787;
        font-size: 16px;
    }
    .picker-container .picker-highlight {
        position: absolute;
        top: 50%;
        left: 0;
        width: 100%;
        pointer-events: none;
    }
    .picker-container .picker-highlight:after,
    .picker-container .picker-highlight:before {
        content: " ";
        position: absolute;
        left: 0;
        right: auto;
        display: block;
        width: 100%;
        height: 1px;
        background-color: #cac4d1;
        transform: scaleY(0.5);
    }
    .picker-container .picker-highlight:before {
        top: 0;
        bottom: auto;
    }
    .picker-container .picker-highlight:after {
        bottom: 0;
        top: auto;
    }
    .picker-modal .modal-container {
        max-width: calc(100% - 110px);
    }
    .picker-modal .picker-title {
        color: #605c66;
        padding: 17px 30px 11px;
        border-bottom: 1px solid #ebe6ef;
    }
    .btn-tag {
        flex: none;
        background-color: #fff;
        border: 1px solid #f55;
        border-radius: 13px;
        color: #f55;
        font-size: 10px;
        font-weight: 400;
        line-height: 12px;
        text-align: left;
        cursor: pointer;
    }
    .btn-tag.active {
        background-color: #f55;
        color: #fff !important;
    }
    .btn-tag.tag-commerce {
        border-color: #695787;
    }
    .border-radius-0 {
        border-radius: 0 !important;
    }
    .border-radius-4 {
        border-radius: 4px !important;
    }
    .border-radius-8 {
        border-radius: 8px !important;
    }
    .border-radius-12 {
        border-radius: 12px !important;
    }
    .border-radius-16 {
        border-radius: 16px !important;
    }
    .border-radius-rounded {
        border-radius: 50% !important;
    }
    .badge {
        border-radius: 4px;
        height: auto;
    }
    .badge .badge-wrapper {
        background-color: hsla(0, 0%, 100%, 0.5);
    }
    .badge .image {
        width: 24px;
        height: 24px !important;
    }
    .badge,
    .badge span {
        display: inline-block;
    }
    .badge .badge-head {
        margin: 0;
        border-radius: 4px 0 0 4px;
        height: 100%;
    }
    .badge .badge-text {
        margin: 0;
        border-radius: 0 4px 4px 0;
    }
    .badge.rounded .badge-head,
    .header .badge.search-bar .badge-head {
        border-radius: 50%;
    }
    .badge.rounded,
    .badge.rounded .badge-text,
    .badge.rounded .badge-wrapper,
    .header .badge.search-bar,
    .header .badge.search-bar .badge-text,
    .header .badge.search-bar .badge-wrapper {
        border-radius: 24px !important;
    }
    .badge-simple {
        display: inline-block;
        border-radius: 16pt;
    }
    .icon-wrapper {
        overflow: hidden;
    }
    .header .icon-wrapper.search-bar,
    .icon-wrapper.rounded {
        border-radius: 100% !important;
    }
    .icon-wrapper.transparent {
        background-color: transparent !important;
    }
    .float-wrapper {
        position: fixed;
        bottom: 0;
        width: 100%;
        max-width: 500px;
        z-index: 1;
        pointer-events: none;
    }
    .float-btn {
        position: relative;
        overflow: hidden;
        border-radius: 7px;
        width: 328px;
        height: 40px;
        align-self: center;
        background: #f55;
        animation: d 0.5s;
        pointer-events: visible;
    }
    .float-btn .border-left-white {
        border-left: 1px solid #fff;
    }
    .float-btn .left-side {
        flex: 4;
    }
    .float-btn .right-side {
        flex: 0.75;
    }
    .cart-footer {
        bottom: 0;
        position: fixed;
        box-shadow: 0 0 4px 0 rgba(27, 24, 24, 0.1);
        width: 100%;
        max-width: 500px;
        max-height: 85px;
        z-index: 10;
    }
    .cart-footer .cart-footer-main-section {
        width: 100%;
        border-top: 1px solid #f5f6f8;
    }
    @keyframes d {
        0% {
            bottom: -100px;
        }
        to {
            bottom: 0;
        }
    }
    .tabs .tabs-switch {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 4px;
        border: 0.8px solid #e7e8eb;
    }
    .tabs .tabs-switch,
    .tabs .tabs-switch .tab-option {
        border-radius: 34px;
        background-color: #f5f6f8;
        text-align: center;
    }
    .tabs .tabs-switch .tab-option {
        flex: 1;
        display: flex;
        justify-content: center;
        align-items: center;
        min-height: 26px;
        font-size: 10px;
        border: none;
        cursor: pointer;
    }
    .tabs .tabs-switch .tab-option.active {
        box-shadow: 0.1px 0.1px 1px 0 rgba(0, 0, 0, 0.5);
        background-color: #fff;
    }
    .tabs .tabs-content {
        display: grid;
        grid-template-columns: 1fr;
    }
    .tabs .tabs-content div[class^="tab-"] {
        grid-row-start: 1;
        grid-column-start: 1;
        visibility: hidden;
        width: 100%;
        opacity: 0;
        transition: opacity 0.5s ease-in-out;
    }
    .tabs .tabs-content div[class^="tab-"].active {
        opacity: 1;
        visibility: visible;
    }
    .tabs.tab-nogrid .tabs-content {
        display: block;
    }
    .tabs.tab-nogrid .tabs-content div[class^="tab-"] {
        display: none;
        width: 100%;
        animation: e 0.5s ease-in-out;
    }
    .tabs.tab-nogrid .tabs-content div[class^="tab-"].active {
        display: inherit;
    }
    @keyframes e {
        0% {
            opacity: 0;
        }
        to {
            opacity: 1;
        }
    }
    .hs-wrapper {
        width: 100%;
    }
    .hs-wrapper .hs-title {
        max-width: 328px;
    }
    @media (max-width: 359.98px) {
        .hs-wrapper .hs-title {
            max-width: 300px;
        }
    }
    .hs-wrapper .hs-cardlist {
        overflow-x: auto;
        overflow-y: hidden;
    }
    .hs-wrapper .hs-cardlist .hs-carditem {
        flex: 0 0 auto;
    }
    ol .no-margin {
        margin-left: -32px;
    }
    ol.list-parenting {
        counter-reset: a;
        list-style: none;
    }
    ol.list-parenting *,
    ol.list-parenting :after,
    ol.list-parenting :before {
        box-sizing: border-box;
    }
    ol.list-parenting li {
        counter-increment: a;
        padding-bottom: 10px;
        margin-left: 32px;
    }
    ol.list-parenting li:before {
        color: #fff;
        background-color: #836476;
        border-radius: 24px;
        content: counter(a);
        display: inline-block;
        text-align: center;
        position: relative;
        margin-left: -32px;
        margin-right: 12px;
        width: 20px;
        height: 20px;
        padding: 3px 6px;
    }
    ol.list-parenting.commerce li:before {
        background-color: #695787 !important;
    }
    ol.list-parenting.transparent li {
        margin-left: 24px;
    }
    ol.list-parenting.transparent li:before {
        background-color: transparent !important;
        color: #666 !important;
        padding: 3px !important;
        text-align: left;
        content: counter(a) ".";
        margin-left: -20px;
        margin-right: 0 !important;
    }
    .className-number-picker {
        height: 51px;
    }
    .className-number-picker .title-number-picker {
        font-size: 10px;
        line-height: 16px;
        letter-spacing: 3px;
        font-weight: 400;
        font-family: Asap, sans-serif;
        color: #666;
    }
    .className-number-picker .button-number-picker {
        min-width: 20px;
        height: 20px;
        justify-content: center;
        padding: 0;
        border: none;
        border-radius: 100%;
        line-height: 20px;
    }
    .className-number-picker .text-number-picker {
        margin: 0 16px;
        border: none;
        border-bottom: 1px solid #ffa2a2;
        width: 20px;
        text-align: center;
        outline: none;
        font-size: 14px;
        font-weight: 300;
        letter-spacing: 0.55px;
        line-height: 16px;
        color: #666;
    }
    .referral-steps {
        background-color: #fff;
        display: flex;
    }
    .referral-steps .step-item {
        width: 33.33333%;
        position: relative;
        text-align: center;
        font-weight: 700;
        color: #605c66;
    }
    .referral-steps .step-item.disable-inactive-label {
        color: #999;
    }
    .referral-steps .step-item:first-child:after {
        content: none;
    }
    .referral-steps .step-item.step-1:before {
        content: "1";
    }
    .referral-steps .step-item.step-2:before {
        content: "2";
    }
    .referral-steps .step-item.step-3:before {
        content: "3";
    }
    .referral-steps .step-item:before {
        content: "";
        width: 24px;
        height: 24px;
        border-radius: 50%;
        display: block;
        margin: 0 auto 16px;
        border: 2px solid #695787;
        background: #695787;
        z-index: 1;
        position: relative;
        color: #fff;
        font-size: 16px;
        line-height: 24px;
        font-weight: 600;
        border: none;
        vertical-align: middle;
        text-align: center;
    }
    .referral-steps .step-item:after {
        content: "";
        position: absolute;
        width: 100%;
        height: 0;
        top: 12px;
        left: -50%;
        border: 0;
        border-bottom: 2px solid #695787;
        border-style: dashed;
    }
    .referral-grid {
        display: grid;
        grid-template-columns: repeat(5, 48px);
        grid-row-gap: 14px;
        justify-content: space-between;
    }
    .referral-item {
        position: relative;
        display: flex;
        flex-direction: column;
        z-index: 500;
    }
    .referral-item .image {
        width: 48px;
        height: 48px;
        border-radius: 50%;
        border: 1px solid #9c97a3;
        background-color: #fff;
    }
    .referral-item .add,
    .referral-item .image {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .referral-item .add {
        position: absolute;
        top: 0;
        right: 0;
        width: 16px;
        height: 16px;
        border-radius: 50%;
        border: 2px solid #fa9;
        background: #fa9;
        z-index: 1;
        border: none;
        transform: rotate(45deg);
    }
    .grid-decoration {
        position: absolute;
        height: 0;
        border: 0;
        border-bottom: 1px solid #9c97a3;
        width: 100%;
        z-index: 400;
    }
    .grid-decoration.top {
        bottom: 225px;
    }
    .grid-decoration.bottom {
        bottom: 126px;
    }
    .ref-icon {
        left: 17px;
        width: 16px;
        height: 16px;
        background-color: #fff;
        z-index: 500;
    }
    .ref-line {
        width: 0;
        transform: translateX(8.5px);
        border: 0;
        border-right: 1px solid #9c97a3;
        z-index: 400;
    }
    .referral-notif-container {
        border-radius: 8px !important;
        width: 264px !important;
    }
    @keyframes f {
        0% {
            background-position: -468px 0;
        }
        to {
            background-position: 468px 0;
        }
    }
    .main-layout-commerce .loading:after {
        width: 100% !important;
        height: 100% !important;
        top: 0 !important;
        left: 0 !important;
        animation-duration: 2s !important;
        background-size: 500px 240px !important;
        background: linear-gradient(-70deg, #eee 8%, #cac4d1 18%, #eee 33%);
    }
    .card {
        background-color: #fff;
        z-index: 1;
        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.25);
        border-radius: 4px;
    }
    input[type="text"]:focus {
        outline: none;
    }
    input[type="number"]:focus,
    input[type="tel"]:focus,
    input[type="text"]:focus {
        border: 1px solid #9c97a3;
    }
    .z-index-1 {
        z-index: 1;
    }
    .z-index-2 {
        z-index: 2;
    }
    .z-index-9999 {
        z-index: 9999;
    }
    .z-index-99999 {
        z-index: 99999 !important;
    }
    .outline-0 {
        outline: 0;
    }
    .transparent-75 {
        background-color: rgba(0, 0, 0, 0.75) !important;
    }
    .button-height-36 {
        height: 36px;
        outline: 0;
        border: 0;
    }
    .initial-vertical-align {
        vertical-align: initial;
    }
    .middle-vertical-align {
        vertical-align: middle;
    }
    .top-large-rounded {
        border-radius: 16px 16px 0 0;
    }
    .bottom-vertical-align {
        vertical-align: bottom;
    }
    .header .search-bar,
    .rounded {
        border-radius: 8px !important;
    }
    .mini-rounded {
        border-radius: 4px !important;
    }
    .top-rounded {
        border-radius: 8px 8px 0 0 !important;
    }
    .top-mini-rounded {
        border-radius: 4px 4px 0 0 !important;
    }
    .right-mini-rounded {
        border-radius: 0 4px 4px 0 !important;
    }
    .flex-0-0-auto {
        flex: 0 0 auto;
    }
    .border-right {
        border-right: 1px solid #f5f5f5 !important;
    }
    .align-right {
        text-align: right !important;
    }
    .price,
    .prod-detail-title,
    .product-title {
        text-align: left !important;
    }
    .align-center {
        text-align: center !important;
    }
    .height-16 {
        height: 16px;
    }
    @media (max-width: 359.98px) {
        .height-16 {
            height: 8px;
        }
    }
    .height-56 {
        height: 56px;
    }
    .overflow-initial {
        overflow: initial !important;
    }
    .fixed-bottom {
        bottom: 0;
        position: fixed;
        width: 100%;
    }
    .fixed-bottom.max-width-500 {
        max-width: 500px;
    }
    .fixed-bottom.with-navbar {
        bottom: 56px !important;
    }
    .fixed-bottom.shadow {
        box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.1);
    }
    .absolute-bottom {
        bottom: 0;
        position: absolute;
        width: 100%;
    }
    .max-width-500 {
        max-width: 500px;
    }
    .min-height-100vh {
        min-height: 100vh;
    }
    .full-height {
        height: 100%;
    }
    .full-width {
        width: 100%;
    }
    .w-auto {
        width: auto !important;
    }
    .width-half {
        width: 50%;
    }
    .width-third {
        width: 33.33333%;
    }
    .tab-switcher {
        background: #fff;
        transform: translateY(-2px);
        position: sticky;
        z-index: 201;
        top: 47px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .tab-switcher .tab-indicator {
        position: absolute;
        height: 4px;
        border-radius: 4px 4px 0 0;
        background: #695787;
        bottom: 0;
    }
    .tab-switcher .tab-indicator.column-2 {
        width: calc(50% - 32px);
    }
    .tab-switcher .tab-transition {
        transition: all 0.3s cubic-bezier(0.33, 0.24, 0, 1.01);
    }
    .tab-switcher .tab-option {
        height: 100%;
        width: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        cursor: pointer;
        text-align: center;
    }
    .strikethrough {
        text-decoration: line-through !important;
    }
    .p-2-4 {
        padding: 2px 4px;
    }
    .p-3-10 {
        padding: 3px 10px;
    }
    .med-weight {
        font-weight: 700;
    }
    .image-fit-cover {
        object-fit: cover;
    }
    .image-fit-contain {
        object-fit: contain;
    }
    .top-1 {
        top: 1px;
    }
    .calc-42 {
        width: calc(100% - 42px);
    }
    .mid-auto {
        margin: 0 auto;
    }
    .no-user-select {
        -o-user-select: none;
        -webkit-user-drag: none;
    }
    .no-font-size {
        font-size: 0;
    }
    @media (max-width: 359.98px) {
        .col-2 {
            padding-left: 4px !important;
            padding-right: 4px !important;
        }
    }
    .horizontal-m-category {
        margin-left: 4px;
        margin-right: 4px;
    }
    @media (max-width: 359.98px) {
        .horizontal-m-category {
            margin-left: 6px;
            margin-right: 6px;
        }
    }
    @media (min-width: 411px) {
        .horizontal-m-category {
            margin-left: 8px;
            margin-right: 8px;
        }
    }
    .horizontal-m-sm {
        margin-left: 8px;
        margin-right: 8px;
    }
    @media (max-width: 359.98px) {
        .horizontal-m-sm {
            margin-left: 4px;
            margin-right: 4px;
        }
    }
    .horizontal-m-md {
        margin-left: 16px;
        margin-right: 16px;
    }
    @media (max-width: 359.98px) {
        .horizontal-m-md {
            margin-left: 8px;
            margin-right: 8px;
        }
    }
    .horizontal-p-md {
        padding-left: 16px;
        padding-right: 16px;
    }
    @media (max-width: 359.98px) {
        .horizontal-p-md {
            padding-left: 8px;
            padding-right: 8px;
        }
    }
    .left-m-md {
        margin-left: 16px;
    }
    @media (max-width: 359.98px) {
        .left-m-md {
            margin-left: 8px;
        }
    }
    .bottom-m-md {
        margin-bottom: 16px;
    }
    @media (max-width: 359.98px) {
        .bottom-m-md {
            margin-bottom: 8px;
        }
    }
    .bottom-p-md {
        padding-bottom: 16px;
    }
    @media (max-width: 359.98px) {
        .bottom-p-md {
            padding-bottom: 8px;
        }
    }
    .icon.loading {
        background-image: none;
    }
    .icon.loading:after {
        border-radius: 50%;
    }
    .full-corner-rounded {
        border-radius: 50px;
    }
    .border-dark-red {
        border: 1px solid #f55;
    }
    .border-red {
        border: 1px solid red !important;
    }
    .border-charcoal-400 {
        border: 1px solid #9c97a3 !important;
    }
    .half-grid {
        width: calc(50% - 8px);
    }
    @media (max-width: 359.98px) {
        .half-grid {
            width: calc(50% - 4px);
        }
    }
    .separator {
        background-color: #eee;
    }
    .with-thin-border-right {
        border-right: 1px solid #eee;
    }
    .with-thin-border-bottom {
        border-bottom: 1px solid #eee;
    }
    .with-thin-border-top {
        border-top: 1px solid #eee;
    }
    .with-thick-border-bottom {
        border-bottom: 10px solid #eee;
    }
    .justify-between {
        justify-content: space-between;
    }
    .flex-1 {
        flex: 1;
    }
    .flex-wrap {
        display: flex;
        flex-wrap: wrap;
    }
    .flex-wrap .item-container {
        position: relative;
        width: 50px;
        height: 50px;
        margin-right: 14px;
        box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2);
        border-radius: 4px;
    }
    .flex-wrap .item-container:last-child {
        margin-right: 0;
    }
    .translateY-up-8px {
        transform: translateY(-8px);
    }
    .translateY-up-14px {
        transform: translateY(-14px);
    }
    .translateY-up-32px {
        transform: translateY(-32px);
    }
    .translateY-up-56px {
        transform: translateY(-56px);
    }
    .translateY-up-100 {
        transform: translateY(-100%);
    }
    .is-modern-era-font {
        font-family: Modern Era;
    }
    .overlay-bottom-handler {
        height: 80px;
    }
    .mt-m-12 {
        margin-top: -12px;
    }
    .nostyle-ordered-list {
        list-style-type: none;
    }
    .category-list-card {
        position: relative;
    }
    .category-list-card p {
        width: 60px;
    }
    .category-list-card:last-child:after {
        content: "";
        width: 16px;
        height: 1px;
        position: absolute;
        left: 100%;
        top: 0;
    }
    @media (max-width: 359.98px) {
        .category-list-card:last-child:after {
            width: 8px;
        }
    }
    .breadcrumb-list {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        flex: 0 auto;
        flex-shrink: 1000;
        display: inline-block;
        position: relative;
        transition: transform 0.3s ease-in-out;
    }
    .breadcrumb-list.first-breadcrumb {
        flex: 0 0 auto;
        flex-shrink: 0.5;
    }
    .breadcrumb-list:last-child {
        flex: 1 0 auto !important;
        font-weight: 400;
    }
    .banner-srb {
        max-height: 245px;
        width: 100%;
        object-fit: cover;
    }
    .capitalized {
        text-transform: capitalize;
    }
    .banner-landing {
        object-fit: cover;
    }
    .loading-dots {
        position: relative;
    }
    .loading-dots:after {
        content: " .";
        animation: g 1s steps(5) infinite;
    }
    @keyframes g {
        0%,
        20% {
            color: transparent;
            text-shadow: 0.25em 0 0 transparent, 0.5em 0 0 transparent;
        }
        40% {
            color: #444;
            text-shadow: 0.25em 0 0 transparent, 0.5em 0 0 transparent;
        }
        60% {
            text-shadow: 0.25em 0 0 #444, 0.5em 0 0 transparent;
        }
        80%,
        to {
            text-shadow: 0.25em 0 0 #444, 0.5em 0 0 #444;
        }
    }
    .lower-index-navbar {
        z-index: 100 !important;
    }
    .underlined {
        text-decoration: underline;
    }
    .visibility-hidden {
        visibility: hidden !important;
    }
    .ellipsis-2 {
        /*! autoprefixer: off */
        -webkit-box-orient: vertical;
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 2;
    }
    .center-self {
        align-self: center;
    }
    .auto-line-break {
        white-space: pre-wrap;
        word-wrap: break-word;
    }

    .text.is-weight-light {
        font-weight: 300;
    }
    .text.is-weight-regular {
        font-weight: 400;
    }
    .text.is-weight-medium {
        font-weight: 600;
    }
    .picker-container .picker-column .picker-item.picker-item-selected,
    .picker-modal .picker-title,
    .price,
    .text.is-weight-bold {
        font-weight: 700;
    }
    .text.is-size-xxxxxsmall {
        font-size: 8px;
        line-height: 11px;
    }
    .text.is-size-xxxxsmall {
        font-size: 8px;
        line-height: 16px;
    }
    .text.is-size-xxxsmall {
        font-size: 10px;
        line-height: 12px;
    }
    .text.is-size-campaign-header {
        font-size: 14px;
        line-height: 17px;
    }
    .text.is-size-campaign-subheader {
        font-size: 11px;
        line-height: 13px;
    }
    .text.is-size-xxsmall {
        font-size: 10px;
        line-height: 16px;
    }
    .header .search-bar,
    .text.is-size-xsmall {
        font-size: 11px;
        line-height: 16px;
    }
    .onboarding-content-wrapper .onboarding-button-wrapper .onboarding-button,
    .picker-container .picker-inner,
    .text.is-size-small {
        font-size: 12px;
        line-height: 16px;
    }
    .picker-modal .picker-title,
    .text.is-size-body {
        font-size: 14px;
        line-height: 20px;
    }
    .text.is-size-h5 {
        font-size: 16px;
        line-height: 24px;
    }
    .text.is-size-h4 {
        font-size: 18px;
        line-height: 24px;
    }
    .text.is-size-h3 {
        font-size: 20px;
        line-height: 24px;
    }
    .text.is-size-h2 {
        font-size: 22px;
        line-height: 32px;
    }
    .text.is-size-large {
        font-size: 24px;
        line-height: 24px;
    }
    .text.is-size-mili {
        font-size: 8px;
        line-height: 10px;
    }
    .text.is-size-deci {
        font-size: 12px;
        line-height: 16px;
    }
    .text.is-size-alto {
        font-size: 12px;
        line-height: 14px;
    }
    .text.is-size-tons {
        font-size: 14px;
        line-height: 16px;
    }
    .text.is-size-sectons {
        font-size: 14px;
        line-height: 24px;
    }
    .text.is-size-xbase {
        font-size: 16px;
        line-height: 16px;
    }
    .text.is-size-base {
        font-size: 16px;
        line-height: 19px;
    }
    .text.is-size-kilo {
        font-size: 24px;
        line-height: 32px;
    }
    .text.is-spacing-nano {
        letter-spacing: 0.25px !important;
    }
    .header .search-bar,
    .text.is-spacing-mini {
        letter-spacing: 0.5px !important;
    }
    .text.is-spacing-micro {
        letter-spacing: 3px !important;
    }
    .confirmation-alert-shipping .card,
    .confirmation-alert-shipping .modal-container .modal-subtitle,
    .confirmation-alert-shipping .modal-container .modal-title,
    .text.is-font-modern-era {
        font-family: Modern Era, sans-serif !important;
    }
    .text.is-font-modern-era-bold {
        font-family: Modern Era Bold, sans-serif !important;
    }
    .cursor {
        cursor: pointer;
    }
    .not-allowed {
        cursor: not-allowed;
    }
    #nprogress .bar {
        background: #fa9;
    }
    #nprogress .peg {
        box-shadow: 0 0 10px #fa9, 0 0 5px #fa9;
    }
    .loading {
        position: relative;
        min-width: 30px;
        min-height: 10px;
        z-index: 0;
    }
    .loading:after {
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: 1;
        content: "";
        left: 0;
        top: 0;
        animation-duration: 1s;
        animation-fill-mode: forwards;
        animation-iteration-count: infinite;
        animation-name: f;
        animation-timing-function: linear;
        background: #f6f7f8;
        background: #eee;
        background: linear-gradient(90deg, #eee 8%, #cac4d1 18%, #eee 33%);
        background-size: 800px 104px;
    }
    .__floater__open {
        z-index: 1070 !important;
        max-width: 400px !important;
    }
    @media (max-width: 374.98px) {
        .__floater__open {
            max-width: 95% !important;
        }
    }
    .no-shadow {
        box-shadow: none !important;
    }
    .shadow-md {
        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1) !important;
    }
    .shadow-md-top {
        box-shadow: 0 -2px 4px 0 rgba(0, 0, 0, 0.1) !important;
    }
    .with-fixed-solid-header {
        padding-top: 48px;
    }
    .common-header {
        height: 48px;
        transition: top 0.3s;
        padding: 0;
        width: 100%;
        max-width: 500px;
        margin: auto;
    }
    .common-header .action-bar-title {
        color: #605c66;
    }
    .common-header .action-bar-title .title .isvg svg {
        width: 20px;
        height: 20px;
    }
    .common-header .container {
        padding: 8px;
        transition: background-color 0.3s;
        box-shadow: none;
    }
    .common-header .container.bg-transparent .action-bar-title {
        display: none;
    }
    .common-header .container.bg-transparent .show-title {
        display: block !important;
        color: #fff;
    }
    .common-header.fixed-header {
        position: fixed;
    }
    .common-header.hide-header {
        top: -48px;
    }
    .common-header .title {
        font-size: 16px;
        line-height: 24px;
    }
    .common-header .title.has-subtitle {
        font-size: 14px;
    }
    .common-header .subtitle {
        font-size: 12px;
        line-height: 16px;
    }
    .parenting-home-banner {
        height: 203px;
    }
    .parenting-home-banner img {
        object-fit: cover;
        height: 203px;
    }
    .express-mart-ads img {
        object-fit: cover;
        max-height: 140px;
    }
    @media screen and (min-width: 500px) {
        .parenting-home-banner,
        .parenting-home-banner img {
            height: 250px;
        }
        .express-mart-ads img {
            max-height: 190px;
        }
    }
    .comingsoon-modal {
        z-index: 9999;
    }
    .comingsoon-modal .modal-title {
        margin-top: 16px;
    }
    .comingsoon-modal .footer {
        cursor: pointer;
        margin-top: 16px !important;
        border-top: 1px solid #dee2e6;
        color: #f55;
        text-align: center;
    }
    .comingsoon-modal .footer span {
        padding: 8px 0;
        display: block;
        width: 100%;
    }
    .menu .disabled {
        cursor: not-allowed;
        opacity: 0.35;
    }
    .app-menu {
        background: #f55 !important;
        border: 1px solid transparent !important;
    }
    .app-menu.menu-badge {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 8px;
        top: 0;
        right: 18px;
        min-width: 20px !important;
        min-height: 20px !important;
    }
    .app-menu.menu-badge.small {
        right: 6px;
    }
    .menusection {
        margin-top: -44px;
        padding-bottom: 8px;
    }
    .menusection > .row > .card {
        padding-top: 12px;
    }
    .menusection .menulist-secondary {
        overflow-x: auto;
        padding: 12px 0 10px;
    }
    .menusection .menulist-secondary a:last-child {
        padding-right: 0.8rem !important;
    }
    .menusection .menuitem {
        width: 90px;
    }
    .menudrawer .menudrawer-list {
        height: 70vh;
        overflow: auto;
    }
    .menudrawer .menudrawer-list .menudrawer-item:not(:last-child) {
        border-bottom: 1px solid #f5f2f7;
    }
    .menudrawer .menudrawer-list .menudrawer-item:first-child {
        padding-top: 5px !important;
        padding-bottom: 1rem;
    }
    .menudrawer .caption-menu {
        margin: 0 16px !important;
    }
    .menudrawer .app-menu.menu-badge {
        right: -5px !important;
    }
    .rotate-arrow {
        transform: rotate(180deg);
    }
    .full-width {
        width: 100% !important;
    }
    .clamp-wrapper {
        width: 100%;
        position: relative !important;
    }
    .clamp-text {
        text-overflow: ellipsis;
        overflow: hidden;
        display: -webkit-box;
        /*! autoprefixer: off */
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
    }
    .clamp-2 {
        -webkit-line-clamp: 2;
    }
    .clamp-3 {
        -webkit-line-clamp: 3;
    }
    .ellipsis-text {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }
    .menu-badge {
        position: absolute;
        padding-top: 1px;
        top: 3px;
        right: 3px;
        font-size: 12px;
        color: #fff;
        border-radius: 8px;
        background: #ff6c6c;
        width: 10px;
        height: 10px;
        text-align: center;
        border: 2px solid #fff;
    }
    .card {
        border-radius: 8px;
        border: none;
    }
    .topic-card {
        width: 135px;
        background-color: #fff;
        border-radius: 10px;
        margin-bottom: 16px;
        box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.2);
    }
    .topic-card .card-image {
        width: 100%;
        height: 132px;
    }
    .topic-card .card-image img {
        height: 132px;
        width: 100%;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
        object-fit: cover;
    }
    .topic-card .card-content {
        height: auto;
        padding: 12px 8px;
        margin: 0;
    }
    .topic-card .card-content .topic-title {
        color: #605c66;
        font-family: Modern Era Bold, sans-serif;
        font-size: 16px;
        line-height: 24px;
        letter-spacing: 0.5px;
        text-align: left;
    }
    .topic-card .card-content .count-room {
        color: #695787;
        font-family: Modern Era, sans-serif;
        font-size: 12px;
        line-height: 16px;
        letter-spacing: 0.5px;
        text-align: left;
    }
    .horizontal-scroll {
        display: flex;
        overflow-x: auto;
    }
    .react-hint {
        padding: 10px;
        position: absolute;
        z-index: 9999;
        cursor: default;
        animation: 0.5s e;
    }
    .react-hint:after {
        top: 100%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        pointer-events: none;
        border-color: hsla(0, 0%, 100%, 0);
        border-top-color: #fff;
        border-width: 10px;
    }
    .react-hint:after,
    .react-hint:before {
        left: 50%;
        position: absolute;
        margin-left: -10px;
    }
    .react-hint:before {
        content: "";
        transform: rotate(45deg);
        width: 20px;
        height: 20px;
        bottom: 5px;
        z-index: -1;
        top: auto;
    }
    .react-hint:before {
        box-shadow: 0 2px 7px rgba(96, 92, 102, 0.25);
    }
    .hint-wrapper {
        cursor: pointer;
        border-radius: 50%;
        line-height: 12px;
        display: inline-block;
        width: 12px;
        height: 12px;
    }
    .alert {
        border-radius: 4px;
    }
    .alert .close {
        cursor: pointer;
        line-height: 1 !important;
    }
    .swipeableviews-container {
        position: relative;
    }
    .swipeableviews-container .swipe-view-pagination {
        position: absolute;
        width: 100%;
        height: 6px;
        bottom: 0;
        display: flex;
        flex-direction: row;
        justify-content: center;
    }
    .swipeableviews-container .swipe-view-pagination > span {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background-color: #cac4d1;
        display: inline-block;
        margin: 0 4px;
        cursor: pointer;
    }
    .swipeableviews-container .swipe-view-pagination > span.active {
        cursor: default;
        background-color: #695787;
    }
    .no-user-select {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
    .modal.confirmation-modal .modal-container {
        border-radius: 8px;
        width: 280px;
    }
    .modal.confirmation-modal .modal-container.small-width {
        width: 264px !important;
    }
    .modal.confirmation-modal .modal-action-buttons {
        border-top: 1px solid #ebe6ef;
    }
    .modal.confirmation-modal .modal-action-buttons > button {
        width: 100%;
        padding: 16px 8px;
        border-right: 1px solid #ebe6ef;
        color: #f55;
        outline: none;
        font-size: 12px;
        line-height: 1.5;
        border-radius: 0;
        min-height: 50px;
    }
    .modal.confirmation-modal .modal-action-buttons > button:last-child {
        border-right: 0;
    }
    .modal.confirmation-modal .modal-action-buttons > button.btn-reject {
        color: #9c97a3;
    }
    .modal.confirmation-modal .modal-action-buttons.destructive-type {
        flex-direction: row-reverse;
    }
    .modal.confirmation-modal .modal-action-buttons.destructive-type > button {
        color: #e00d0d;
        border-right: 0;
        border-left: 1px solid #ebe6ef;
    }
    .modal.confirmation-modal .modal-action-buttons.destructive-type > button:last-child {
        border: 0;
    }
    .modal.confirmation-modal .modal-action-buttons.destructive-type .btn-reject {
        color: #9c97a3;
    }
    .card-filter-container {
        margin-left: -4px;
        white-space: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
    }
    .card-filter-container > * {
        margin: 0 4px;
    }
    .card-filter-container .btn.btn-bubble {
        color: #695787 !important;
        background-color: transparent;
        min-width: 0;
    }
    .card-filter-container .btn.btn-bubble.active {
        background-color: #695787;
        color: #fff !important;
    }
    .notification-filter {
        padding: 12px 16px 16px;
        background-color: #fff;
        margin-top: 48px;
        z-index: 2;
    }
    .notification-filter > p {
        font-size: 12px;
        font-weight: 700;
        color: #605c66;
        display: inline-block;
    }
    .notification-filter .card-filter-container {
        margin: 0 -16px;
    }
    .notification-filter .card-filter-container > :first-child {
        margin-left: 16px;
    }
    .notification-filter .card-filter-container > :last-child {
        margin-right: 16px;
    }
    .notification-list {
        padding-bottom: 30px;
        height: calc(100vh - 130px);
        overflow-y: scroll;
        position: relative;
        flex-grow: 1;
    }
    .notification-list .btn-floating {
        position: fixed;
        background-color: #fff;
        padding: 11px 18px;
        border-radius: 16px;
        bottom: -50px;
        z-index: 5;
        left: 50%;
        transform: translateX(-50%);
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
        transition: bottom 0.3s ease;
        min-width: 200px;
    }
    .notification-list .btn-floating.visible {
        bottom: 60px;
    }
    .notification-list .no-data-text {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        font-size: 14px;
        font-style: italic;
        color: #9c97a3;
    }
    .btn.btn-text {
        color: #695787;
        padding: 0;
        border: 0;
        font-weight: 700;
        font-size: 12px;
    }
    .btn.btn-text:hover {
        text-decoration: underline;
    }
    .btn.btn-text:focus {
        outline: none;
        box-shadow: none !important;
    }
    .btn.btn-action,
    .btn.btn-action-secondary {
        color: #fff;
        background-color: #f55;
        font-size: 12px;
        line-height: 22px;
        font-weight: 700;
        border-radius: 8px;
    }
    .btn.btn-action-secondary {
        background-color: #fff;
        color: #f55;
        border-color: #f55;
    }
    .btn.btn-action-secondary.disabled,
    .btn.btn-action-secondary:disabled {
        background-color: #fff;
        color: #cac4d1;
        border-color: #cac4d1;
    }
    .btn.disabled,
    .btn:disabled {
        background-color: #cac4d1;
        opacity: 1;
    }
    .star-rating-container > * {
        height: 30px;
        margin: 0;
    }
    .star-rating-container > p {
        font-size: 12px;
        color: #605c66;
        line-height: 32px;
        margin-left: 4px;
        height: auto;
    }
    .star-rating-container .rating-overall {
        font-size: 14px;
        color: #9c97a3;
        line-height: 26px;
        margin-right: 4px;
        margin-left: 0;
    }
    .star-rating-container .rating-overall span:first-child {
        color: #605c66;
        font-weight: 700;
        font-size: 20px;
    }
    .star-rating-container .star-list {
        padding: 0;
        margin: 0;
        display: inline-block;
    }
    .star-rating-container .star-list + p {
        min-width: 30px;
    }
    .star-rating-container .star-list > li {
        display: inline-flex;
        width: 24px;
        height: 24px;
        align-items: center;
        justify-content: center;
    }
    .star-rating-container .star-list.star-lg > li {
        margin: 0 3px;
    }
    .star-rating-container .star-list.star-lg > li .star-icon {
        width: 24px;
        height: 24px;
        background-size: 32px;
    }
    .star-rating-container.rating-edit {
        justify-content: center;
        flex-direction: column;
    }
    .star-rating-container.rating-edit .star-list > li {
        width: 30px;
        height: 30px;
        margin: 0 4px;
    }
    .star-rating-container.rating-edit .star-icon {
        width: 30px;
        height: 30px;
        background-size: 42px;
        cursor: pointer;
    }
    .star-rating-container.small-rating > * {
        height: 22px;
    }
    .star-rating-container.small-rating > p {
        font-size: 10px;
    }
    .star-rating-container.small-rating .rating-overall {
        font-size: 12px;
        line-height: 20px;
    }
    .star-rating-container.small-rating .rating-overall span:first-child {
        font-size: 14px;
    }
    .star-rating-container.small-rating .star-list > li {
        width: 16px;
        height: 16px;
    }
    .star-rating-container.small-rating .star-icon {
        width: 12px;
        height: 12px;
        background-size: 18px;
    }

    .star-icon.mini-star {
        width: 10px;
        height: 10px;
        background-size: 14px;
    }
    .min-h-32 {
        min-height: 32px;
    }
    .icon-card {
        border: 1px solid #ebe6ef;
        min-width: 86px;
        width: 86px;
        padding: 8px;
        min-height: 70px;
    }
    .icon-card > .isvg,
    .icon-card > img {
        height: 32px;
        width: 32px;
        margin: 0 auto 4px;
    }
    .icon-card > div {
        min-height: 36px;
    }
    .icon-card.icon-card-sm {
        min-width: 85px;
        width: 85px;
    }
    .icon-card.shadow-md {
        border: 0;
    }
    .shadow-md {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
    }
    ::-webkit-scrollbar {
        height: 0;
        padding: 0;
        width: 2px;
    }
    .full-rounded {
        border-radius: 50%;
    }
    .is-animated {
        transition: all 0.3s ease;
    }
    .button-float-wrapper .button-float.back-to-top-article {
        bottom: 60px;
        right: 16px;
    }
    .side-drawer-container .common-header {
        position: absolute;
    }
    .chat-avatar {
        position: relative;
        width: 36px;
    }
    .chat-avatar,
    .chat-avatar img {
        border-radius: 100%;
    }
    .chat-avatar img.avatar-sm {
        width: 25px;
        margin-left: 9px;
        margin-bottom: 11px;
    }
    .reply-list {
        position: relative;
        background: #f5f2f7;
        margin-left: -16px;
        bottom: -1px;
        width: calc(100% + 32px);
    }
    .button-float-wrapper {
        position: fixed;
        left: 0;
        right: 0;
        margin: 0 auto;
        bottom: 90px;
        z-index: 2;
    }
    .button-float-wrapper .button-float {
        bottom: 0;
        border-radius: 100%;
        padding: 0;
        height: 56px;
        width: 56px;
        min-width: 56px;
        position: absolute;
        background: #695787;
        border: none;
        outline: none;
        right: 32px;
        box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.1), 0 0 4px 0 rgba(0, 0, 0, 0.1);
    }
    .button-float-wrapper .button-float img {
        padding-top: 8px;
        margin-left: 5px;
    }
    .button-float-wrapper .button-float * {
        color: #fff;
    }
    .button-float-wrapper .button-float.button-float-purple:not(:disabled):not(.disabled).active,
    .button-float-wrapper .button-float.button-float-purple:not(:disabled):not(.disabled):active,
    .button-float-wrapper .button-float.button-float-purple:not(:disabled):not(.disabled):focus,
    .button-float-wrapper .button-float.button-float-purple:not(:disabled):not(.disabled):hover,
    .button-float-wrapper .button-float.button-float-purple:not(:disabled):not(.disabled):visited {
        background-color: #9a86b7 !important;
        border-color: #9a86b7 !important;
        outline: none;
    }
    .button-float-wrapper .button-float.button-float-purple:not(:disabled):not(.disabled):focus {
        box-shadow: none;
    }
    .button-float-wrapper .button-float.button-float-soft-red {
        background: #f55 !important;
    }
    .button-float-wrapper .button-float.button-float-soft-red:not(:disabled):not(.disabled).active,
    .button-float-wrapper .button-float.button-float-soft-red:not(:disabled):not(.disabled):active,
    .button-float-wrapper .button-float.button-float-soft-red:not(:disabled):not(.disabled):focus,
    .button-float-wrapper .button-float.button-float-soft-red:not(:disabled):not(.disabled):hover,
    .button-float-wrapper .button-float.button-float-soft-red:not(:disabled):not(.disabled):visited {
        background-color: #f55 !important;
        border-color: #f55 !important;
        outline: none;
    }
    .button-float-wrapper.with-navbar {
        bottom: 70px !important;
    }
    .button-float-wrapper.go-to-bottom .button-float {
        right: 16px;
    }
    .button-float-wrapper.back-to-top {
        bottom: 16px;
    }
    .button-float-wrapper.back-to-top .button-float {
        border-radius: 21px;
        box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.1), 0 0 4px 0 rgba(0, 0, 0, 0.1);
        right: 16px;
    }
    .button-float-wrapper.back-to-top .button-float .isvg svg {
        transform: rotate(90deg);
    }
    .img-cover {
        object-fit: cover;
    }
    .divider {
        display: block;
        width: 100%;
        border-bottom-width: 1px;
        border-bottom-color: #cac4d1;
        border-bottom-style: solid;
        margin: -2px 0 8px;
    }
    .divider.dashed {
        border-bottom-style: dashed !important;
    }
    .separator {
        display: block;
        height: 1px;
    }
    .rotate-n90 {
        transform: rotate(-90deg);
    }
    .rotate-90 {
        transform: rotate(90deg);
    }
    .rotate-180 {
        transform: rotate(180deg);
    }
    .rotate-270 {
        transform: rotate(270deg);
    }
    .lineheight-14 {
        line-height: 14px !important;
    }
    .lineheight-16 {
        line-height: 16px !important;
    }
    .lineheight-24 {
        line-height: 24px !important;
    }
    body {
        padding: 0;
        font-family: Modern Era, sans-serif;
        font-weight: 580;
        font-size: 14px;
        line-height: 1.5;
        box-sizing: border-box;
    }
    body,
    p {
        margin: 0;
    }

    .main-layout-commerce {
        box-shadow: 0 0 48px 0 rgba(0, 0, 0, 0.2);
        background-color: #fff;
        min-height: 100vh;
        max-width: 500px;
        overflow: hidden;
        padding-left: 0;
        padding-right: 0;
        margin: auto;
        font-family: Modern Era;
    }
    .main-layout-commerce.with-navbar {
        padding-bottom: 56px;
    }
    .content-wrapper {
        padding-top: 70px;
    }
    @media (min-width: 411px) {
        .content-wrapper {
            padding-top: 100px;
        }
    }
    a:active,
    a:focus,
    a:hover {
        text-decoration: none;
    }
    .errorPage {
        display: flex;
        height: 100vh;
        justify-content: center;
        align-items: center;
    }



    $shopping-cart-red: #DF0000;

    .fa-stack[data-count]:after{
      position:absolute;
      right:0%;
      top:0%;
      content: attr(data-count);
      font-size:40%;
      padding:.6em;
      border-radius:999px;
      line-height:.75em;
      color: white;
      color:$shopping-cart-red;
      text-align:center;
      min-width:2em;
      font-weight:bold;
      background: white;
      border-style:solid;
    }
    .fa-circle {
      color:#DF0000;
    }

    .red-cart {
    	color: #DF0000; background:white;
    }



    .badge {
      padding: 9px 9px 9px 9px;
      -webkit-border-radius: 9px;
      -moz-border-radius: 9px;
      border-radius: 9px;
    }

    .label-warning[href],
    .badge-warning[href] {
      background-color: #c67605;
    }
    #lblCartCount {
        font-size: 10px;
        background: #000000;
        color: #fff;
        padding: 3px 3px 3px 3px;
        vertical-align: top;
        margin-left: -10px;
        margin-top: -20px;
    }
