:root {
    --primary: #57bdb8;
    --primaryHvr: #94dcd8;
    --linkColor: #FD3801;
    --grey1: #384F6F;
    --grey2: #718198;
    --grey3: #a4a2a2;
    --grey4: #A3AED0;
}

html {
    min-height: 100%;
    display: flex;
    flex-direction: column;
}

body {
    font-family: Poppins, Arial, Helvetica, sans-serif;
    font-size: 15px;
    margin: 0;
    padding: 0;
    background-color: #f7f7f7;
    padding-top: 78px;
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
}

body * {
    box-sizing: border-box;
    max-width: 100%;
}

body .owl-stage {
    max-width: none;
}


/*## UI Components ##*/

h1,
h2,
h3,
h4,
h5,
h6,
.heading-1,
.heading-2,
.heading-3,
.heading-4,
.heading-5,
.heading-6 {
    color: #000;
    font-weight: 700;
}

h1,
.heading-1 {
    font-size: 2.4em;
    margin: 0 0 0.2em;
}

h2,
.heading-2 {
    font-size: 2.2em;
    margin: 0 0 0.2em;
}

h3,
.heading-3 {
    font-size: 2em;
    margin: 0 0 0.2em;
}

h4,
.heading-4 {
    font-size: 1.8em;
    margin: 0 0 0.2em;
}

h5,
.heading-5 {
    font-size: 22px;
    margin: 0 0 16px;
}

h6,
.heading-6 {
    font-size: 1.6em;
    margin: 0 0 0.25em;
}

.clr {
    clear: both;
}

.cfx::after {
    content: '';
    display: block;
    clear: both;
}

.bold-300 {
    font-weight: 300;
}

.bold-400 {
    font-weight: 400;
}

.bold-500 {
    font-weight: 500;
}

.bold-600 {
    font-weight: 600;
}

.bold-700 {
    font-weight: 700;
}

.bold-800 {
    font-weight: 800;
}

.text-success,
.text-green {
    color: #5cab02;
}

.text-warning {
    color: #ff6633;
}

.text-info {
    color: #27aff5;
}

.text-orange {
    color: #e67a00;
}

.text-yellow {
    color: #ff0;
}

.text-purple {
    color: #8e009b;
}

.text-danger,
.text-red {
    color: #f00;
}

.text-black {
    color: #000;
}

.text-note {
    color: #989898;
}

.text-site {
    color: #f8a147;
}

.text-g1 {
    color: var(--grey1);
}

.text-g2 {
    color: var(--grey2);
}

.text-g3 {
    color: var(--grey3);
}

.text-g4 {
    color: var(--grey4);
}

.text-08 {
    font-size: .8em;
}

.text-09 {
    font-size: .9em;
}

.text-11 {
    font-size: 1.1em;
}

.text-12 {
    font-size: 1.2em;
}

.text-13 {
    font-size: 1.3em;
}

.text-14 {
    font-size: 1.4em;
}

.text-15 {
    font-size: 1.5em;
}

.text-16 {
    font-size: 1.6em;
}

.text-17 {
    font-size: 1.7em;
}

.text-18 {
    font-size: 1.8em;
}

.text-19 {
    font-size: 1.9em;
}

.text-20 {
    font-size: 2em;
}

.text-left {
    text-align: left;
}

.text-center {
    text-align: center;
}

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

.block {
    display: block;
}

.hidden {
    display: none;
}

.mb0 {
    margin-bottom: 0px;
}

.mb5 {
    margin-bottom: 5px;
}

.mb10 {
    margin-bottom: 10px;
}

.mb15 {
    margin-bottom: 15px;
}

.mb20 {
    margin-bottom: 20px;
}

.mb25 {
    margin-bottom: 25px;
}

.mb30 {
    margin-bottom: 30px;
}

.mb35 {
    margin-bottom: 35px;
}

.mb40 {
    margin-bottom: 40px;
}

.mb45 {
    margin-bottom: 45px;
}

.mb50 {
    margin-bottom: 50px;
}

.pt0 {
    padding-top: 0px;
}

.pt5 {
    padding-top: 5px;
}

.pt10 {
    padding-top: 10px;
}

.pt15 {
    padding-top: 15px;
}

.pt20 {
    padding-top: 20px;
}

.pt25 {
    padding-top: 25px;
}

.pt30 {
    padding-top: 30px;
}

.pt35 {
    padding-top: 35px;
}

.pt40 {
    padding-top: 40px;
}

.pt45 {
    padding-top: 45px;
}

.pt50 {
    padding-top: 50px;
}

.pl0 {
    padding-left: 0px;
}

.pl5 {
    padding-left: 5px;
}

.pl10 {
    padding-left: 10px;
}

.pl15 {
    padding-left: 15px;
}

.pl20 {
    padding-left: 20px;
}

.pl25 {
    padding-left: 25px;
}

.pl30 {
    padding-left: 30px;
}

.pl35 {
    padding-left: 35px;
}

.pl40 {
    padding-left: 40px;
}

.pl45 {
    padding-left: 45px;
}

.pl50 {
    padding-left: 50px;
}

.pr0 {
    padding-right: 0px;
}

.pr5 {
    padding-right: 5px;
}

.pr10 {
    padding-right: 10px;
}

.pr15 {
    padding-right: 15px;
}

.pr20 {
    padding-right: 20px;
}

.pr25 {
    padding-right: 25px;
}

.pr30 {
    padding-right: 30px;
}

.pr35 {
    padding-right: 35px;
}

.pr40 {
    padding-right: 40px;
}

.pr45 {
    padding-right: 45px;
}

.pr50 {
    padding-right: 50px;
}

.mr0 {
    margin-right: 0px;
}

.mr5 {
    margin-right: 5px;
}

.mr10 {
    margin-right: 10px;
}

.mr15 {
    margin-right: 15px;
}

.mr20 {
    margin-right: 20px;
}

.mr25 {
    margin-right: 25px;
}

.mr30 {
    margin-right: 30px;
}

.mr35 {
    margin-right: 35px;
}

.mr40 {
    margin-right: 40px;
}

.mr45 {
    margin-right: 45px;
}

.mr50 {
    margin-right: 50px;
}

.stat-round {
    background-color: var(--outline);
    border-radius: 50%;
    display: inline-block;
    height: 0.4em;
    margin-right: 5px;
    vertical-align: 0.17em;
    width: 0.4em;
}

.stat-round.red {
    background-color: #e00;
}

.stat-round.yellow {
    background-color: #fe0;
}

.stat-round.blue {
    background-color: #09f;
}

.stat-round.green {
    background-color: #0e0;
}

.stat-round.orange {
    background-color: #fb0;
}

.stat-round.violet {
    background-color: #83059c;
}

.stat-round.darkcyan {
    background-color: #008b8b;
}

a,
.a-link {
    color: #FD3801;
    text-decoration: none;
    cursor: pointer;
}

a:hover,
.a-link:hover {
    color: #ff693f;
}

hr {
    border: none;
    border-bottom: 1px solid #bbb;
}

hr.dashed {
    border-bottom-style: dashed;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

input[type="text"],
input[type="url"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="number"],
select,
textarea {
    background-color: #fdfdfd;
    border: 1px solid #e0e0e0;
    color: #666666;
    font-family: Roboto, Arial, Helvetica, sans-serif;
    font-size: 14px;
    padding: 10px 15px;
    resize: vertical;
    max-width: 100%;
    border-radius: 8px;
}

select {
    padding: 11px 15px;
}

button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
    border: none;
    background: none;
    max-width: 100%;
    font-family: 'Poppins', Arial, Helvetica, sans-serif;
}

input.fullwidth,
select.fullwidth,
textarea.fullwidth {
    width: 100%;
}

input[type="text"]:focus,
input[type="url"]:focus,
input[type="tel"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
select:focus,
textarea:focus {
    background-color: #fff;
    border-color: var(--primary);
    outline: none;
}

input[type="text"][disabled],
input[type="url"][disabled],
input[type="tel"][disabled],
input[type="email"][disabled],
input[type="password"][disabled],
input[type="number"][disabled],
select[disabled],
textarea[disabled] {
    background-color: #f1f1f1;
}

input[type="checkbox"],
input[type="radio"] {
    vertical-align: -2px;
}

.dollar-input {
    position: relative;
}

.dollar-input::before {
    content: '$';
    position: absolute;
    top: 8px;
    left: 17px;
    pointer-events: none;
}

.dollar-input input {
    padding-left: 30px;
}

.material-symbols-outlined {
    font-size: 1.4em;
    vertical-align: top;
}

.pix-icon-text {
    display: inline-flex;
}

.pix-icon-text .material-symbols-outlined {
    padding-right: .35em;
    font-size: 1.22em;
    padding-top: .1em;
}

.pix-btn,
input.pix-btn {
    border: 1px solid var(--grey4);
    display: inline-block;
    cursor: pointer;
    font-size: 14px;
    padding: 8px 25px;
    color: #666;
    background-color: #fff;
    border-radius: 8px;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    box-shadow: 0px 2px 7px rgba(0, 0, 0, 0.1);
}

.pix-btn:hover,
input.pix-btn:hover,
.pix-btn:active,
input.pix-btn:active {
    border-color: var(--primary);
    color: var(--primary);
}

.pix-btn.site {
    background-color: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

.pix-btn.site:hover {
    background-color: var(--primaryHvr);
    border-color: var(--primaryHvr);
    color: #fff;
}

.pix-btn.primary {
    background-color: #333;
    color: #cccccc;
    border-color: #333;
}

.pix-btn.primary:hover {
    background-color: #505050;
    border-color: #505050;
    color: #ccc;
}

.pix-btn.success {
    background-color: #5cab02;
    color: #fff;
    border-color: #5cab02;
}

.pix-btn.success:hover {
    background-color: #95d050;
    border-color: #95d050;
    color: #fff;
}

.pix-btn.warning {
    background-color: #ff6633;
    color: #fff;
    border-color: #ff6633;
}

.pix-btn.warning:hover {
    background-color: #ff7d4a;
    border-color: #ff7d4a;
    color: #fff;
}

.pix-btn.pink {
    background-color: #f194cb;
    border-color: #f194cb;
    color: #fff;
}

.pix-btn.pink:hover {
    background-color: #db5aa6;
    border-color: #db5aa6;
    color: #fff;
}

.pix-btn.info {
    background-color: #27aff5;
    color: #fff;
    border-color: #27aff5;
}

.pix-btn.info:hover {
    background-color: #4cbcf6;
    border-color: #4cbcf6;
    color: #fff;
}

.pix-btn.danger {
    background-color: #e00;
    color: #fff;
    border-color: #e00;
}

.pix-btn.danger:hover {
    background-color: #f00;
    border-color: #f00;
    color: #fff;
}

.pix-btn.white {
    background-color: #fff;
    color: #333;
    border-color: #eee;
    outline: none;
}

.pix-btn.white:hover {
    background-color: #fff;
    border-color: #eee;
    color: #999;
}

.pix-btn.gray {
    background-color: #ccc;
    color: #333;
    border-color: #bbb;
    outline: none;
}

.pix-btn.gray:hover {
    background-color: #eee;
    border-color: #bbb;
    color: #333;
}

.pix-btn.xs {
    font-size: 12px;
    padding: 2px 16px;
}

.pix-btn.sm {
    font-size: 13px;
    padding: 4px 18px;
}

.pix-btn.md {
    font-size: 14px;
    padding: 8px 21px;
}

.pix-btn.lg {
    font-size: 16px;
    padding: 10px 25px;
}

.pix-btn.xl {
    font-size: 22px;
    font-weight: 700;
    padding: 14px 24px;
}

.pix-btn.fullwidth {
    display: block;
    text-align: center;
    width: 100%
}

.pix-btn .material-symbols-outlined {
    vertical-align: -0.19em;
    font-size: 1.2em;
    margin-right: .05em;
    margin-left: -.4em;
}

.pix-btn.rounded {
    border-radius: 50px;
}

.round-btn {
    display: inline-flex;
    color: #14191F;
    border: 1px solid #696969;
    border-radius: 30px;
    padding: .4em 1em;
    font-size: .95em;
    align-items: center;
    cursor: pointer;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
}

.round-btn:hover {
    color: var(--primary);
    border-color: var(--primary);
    background-color: rgba(255, 255, 255, .5);
}

.round-btn.mid {
    padding: .2em .4em;
}

.round-btn.red {
    color: #e00000;
    border-color: #e00000;
}

.round-btn.red:hover {
    color: #f33;
    border-color: #f33;
}

.round-btn .material-symbols-outlined {
    font-size: 1.2em;
    margin-right: 9px;
}

.round-btn.mid .material-symbols-outlined {
    margin-right: .25em;
}

.round-btn .btn-txt {
    padding-bottom: .3em;
}

.round-btn .material-symbols-outlined+.btn-txt {
    padding-right: .5em;
}

.breadcrumbs {
    font-size: .93em;
    margin: 1em 0 5em;
    line-height: 2.5em;
}

.breadcrumbs .cm-item {
    color: #b3b3b3;
}

.breadcrumbs .cm-item .material-symbols-outlined {
    font-size: 1.4em;
    vertical-align: -4px;
}

.breadcrumbs .cm-item:not(:last-child):hover {
    color: var(--primary);
    text-decoration: underline;
}

.breadcrumbs .cm-item+.cm-item::before {
    content: '/';
    display: inline-block;
    margin: 0 13px 0 10px;
    color: #b3b3b3;
    pointer-events: none;
}

.breadcrumbs .cm-item:last-child {
    color: var(--primary);
}


/* sticky button */

.pix-spl-sticky-btn {
    position: sticky;
    bottom: 15px;
    background-color: var(--primary);
    color: #fff;
    width: 60px;
    height: 60px;
    z-index: 10;
    border-radius: 50%;
    box-shadow: 0 0 15px rgba(0, 0, 0, .3);
    transition: background-color .2s;
    cursor: pointer;
    display: block;
    margin: 20px 0 0 auto;
}

.pix-spl-sticky-btn:hover {
    color: #fff;
    background-color: var(--primaryHvr);
}

.pix-spl-sticky-btn .material-symbols-outlined {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}


/* stickey menu */

.pix-sticky-btn {
    position: fixed;
    z-index: 10;
    right: 20px;
    bottom: 20px;
}

.pix-sticky-btn .btn-obj {
    background-color: var(--primary);
    color: #fff;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.46);
    position: relative;
    cursor: pointer;
    transition: border-radius 150ms;
    display: block;
    border: none;
}

.pix-sticky-btn:hover .btn-obj {
    background-color: var(--primaryHvr);
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.pix-sticky-btn:hover>.btn-menu {
    visibility: visible;
    transform: scale(1);
}

.pix-sticky-btn .btn-obj .material-symbols-outlined {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.pix-sticky-btn .btn-menu {
    background-color: #fff;
    border-radius: 5px;
    bottom: -2px;
    box-shadow: 0 0 7px rgba(0, 0, 0, 0.3);
    visibility: hidden;
    position: absolute;
    right: 100%;
    text-align: left;
    white-space: nowrap;
    z-index: 1;
    transition: visibility 150ms, transform 150ms;
    transform: scale(0);
    transform-origin: right bottom 0;
    max-width: none;
}

.pix-sticky-btn .btn-menu-item {
    display: block;
    position: relative;
    padding: 6px 26px 6px 37px;
    cursor: pointer;
    transition: background-color .25s, color .25s;
    color: #000;
}

.pix-sticky-btn .btn-menu-item:hover {
    background-color: var(--primary);
    color: #fff;
}

.pix-sticky-btn .btn-menu-item:first-child {
    padding-top: 14px;
}

.pix-sticky-btn .btn-menu-item:last-child {
    padding-bottom: 14px;
}

.pix-sticky-btn .btn-menu-item.disabled {
    color: #999;
    pointer-events: none;
    cursor: text;
}

.pix-sticky-btn .btn-menu-item .material-symbols-outlined {
    font-size: 1.4em;
    left: 9px;
    margin-top: -1px;
    position: absolute;
    text-align: center;
    width: 17px;
}


/* stickey menu ends */


/* pix button menu starts */

.pix-btn-menu {
    position: relative;
    display: inline-block;
}

.pix-btn-menu .btn-obj {
    background-color: #fff;
    border: 1px solid #dcdcdc;
    box-shadow: 0 0 10px rgba(0, 0, 0, .1);
    display: inline-flex;
    padding: .75em 1.57em;
    border-radius: 7px;
    cursor: pointer;
    color: #000;
    align-items: center;
}

.pix-btn-menu:hover .btn-obj {
    color: var(--primary);
    border-color: var(--primary);
}

.pix-btn-menu .btn-obj .material-symbols-outlined {
    font-size: 1.5em;
    margin-left: .4em;
    margin-right: -.4em;
}

.pix-btn-menu .btn-menu {
    position: absolute;
    top: 100%;
    white-space: nowrap;
    box-shadow: 0 0 10px rgba(0, 0, 0, .2);
    background-color: #fff;
    border-radius: 0 0 8px 8px;
    display: none;
    z-index: 100;
    width: 100%;
}

.pix-btn-menu:hover .btn-menu {
    display: block;
}

.pix-btn-menu .btn-menu .menu-btn {
    display: block;
    padding: 6px 23px;
    color: #000;
    cursor: pointer;
}

.pix-btn-menu .btn-menu .menu-btn:hover {
    color: var(--primary);
}

.pix-btn-menu .btn-menu .menu-btn:first-child {
    padding-top: 15px;
}

.pix-btn-menu .btn-menu .menu-btn:last-child {
    padding-bottom: 15px;
}


/* pix button menu ends */


/* pix toggle start */

.pix-toggle {
    cursor: pointer;
    padding: 7px 0;
    display: inline-block;
    vertical-align: -8px;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

.pix-toggle input {
    position: absolute;
    visibility: hidden;
}

.pix-toggle .toggle-ind {
    background-color: #c3c3c3;
    height: 10px;
    border-radius: 9px;
    position: relative;
    width: 43px;
    max-width: 100%;
}

.pix-toggle .toggle-ind::before {
    content: '';
    display: block;
    background-color: #fff;
    width: 24px;
    height: 24px;
    top: -7px;
    left: 1px;
    box-shadow: 0 0 7px rgba(0, 0, 0, .2);
    border-radius: 50%;
    position: absolute;
    transition: left 0.2s, background-color 0.2s;
}

.pix-toggle input:checked+.toggle-ind {
    background-color: var(--primaryHvr);
}

.pix-toggle input:checked+.toggle-ind::before {
    left: calc(100% - 25px);
    background-color: var(--primary);
}


/* pix toggle end */


/* checkbox start */

.pix-check {
    align-items: center;
    cursor: pointer;
    display: inline-flex;
    min-height: 25px;
    position: relative;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
}

.pix-check::before {
    align-self: flex-start;
    background-color: #fff;
    border: 2px solid var(--primary);
    border-radius: 4px;
    content: "";
    display: block;
    height: 22px;
    left: 0;
    margin-right: 12px;
    top: 0;
    min-width: 22px;
}

.pix-check input[type=checkbox] {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}

.pix-check .pix-check-tik {
    color: var(--primary);
    display: none;
    left: 2px;
    position: absolute;
    top: 2px;
}

.pix-check input:checked+.pix-check-tik {
    display: block;
}

.pix-check .chk-txt {
    display: block;
    text-align: left;
}


/* checkbox end */


/* radio start */

.pix-radio {
    display: inline-block;
    cursor: pointer;
    position: relative;
    padding: 2px 0 0 35px;
    min-height: 25px;
}

.pix-radio::before {
    content: '';
    position: absolute;
    border: 2px solid var(--primary);
    width: 20px;
    height: 20px;
    border-radius: 50%;
    top: 0;
    left: 0;
}

.pix-radio input {
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    cursor: pointer;
}

.pix-radio .rddot {
    background-color: var(--primary);
    border-radius: 50%;
    display: none;
    height: 8px;
    left: 8px;
    position: absolute;
    top: 8px;
    width: 8px;
}

.pix-radio input:checked+.rddot {
    display: block;
}

.pix-radio .rdtext {
    display: block;
    padding-top: 2px;
}


/* radio end */


/* no results start */

.mdl-no-result {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #000;
    text-align: center;
    padding: 30px 0;
}

.mdl-no-result .material-symbols-outlined {
    font-size: 45px;
    margin-bottom: 21px;
    color: #b7b7b7;
}

.mdl-no-result .nrs-heading {
    font-size: 1.6em;
    font-weight: 600;
    margin-bottom: 4px;
}

.mdl-no-result .nrs-btn-box {
    margin-top: 15px;
}


/* no results end */


/* Danger Zone */

.danger-zone {
    position: relative;
    background-color: #F8DCDC;
    width: 700px;
    border: 1px solid #FF0505;
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    padding: 28px 35px;
}

.danger-zone .dz-title {
    color: #AF0707;
    font-weight: 600;
    font-size: 1.23em;
    margin-bottom: 10px;
}

.danger-zone .dz-body {
    margin-bottom: 12px;
    color: #750808;
    font-size: 1.08em;
}

.danger-zone .dz-btn {
    display: inline-block;
    padding: 10px 20px;
    background: #E40606;
    border-radius: 20px;
    font-weight: 600;
    font-size: 1.15em;
    color: #fff;
}


/* popup start */

.popup-frame {
    display: block;
    position: fixed;
    background-color: rgba(0, 0, 0, 0.2);
    top: 0;
    left: 0;
    z-index: 1000;
    width: 100%;
    height: 100%
}

.popup-frame .popup-window {
    background-color: #fff;
    width: 748px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.18);
    text-align: left;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 6px;
    padding: 20px 26px;
    max-width: calc(100% - 33px) !important
}

.popup-frame .pop-close-dv {
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0;
    right: 0;
    overflow: hidden;
    border-top-right-radius: 6px;
}

.popup-frame .pop-close-dv .popup-close {
    width: 43px;
    height: 89px;
    background-color: var(--primary);
    transform: rotate(-45deg);
    max-width: none !important;
    position: absolute;
    top: -30px;
    left: 23px;
    cursor: pointer;
}

.popup-frame .pop-close-dv .popup-close:hover {
    background-color: var(--primaryHvr);
}

.popup-frame .pop-close-dv .popup-close .cl-icon {
    position: absolute;
    top: 28px;
    left: 6px;
    transform: rotate(-45deg);
    font-size: 19px;
    color: #fff;
}

.popup-frame .popup-heading {
    font-size: 18px;
    font-weight: 700;
    color: #003C46;
    margin: 0 0 15px
}

.popup-frame .popup-content-fm .mail-head {
    font-weight: 600;
}

.popup-frame .popup-content-fm .mail-list ul li {
    padding: 9px 0;
    color: #5B5B5B;
    position: relative;
}

.popup-frame .popup-content-fm .mail-list ul li+li {
    border-top: #B1C1D0 1px dashed;
}

.popup-frame .popup-content-fm .mail-list ul li span.rem-item {
    text-align: right;
    display: block;
    position: absolute;
    right: -5px;
    top: 2px;
    cursor: pointer;
    padding: 7px 12px;
}

.popup-frame .popup-content-fm .mail-list ul {
    background-color: #EFF1F5;
    border-radius: 5px;
    padding: 5px 17px 5px 17px;
    list-style: none;
}

.popup-frame .popup-content-fm {
    overflow-x: hidden;
    overflow-y: auto;
    margin-right: -20px;
    max-width: none !important;
    padding-bottom: 1px;
    padding-right: 20px
}

.popup-frame.out-msg {
    animation: outMsgBgAnim .2s;
    -webkit-animation: outMsgBgAnim .2s;
}

.popup-frame.out-msg .popup-window {
    border-radius: 45px;
    animation: outMsgAnim .4s;
    -webkit-animation: outMsgAnim .4s;
    transform-origin: 0 0 0;
}

.popup-frame.out-msg.msg-error .pop-close-dv .popup-close {
    background-color: #f00;
}

@keyframes outMsgAnim {
    0% {
        transform: rotate(-180deg) translate(-50%, -50%) scale(0, 0)
    }

    100% {
        transform: rotate(0deg) translate(-50%, -50%) scale(1, 1)
    }
}

@-webkit-keyframes outMsgAnim {
    0% {
        transform: rotate(-180deg) translate(-50%, -50%) scale(0, 0)
    }

    100% {
        transform: rotate(0deg) translate(-50%, -50%) scale(1, 1)
    }
}

@keyframes outMsgBgAnim {
    0% {
        background-color: rgba(0, 0, 0, 0);
    }

    100% {
        background-color: rgba(0, 0, 0, .2);
    }
}

@-webkit-keyframes outMsgBgAnim {
    0% {
        background-color: rgba(0, 0, 0, 0);
    }

    100% {
        background-color: rgba(0, 0, 0, .2);
    }
}

.popup-frame .popup-output {
    text-align: center;
    font-size: 16px;
    color: #777;
}

.popup-frame .popup-output .ppo-icon {
    margin: 10px 0 0;
}

.popup-frame .popup-output .ppo-icon .alert-icon {
    font-size: 40px;
}

.popup-frame .popup-output .ppo-title {
    color: #000;
    font-size: 1.2em;
    font-weight: 500;
    padding: 12px 0 1px;
}

.popup-frame .popup-output .ppo-body {
    font-size: 0.9em;
    margin-bottom: 19px;
}

.popup-frame .popup-output .ppo-button {
    padding-bottom: 17px;
}

.popup-frame .popup-output .ppo-button .pix-btn {
    border-radius: 100px;
}


/* popup end */


/* pix spinner start */

.pix-spinner {
    width: 40px;
    height: 40px;
    border: 2px solid #000;
    border-right-color: rgba(0, 0, 0, 0);
    border-radius: 50%;
    animation: spinnerAnimation .7s infinite;
    -webkit-animation: spinnerAnimation .7s infinite;
}

.pix-spinner.sm {
    width: 20px;
    height: 20px;
}

.pix-spinner.md {
    width: 30px;
    height: 30px;
}

@keyframes spinnerAnimation {
    0% {
        transform: rotate(-360deg)
    }
}

@-webkit-keyframes spinnerAnimation {
    0% {
        transform: rotate(-360deg)
    }
}


/* pix spinner end */

.pagination {
    text-align: center;
}

.pagination.text-left {
    text-align: left;
}

.pagination .separator {
    color: #000;
    margin: 0 10px;
    vertical-align: bottom;
    display: inline-block;
}

.pagination a {
    align-items: center;
    background-color: #fff;
    border: 1px solid #eaeaea;
    border-radius: 50%;
    color: #666;
    display: inline-flex;
    font-weight: 500;
    height: 50px;
    justify-content: center;
    margin: 3px;
    width: 50px;
}

.pagination a:hover {
    background-color: #f9f9f9;
}

.pagination a.active {
    background-color: var(--primary);
    border-color: var(--primary);
    color: #fff;
}

#notificationMsgLoader {
    position: fixed;
    left: 7px;
    bottom: 0;
    z-index: 9999;
    max-width: 670px;
}

#notificationMsgLoader .notification-item {
    position: relative;
    background-color: rgba(0, 0, 0, 0.77);
    color: #fff;
    padding: 18px 50px 18px 48px;
    font-weight: 600;
    margin-bottom: 7px;
    border-radius: 4px
}

#notificationMsgLoader .notification-item::before {
    content: "\f083";
    font-family: 'Material Symbols Outlined';
    color: #f00;
    position: absolute;
    top: 16px;
    left: 17px;
    font-size: 20px;
}

#notificationMsgLoader .notification-item.success::before {
    content: "\e876";
    color: #0a0;
}

#notificationMsgLoader .notification-item .noti-close-btn {
    position: absolute;
    top: 18px;
    right: 0;
    width: 36px;
    height: 100%;
    cursor: pointer;
    color: #c9c9c9;
}

#notificationMsgLoader .notification-item .noti-close-btn::before {
    position: absolute;
    left: 13px;
    top: 21px;
}

#notificationMsgLoader .notification-item .noti-close-btn:hover {
    color: #fff;
}


/* TasteRaiser */

.page-body {
    flex: 1 1 0;
}

.container {
    margin: 0 auto;
    /* padding-left: 15px;
    padding-right: 15px; */
    padding-left: 152px;
    padding-right: 152px;
    /* width: 1536px; */
}

.site-icon {
    background-image: url('../../images/icons.png');
}

.header {
    align-items: center;
    background-color: #94dcd8;
    display: flex;
    padding: 20px;
    position: fixed;
    width: 100%;
    z-index: 100;
    top: 0;
}

.header .nav-logo {
    width: 221px;
}

.header .nav-right {
    flex: 1 1 0;
    margin-left: 20px;
    display: flex;
    flex-direction: row-reverse;
}

.header .nav-right .nav-usr {
    margin-left: 20px;
    align-items: center;
    display: flex;
}

.header .nav-right .nav-usr .usr-nv-btn {
    display: block;
    color: #fff;
    position: relative;
    padding-right: 28px;
}

.header .nav-right .nav-usr .usr-nv-btn .site-icon {
    width: 18px;
    height: 18px;
    display: block;
    position: absolute;
    top: 0;
    right: 0;
}

.header .nav-right .nav-link-box {
    flex: 1 1 0;
    text-align: right;
    position: relative;
}

.header .nav-right .nav-link-box .nav-links {
    position: relative;
}

.header .nav-right .nav-link-box .nav-links .nav-close-btn {
    display: none;
}

.header .nav-right .nav-link-box .mob-nav-bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .7);
    transition: opacity .15s, visibility .15s;
    display: none;
    z-index: 2000;
}

.header .nav-right .nav-usr+.nav-link-box {
    text-align: center;
}

.header .nav-right .nav-link-box a {
    color: #fff;
    margin: 0 15px;
}

.header .nav-right .nav-link-box a.active {
    font-weight: 700;
}

.header .nav-menu-btn {
    display: none;
    color: #fff;
    font-size: 2em;
    position: fixed;
    /* width: 100%; */
    z-index: 1000;
    left: 0;
    top: 0;
}

.header .nav-menu-btn span {
    padding: 5px;
    cursor: pointer;
}

.header .nav-menu-profile {
    border-radius: 50%;
    overflow: hidden;
    line-height: 0;
    margin-right: 10px;
    box-shadow: 0 7px 6px rgba(0, 0, 0, 0.1);
    width: 33px;
    display: none;
    text-align: center;
    font-size: 1.7em;
    background-color: #e7e7e7;
    color: #979797;
    cursor: pointer;
}

.footer {
    background-color: #94dcd8;
    color: #fff;
    padding: 40px 20px;
    text-align: center;
    display: flex;
    justify-content: space-between;
    font-size: 1.08em;
    flex-wrap: wrap;
    /* margin-top: 10px; */
}

.footer .ft-left {
    max-width: none;
    margin: 0 -9px;
    padding-left: 60px;
}

.footer .ft-left a {
    color: #fff;
    margin: 0 9px;
    letter-spacing: 2px;
}

.footer .ft-right {
    display: flex;
    max-width: none;
    margin: 0 -20px;
}

.footer .ft-right .copy-right {
    margin: 0 20px;
    text-align: center;
}

.footer .ft-right .sc-media {
    margin: 0 20px;
    text-align: center;
}

.footer .ft-right .sc-media a {
    display: inline-block;
    width: 21px;
    height: 21px;
}

.footer .ft-right .sc-media a+a {
    margin-left: 6px;
}

.footer .ft-right .sc-media a.fcb {
    background-position: -20px 0;
}

.footer .ft-right .sc-media a.twt {
    background-position: -41px 0;
}

.footer .ft-right .sc-media a.lin {
    background-position: -63px 0;
}

.footer .ft-right .sc-media a.insta {
    background-position: -86px 0;
}


/* account page */

.page-account {
    display: flex;
    padding: 22px 15px 30px;
    position: relative;
}

.user-menu-bg {
    display: none;
    background-color: rgba(0, 0, 0, .7);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2000;
    visibility: hidden;
    opacity: 0;
    transition: opacity .3s, visibility .3s;
}

.page-body:not(.page-account) .acc-sidebar {
    display: none;
}

.acc-sidebar {
    background-color: #fff;
    border-radius: 18px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.12);
    display: flex;
    flex-direction: column;
    margin-right: 40px;
    max-height: calc(100vh - 115px);
    overflow: hidden;
    position: sticky;
    top: 100px;
    width: 310px;
}

.acc-sidebar .nav-close-btn {
    display: none;
}

.acc-sidebar .sd-top {
    display: flex;
    margin-bottom: 15px;
    padding: 24px;
    position: relative;
}

.acc-sidebar .sd-top::before {
    border-top: 1px solid #c7c7c7;
    bottom: 5px;
    content: "";
    position: absolute;
    width: calc(100% - 48px);
}

.acc-sidebar .sd-top .user-thumb {
    border-radius: 50%;
    line-height: 0;
    margin-right: 15px;
    overflow: hidden;
    width: 49px;
    align-self: flex-start;
}

.acc-sidebar .sd-top .user-thumb .no-thumb {
    background-color: #e7e7e7;
    position: relative;
}

.acc-sidebar .sd-top .user-thumb .no-thumb::after {
    content: '';
    padding-top: 100%;
    display: block;
}

.acc-sidebar .sd-top .user-thumb .no-thumb .material-symbols-outlined {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #979797;
    font-size: 32px;
}

.acc-sidebar .sd-top .user-info {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    justify-content: center;
}

.acc-sidebar .sd-top .user-info .user-name {
    font-weight: 600;
    font-size: 1.1em;
    margin-bottom: .2em;
}

.acc-sidebar .sd-top .user-info .user-role {
    font-size: .85em;
    color: #7e7e7e;
}

.acc-sidebar .sd-menus {
    flex: 1 1 0;
    overflow-y: auto;
    padding: 0 20px;
}

.acc-sidebar .sd-menus .menu-gp+.menu-gp {
    margin-top: 30px;
}

.acc-sidebar .sd-menus .menu-gp .gp-name {
    font-size: .8em;
    font-weight: 500;
}

.acc-sidebar .sd-menus .menu-gp .gp-items .menu-item {
    display: block;
    position: relative;
    color: #333;
    padding: 6px 0 6px 29px;
}

.acc-sidebar .sd-menus .menu-gp .gp-items .menu-item.active {
    font-weight: 600;
    color: var(--linkColor);
}

.acc-sidebar .sd-menus .menu-gp .gp-items .menu-item .icon {
    position: absolute;
    top: 7px;
    left: 0;
    font-size: 1.4em;
    color: #a0a0a0;
}

.acc-sidebar .sd-menus .menu-gp .gp-items .menu-item.active .icon {
    color: var(--linkColor);
}

.acc-sidebar .sd-logout {
    margin-top: 15px;
}

.acc-sidebar .sd-logout a {
    display: block;
    text-align: center;
    padding: 11px 0 20px;
    color: #000;
}

.acc-sidebar .sd-logout a:hover {
    color: var(--linkColor);
}

.acc-sidebar .sd-logout a .material-symbols-outlined {
    font-size: 1.2em;
    vertical-align: sub;
}


/*  user badge  */

.user-badge-img {
    border-radius: 50%;
    line-height: 0;
    margin-left: 15px;
    overflow: hidden;
    width: 50px;
    align-self: flex-start;
    background-image: url('../../images/badge-50x50.png');
}

.user-badge-img.bronze {
    background-position-x: 0px;
    height: 50px;
}

.user-badge-img.silver {
    background-position-x: 270px;
    height: 50px;
}

.user-badge-img.gold {
    background-position-x: 216px;
    height: 50px;
}

.user-badge-img.platinum {
    background-position-x: 162px;
    height: 50px;
}

.user-badge-img.diamond {
    background-position-x: 106px;
    height: 50px;
}

.user-badge-img.pinnacle {
    background-position-x: 52px;
    height: 50px;
}


/*  user badge ends  */

.page-account .acc-body {
    flex: 1 1 0;
    min-height: calc(100vh - 237px);
    display: flex;
    flex-direction: column;
}

.gl-cart-btn {
    position: fixed;
    left: 30px;
    bottom: 30px;
    width: 65px;
    height: 65px;
    background-color: #C51F6F;
    border-radius: 50%;
    color: #fff;
    box-shadow: 5px 7px 10px rgba(0, 0, 0, .16);
}

.gl-cart-btn:hover {
    color: #fff;
}

.gl-cart-btn .icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.gl-cart-btn .cart-count {
    font-size: .9em;
    font-weight: 600;
    width: 30px;
    height: 30px;
    background-color: #CD6DA6;
    border: 3px solid #fff;
    display: flex;
    position: absolute;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    top: 0;
    right: -9px;
    box-shadow: 5px 7px 10px rgba(0, 0, 0, .16);
}


/* sidebar filter */

.sidebar-filter {
    background-color: #fff;
    border: 1px solid #F1F1F1;
    border-radius: 21px;
    filter: drop-shadow(0px 0px 50px rgba(0, 0, 0, 0.14));
    height: calc(100% - 6px);
    padding: 20px;
    position: fixed;
    left: -400px;
    top: 3px;
    transition: left 200ms ease-in 0s;
    width: 370px;
    z-index: 1001;
}

.sidebar-filter.active {
    left: 1px;
}

.sidebar-filter .inner-section {
    height: calc(100% - 125px);
    overflow-x: hidden;
    overflow-y: auto;
    position: absolute;
    top: 55px;
    width: calc(100% - 21px);
}

.sidebar-filter .safe-right {
    padding-right: 20px;
}

.sidebar-filter .actions {
    bottom: 18px;
    left: 0;
    position: absolute;
    padding-left: 20px;
    width: 100%;
}

.sidebar-filter .filter-hed .f-icon {
    font-size: 1.5em;
    vertical-align: middle;
}

.sidebar-filter .filter-hed .f-txt {
    font-size: 1.21em;
    vertical-align: middle;
    font-weight: 500;
}

.sidebar-filter .colour-box .clr-item {
    width: 30px;
    background-color: #eee;
    text-shadow: 0 0 2px #000;
    height: 30px;
    border: 2px solid #000;
    cursor: pointer;
    border-radius: 6px;
    position: relative;
    display: inline-block;
    margin: 0 5px 5px;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    font-size: 13px;
}

.sidebar-filter .colour-box .clr-item::after {
    position: absolute;
    content: "";
    background-color: rgba(0, 0, 0, 0.2);
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
    z-index: 1;
}

.sidebar-filter .colour-box .clr-item:hover::after {
    display: block;
}

.sidebar-filter .colour-box .clr-item .material-icons-outlined {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    z-index: 2;
}

.sidebar-filter .colour-box .clr-item input {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    font-size: 0.95em;
}

.sidebar-filter .colour-box .clr-item input:checked+.material-icons-outlined {
    display: block;
}

.sidebar-filter .colour-box .clr-item .hover-text {
    background-color: #000;
    border-radius: 6px;
    color: #fff;
    display: none;
    left: 50%;
    max-width: none;
    padding: 4px 7px;
    position: absolute;
    text-align: center;
    top: -31px;
    transform: translateX(-50%);
    white-space: nowrap;
    width: auto;
}

.sidebar-filter .colour-box .clr-item:hover>.hover-text {
    display: block;
}

.form-row .form-label {
    color: #000;
    font-size: 0.9em;
    font-weight: 600;
    margin-bottom: 6px;
}

.form-row .form-input .text-input,
.form-row .form-input .inp-select {
    background-color: #fcfcfc;
    border: 1px solid #d4d4d4;
    padding: 12px 15px;
    border-radius: 8px;
    width: 100%;
}

.form-row .form-input .text-input:focus {
    border-color: #aeaeae;
    background-color: #fff;
}

.form-row .form-input .text-input:disabled {
    opacity: .5;
}

.form-row .form-input .date-range-box {
    display: flex;
}

.form-row .form-input .date-range-box .dt-box {
    width: calc(50% - 15px);
}

.form-row .form-input .date-range-box .dt-sep {
    text-align: center;
    width: 30px;
    padding-top: 10px;
}

.bubble-item {
    display: inline-block;
    width: auto;
    /* padding:4px 16px; */
    padding: 4px 30px 4px 16px;
    background-color: #D9D9D9;
    border-radius: 49px;
    margin: 0 5px 18px;
    color: #757F93;
    position: relative;
}

.bubble-item span {
    color: #000;
    font-size: 13px;
    font-weight: 600;
    margin-right: 8px;
}

.bubble-close span.material-symbols-outlined {
    color: #000;
    line-height: 1;
    padding-left: 4px;
}

.bubble-item a.bubble-close {
    position: absolute;
    top: 8px;
    padding-left: 3px;
}


/* tab group */

.pix-tab-groups {
    display: inline-block;
    border-bottom: 1px solid #B7B7B7;
    width: 100%;
    font-size: 14px;
}

.pix-tab-groups .tab-btn {
    display: inline-block;
    position: relative;
    padding: 16px 25px;
    font-weight: 600;
    color: #556C81;
    transition: color .2s;
}

.pix-tab-groups .tab-btn:hover,
.pix-tab-groups .tab-btn.active {
    color: #003C46;
    border-bottom: 3px solid #AAB161;
}

.pix-tab-groups .tab-btn .material-icons-outlined {
    position: absolute;
    top: 17px;
    left: 15px;
}


/* tab group ends */


/* order list */

.mdl-orders-list .od-item {
    padding: 20px;
    background-color: #fff;
    border-radius: 30px;
    box-shadow: 2px 2px 8px rgba(0, 0, 0, .05);
}

.mdl-orders-list .od-item+.od-item {
    margin-top: 50px;
}

.mdl-orders-list .od-item .od-head {
    display: flex;
    border-bottom: 1px solid #EAE8E8;
    padding-bottom: 15px;
    margin-bottom: 19px;
    justify-content: space-between;
}

.mdl-orders-list .od-item .od-head .head-left {
    margin-right: 30px;
    display: flex;
    align-items: center;
}

.mdl-orders-list .od-item .od-head .head-left .od-id {
    color: #013C46;
    font-size: 1.15em;
    font-weight: 500;
    margin-right: 20px;
}

.mdl-orders-list .od-item .od-head .head-left .od-status {
    background-color: #A8E69E;
    color: #083001;
    border-radius: 25px;
    padding: 1px 9px;
    font-size: .92em;
    font-weight: 500;
}

.mdl-orders-list .od-item .od-head .head-left .od-status.dispatched {
    background-color: #deb887;
}

.mdl-orders-list .od-item .od-head .head-left .od-status.delivered {
    background-color: #00ad00;
    color: #fff;
}

.mdl-orders-list .od-item .od-head .head-left .od-status.cancelled {
    background-color: #f00;
    color: #fff;
}

.mdl-orders-list .od-item .od-head .head-left .od-status.refunded {
    background-color: #ff6347;
    color: #fff;
}

.mdl-orders-list .od-item .od-head .head-left .od-status.returned {
    background-color: #708090;
    color: #fff;
}

.mdl-orders-list .od-item .od-head .head-left .od-status.shipped {
    background-color: #b0e0e6;
}

.mdl-orders-list .od-item .od-head .head-right .od-details-btn {
    background-color: #f194cb;
    color: #B6276B;
    font-size: .92em;
    padding: 7px 21px 7px 13px;
    border-radius: 20px;
    display: inline-block;
    border: 1px solid #B6276B;
    font-weight: 500;
    transition: background-color .25s;
}

.mdl-orders-list .od-item .od-head .head-right .od-details-btn:hover {
    background-color: #ffafe6;
}

.mdl-orders-list .od-item .od-body {
    display: flex;
    justify-content: space-between;
}

.mdl-orders-list .od-item .od-body .od-info {
    flex: 0 1 950px;
    margin-right: 40px;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp {
    display: flex;
    justify-content: space-between;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-location {
    margin-right: 40px;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-location .cus-name {
    color: #464545;
    font-weight: 600;
    display: flex;
    margin-bottom: 20px;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-location .cus-name .icon {
    margin-right: 8px;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-location .cus-adr .fld-title {
    color: #013C46;
    font-size: 1.15em;
    font-weight: 500;
    margin-bottom: 10px;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-location .cus-adr .adr-name {
    color: #464545;
    font-weight: 500;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-location .cus-adr .adr-body {
    color: #464545;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-campaign .camp-view {
    display: flex;
    margin-bottom: 22px;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-campaign .camp-view .cp-thumb {
    width: 47px;
    margin-right: 10px;
    line-height: 0;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-campaign .camp-view .cp-thumb img {
    width: 100%;
    border-radius: 7px;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-campaign .camp-view .cp-thumb .no-img {
    background-color: #e7e7e7;
    border-radius: 7px;
    padding-top: 100%;
    position: relative;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-campaign .camp-view .cp-thumb .no-img .icon {
    font-size: 25px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-campaign .camp-view .cp-info {
    align-self: center;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-campaign .camp-view .cp-info .cp-name {
    color: #12A2BA;
    margin-bottom: 9pe;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-campaign .camp-view .cp-info .og-name {
    color: #595959;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-campaign .od-oth-status {
    display: flex;
    flex-wrap: wrap;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-campaign .od-oth-status+.od-oth-status {
    margin-top: 6px;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-campaign .od-oth-status .stat-label {
    width: 130px;
    color: #013C46;
    font-weight: 500;
}

.mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-campaign .od-oth-status .stat-text {
    flex: 1 1 35px;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost {
    border-top: 1px solid #eae8e8;
    display: flex;
    justify-content: space-between;
    margin-top: 17px;
    padding-top: 17px;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-prog {
    flex: 0 1 570px;
    margin-right: 40px;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-prog .od-prog-bar {
    display: flex;
    margin: 20px 20px 0;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-prog .od-prog-bar .prog-point {
    flex: 1 1 0;
    text-align: right;
    position: relative;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-prog .od-prog-bar .prog-point:first-child {
    width: 28px;
    flex: unset;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-prog .od-prog-bar .prog-point::before {
    content: '';
    display: block;
    position: absolute;
    top: 14px;
    left: 0;
    width: 100%;
    border-top: 1px solid #D9D9D9;
    z-index: 1;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-prog .od-prog-bar .prog-point .prog-icon {
    background-color: #E6E6E6;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    margin-left: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .85em;
    color: #8A8A8A;
    margin-bottom: 7px;
    z-index: 2;
    position: relative;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-prog .od-prog-bar .prog-point .prog-text {
    transform: translateX(calc(50% - 14px));
    display: inline-block;
    max-width: none;
    white-space: nowrap;
    font-size: .92em;
    color: #595959;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-prog .od-prog-bar .prog-point:first-child .prog-text {
    transform: translateX(calc(-50% + 14px));
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-prog .od-prog-bar .prog-point.active .prog-icon,
.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-prog .od-prog-bar .prog-point:first-child .prog-icon {
    background-color: #42c92c;
    color: #fff;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-prog .od-prog-bar .prog-point.error .prog-icon {
    background-color: #f00;
    color: #fff;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-prog .od-prog-bar .prog-point.active::before {
    border-top-color: #42c92c;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-prog .od-prog-bar .prog-point.error::before {
    border-top-color: #f00;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-cost .od-placed {
    display: flex;
    color: #676161;
    font-size: .92em;
    font-weight: 500;
    align-items: center;
    margin-bottom: 10px;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-cost .od-placed .icon {
    color: #087082;
    margin-right: 9px;
    font-size: 1.6em;
    align-self: flex-start;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-cost .od-amount {
    font-size: 1.54em;
    font-weight: 700;
    margin-bottom: 11px;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-cost .od-c-share {
    color: #1B9407;
    font-size: .77em;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-cost .od-c-share .material-symbols-outlined {
    margin-right: 6px;
    vertical-align: -4px;
    font-size: 1.7em;
}

.mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-cost .od-c-share .sh-amount {
    font-size: 1.3em;
    font-weight: 600;
}

.mdl-orders-list .od-item .od-body .od-items {
    flex: 0 1 350px;
}

.mdl-orders-list .od-item .od-body .od-items .od-pdt {
    display: flex;
    margin-bottom: 15px;
}

.mdl-orders-list .od-item .od-body .od-items .od-pdt .pt-thumb {
    width: 60px;
    margin-right: 10px;
    line-height: 0;
}

.mdl-orders-list .od-item .od-body .od-items .od-pdt .pt-thumb img {
    width: 100%;
    border-radius: 8px;
}

.mdl-orders-list .od-item .od-body .od-items .od-pdt .pt-thumb .no-thumb {
    border-radius: 8px;
    background-color: #e9e9e9;
    padding-top: 100%;
    position: relative;
}

.mdl-orders-list .od-item .od-body .od-items .od-pdt .pt-thumb .no-thumb .icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 1.5em;
    color: #a4a4a4;
}

.mdl-orders-list .od-item .od-body .od-items .od-pdt .pt-info {
    align-self: center;
}

.mdl-orders-list .od-item .od-body .od-items .od-pdt .pt-info .pt-name {
    font-weight: 600;
    color: #013C46;
    margin-bottom: 4px;
}

.mdl-orders-list .od-item .od-body .od-items .od-pdt .pt-info .pt-inv .pt-price {
    display: inline-block;
    margin-right: 21px;
    color: #040202;
    font-weight: 600;
}

.mdl-orders-list .od-item .od-body .od-items .od-pdt .pt-info .pt-inv .pt-qty {
    display: inline-block;
}


/* Order Details Model */

.mdl-order-details {
    width: 900px;
}

.mdl-order-details .od-head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    border-bottom: 1px solid #EAE8E8;
    padding-bottom: 20px;
    margin-bottom: 40px;
}

.mdl-order-details .od-head .od-stid {
    margin-right: 30px;
    display: flex;
    align-items: center;
}

.mdl-order-details .od-head .od-stid .od-id {
    color: #013C46;
    font-size: 1.15em;
    font-weight: 600;
    margin-right: 20px;
}

.mdl-order-details .od-head .od-stid .od-status {
    font-size: .92em;
    background-color: #A4E29A;
    border-radius: 25px;
    padding: 4px 15px;
}

.mdl-order-details .od-head .od-stid .od-status.dispatched {
    background-color: #deb887;
}

.mdl-order-details .od-head .od-stid .od-status.delivered {
    background-color: #00ad00;
    color: #fff;
}

.mdl-order-details .od-head .od-stid .od-status.cancelled {
    background-color: #f00;
    color: #fff;
}

.mdl-order-details .od-head .od-stid .od-status.refunded {
    background-color: #ff6347;
    color: #fff;
}

.mdl-order-details .od-head .od-stid .od-status.returned {
    background-color: #708090;
    color: #fff;
}

.mdl-order-details .od-head .od-stid .od-status.shipped {
    background-color: #b0e0e6;
}

.mdl-order-details .od-head .od-placed {
    margin-right: 30px;
}

.mdl-order-details .od-head .od-placed .pcd-label {
    font-size: .8em;
    color: #989898;
}

.mdl-order-details .od-head .od-placed .pcd-txt {
    font-weight: 500;
}

.mdl-order-details .od-customer {
    display: flex;
    width: 630px;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: 40px;
}

.mdl-order-details .od-customer .cus-ops {
    position: relative;
    padding-left: 23px;
    font-size: .92em;
    font-weight: 500;
}

.mdl-order-details .od-customer .cus-ops:not(:last-child) {
    margin-right: 20px;
}

.mdl-order-details .od-customer .cus-ops .icon {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 1.5em;
}

.mdl-order-details .od-adr-prog {
    display: flex;
    justify-content: space-between;
}

.mdl-order-details .od-adr-prog .od-adr {
    margin-right: 30px;
    width: 250px;
    border-bottom: 1px solid #D9D9D9;
    padding-bottom: 20px;
    margin-bottom: 30px;
}

.mdl-order-details .od-adr-prog .od-adr .adr-title {
    font-size: 1.15em;
    color: #013C46;
    font-weight: 500;
    margin-bottom: .25em;
}

.mdl-order-details .od-adr-prog .od-adr .adr-name {
    font-weight: 600;
}

.mdl-order-details .od-adr-prog .od-prog {
    flex: 1 1 0;
    max-width: 540px;
}

.mdl-order-details .od-adr-prog .od-prog .od-prog-bar {
    display: flex;
    margin: 20px 20px 0;
}

.mdl-order-details .od-adr-prog .od-prog .od-prog-bar .prog-point {
    flex: 1 1 0;
    text-align: right;
    position: relative;
}

.mdl-order-details .od-adr-prog .od-prog .od-prog-bar .prog-point:first-child {
    width: 28px;
    flex: unset;
}

.mdl-order-details .od-adr-prog .od-prog .od-prog-bar .prog-point::before {
    content: '';
    display: block;
    position: absolute;
    top: 14px;
    left: 0;
    width: 100%;
    border-top: 1px solid #D9D9D9;
    z-index: 1;
}

.mdl-order-details .od-adr-prog .od-prog .od-prog-bar .prog-point .prog-icon {
    background-color: #E6E6E6;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    margin-left: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .85em;
    color: #8A8A8A;
    margin-bottom: 7px;
    z-index: 2;
    position: relative;
}

.mdl-order-details .od-adr-prog .od-prog .od-prog-bar .prog-point .prog-text {
    transform: translateX(calc(50% - 14px));
    display: inline-block;
    max-width: none;
    white-space: nowrap;
    font-size: .92em;
    color: #595959;
}

.mdl-order-details .od-adr-prog .od-prog .od-prog-bar .prog-point:first-child .prog-text {
    transform: translateX(calc(-50% + 14px));
}

.mdl-order-details .od-adr-prog .od-prog .od-prog-bar .prog-point.active .prog-icon,
.mdl-order-details .od-adr-prog .od-prog .od-prog-bar .prog-point:first-child .prog-icon {
    background-color: #42c92c;
    color: #fff;
}

.mdl-order-details .od-adr-prog .od-prog .od-prog-bar .prog-point.error .prog-icon {
    background-color: #f00;
    color: #fff;
}

.mdl-order-details .od-adr-prog .od-prog .od-prog-bar .prog-point.active::before {
    border-top-color: #42c92c;
}

.mdl-order-details .od-adr-prog .od-prog .od-prog-bar .prog-point.error::before {
    border-top-color: #f00;
}

.mdl-order-details .od-oinfo-camp {
    display: flex;
    justify-content: space-between;
    margin-bottom: 60px;
    align-items: flex-start;
}

.mdl-order-details .od-oinfo-camp .od-oinfo {
    margin-right: 30px;
}

.mdl-order-details .od-oinfo-camp .od-oinfo .od-oth-status {
    display: flex;
    flex-wrap: wrap;
}

.mdl-order-details .od-oinfo-camp .od-oinfo .od-oth-status+.od-oth-status {
    margin-top: 6px;
}

.mdl-order-details .od-oinfo-camp .od-oinfo .od-oth-status .stat-label {
    width: 130px;
    color: #013C46;
    font-weight: 500;
}

.mdl-order-details .od-oinfo-camp .od-oinfo .od-oth-status .stat-text {
    flex: 1 1 35px;
}

.mdl-order-details .od-oinfo-camp .od-camp {
    display: flex;
}

.mdl-order-details .od-oinfo-camp .od-camp .cp-thumb {
    width: 47px;
    margin-right: 10px;
    line-height: 0;
}

.mdl-order-details .od-oinfo-camp .od-camp .cp-thumb img {
    width: 100%;
    border-radius: 7px;
}

.mdl-order-details .od-oinfo-camp .od-camp .cp-thumb .no-img {
    background-color: #e7e7e7;
    border-radius: 7px;
    padding-top: 100%;
    position: relative;
}

.mdl-order-details .od-oinfo-camp .od-camp .cp-thumb .no-img .icon {
    font-size: 25px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.mdl-order-details .od-oinfo-camp .od-camp .cp-info {
    align-self: center;
}

.mdl-order-details .od-oinfo-camp .od-camp .cp-info .cp-name {
    color: #12A2BA;
    margin-bottom: 9pe;
}

.mdl-order-details .od-oinfo-camp .od-camp .cp-info .og-name {
    color: #595959;
}

.mdl-order-details .od-extra {
    background-color: #ffe;
    margin-bottom: 40px;
    border: 1px solid #fc6;
    border-radius: 6px;
    padding: 20px;
}

.mdl-order-details .od-extra .xt-row {
    display: flex;
}

.mdl-order-details .od-extra .xt-row+.xt-row {
    margin-top: 14px;
}

.mdl-order-details .od-extra .xt-row .xt-label {
    font-weight: 600;
    color: #000;
    margin-right: 20px;
    width: 200px;
}

.mdl-order-details .od-extra .xt-row .xt-text {
    flex: 1 1 0;
}

.mdl-order-details .od-items {
    border-top: 1px solid #dddddd;
    padding-top: 30px;
}

.mdl-order-details .od-items .od-pdt {
    display: flex;
    justify-content: space-between;
}

.mdl-order-details .od-items .od-pdt+.od-pdt {
    margin-top: 20px;
}

.mdl-order-details .od-items .od-pdt .pt-box {
    display: flex;
    flex: 1 1 0;
    margin-right: 40px;
    position: relative;
    max-width: 680px;
}

.mdl-order-details .od-items .od-pdt .pt-box .pt-thumb {
    width: 60px;
    margin-right: 10px;
    line-height: 0;
}

.mdl-order-details .od-items .od-pdt .pt-box .pt-thumb img {
    width: 100%;
    border-radius: 8px;
}

.mdl-order-details .od-items .od-pdt .pt-box .pt-thumb .no-thumb {
    border-radius: 8px;
    background-color: #e9e9e9;
    padding-top: 100%;
    position: relative;
}

.mdl-order-details .od-items .od-pdt .pt-box .pt-thumb .no-thumb .icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 1.5em;
    color: #a4a4a4;
}

.mdl-order-details .od-items .od-pdt .pt-box .pt-info {
    align-self: center;
}

.mdl-order-details .od-items .od-pdt .pt-box .pt-info .pt-name {
    color: #013C46;
    font-weight: 500;
    margin-bottom: 7px;
}

.mdl-order-details .od-items .od-pdt .pt-box .pt-info .pt-inv .pt-price {
    color: #040202;
    font-weight: 600;
}

.mdl-order-details .od-items .od-pdt .pt-box .pt-info .pt-inv .pt-qty {
    color: #464545;
    font-size: .92em;
    position: absolute;
    top: 0;
    right: 0;
}

.mdl-order-details .od-items .od-pdt .pt-total {
    color: #040202;
    font-weight: 700;
}

.mdl-order-details .od-total {
    display: flex;
    justify-content: space-between;
    border-top: 1px solid #000;
    padding-top: 21px;
    margin-top: 40px;
    font-size: 1.54em;
    margin-bottom: 7px;
}

.mdl-order-details .od-total .total-lbl {
    margin-right: 30px;
    color: #6C6B6B;
}

.mdl-order-details .od-total .total-amt {
    color: #050505;
    font-weight: 600;
}

.mdl-order-details .od-camp-share {
    text-align: right;
}

.mdl-order-details .od-camp-share .camp-share-ob {
    display: inline-block;
    position: relative;
    padding-left: 28px;
    font-size: .85em;
    color: #1B9407;
}

.mdl-order-details .od-camp-share .camp-share-ob .icon {
    position: absolute;
    top: 1px;
    left: 0;
    font-size: 1.7em;
}


/* product selector module */

#modPrdtSelect .pickup-list {
    position: relative;
}

#modPrdtSelect .pickup-list .search-form {
    position: sticky;
    top: 0;
    z-index: 100;
    background-color: #fff;
}

#modPrdtSelect .pickup-list .search-form .fm-components {
    position: relative;
    width: 360px;
}

#modPrdtSelect .pickup-list .search-form .fm-components .search-input {
    width: 100%;
    padding-right: 40px;
}

#modPrdtSelect .pickup-list .search-form .fm-components .search-submit {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 39px;
    cursor: pointer;
}

#modPrdtSelect .pickup-list .search-form .fm-components .search-submit:hover {
    color: var(--linkColor);
}

#modPrdtSelect .pickup-list .pdts-list {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -15px;
    max-width: none;
}

#modPrdtSelect .pickup-list .pdts-list .prdt-item {
    width: calc(25% - 30px);
    margin: 0 15px 50px;
    text-align: center;
}

#modPrdtSelect .pickup-list .pdts-list .prdt-item .prdt-thumb {
    margin-bottom: 16px;
}

#modPrdtSelect .pickup-list .pdts-list .prdt-item .prdt-thumb img {
    width: 100%;
    border-radius: 15px;
}

#modPrdtSelect .pickup-list .pdts-list .prdt-item .prdt-thumb .prdt-no-thumb {
    padding-top: 100%;
    border-radius: 15px;
    background-color: #ececec;
    position: relative;
}

#modPrdtSelect .pickup-list .pdts-list .prdt-item .prdt-thumb .prdt-no-thumb .material-symbols-outlined {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 49px;
    color: #cacaca;
}

#modPrdtSelect .pickup-list .pdts-list .prdt-item .prdt-name {
    font-size: 1.2em;
    font-weight: 600;
    margin-bottom: .3em;
}

#modPrdtSelect .pickup-list .pdts-list .prdt-item .prdt-price {
    font-size: 1.1em;
    font-weight: 600;
    margin-bottom: .15em;
}

#modPrdtSelect .pickup-list .pdts-list .prdt-item .cmp-share {
    font-size: .9em;
    color: #00a800;
    margin-bottom: 1.5em;
}

#modPrdtSelect .pickup-list .loading {
    padding: 50px 0;
}

#modPrdtSelect .pickup-list .loading .pix-spinner {
    margin: 0 auto;
}

#modPrdtSelect .pickup-list #listError {
    padding: 20px 0 70px;
}

#modPrdtSelect .pickup-list #listError .material-symbols-outlined {
    color: #f00;
    font-size: 3em;
    margin-bottom: 10px;
}

#modPrdtSelect .pickup-list #listError .err-heading {
    font-weight: 600;
    font-size: 1.3em;
    margin-bottom: 5px;
}

#modPrdtSelect .pickup-list #listError .err-body {
    margin-bottom: 20px;
}

#modPrdtSelect .pickup-list #listError .round-btn {
    padding: 4px 15px;
}

#modPrdtSelect .pickup-list .no-result {
    text-align: center;
    padding: 20px 0 70px;
}

#modPrdtSelect .pickup-list .no-result .material-symbols-outlined {
    color: #f60;
    font-size: 2em;
    margin-bottom: 8px;
}

#modPrdtSelect .pickup-list .no-result .nr-heading {
    font-size: 1.3em;
    font-weight: 600;
    margin-bottom: 3px;
}


/* transactions list start */

.mdl-transactions-list .transaction-card {
    position: relative;
    background-color: #fff;
    padding: 20px;
    border-radius: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    margin-bottom: 50px;
}

.mdl-transactions-list .transaction-card .transaction-list {
    border-bottom: 1px solid #EFF1F5;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.mdl-transactions-list .transaction-card .transaction-list:last-child {
    border-bottom: none;
    padding-bottom: 0px;
    margin-bottom: 0px;
}

.mdl-transactions-list .transaction-card .transaction-list a {
    color: #003C46;
    display: flex;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-left {
    flex: 0 1 675px;
    display: flex;
    padding-right: 20px;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-left .trtn-id {
    display: block;
    flex: 0 1 290px;
    padding-right: 20px;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-left .trtn-id .tr-id {
    display: block;
    font-weight: 500;
    margin-bottom: 5px;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-left .trtn-id .tr-id span {
    padding-left: 5px;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-left .trtn-id .tr-date {
    display: block;
    color: #959FA7;
    font-size: .8em;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-left .trtn-price {
    display: block;
    flex: 0 1 307px;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-left .trtn-price .tr-pr {
    display: block;
    font-weight: 600;
    font-size: 1.1em;
    margin-bottom: 5px;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-left .trtn-price .tr-pr.negative {
    color: #f00;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-left .trtn-price .tr-note {
    color: #959FA7;
    font-size: .8em;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right {
    flex: 0 1 750px;
    display: flex;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-cust {
    display: flex;
    position: relative;
    width: calc(33.33%);
    margin-right: 10px;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-cust .cust-thumb {
    display: block;
    border-radius: 50%;
    line-height: 0;
    margin-right: 20px;
    overflow: hidden;
    width: 40px;
    align-self: flex-start;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-cust .cust-thumb .no-thumb {
    background-color: #e7e7e7;
    position: relative;
    display: block;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-cust .cust-thumb .no-thumb::after {
    content: '';
    padding-top: 100%;
    display: block;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-cust .cust-thumb .no-thumb .no-thmb {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #979797;
    font-size: 32px;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-cust .cust-info {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-cust .cust-info .cust-role {
    display: block;
    color: #959FA7;
    font-size: .8em;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-cust .cust-info .cust-name {
    display: block;
    font-weight: 600;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-status {
    display: block;
    width: calc(33.33%);
    margin-right: 10px;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-status .trtn-type {
    display: block;
    position: relative;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-status .trtn-type .tp-label {
    display: block;
    font-size: .8em;
    color: #959FA7;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-status .trtn-type .tr-type {
    font-weight: 600;
    display: block;
    margin-bottom: 5px;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-status .trtn-sts {
    display: block;
    position: relative;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-status .succ {
    color: #1B9407;
    font-weight: 500;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-status .pend {
    color: #FD3801;
    font-weight: 500;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-org {
    display: flex;
    position: relative;
    width: calc(33.33%);
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-org .org-thumb {
    line-height: 0;
    margin-right: 15px;
    overflow: hidden;
    width: 40px;
    align-self: flex-start;
    border: 1px solid #D9D9D9;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-org .org-thumb .no-img {
    background-color: #e7e7e7;
    position: relative;
    display: block;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-org .org-thumb .no-img::after {
    content: '';
    padding-top: 100%;
    display: block;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-org .org-thumb .no-img .icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #979797;
    font-size: 32px;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-org .org-info {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-org .org-info .org-name {
    font-weight: 600;
    display: block;
}

.mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-org .org-info .orgnzr-name {
    font-size: .8em;
    color: #959FA7;
}


/* transactions list ends */

.mdl-orgzn-wrap {
    display: flex;
}

.mdl-orgzn-wrap .ognzr-info {
    flex: 1 1 0;
    max-width: none;
    display: flex;
    position: relative;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-thumb {
    width: 300px;
    position: relative;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-thumb img {
    width: 100%;
    border-radius: 30px;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-thumb .no-img {
    background-color: #EBE9E9;
    padding-top: 100%;
    border-radius: 30px;
    position: relative;
    display: block;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-thumb .no-img .usr-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 6em;
    color: #C9C9C9;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-thumb .editbtn {
    text-align: center;
    margin-top: 5px;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info {
    width: calc(100% - 330px);
    margin-left: 30px;
    color: #5B5B5B;
    font-size: 1em;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgnzr-name {
    font-weight: 800;
    font-size: 1.85em;
    margin-bottom: 8px;
    letter-spacing: 1px;
    color: #003C46;
    text-transform: capitalize;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgnzn-type {
    margin-bottom: 10px;
    font-weight: 700;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-phn {
    margin-bottom: 7px;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-link {
    margin-bottom: 10px;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-link a {
    color: #0491A9;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -10px;
    max-width: none;
    margin-top: 27px;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .items {
    background-color: #94dcd8;
    margin: 0 10px 20px;
    padding: 19px 54px 19px 22px;
    border-radius: 20px;
    position: relative;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .items .item-amount {
    color: #020001;
    font-size: 1.84em;
    font-weight: 600;
    margin-bottom: 10px;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .items .item-text {
    color: #38807c;
    font-size: 1.15em;
    font-weight: 600;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .items .item-icn {
    position: absolute;
    top: 16px;
    right: 16px;
    color: #38807c;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .items .item-icn .icon {
    font-size: 2em;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .items:nth-child(2) {
    background-color: #D2D89B;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .items:nth-child(2) .item-text,
.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .items:nth-child(2) .item-icn {
    color: #717A0D;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .items:nth-child(3) {
    background-color: #fafad2;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .items:nth-child(3) .item-text,
.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .items:nth-child(3) .item-icn {
    color: #8a8a31;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .items:nth-child(4) {
    background-color: #A5EFFC;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .items:nth-child(4) .item-text,
.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .items:nth-child(4) .item-icn {
    color: #126877;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .som-txt-btn {
    margin-top: 10px;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .som-txt-btn .dl-btn {
    background-color: rgba(0, 0, 0, 0.35);
    border-radius: 30px;
    color: #fff;
    font-size: 1em;
    padding: 4px 15px;
    display: inline-block;
    transition: background-color .3s;
}

.mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details .som-txt-btn .dl-btn:hover {
    background-color: rgba(0, 0, 0, 0.15);
}

.mdl-payouts {
    display: flex;
    flex-direction: column;
}

.mdl-payouts .payout-list-item {
    flex-wrap: wrap;
    display: flex;
    flex: 1 1 0;
    margin: 0 -15px 30px;
    max-width: none;
}

.mdl-payouts .payout-list-item+.payout-list-item {
    border-top: #D9D9D9 1px dashed;
    padding-top: 30px;
}

.mdl-payouts .payout-list-item .item {
    color: #556C81;
    margin: 0 15px;
}

.mdl-payouts .payout-list-item .item.date {
    flex: .25 1 0;
    width: auto;
}

.mdl-payouts .payout-list-item .item.bankinfo {
    flex: 0.45 1 0;
    padding-left: 30px;
    position: relative;
}

.mdl-payouts .payout-list-item .item.bankinfo .icon {
    position: absolute;
    top: 3px;
    left: 0;
}

.mdl-payouts .payout-list-item .item.bankinfo .bank-info .info-row {
    display: flex;
}

.mdl-payouts .payout-list-item .item.bankinfo .bank-info .info-row+.info-row {
    margin-top: 3px;
}

.mdl-payouts .payout-list-item .item.bankinfo .bank-info .info-row .info-label {
    font-weight: 600;
    width: 100px;
    padding-right: 15px;
}

.mdl-payouts .payout-list-item .item.bankinfo .bank-info .info-row .info-text {
    flex: 1 1 0;
}

.mdl-payouts .payout-list-item .item.amunt {
    color: #000;
    flex: .2 1 0;
    font-size: 1.3em;
    font-weight: 600;
    text-align: right;
}

.mdl-payouts .payout-list-item .item.stat-trans {
    display: flex;
    flex: 1 1 0;
    flex-wrap: wrap;
}

.mdl-payouts .payout-list-item .trnsctn-dtls {
    flex: 1 1 200px;
    padding-left: 30px;
    position: relative;
}

.mdl-payouts .payout-list-item .trnsctn-dtls .icon {
    position: absolute;
    top: 3px;
    left: 0;
}

.mdl-payouts .payout-list-item .status {
    flex: 1 1 200px;
    margin-bottom: 15px;
    width: auto;
}

.mdl-payouts .payout-list-item .status .req-msg {
    background-color: #fff;
    font-size: .9em;
    border: 1px dashed #dadada;
    padding: 10px 20px;
    margin-bottom: 16px;
}

.mdl-payouts .payout-list-item .status .req-msg strong {
    font-weight: 600;
    margin-right: 6px;
}

#payoutFormReq .bank-list .bank-item {
    display: block;
    position: relative;
    padding-left: 28px;
    margin-bottom: 27px;
    font-size: .95em;
}

#payoutFormReq .bank-list .bank-item input {
    position: absolute;
    top: 0;
    left: 0;
}

#payoutFormReq .bank-list .bank-item span {
    display: block;
}

#payoutFormReq .bank-list .bank-item .bank-row {
    display: flex;
}

#payoutFormReq .bank-list .bank-item .bank-row+.bank-row {
    margin-top: 5px;
}

#payoutFormReq .bank-list .bank-item .bank-row .bn-label {
    font-weight: 600;
    width: 145px;
    padding-right: 20px;
}

#payoutFormReq .bank-list .bank-item .bank-row .bn-text {
    flex: 1 1 0;
}

@media only screen and (max-width: 1440px) and (min-width: 768px) {
    .acc-sidebar {
        width: 290px;
    }
}

@media only screen and (max-width: 1439px) and (min-width: 1299px) {
    .container.home {
        padding-left: 80px;
        padding-right: 80px;
    }
}

@media only screen and (max-width: 1440px) and (min-width: 1410px) {
    .mdl-transactions-list .transaction-card .transaction-list a .trtn-left {
        flex: 0 0 auto;
        width: 50%;
    }

    .mdl-transactions-list .transaction-card .transaction-list a .trtn-left .trtn-id {
        flex: 0 0 auto;
        width: 50%;
    }

    .mdl-transactions-list .transaction-card .transaction-list a .trtn-left .trtn-price {
        flex: 0 0 auto;
        width: 50%;
    }
}

@media only screen and (max-width:1439px) {
    .mdl-orders-list .od-item .od-body {
        display: block;
    }

    .mdl-orders-list .od-item .od-body .od-info {
        margin-bottom: 40px;
        margin-right: 0;
    }
}

@media only screen and (max-width: 1409px) {
    .mdl-transactions-list .transaction-card .transaction-list a {
        display: block;
    }

    .mdl-transactions-list .transaction-card .transaction-list a .trtn-left {
        padding-right: 0px;
        margin-bottom: 20px;
        justify-content: space-between;
    }

    .mdl-transactions-list .transaction-card .transaction-list a .trtn-left .trtn-price {
        text-align: right;
    }

    .mdl-transactions-list .transaction-card .transaction-list a .trtn-right {
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-org {
        width: auto;
    }
}

@media only screen and (max-width:1298px) {
    .container.home {
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media only screen and (max-width:1249px) {
    .mdl-payouts .payout-list-item .item.bankinfo {
        flex: 1 1 0;
    }

    .mdl-payouts .payout-list-item .item.stat-trans {
        flex: 0 0 calc(100% - 30px);
        margin-top: 30px;
        order: 3;
    }
}

@media only screen and (max-width: 1149px) {
    body {
        padding-top: 46px;
    }

    body.mob-menu-active {
        overflow: hidden;
    }

    .header {
        padding: 8px 5px 8px 50px;
        justify-content: space-between;
    }

    .header .nav-logo {
        width: 180px;
    }

    .header .nav-menu-btn {
        display: block;
    }

    .header .nav-right .nav-link-box .mob-nav-bg {
        opacity: 0;
        visibility: hidden;
        display: block;
    }

    body.mob-menu-active .header .nav-right .nav-link-box .mob-nav-bg {
        opacity: 1;
        visibility: visible;
    }

    .header .nav-right .nav-link-box .nav-links {
        background-color: #94dcd8;
        height: 100%;
        left: -450px;
        position: fixed;
        top: 0;
        width: 350px;
        z-index: 2001;
        transition: left .3s;
        max-width: calc(100% - 70px);
    }

    body.mob-menu-active .header .nav-right .nav-link-box .nav-links {
        left: 0;
    }

    .header .nav-right .nav-link-box .nav-links .nav-close-btn {
        background-color: #62beba;
        display: flex;
        position: absolute;
        right: 0;
        transform: translateX(100%);
        color: #fff;
        width: 0;
        height: 60px;
        justify-content: center;
        align-items: center;
        border-radius: 0 12px 12px 0;
        cursor: pointer;
        overflow: hidden;
        transition: width .15s ease .3s;
    }

    body.mob-menu-active .header .nav-right .nav-link-box .nav-links .nav-close-btn {
        width: 60px;
    }

    .header .nav-right .nav-link-box .nav-links .nav-close-btn .material-symbols-outlined {
        font-size: 1.8em;
    }

    .header .nav-right .nav-link-box .nav-links .nav-links-body {
        text-align: left;
        overflow-x: hidden;
        overflow-y: auto;
        word-wrap: break-word;
        padding: 0 0;
        height: 100%;
    }

    .header .nav-right .nav-link-box .nav-links .nav-links-body a {
        display: block;
        margin: 0;
        padding: 0;
        font-size: 1.3em;
        padding: 12px 30px;
    }

    .acc-sidebar {
        top: 70px;
        margin-right: 20px;
    }
}

@media only screen and (max-width: 1024px) and (min-width: 768px) {
    .footer .ft-left a {
        letter-spacing: 1px;
        margin: 0 2px;
    }

    .footer .ft-right .copy-right {
        margin-right: 5px;
    }

    .footer .ft-right .sc-media {
        margin-left: 5px;
    }

    .footer .ft-right .sc-media a+a {
        margin-left: 4px;
    }
}

@media only screen and (max-width: 1023px) {
    .header .nav-menu-profile {
        display: block;
    }

    .header .nav-right .nav-usr {
        display: none;
    }

    .user-menu-bg {
        display: block;
    }

    body.user-menu-active {
        overflow: hidden;
    }

    body.user-menu-active .user-menu-bg {
        visibility: visible;
        opacity: 1;
    }

    .acc-sidebar {
        background-color: #94dcd8;
        top: 0;
        right: -500px;
        position: fixed;
        z-index: 2001;
        border-radius: 0;
        height: 100%;
        max-height: none;
        width: 340px;
        max-width: calc(100% - 70px);
        transition: right .3s;
        overflow: visible;
    }

    .acc-sidebar .sd-menus {
        font-size: 1.1em;
    }

    .acc-sidebar .sd-menus .menu-gp .gp-items .menu-item .icon {
        color: #000;
    }

    .page-body:not(.page-account) .acc-sidebar {
        display: flex;
    }

    body.user-menu-active .acc-sidebar {
        right: -20px;
    }

    .acc-sidebar .nav-close-btn {
        background-color: #62beba;
        display: flex;
        position: absolute;
        left: 0;
        transform: translateX(-100%);
        color: #fff;
        width: 0;
        height: 60px;
        justify-content: center;
        align-items: center;
        border-radius: 12px 0 0 12px;
        cursor: pointer;
        overflow: hidden;
        transition: width .15s ease .3s;
    }

    body.user-menu-active .acc-sidebar .nav-close-btn {
        width: 60px;
    }

    .acc-sidebar .nav-close-btn .material-symbols-outlined {
        font-size: 1.8em;
    }
}

@media only screen and (max-width:879px) and (min-width:640px) {
    #modPrdtSelect .pickup-list .pdts-list .prdt-item {
        width: calc(33.33% - 30px);
    }
}

@media only screen and (max-width: 768px) {
    .mdl-transactions-list .transaction-card .transaction-list a {
        font-size: 1.1em;
    }

    .mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-cust {
        width: auto;
        margin-bottom: 20px;
    }

    .mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-cust.abs {
        position: absolute;
    }

    .mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-status {
        width: auto;
        margin-bottom: 20px;
    }

    .mdl-transactions-list .transaction-card .transaction-list a .trtn-right .trtn-org {
        width: auto;
    }
}

@media only screen and (max-width: 767px) {

    /* .container.home {
        padding-left: 15px;
        padding-right: 15px;
    } */
    .pagination a {
        border-radius: 4px;
        height: auto;
        padding: 8px 12px;
        width: auto;
    }

    .footer {
        display: block;
        padding: 30px 15px;
    }

    .footer .ft-left {
        padding-left: 0px;
    }

    .footer .ft-left a {
        margin-bottom: 15px;
        display: block;
    }

    .footer .ft-right {
        display: block;
        margin: 0 -15px;
    }

    .footer .ft-right .copy-right {
        margin-bottom: 15px;
    }

    .mdl-orgzn-wrap .ognzr-info {
        display: block;
    }

    .mdl-orgzn-wrap .ognzr-info .orgnzr-thumb {
        width: 300px;
        margin: 0 auto;
    }

    .mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info {
        width: 100%;
        margin-left: 0;
        text-align: center;
        margin-top: 30px;
    }
}

@media only screen and (max-width:719px) {
    .mdl-orders-list .od-item .od-head .head-left {
        display: block;
        margin-right: 0;
    }

    .mdl-orders-list .od-item .od-body .od-info {
        display: flex;
        flex-direction: column;
    }

    .mdl-orders-list .od-item .od-body .od-info .od-loc-camp {
        display: block;
        margin-top: 40px;
        order: 1;
    }

    .mdl-orders-list .od-item .od-body .od-info .od-prog-cost {
        border-top: medium none;
        display: block;
        margin-top: 0;
        padding-top: 0;
    }

    .mdl-orders-list .od-item .od-body .od-info .od-prog-cost .od-prog {
        margin-bottom: 40px;
        margin-right: 0;
    }

    .mdl-orders-list .od-item .od-body .od-info .od-loc-camp .od-location {
        margin-bottom: 30px;
        margin-right: 0;
    }
}

@media only screen and (max-width:639px) and (min-width:480px) {
    #modPrdtSelect .pickup-list .pdts-list .prdt-item {
        width: calc(50% - 30px);
    }
}

@media only screen and (max-width:549px) {
    .mdl-order-details .od-customer {
        margin-bottom: 0px;
    }

    .mdl-order-details .od-adr-prog {
        flex-direction: column;
    }

    .mdl-order-details .od-adr-prog .od-adr {
        border-bottom: none;
        order: 2;
        margin-bottom: 0;
    }

    .mdl-order-details .od-adr-prog .od-prog {
        order: 1;
        margin-bottom: 20px;
    }
}

@media only screen and (max-width:520px) {

    .mdl-payouts .payout-list-item .item.date,
    .mdl-payouts .payout-list-item .item.amunt {
        flex: 1 1 0;
    }

    .mdl-payouts .payout-list-item .item.bankinfo {
        flex: 0 0 calc(100% - 30px);
        margin-top: 30px;
        order: 1;
    }
}

@media only screen and (max-width:479px) {
    #modPrdtSelect .pickup-list .pdts-list {
        display: block;
    }

    #modPrdtSelect .pickup-list .pdts-list .prdt-item {
        width: auto;
    }

    #payoutFormReq .bank-list .bank-item .bank-row {
        display: block;
    }

    #payoutFormReq .bank-list .bank-item .bank-row .bn-label {
        padding-right: 0;
        width: auto;
    }
}

@media only screen and (max-width:460px) {
    .mdl-order-details .od-head .od-stid {
        margin-bottom: 10px;
    }

    .mdl-order-details .od-head {
        margin-bottom: 20px;
    }

    .mdl-order-details .od-customer {
        display: block;
    }

    .mdl-order-details .od-customer .cus-ops {
        margin-bottom: 5px;
    }

    .mdl-order-details .od-oinfo-camp {
        display: block;
        margin-bottom: 20px;
    }

    .mdl-order-details .od-oinfo-camp .od-oinfo {
        margin-bottom: 20px;
    }
}

@media only screen and (max-width: 425px) {
    .mdl-transactions-list .transaction-card .transaction-list a .trtn-left {
        display: block;
    }

    .mdl-transactions-list .transaction-card .transaction-list a .trtn-left .trtn-id {
        padding-right: 0px;
        margin-bottom: 20px;
    }

    .mdl-transactions-list .transaction-card .transaction-list a .trtn-left .trtn-price {
        text-align: left;
    }
}

@media only screen and (max-width:400px) {
    .mdl-orgzn-wrap .ognzr-info .orgnzr-dtl-info .orgzn-details {
        display: block;
    }

    .mdl-orgzn-wrap {
        display: block;
    }
}