:root {
    --pk-light-alt: #eceff4;
    --pk-blue: #057cff;
    --pk-orange: #ff902e;
    --pk-red: #e94a60;
    --pk-yellow: #fdce1b;
    --pk-yellow-alt: #f4eebf;
    --bs-font-sans-serif: 'Poppins', sans-serif;
    --pk-font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
    --pk-green-light: #b4e88a;
    --pk-gray-alt: #aaa;
    --pk-purple-alt: #7448aa;
}

h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
    font-weight: 600;
}

.font-serif {
    font-family: var(--pk-font-serif);
}

.form-control::placeholder {
    opacity: 0.5;
}

.small-1 {
    font-size: 0.75em;
}

.small-2 {
    font-size: 0.625em;
}

.small-3 {
    font-size: 0.5em;
}

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

.bg-blue {
    background-color: var(--pk-blue) !important;
}

.bg-orange {
    background-color: var(--pk-orange) !important;
}

.bg-red {
    background-color: var(--pk-red) !important;
}

.bg-yellow {
    background-color: var(--pk-yellow) !important;
}

.bg-light-alt {
    background-color: var(--pk-light-alt) !important;
}

.bg-green-alt {
    background-color: var(--pk-green-light) !important;
}

.bg-gray-alt {
    background-color: var(--pk-gray-alt) !important;
}

.bg-purple-alt {
    background-color: var(--pk-purple-alt) !important;
}

.border-light-alt {
    border-color: var(--pk-light-alt) !important;
}

.w-1r {
    width: 1rem;
}

.w-1\.5r {
    width: 1.5rem;
}

.w-3r {
    width: 3rem;
}

.w-4r {
    width: 4rem;
}

.w-fit-content {
    width: fit-content;
}

.h-4r {
    height: 4rem;
}


.btn {
    border-radius: 0;
    padding: 0.5rem 1.25rem;
}

.btn-sm {
    padding: 0.375rem 0.9375rem;
}

.btn-lg {
    padding: 0.625rem 1.5625rem;
}

.card {
    border-radius: 0;
}

.nav-tabs {
    border-bottom: none;
}

    .nav-tabs .nav-item {
        flex: 1 1 auto;
        text-align: center;
    }

@media (min-width: 576px) {
    .nav-tabs .nav-item {
        flex: none;
    }
}

.nav-tabs .nav-item .nav-link {
    color: var(--bs-dark);
    text-decoration: none;
}

@media (min-width: 992px) {
    .nav-tabs .nav-item .nav-link {
        padding-left: 3rem;
        padding-right: 3rem;
    }
}

.nav-tabs .nav-item .nav-link.active {
    background-color: transparent;
    border-color: transparent transparent var(--pk-yellow);
    border-bottom-width: 0.25rem;
    font-weight: 600;
}

.bi {
    font-family: bootstrap-icons;
}

body {
    font-weight: 300;
}

#app {
    background-color: var(--pk-light-alt);
}

#app-sidebar {
    background-image: url(sidebar-top.svg), url(sidebar-bottom.svg), linear-gradient(#f1f9fe, #f4f0cc 10%, #fecf07);
    background-position: top left, bottom left, top left;
    background-repeat: no-repeat;
    height: 100vh;
    position: fixed;
    overflow: auto;
    transition: transform .3s ease-in-out;
    z-index: 1030;
}

@media (min-width: 992px) {
    #app-sidebar {
        display: block;
        height: auto;
        position: static;
    }
}

#app-sidebar.collapse:not(.show) {
    display: block;
    transform: translateX(-100%);
}

@media (min-width: 992px) {
    #app-sidebar.collapse:not(.show) {
        transform: translateX(0);
    }
}

#app-sidebar.collapse.show {
    transform: translateX(0%);
}

#app-sidebar-close {
    background-color: transparent;
    border: 0;
    font-size: 1.5rem;
    height: 2rem;
    line-height: 1;
    outline: none;
    padding: 0;
    position: absolute;
    right: 0.5rem;
    top: 1rem;
    width: 2rem;
}

#app-sidebar-inner {
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
}

#app-sidebar-menu > ol > li {
    margin-bottom: 1rem;
}

#app-sidebar-menu .app-sidebar-menu-link {
    align-items: center;
    background-color: var(--bs-white);
    border-radius: 0.3rem;
    color: var(--bs-dark);
    display: flex;
    padding: 0.75rem 1.25rem;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

    #app-sidebar-menu .app-sidebar-menu-link:hover,
    #app-sidebar-menu .app-sidebar-menu-link:focus,
    #app-sidebar-menu .app-sidebar-menu-link:active {
        background-color: var(--bs-dark);
        color: var(--bs-white);
    }

    #app-sidebar-menu .app-sidebar-menu-link > .bi {
        font-size: 1.25rem;
    }

#app-sidebar-menu .app-sidebar-menu-link-active {
    background-color: var(--bs-dark);
    color: var(--bs-white);
}

#app-sidebar-menu .app-sidebar-submenu-link {
    color: var(--bs-dark);
    display: inline-block;
    margin: 0.5rem;
    text-decoration: none;
}

#app-sidebar-menu .app-sidebar-submenu-link-active {
    color: var(--bs-red);
    font-weight: 400;
}

#app-sidebar-follow .follow-link {
    color: var(--bs-dark);
    display: inline-block;
    font-size: 2rem;
    padding: 0.5rem;
    text-decoration: none;
}

#app-sidebar-toggler {
    border: 0;
    background-color: transparent;
    color: var(--bs-dark);
    font-size: 1.5rem;
    height: 2rem;
    line-height: 1;
    margin-left: -2rem;
    margin-right: -0.25rem;
    margin-top: -0.25rem;
    outline: none;
    padding: 0;
    width: 2rem;
}

#app-content {
    min-height: 100vh;
}

#app-nav-breadcrumb {
    --bs-breadcrumb-divider: '>';
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 768px) {
    #app-nav-breadcrumb {
        margin-left: 0;
        margin-right: 0;
    }
}

#app-nav-breadcrumb .breadcrumb-item {
    color: var(--bs-dark);
    display: none;
}

@media (min-width: 768px) {
    #app-nav-breadcrumb .breadcrumb-item {
        display: list-item;
    }
}

#app-nav-breadcrumb .breadcrumb-item:last-child {
    display: list-item;
}


#app-nav-breadcrumb .breadcrumb-item.active {
    color: var(--bs-dark);
    display: list-item;
}

#app-nav-breadcrumb .breadcrumb-item::before {
    color: var(--bs-dark);
    display: none;
}

@media (min-width: 768px) {
    #app-nav-breadcrumb .breadcrumb-item:before {
        display: block;
    }
}

#app-nav-breadcrumb .breadcrumb-item > a {
    color: var(--bs-dark);
    text-decoration: none;
}

#app-footer {
    background-color: var(--bs-white);
}

#app-hi-user-picture {
    font-size: 1.25rem;
    height: 4rem;
    text-align: center;
    width: 4rem;
}

#register-page #app-main-inner {
    margin-left: auto;
    margin-right: auto;
    max-width: 440px;
}

@media (min-width: 992px) {
    #register-page #app-main-inner {
        margin-left: 0;
        margin-right: 0;
    }
}

#register-page #app-sidebar-menu .app-sidebar-menu-link {
    justify-content: center;
}

#register-page #app-content {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

#register-page #app-nav-breadcrumb .breadcrumb-item {
    color: var(--bs-white);
}

#register-page #app-sidebar-toggler {
    color: var(--bs-white);
}

#register-card {
    margin-bottom: 6rem;
}

    #register-card .carousel-indicators {
        bottom: -4.5rem;
    }

        #register-card .carousel-indicators > li {
            background-color: var(--pk-light-alt);
            border-radius: 50%;
            height: 0.75rem;
            margin-left: 0.5rem;
            margin-right: 0.5rem;
            opacity: 1;
            width: 0.75rem;
        }

            #register-card .carousel-indicators > li.active {
                background-color: var(--pk-yellow);
            }

#register_form .form-control {
    border-top: none;
    border-left: none;
    border-radius: 0;
    border-right: none;
    outline: none;
    padding-left: 0;
    padding-right: 0;
}

#register_form_ic {
    border: 0.125rem dashed var(--bs-dark);
    padding: 0.75rem;
}

.register-hello-page #app-content {
    background-image: url("register-page-bg-1.jpg");
}

.register-verification-page #app-content {
    background-image: url("register-page-bg-2.jpg");
}

.register-id-page #app-content {
    background-image: url("register-page-bg-3.jpg");
}

.register-upload-page #app-content {
    background-image: url("register-page-bg-1.jpg");
}

.register-referral-page #app-content {
    background-image: url("register-page-bg-1.jpg");
}

.register-complete-page #app-content {
    background-image: url("register-page-bg-1.jpg");
}

#sign-in-page #app-main-inner {
    margin-left: auto;
    margin-right: auto;
    max-width: 440px;
}

@media (min-width: 992px) {
    #sign-in-page #app-main-inner {
        margin-left: 0;
        margin-right: 0;
    }
}

#sign-in-page #app-sidebar-menu .app-sidebar-menu-link {
    justify-content: center;
}

#sign-in-page #app-content {
    background-image: url("sign-in-page-bg.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

#sign-in-page #app-nav-breadcrumb .breadcrumb-item {
    color: var(--bs-white);
}

#sign-in-page #app-sidebar-toggler {
    color: var(--bs-white);
}

#sign_in_form .form-control {
    border-top: none;
    border-left: none;
    border-radius: 0;
    border-right: none;
    outline: none;
    padding-left: 0;
    padding-right: 0;
}

#welcome-page #app-main {
    background-image: none;
    background-position: 560px 160px;
    background-repeat: no-repeat;
    background-size: 560px;
}

@media (min-width: 1200px) {
    #welcome-page #app-main {
        background-image: url(welcome-page-bg.svg);
    }
}

#welcome-page #app-main-inner {
}

@media (min-width: 1200px) {
    #welcome-page #app-main-inner {
        max-width: 440px;
    }
}

#welcome-page-search-form-group {
    position: relative;
}

#welcome-page-search-form-group-submit-button {
    position: absolute;
    right: .5rem;
    top: .5rem;
}

#welcome-page-actions .row > .col-6 {
    position: relative;
}

    #welcome-page-actions .row > .col-6:before {
        content: '';
        display: block;
        padding-bottom: 100%;
    }

    #welcome-page-actions .row > .col-6 > :first-child {
        position: absolute;
        top: 0.5rem;
        left: 0.5rem;
        right: 0.5rem;
        bottom: 0.5rem;
    }

#welcome-page-actions > .d-grid {
    grid-template-columns: auto auto;
    grid-gap: 1rem;
}

    #welcome-page-actions > .d-grid > * {
        position: relative;
    }

        #welcome-page-actions > .d-grid > *:before {
            content: '';
            display: block;
            padding-bottom: 100%;
        }

        #welcome-page-actions > .d-grid > * > :first-child {
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
            bottom: 0;
        }

#welcome-page-actions .welcome-page-action {
    color: var(--bs-dark);
    text-decoration: none;
}

    #welcome-page-actions .welcome-page-action .bi:first-child {
        color: var(--bs-white);
        font-size: 1.5rem;
        position: absolute;
        right: 0.25rem;
        top: 0.25rem;
    }

    #welcome-page-actions .welcome-page-action .bi:nth-child(2) {
        color: var(--bs-white);
        font-size: 3rem;
    }

@media (min-width: 576px) {
    #welcome-page-actions .welcome-page-action .bi:nth-child(2) {
        font-size: 4rem;
    }
}

@media (min-width: 768px) {
    #welcome-page-actions .welcome-page-action .bi:nth-child(2) {
        font-size: 5rem;
    }
}

@media (min-width: 1200px) {
    #welcome-page-actions .welcome-page-action .bi:nth-child(2) {
        font-size: 3rem;
    }
}

#my-account-profile-form-image-preview {
    font-size: 3.75rem;
    height: 8rem;
    text-align: center;
    width: 8rem;
}

#my-account-bank-page #add-bank-verification-modal-form .form-control {
    border-top: none;
    border-left: none;
    border-radius: 0;
    border-right: none;
    outline: none;
    padding-left: 0;
    padding-right: 0;
}

#my-account-address-grid .address-card-info dt {
    font-weight: normal;
}

#my-account-address-grid .address-card-info dd {
}

@media (min-width: 576px) {
    #my-account-address-grid .address-card-info dd {
        font-weight: 600;
    }
}


#my-account-referral-overview-card-lead {
    background-image: linear-gradient(var(--pk-yellow), var(--pk-yellow-alt));
}

#my-account-referral-overview-card-illustration {
}

@media (min-width: 576px) {
    #my-account-referral-overview-card-illustration {
        max-width: 480px;
    }
}

#my-account-referral-overview-card-share-code {
    background-color: var(--pk-light-alt);
}

.my-pajak-listing-cart {
    margin: 0.5rem 0.75rem;
    position: relative;
}

    .my-pajak-listing-cart .badge {
        position: absolute;
        top: 0;
        right: 0;
        transform: translate(50%, -20%);
    }


#my-pajak-listing-page .pawn-card-item-link {
    color: var(--bs-dark);
    text-decoration: none;
}

#my-pajak-listing-page .pawn-card-item-info {
    /*font-size: 0.75em;*/
}

    #my-pajak-listing-page .pawn-card-item-info dt {
        font-weight: normal;
    }

    #my-pajak-listing-page .pawn-card-item-info dd {
        font-weight: 600;
        margin-bottom: 0;
    }

#my-pajak-listing-item-page #app-main-inner {
}

@media (min-width: 1200px) {
    #my-pajak-listing-item-page #app-main-inner {
        max-width: 480px;
    }
}

#my-pajak-listing-item-page .pawn-card-item-info dt {
    font-weight: normal;
}

#my-pajak-listing-item-page .pawn-card-item-info dd {
    font-weight: 600;
}

.my-pajak-redeem-page .pawn-card-item-info dt {
    font-weight: normal;
}

.my-pajak-redeem-page .pawn-card-item-info dd {
    font-weight: 600;
}

.my-pajak-redeem-online-banking-form .btn-check + .btn {
    box-shadow: none;
}

    .my-pajak-redeem-online-banking-form .btn-check + .btn + .bi {
        display: none;
    }

.my-pajak-redeem-online-banking-form .btn-check:checked + .btn + .bi {
    display: block;
}

#my-pajak-courier-shipping-information-card {
    background-image: repeating-linear-gradient(135deg, #183041 0px, #183041 1rem, transparent 1rem, transparent 1.5rem, #92220f 1.5rem, #92220f 2.5rem, transparent 2.5rem, transparent 3rem);
    border: none;
    padding-bottom: 0.5rem;
    padding-top: 0.5rem;
}

#my-pajak-address-grid .address-card-info dt {
    font-weight: normal;
}

#my-pajak-address-grid .address-card-info dd {
}

@media (min-width: 576px) {
    #my-pajak-address-grid .address-card-info dd {
        font-weight: 600;
    }
}

#pajak-points-overview-card-point-icon {
    font-size: 1.25rem;
    height: 4rem;
    width: 4rem;
}

#pajak-points-overview-card-illustration {
}

@media (min-width: 576px) {
    #pajak-points-overview-card-illustration {
        max-width: 480px;
    }
}

#pajak-points-balance-point-icon {
    font-size: 1.25rem;
    height: 4rem;
    width: 4rem;
}

#pajak-points-history-listing-top-toolbar .nav-tabs {
    border-bottom: none;
}

    #pajak-points-history-listing-top-toolbar .nav-tabs .nav-item {
        flex: 1 1 auto;
        text-align: center;
    }

@media (min-width: 992px) {
    #pajak-points-history-listing-top-toolbar .nav-tabs .nav-item {
        flex: none;
    }
}
.ErrorMsg {
    font-size: 10px;
    color: red;
}


#pajak-points-history-listing-top-toolbar .nav-tabs .nav-item .nav-link {
    color: var(--bs-dark);
    text-decoration: none;
}

@media (min-width: 992px) {
    #pajak-points-history-listing-top-toolbar .nav-tabs .nav-item .nav-link {
        padding-left: 3rem;
        padding-right: 3rem;
    }
}

#pajak-points-history-listing-top-toolbar .nav-tabs .nav-item .nav-link.active {
    background-color: transparent;
    border-color: transparent transparent var(--pk-yellow);
    border-bottom-width: 0.25rem;
    font-weight: 600;
}

#pajak-points-history-listing-grid .pajak-points-history-entry {
    border-bottom: 1px solid var(--pk-light-alt);
    margin-bottom: 1rem;
    padding-bottom: 1rem;
}

    #pajak-points-history-listing-grid .pajak-points-history-entry:last-child {
        border-bottom: none;
        margin-bottom: 0;
        padding-bottom: 0;
    }

#divEarning .pajak-points-history-entry {
    border-bottom: 1px solid var(--pk-light-alt);
    margin-bottom: 1rem;
    padding-bottom: 1rem;
}

    #divEarning .pajak-points-history-entry:last-child {
        border-bottom: none;
        margin-bottom: 0;
        padding-bottom: 0;
    }

#divClaimPoints .pajak-points-history-entry {
    border-bottom: 1px solid var(--pk-light-alt);
    margin-bottom: 1rem;
    padding-bottom: 1rem;
}

    #divClaimPoints .pajak-points-history-entry:last-child {
        border-bottom: none;
        margin-bottom: 0;
        padding-bottom: 0;
    }