* {
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

:root {
    --bs-primary: #5B3EF0;
    --bs-success: #26bf94;
    --bs-danger: #FA3276
}

a {
    cursor: pointer !important;
    text-decoration: none;
    color: inherit;
    transition: all .3s ease
}

ol, ul, li {
    list-style-type: none;
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0
}

h1, h2, h3, h4, h5, h6, figure, p, nav {
    margin: 0
}

button {
    background-color: rgba(0,0,0,0);
    border: 0;
    outline: 0 !important
}

img {
    max-width: 100%;
    vertical-align: top
}

::-moz-selection {
    color: #fff;
    background: #5b3ef0;
    text-shadow: none
}

::selection {
    background: #5b3ef0;
    color: #fff;
    text-shadow: none
}

html[data-overlayscrollbars] {
    width: auto;
    height: auto;
    min-width: 100%;
    min-height: 100%
}

body {
    background: #f2f2f2;
    padding-inline-end: 17px;
}

    body > .os-scrollbar-horizontal {
        display: none
    }

    body > .os-scrollbar {
        z-index: 1050;
        background: #fff;
        padding-block: 10px !important
    }

    body > .os-scrollbar-vertical {
        inset-block: 0 !important;
        right: 0 !important;
        padding: 5px;
        width: 17px
    }

        body > .os-scrollbar-vertical .os-scrollbar-track {
            outline: 2px solid #bbb4df;
            outline-offset: 1px;
            pointer-events: initial;
            touch-action: initial;
            background: #bbb4df !important
        }

            body > .os-scrollbar-vertical .os-scrollbar-track .os-scrollbar-handle {
                background: #E96620;
                pointer-events: initial;
                touch-action: initial
            }

                body > .os-scrollbar-vertical .os-scrollbar-track .os-scrollbar-handle:hover {
                    cursor: grab
                }

                body > .os-scrollbar-vertical .os-scrollbar-track .os-scrollbar-handle:active {
                    cursor: grabbing
                }

        body > .os-scrollbar-vertical.os-scrollbar-unusable {
            display: none
        }

.c1 {
    color: rgb(50 148 250) !important
}

.c2 {
    color: #ff4500 !important
}

.c3 {
    color: #26bf94 !important
}

.c4 {
    color: #1d3557 !important
}

.c5 {
    color: #4a668e !important
}

.text-white {
    color: #fff !important
}

.bg1 {
    background: rgb(50 148 250) !important
}

.bg2 {
    background: #ff4500 !important
}

.bg3 {
    background: #26bf94 !important
}

.bg4 {
    background: #005d72 !important
}

.bg5 {
    background: #4a668e !important
}

.fw-4 {
    font-weight: 400 !important
}

.fw-5 {
    font-weight: 500 !important
}

.fw-6 {
    font-weight: 600 !important
}

.fw-7 {
    font-weight: 700 !important
}

.fw-8 {
    font-weight: 800 !important
}

.fw-9 {
    font-weight: 900 !important
}

.flex-between-center, .pricing-header, .social-handles, .payment-support {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important
}

    .flex-center-y, .membership-info ul li, .history-filter, .sticky-post ul li, .blog-meta ul li, .payment-support > p {
        display: flex !important;
        align-items: center !important
    }

        .flex-center, .button-group a, .adContact li i, .membership-info ul li > i, .membership-body li i, .package-detail-btn i, .membership-nav li a i, .pricing-body ul li > i, .pricing-footer, .sticky-post ul li i, .blog-meta ul li i, .blog-card ul i, .share-post span, .share-post a, .branch-header > a i, .edit-branch-btn i, .profile-card #btn-proDetail p i, .account-btn button:not(.logged-in), .account-btn button:not(.logged-in) > i, .payment-support > p > i, .toggle-password {
            display: flex !important;
            justify-content: center !important;
            align-items: center !important
        }

.theme-container {
    max-width: 1600px;
    padding-inline: 15px;
    margin: 0 auto
}
/**********Membership Dashboard start ********/
#membershipMessage {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.membership_message_div {
    width: 65%;
    padding: 20px;
}

@media(min-width:1400px) {
    .membership_message_div {
        width: 75%;
    }
}

@media(max-width:1200px) {
    .membership_message_div {
        width: 100%;
        padding: 10px;
    }

    .profile-card .profile-pic {
        margin-top: 0px !important;
    }
}

@media(max-width:775px) {
    .free_ammout_message span {
        font-size: 16px;
    }

    .free_ammout_message i {
        font-size: 20px;
    }
}


/**********Membership Dashboard end ******/
.free_ammout_message {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .free_ammout_message span {
        font-size: 20px;
    }

    .free_ammout_message i {
        font-size: 30px;
        color: #4a668e;
        margin: 10px;
    }

#free_ammout_div {
    width: 120px;
    height: 40px;
    border-radius: 20px;
    position: relative;
    background: #E96620;
    display: flex;
    justify-content: center;
    text-align: center;
    align-items: center;
    color: #fff;
}

    #free_ammout_div:before {
        content: '';
        position: absolute;
        top: 2px;
        left: 2px;
        border-top: 2px solid #fff;
        border-right: 2px solid #fff;
    }

    #free_ammout_div:after {
        content: '';
        position: absolute;
        bottom: 2px;
        right: 2px;
        border-bottom: 2px solid #fff;
        border-left: 2px solid #fff;
    }

@keyframes border-top-right {
    0% {
        height: 0px;
        width: 0px;
    }

    50% {
        height: 0px;
        width: 116px;
    }

    100% {
        height: 32px;
        width: 116px;
    }
}

@keyframes border-bottom-left {
    0% {
        height: 0px;
        width: 0px;
    }

    50% {
        height: 0px;
        width: 116px;
    }

    100% {
        height: 32px;
        width: 116px;
    }
}


@media(max-width:775px) {
    .free_ammout_message span {
        font-size: 16px;
    }

    .free_ammout_message i {
        font-size: 20px;
    }

    #free_ammout_div {
        width: 120px;
        height: 30px;
    }

    @keyframes border-top-right {
        0% {
            height: 0px;
            width: 0px;
        }

        50% {
            height: 0px;
            width: 116px;
        }

        100% {
            height: 20px;
            width: 116px;
        }
    }

    @keyframes border-bottom-left {
        0% {
            height: 0px;
            width: 0px;
        }

        50% {
            height: 0px;
            width: 116px;
        }

        100% {
            height: 20px;
            width: 116px;
        }
    }
}

main {
    min-height: 100vh
}

.back2Top {
    width: 20px;
    height: 20px;
    outline: 2px solid rgba(250,50,118,.5);
    outline-offset: 2px;
    bottom: 50px;
    right: 30px;
    position: fixed;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #E96620;
    color: #fff;
    -webkit-clip-path: circle(0% at 25% 25%);
    clip-path: circle(0% at 25% 25%);
    cursor: pointer;
    z-index: 1050;
    transition: bottom .5s ease 0s,-webkit-clip-path .6s ease-in-out .1s;
    transition: clip-path .6s ease-in-out .1s,bottom .5s ease 0s;
    transition: clip-path .6s ease-in-out .1s,bottom .5s ease 0s,-webkit-clip-path .6s ease-in-out .1s
}

    .back2Top.toTop {
        -webkit-clip-path: circle(200% at 50% 50%);
        clip-path: circle(200% at 50% 50%);
        bottom: 30px;
        transition: bottom .5s ease .1s,-webkit-clip-path .6s ease-in-out 0s;
        transition: clip-path .6s ease-in-out 0s,bottom .5s ease .1s;
        transition: clip-path .6s ease-in-out 0s,bottom .5s ease .1s,-webkit-clip-path .6s ease-in-out 0s
    }

.inner-pageHeader {
    /*--innerPageBg: url(../../images/UserPanel/bg/page-header.jpg);*/
    padding: 50px 0;
    /*background: no-repeat center center;*/
    position: relative;
    z-index: 2
}

.pageBanner-content {
    padding: 50px 50px 20px;
    position: relative;
    overflow: hidden;
    z-index: 1
}

    .pageBanner-content::before {
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        background: var(--innerPageBg) no-repeat center center/cover fixed;
        -webkit-background-clip: content-box;
        background-clip: content-box;
        filter: blur(10px);
        top: 0;
        left: 0;
        z-index: -1
    }

    .pageBanner-content::after {
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        background: rgba(255,255,255, 1);
        border: 5px solid rgba(28,89,198,1);
        border-radius: 5px;
        top: 0;
        left: 0;
        z-index: -1
    }

    .pageBanner-content > h1 {
        font-size: 32px;
        text-transform: uppercase;
        font-weight: 700;
        color: #1d3557;
        text-shadow: 0 -4px 3px rgba(255,255,255,.7),0 3px 10px rgba(255,255,255,.7);
        padding-bottom: 40px;
        position: relative;
        z-index: 1
    }

        .pageBanner-content > h1::before {
            position: absolute;
            content: "";
            width: calc(100% + 106px);
            height: 20px;
            background: var(--innerPageBg) no-repeat center center/cover fixed;
            -webkit-background-clip: content-box;
            background-clip: content-box;
            box-shadow: 0 0 15px #fff;
            bottom: 0;
            left: -53px;
            z-index: -1
        }

.breadcrumbs {
    position: relative;
    z-index: 1;
    margin-top: 15px
}

    .breadcrumbs > a > span, .breadcrumbs > span {
        font-size: 18px;
        font-weight: 900;
        color: #1d3557 !important
    }

    .breadcrumbs > a:hover > span {
        text-decoration: underline
    }

@media(max-width:991px) {


    .inner-pageHeader {
        padding: 30px 0
    }

    .pageBanner-content {
        padding: 15px 15px 5px
    }

        .pageBanner-content > h1 {
            font-size: 60px;
            padding-bottom: 30px
        }

    .breadcrumbs {
        margin-top: 5px
    }
}

h2.section-header span {
    display: inline-block;
    font-size: 18px;
    font-weight: 700;
    position: relative;
    padding: 10px 30px;
    border-radius: 4px;
    background: rgba(91,62,240,.06);
    border-left: 4px solid #E96620;
    border-right: 4px solid #E96620
}

.company_slider .img_box_slider img {
    height: 100px;
    /*object-fit: contain;*/
}
.all_store_btn{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-top:30px;
}
    .all_store_btn a {
        background-color: #E96620;
        margin: 7px 10px 15px 0px;
        border-radius: 10px;
        padding: 5px 15px;
        text-align: center;
        transition: 0.5s;
        color: #fff;
    }
.popular_store {
    background-color: #E96620;
    border-radius: 10px;
    padding: 5px 15px;
    color: #fff;
    font-size:15px;
    font-weight:600;
}
.img_box_slider a {
    display: flex;
    margin: 20px 7px;
}
.img_box_slider .brand-card {
    width: 120px;
    background: white;
    border-radius: 20px;
    border: 1px solid #ddd;
    overflow: hidden;
    text-align: center;
    font-family: sans-serif;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    position: relative;
    width: 100%;
    padding: 0px;
    margin: 0px 0px;
}

/* Red top with arrow effect */
.red-tab {
    background: #E96620;
    height: 85px;
    position: relative;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}

    .red-tab::after {
        content: "";
        position: absolute;
        bottom: -30%;
        left: -20%;
        transform: translateX(-50%);
        width: 69%;
        height: 53%;
        background: #fff;
        transform: rotate(45deg);
    }
    .red-tab::before {
        content: "";
        position: absolute;
        bottom: -30%;
        right: -20%;
        transform: translateX(-50%);
        width: 69%;
        height: 53%;
        background: #fff;
        transform: rotate(135deg);
    }

.logo-wrapper {
    /* padding: 10px 0; */
    background: #fff;
    width: 70%;
    margin: -45px auto 0px auto;
    position: relative;
    z-index: 99;
    border-radius: 27px;
    height: 160px;
    overflow: hidden;
}
.company_slider .img_box_slider img {
    height: 90%;
    object-fit: cover;
    width: 100%;
}
    .logo-wrapper img {
        width: 60px;
        height: auto;
    }

.brand-name {
    font-size: 16px;
    font-weight: bold;
    color: #444444;
    margin: 20px 0;

    overflow: hidden;
    word-wrap: break-word;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
#top_stores {
    color: #0E2F87 !important
}

.company_slider .box_items {
    margin: 0px 10px;
}

    .company_slider .box_items .box_img {
        border: 1px solid #ddd;
        border-radius: 10px;
        overflow: hidden;
    }

h2.section-header span::before, h2.section-header span::after {
    position: absolute;
    content: "";
    width: 100px;
    height: 2px;
    background: #E96620;
    top: 50%;
    transform: translateY(-50%)
}

h2.section-header span::before {
    right: 100%
}

h2.section-header span::after {
    left: 100%
}

h2.section-header.red-header span {
    background: rgba(250,50,118,.06);
    border-left: 4px solid #0E2F87;
    border-right: 4px solid #0E2F87
}

#recent_offer {
    color: #0E2F87 !important;
    text-align: center;
}

#featured_offered, #top_stores, #similar_offer_text {
    text-align: center;
}


h2.section-header.red-header span::before, h2.section-header.red-header span::after {
    background: #0E2F87
}

h2.section-header.green-header span {
    background: rgba(38,191,148,.06);
    border-left: 4px solid #0e2f87;
    border-right: 4px solid #0e2f87
}

    h2.section-header.green-header span::before, h2.section-header.green-header span::after {
        background: #0e2f87
    }

h2.section-header.featured-header span {
    background: rgba(74,102,142,.06);
    border-left: 4px solid #4a668e;
    border-right: 4px solid #4a668e
}

#featured_offered {
    color: #0e2f87 !important
}

h2.section-header.featured-header span::before, h2.section-header.featured-header span::after {
    background: #4a668e
}

h2.section-header.package-info-header span {
    background: rgba(74,102,142,.06);
    border-left: 4px solid #4a668e;
    border-right: 4px solid #4a668e
}

    h2.section-header.package-info-header span::before, h2.section-header.package-info-header span::after {
        background: #4a668e
    }

.round-top-in {
    position: relative
}

    .round-top-in::before, .round-top-in::after {
        position: absolute;
        content: "";
        width: 15px;
        height: 15px;
        top: -4px;
        border-top: 4px solid #fff
    }

    .round-top-in::before {
        right: calc(100% - 4px);
        border-right: 4px solid #fff
    }

    .round-top-in::after {
        left: calc(100% - 4px);
        border-left: 4px solid #fff
    }

    .round-top-in::before {
        border-radius: 0 16px 0 0
    }

    .round-top-in::after {
        border-radius: 16px 0 0 0
    }

.check-me label {
    display: inline-block;
    padding-left: 30px;
    font-size: 14px;
    font-weight: 500;
    color: #2f2e41;
    position: relative;
    cursor: pointer
}

    .check-me label::before {
        position: absolute;
        content: "";
        width: 20px;
        height: 20px;
        border-radius: 4px;
        background: #fff;
        border: 1px solid #ccc;
        top: 1px;
        left: 0
    }

    .check-me label::after {
        position: absolute;
        content: "";
        font-family: bootstrap-icons;
        top: 1px;
        left: 1px;
        font-size: 18px;
        color: #fff;
        display: none;
        background: #0E2F87;
        width: 20px;
        height: 20px;
        line-height: 20px;
        border-radius: 4px;
    }

.check-me input:checked + label::after {
    display: block
}

.pagination-area > a {
    width: 40px;
    height: 40px;
    border-radius: 4px;
    background: #0E2F87;
    color: #fff;
    box-shadow: inset 0 0 0 4px rgba(255,255,255,.4);
    margin: 3px;
    font-size: 14px;
    font-weight: 700
}

    .pagination-area > a:hover {
        background: #E96620
    }

    .pagination-area > a.active {
        background: #E96620;
        color: #fff;
        box-shadow: inset 0 0 0 4px rgba(255,255,255,.4);
    }

@keyframes pulse-animation {
    0% {
        box-shadow: 0 0 0 0 rgba(255,255,255,.9)
    }

    100% {
        box-shadow: 0 0 0 12px rgba(255,255,255,0)
    }
}

.theme-tab {
    width: 100%;
    text-align: center;
    background: #5b3ef0;
    border-radius: 8px;
    padding: 5px;
    gap: 5px
}

@media(max-width:767px) {
    .theme-tab {
        padding: 10px;
        background: rgba(91,62,240,.07);
        flex-wrap: wrap
    }
}

.theme-tab button {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
    word-spacing: 3px;
    color: #fff;
    padding: 12px 30px;
    border-radius: 8px;
    position: relative;
    z-index: 1
}

@media(max-width:1199px) {
    .theme-tab button {
        word-spacing: 0
    }
}

@media(max-width:991px) {
    .theme-tab button {
        letter-spacing: 0;
        padding: 5px;
        font-weight: 500
    }
}

@media(max-width:767px) {
    .theme-tab button {
        color: #5b3ef0
    }
}

.theme-tab button::before {
    position: absolute;
    content: "";
    width: 30px;
    height: 20px;
    border-radius: 0 0 22px 0;
    bottom: -15px;
    right: calc(100% - 8px);
    border-right: 8px solid #fff;
    border-bottom: 8px solid #fff;
    pointer-events: none;
    display: none
}

.theme-tab button::after {
    position: absolute;
    content: "";
    width: 30px;
    height: 20px;
    border-radius: 0 0 0 22px;
    bottom: -15px;
    left: calc(100% - 8px);
    border-left: 8px solid #fff;
    border-bottom: 8px solid #fff;
    pointer-events: none;
    display: none
}

.theme-tab button:not(.active):hover {
    background: rgba(255,255,255,.2)
}

.theme-tab button.active {
    background: #fff;
    color: #5b3ef0;
    margin-bottom: -10px;
    padding: 12px 30px;
    border-radius: 8px 8px 0 0
}

    .theme-tab button.active::before, .theme-tab button.active::after {
        display: block;
        bottom: -8px
    }

@media(max-width:767px) {
    .theme-tab button.active::before, .theme-tab button.active::after {
        display: none
    }
}

@media(max-width:991px) {
    .theme-tab button.active {
        padding: 8px 10px
    }
}

@media(max-width:767px) {
    .theme-tab button.active {
        padding: 5px;
        border-radius: 4px;
        background: #5b3ef0;
        color: #fff;
        margin: 0
    }
}

.theme-tab-content .form-inner {
    max-width: 100%;
    width: 650px;
    margin-inline: auto;
    box-shadow: none;
    padding: 0
}

.theme-tab-content .form-footer {
    margin-top: 0
}

    .theme-tab-content .form-footer > button {
        font-size: 16px;
        padding: 10px 10px;
        background: #5b3ef0
    }

        .theme-tab-content .form-footer > button:hover {
            background: #26bf94
        }

@media(max-width:1600px) {
    .w-100-15 {
        width: calc(100% - 30px);
        margin-inline: 15px
    }
}

@media(max-width:991px) {
    .inner-pageHeader {
        padding: 30px 0
    }

    .pageBanner-content {
        padding: 15px 15px 5px
    }

    .breadcrumbs {
        margin-top: 5px
    }

        .breadcrumbs > a > i {
            font-size: 14px
        }

    .pageBanner-content > h1 {
        font-size: 50px;
        padding-bottom: 30px
    }

    .breadcrumbs > a > span, .breadcrumbs > span {
        font-size: 15px;
        font-weight: 700
    }
}

@media(max-width:767px) {
    body {
        padding-inline-end: 10px
    }

        body > .os-scrollbar {
            padding-block: 5px !important
        }

        body > .os-scrollbar-vertical {
            inset-block: 0 !important;
            right: 0 !important;
            padding: 5px;
            width: 13px
        }

            body > .os-scrollbar-vertical .os-scrollbar-track {
                outline: 1px solid #bbb4df;
                outline-offset: 1px;
                pointer-events: initial;
                touch-action: initial;
                background: #bbb4df !important
            }

                body > .os-scrollbar-vertical .os-scrollbar-track .os-scrollbar-handle {
                    background: #E96620;
                    pointer-events: initial;
                    touch-action: initial
                }

                    body > .os-scrollbar-vertical .os-scrollbar-track .os-scrollbar-handle:hover {
                        cursor: grab
                    }

                    body > .os-scrollbar-vertical .os-scrollbar-track .os-scrollbar-handle:active {
                        cursor: grabbing
                    }

            body > .os-scrollbar-vertical.os-scrollbar-unusable {
                display: none
            }

    .back2Top {
        width: 20px;
        height: 20px;
        outline: 1px solid rgba(250,50,118,.5);
        outline-offset: 1px;
        bottom: 30px;
        right: 20px
    }

        .back2Top i {
            font-size: 12px;
            transform: translateY(-2px)
        }

        .back2Top.toTop {
            bottom: 15px
        }

    h2.section-header span {
        font-size: 13px
    }

        h2.section-header span::before, h2.section-header span::after {
            width: 30px
        }
}

@media(max-width:575px) {
    .pageBanner-content > h1::before {
        height: 10px
    }

    .inner-pageHeader {
        padding: 15px 0
    }

    .pageBanner-content {
        padding: 10px 10px 5px
    }

        .pageBanner-content > h1 {
            font-size: 36px;
            padding-bottom: 30px
        }

    .breadcrumbs > a > span, .breadcrumbs > span {
        font-size: 14px
    }

    .breadcrumbs > a > i {
        font-size: 12px
    }

    .check-me label {
        padding-left: 24px
    }
}

@media(max-width:540px) {
    .w-100-15 {
        width: calc(100% - 10px);
        margin-inline: 5px
    }
}

@media(max-width:414px) {
    body {
        background: #fff
    }
}

.form-inner {
    border-radius: 8px;
    padding: 10px 30px 15px;
    box-shadow: 0 0 10px rgba(47,46,65,.15)
}

    .form-inner > h3 {
        font-size: 14px;
        font-weight: 700;
        letter-spacing: 1px;
        word-spacing: 3px;
        padding: 10px 40px 8px;
        margin: 5px -40px 0 -30px;
        background: #0e2f87;
        color: #fff;
        position: relative;
        border-radius: 0 4px 0 0
    }

        .form-inner > h3::after {
            position: absolute;
            content: "";
            top: 100%;
            right: 0;
            border-right: 5px solid rgba(0,0,0,0);
            border-left: 5px solid #ab9df7;
            border-top: 5px solid #ab9df7;
            border-bottom: 5px solid rgba(0,0,0,0)
        }

.form-content {
    margin: 15px 0 0
}

@media(min-width:768px) {
    .form-content {
        margin: 15px 0
    }
}

.form-content > span {
    display: block;
    color: #2f2e41;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 3px
}

.form-content > input, .form-content > textarea, .form-content .nice-select {
    float: none;
    width: 100%;
    border: 1px solid #e8e8e8;
    outline: 0;
    height: 40px !important;
    border-radius: 4px;
    padding: 0 10px
}

    .form-content .nice-select .list {
        max-height: 240px
    }

    .form-content > input[type=password] {
        padding-inline-end: 40px
    }

.form-content select {
    display: none
}

.form-content > input[type=file]::file-selector-button {
    border: none;
    padding: 8px;
    transform: translateX(-10px)
}

.form-content > textarea {
    resize: vertical;
    padding-block: 10px;
    min-height: 114px !important
}

.toggle-password {
    cursor: pointer;
    width: 40px;
    height: 40px;
    font-size: 22px;
    color: #1d3557;
    position: absolute;
    /*top: calc(50% + 13px);*/
    right: 2px;
    /*transform: translateY(-50%)*/
}

.register_img {
    height: 55px;
}

.form-footer {
    margin: 15px 0 0
}

@media(min-width:768px) {
    .form-footer {
        margin: 15px 0
    }
}

.form-footer input {
    font-size: 18px;
    /* font-weight: 600;*/
    padding: 15px 10px;
    border-radius: 8px;
    box-shadow: inset 0 0 0 4px rgba(255,255,255,.4);
    width: 100%;
    /* text-align: center;*/
    display: block;
    /* background: #0e2f87;*/
    /*    color: #fff;*/
    transition: all .3s ease
}

.form-footer > input:hover {
    background: #FF6D1F;
}

.form-footer > button {
    font-size: 18px;
    font-weight: 600;
    padding: 15px 10px;
    border-radius: 8px;
    box-shadow: inset 0 0 0 4px rgba(255, 255, 255, .4);
    width: 100%;
    text-align: center;
    display: block;
    background: #0e2f87;
    color: #fff;
    transition: all .3s ease;
    cursor: pointer;
}

    .form-footer > button:focus {
        background: #FF6D1F;
    }

.form-footer > input:active {
    background: #FF6D1F;
    transform: translateY(2px)
}

@media(max-width:767px) {
    .form-footer > button {
        font-size: 16px;
        padding: 10px;
        border-radius: 4px;
        box-shadow: inset 0 0 0 3px rgba(255,255,255,.4)
    }
}

.modal .modal-content {
    text-align: center;
    background: #fff;
    padding: 30px;
    border-radius: 16px;
    position: relative;
    outline: 10px solid rgba(233, 102, 32, 0.75);
    outline-offset: 5px;
    box-shadow: 0 0 0 6px rgba(255,255,255,.4);
}

.modal .exit-modal {
    position: absolute;
    top: 10px;
    right: 15px;
    color: #fff;
    width: 30px;
    height: 30px;
    border-radius: 100%;
    background: #ff6d1f;
    outline: 3px solid rgba(91,62,240,.3) !important;
    outline-offset: 1px !important;
    z-index: 9999
}

.link_active {
    background: red !important;
}

.modal .modal-body h4 {
    font-size: 20px;
    font-weight: 700;
    color: rgba(47,46,65,.8)
}

.modal .nice-select {
    width: 100%
}

.location-filter .modal-body h4 {
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(47,46,65,.15)
}

.search-modal .modal-dialog {
    margin-top: 100px
}

.search-modal .modal-content {
    padding: 15px;
    outline: 6px solid rgba(91,62,240,.75)
}

.search-modal .modal-body {
    padding-block: 0
}

.search-modal .global-search {
    width: 100%;
    margin-top: 0
}

.search-modal .exit-modal {
    top: -20px;
    right: -10px;
    width: 40px;
    height: 40px;
    outline: 3px solid rgba(255,255,255,.4) !important
}

.pricing-filter form input[type=number] {
    width: 100%;
    height: 45px;
    border: 1px solid rgba(47,46,65,.13);
    padding: 10px;
    border-radius: 4px;
    outline: 0;
    box-shadow: none
}

.pricing-filter .pricingType {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-block: 10px 15px
}

.create-ad .modal-content {
    padding: 0;
    text-align: start
}

.create-ad .form-inner {
    padding-inline: 0
}

.add-balance #paymentSlide .carousel-inner {
    height: 440px;
    border-radius: 16px
}

    .add-balance #paymentSlide .carousel-inner img {
        width: 100%;
        height: 440px;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center
    }

.add-balance .carousel-control-prev, .add-balance .carousel-control-next {
    height: 60px;
    transform: translateY(-50%) scaleX(0)
}

.add-balance .carousel-control-prev {
    transform-origin: left center
}

.add-balance .carousel-control-next {
    transform-origin: right center
}

.add-balance #paymentSlide:hover .carousel-control-prev, .add-balance #paymentSlide:hover .carousel-control-next {
    transform: translateY(-50%) scaleX(1)
}

.add-balance .modal-content {
    outline: 10px solid rgba(38,191,148,.75);
    padding: 0;
    text-align: start
}

.add-balance .exit-modal {
    background: #26bf94;
    outline: 3px solid rgba(38,191,148,.3) !important
}

.add-balance .form-inner {
    padding-inline: 0
}

.add-balance .form-footer {
    margin-block: 22px 0
}

    .add-balance .form-footer > button {
        background: #26bf94
    }

.add-balance .form-inner {
    padding-block: 0
}

    .add-balance .form-inner > h4 {
        color: #2f2e41;
        font-size: 18px;
        margin-block: 0 10px;
        padding-bottom: 20px;
        border-bottom: 1px solid rgba(0,0,0,.05)
    }

@media(max-width:575px) {
    .add-balance .form-inner > h4 {
        padding-bottom: 10px
    }
}

.add-balance .form-inner > p {
    font-size: 14px;
    background: rgba(38,191,148,.1);
    font-weight: 700;
    border-radius: 4px
}

    .add-balance .form-inner > p > span {
        display: inline-block;
        padding: 5px 8px 6px;
        position: relative
    }

        .add-balance .form-inner > p > span > i {
            position: absolute;
            top: calc(50% - 1px);
            transform: translateY(-50%);
            right: calc(100% + 6px);
            font-size: 22px;
            color: #26bf94
        }

@media(max-width:370px) {
    .add-balance .form-inner > p > span > i {
        display: none
    }
}

.add-balance .form-inner > p > span + span {
    font-size: 16px;
    background: #26bf94;
    color: #fff;
    border-radius: 0 4px 4px 0
}

@media(max-width:370px) {
    .add-balance .form-inner > p > span + span {
        font-size: 14px;
        background: rgba(0,0,0,0);
        color: #26bf94
    }
}

@media(max-width:575px) {
    .add-balance .modal-body {
        padding: 0
    }
}

.confirm-modal .modal-content {
    z-index: 9999;
    outline: 10px solid rgba(38,191,148,.75)
}

    .confirm-modal .modal-content .exit-modal {
        background: #26bf94;
        outline: 3px solid rgba(38,191,148,.3) !important
    }

.error-modal ::-moz-selection {
    background: #fa3276
}

.error-modal ::selection {
    background: #fa3276
}

.error-modal .modal-content {
    outline: 10px solid rgba(250,50,118,.75)
}

    .error-modal .modal-content .exit-modal {
        background: #fa3276;
        outline: 3px solid rgba(250,50,118,.3) !important
    }

.add-balance ::-moz-selection, .confirm-modal ::-moz-selection {
    background: #26bf94
}

.add-balance ::-moz-selection, .confirm-modal ::-moz-selection {
    background: #26bf94
}

.add-balance ::selection, .confirm-modal ::selection {
    background: #26bf94
}

.payment-support {
    margin-top: 10px
}

    .payment-support > p {
        background: rgba(38,191,148,.1);
        border-radius: 0 4px 4px 0
    }

        .payment-support > p > i {
            width: 30px;
            height: 30px;
            border-radius: 4px 0 0 4px;
            background: #26bf94;
            color: #fff
        }

        .payment-support > p > span {
            font-size: 15px;
            color: #2f2e41;
            padding: 0 10px 0 5px
        }

@media(max-width:490px) {
    .payment-support {
        /*flex-direction: column;*/
        row-gap: 10px;
        align-items: start !important
    }
}

@media(max-width:767px) {
    .modal .modal-content {
        padding: 15px 10px
    }

    .modal .modal-dialog {
        align-items: start;
        margin-top: 100px;
        margin-inline: auto;
        width: calc(100% - 40px)
    }

    .all-cates .modal-content {
        padding: 15px 0
    }

    .search-modal .exit-modal {
        top: -10px;
        right: -6px;
        width: 25px;
        height: 25px;
        outline: 2px solid rgba(255,255,255,.4) !important
    }
}

@media(max-width:575px) {
    .modal:not(.search-modal) .exit-modal {
        width: 25px;
        height: 25px;
        top: 6px;
        right: 6px
    }

    .pricing-filter .pricingType {
        flex-direction: column;
        align-items: start
    }

    .pricing-filter .check-me {
        margin-top: 10px
    }

    .pricing-filter .modal-content {
        text-align: start
    }

    .pricing-filter form label {
        margin-top: 15px;
        font-weight: 500
    }

    .pricing-filter .modal-body {
        padding: 0;
        margin-bottom: 15px
    }

    .location-filter .modal-body {
        padding: 0;
        margin-bottom: 15px;
        text-align: start
    }

        .location-filter .modal-body h4 {
            font-size: 18px
        }
}

header {
    position: relative;
    z-index: 99
}

.top-nav > .theme-container, .main-nav > .theme-container {
    padding-inline-end: 15px
}

.top-nav {
    background: #fff;
    /*padding: 15px 0 10px*/
}

    .top-nav .logo {
        flex-shrink: 0
    }

.global-search {
    background: #0E2F87;
    padding: 5px;
    border-radius: 32px;
    width: 550px;
    margin-inline: 15px;
    flex-shrink: 1;
    box-shadow: inset 0 0 0 3px rgba(255,255,255,.4)
}

    .global-search form {
        width: 100%
    }

        .global-search form input, .global-search form button {
            height: 38px;
            border: none !important;
            outline: 0
        }

        .global-search form input {
            width: calc(100% - 50px);
            padding: 0 20px 3px;
            border-radius: 32px 4px 4px 32px
        }

        .global-search form button {
            width: 50px;
            border-radius: 0 4px 4px 0
        }

            .global-search form button i {
                font-size: 18px;
                color: #fff;
                margin-left: 2px
            }

.top-nav ul:not(.account-btn ul):not(.mbl-menu ul) {
    border-radius: 32px;
    overflow: hidden;
    position: relative;
    outline: 2px solid #fff;
    outline-offset: -.5px;
    z-index: 3;
    flex-shrink: 0
}

    .top-nav ul:not(.account-btn ul):not(.mbl-menu ul)::before {
        position: absolute;
        content: "";
        inset: 0;
        border-radius: 32px;
        box-shadow: inset 0 0 0 3px rgba(255,255,255,.4);
        z-index: 1;
        pointer-events: none
    }

    .top-nav ul:not(.account-btn ul):not(.mbl-menu ul)::after {
        position: absolute;
        content: "";
        width: 13px;
        height: 13px;
        border-radius: 100%;
        /*background: #fff;*/
        top: 50%;
        left: calc(50% + -22px);
        transform: translate(-50%,-50%);
        z-index: 1
    }

    .top-nav ul:not(.account-btn ul):not(.mbl-menu ul) li a {
        display: flex;
        align-items: center;
        color: #fff;
        padding: 10px 30px;
        position: relative
    }

        .top-nav ul:not(.account-btn ul):not(.mbl-menu ul) li a::before {
            position: absolute;
            content: "";
            width: 150%;
            height: 100%;
            top: 0;
            left: 0;
            transform: skewX(45deg);
            background: #3294fa;
            transition: all .3s ease;
            z-index: -1
        }

        .top-nav ul:not(.account-btn ul):not(.mbl-menu ul) li a::after {
            position: absolute;
            content: "";
            width: 50%;
            height: 100%;
            top: 0;
            left: 0;
            background: #3294fa;
            transition: all .3s ease;
            z-index: -2
        }

        .top-nav ul:not(.account-btn ul):not(.mbl-menu ul) li a:hover::before, .top-nav ul:not(.account-btn ul):not(.mbl-menu ul) li a:hover::after {
            background: #0e2f87
        }

        .top-nav ul:not(.account-btn ul):not(.mbl-menu ul) li a i {
            font-size: 18px;
            margin-right: 5px
        }

        .top-nav ul:not(.account-btn ul):not(.mbl-menu ul) li a span {
            font-size: 14px;
            font-weight: 500
        }

    .top-nav ul:not(.account-btn ul):not(.mbl-menu ul) li + li a::before {
        transform: skewX(-45deg);
        background: #0e2f87;
        border-right: none;
        box-shadow: -4px 0 0 4px #fff;
        transition: all .3s ease;
        left: 8px
    }

    .top-nav ul:not(.account-btn ul):not(.mbl-menu ul) li + li a:hover::before {
        background: #3294fa
    }

    .top-nav ul:not(.account-btn ul):not(.mbl-menu ul) li + li a::after {
        display: none
    }

    .top-nav ul:not(.account-btn ul):not(.mbl-menu ul).create-offer::after {
        display: none
    }

    .top-nav ul:not(.account-btn ul):not(.mbl-menu ul).create-offer li a {
        padding: 18px 30px 18px 50px;
        position: relative;
    }

        .top-nav ul:not(.account-btn ul):not(.mbl-menu ul).create-offer li a i {
            position: absolute;
            font-size: 28px;
            left: 15px;
            top: 50%;
            transform: translateY(-50%)
        }

.user-area {
    flex-shrink: 0;
    align-items: center
}

.account-btn {
    margin-inline-start: 15px;
    position: relative;
    z-index: 2
}

    .account-btn button:not(.logged-in) {
        position: relative;
        width: 40px;
        height: 40px;
        font-size: 40px;
        transform: translateY(-1px);
        border-radius: 100%;
        color: #E96620;
    }

        .account-btn button:not(.logged-in) > i {
            position: absolute;
            bottom: 0;
            right: 0;
            border-radius: 100%;
            outline: 1px solid #E96620;
            background: #fff;
            color: #E96620;
            font-size: 8px;
            width: 10px;
            height: 10px
        }

    .account-btn button.logged-in {
        display: flex;
        align-items: center
    }

        .account-btn button.logged-in img {
            width: 48px;
            height: 48px;
            border-radius: 100%;
            outline: 2px solid rgb(50 148 250);
            outline-offset: 1px
        }

        .account-btn button.logged-in > i {
            transition: all .3s ease;
            transform-origin: center;
            color: #3294fa;
            transform: rotateX(0deg)
        }

        .account-btn button.logged-in.triggered i {
            transform: rotateX(180deg)
        }

    .account-btn ul {
        position: absolute;
        width: 200px;
        border-radius: 8px;
        background: #fff;
        top: calc(100% - 5px);
        padding: 10px 0;
        right: 2px;
        box-shadow: 0 0 15px rgba(0,0,0,.15);
        visibility: hidden;
        opacity: 0;
        transition: all .3s ease
    }

        .account-btn ul::before {
            position: absolute;
            content: "";
            width: 15px;
            height: 15px;
            border-radius: 4px;
            background: #fff;
            transform: rotate(45deg);
            bottom: calc(100% - 8px);
            right: 35px
        }

        .account-btn ul.account-menu-open {
            opacity: 1;
            visibility: visible;
            top: calc(100% + 12px)
        }

        .account-btn ul li + li {
            position: relative
        }

            .account-btn ul li + li::before {
                position: absolute;
                content: "";
                width: calc(100% - 30px);
                height: 2px;
                background: rgba(91,62,240,.04);
                top: 0;
                left: 15px
            }

        .account-btn ul a {
            display: flex;
            padding: 10px 15px;
            align-items: center
        }

            .account-btn ul a i {
                width: 35px;
                height: 35px;
                border-radius: 100%;
                background: rgba(91,62,240,.1);
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 18px;
                transition: all .3s ease
            }

                .account-btn ul a i::before {
                    font-weight: 500 !important
                }

            .account-btn ul a span {
                font-size: 15px;
                font-weight: 700;
                color: #2f2e41;
                margin-inline-start: 10px
            }

            .account-btn ul a:hover {
                background: rgba(91,62,240,.03)
            }

                .account-btn ul a:hover i {
                    background: #E96620;
                    color: #fff
                }

.mbl-menu {
    flex-shrink: 0;
    align-items: center
}

    .mbl-menu .new-post {
        position: relative;
        padding: 12px 15px 12px 38px;
        display: flex;
        align-items: center;
        border-radius: 32px;
        color: #fff;
        background: #3294fa;
        margin-inline-end: 10px;
        box-shadow: inset 0 0 0 2px rgba(255,255,255,.4)
    }

        .mbl-menu .new-post i {
            position: absolute;
            font-size: 26px;
            left: 6px;
            top: 50%;
            transform: translateY(-50%)
        }

        .mbl-menu .new-post span {
            font-size: 10px;
            font-weight: 700
        }

.main-nav {
    padding-bottom: 15px;
    color: #fff
}

    .main-nav .main-nav-inner {
        background: #3294fa;
        border-radius: 32px;
        box-shadow: inset 0 0 0 4px rgba(255,255,255,.4);
        padding-inline: 30px
    }

    .main-nav .all-categories > a, .main-nav .main-menu > li > a {
        position: relative;
        padding-right: 20px;
        color: #fff
    }

        .main-nav .all-categories > a::after, .main-nav .main-menu > li > a::after {
            position: absolute;
            content: "";
            width: 45px;
            height: calc(100% - 8px);
            top: 4px;
            left: 0;
            background: rgba(255,255,255,.12);
            transition: all .3s ease
        }

        .main-nav .all-categories > a i, .main-nav .main-menu > li > a i {
            width: 45px;
            height: 45px;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 18px;
            margin-right: 8px
        }

    .main-nav .all-categories:hover > a::after, .main-nav .main-menu > li:hover > ::after {
        width: 100%
    }

    .main-nav .all-categories {
        position: relative
    }

        .main-nav .all-categories > a p {
            font-size: 15px;
            font-weight: 700
        }

        .main-nav .all-categories > a span {
            width: 10px;
            height: 10px;
            margin-left: 5px;
            border: 3px solid #fff;
            border-bottom: 3px solid rgba(0,0,0,0);
            border-right: 3px solid rgba(0,0,0,0);
            border-radius: 3px;
            transform: rotate(-135deg)
        }

    .main-nav .main-menu > li + li {
        margin-left: 50px
    }

    .main-nav .main-menu > li > a > span {
        font-size: 15px;
        font-weight: 700
    }

.cate-container {
    position: absolute;
    width: 300px;
    top: calc(100% + 10px);
    left: 0;
    padding: 15px;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 15px 15px -10px rgba(0,0,0,.15),inset 0 -2px 6px rgba(47,46,65,.13);
    border: 1px solid rgba(47,46,65,.15);
    border-top: none;
    background: #fff;
    visibility: hidden;
    opacity: 0;
    transition: all .3s ease
}

    .cate-container ul {
        width: 100%
    }

        .cate-container ul li {
            position: relative;
            z-index: 2;
            flex-basis: 50%;
            border-bottom: 1px solid rgba(91,62,240,.05)
        }

            .cate-container ul li:nth-child(even) {
                border-left: 1px solid rgba(91,62,240,.05)
            }

                .cate-container ul li:nth-child(even):not(:nth-child(2)) a::before {
                    position: absolute;
                    content: "";
                    width: 20px;
                    height: 1px;
                    background: #fff;
                    top: -1px;
                    left: -10px
                }

                .cate-container ul li:nth-child(even):not(:nth-child(2)) a::after {
                    position: absolute;
                    content: "";
                    width: 1px;
                    height: 20px;
                    background: #fff;
                    top: -11px;
                    left: -1px
                }

            .cate-container ul li a {
                position: relative;
                z-index: 1;
                padding: 15px 0;
                color: #2f2e41;
                display: block;
                text-align: center
            }

                .cate-container ul li a i {
                    display: block;
                    font-size: 24px
                }

                .cate-container ul li a span {
                    font-size: 14px;
                    font-weight: 700
                }

                .cate-container ul li a:hover {
                    color: #FF6D1F;
                    background: rgba(91,62,240,.04)
                }

.all-categories:hover .cate-container {
    top: 100%;
    visibility: visible;
    opacity: 1
}

.valid-branches {
    max-height: 300px;
    background: rgba(91,62,240,.03);
    padding: 5px;
    border-radius: 8px;
    border: 1px solid rgba(91,62,240,.1);
    margin-top: 5px
}

    .valid-branches li {
        display: flex;
        align-items: center;
        padding: 5px;
        padding-right: 10px
    }

        .valid-branches li .check-me {
            padding: 10px 15px 10px 10px;
            background: rgba(255,255,255,.8);
            border-radius: 4px;
            border: 1px solid rgba(91,62,240,.1);
            position: relative;
            z-index: 1;
            transition: all .3s ease;
            width: 100%
        }

            .valid-branches li .check-me:hover {
                box-shadow: 0 5px 25px -3px rgba(91,62,240,.13);
                transform: translateY(-1px);
                background: #fff
            }

            .valid-branches li .check-me label {
                display: block;
                padding: 0
            }

                .valid-branches li .check-me label::before {
                    left: initial;
                    top: 1px;
                    right: 0
                }

                .valid-branches li .check-me label::after {
                    left: initial;
                    right: 1px;
                    top: -1px
                }

    .valid-branches > .os-scrollbar-vertical {
        inset-block: 0 !important;
        right: 0 !important;
        padding: 5px;
        width: 14px
    }

        .valid-branches > .os-scrollbar-vertical .os-scrollbar-track {
            outline: 1px solid #bbb4df;
            outline-offset: 1px;
            pointer-events: initial;
            touch-action: initial;
            background: #bbb4df !important
        }

            .valid-branches > .os-scrollbar-vertical .os-scrollbar-track .os-scrollbar-handle {
                background: #5b3ef0;
                pointer-events: initial;
                touch-action: initial
            }

                .valid-branches > .os-scrollbar-vertical .os-scrollbar-track .os-scrollbar-handle:hover {
                    cursor: grab
                }

                .valid-branches > .os-scrollbar-vertical .os-scrollbar-track .os-scrollbar-handle:active {
                    cursor: grabbing
                }

        .valid-branches > .os-scrollbar-vertical.os-scrollbar-unusable {
            display: none
        }

.irs--round .irs-bar {
    background-color: #5b3ef0
}

.irs--round .irs-handle {
    background-color: #5b3ef0;
    border-color: #5b3ef0;
    box-shadow: 0 0 0 5px rgba(91,62,240,.2)
}

    .irs--round .irs-handle.state_hover, .irs--round .irs-handle:hover {
        background-color: #5b3ef0
    }

.irs--round .irs-handle {
    width: 16px;
    height: 16px;
    top: 29px
}

.irs--round .irs-from, .irs--round .irs-to, .irs--round .irs-single {
    background-color: rgba(0,0,0,0);
    color: #666
}

    .irs--round .irs-from:before, .irs--round .irs-to:before, .irs--round .irs-single:before, .irs--round .irs-min, .irs--round .irs-max {
        display: none
    }

.fixed-nav {
    position: fixed;
    z-index: 99;
    top: 50%;
    transform: translateY(-50%);
    left: -15px;
    min-height: 300px;
    border-radius: 40px;
    background: #3294fa;
    padding: 10px;
    display: flex;
    box-shadow: inset 0 0 0 4px rgba(255,255,255,.4);
    opacity: 0;
    visibility: hidden;
    filter: blur(30px);
    transition: all 1s ease
}

    .fixed-nav.header-fixed {
        visibility: visible;
        opacity: 1;
        left: 5px;
        filter: blur(0);
        opacity: .6;
        transition: all .3s ease
    }

        .fixed-nav.header-fixed:hover {
            opacity: 1
        }

    .fixed-nav > ul {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between
    }

        .fixed-nav > ul > li + li {
            margin-top: 15px
        }

        .fixed-nav > ul > li > a {
            width: 25px;
            height: 25px;
            border-radius: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            outline: 3px solid rgba(255,255,255,.4);
            position: relative
        }

            .fixed-nav > ul > li > a > i {
                color: #fff
            }

                .fixed-nav > ul > li > a > i.bi-plus {
                    font-size: 42px
                }

                .fixed-nav > ul > li > a > i.bi-box-arrow-in-right {
                    font-size: 28px;
                    transform: translateX(-3px)
                }

                .fixed-nav > ul > li > a > i.bi-person-fill-gear, .fixed-nav > ul > li > a > i.bi-box-arrow-right {
                    font-size: 22px
                }

            .fixed-nav > ul > li > a > span {
                font-size: 16px;
                font-weight: 600;
                filter: drop-shadow(2px 0 5px rgba(47,46,65,.2));
                position: absolute;
                display: inline-block;
                white-space: nowrap;
                background: #fff;
                color: rgb(50 148 250);
                padding: 3px 10px 6px;
                border-radius: 8px;
                top: 50%;
                transform: translateY(-50%);
                left: 100%;
                visibility: hidden;
                opacity: 0;
                transition: all .3s ease
            }

                .fixed-nav > ul > li > a > span::before {
                    position: absolute;
                    content: "";
                    border-right: 5px solid #fff;
                    border-top: 5px solid rgba(0,0,0,0);
                    border-bottom: 5px solid rgba(0,0,0,0);
                    right: 100%;
                    top: 50%;
                    transform: translateY(-50%)
                }

            .fixed-nav > ul > li > a:hover {
                background: #fff
            }

                .fixed-nav > ul > li > a:hover > i {
                    color: #E96620;
                }

                .fixed-nav > ul > li > a:hover > span {
                    visibility: visible;
                    opacity: 1;
                    left: calc(100% + 10px)
                }

.all-cates .cate-container-wrapper {
    padding: 10px 5px 10px 10px;
    border-radius: 8px;
    box-shadow: 0 0 15px -10px rgba(0,0,0,.15),inset 0 0 6px rgba(47,46,65,.13)
}

.all-cates .cate-container {
    padding-inline-end: 20px !important;
    border-radius: 8px;
    width: 100%;
    position: relative;
    visibility: visible;
    opacity: 1;
    box-shadow: none;
    border: none;
    padding: 0;
    border-radius: 0;
    height: 500px
}

    .all-cates .cate-container > .os-scrollbar-vertical {
        inset-block: 0 !important;
        right: 0 !important;
        padding: 5px;
        width: 14px
    }

        .all-cates .cate-container > .os-scrollbar-vertical .os-scrollbar-track {
            outline: 1px solid #bbb4df;
            outline-offset: 1px;
            pointer-events: initial;
            touch-action: initial;
            background: #bbb4df !important
        }

            .all-cates .cate-container > .os-scrollbar-vertical .os-scrollbar-track .os-scrollbar-handle {
                background: #E96620;
                pointer-events: initial;
                touch-action: initial
            }

                .all-cates .cate-container > .os-scrollbar-vertical .os-scrollbar-track .os-scrollbar-handle:hover {
                    cursor: grab
                }

                .all-cates .cate-container > .os-scrollbar-vertical .os-scrollbar-track .os-scrollbar-handle:active {
                    cursor: grabbing
                }

        .all-cates .cate-container > .os-scrollbar-vertical.os-scrollbar-unusable {
            display: none
        }

@media(max-width:1620px) {
    .top-nav > .theme-container, .main-nav > .theme-container {
        padding-inline-end: 30px
    }
}

@media(max-width:1199px) {
    .top-nav > .theme-container, .main-nav > .theme-container {
        padding-inline-end: 15px
    }
}

@media(max-width:991px) {
    /*  .top-nav {
        padding: 15px 0
    }*/

    .top-nav .logo img {
        width: 130px
    }

    .top-nav ul:not(.account-btn ul):not(.mbl-menu ul)::before {
        box-shadow: inset 0 0 0 3.5px rgba(255,255,255,.4)
    }

    .top-nav ul:not(.account-btn ul):not(.mbl-menu ul)::after {
        left: calc(50% - 25px)
    }

    .top-nav ul:not(.account-btn ul):not(.mbl-menu ul) li a {
        padding: 14px 15px
    }

    .top-nav ul:not(.account-btn ul):not(.mbl-menu ul) li + li a::before {
        left: 5px
    }

    .main-nav .all-categories > a::after, .main-nav .main-menu > li > a::after {
        width: 40px
    }

    .main-nav .all-categories > a i, .main-nav .main-menu > li > a i {
        width: 40px;
        height: 40px
    }

    .fixed-nav > ul > li + li {
        margin-top: 5px
    }

    .fixed-nav > ul > li > a {
        width: 30px;
        height: 30px;
        outline-width: 2px
    }

        .fixed-nav > ul > li > a > i {
            font-size: 15px
        }

            .fixed-nav > ul > li > a > i.bi-plus {
                font-size: 36px
            }

            .fixed-nav > ul > li > a > i.bi-box-arrow-in-right {
                font-size: 20px;
                transform: translateX(-2px)
            }

            .fixed-nav > ul > li > a > i.bi-person-fill-gear, .fixed-nav > ul > li > a > i.bi-box-arrow-right {
                font-size: 18px
            }

        .fixed-nav > ul > li > a > span {
            font-size: 14px;
            letter-spacing: .02rem
        }
}

@media(max-width:767px) {
    .global-search {
        margin-inline: 8px;
        padding: 4px;
        box-shadow: inset 0 0 0 2px rgba(255,255,255,.4)
    }

        .global-search form input, .global-search form button {
            height: 32px
        }

    .main-nav .all-categories > a span {
        width: 7px;
        height: 7px;
        border: 2px solid #fff;
        border-bottom: 2px solid rgba(0,0,0,0);
        border-right: 2px solid rgba(0,0,0,0);
        border-radius: 2px
    }

    .main-nav .main-nav-inner {
        padding-inline-end: 15px
    }

    .main-nav .main-menu > li + li {
        margin-left: 10px
    }

    .main-nav .all-categories > a i, .main-nav .main-menu > li > a i {
        font-size: 15px;
        margin-inline-end: 5px
    }

    .account-btn button.logged-in {
        position: relative
    }

        .account-btn button.logged-in img {
            width: 34px;
            height: 34px
        }

        .account-btn button.logged-in > i {
            position: absolute;
            bottom: 0;
            right: 0;
            border-radius: 100%;
            outline: 1px solid #5b3ef0;
            background: #fff;
            color: #5b3ef0;
            font-size: 8px;
            width: 10px;
            height: 10px;
            display: flex;
            justify-content: center;
            align-items: center
        }

    .account-btn ul {
        width: 160px;
        right: 0;
        padding: 5px 0;
        box-shadow: 0 0 10px rgba(0,0,0,.15)
    }

        .account-btn ul.account-menu-open {
            top: calc(100% + 10px)
        }

        .account-btn ul::before {
            width: 10px;
            height: 10px;
            bottom: calc(100% - 5px);
            right: 15px
        }

        .account-btn ul a {
            padding: 5px 10px
        }

            .account-btn ul a i {
                width: 30px;
                height: 30px;
                font-size: 16px
            }

            .account-btn ul a span {
                font-size: 14px;
                line-height: 16px;
                margin-inline-start: 5px
            }

    .fixed-nav {
        width: calc(100% - 13px);
        top: -20px;
        transform: translateY(-100%);
        left: 0 !important;
        min-height: auto;
        border-radius: 0 0 15px 15px;
        padding-inline: 40px;
        filter: blur(0);
        transition: all .3s ease
    }

        .fixed-nav.header-fixed {
            top: -4px;
            transform: translateY(0);
            opacity: 1;
            left: 0
        }

        .fixed-nav > ul {
            flex-direction: row;
            width: 100%;
            justify-content: space-between
        }

            .fixed-nav > ul > li + li {
                margin-top: 0;
                margin-inline-start: 15px
            }

            .fixed-nav > ul > li > a > span {
                top: 100%;
                transform: translate(-50%,-100%);
                left: 50%
            }

                .fixed-nav > ul > li > a > span::before {
                    border-right: 5px solid rgba(0,0,0,0);
                    border-top: 5px solid rgba(0,0,0,0);
                    border-bottom: 5px solid #fff;
                    border-left: 5px solid rgba(0,0,0,0);
                    right: 50%;
                    bottom: 100%;
                    top: initial;
                    transform: translate(50%,1px)
                }

            .fixed-nav > ul > li > a:hover > span {
                left: 50%;
                transform: translate(-50%,8px)
            }

            .fixed-nav > ul > li > a > i.bi-plus {
                transform: translateY(-2px)
            }
}

@media(max-width:630px) {
    .main-nav .all-categories > a p {
        font-size: 14px;
        font-weight: 500
    }

    .main-nav .all-categories > a::after, .main-nav .main-menu > li > a::after {
        width: 30px
    }

    .main-nav .all-categories > a i, .main-nav .main-menu > li > a i {
        width: 30px
    }

    .main-nav .all-categories > a > span, .main-nav .main-menu > li > a > span {
        font-size: 14px;
        font-weight: 500
    }
}

@media(max-width:575px) {
    .main-nav .main-menu {
        width: 100%;
        justify-content: space-around
    }

        .main-nav .main-menu > li + li {
            margin-left: 5px
        }

    .main-nav .main-nav-inner {
        padding-inline-start: 15px
    }

    .mbl-menu {
        width: calc(100% - 145px)
    }

    .account-btn ul {
        width: 150px
    }

        .account-btn ul::before {
            right: 10px
        }

    .global-search {
        padding: 2px;
        margin-inline-end: 0
    }

        .global-search form input {
            width: calc(100% - 30px);
            padding-inline: 15px 10px;
            font-size: 14px
        }

        .global-search form button {
            width: 30px
        }

            .global-search form button i {
                font-size: 15px;
                margin-left: 0;
                margin-inline-end: 2px
            }

    .fixed-nav {
        left: 15px
    }
}

@media(max-width:500px) {
    .main-nav .main-menu > li + li {
        margin-left: 0
    }

    .main-nav .main-menu > li > a > span {
        font-size: 13px
    }

    .top-nav .logo img {
        width: 100px
    }

    .mbl-menu {
        width: calc(100% - 115px);
        justify-content: space-around
    }

        .mbl-menu > ul {
            width: calc(100% - 50px)
        }
}

@media(max-width:460px) {
    /*  .top-nav {
        padding: 10px 0
    }*/

    .main-nav {
        padding-bottom: 20px
    }

        .main-nav .main-nav-inner {
            padding: 5px 0px;
            box-shadow: inset 0 0 0 2px rgba(255,255,255,.4)
        }

        .main-nav .main-menu {
            padding-block: 2px;
            justify-content: space-around
        }

            .main-nav .main-menu > li > a {
                padding-right: 0
            }

                .main-nav .main-menu > li > a::after {
                    display: none
                }

                .main-nav .main-menu > li > a i {
                    width: 32px;
                    height: 32px;
                    border-radius: 100%;
                    margin: 0;
                    background: rgba(255,255,255,.4)
                }

                .main-nav .main-menu > li > a > span {
                    display: none
                }
}

@media(max-width:440px) {
    .mbl-menu .new-post {
        position: relative;
        padding: 6px 15px 6px 32px;
        align-items: center;
        border-radius: 32px;
        color: #5b3ef0;
        background: rgba(91,62,240,.06);
        margin-inline-end: 15px;
        box-shadow: inset 0 0 0 2px rgba(91,62,240,.4)
    }

        .mbl-menu .new-post i {
            position: absolute;
            font-size: 20px;
            left: 6px;
            top: calc(50% - 1px);
            transform: translateY(-50%)
        }

        .mbl-menu .new-post span {
            font-size: 12px
        }

    .account-btn button:not(.logged-in) {
        width: 30px;
        height: 30px;
        font-size: 30px
    }

        .account-btn button:not(.logged-in) > i {
            font-size: 7px;
            width: 8px;
            height: 8px
        }

    .account-btn button.logged-in {
        position: relative
    }

        .account-btn button.logged-in img {
            width: 30px;
            height: 30px;
            outline: 1px solid rgba(91,62,240,.8)
        }

        .account-btn button.logged-in > i {
            font-size: 7px;
            width: 8px;
            height: 8px
        }

    .account-btn ul {
        width: 160px
    }

        .account-btn ul::before {
            right: 10px
        }
}

@media(max-width:390px) {
    .top-nav .logo img {
        width: 90px
    }

    .mbl-menu {
        width: calc(100% - 105px)
    }

    .fixed-nav ul {
        justify-content: space-around
    }

        .fixed-nav ul > li + li {
            margin-top: 0;
            margin-inline-start: 8px
        }

        .fixed-nav ul > li > a {
            width: 25px;
            height: 25px;
            outline-width: 1px
        }

            .fixed-nav ul > li > a > i {
                font-size: 12px
            }

                .fixed-nav ul > li > a > i.bi-plus {
                    font-size: 30px;
                    transform: translateY(0)
                }

                .fixed-nav ul > li > a > i.bi-box-arrow-in-right {
                    font-size: 17px
                }

                .fixed-nav ul > li > a > i.bi-person-fill-gear, .fixed-nav ul > li > a > i.bi-box-arrow-right {
                    font-size: 16px
                }

            .fixed-nav ul > li > a > span {
                font-size: 12px;
                padding: 2px 8px 4px 10px
            }

    .cate-container ul li {
        flex-basis: 100%;
        border-left: none !important
    }

        .cate-container ul li a {
            padding-block: 0;
            display: flex;
            align-items: center
        }

            .cate-container ul li a::before, .cate-container ul li a::after {
                display: none
            }

            .cate-container ul li a i {
                width: 40px;
                height: 50px;
                display: flex;
                align-items: center;
                justify-content: center
            }
}

@media(max-width:340px) {
    .top-nav > .theme-container {
        padding-inline: 8px
    }

    .mbl-menu > ul {
        margin-inline-end: 5px
    }
}

@media(max-width:320px) {
    .fixed-nav ul > li > a {
        width: 25px;
        height: 25px;
        outline-width: 1px
    }

        .fixed-nav ul > li > a > i {
            font-size: 12px
        }
}

.hero-section > .theme-container {
    display: flex;
    align-items: stretch;
    gap: 15px;
    border-radius: 0 0 16px 16px
}

.a-d-area {
    justify-content: center;
    align-items: center;
    width: 200px;
    flex-shrink: 1;
    border-radius: 8px;
    margin-top: 15px;
    background: #fff
}

.a-d-hr {
    justify-content: center;
    align-items: center;
    background: #fff;
    margin-bottom: 20px;
    padding-block: 40px;
    border-radius: 8px;
    box-shadow: 0 3px 10px -3px rgba(0,0,0,.1)
}

.hero-section .hero-slider {
    width: 100%
}

.hero-slider {
    border-radius: 0 0 16px 16px;
    padding: 0 15px 15px
}

    .hero-slider .carousel-item {
        height: 500px
    }

        .hero-slider .carousel-item img {
            border-radius: 8px;
            width: 100%;
            height: 500px;
            -o-object-fit: cover;
            object-fit: cover;
            -o-object-position: center center;
            object-position: center center
        }

.carousel-control-prev, .carousel-control-next {
    position: absolute;
    display: block;
    opacity: 1 !important;
    width: 35px;
    height: 100px;
    background: #fff;
    color: #2f2e41 !important;
    top: 50%;
    transform: translateY(-50%);
    transition: all .2s ease
}

    .carousel-control-prev i, .carousel-control-next i {
        font-size: 22px
    }

    .carousel-control-prev::before, .carousel-control-prev::after, .carousel-control-next::before, .carousel-control-next::after {
        position: absolute;
        content: "";
        width: 15px;
        height: 15px
    }

    .carousel-control-prev::before, .carousel-control-next::before {
        bottom: calc(100% - 2px);
        border-bottom: 2px solid #fff
    }

    .carousel-control-prev::after, .carousel-control-next::after {
        top: calc(100% - 2px);
        border-top: 2px solid #fff
    }

.carousel-control-prev {
    left: -5px;
    border-left: none;
    border-radius: 0 4px 4px 0
}

    .carousel-control-prev::before, .carousel-control-prev::after {
        left: 3px;
        border-left: 2px solid #fff
    }

    .carousel-control-prev::before {
        border-radius: 0 0 0 8px
    }

    .carousel-control-prev::after {
        border-radius: 8px 0 0 0
    }

.carousel-control-next {
    right: -5px;
    border-right: none;
    border-radius: 4px 0 0 4px
}

    .carousel-control-next::before, .carousel-control-next::after {
        right: 3px;
        border-right: 2px solid #fff
    }

    .carousel-control-next::before {
        border-radius: 0 0 8px 0
    }

    .carousel-control-next::after {
        border-radius: 0 8px 0 0
    }

    .carousel-control-prev:hover, .carousel-control-next:hover {
        outline-offset: -4px !important
    }

@media(max-width:1600px) {
    .hero-section {
        width: calc(100% - 30px);
        margin-inline: 15px
    }
}

@media(max-width:1199px) {
    .hero-section {
        width: 100%;
        margin-inline: 0
    }

    .a-d-hr {
        display: flex !important
    }

    .hero-slider {
        border-radius: 0;
        width: 100%
    }

        .hero-slider .carousel-item {
            height: 400px
        }

            .hero-slider .carousel-item img {
                height: 400px
            }

        .hero-slider::before, .hero-slider::after {
            display: none
        }
}

@media(max-width:767px) {
    .hero-slider .carousel-item {
        height: 300px
    }

        .hero-slider .carousel-item img {
            height: 300px
        }

    .carousel-control-prev, .carousel-control-next {
        width: 30px;
        height: 60px
    }
}

.offer-section {
    margin-top: 10px;
    /* background:#fff;*/
    border-radius: 16px;
}

.card-section, .topStores-section {
    margin-top: 10px;
}

.offer-section .theme-container > a {
    position: absolute;
    inset: 0;
    z-index: 2
}

.offer_brance_item {
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.offer-section .theme-container, .offer-section .container-xl {
    /*background: #26bf94;*/
    position: relative;
    padding: 10px 0;
    border-radius: 16px;
    box-shadow: inset 0 0 5px rgba(47,46,65,.2),inset 0 0 0 10px rgba(255,255,255,.4),0 0 15px rgba(47,46,65,.3)
}

#megha_offer {
    /* background-image: url(../../images/OfferImage/offer_banner.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    color: rgb(255, 255, 255);*/
    /*background-size: cover;*/
    /*    position: relative;
    z-index: 1;*/
    background: #fff;
}
/*    #megha_offer::after {
        position: absolute;
        content: " ";
        height: 100%;
        width: 100%;
        left: 0;
        top: 0;
        z-index: -1;
        opacity: .5;
        background: #000;
    }*/
.offer_body {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.offer_left {
    font-size: 14px;
    width: 55%;
    margin-left: 20px;
}

    .offer_left ul {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
    }

        .offer_left ul li {
            background-color: #E96620;
            margin: 7px 7px;
            border-radius: 10px;
            padding: 8px 15px;
            text-align: center;
            transition: 0.5s;
        }

            .offer_left ul li:hover {
                opacity: .8;
                transform: scale(1.05);
            }

            .offer_left ul li a {
                font-weight: bold;
                color: #fff;
                display: block;
                width: 100%;
            }

.offer_right {
    position: relative;
    width: 45%;
    height: 120px; /* Fixed height */
    margin-left: 20px;
    margin-right: 15px; /* Added right margin */
    border-radius: 16px;
    overflow: hidden;
    cursor: pointer;
    background: #0E2F87;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

    .offer_right a {
        display: flex;
        width: 100%;
        height: 100%;
        text-decoration: none;
        justify-content: center;
        align-items: center;
        padding: 0 20px; /* Added horizontal padding */
        position: relative;
        z-index: 1;
    }

    .offer_right::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient( 90deg, rgba(14, 46, 131, 0.9) 0%, rgba(14, 46, 131, 0.85) 100% );
        z-index: 1;
    }

.offer_text {
    color: white;
    font-size: 24px;
    font-weight: 600;
    text-align: center;
    z-index: 2;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.background_image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

/* Hover Effects */
.offer_right:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
}

/* Responsive Design */
@media screen and (max-width: 768px) {
    .offer_right {
        width: 90%;
        margin: 15px auto;
    }

    .offer_text {
        font-size: 20px;
    }
}






/* Header Banner Specific Styles */
.offer-header-section {
    width: 100%;
    margin-bottom: 30px;
}

.offer-header-container {
    position: relative;
    width: 100%;
    height: 100px;
    background: #0e2f87;
    overflow: hidden;
}

.offer-header-text {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
}

.mega_deal_image {
    width: 100%;
    height: 120px;
}

.mega_deal_image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.offer-header-text h2 {
    margin: 0;
    color: #fff;
    font-size: 40px;
    font-weight: 800;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.offer-header-container::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*background: linear-gradient( 90deg, rgba(233, 102, 32, 0.9) 0%, rgba(233, 102, 32, 0.85) 100% );*/
    z-index: 1;
}

.offer-header-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

/* Responsive */
@media screen and (max-width: 768px) {
    .offer-header-container {
        height: 150px;
    }

    .offer-header-text h2 {
        font-size: 30px;
    }
}

@media screen and (max-width: 480px) {
    .offer-header-container {
        height: 120px;
    }

    .offer-header-text h2 {
        font-size: 24px;
    }
}


@media(max-width:1199px) {
    /* .offer-section {
        margin-top: 20px
    }*/

    .offer_left ul {
        grid-template-columns: repeat(3, 1fr);
    }

        .offer_left ul li {
            margin: 5px 5px;
            padding: 5px 8px;
        }

    .offer_right {
        min-height: 120px;
    }

    .offer_left ul li a {
        font-size: 14px;
    }

    .offer-section .theme-container, .offer-section .container-xl {
        padding: 15px 0;
        border-radius: 8px
    }

    .offer-section .offer-text {
        padding-inline: 30px
    }

        .offer-section .offer-text h2 {
            font-size: 42px;
            font-weight: 700;
            padding: 10px 0
        }
}

@media(max-width:991px) {
    .offer_body {
        flex-direction: column;
    }

    .offer_right {
        width: 95%;
        margin-top: 15px;
    }

    .offer_left {
        margin-left: 0px;
    }

    .offer_left {
        width: 95%;
    }

        .offer_left ul {
            grid-template-columns: repeat(3, 1fr);
        }
}

@media(max-width:575px) {
    .offer_left {
        margin-left: 0px;
    }

        .offer_left ul li {
            margin: 3px 3px;
            padding: 5px 0px;
        }

            .offer_left ul li a {
                font-size: 13px;
            }

    .offer-section .offer-text {
        padding-inline: 15px
    }

        .offer-section .offer-text h2 {
            font-size: 36px;
            padding: 0
        }
}

@media(max-width:414px) {
    .offer_left ul {
        grid-template-columns: repeat(2, 1fr);
    }

    .offer_left {
        margin-left: 0px;
    }

    .offer-section .offer-text h2 {
        font-size: 28px
    }
}

.card-section > .theme-container {
    padding: 15px 5px;
    border-radius: 8px;
    box-shadow: 0 0 15px -8px rgba(47,46,65,.2);
    border: 1px solid rgba(47,46,65,.13)
}

.brand-card {
    position: relative;
    padding: 10px;
    border-radius: 8px;
    box-shadow: 0 0 15px rgba(47,46,65,.13);
    transition: .3s;
    overflow: hidden
}

    .brand-card:hover {
        box-shadow: 0 0 15px rgba(47,46,65,.5);
        transform: scale(1.01);
    }

    .brand-card > a {
        position: absolute;
        inset: 0
    }

.profile_item_title {
    position: absolute;
    bottom: 20px;
    left: 20px;
    overflow: hidden;
    word-wrap: break-word;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    display: none;
    transition: all .3s ease;
    background: #fff;
    width: 85%;
}

    .profile_item_title h6 {
        font-size: 14px;
        padding: 5px 5px;
        color: #1d3557;
    }

.brand-card:hover .profile_item_title {
    display: block;
    transition: all .3s ease;
}

/*.brand-card > img{
    width: 100%;
    height: 260px;
    border-radius: 4px;
     object-fit: cover;
}*/

.brand-card > img {
    width: 100%;
    height: 260px;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    border-radius: 4px
}

.brand-card figcaption {
    pointer-events: none;
    position: absolute;
    width: calc(100% - 10px);
    bottom: -10px;
    left: -1px;
    padding: 25px 10px 5px 0px;
    color: #2f2e41;
    font-size: 18px;
    font-weight: 500;
    opacity: 0;
    visibility: hidden;
    transition: all .2s ease;
    z-index: 2;
}

.figure_img {
    height: 60px;
    width: 60px;
    border-radius: 5px;
    margin: 0px 5px;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .figure_img img {
        /* height: 100%;*/
        width: 100%;
        object-fit: cover;
        border-radius: 5px;
    }

.figure_title_div_index {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    /*padding:10px 5px;*/
}


.figure_comp {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}

.figure_text {
    padding: 10px;
}

    .figure_text h6 {
        width: 230px;
        /*   margin-left: 36px;*/
        font-size: 14px;
        margin-top: 5px;
        overflow: hidden;
        word-wrap: break-word;
        display: -webkit-box;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
    }

.figure_text_div {
    font-size: 18px;
    width: 200px;
    overflow: hidden;
    word-wrap: break-word;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.figure_text_index {
    width: 200px;
    font-size: 14px;
    overflow: hidden;
    word-wrap: break-word;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    line-height: 25px;
}

.figure_brandName_index {
    width: 100px;
    overflow: hidden;
    word-wrap: break-word;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    font-size: 16px;
}

    .figure_brandName_index p {
        font-size: 18px;
    }

/*@media(max-width:775px) {
    .figure_img {
        width: 100%;
    }
}*/

.brand-card figcaption::before {
    position: absolute;
    content: "";
    width: 180%;
    height: 120%;
    -webkit-clip-path: polygon(0 0,0% 100%,100% 100%);
    clip-path: polygon(0 0,0% 100%,100% 100%);
    background: #fff;
    z-index: -1
}

/*.brand-card figcaption img {
        width: 40px;
        height: 40px;
        -o-object-fit: contain;
        object-fit: cover;
        -o-object-position: center;
        object-position: center;
        display: block;
        margin-right: 5px
    }*/

.brand-card:hover figcaption {
    visibility: visible;
    opacity: 1;
    bottom: 0
}

    .brand-card:hover figcaption p {
        width: 200px;
        overflow: hidden;
        word-wrap: break-word;
        display: -webkit-box;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
    }

.ad-area-h {
    text-align: center
}

    .ad-area-h img {
        width: 100%;
        height: 200px;
        -o-object-fit: cover;
        object-fit: cover
    }

@media(max-width:1199px) {
    .ad-area-h img {
        height: 120px
    }

    .figure_text h6 {
        width: 100%;
        /*     margin-left: 45px;*/
        font-size: 14px;
        margin-top: 5px;
    }
}

@media(max-width:991px) {
    .card-section > .theme-container {
        padding: 12px;
        border: none
    }

        .card-section > .theme-container .row > .col-md-4.col-6 {
            padding-inline: 5px !important;
            margin-top: 10px !important
        }

    .card-section .brand-card {
        height: 100%;
        box-shadow: none;
        padding: 2px;
        border: 1px solid rgba(47,46,65,.13)
    }

        .card-section .brand-card > img {
            height: 250px
        }

        .card-section .brand-card figcaption {
            position: relative;
            /*   background: #fff;*/
            width: 100%;
            left: 0;
            visibility: visible;
            opacity: 1;
            bottom: 0;
            padding: 10px 0;
            font-size: 18px;
            font-weight: 500;
            color: #4a668e
        }

            .card-section .brand-card figcaption::before {
                display: none
            }

    /* .card-section .brand-card figcaption img {
                    margin-inline-start: 10px
                }*/
}

@media(max-width:767px) {
    .profile-content-area > .row .col-xxl-4.col-6 {
        padding-inline: 5px !important;
        margin-top: 10px !important;
    }

    .profile-content-area .brand-card {
        height: 100%;
        box-shadow: none;
        padding: 2px;
        border: 1px solid rgba(47,46,65,.13)
    }

        .profile-content-area .brand-card figcaption {
            flex-wrap: wrap;
            position: relative;
            background: #fff;
            width: 100%;
            left: 0;
            visibility: visible;
            opacity: 1;
            bottom: 0 !important;
            padding: 10px 0;
            font-size: 18px;
            font-weight: 500;
            color: #4a668e
        }

            .profile-content-area .brand-card figcaption::before {
                display: none
            }

            .profile-content-area .brand-card figcaption img {
                margin-inline-start: 10px
            }

        .profile-content-area .brand-card .post-changes {
            background: rgba(0,0,0,0);
            box-shadow: none;
            padding: 5px 5px 0;
            top: 0 !important;
            visibility: visible;
            opacity: .7
        }

            .profile-content-area .brand-card .post-changes > a {
                width: 25px;
                height: 25px
            }

        .profile-content-area .brand-card .post-summary {
            padding: 5px 10px
        }

    .figure_text h6 {
        width: 100%;
        margin-left: 9px;
        font-size: 12px;
        margin-top: 5px;
    }
}

@media(max-width:575px) {
    .profile-content-area .brand-card > img {
        height: 200px
    }

    .profile_item_title {
        bottom: 10px;
        left: 10px;
        width: 93%;
    }
}

@media(max-width:540px) {
    .card-section .brand-card > img {
        height: 200px
    }
}

@media(max-width:414px) {
    .card-section .brand-card figcaption {
        font-size: 14px;
        flex-wrap: wrap
    }

        .card-section .brand-card figcaption img {
            margin-inline-start: 5px
        }

    .card-section .brand-card > img {
        height: 150px
    }
}

@media(max-width:360px) {
    .card-section .brand-card > img, .profile-content-area .brand-card > img {
        height: 120px
    }
}

@media(max-width:330px) {
    .card-section > .theme-container .row > .col-md-4.col-6, .profile-content-area > .row .col-xxl-4.col-6 {
        width: 100% !important
    }
}

.topStores-section > .theme-container {
    padding: 15px 30px;
    border-radius: 8px;
    box-shadow: 0 0 15px -8px rgba(47,46,65,.2);
    border: 1px solid rgba(47,46,65,.13)
}

    .topStores-section > .theme-container h2 {
        padding-bottom: 15px
    }

.featured-store {
    background: rgba(91,62,240,.03);
    border-radius: 8px;
    box-shadow: 0 5px 15px -5px rgba(91,62,240,.22);
    border: 2px solid rgba(91,62,240,.06)
}

    .featured-store h3 {
        font-size: 14px;
        font-weight: 700;
        background: #E96620;
        color: #fff;
        text-align: right;
        padding: 6px 10px 5px 10px;
        margin: 0 -10px 0 -2px;
        border-radius: 4px 4px 0 0;
        position: relative
    }

        .featured-store h3::after {
            position: absolute;
            content: "";
            border-top: 5px solid #E96620;
            border-left: 5px solid #E96620;
            border-right: 5px solid rgba(0,0,0,0);
            border-bottom: 5px solid rgba(0,0,0,0);
            top: 100%;
            right: 0
        }

        .featured-store h3::before {
            position: absolute;
            content: "";
            width: 5px;
            height: 5px;
            border-radius: 100%;
            background: #fff;
            outline: 2px solid #fff;
            outline-offset: 1px;
            top: 50%;
            left: 10px;
            transform: translateY(-50%);
            animation: pulse-animation 3s infinite
        }

    .featured-store figure {
        margin: 20px 0 20px
    }

        .featured-store figure img {
            max-width: 100px
        }

    .featured-store > p {
        font-size: 26px;
        font-weight: 700;
        color: #2f2e41;
        margin: 0 35px 30px;
        padding: 5px 0 6px;
        border-block: 1px solid rgba(47,46,65,.15)
    }

    .featured-store > a {
        background: #E96620;
        box-shadow: inset 0 0 0 4px rgba(255,255,255,.4);
        color: #fff;
        padding: 12px 10px;
        margin: 30px 30px 20px;
        border-radius: 4px
    }

        .featured-store > a span {
            font-size: 13px;
            letter-spacing: 1px;
            word-spacing: 3px;
            font-weight: 700;
            margin-right: 10px
        }

        .featured-store > a:hover {
            background: #c94c09
        }

.top-stores-list > div {
    padding-inline-end: 20px !important;
    height: 370px;
    max-height:370px;
    background: rgba(91,62,240,.03);
    padding: 10px;
    border-radius: 8px;
    position: relative
}
#all_store .top-stores-list > div {
    padding-inline-end: 20px !important;
    height: auto;
    background: rgba(91,62,240,.03);
    padding: 10px;
    border-radius: 8px;
    position: relative
}

    .top-stores-list > div::before, .top-stores-list > div::after {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        width: 100%;
        height: 10px;
        z-index: 2;
        background: rgba(91,62,240,.03);
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px)
    }

    .top-stores-list > div::after {
        top: initial;
        bottom: 0
    }
#all_store .top-stores-list > div > .os-scrollbar-vertical {
    ight: 0px !important;
    padding: 0px;
    width: 0px
}
.top-stores-list > div > .os-scrollbar-vertical {
    inset-block: 10px !important;
    right: 3px !important;
    padding: 5px;
    width: 14px
}

        .top-stores-list > div > .os-scrollbar-vertical .os-scrollbar-track {
            outline: 1px solid #bbb4df;
            outline-offset: 1px;
            pointer-events: initial;
            touch-action: initial;
            background: #bbb4df !important
        }

            .top-stores-list > div > .os-scrollbar-vertical .os-scrollbar-track .os-scrollbar-handle {
                background: #E96620;
                pointer-events: initial;
                touch-action: initial
            }

                .top-stores-list > div > .os-scrollbar-vertical .os-scrollbar-track .os-scrollbar-handle:hover {
                    cursor: grab
                }

                .top-stores-list > div > .os-scrollbar-vertical .os-scrollbar-track .os-scrollbar-handle:active {
                    cursor: grabbing
                }

        .top-stores-list > div > .os-scrollbar-vertical.os-scrollbar-unusable {
            display: none
        }

.top-store-card {
    height: 100%;
    padding: 15px 0;
    background: rgba(255,255,255,.8);
    border-radius: 4px;
    border: 1px solid rgba(91,62,240,.1);
    position: relative;
    z-index: 1;
    transition: all .3s ease
}

    .top-store-card:hover {
        box-shadow: 0 5px 25px -3px rgba(91,62,240,.13);
        transform: translateY(-1px);
        background: #fff
    }

    .top-store-card > a {
        position: absolute;
        inset: 0;
        z-index: 2
    }

    .top-store-card figure {
        width: 40px;
        height: 40px
    }

        .top-store-card figure img {
            height: calc(100% - 5px);
            -o-object-fit: contain;
            object-fit: contain;
            width: auto;
        }

    .top-store-card .store-intro {
        width: calc(100% - 120px);
        padding: 0 10px;
        border-left: 1px solid rgba(47,46,65,.1)
    }

        .top-store-card .store-intro h4, .top-store-card .store-intro-div h4 {
            font-size: 15px;
            font-weight: 700;
            color: #2f2e41
        }

.store-intro-div, .store-intro-img {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .top-store-card .store-intro h4 span, .store-intro-div h4 span {
        font-size: 13px;
        font-weight: 400;
        color: #777;
        display: block;
        margin-top: 8px;
        padding-top: 7px;
        border-top: 1px solid rgba(47,46,65,.1);
        text-align: center;
    }

.top-store-card .store-intro p {
    font-size: 12px;
    font-weight: 700;
    background: rgba(25,171,108,.1);
    color: #19ab6c;
    padding: 4px 6px;
    padding-right: 10px;
    margin-right: -10px;
    border-radius: 4px 0 0 4px
}

@media(max-width:1199px) {
    .topStores-section > .theme-container {
        padding: 15px
    }

    .top-store-card figure {
        width: 40px;
        height: 40px
    }

    .top-store-card .store-intro {
        width: calc(100% - 90px);
        padding: 0 5px
    }

        .top-store-card .store-intro h4 {
            font-size: 14px;
            font-weight: 500
        }

            .top-store-card .store-intro h4 span {
                margin-top: 3px;
                padding-top: 4px
            }
}

@media(max-width:575px) {
    .top-store-card figure {
        width: 40px;
        height: 40px
    }

    .top-store-card .store-intro {
        width: calc(100% - 10px);
        text-align: center;
        border-left: none;
        padding-top: 5px;
        margin-top: 5px;
        border-top: 1px solid rgba(47,46,65,.1)
    }

        .top-store-card .store-intro h4 span {
            border: none
        }
}

@media(max-width:340px) {
    .top-stores-list .col-6 {
        width: 100%
    }
}

.subscribe {
    margin-bottom: 30px;
    padding: 30px 0;
    background: #5b3ef0;
    border-bottom: 1px dashed #fff
}

    .subscribe form {
        border-radius: 8px;
        padding: 6px;
        box-shadow: 0 0 30px -5px rgba(47,46,65,.6),inset 0 0 0 4px rgba(255,255,255,.4)
    }

        .subscribe form input, .subscribe form button {
            height: 60px;
            border: none;
            outline: 0;
            box-shadow: none
        }

        .subscribe form input {
            width: 500px;
            padding: 0 10px 0 20px;
            margin-right: 3px;
            border-radius: 4px 8px 8px 4px
        }

        .subscribe form button {
            width: 60px;
            color: #fff
        }

            .subscribe form button i {
                font-size: 24px
            }

.subscribe-text {
    color: #fff
}

    .subscribe-text p {
        font-size: 18px;
        font-weight: 700;
        border-radius: 8px;
        background: rgba(255,255,255,.2);
        border-top: 2px solid #fff;
        border-bottom: 2px solid #fff;
        padding: 8px 15px
    }

    .subscribe-text h2 {
        font-size: 55px;
        font-weight: 800;
        padding: 5px 0;
        border-bottom: 4px solid #fff;
        border-radius: 4px
    }

.footer-col ul li {
    margin-top: 5px !important;
}

@media(max-width:600px) {
    .subscribe form {
        width: 100%
    }

        .subscribe form input {
            width: calc(100% - 60px)
        }
}

footer {
    background: #fff;
    padding-top: 80px;
    border-top: 1px dashed #f2f2f2;
    position: relative;
    z-index: 999
}

@media(max-width:414px) {
    footer {
        padding-top: 40px
    }
}

.footer-col > h2 {
    margin-top: 20px;
    font-size: 18px;
    font-weight: 700;
    color: #0E2F87;
    border-left: 5px solid #E96620;
    padding: 5px;
    border-radius: 4px
}

.footer-col > p {
    font-size: 16px;
    font-weight: 500;
    color: #2f2e41;
    padding-right: 50px
}

.footer-col > ul {
    margin-top: 10px
}

    .footer-col > ul li {
        padding-inline-start: 22px;
        position: relative
    }

        .footer-col > ul li + li {
            margin-top: 10px
        }

        .footer-col > ul li::before {
            position: absolute;
            content: "";
            font-family: bootstrap-icons;
            top: 0;
            left: 0
        }

        .footer-col > ul li a {
            font-size: 14px;
            font-weight: 500;
            color: #2f2e41;
            overflow: hidden;
            word-wrap: break-word;
            display: -webkit-box;
            text-overflow: ellipsis;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 1;
        }

            .footer-col > ul li a:hover {
                text-decoration: underline !important;
                color: #E96620 !important;
            }

.footer-contact {
    margin-top: 20px
}

    .footer-contact a {
        cursor: auto !important
    }

        .footer-contact a + a {
            margin-top: 16px
        }

        .footer-contact a i {
            font-size: 14px;
            width: 30px;
            height: 30px;
            margin-right: 8px;
            background: #0E2F87;
            border-radius: 4px;
            box-shadow: inset 0 0 0 2px rgba(255,255,255,.4),0 5px 10px -3px rgba(47,46,65,.2);
            color: #fff
        }

        .footer-contact a span {
            font-size: 16px;
            font-weight: 500;
            transition: all .3s ease
        }

.footer-social {
    margin-top: 15px
}

    .footer-social a {
        width: 30px;
        height: 30px;
        border-radius: 4px;
        font-size: 14px;
        background: #5b3ef0;
        color: #fff;
        box-shadow: inset 0 0 0 2px rgba(255,255,255,.4)
    }

    .footer-social #_footerfacebook {
        background: #3b5998
    }

    .footer-social #_footerinstagram {
        background: #CD201F
    }

    .footer-social #_footertiktok {
        background: #000
    }

    .footer-social #_footeryoutube {
        background: red
    }

    .footer-social a + a {
        margin-left: 10px
    }

    .footer-social a:hover {
        box-shadow: inset 0 0 0 20px rgba(255,255,255,.4)
    }

.footer-lg {
    padding-bottom: 15px
}

.footer-bottom {
    padding: 30px 0;
    position: relative;
    z-index: 1
}

    .footer-bottom::before {
        position: absolute;
        content: "";
        width: 100%;
        height: 2px;
        background: rgba(47,46,65,.2);
        z-index: -1
    }

    .footer-bottom p {
        padding: 10px 30px;
        border-radius: 4px;
        border: 2px solid rgba(47,46,65,.2);
        background: #fff
    }

@media(max-width:1199px) {
    .login-section {
        background: #fff
    }
}

.login-content {
    background: #fff;
    padding: 50px 0
}

@media(max-width:1199px) {
    .login-content.round-top-in::before, .login-content.round-top-in::after {
        display: none
    }
}

.user-xs, .other-xs {
    padding: 30px;
    border-radius: 8px;
    max-width: 100%;
    width: 620px;
    background: #fff;
    margin-inline: auto
}

    .user-xs > h2, .other-xs > h2 {
        font-size: 22px;
        font-weight: 600;
        text-align: center
    }

@media(max-width:575px) {
    .user-xs, .other-xs {
        padding: 5px
    }
}

.user-xs > h2 {
    color: #2f2e41;
    background: rgba(250,50,118,.05);
    border-inline: 4px solid #0e2f87;
    border-radius: 4px;
    padding: 10px 0
}

.user-xs form {
    margin-top: 20px
}

.user-xs .fw-7 {
    color: #0E2F87 !important
}

.user-xs form p {
    font-size: 14px;
    font-weight: 600
}

.user-xs .toggle-password {
    cursor: pointer;
    width: 40px;
    height: 40px;
    font-size: 22px;
    color: #1d3557;
    position: absolute;
    top: 30px;
    right: 2px;
    /*transform: translateY(-50%)*/
}

.user-xs form p a {
    color: #E96620;
}

    .user-xs form p a:hover {
        text-decoration: underline
    }

.user-xs form input {
    width: 100%;
    height: 50px;
    border: none;
    color: #2f2e41;
    border: 2px solid #3294fa;
    outline: 0;
    padding: 10px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500
}

    .user-xs form input + p {
        position: absolute;
        top: 0;
        right: 0
    }

    .user-xs form input[type=password] {
        padding-inline-end: 40px
    }

.user-xs form span {
    color: #2f2e41;
    display: inline-block;
    margin-bottom: 3px;
    font-size: 15px;
    font-weight: 500
}

.user-xs form button {
    display: inline-block;
    background: #0e2f87;
    color: #fff;
    padding: 15px 0;
    width: 100%;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 1px;
    word-spacing: 3px;
    box-shadow: inset 0 0 0 4px rgba(255,255,255,.4);
    transition: all .3s ease
}

    .user-xs form button:hover {
        background: #E96620
    }

.other-xs > h2 {
    font-size: 18px;
    font-weight: 500;
    padding-block: 12px;
    margin-bottom: 30px;
    border-block: 1px solid rgba(0,0,0,.12);
    background: rgba(0,0,0,.01);
    border-radius: 4px
}

.other-xs ul {
    gap: 15px
}

    .other-xs ul > li > a {
        padding: 13px 8px;
        border-radius: 4px;
        box-shadow: inset 0 0 0 4px rgba(255,255,255,.4);
        background: #5b3ef0
    }

        .other-xs ul > li > a:hover {
            background: #fa3276
        }

        .other-xs ul > li > a i {
            width: 40px;
            height: 20px;
            border-right: 2px solid rgba(255,255,255,.4)
        }

        .other-xs ul > li > a span {
            display: inline-block;
            padding-left: 15px;
            font-size: 16px;
            font-weight: 500
        }

@media(max-width:1199px) {
    .signup-section {
        background: #fff
    }
}

.signup-content {
    background: #fff;
    padding: 30px
}

@media(max-width:1199px) {
    .signup-content.round-top-in::before, .signup-content.round-top-in::after {
        display: none
    }
}

@media(max-width:575px) {
    .signup-content {
        padding: 15px 0
    }

        .signup-content .form-inner {
            padding: 10px 10px 15px
        }

            .signup-content .form-inner > h3 {
                margin: 5px -20px 0 -10px
            }
}

.editBa-content {
    background: #fff;
    padding: 30px 0 40px
}

#companyInfo textarea {
    height: unset !important;
    height: 198px !important;
    padding-block: 15px
}

@media(max-width:1199px) {
    .business-profile-settings {
        background: #fff
    }

        .business-profile-settings .round-top-in::before, .business-profile-settings .round-top-in::after {
            display: none
        }
}

.company-cover {
    padding-bottom: 15px;
    border-radius: 8px
}

    .company-cover > img {
        border-radius: 8px;
        width: 100%;
        height: 350px;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: top center;
        object-position: top center
    }

.fixedToTop .theiaStickySidebar {
    z-index: 9
}

.profile-content-area {
    padding-top: 20px
}

.profile-nav {
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    --dleft: 12px;
    left: var(--dleft);
    padding: 10px;
    box-shadow: none;
    border-radius: 0;
    z-index: 3
}

    .profile-nav.profile-nav-f {
        position: fixed;
        border-radius: 0 0 24px 24px;
        box-shadow: 0 5px 10px -3px rgba(0,0,0,.1)
    }

    .profile-nav ul {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        -moz-column-gap: 10px;
        column-gap: 10px
    }

        .profile-nav ul li a {
            font-size: 15px;
            padding: 6px 25px;
            font-weight: 600;
            color: #fff !important;
            background: #0e2f87;
            display: block;
            border: 1px solid #fff;
            box-shadow: 0 0 0 2px rgba(91,62,240,.15);
            border-radius: 24px
        }

        .profile-nav ul li:not(.active) a:hover {
            opacity: .8
        }

        .profile-nav ul li.active a {
            pointer-events: none;
            color: #FF6D1F !important;
            background: rgba(91,62,240,.2)
        }

.edit-profile-btn {
    font-size: 14px;
    font-weight: 600;
    min-width: -moz-fit-content;
    min-width: fit-content;
    padding: 6px 12px;
    border: 1px solid rgba(47,46,65,.05);
    border-radius: 24px;
    box-shadow: inset 0 0 0 2px rgba(255,255,255,.4);
    margin-inline-start: auto;
    align-items: center;
    background: #1d3557;
    color: #fff
}

    .edit-profile-btn i {
        display: inline-block;
        font-size: 12px;
        margin-inline-end: 5px
    }

.profile-card {
    position: relative;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 0 15px rgba(91,62,240,.15),inset 0 0 5px rgba(47,46,65,.3);
    margin-top: -100px;
    transform: translateX(10px);
}

    .profile-card .profile-pic > img {
        width: 180px;
        height: 180px;
        background: #fff;
        display: block;
        border-radius: 100%;
        border: 10px solid #fff;
        margin-inline: auto;
        transform: translateY(-50px);
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center
    }

    .profile-card .profile-pic h2 {
        color: #1d3557;
        font-size: 26px;
        font-weight: 700;
        margin: -45px 20px 5px;
        padding-bottom: 5px;
        text-align: center
    }

    .profile-card .profile-pic p {
        font-size: 16px;
        font-weight: 600;
        line-height: 22px;
        color: #2f2e41;
        text-align: center;
        margin: 10px 20px 30px;
        padding: 0 5px 5px;
        background: rgba(47,46,65,.01);
        border-radius: 4px;
        border-block: 1px solid rgba(47,46,65,.1)
    }

    .profile-card .profile-inner > ul {
        padding: 0 15px;
        margin-bottom: 25px
    }

        .profile-card .profile-inner > ul li {
            display: flex
        }

            .profile-card .profile-inner > ul li + li {
                margin-top: 15px
            }

            .profile-card .profile-inner > ul li i {
                width: 30px;
                height: 30px;
                font-size: 16px;
                border-radius: 4px;
                margin-right: 5px;
                background: rgba(29,53,87,.05);
                color: #1d3557
            }

            .profile-card .profile-inner > ul li p {
                font-size: 15px;
                font-weight: 500;
                margin-top: 3px
            }

                .profile-card .profile-inner > ul li p a:hover {
                    color: #5b3ef0;
                    text-decoration: underline
                }

    .profile-card .mbl-btns {
        display: none;
        align-items: center;
        justify-content: space-between
    }

    .profile-card #btn-proDetail {
        padding: 6px 20px 6px 6px;
        font-size: 14px;
        font-weight: 600;
        border: 1px solid rgba(29,53,87,.1);
        background: rgba(0,0,0,0);
        border-radius: 24px;
        color: #1d3557;
        display: flex;
        flex-wrap: nowrap;
        white-space: nowrap;
        align-items: center;
        transition: transform .05s linear
    }

        .profile-card #btn-proDetail p {
            margin-inline-end: 10px;
            align-items: center;
            flex-direction: column;
            flex-wrap: nowrap;
            overflow: hidden;
            width: 30px;
            height: 30px;
            border-radius: 100%;
            background: #1d3557;
            color: #fff
        }

            .profile-card #btn-proDetail p i {
                width: 30px;
                height: 30px;
                font-size: 16px;
                transition: transform .3s ease-in-out .1s;
                transform: translateY(0)
            }

        .profile-card #btn-proDetail.shown-details p i {
            transform: translateY(-100%)
        }

.social-handles {
    border-top: 1px solid rgba(47,46,65,.1);
    padding: 20px;
    margin: 15px 20px 5px
}

    .social-handles > a {
        width: 35px;
        height: 35px;
        border-radius: 8px;
        box-shadow: 0 0 10px -2px rgba(91,62,240,.4),inset 0 0 2px rgba(47,46,65,.2)
    }

        .social-handles > a i {
            color: #0e2f87 !important
        }

#contact_icon a i {
    color: #fff !important;
}

.profile-content-area .brand-card figcaption {
    /*  bottom: 40px*/
}

/*.profile-content-area .brand-card:hover figcaption {
        bottom: 50px
    }*/

.post-summary {
    padding: 5px 15px;
    border-radius: 4px;
    margin-top: 5px;
    background: rgba(91,62,240,.05)
}

    .post-summary > ul {
        opacity: .6
    }

        .post-summary > ul > li {
            color: #5b3ef0;
            display: flex
        }

            .post-summary > ul > li p {
                margin-left: 5px;
                font-weight: 600
            }

.post-changes {
    padding: 15px 15px 10px;
    box-shadow: 0 5px 15px -3px rgba(47,46,65,.2);
    background: #fff;
    border-radius: 0 0 4px 4px;
    position: absolute;
    top: -10px;
    left: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    z-index: 2;
    visibility: hidden;
    opacity: 0;
    transition: all .3s ease
}

    .post-changes > a {
        width: 30px;
        height: 30px;
        border-radius: 4px;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #fff;
        position: relative
    }

        .post-changes > a + a {
            margin-left: 10px
        }

.brand-card:hover .post-changes {
    top: 0;
    visibility: visible;
    opacity: 1
}

.delete-warning .modal-content {
    text-align: center;
    background: #fff;
    padding: 30px;
    border-radius: 16px;
    position: relative;
    outline: 10px solid rgba(250,50,118,.75);
    outline-offset: 5px;
    box-shadow: 0 0 0 6px rgba(255,255,255,.4)
}

.delete-warning .exit-modal {
    position: absolute;
    top: 10px;
    right: 15px;
    color: #fff;
    width: 30px;
    height: 30px;
    border-radius: 100%;
    background: #fa3276
}

.delete-warning .modal-body h4 {
    font-size: 20px;
    font-weight: 700;
    color: rgba(47,46,65,.8)
}

@media(max-width:1600px) {
    .profile-header > .theme-container::before, .profile-header > .theme-container::after {
        display: none
    }
}

@media(max-width:1399px) {
    .profile-nav ul {
        -moz-column-gap: 8px;
        column-gap: 8px
    }

        .profile-nav ul li a {
            font-size: 14px;
            padding: 5px 15px
        }
}

@media(max-width:1199px) {
    .profile-card {
        border-radius: 0;
        background: #fff;
        box-shadow: none;
        margin-top: 0;
        transform: translateX(0);
        padding-inline-start: 15px;
        display: flex;
        justify-content: space-between;
        align-items: start
    }

        .profile-card .profile-pic {
            display: flex;
            align-items: center;
            margin-top: -60px
        }

            .profile-card .profile-pic > img {
                width: 140px;
                height: 140px;
                margin-inline: initial;
                transform: translateY(0);
                border: 6px solid #fff
            }

            .profile-card .profile-pic .img-cap {
                margin-inline-start: 5px
            }

            .profile-card .profile-pic h2 {
                color: #1d3557;
                font-size: 26px;
                font-weight: 700;
                margin: 30px 0 0;
                padding-bottom: 0;
                text-align: start
            }

            .profile-card .profile-pic p {
                font-size: 16px;
                font-weight: 600;
                line-height: 22px;
                color: #2f2e41;
                text-align: start;
                margin: 5px 0 0;
                padding: 0;
                background: rgba(0,0,0,0);
                border-radius: 0;
                border-block: none
            }

        .profile-card .profile-inner {
            width: 320px;
            padding-block: 15px;
            border-radius: 16px 0 0 0;
            position: absolute;
            right: 0;
            bottom: calc(100% + 14px);
            background: #fff;
            -webkit-clip-path: circle(0% at 100% 100%);
            clip-path: circle(0% at 100% 100%);
            transition: all .6s ease-in-out
        }

            .profile-card .profile-inner::before {
                position: absolute;
                content: "";
                width: 15px;
                height: 15px;
                top: -15px;
                right: 0;
                border-radius: 0 0 8px 0;
                box-shadow: 4px 4px 0 #fff
            }

            .profile-card .profile-inner::after {
                position: absolute;
                content: "";
                width: 15px;
                height: 15px;
                bottom: 0;
                left: -15px;
                border-radius: 0 0 16px 0;
                box-shadow: 4px 4px 0 #fff
            }

            .profile-card .profile-inner.show-details {
                -webkit-clip-path: circle(150% at 100% 100%);
                clip-path: circle(150% at 100% 100%)
            }

        .profile-card .mbl-btns {
            display: flex
        }
}

@media(max-width:991px) {
    .profile-card .profile-pic {
        margin-top: 0px
    }

    .profile-nav ul {
        align-items: start;
        gap: 8px
    }

        .profile-nav ul li a {
            font-size: 13px;
            padding: 5px 15px
        }

    .edit-profile-btn {
        padding: 4px 8px
    }
}

@media(max-width:767px) {
    .profile-card {
        padding-inline-start: 5px
    }

        .profile-card #btn-proDetail {
            padding: 3px 12px 3px 3px;
            font-size: 12px
        }

            .profile-card #btn-proDetail p {
                margin-inline-end: 5px;
                width: 25px;
                height: 25px
            }

                .profile-card #btn-proDetail p i {
                    width: 25px;
                    height: 25px;
                    font-size: 14px
                }

                    .profile-card #btn-proDetail p i + i {
                        font-size: 15px
                    }

        .profile-card .profile-pic {
            margin-top: -60px
        }

            .profile-card .profile-pic > img {
                width: 100px;
                height: 100px;
                border: 4px solid #fff
            }

            .profile-card .profile-pic .img-cap {
                padding-top: 15px
            }

            .profile-card .profile-pic h2 {
                font-size: 22px;
                font-weight: 700
            }

            .profile-card .profile-pic p {
                font-size: 14px;
                line-height: 20px
            }

    .profile-content-area {
        padding-top: 15px
    }

    .profile-nav {
        padding-top: 0;
        padding-inline: 0;
        align-items: start;
        flex-direction: column;
        position: relative;
        --dleft: 0 !important
    }

        .profile-nav.profile-nav-f {
            position: relative !important
        }

        .profile-nav ul {
            margin-top: 10px;
            order: 2;
            width: 100%;
            justify-content: space-between
        }

    .edit-profile-btn {
        order: 1;
        margin-top: -15px;
        background: rgba(0,0,0,0);
        color: #1d3557;
        padding: 3px 12px 3px 3px;
        font-size: 12px;
        border: 1px solid rgba(47,46,65,.1)
    }

        .edit-profile-btn i {
            width: 25px;
            height: 25px;
            border-radius: 100%;
            background: #1d3557;
            color: #fff;
            display: flex;
            align-items: center;
            justify-content: center
        }
}

@media(max-width:575px) {
    .company-cover {
        padding-bottom: 0
    }

        .company-cover > img {
            height: 200px
        }

    .profile-card {
        padding-inline: 0;
        flex-wrap: wrap
    }

        .profile-card .profile-pic {
            flex-direction: column;
            margin-top: -40px !important;
            flex-basis: 100%;
            flex-shrink: 0
        }

            .profile-card .profile-pic > img {
                width: 80px;
                height: 80px;
                border: 3px solid #fff
            }

            .profile-card .profile-pic .img-cap {
                padding-top: 0;
                margin-inline-start: 0
            }

            .profile-card .profile-pic h2 {
                font-size: 20px;
                margin: 0;
                text-align: center
            }

            .profile-card .profile-pic p {
                width: 100%;
                font-size: 14px;
                text-align: center
            }

        .profile-card .profile-inner {
            flex-basis: 100%;
            flex-shrink: 0;
            padding-block: 0;
            border-radius: 0;
            position: relative;
            display: flex;
            flex-direction: column;
            justify-content: flex-start;
            right: initial;
            bottom: initial;
            background: #fff;
            max-height: 0;
            overflow: hidden;
            -webkit-clip-path: circle(150% at 100% 100%);
            clip-path: circle(150% at 100% 100%);
            transition: max-height .6s ease-in-out
        }

            .profile-card .profile-inner::before, .profile-card .profile-inner::after {
                display: none
            }

            .profile-card .profile-inner.show-details {
                width: 100%;
                max-height: 600px
            }

            .profile-card .profile-inner .social-handles {
                border-top: none;
                /*  flex-direction: column;*/
                margin: 0;
                /*padding: 0;*/
                gap: 50px
            }


                .profile-card .profile-inner .social-handles > a {
                    width: 25px;
                    height: 25px;
                    border-radius: 4px;
                    box-shadow: none;
                    border: 1px solid rgba(47,46,65,.13);
                    font-size: 14px
                }

            .profile-card .profile-inner ul {
                width: 100%;
                padding-inline: 0;
                margin-bottom: 0
            }

                .profile-card .profile-inner ul li i {
                    width: 25px;
                    height: 25px;
                    font-size: 14px;
                    background: rgba(29,53,87,.07)
                }

                .profile-card .profile-inner ul li p {
                    font-size: 14px;
                    font-weight: 400;
                    margin-top: 2px
                }

        .profile-card .mbl-btns {
            flex-wrap: wrap;
            width: 100%;
            margin-block: 8px
        }

    .profile-nav ul {
        justify-content: center
    }

        .profile-nav ul li {
            width: calc(33% - 4px)
        }

            .profile-nav ul li a {
                text-align: center
            }

    .edit-profile-btn {
        margin-top: 0
    }
}

@media(max-width:490px) {
    .profile-nav ul li {
        width: calc(50% - 4px)
    }
}

@media(max-width:340px) {
    .profile-nav ul {
        -moz-column-gap: 0;
        column-gap: 0;
        row-gap: 10px
    }

        .profile-nav ul li {
            width: 100%
        }
}

#branch_ID_1, #branch_ID_2, #branch_ID_3, #branch_ID_4 {
    width: 100%;
    height: 400px;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(47,46,65,.2);
    z-index: 1
}

#brance-iframe {
    width: 100%;
    height: 400px;
}

.branch-header {
    margin-top: 60px;
    display: flex;
    justify-content: space-between;
    align-items: end;
    padding-bottom: 15px
}

    .branch-header ~ .branch-header {
        margin-top: 0
    }

    .branch-header h4 {
        font-size: 26px;
        font-weight: 700;
        color: #1d3557
    }

    .branch-header > a {
        display: inline-flex;
        align-items: center;
        background: #1d3557;
        color: #fff;
        padding: 15px;
        border-radius: 8px;
        box-shadow: inset 0 0 0 4px rgba(255,255,255,.4)
    }

        .branch-header > a span {
            font-size: 16px;
            font-weight: 500;
            margin-inline-start: 5px;
            color: #fff
        }

        .branch-header > a i {
            font-size: 24px;
            margin-inline-start: 15px;
            padding-inline-start: 15px;
            border-inline-start: 2px solid rgba(255,255,255,.4);
            color: #fff
        }

.branch-card {
    padding: 15px;
    gap: 15px;
    background: rgba(91,62,240,.02);
    border-radius: 8px;
    border: 2px solid rgba(29,53,87,.1);
    margin-bottom: 30px;
    display: flex
}

.brnach-info {
    margin-top: 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    width: 40%
}

    .brnach-info h4 {
        font-size: 22px;
        font-weight: 800;
        background: rgba(29,53,87,.03);
        color: #1d3557;
        padding: 8px 30px 10px 30px;
        border-radius: 24px;
        outline: 2px solid #1d3557;
        outline-offset: 2px
    }

    .brnach-info ul {
        margin-top: 30px;
        padding-block: 30px;
        border-block: 1px solid rgba(29,53,87,.2)
    }

    .brnach-info li + li {
        margin-top: 15px
    }

    .brnach-info li i {
        width: 30px;
        height: 30px;
        border-radius: 2px;
        font-size: 18px;
        background: #1d3557;
        color: #fff;
        margin-right: 15px;
        outline: 2px solid #1d3557;
        outline-offset: 2px
    }

    .brnach-info li p {
        font-size: 16px;
        font-weight: 500;
        width: 90%;
    }

    .brnach-info .branch-social-handles {
        margin-top: 30px
    }

        .brnach-info .branch-social-handles a {
            width: 30px;
            height: 30px;
            border-radius: 100%;
            background: #fff;
            outline: 2px solid #1d3557;
            outline-offset: 2px;
            box-shadow: 0 0 15px rgba(29,53,87,.5)
        }

            .brnach-info .branch-social-handles a + a {
                margin-left: 20px
            }

            .brnach-info .branch-social-handles a i {
                font-size: 18px
            }

.brnach-map {
    width: 60%
}

.branch-main .brnach-map {
    width: 100%
}

.edit-branch-btn {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px 5px 5px;
    border-radius: 24px;
    margin-top: auto;
    border: 1px solid rgba(29,53,87,.1)
}

    .edit-branch-btn i {
        width: 25px;
        height: 25px;
        font-size: 12px;
        border-radius: 100%;
        background: #1d3557;
        color: #fff;
        margin-inline-end: 8px
    }

    .edit-branch-btn span {
        font-size: 14px;
        font-weight: 600;
        color: #1d3557
    }

.edit-map-info .modal-content {
    text-align: left;
    padding: 0;
    outline: 10px solid rgba(29,53,87,.75)
}

.edit-map-info .modal-body {
    padding: 0
}

    .edit-map-info .modal-body h4 {
        padding: 15px 30px;
        border-bottom: 1px solid rgba(47,46,65,.1)
    }

.edit-map-info .exit-modal {
    background: #1d3557
}

.edit-map-info .form-footer button {
    background: #1d3557
}

@media(max-width:991px) {
    .brnach-info, .brnach-map {
        width: 100%
    }

    .branch-header {
        margin-top: 30px
    }

        .branch-header h4 {
            font-size: 24px
        }

        .branch-header > a {
            padding: 13px
        }

            .branch-header > a span {
                font-size: 14px
            }

            .branch-header > a i {
                font-size: 20px
            }

    .edit-branch-btn {
        margin-top: 20px
    }
}

@media(max-width:767px) {
    .branch-header {
        margin-top: 0
    }

        .branch-header h4 {
            font-size: 20px
        }

    .brnach-info h4 {
        font-size: 18px;
        font-weight: 700;
        padding: 8px 20px;
        outline: 2px solid #1d3557;
        outline-offset: 1px
    }

    .brnach-info ul {
        margin-top: 20px;
        padding-block: 0 15px;
        border-block: none;
        border-bottom: 1px solid rgba(29,53,87,.2)
    }

    .brnach-info .branch-social-handles {
        margin-top: 20px
    }

    .brnach-info li {
        align-items: start !important
    }

        .brnach-info li p {
            font-size: 14px
        }

        .brnach-info li i {
            width: 25px;
            height: 25px;
            font-size: 15px;
            margin-right: 10px;
            outline: 1px solid #1d3557;
            outline-offset: 1px
        }
}

@media(max-width:575px) {
    .branch-header {
        padding-bottom: 10px
    }

        .branch-header h4 {
            font-size: 18px
        }

        .branch-header > a {
            background: #fff;
            outline: 0;
            display: inline-flex;
            align-items: center;
            padding: 5px 12px 5px 5px;
            border-radius: 24px;
            border: 1px solid rgba(29,53,87,.1)
        }

            .branch-header > a i {
                order: 1;
                display: flex;
                align-items: center;
                justify-content: center;
                width: 28px;
                height: 28px;
                font-size: 16px;
                border-radius: 100%;
                background: #1d3557;
                color: #fff;
                margin-inline-end: 8px;
                margin-inline-start: 0;
                padding: 0;
                border: none
            }

            .branch-header > a span {
                order: 2;
                font-size: 14px;
                font-weight: 600;
                color: #1d3557;
                margin: 0
            }

    .brnach-info h4 {
        font-size: 16px;
        padding: 5px 15px;
        outline: 1px solid #1d3557
    }

    .brnach-info .branch-social-handles a {
        width: 25px;
        height: 25px;
        outline: 1px solid #1d3557;
        outline-offset: 1px;
        box-shadow: 0 0 8px rgba(29,53,87,.3)
    }

        .brnach-info .branch-social-handles a + a {
            margin-left: 10px
        }

        .brnach-info .branch-social-handles a i {
            font-size: 14px
        }

    .brnach-info li p {
        font-size: 13px
    }

    .brnach-info li i {
        width: 22px;
        height: 22px;
        font-size: 12px;
        margin-right: 8px
    }

    .edit-branch-btn {
        padding: 3px 10px 3px 3px
    }

        .edit-branch-btn i {
            width: 22px;
            height: 22px;
            font-size: 10px;
            margin-inline-end: 5px
        }

        .edit-branch-btn span {
            font-size: 12px
        }
}

@media(max-width:414px) {
    .branch-header {
        align-items: center;
        padding-bottom: 5px
    }

        .branch-header h4 {
            font-size: 16px
        }

        .branch-header > a {
            padding: 4px 10px 4px 4px
        }

            .branch-header > a i {
                width: 25px;
                height: 25px;
                font-size: 14px;
                margin-inline-end: 5px
            }

            .branch-header > a span {
                font-size: 13px
            }
}

.dasgboard-header, .d-card {
    padding: 20px 5px;
    border-radius: 8px;
    box-shadow: 0 0 12px -4px rgba(47,46,65,.2);
    border: 1px solid rgba(47,46,65,.07);
    border-left: none;
    display: flex;
    position: relative
}

.dasgboard-header {
    flex-direction: column;
    border-left: 10px solid rgb(50 148 250);
    align-items: flex-start;
    overflow-x: clip;
    background: rgba(91,62,240,.02)
}

    .dasgboard-header.balance-row {
        border-left: 10px solid #26bf94;
        background: rgba(38,191,148,.02)
    }

    .dasgboard-header > h3 {
        color: #fff;
        background: rgb(50 148 250);
        margin: 5px -20px 15px;
        padding: 8px 20px 9px;
        font-size: 26px;
        font-weight: 700;
        border-radius: 0 8px 8px 0;
        letter-spacing: 1px;
        position: relative
    }
    /*
        .dasgboard-header > h3::before {
            position: absolute;
            content: "";
            width: 100vw;
            height: 2px;
            background: rgb(50 148 250);
            left: 100%;
            top: 50%;
            transform: translateY(-50%)
        }*/

    .dasgboard-header.balance-row > h3 {
        background: #26bf94
    }

        .dasgboard-header.balance-row > h3::before {
            background: #26bf94
        }

    .dasgboard-header > p {
        font-size: 16px;
        font-weight: 500;
        margin-left: 10px;
        color: rgba(29,53,87,.8)
    }

    .dasgboard-header > i {
        position: absolute;
        top: 0;
        right: 10px;
        width: 50px;
        height: 50px;
        outline: 3px solid rgba(91,62,240,.2);
        outline-offset: 2px;
        border-radius: 0 0 50px 50px;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #fff;
        font-size: 26px
    }

    .dasgboard-header.balance-row > i {
        outline: 3px solid rgba(38,191,148,.2)
    }

    .dasgboard-header > a {
        padding: 3px 8px 2px;
        border-radius: 4px;
        outline: 2px solid rgb(50 148 250);
        outline-offset: 2px;
        background: rgb(50 148 250);
        color: #fff
    }

        .dasgboard-header > a span {
            display: inline-block;
            margin-left: 10px;
            font-size: 15px;
            font-weight: 700;
            letter-spacing: .015rem;
            word-spacing: 3px
        }

        .dasgboard-header > a i {
            font-size: 20px;
            transform: translateY(-1px)
        }

        .dasgboard-header > a:hover {
            color: #fff;
            background: #1762b1;
            outline: 2px solid rgba(91,62,240,.4)
        }

    .dasgboard-header.balance-row > a {
        outline: 2px solid #26bf94;
        background: rgba(38,191,148,.1);
        color: #26bf94
    }

        .dasgboard-header.balance-row > a:hover {
            color: #fff;
            background: #26bf94;
            outline: 2px solid rgba(38,191,148,.4)
        }

.d-card {
    overflow-x: clip;
    padding-left: 0;
    align-items: center;
    transition: all .3s ease;
    height: 115px;
}

    .d-card > i {
        width: 60px;
        height: 60px;
        padding-right: 5px;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 0 4px 4px 0;
        font-size: 32px;
        outline-offset: 3px;
        color: #fff
    }

    .d-card p {
        font-size: 15px;
        font-weight: 500;
        color: rgba(29,53,87,.8)
    }

    .d-card span {
        font-size: 40px;
        font-weight: 700
    }

    .d-card h4 {
        width: calc(100% - 70px)
    }

    .d-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 5px 12px -4px rgba(47,46,65,.2)
    }

    .d-card[data-color=cyan] {
        border-left: 5px solid #0dcaf0
    }

        .d-card[data-color=cyan] > i {
            background: #0dcaf0;
            outline: 4px solid rgba(13,202,240,.6)
        }

        .d-card[data-color=cyan] span {
            color: #0dcaf0
        }

    .d-card[data-color=orange] {
        border-left: 5px solid #fd7e14
    }

        .d-card[data-color=orange] > i {
            background: #fd7e14;
            outline: 4px solid rgba(253,126,20,.6)
        }

        .d-card[data-color=orange] span {
            color: #fd7e14
        }

    .d-card[data-color=yellow] {
        border-left: 5px solid #ffc107
    }

        .d-card[data-color=yellow] > i {
            background: #ffc107;
            outline: 4px solid rgba(255,193,7,.6)
        }

        .d-card[data-color=yellow] span {
            color: #ffc107
        }

    .d-card[data-color=purple] {
        border-left: 5px solid #6f42c1
    }

        .d-card[data-color=purple] > i {
            background: #6f42c1;
            outline: 4px solid rgba(111,66,193,.6)
        }

        .d-card[data-color=purple] span {
            color: #6f42c1
        }

    .d-card[data-color=pink] {
        border-left: 5px solid #d63384
    }

        .d-card[data-color=pink] > i {
            background: #d63384;
            outline: 4px solid rgba(214,51,132,.6)
        }

        .d-card[data-color=pink] span {
            color: #d63384
        }

    .d-card[data-color=green] {
        border-left: 5px solid #198754
    }

        .d-card[data-color=green] > i {
            background: #198754;
            outline: 4px solid rgba(25,135,84,.6)
        }

        .d-card[data-color=green] span {
            color: #198754
        }

.single-product-page .company-cover img {
    height: 200px
}

.visit-store-btn {
    background: #e96620;
    color: #fff;
    padding: 10px;
    margin: 30px 30px 15px;
    border-radius: 8px;
    transform: translateY(-15px);
    box-shadow: inset 0 0 0 4px rgba(255,255,255,.4)
}

    .visit-store-btn span {
        font-size: 15px;
        font-weight: 700;
        margin-right: 15px
    }

#similar_offer_text {
    color: #0e2f87 !important
}

@media(max-width:1199px) {
    .visit-store-btn {
        padding: 6px;
        margin: 0 30px 0
    }

        .visit-store-btn span {
            font-size: 14px
        }
}

@media(max-width:575px) {
    .visit-store-btn {
        display: none !important
    }
}

.product-preview {
    position: relative;
    /*  padding-bottom: 40px;*/
    z-index: 1
}

    .product-preview img {
        border-radius: 8px 8px 0 0
    }

#timerMainDiv {
    color: #fff;
    background: #0e2f87;
    padding: 7px 15px;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 0 15px -5px rgba(47,46,65,.15);
    /*    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;*/
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2
}
.access_denight {
    padding-top: 3%;
    min-height: 50vh;
    position: relative;
    margin: 20px auto;
    max-width: 650px;
    z-index: 10;
}
.access_denight_close_icon {
    position: absolute;
    top: 10px;
    right: 10px;
    background: transparent;
    border: none;
    font-size: 1.2rem;
    text-decoration: none;
    color: #000;
}
.access_denight_div {
    padding-top: 7%;
    padding: 20px;
    min-height: 30vh;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
   text-align:center;
}
@media(max-width:991px) {
    .product-preview figcaption {
        padding: 7px 5px
    }
}

.offer-timer {
    font-size: 18px;
    font-weight: 700
}

@media(max-width:991px) {
    .offer-timer {
        font-size: 14px
    }
}

.offer-timer > div {
    flex: 1;
    text-align: center
}

    .offer-timer > div + div {
        border-left: 1px solid rgba(255,255,255,.4)
    }

.offer-timer span {
    display: inline-block;
    margin-left: 5px
}

@media(max-width:991px) {
    .offer-timer span {
        margin-left: 2px
    }
}

.product-details h3 {
    font-weight: 700;
    font-size: 28px;
    padding-bottom: 5px;
    padding-top: 5px;
    margin-bottom: 10px;
    border-bottom: 1px solid rgba(47,46,65,.2)
}

@media(max-width:991px) {
    .product-details h3 {
        font-size: 26px
    }
}

@media(max-width:767px) {
    .product-details h3 {
        font-size: 20px
    }
}

.product-details {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.available_title h5 {
    font-size: 17px;
    margin-bottom: 15px;
}

.available_list {
    position: relative;
}

    .available_list .icon_body {
        width: 100%;
        min-height: 50px;
        display: flex;
        gap: 5px;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        margin-bottom: 10px;
        background: #0e2f87;
        border-radius: 20px;
        color: #fff;
        border: 4px solid #5ac2ff;
    }

        .available_list .icon_body:hover .fa-solid fa-map-location-dot {
            /*background: #E96620;*/
            color: #fff;
        }

    .available_list .fa-solid fa-map-location-dot {
        color: #fff;
        width: 27px;
        height: 27px;
        display: flex;
        font-size: 17px;
        justify-content: center;
        align-items: center;
        border-radius: 50%;
        z-index: 2;
        transition: .2s;
    }

    .available_list .branch_name {
        background: #E9F3FB;
        padding: 3px 3px 3px 20px;
        border-radius: 10px;
        left: 10px;
        position: absolute;
        z-index: 1;
        font-size: 16px;
        font-weight: 600;
        cursor: pointer;
    }

.detail-body div {
    font-size: 18px;
    line-height: 28px;
    max-height: 300px;
    overflow-y: auto;
}
    /* Scrollbar Styling */
    .detail-body div::-webkit-scrollbar {
        width: 8px;
    }

    .detail-body div::-webkit-scrollbar-track {
        background-color: #ebebeb;
        -webkit-border-radius: 10px;
        border-radius: 8px;
    }

    .detail-body div::-webkit-scrollbar-thumb {
        -webkit-border-radius: 8px;
        border-radius: 8px;
        background: #E96620;
    }

    .product-details div {
        margin-top: 10px
    }

.product-details .detail-body ul {
    margin: 15px 0 15px 30px
}

.product-details .detail-body li {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 5px;
    list-style-type: circle
}

.product-preview:hover .fav i {
    opacity: 1
}

.fav {
    cursor: pointer;
    position: absolute;
    top: 5px;
    right: 10px
}

    .fav i {
        opacity: .7;
        transition: all .3s ease;
        color: #ccc;
        font-size: 30px
    }

    .fav span {
        display: inline-block;
        position: absolute;
        background: #1d3557;
        color: #fff;
        padding: 2px 12px;
        border-radius: 8px;
        white-space: nowrap;
        bottom: 100%;
        left: 50%;
        transform: translateX(-50%);
        display: none
    }

        .fav span::before {
            position: absolute;
            content: "";
            border-top: 5px solid #1d3557;
            border-left: 5px solid rgba(0,0,0,0);
            border-right: 5px solid rgba(0,0,0,0);
            border-bottom: 5px solid rgba(0,0,0,0);
            top: 100%;
            left: calc(50% - 5px)
        }

    .fav:hover span {
        display: block
    }

    .fav.faved i {
        color: #fa3276;
        opacity: 1 !important
    }

    .fav.faved span {
        display: none
    }

.blog-page ::-moz-selection, .blog-single ::-moz-selection {
    color: #fff;
    background: #4a668e;
    text-shadow: none
}

.blog-page ::-moz-selection, .blog-single ::-moz-selection {
    background: #4a668e;
    color: #fff;
    text-shadow: none
}

.blog-page ::selection, .blog-single ::selection {
    background: #4a668e;
    color: #fff;
    text-shadow: none
}

.blog-hero-section .hero-slider .carousel-item {
    height: 300px
}

    .blog-hero-section .hero-slider .carousel-item img {
        height: 300px
    }

.blog-category {
    margin-top: 15px
}

    .blog-category a {
        padding: 20px 0;
        border-radius: 16px;
        display: block;
        text-align: center;
        box-shadow: inset 0 0 0 6px rgba(255,255,255,.4),0 15px 20px -12px rgba(29,53,87,.3)
    }

        .blog-category a svg {
            width: 50px;
            height: 50px;
            stroke-width: 1px;
            transition: all .5s ease
        }

        .blog-category a span {
            display: block;
            text-transform: uppercase;
            letter-spacing: 1px;
            word-spacing: 3px;
            font-size: 16px;
            font-weight: 700;
            padding-block: 4px;
            margin: 10px 10px 0;
            border-radius: 16px;
            color: #fff;
            transition: all .3s ease
        }

        .blog-category a:hover {
            transform: translateY(-5px);
            box-shadow: inset 0 0 0 6px rgba(255,255,255,.4),0 20px 40px -10px rgba(29,53,87,.4)
        }

            .blog-category a:hover svg {
                transform: translateY(-5px);
                transition: all .5s ease .2s
            }

            .blog-category a:hover span {
                transform: translateY(10px);
                transition: all .5s ease
            }

.sticky-posts {
    display: flex;
    gap: 40px;
    justify-content: space-between
}

.sticky-post ul, .blog-meta ul {
    display: flex;
    align-items: center;
    gap: 15px
}

    .sticky-post ul li, .blog-meta ul li {
        background: #fff;
        padding: 3px;
        border-radius: 16px;
        box-shadow: inset 0 0 0 1px #4a668e,inset 0 0 0 15px rgba(74,102,142,.1)
    }

        .sticky-post ul li i, .blog-meta ul li i {
            font-size: 10px;
            width: 20px;
            height: 20px;
            border-radius: 100%;
            background: #4a668e;
            color: #fff
        }

        .sticky-post ul li span, .blog-meta ul li span {
            color: #4a668e;
            font-size: 11px;
            font-weight: 700;
            margin-inline: 3px 5px
        }

.sticky-post {
    width: 50%;
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    padding: 5px;
    background: rgba(74,102,142,.04);
    box-shadow: 0 15px 30px -10px rgba(74,102,142,.4),inset 0 0 5px rgba(74,102,142,.4)
}

    .sticky-post > a {
        position: absolute;
        inset: 0;
        z-index: 1
    }

    .sticky-post figure {
        position: static;
        border-radius: 8px;
        overflow: hidden
    }

        .sticky-post figure img {
            -o-object-position: center;
            object-position: center;
            -o-object-fit: cover;
            object-fit: cover;
            width: 100%;
            height: 350px;
            border-radius: 8px;
            pointer-events: none;
            transition: all 2s ease 0s
        }

    .sticky-post figcaption {
        color: #fff;
        position: absolute;
        width: 100%;
        padding: 30px 15px;
        bottom: -20%;
        left: 0;
        background: linear-gradient(to top,rgba(74,102,142,.8) 40%,transparent 90%);
        transition: all .3s ease;
        display: flex;
        flex-direction: column
    }

    .sticky-post:hover figcaption {
        bottom: 0
    }

    .sticky-post:hover figure img {
        transform: scale(1.1);
        transition: all .5s ease .05s
    }

    .sticky-post .blog-card-body h3 {
        font-size: 32px;
        line-height: 42px;
        font-weight: 700;
        margin: 15px 0 10px;
        text-shadow: 0 2px 8px #4a668e,0 -2px 8px #4a668e;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-wrap: balance;
        height:100px;
        
    }

    .sticky-post .blog-card-body {
        font-size: 16px;
        font-weight: 500;
        line-height: 26px;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-wrap: balance;
        height: 100px;
    }

    .sticky-post .blog-card-footer {
        text-align: end;
        margin: 30px 8px 0 0
    }

        .sticky-post .blog-card-footer a {
            padding: 6px 25px 8px 10px;
            border-radius: 8px 24px 24px 8px;
            border: 1px solid rgba(255,255,255,.6);
            position: relative
        }

            .sticky-post .blog-card-footer a span {
                font-size: 15px;
                font-weight: 500;
                margin-inline-end: 5px
            }

            .sticky-post .blog-card-footer a i {
                font-size: 24px;
                position: absolute;
                top: 50%;
                right: 5px;
                transform: translate(0,-50%)
            }

.blog-page {
    padding: 15px 0
}

    .blog-page .pagination-area {
        margin: 30px 0 60px
    }

        .blog-page .pagination-area a {
            background: #4a668e
        }

            .blog-page .pagination-area a.active {
                background: #eef5fd;
                color: #4a668e;
                box-shadow: inset 0 0 0 4px rgba(74,102,142,.4)
            }

.blog-card {
    height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
    padding: 15px 15px 0;
    background: rgba(91,62,240,.02);
    border: 2px solid rgba(74,102,142,.3);
    border-radius: 8px;
    transition: all .3s ease
}
#blog_details_body{
    height: 63px;
    overflow:hidden;
}
.blog-card > a {
    position: absolute;
    inset: 0
}

    .blog-card > figure {
        overflow: hidden;
        border-radius: 6px
    }

        .blog-card > figure img {
            pointer-events: none;
            border-radius: 6px;
            filter: grayscale(.5);
            transition: all .5s ease
        }

    .blog-card ul {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        margin: 15px -15px 10px;
        padding: 5px 15px;
        border: 2px solid rgba(74,102,142,.3);
        border-inline: none
    }

        .blog-card ul li {
            display: flex;
            align-items: center
        }

        .blog-card ul i {
            width: 20px;
            height: 20px;
            border-radius: 100%;
            font-size: 10px;
            background: #0d6efd;
            color: #fff;
            margin-inline-end: 5px
        }

        .blog-card ul span {
            color: #4a668e;
            font-size: 12px;
            font-weight: 500
        }

    .blog-card h3 {
        font-size: 22px;
        line-height: 32px;
        font-weight: 700;
        /*color: #4a668e;*/
        color: #ff4500;
        margin-bottom: 10px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-wrap: balance
    }

/*     .blog-card p {
            font-size: 16px;
            line-height: 26px;
            font-weight: 500;
            color: #4a668e;
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
            overflow: hidden;
            text-wrap: balance
        }*/
.test {
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    color: #4a668e;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-wrap: balance
}

.blog-card .blog-card-footer {
    margin-inline: -15px
}

    .blog-card .blog-card-footer a {
        display: flex;
        align-items: center;
        position: relative;
        padding: 12px 15px;
        margin-top: 20px;
        border-radius: 0 0 8px 8px;
        background: #eef5fd;
        color: #4a668e;
        overflow: hidden
    }

        .blog-card .blog-card-footer a span {
            font-size: 16px;
            font-weight: 500
        }

        .blog-card .blog-card-footer a i {
            position: absolute;
            top: 50%;
            transform: translate(0,-50%);
            right: 15px;
            font-size: 26px;
            transition: all .2s ease .02s
        }

            .blog-card .blog-card-footer a i + i {
                top: 100%;
                transform: translateY(0);
                transition: all .2s ease 0s
            }

.blog-card:hover {
    background: rgba(91,62,240,0);
    border: 2px solid rgba(74,102,142,.6);
    box-shadow: 0 0 15px -5px rgba(74,102,142,.6)
}

    .blog-card:hover > figure img {
        filter: grayscale(0);
        transform: scale(1.1)
    }

    .blog-card:hover .blog-card-footer a i {
        transform: translate(50px,-50%);
        transition: all .2s ease 0s
    }

        .blog-card:hover .blog-card-footer a i + i {
            top: 50%;
            transform: translateY(-50%);
            transition: all .2s ease .02s
        }

.single-blog-wrapper {
    display: flex;
    justify-content: center;
    gap: 30px
}

.blog-single {
    max-width: 100%;
    width: calc(100% - 80px)
}

.share-post {
    width: 50px
}

    .share-post ul {
        background: #eef5fd;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        border-radius: 8px;
        border: 1px solid rgba(74,102,142,.08)
    }

    .share-post span, .share-post a {
        width: 50px;
        height: 40px
    }

    .share-post span {
        background: #4a668e;
        color: #fff
    }

    .share-post a {
        font-size: 18px;
        color: #4a668e;
        border-top: 1px solid rgba(74,102,142,.08)
    }

.tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px 15px;
    margin: 10px 15px 0;
    border-radius: 24px;
    border: 2px solid #eef5fd
}

    .tag-list p {
        font-size: 18px;
        font-weight: 500;
        color: #4a668e;
        margin-inline-end: 5px
    }

    .tag-list span {
        padding: 2px 12px 4px;
        font-size: 16px;
        letter-spacing: .04rem;
        color: #4a668e;
        border-radius: 24px;
        background: rgba(74,102,142,.04);
        box-shadow: inset 0 0 0 1px rgba(74,102,142,.08)
    }

.featured-blog .blog-content {
    background: rgba(238,245,253,.3)
}

.blog-content {
    margin: -5px 15px 0;
    padding: 15px;
    border-radius: 0 0 24px 24px;
    border: 2px solid #eef5fd
}

    .blog-content > h1 {
        color: #4a668e;
        font-size: 38px;
        line-height: 50px;
        font-weight: 700;
        padding-bottom: 10px;
        text-wrap: balance
    }

    .blog-content > p + p {
        margin-top: 15px
    }

    .blog-content > p, .blog-content > a, .blog-content > p a, .blog-content span, .blog-content > p span, .blog-content {
        font-size: 20px;
        line-height: 36px;
        color: #1d3557
    }

        .blog-content > a, .blog-content > p a, .blog-content li a {
            color: #fa3276;
            outline-offset: 2px;
            border-radius: 4px
        }

            .blog-content > a:hover, .blog-content > p a:hover, .blog-content li a:hover {
                text-decoration: underline
            }

            .blog-content > a:focus, .blog-content > p a:focus, .blog-content li a:focus {
                text-decoration: none;
                outline: 1px solid currentColor
            }

            .blog-content > a:active, .blog-content > p a:active, .blog-content li a:active {
                text-decoration: underline;
                outline: 0
            }

        .blog-content ul, .blog-content ol {
            margin: 20px
        }

            .blog-content ul li, .blog-content ol li {
                font-size: 16px;
                font-weight: 500;
                line-height: 24px
            }

                .blog-content ul li + li, .blog-content ol li + li {
                    margin-top: 10px
                }

            .blog-content ul li {
                padding-left: 15px;
                position: relative
            }

                .blog-content ul li::before {
                    position: absolute;
                    content: "";
                    width: 9px;
                    height: 9px;
                    border-radius: 100%;
                    background: #4a668e;
                    top: 8px;
                    left: 0
                }

        .blog-content ol {
            counter-reset: ol-counter
        }

            .blog-content ol li {
                counter-increment: ol-counter
            }

                .blog-content ol li::before {
                    content: counter(ol-counter) ". ";
                    color: #4a668e
                }

        .blog-content > img, .blog-content > iframe {
            width: 100%;
            border-radius: 8px;
            padding: 15px;
            border: 1px solid rgba(74,102,142,.08);
            margin: 15px 0
        }

        .blog-content > iframe {
            height: 450px
        }

        .blog-content > h2 {
            font-size: 24px;
            font-weight: 700;
            color: #4a668e;
            line-height: 34px;
            margin: 20px 0 5px
        }

        .blog-content blockquote {
            padding: 20px;
            border-radius: 16px;
            margin: 15px 0;
            border-inline-start: 10px solid #4a668e;
            box-shadow: 0 0 15px -5px rgba(74,102,142,.4);
            font-size: 18px;
            font-weight: 500;
            line-height: 34px;
            font-style: italic;
            text-indent: 50px;
            position: relative
        }

            .blog-content blockquote::before {
                position: absolute;
                content: open-quote;
                font-size: 150px;
                top: 45px;
                left: -40px;
                opacity: .2;
                font-style: normal
            }

.blog-thumb {
    background: #eef5fd;
    padding: 15px 15px 0;
    border-radius: 16px 16px 0 0
}

    .blog-thumb img {
        border-radius: 8px;
        width: 100%;
        height: 400px;
        -o-object-fit: cover;
        object-fit: cover
    }

.blog-meta ul {
    gap: 40px;
    padding: 10px 15px 10px;
    border-radius: 0 0 24px 24px;
    background: #eef5fd;
    flex-wrap: wrap
}

    .blog-meta ul li {
        background: #eef5fd;
        box-shadow: inset 0 0 0 1px #4a668e,0 3px 10px -5px rgba(29,53,87,.5)
    }

        .blog-meta ul li i {
            color: #fff;
            width: 25px;
            height: 25px;
            font-size: 12px
        }

        .blog-meta ul li span {
            font-size: 14px
        }

@media(max-width:991px) {
    .red-tab {
        height: 80px;
    }

    .logo-wrapper {
        width: 80%;
        height: 150px;
    }
    .blog-page .pagination-area {
        margin: 30px 0
    }

    .sticky-posts {
        gap: 15px
    }

    .sticky-post figure img {
        height: 320px
    }

    .sticky-post figcaption {
        padding: 15px 10px;
        bottom: -14%
    }

    .sticky-post .blog-card-body h3 {
        font-size: 26px;
        line-height: 35px;
        margin: 10px 0 5px;
        text-shadow: 0 2px 5px #4a668e,0 -2px 5px #4a668e
    }

    .sticky-post .blog-card-body p {
        font-size: 14px;
        line-height: 24px
    }

    .sticky-post .blog-card-footer {
        text-align: end;
        margin: 15px 8px 0 0
    }

    .single-blog-wrapper {
        padding-inline: 15px
    }

    .blog-content > h1 {
        font-size: 32px;
        line-height: 42px
    }

    .blog-content > p + p {
        margin-top: 10px
    }

    .blog-content > p, .blog-content > a, .blog-content > p a, .blog-content span, .blog-content > p span, .blog-content {
        font-size: 18px;
        line-height: 32px
    }

        .blog-content ul, .blog-content ol {
            margin: 15px
        }

            .blog-content ul li, .blog-content ol li {
                font-size: 15px;
                line-height: 22px
            }

                .blog-content ul li + li, .blog-content ol li + li {
                    margin-top: 6px
                }

                .blog-content ul li::before {
                    top: 7px
                }

        .blog-content > img, .blog-content > iframe {
            padding: 10px;
            margin: 10px 0
        }

        .blog-content > iframe {
            height: 400px
        }

        .blog-content > h2 {
            font-size: 20px;
            line-height: 32px;
            margin: 10px 0 0
        }

        .blog-content blockquote {
            padding: 15px;
            border-radius: 16px;
            margin: 10px 0;
            border-inline-start: 8px solid #4a668e;
            font-size: 16px;
            line-height: 28px
        }
}

@media(max-width:767px) {
    .blog-page .pagination-area {
        margin: 20px 0 0
    }

    .sticky-posts {
        flex-direction: column
    }

        .sticky-posts .sticky-post {
            width: 100%
        }

            .sticky-posts .sticky-post ul {
                width: 100%;
                flex-wrap: wrap;
                gap: 5px
            }

            .sticky-posts .sticky-post figure img {
                width: 100%
            }

    .blog-hero-section .hero-slider .carousel-item {
        height: 200px
    }

        .blog-hero-section .hero-slider .carousel-item img {
            height: 200px
        }

    .blog-card ul {
        padding: 5px
    }

    .blog-card h3 {
        font-size: 20px;
        line-height: 30px
    }

    .blog-card p {
        font-weight: 400
    }

    .single-blog-wrapper {
        align-items: center;
        flex-direction: column;
        gap: 15px;
        padding-inline: 5px
    }

        .single-blog-wrapper .share-post, .single-blog-wrapper .theiaStickySidebar {
            position: relative !important;
            transform: none !important;
            inset: initial !important
        }

        .single-blog-wrapper .share-post {
            order: 2;
            width: -moz-fit-content;
            width: fit-content
        }

            .single-blog-wrapper .share-post ul {
                flex-direction: row;
                width: -moz-fit-content;
                width: fit-content;
                border-radius: 4px
            }

                .single-blog-wrapper .share-post ul span, .single-blog-wrapper .share-post ul a {
                    width: 40px;
                    height: 30px
                }

                .single-blog-wrapper .share-post ul a {
                    font-size: 15px;
                    border-top: none;
                    border-inline-start: 1px solid rgba(74,102,142,.08)
                }

        .single-blog-wrapper .blog-single {
            width: 100%
        }

    .blog-thumb {
        padding: 10px 10px 0;
        border-radius: 8px 8px 0 0
    }

        .blog-thumb img {
            width: 100%;
            height: 300px;
            -o-object-fit: cover;
            object-fit: cover;
            border-radius: 4px
        }

    .blog-meta ul {
        padding: 10px;
        gap: 15px;
        border-radius: 0 0 8px 8px
    }

        .blog-meta ul li i {
            width: 20px;
            height: 20px;
            font-size: 10px
        }

        .blog-meta ul li span {
            font-size: 12px
        }

    .blog-content {
        margin: -5px 5px 0;
        padding: 10px
    }

    .tag-list {
        margin: 10px 5px 0
    }
}

@media(max-width:575px) {
    .all_store_btn {
        margin-top: 15px;
    }
        .all_store_btn a {
            margin: 7px 10px 5px 0px;
        }
    .brand-name {
        font-size: 14px;
        margin: 10px 0;
    }
    .img_box_slider a {
        margin: 10px 10px;
    }
    .red-tab {
        height: 75px;
    }
    .logo-wrapper {
        width: 85%;
        margin: -45px auto 0px auto;
        height: 125px;
    }
    .blog-hero-section .hero-slider .carousel-item {
        height: 180px
    }

        .blog-hero-section .hero-slider .carousel-item img {
            height: 180px
        }

    .blog-card {
        padding: 10px 10px 0
    }

        .blog-card ul {
            padding: 5px 10px;
            border-width: 1px;
            margin: 10px -10px 5px
        }

        .blog-card .blog-card-footer {
            margin-inline: -10px
        }

    .blog-content {
        margin: 0;
        padding: 5px;
        border-top: none
    }

        .blog-content > h1 {
            font-size: 28px;
            line-height: 36px
        }

    .blog-thumb {
        padding: 5px
    }

        .blog-thumb img {
            height: 250px
        }

    .blog-meta ul {
        background: rgba(0,0,0,0);
        border: 1px solid #eef5fd;
        gap: 5px;
        padding: 5px;
        border-radius: 0
    }

        .blog-meta ul li {
            box-shadow: inset 0 0 0 1px #4a668e
        }

    .tag-list {
        margin: 10px 0 0
    }
}

@media(max-width:414px) {
    .img_box_slider a {
        margin: 10px 5px;
    }
    .logo-wrapper {
        width: 85%;
        height: 90px;
    }
    .red-tab {
        height: 70px;
    }
        .red-tab::before {
            bottom: -5px;
            right: -30%;
        }
        .red-tab::after {
            bottom: -5px;
            left: -30%;
        }
    .blog-card ul {
        border-width: 1px;
        margin: 10px -10px 5px
    }

    .blog-card h3 {
        font-size: 18px;
        line-height: 26px;
        margin-bottom: 5px
    }

    .blog-card p {
        font-weight: 400
    }

    .blog-card-footer a {
        padding: 8px 10px;
        margin-top: 20px;
        border-radius: 0 0 4px 4px
    }

    .blog-content > h1 {
        font-size: 22px;
        line-height: 32px
    }

    .blog-content > p + p {
        margin-top: 5px
    }

    .blog-content > p, .blog-content > a, .blog-content > p a, .blog-content span, .blog-content > p span, .blog-content {
        font-size: 16px;
        line-height: 28px
    }

        .blog-content ul, .blog-content ol {
            margin: 10px
        }

            .blog-content ul li, .blog-content ol li {
                font-size: 14px
            }

                .blog-content ul li::before {
                    top: 6px
                }

        .blog-content blockquote {
            padding: 10px;
            border-radius: 8px;
            border-inline-start: 5px solid #4a668e;
            font-size: 15px;
            line-height: 26px
        }

            .blog-content blockquote::before {
                font-size: 120px;
                top: 35px
            }

    .blog-thumb img {
        height: 200px
    }
}

.about-page {
    margin-bottom: 100px
}

.mission-vission {
    padding: 120px 0;
    position: relative;
    z-index: 1;
    overflow: hidden
}

@media(max-width:991px) {
    .mission-vission {
        padding: 50px 0
    }
}

.mission figure, .vission figure {
    background: #fff;
    position: relative;
    z-index: 2;
    padding: 10px;
    border-radius: 5px;
    box-shadow: 0 0 20px rgba(0,0,0,.15)
}

@media(max-width:767px) {
    .mission figure, .vission figure {
        max-width: calc(100% - 30px);
        width: 700px;
        margin: 0 auto 15px
    }

        .mission figure img, .vission figure img {
            width: 100%;
            -o-object-fit: cover;
            object-fit: cover;
            -o-object-position: center;
            object-position: center
        }
}

@media(max-width:575px) {
    .mission figure, .vission figure {
        max-width: 100%;
        width: 100%
    }
}

.mission figure::before, .vission figure::before {
    position: absolute;
    content: "";
    width: 120%;
    height: 120%;
    background: url(../../images/UserPanel/dot.png) repeat 15px 15px;
    top: -10%;
    z-index: -1
}

@media(max-width:767px) {
    .mission figure::before, .vission figure::before {
        display: none
    }
}

.mission figure::before {
    left: -15%
}

.vission figure::before {
    right: -12%
}

.mission-vission section {
    position: relative;
    z-index: 1
}

.mission-vission .vission section::before {
    position: absolute;
    content: "";
    width: 100%;
    height: calc(100% + 200px);
    border: 20px solid #E96620;
    top: 50%;
    left: 50%;
    border-radius: 5px;
    transform: translateY(-50%);
    z-index: -1
}

.mission-vission .vission section::after {
    position: absolute;
    content: "";
    width: 20px;
    height: calc(100% + 50px);
    background: #fff;
    top: 50%;
    left: 50%;
    transform: translateY(-50%);
    z-index: -1
}

.mission-vission .mission section::before {
    position: absolute;
    content: "";
    width: 100%;
    height: calc(100% + 200px);
    border: 20px solid #0e2f87;
    top: 50%;
    right: 50%;
    border-radius: 5px;
    transform: translateY(-50%);
    z-index: -1
}

.mission-vission .mission section::after {
    position: absolute;
    content: "";
    width: 20px;
    height: calc(100% + 50px);
    background: #fff;
    top: 50%;
    right: 50%;
    transform: translateY(-50%);
    z-index: -1
}

.mission-vission section > h2 {
    font-weight: 700;
    color: #1d3557
}

@media(max-width:575px) {
    .mission-vission section > h2 {
        font-size: 22px
    }
}

.mission-vission section > p {
    font-size: 15px;
    line-height: 34px;
    color: #2f2e41
}

@media(max-width:575px) {
    .mission-vission section > p {
        font-size: 15px;
        line-height: 26px
    }
}

@media(max-width:991px) {
    .mission-vission .vission section::before, .mission-vission .vission section::after, .mission-vission .mission section::before, .mission-vission .mission section::after {
        display: none
    }
}

.pricing-page {
    margin-bottom: 120px
}

.pricing-cards {
    padding: 80px 50px 50px;
    border-radius: 24px;
    margin-bottom: 50px;
    background: #f9fcff
}

    .pricing-cards ::-moz-selection {
        color: #fff;
        background: #1d3557;
        text-shadow: none
    }

    .pricing-cards ::selection {
        background: #1d3557;
        color: #fff;
        text-shadow: none
    }

.pricing-card {
    height: 100%;
    display: flex;
    flex-direction: column;
    /*justify-content: space-between;*/
    background: #eef5fd;
    outline: 3px solid #4a668e;
    box-shadow: 6px 6px 0 #4a668e;
    border-radius: 16px 24px 16px 24px;
    padding: 15px 0;
    transition: all .3s ease
}

    .pricing-card:hover {
        transform: translateY(-10px);
        box-shadow: 6px 6px 0 #4a668e,0 25px 30px -15px rgba(74,102,142,.8)
    }

.pricing-header {
    padding-block: 15px;
    margin-inline: 15px;
    border-radius: 8px;
    background: #4a668e
}

    .pricing-header h2 {
        font-size: 26px;
        font-weight: 700;
        letter-spacing: 1px;
        margin-inline-start: 15px;
        color: #f7f6fe;
        position: relative
    }

        .pricing-header h2::before {
            position: absolute;
            content: "";
            width: 5px;
            height: calc(100% + 10px);
            background: #eef5fd;
            border-radius: 0 6px 6px 0;
            top: calc(50% + 2px);
            left: -16px;
            transform: translateY(-50%)
        }

@media(max-width:575px) {
    .pricing-header h2 {
        font-size: 22px;
        margin-inline-start: 10px
    }
}

@media(max-width:414px) {
    .pricing-header h2 {
        font-size: 20px;
        margin-inline-start: 8px
    }
}

.pricing-header p {
    font-size: 18px;
    font-weight: 700;
    background: #eef5fd;
    color: #4a668e;
    text-shadow: 1px 1px 2px rgba(74,102,142,.4);
    border-radius: 24px 0 0 24px;
    padding: 10px 15px;
    box-shadow: -10px 0 10px -6px rgba(47,46,65,.8),inset 2px 0 1px rgba(47,46,65,.3);
    position: relative
}

    .pricing-header p > span {
        font-size: 14px;
        font-weight: 500;
        text-shadow: none
    }

    .pricing-header p::before, .pricing-header p::after {
        --br: 8px;
        content: "";
        position: absolute;
        width: var(--br);
        height: var(--br);
        right: 0rem;
        top: -8px;
        box-shadow: 3px 3px 0 0rem #eef5fd;
        border-radius: 0 0 6px
    }

    .pricing-header p::after {
        border-radius: 0 6px 0 0;
        bottom: -8px;
        top: auto;
        box-shadow: 3px -3px 0 0rem #eef5fd
    }

.pricing-body {
    display: flex;
    justify-content: center;
    margin-block: 15px
}

    .pricing-body ul {
        padding: 30px 15px;
        width: calc(100% - 15px);
        background: #4a668e;
        outline: 6px solid rgba(255,255,255,.2);
        outline-offset: -6px;
        border-radius: 16px
    }

        .pricing-body ul li {
            display: flex
        }

            .pricing-body ul li + li {
                margin-top: 15px;
                padding-top: 15px;
                background-image: linear-gradient(to right,rgba(255,255,255,.15) 50%,transparent 10%);
                background-position: left top;
                background-size: 20px 1px;
                background-repeat: repeat-x
            }

            .pricing-body ul li > i {
                width: 20px;
                height: 20px;
                border-radius: 100%;
                color: #4a668e;
                margin-right: 10px;
                background: #fff;
                transform: translateY(1.5px)
            }

                .pricing-body ul li > i::before {
                    margin-inline-end: 1px
                }

            .pricing-body ul li.package-disabled {
                cursor: not-allowed;
                pointer-events: all !important
            }

                .pricing-body ul li.package-disabled > i {
                    font-size: 11px
                }

                .pricing-body ul li.package-disabled > p, .pricing-body ul li.package-disabled > i {
                    opacity: .4
                }

            .pricing-body ul li > p {
                width: calc(100% - 30px);
                font-size: 15px;
                font-weight: 500;
                color: #fff
            }

                .pricing-body ul li > p > span {
                    display: inline-block;
                    opacity: .6;
                    color: #fff;
                    font-size: 12px
                }

.pricing-details .pricing-card {
    padding-bottom: 7.5px
}

    .pricing-details .pricing-card:hover {
        transform: none;
        box-shadow: 6px 6px 0 #4a668e
    }

.pricing-details .pricing-body {
    margin-bottom: 0
}

    .pricing-details .pricing-body ul {
        border-radius: 16px 16px 16px 24px
    }

.pricing-footer {
    margin-inline: 15px
}

    .pricing-footer button {
        font-size: 16px;
        font-weight: 500;
        letter-spacing: 1px;
        color: #fff;
        background: #4a668e;
        padding: 12px 35px;
        border-radius: 8px;
        position: relative
    }

        .pricing-footer button::before, .pricing-footer button::after {
            position: absolute;
            content: "";
            width: 4px;
            height: 40%;
            background: #eef5fd;
            top: 50%;
            transform: translateY(-50%);
            transition: all .2s
        }

        .pricing-footer button::before {
            border-radius: 0 5px 5px 0;
            left: 0
        }

        .pricing-footer button::after {
            border-radius: 5px 0 0 5px;
            right: 0
        }

        .pricing-footer button:hover::before, .pricing-footer button:hover::after {
            height: 60%
        }

.pricing-page .offer-section .container-xl {
    background: #4a668e
}

    .pricing-page .offer-section .container-xl > a {
        position: absolute;
        inset: 0;
        z-index: 2
    }

.pricing-page .offer-section .offer-text h2 span {
    color: #4a668e;
    box-shadow: inset 0 0 0 5px rgba(74,102,142,.4)
}

.membership-block .pricing-card {
    box-shadow: none;
    border-radius: 16px
}

.membership-page {
    margin-bottom: 120px
}

    .membership-page ::-moz-selection {
        color: #fff;
        background: #1d3557;
        text-shadow: none
    }

    .membership-page ::selection {
        color: #fff;
        background: #1d3557;
        text-shadow: none
    }

.membership-info {
    max-width: 900px;
    margin-inline: auto;
    padding: 30px 15px 0
}

    .membership-info ul {
        color: #4a668e
    }

        .membership-info ul li {
            margin-bottom: 30px;
            border-radius: 32px 8px 8px 32px;
            background: #eef5fd;
            border: 2px solid rgba(74,102,142,.05)
        }

            .membership-info ul li > i {
                width: 50px;
                height: 50px;
                border-radius: 40px;
                font-size: 20px;
                box-shadow: 0 0 10px -4px rgba(91,62,240,.4),inset 0 0 3px rgba(74,102,142,.3);
                margin-inline: 8px 0;
                color: #4a668e
            }

            .membership-info ul li > p {
                font-size: 16px;
                font-weight: 500;
                padding: 20px 15px 20px 10px
            }

            .membership-info ul li > span {
                font-size: 14px;
                font-weight: 500;
                padding: 20px 15px;
                border-radius: 0 8px 8px 0;
                outline: 3px solid #4a668e;
                outline-offset: -1px;
                margin-inline-start: auto
            }

                .membership-info ul li > span:not(.current-balance) {
                    min-width: 150px;
                    text-align: center;
                    font-size: 16px
                }

                .membership-info ul li > span.h5 {
                    font-size: 1.25rem;
                    letter-spacing: 1px
                }

            .membership-info ul li > button {
                margin-inline-end: 8px;
                border-radius: 8px;
                padding: 10px 15px;
                font-size: 15px;
                font-weight: 500;
                outline: 2px solid #eef5fd !important;
                outline-offset: -4px
            }

.membership-card {
    margin-block: 30px;
    background: #eef5fd;
    border-radius: 24px 16px 16px 16px;
    border: 10px solid #fff;
    cursor: pointer;
    box-shadow: 0 0 30px -15px rgba(91,62,240,.3),inset 0 0 15px rgba(74,102,142,.08);
    transition: all .3s ease
}

    .membership-card:not(.selected):hover {
        transform: translateY(-5px)
    }

    .membership-card.selected {
        pointer-events: none;
        transform: translateY(-5px);
        box-shadow: 0 5px 20px -10px rgba(91,62,240,.6),inset 0 0 10px rgba(74,102,142,.2)
    }

.membership-header {
    display: flex;
    justify-content: space-between;
    align-items: start;
    color: #4a668e
}

    .membership-header h3 {
        font-size: 20px;
        font-weight: 700;
        margin: 10px 0 0 20px;
        text-shadow: 0 1px 2px currentColor
    }

    .membership-header h4 {
        font-size: 18px;
        font-weight: 700;
        background: #fff;
        padding: 10px 10px;
        border-radius: 0 0 0 12px;
        transform: translateY(-2px);
        display: flex;
        align-items: end
    }

        .membership-header h4 > span {
            font-size: 14px;
            font-weight: 400;
            margin-inline-start: 10px
        }

        .membership-header h4.round-top-in::before {
            top: -2px
        }

        .membership-header h4.round-top-in::after {
            border-right: 4px solid #fff;
            border-top: 4px solid #fff;
            border-left: initial;
            border-radius: 0 16px 0 0;
            top: calc(100% - 4px);
            left: initial;
            right: -4px
        }

.membership-body {
    padding: 0 20px 10px;
    color: #4a668e
}

    .membership-body > p {
        display: none;
        font-size: 16px;
        line-height: 26px;
        padding: 0 0 10px 0;
        text-wrap: balance
    }

    .membership-body ul {
        margin-inline: -20px;
        padding: 10px 20px 0
    }

    .membership-body li {
        display: flex;
        align-items: center
    }

        .membership-body li + li {
            margin-top: 10px
        }

        .membership-body li i {
            width: 18px;
            height: 18px;
            border-radius: 100%;
            margin-inline-end: 5px;
            background: #4a668e;
            color: #fff;
            font-size: 12px
        }

            .membership-body li i::before {
                margin-inline-end: 1px
            }

        .membership-body li p {
            font-size: 14px
        }

.membership-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px;
    background-image: linear-gradient(to right,rgba(74,102,142,.15) 50%,transparent 10%);
    background-position: left top;
    background-size: 15px 1px;
    background-repeat: repeat-x
}

    .membership-footer button {
        order: 2;
        font-size: 13px;
        font-weight: 700;
        letter-spacing: 1px;
        word-spacing: 3px;
        display: inline-flex;
        align-items: center;
        color: #4a668e;
        position: relative;
        overflow-y: clip
    }

        .membership-footer button > span {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            right: calc(100% + 5px);
            white-space: nowrap;
            transition: none;
            transition: all .3s ease
        }

            .membership-footer button > span + span {
                transform: translateY(50%)
            }

.selection {
    order: 1;
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    background: #E96620;
    border: 2px solid #fff;
    outline: 2px solid #E96620;
    opacity: .2;
    transition: all .3s ease
}

    .selection > i {
        font-size: 22px;
        font-weight: 600;
        color: #fff;
        display: none
    }

        .selection > i::before {
            margin-inline-end: 1px
        }

.membership-card:hover .selection {
    opacity: .5
}

.membership-card.selected .selection {
    opacity: 1
}

    .membership-card.selected .selection > i {
        display: block
    }

.membership-card.selected .membership-footer button > span {
    transform: translateY(-150%)
}

    .membership-card.selected .membership-footer button > span + span {
        transform: translateY(-50%)
    }

.package-detail-btn {
    display: flex;
    padding: 15px;
    background: #f9fcff;
    color: #4a668e;
    width: 100%;
    border-radius: 8px;
    box-shadow: 0 0 15px -5px rgba(91,62,240,.4),inset 0 0 6px -2px rgba(74,102,142,.4);
    outline-offset: 0;
    position: relative;
    overflow: hidden;
    transition: all .3s ease
}

@media(max-width:575px) {
    .package-detail-btn {
        padding: 20px 5px
    }
}

.package-detail-btn span {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 1px;
    word-spacing: 5px;
    position: absolute;
    top: 50%;
    left: 50%;
    transition: all .3s ease .3s;
    transform: translate(-50%,-50%)
}

    .package-detail-btn span + span {
        top: 100%;
        transform: translate(-50%,0)
    }

@media(max-width:575px) {
    .package-detail-btn span {
        width: 100%;
        letter-spacing: 0;
        word-spacing: 0;
        font-size: 14px
    }
}

.package-detail-btn i {
    width: 30px;
    height: 30px;
    border-radius: 100%;
    background: #4a668e;
    color: #fff;
    outline: 2px solid #4a668e;
    outline-offset: 2px;
    margin-left: auto;
    margin-left: 0;
    font-size: 20px;
    transition: all .5s ease
}

@media(max-width:575px) {
    .package-detail-btn i {
        display: none !important
    }
}

.package-detail-btn[aria-expanded=true] {
    background: #f9fcff;
    color: #4a668e;
    box-shadow: 0 -5px 15px -10px rgba(91,62,240,.4),inset 0 3px 6px -3px rgba(74,102,142,.2);
    border-radius: 16px 16px 0 0
}

    .package-detail-btn[aria-expanded=true] i {
        transform: rotateX(180deg)
    }

    .package-detail-btn[aria-expanded=true] span {
        top: 0;
        transform: translate(-50%,-100%)
    }

        .package-detail-btn[aria-expanded=true] span + span {
            top: 50%;
            transform: translate(-50%,-50%)
        }

.subscribe-btn {
    padding: 15px 45px;
    outline: 2px solid rgba(0,0,0,0) !important;
    outline-offset: 2px;
    border-radius: 8px;
    font-size: 18px;
    letter-spacing: 1px;
    box-shadow: 0 0 0 2px #4a668e;
    display: flex;
    align-items: center;
    margin-inline: auto;
    background: #eef5fd;
    color: #4a668e;
    font-weight: 700;
    transition: all .3s ease
}

    .subscribe-btn:hover {
        box-shadow: none;
        outline: 2px solid #4a668e !important;
        background: #4a668e;
        color: #eef5fd
    }

    .subscribe-btn i {
        margin-inline-start: 15px;
        font-size: 22px
    }

.membershipfreeaccounttext {
    max-width: 100%;
    text-align: center; /* Fixed the dash */
    font-size: 18px; /* Fixed the dash */
    color: #ffffff;
    font-weight: bold; /* Fixed the dash */
    padding: 5px;
    background: #e96620;
    border-radius: 15px; /* Fixed the dash */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Fixed the dash and added rgba */
}

.membership-nav {
    width: -moz-fit-content;
    width: fit-content;
    margin-inline: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
    padding: 15px;
    margin-bottom: 30px;
    background: #eef5fd;
    border-radius: 0 0 32px 32px;
    box-shadow: 0 10px 15px -5px rgba(91,62,240,.15);
    border: 2px solid rgba(74,102,142,.15);
    border-top: none;
    position: relative;
    z-index: 1
}

    .membership-nav li a {
        display: flex;
        align-items: center;
        color: #fff !important;
        background: #4a668e;
        padding: 8px 20px;
        box-shadow: 0 0 0 2px rgba(74,102,142,.15);
        border: 1px solid #eef5fd;
        border-radius: 24px;
        cursor: pointer;
        transition: all .2s ease
    }

        .membership-nav li a i {
            font-size: 22px;
            width: 40px;
            height: 25px;
            margin-inline-end: 10px;
            border-inline-end: 1px solid rgba(238,245,253,.5);
            transition: all .3s ease;
            display: none !important
        }

        .membership-nav li a span {
            font-size: 14px;
            font-weight: 500;
            letter-spacing: .015rem;
            transition: all .2s ease
        }

    .membership-nav li:not(.active) a:hover {
        opacity: .8
    }

    .membership-nav li.active a {
        color: #4a668e !important;
        background: rgba(74,102,142,.08);
        box-shadow: 0 0 0 2px rgba(74,102,142,.3);
        pointer-events: none
    }

        .membership-nav li.active a i {
            border-inline-end: 1px solid rgba(74,102,142,.3)
        }

.history-table .table-responsive > .os-scrollbar-horizontal {
    inset-inline: 2px !important;
    right: 2px;
    bottom: 2px
}

    .history-table .table-responsive > .os-scrollbar-horizontal .os-scrollbar-track {
        outline: 1px solid rgba(74,102,142,.1);
        outline-offset: 2px;
        pointer-events: initial;
        touch-action: initial;
        background: #eef5fd !important
    }

        .history-table .table-responsive > .os-scrollbar-horizontal .os-scrollbar-track .os-scrollbar-handle {
            background: #4a668e;
            pointer-events: initial;
            touch-action: initial
        }

            .history-table .table-responsive > .os-scrollbar-horizontal .os-scrollbar-track .os-scrollbar-handle:hover {
                cursor: grab
            }

            .history-table .table-responsive > .os-scrollbar-horizontal .os-scrollbar-track .os-scrollbar-handle:active {
                cursor: grabbing
            }

    .history-table .table-responsive > .os-scrollbar-horizontal.os-scrollbar-unusable {
        display: none
    }

.history-header {
    padding: 15px 30px;
    border-radius: 16px 16px 0 0;
    background: #eef5fd
}

    .history-header h3 {
        font-size: 26px;
        font-weight: 700;
        color: #1d3557
    }

    .history-header .nice-select-dropdown {
        left: -4px
    }

.history-filter p {
    font-size: 15px;
    font-weight: 500;
    color: #4a668e;
    margin-inline-end: 10px
}

.history-table .table {
    border-radius: 0 0 16px 16px;
    overflow: hidden;
    min-width: 900px;
    --bs-table-border-color: rgba(74, 102, 142, .1)
}

    .history-table .table th {
        background-color: #eef5fd
    }

    .history-table .table thead th {
        background-color: #4a668e;
        color: #fff
    }

.history-table.transaction-history .table {
    min-width: 1000px
}

.view-receipt {
    display: inline-flex;
    align-items: center;
    background: #000;
    background-color: #1e9473;
    color: #fff;
    padding: 3px 10px 4px;
    border-radius: 4px
}

    .view-receipt span {
        font-size: 14px;
        font-weight: 500;
        margin-inline-start: 5px
    }

    .view-receipt i {
        transform: translateY(1px);
        font-size: 16px
    }

@media(max-width:1199px) {
    .membership-card {
        margin-block: 15px
    }
}

@media(max-width:991px) {
    .membership-info {
        max-width: 100%
    }

        .membership-info ul li {
            margin-bottom: 15px
        }

            .membership-info ul li > p {
                padding: 0 15px 0 10px
            }

            .membership-info ul li > i {
                width: 40px;
                height: 40px;
                margin-inline: 3px 0
            }

            .membership-info ul li > button {
                margin-inline-end: 3px;
                border-radius: 4px;
                padding: 5px 10px;
                font-size: 14px;
                font-weight: 500;
                outline: 1px solid #eef5fd !important;
                outline-offset: -3px
            }

            .membership-info ul li > span {
                padding: 10px 10px
            }

                .membership-info ul li > span:not(.current-balance) {
                    min-width: 125px
                }

    .subscribe-btn {
        padding: 12px 25px;
        outline: 1px solid rgba(0,0,0,0) !important;
        outline-offset: 1px;
        border-radius: 4px;
        font-size: 16px;
        letter-spacing: 0;
        box-shadow: 0 0 0 1px #4a668e
    }

    .membership-card {
        max-width: 750px;
        margin-inline: auto
    }

    .membership-page .membership-block {
        width: 100%
    }

    .membership-page .theme-container {
        padding-inline: 0
    }

    .membership-nav {
        width: 100%;
        gap: 10px
    }
}

@media(max-width:960px) {
    .membership-card {
        max-width: calc(100% - 30px)
    }

    .membership-nav li a {
        padding: 5px 14px
    }

        .membership-nav li a span {
            font-size: 12px;
            letter-spacing: 0
        }
}

@media(max-width:767px) {
    .membership-info {
        max-width: 100%;
        padding-top: 0
    }

        .membership-info ul li {
            border-radius: 24px 8px 8px 24px;
            margin-bottom: 15px
        }

            .membership-info ul li > p {
                font-size: 14px
            }

            .membership-info ul li > i {
                width: 30px;
                height: 30px;
                font-size: 14px;
                margin-inline: 2px 0
            }

            .membership-info ul li > button {
                margin-inline-end: 1px;
                font-size: 13px
            }

            .membership-info ul li > span {
                padding: 4px 8px
            }

                .membership-info ul li > span:not(.current-balance) {
                    min-width: auto;
                    font-size: 14px
                }

                .membership-info ul li > span.h5 {
                    font-size: 1rem;
                    letter-spacing: 0
                }

                .membership-info ul li > span.current-balance {
                    font-size: 12px;
                    padding: 3px 6px !important
                }

    .subscribe-btn {
        padding: 6px 12px;
        font-size: 14px
    }

    .membership-nav {
        width: calc(100% - 1px);
        margin-inline: 0;
        z-index: 5;
        justify-content: space-around;
        position: relative;
        margin-bottom: 0
    }

        .membership-nav li {
            position: static
        }

            .membership-nav li a {
                position: static;
                padding: 0
            }

                .membership-nav li a i {
                    height: 40px;
                    display: flex !important;
                    border: none !important;
                    padding: 0;
                    margin: 0
                }

                .membership-nav li a span {
                    position: absolute;
                    top: calc(100% + 5px);
                    left: 20px;
                    border-radius: 4px;
                    padding: 0;
                    display: none;
                    white-space: nowrap;
                    text-align: center;
                    color: #4a668e;
                    font-size: 26px;
                    font-weight: 700
                }

            .membership-nav li.active a span {
                display: block
            }

    .membership-state {
        margin-top: 40px
    }

        .membership-state.upgrade-membership .row .col-xl-4:first-of-type .membership-card {
            margin-top: 0
        }

    .history-header {
        padding: 10px 15px;
        border-radius: 8px 8px 0 0
    }

        .history-header h3 {
            font-size: 22px
        }
}

@media(max-width:575px) {
    .subscribe-btn {
        padding: 4px 8px;
        font-size: 12px
    }

        .subscribe-btn i {
            font-size: 14px
        }
}

@media(max-width:414px) {
    .membership-info {
        max-width: 100%
    }

        .membership-info ul li {
            border-radius: 24px 4px 4px 24px;
            margin-bottom: 10px
        }

            .membership-info ul li > p {
                font-size: 13px
            }

            .membership-info ul li > i {
                display: none !important
            }

            .membership-info ul li > button {
                font-size: 12px
            }

                .membership-info ul li > button i {
                    display: none
                }

            .membership-info ul li > span {
                border-radius: 0 2px 2px 0
            }

                .membership-info ul li > span:not(.current-balance) {
                    background: rgba(0,0,0,0)
                }

                .membership-info ul li > span.h5 {
                    font-size: .8rem;
                    font-weight: 700;
                    letter-spacing: 0
                }

                .membership-info ul li > span.current-balance {
                    background: rgba(0,0,0,0) !important;
                    padding: 0 !important;
                    outline: 0;
                    color: #1d3557 !important
                }

    .subscribe-btn {
        padding: 2px 8px;
        font-size: 10px
    }

    .membership-nav li a i {
        width: 30px;
        height: 30px;
        font-size: 15px
    }

    .membership-nav li a span {
        top: calc(100% + 10px);
        font-size: 20px
    }

    .membership-state {
        margin-top: 40px
    }

    .membership-header h3 {
        font-size: 16px;
        font-weight: 700;
        margin: 8px 0 0 15px;
        text-shadow: 0 1px 1px currentColor
    }

    .membership-header h4 {
        font-size: 16px;
        padding: 10px 5px 5px
    }

    .membership-footer {
        padding: 10px
    }

        .membership-footer button {
            font-size: 12px;
            letter-spacing: 0;
            word-spacing: 0
        }

    .membership-body li + li {
        margin-top: 5px
    }

    .membership-body li i {
        width: 16px;
        height: 16px;
        font-size: 10px
    }

    .membership-body li p {
        font-size: 13px
    }

    .selection {
        width: 20px;
        height: 20px;
        border: 1px solid #fff;
        outline: 1px solid #5b3ef0;
        opacity: .2;
        transition: all .3s ease
    }

        .selection > i {
            font-size: 18px
        }

    .history-header {
        padding: 5px 10px
    }

        .history-header h3 {
            font-size: 18px
        }
}

.faq-page .theme-container, .xtras .theme-container {
    max-width: 100%;
    width: 900px;
    padding-block: 50px
}

.faq-container {
    padding: 0 12px 12px 0
}

#faq-wraper .card {
    border: none;
    border-radius: 8px;
    background: rgba(91,62,240,.03)
}

    #faq-wraper .card + .card {
        margin-top: 20px
    }

#faq-wraper .card-header {
    background: rgba(0,0,0,0);
    border: none;
    padding: 0
}

#faq-wraper .card-body {
    font-size: 20px;
    line-height: 36px;
    padding: 0 30px 30px;
    color: #1d3557
}

.faq_title > a::after {
    content: "";
    clear: both;
    display: table
}

.faq_title > a {
    padding: 15px 15px 15px 25px;
    display: block
}

    .faq_title > a > span {
        font-size: 22px;
        font-weight: 700;
        line-height: 26px;
        width: calc(100% - 50px);
        float: left;
        display: block;
        color: #1d3557;
        margin-top: 5px
    }

    .faq_title > a > i {
        width: 38px;
        height: 38px;
        font-size: 20px;
        line-height: 40px;
        border-radius: 100%;
        float: right;
        color: #fff;
        text-align: center;
        background: #3294fa
    }

        .faq_title > a > i::before {
            transform: translateY(-2px)
        }

    .faq_title > a[aria-expanded=false] > i {
        display: block
    }

        .faq_title > a[aria-expanded=false] > i + i {
            display: none
        }

    .faq_title > a[aria-expanded=true] > i {
        display: none
    }

        .faq_title > a[aria-expanded=true] > i + i {
            display: block
        }

.xtras li {
    /*list-style-type: decimal;*/
    font-size: 18px;
    line-height: 32px;
    font-weight: 500;
    padding: 15px;
    border: 1px solid rgba(47,46,65,.05);
    border-radius: 8px;
    position: relative;
    color: #2f2e41;
    margin-bottom: 20px
}

    .xtras li a {
        color: #fa3276
    }

        .xtras li a:hover {
            text-decoration: underline
        }

    .xtras li::before {
        position: absolute;
        content: "";
        width: 40px;
        height: 40px;
        border-radius: 4px 0 0 4px;
        border: 1px solid rgba(47,46,65,.05);
        border-right: none;
        top: 12px;
        right: 100%
    }

@media(max-width:991px) {
    .xtras {
        padding-inline-start: 50px
    }
}

.contact-information {
    padding: 50px 0
}

.contactBox-inner {
    background: #fff;
    padding: 70px;
    border-radius: 10px;
    box-shadow: 0 0 25px rgba(0,0,0,.15),inset 0 0 5px 1px rgba(0,0,0,.2)
}

@media(max-width:767px) {
    .contactBox-inner {
        padding: 0;
        box-shadow: none
    }
}

.contact-box {
    display: flex;
    align-items: center;
    padding: 10px;
    border-radius: 8px;
    box-shadow: 0 0 15px -5px rgba(29,53,87,.2)
}

    .contact-box + .contact-box {
        margin-top: 30px
    }

    .contact-box i {
        width: 50px;
        height: 50px;
        display: flex;
        font-size: 22px;
        justify-content: center;
        align-items: center;
        border-radius: 100%;
        background: #0E2F87;
        color: #fff;
        margin-right: 10px
    }

@media(max-width:575px) {
    .contact-box i {
        width: 40px;
        height: 40px;
        font-size: 20px;
        margin-right: 8px
    }
}

@media(max-width:414px) {
    .contact-box i {
        width: 30px;
        height: 30px;
        font-size: 15px;
        margin-right: 4px
    }
}

.contact-box h3 {
    font-size: 18px;
    font-weight: 700;
    color: #0E2F87
}

    .contact-box h3 span {
        font-weight: 400;
        color: #2f2e41
    }

@media(max-width:575px) {
    .contact-box h3 {
        font-size: 16px
    }
}

@media(max-width:414px) {
    .contact-box h3 {
        font-size: 14px
    }
}

@media(max-width:575px) {
    .contact-box + .contact-box {
        margin-top: 12px
    }
}

.contactBox-inner .social-handles {
    margin-top: 40px
}

    .contactBox-inner .social-handles > a {
        width: 50px;
        height: 50px;
        background: #0E2F87;
        color: #fff;
        border-radius: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        outline: 2px solid rgb(14 47 135);
        outline-offset: 3px
    }

        .contactBox-inner .social-handles > a i {
            font-size: 22px
        }

@media(max-width:575px) {
    .contactBox-inner .social-handles > a {
        width: 35px;
        height: 35px;
        outline: 1px solid rgba(29,53,87,.3);
        outline-offset: 2px
    }

        .contactBox-inner .social-handles > a i {
            font-size: 16px
        }
}

@media(max-width:414px) {
    .contactBox-inner .social-handles > a {
        width: 25px;
        height: 25px;
        outline: 1px solid rgba(29,53,87,.3);
        outline-offset: 1px
    }

        .contactBox-inner .social-handles > a i {
            font-size: 14px
        }
}

@media(max-width:575px) {
    .contactBox-inner .social-handles {
        margin: 30px 0;
        padding: 0;
        border-top: none;
        justify-content: space-around !important
    }
}

@media(max-width:414px) {
    .contactBox-inner .social-handles {
        margin: 20px 0
    }
}

.contact-form h2 {
    font-size: 24px;
    line-height: 36px;
    font-weight: 700;
    color: #0E2F87;
    border-radius: 4px;
    background: rgba(29,53,87,.03);
    border-left: 5px solid #E96620;
    padding: 5px 10px 10px
}

@media(max-width:575px) {
    .contact-form h2 {
        font-size: 20px
    }
}

.contact-form input:not([type=radio]):not([type=checkbox]):not([type=file]), .contact-form textarea {
    font-size: 15px;
    padding: 20px 30px;
    border-radius: 3px;
    width: 100%;
    border: 2px solid #1d3557;
    margin-top: 20px;
    box-shadow: none
}

.contact-form input:not([type=radio]):not([type=checkbox]):not([type=file]) {
    height: 60px
}

.contact-form textarea {
    height: 240px
}

.contact-form [type=submit] {
    margin-top: 30px;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    background: #0E2F87;
    color: #fff;
    display: inline-block;
    padding: 15px 40px;
    border-radius: 4px;
    box-shadow: inset 0 0 0 4px rgba(255,255,255,.6)
}

@media(max-width:575px) {
    .contact-form input:not([type=radio]):not([type=checkbox]):not([type=file]), .contact-form textarea {
        margin-top: 15px;
        font-size: 14px;
        padding: 10px;
        border: 1px solid #1d3557
    }

    .contact-form input:not([type=radio]):not([type=checkbox]):not([type=file]) {
        height: 40px
    }

    .contact-form textarea {
        height: 200px
    }

    .contact-form [type=submit] {
        padding: 12px 30px;
        margin-top: 15px
    }
}

#GooGle__Map {
    width: 100%;
    height: 600px;
    z-index: 1
}

@media(max-width:575px) {
    #GooGle__Map {
        height: 400px
    }
}

@media(max-width:414px) {
    #GooGle__Map {
        height: 350px
    }
}

.siteMap {
    height: 100%;
    background: #fff;
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 0 15px rgba(47,46,65,.1)
}

    .siteMap h4 {
        font-size: 22px;
        font-weight: 700;
        border-bottom: 1px solid rgba(47,46,65,.1);
        padding-bottom: 10px;
        margin-bottom: 15px
    }

@media(max-width:414px) {
    .siteMap {
        padding: 15px
    }
}

.siteMap .divider {
    margin-block: 20px;
    height: 1px;
    border-top: 1px solid rgba(47,46,65,.1)
}

.siteMap > a {
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1px;
    word-spacing: 3px;
    min-width: 250px;
    display: block;
    padding: 10px 15px;
    margin: 15px 0;
    box-shadow: 0 0 5px rgba(47,46,65,.1);
    border-radius: 4px;
    background: #5b3ef0;
    color: #fff
}

    .siteMap > a:hover {
        background: #fa3276;
        box-shadow: 0 3px 5px rgba(47,46,65,.1);
        transform: translateY(-2px)
    }

@media(max-width:767px) {
    .siteMap > a {
        min-width: 100%
    }
}

.info-page ::-moz-selection {
    color: #fff;
    background: #4a668e;
    text-shadow: none
}

.info-page ::selection {
    background: #4a668e;
    color: #fff;
    text-shadow: none
}

.info-page section > p {
    font-size: 16px;
    line-height: 28px;
    color: #4a668e
}

    .info-page section > p + p {
        margin-top: 15px
    }

@media(max-width:1199px) {
    .info-page .round-top-in::before, .info-page .round-top-in::after {
        display: none
    }
}

.button-group {
    display: flex;
    justify-content: space-center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 15px;
    margin: 15px 0;
    border: 1px solid #eef5fd;
    border-radius: 16px
}

    .button-group a {
        white-space: nowrap;
        padding: 12px 20px;
        border-radius: 4px;
        background: #eef5fd;
        color: #4a668e;
        font-size: 14px;
        font-weight: 500;
        width: 24%
    }

@media(max-width:991px) {
    .button-group a {
        width: 32%
    }
}

@media(max-width:575px) {
    .button-group a {
        width: 45%
    }
}

@media(max-width:414px) {
    .button-group a {
        width: 100%
    }
}

.placeholderAd {
    padding: 8px;
    border-radius: 16px;
    background: #eef5fd
}

    .placeholderAd img {
        border-radius: 8px
    }

.adContact {
    padding-bottom: 50px
}

@media(max-width:575px) {
    .adContact {
        padding: 0 0 15px;
        margin-top: 20px;
        border-top: 1px solid #eef5fd
    }
}

.adContact ul {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 60px
}

@media(max-width:575px) {
    .adContact ul {
        flex-direction: column;
        gap: 30px
    }
}

.adContact li {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

    .adContact li i {
        width: 60px;
        height: 60px;
        border-radius: 100%;
        background: #fa3276;
        color: #fff;
        font-size: 26px;
        box-shadow: inset 0 0 0 4px rgba(255,255,255,.6)
    }

        .adContact li i.bi-at {
            font-size: 35px
        }

    .adContact li span {
        font-size: 15px;
        font-weight: 500;
        margin-top: 15px;
        padding: 8px 35px;
        border-radius: 8px;
        background: rgba(238,245,253,.8);
        border-block: 1px solid rgba(74,102,142,.4);
        color: #4a668e
    }

@media(max-width:575px) {
    .adContact h5 {
        font-size: 18px
    }
}

.expaired_offer_container {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.expaired_offer_div {
    height: auto;
    width: 70%;
    padding: 20px;
}

.expaired_offer_top img {
    height: 70px;
    width: 100px;
}

.expaired_offer_top {
    box-shadow: 0px 4px 10px #ccc;
    padding: 50px;
    text-align: center;
    color: #FF6D1F !important;
}

.expaired_offer_buttom {
    /*  background: #0E2F87;*/
    background: #3294fa;
    color: #fff;
    padding: 10px 20px;
    text-align: center;
    z-index: 2;
    font-size: 16px;
}

.expaired_offer_top h5 {
    padding: 20px;
}

@media(max-width:575px) {
    .expaired_offer_top {
        padding: 10px;
    }

        .expaired_offer_top h5 {
            font-size: 16px;
        }
}



/**************************************************************/
.brand-card-div {
    padding: 15px 7.5px 0px 7.5px;
}


.store_container {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

.store_div {
    background: #fff;
    border: 1px solid #ddd;
    height: 120px;
}
@media(max-width:991px) {
    .store_container {
        grid-template-columns: repeat(3, 1fr);
    }
}
.discount_type {
    display: flex;
    margin-top: 5px;
}

    .discount_type > div:nth-child(2), .discount_type > div:last-child {
        margin-left: 25px;
    }

#visit_store_phone {
    place-content: center;
    background: #e96620;
    color: #fff;
    padding: 5px;
    margin: 30px 0px;
    border-radius: 8px;
    transform: translateY(-15px);
    box-shadow: inset 0 0 0 4px rgba(255,255,255,.4)
}

    #visit_store_phone span {
        font-size: 15px;
        font-weight: 700;
        margin-right: 15px
    }

    #visit_store_phone i {
        color: #fff;
    }

.branceLocationdiv {
    display: flex;
    justify-content: center;
}

.profile-content-area {
    padding-bottom: 10px;
}

.report_div i {
    color: #e96620;
    font-size: 18px;
    cursor:pointer;
}
#report_modal_content {
    text-align:start!important;
}

#phn_code_admin {
    position: relative;
}

    #phn_code_admin::after {
        content: '';
        height: 100%;
        width: 1px;
        background: #9d9999;
        left: 60px;
        position: absolute;
        top: 0px;
    }

.phn_code_part_admin {
    position: absolute;
    bottom: 7px;
    background: #fff;
    left: 5px;
    background: transparent;
}
    .phn_code_part_admin p {
        font-size: 14px;
        color: #212121;
    }
#phn_code_admin input {
    padding-left: 65px !important;
}

        .phn_code_part_admin p span img {
            width: 20px;
            height: 20px;
        }