@import url("https://fonts.googleapis.com/css2?family=Cabin:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Kalam:wght@300;400;700&family=Prompt:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

:root {
    --heading-font: "Prompt", sans-serif;
    --sub-font: "Cabin", sans-serif;
    --cursive-font: "Kalam", cursive;
    --font-52: 52px;
    --font-48: 48px;
    --font-44: 44px;
    --font-40: 40px;
    --font-36: 36px;
    --font-32: 32px;
    --font-28: 28px;
    --font-24: 24px;
    --font-20: 20px;
    --font-18: 18px;
    --font-16: 16px;
    --font-14: 14px;
    --font-12: 12px;
    --font-10: 10px;
    --weight-100: 100;
    --weight-200: 200;
    --weight-300: 300;
    --weight-400: 400;
    --weight-500: 500;
    --weight-600: 600;
    --weight-700: 700;
    --weight-800: 800;
    --weight-900: 900;
    --black-clr: #000000;
    --black-light: #4d4d4d;
    --white-clr: #ffffff;
    --white-light: #f9f9f9;
    --logo-clr: #E66526;
    --logo-rgb: 230, 101, 38;
    --logo-clr-100: #FFF6F1;
    --logo-clr-200: #FDE5D9;
    --logo-clr-300: #FAD4C1;
    --logo-clr-400: #F5B292;
    --logo-clr-500: #EF9063;
    --logo-clr-600: #ED8350;
    --logo-clr-700: #EC7C46;
    --logo-clr-800: #EA743B;
    --logo-clr-900: #E96E33;
    --transition-fast: .1s ease;
    --transition-nrml: .25s ease;
    --transition-slow: .4s ease;
    --transition-xslow: .6s ease;
    --border-radius-5: 5px;
    --border-radius-10: 10px;
    --border-radius-15: 15px;
    --border-radius-20: 20px;
    --border-radius-25: 25px;
    --border-radius-30: 30px;
    --border-radius-circle: 50%;
    --box-shadow-sm: 0 0px 10px 5px rgba(0, 0, 0, 0.05);
    --box-shadow-nrml: 0 5px 10px -3px rgba(0, 0, 0, 0.1);
    --box-shadow-rglr: 0 5px 15px -3px rgba(0, 0, 0, 0.15);
    --box-shadow-lg: 0 4px 25px -3px rgba(0, 0, 0, 0.3);
}

body {
    -webkit-font-smoothing: antialiased;
    scroll-behavior: smooth;
    -webkit-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    -webkit-text-size-adjust: none;
    color: var(--black-light);
    font-family: var(--sub-font);
}

a, a:hover {
    color: currentColor;
    text-decoration: none;
}

.heading {
    font-family: var(--sub-font);
}

    .heading h1, .heading .h1 {
        font-size: var(--font-40);
        font-weight: var(--weight-800);
        color: var(--black-clr);
        margin: 0;
    }

        .heading h1 span, .heading .h1 span {
            color: var(--black-clr);
            font-weight: var(--weight-300);
        }

    .heading h2, .heading .h2 {
        font-size: var(--font-36);
        font-weight: var(--weight-700);
        color: var(--logo-clr);
    }

    .heading h3, .heading .h3 {
        font-size: var(--font-32);
        font-weight: var(--weight-600);
        color: var(--logo-clr);
    }

    .heading h6.h6 {
        font-size: var(--font-24);
        font-weight: var(--weight-500);
    }

    .heading p, .heading .p {
        color: var(--black-light);
        margin: 16px 0;
        font-size: var(--font-18);
        font-weight: var(--weight-400);
        line-height: 34px;
    }

header {
    box-shadow: var(--box-shadow-nrml);
    position: relative;
    z-index: 111;
    background: var(--white-clr);
}

    header .top_menu {
        background: var(--black-clr);
        text-align: right;
        font-size: var(--font-14);
        padding: 5px 0;
    }

        header .top_menu ul li {
            position: relative;
            color: #c4c2c2;
            transition: var(--transition-nrml);
        }

            header .top_menu ul li:hover {
                color: var(--white-clr);
            }

            header .top_menu ul li::before {
                content: "";
                position: absolute;
                width: 20px;
                height: 20px;
                background-image: var(--bg-url);
                background-position: center;
                background-repeat: no-repeat;
                background-size: 20px;
                margin-left: -30px;
            }

.text_justify {
    text-align: justify;
}

.menu_outer.navbar-nav:hover .nav-item .nav-link {
    color: #b2b2b2;
    transition: var(--transition-xslow);
}

.menu_outer.navbar-nav .nav-item .nav-link {
    font-size: var(--font-18);
    font-weight: var(--weight-400);
    color: var(--black-clr);
    transition: var(--transition-slow);
    letter-spacing: 0.5px;
}

    .menu_outer.navbar-nav .nav-item .nav-link:hover {
        color: var(--logo-clr);
    }

.menu_outer.navbar-nav .nav-item.signUp .nav-link {
    color: var(--white-clr);
    background-color: var(--logo-clr);
    border-radius: var(--border-radius-25);
    padding: 10px 30px;
    transition: var(--transition-nrml);
    display: block;
    width: -moz-fit-content;
    width: fit-content;
}

    .menu_outer.navbar-nav .nav-item.signUp .nav-link:hover {
        background-color: var(--logo-clr-800);
    }

    .menu_outer.navbar-nav .nav-item.signUp .nav-link:active, .menu_outer.navbar-nav .nav-item.signUp .nav-link:focus {
        transform: scale(0.95);
    }

.menu_outer.navbar-nav .nav-item.dropdown:hover.nav-item {
    color: var(--logo-clr);
}

.menu_outer.navbar-nav .nav-item.dropdown:hover .dropdown-menu.parentMenu {
    display: block;
    transform: translateY(0px);
    animation: sldup 0.5s forwards;
}

@keyframes sldup {
    0% {
        opacity: 0;
        transform: translateY(60px);
    }

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

.menu_outer.navbar-nav .nav-item.dropdown .dropdown-menu.parentMenu {
    background: transparent;
    border: unset;
    font-family: var(--sub-font);
    padding-top: 14px;
    transform: translateY(60px);
    transition: var(--transition-slow);
    padding-bottom: 0;
    min-width: var(--menu-width);
    left: var(--pos-left);
}

    .menu_outer.navbar-nav .nav-item.dropdown .dropdown-menu.parentMenu.show {
        display: none;
    }

    .menu_outer.navbar-nav .nav-item.dropdown .dropdown-menu.parentMenu .dropdown_listMenu {
        transition: var(--transition-nrml);
    }

        .menu_outer.navbar-nav .nav-item.dropdown .dropdown-menu.parentMenu .dropdown_listMenu:hover {
            background-color: var(--white-light) !important;
        }

        .menu_outer.navbar-nav .nav-item.dropdown .dropdown-menu.parentMenu .dropdown_listMenu .dropSub_Menu {
            position: relative;
            padding-left: 20px;
            font-size: 14px;
        }

            .menu_outer.navbar-nav .nav-item.dropdown .dropdown-menu.parentMenu .dropdown_listMenu .dropSub_Menu::before {
                position: absolute;
                content: "";
                background: url(../images/icons/check-logo.png);
                left: 0;
                width: 15px;
                height: 15px;
                background-size: 15px;
                top: 2px;
                background-repeat: no-repeat;
            }

.menu_outer.navbar-nav .nav-item.dropdown .dropend .dropdown-toggle::after {
    vertical-align: 0;
    right: 10px;
    position: absolute;
    top: 20px;
    border-top: 0.4em solid transparent;
    border-right: 0;
    border-bottom: 0.4em solid transparent;
    border-left: 0.4em solid var(--logo-clr);
}

.menu_outer.navbar-nav .nav-item #showSignup ul {
    padding: 20px;
    box-shadow: var(--box-shadow-nrml);
    background-color: var(--white-clr);
}

    .menu_outer.navbar-nav .nav-item #showSignup ul li a {
        color: var(--logo-clr);
        text-decoration: none;
        display: block;
        background: var(--logo-clr-100);
        font-size: var(--font-16);
        padding: 10px 20px;
        border-radius: var(--border-radius-25);
        font-weight: var(--weight-500);
        transition: var(--transition-nrml);
    }

        .menu_outer.navbar-nav .nav-item #showSignup ul li a:hover {
            background-color: var(--logo-clr-800);
            color: var(--white-clr);
        }

.swiper-button-next,
.swiper-button-prev {
    width: 44px;
    height: 44px;
}

    .swiper-button-next::after, .swiper-button-next::after,
    .swiper-button-prev::after,
    .swiper-button-prev::after {
        content: "";
        width: 44px;
        height: 44px;
        background-position: center;
        background-repeat: no-repeat;
        background-size: 44px;
    }

    .swiper-button-next::after {
        background-image: url(../images/icons/angle-circle-right.svg);
    }

    .swiper-button-prev::after {
        background-image: url(../images/icons/angle-circle-left.svg);
    }

.swiper-button-prev {
    left: 60px;
}

.swiper-button-next {
    right: 60px;
}

.swiper-pagination-bullet {
    opacity: 0.7;
    outline: 1px solid #000;
    outline-offset: 2px;
    margin: 0 8px !important;
}

.swiper-pagination-bullet-active {
    background: var(--logo-clr);
    opacity: 1;
    outline-color: var(--logo-clr);
}

.swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal {
    bottom: 45px;
}

@media only screen and (max-width: 480px) {
    .swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal {
        bottom: 20px;
    }
}

.liveFeed {
    position: relative;
    padding: 3rem 0 0;
    top: 100px;
    margin-top: -100px;
    z-index: 11;
}

    .liveFeed .liveFeedWrapper {
        padding: 20px 20px 0;
        border-radius: var(--border-radius-10);
        border: 1px solid 255 255 255/60%;
        transition: var(--transition-slow);
        overflow: hidden;
        position: relative;
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        background: var(--white-clr);
    }

        .liveFeed .liveFeedWrapper .liveFeed_img {
            position: relative;
            z-index: 1;
            width: 85px;
            height: 85px;
            display: flex;
            justify-content: center;
            align-items: center;
            border-radius: 5px;
            background: rgba(254, 227, 227, 0.61);
        }

        .liveFeed .liveFeedWrapper .liveFeed_text .heading h2 {
            font-size: var(--font-24);
            font-weight: var(--weight-700);
            color: var(--black-clr);
            transition: var(--transition-slow);
        }

        .liveFeed .liveFeedWrapper .liveFeed_text .heading p {
            --font-18: 16px;
            line-height: 26px;
            opacity: 0.8;
        }

        .liveFeed .liveFeedWrapper:hover {
            box-shadow: 0px 0px 50px 4px rgba(0, 0, 0, 0.06);
            transform: translateY(-10px);
        }

#footer {
    position: relative;
    padding: 3rem 0 0;
    background-color: var(--black-light);
    background-color: #383838;
    color: var(--white-clr);
    overflow: hidden;
}

    #footer .footer_download_link .heading {
        width: -moz-fit-content;
        width: fit-content;
        margin-left: auto;
    }

    #footer .footer_links {
        padding: 3rem 0;
    }

        #footer .footer_links .footer_linksWrapper .footer_title {
            font-size: 20px;
            color: var(--logo-clr);
        }

        #footer .footer_links .footer_linksWrapper ul li {
            color: #bbbbbb;
            font-size: 15px;
            margin-bottom: 8px;
            width: -moz-fit-content;
            width: fit-content;
            transition: var(--transition-slow);
        }

            #footer .footer_links .footer_linksWrapper ul li:hover {
                color: var(--white-clr);
                padding-left: 5px;
            }

            #footer .footer_links .footer_linksWrapper ul li:last-child {
                margin-bottom: 0;
            }

    #footer .footer_contactLinks {
        position: relative;
        padding: 30px 0;
        background: #000;
        margin-top: 3rem;
    }

.hero_btn {
    --hb-px: 12px;
    --hb-py: 35px;
    position: relative;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    background-color: var(--logo-clr-100);
    font-size: var(--font-16);
    font-weight: var(--weight-500);
    color: var(--logo-clr);
    padding: var(--hb-px) var(--hb-py);
    transition: var(--transition-nrml);
    overflow: hidden;
    z-index: 1;
    border: 1px solid var(--logo-clr-300);
    border-radius: var(--border-radius-10);
    text-transform: capitalize;
}

    .hero_btn:active {
        transform: scale(1.02);
    }

    .hero_btn::after {
        position: absolute;
        content: "";
        width: 100%;
        height: 200px;
        background-color: var(--logo-clr);
        border-radius: var(--border-radius-circle);
        left: 0;
        top: 100%;
        transition: var(--transition-slow);
        z-index: -1;
    }

    .hero_btn:hover {
        color: var(--white-clr);
        box-shadow: var(--box-shadow-lg);
    }

        .hero_btn:hover::after {
            top: -50%;
            border-radius: var(--border-radius-5);
        }

    .hero_btn.btn_invers {
        background-color: var(--logo-clr);
        color: var(--white-clr);
    }

        .hero_btn.btn_invers::after {
            background-color: var(--white-clr);
        }

    /*.hero_btn.btn_invers:hover {
            color: var(--logo-clr);
        }*/

    .hero_btn.btn_sm {
        --hb-px: 8px;
        --hb-py: 20px;
        font-size: var(--font-14);
        border-radius: var(--border-radius-5);
    }

    .hero_btn.btn_lg {
        --hb-px: 16px;
        --hb-py: 60px;
        font-size: var(--font-20);
    }

.pill_btn {
    --hb-px: 16px;
    --hb-py: 60px;
    letter-spacing: 1px;
    font-size: var(--font-20);
    font-family: var(--heading-font);
    color: var(--white-clr);
    background: linear-gradient(60deg, #dd912d 40%, #f4c48e 100%);
    background: linear-gradient(60deg, #de8e2c 40%, #e56b27 100%);
    padding: var(--hb-px) var(--hb-py);
    border-radius: var(--border-radius-30);
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    border: unset;
    transition: var(--transition-nrml);
    text-transform: uppercase;
    font-weight: var(--weight-500);
}

    .pill_btn:focus {
        outline: unset;
        transform: scale(0.98);
    }

    .pill_btn:active {
        transform: scale(1.02);
    }

    .pill_btn.pill_sm {
        --hb-px: 8px;
        --hb-py: 16px;
        letter-spacing: 0;
        font-size: var(--font-14);
    }

label {
    font-weight: var(--weight-600);
    font-size: var(--font-14);
    margin-bottom: 8px;
    transition: var(--transition-slow);
}

    label .star {
        color: red;
    }

    label a {
        color: var(--logo-clr);
    }

.form-group:has(input:focus) label {
    color: var(--logo-clr);
    font-weight: 600;
}

.form-control, .form-select {
    font-size: var(--font-14);
    font-weight: var(--weight-400);
    color: var(--black-light);
    border-radius: 0;
    border: 1px solid #d3d3d3;
    height: 42px;
    margin-bottom: 10px;
}

    .form-control:focus, .form-control:hover, .form-select:focus, .form-select:hover {
        border-color: var(--logo-clr);
        box-shadow: unset;
    }

    .form-control::-moz-placeholder, .form-select::-moz-placeholder {
        color: #acacac;
        font-size: var(--font-14);
    }

    .form-control::placeholder, .form-select::placeholder {
        color: #acacac;
        font-size: var(--font-14);
    }

    .form-control:focus ~ label, .form-select:focus ~ label {
        color: var(--logo-clr);
    }

.form-check-input {
    border-radius: 0 !important;
    border-color: var(--logo-clr);
    background-color: var(--logo-clr-100);
    transition: var(--transition-nrml);
    width: 15px;
    height: 14px;
    background-size: 15px;
}

    .form-check-input:checked {
        background-color: var(--logo-clr);
        border-color: var(--logo-clr);
    }

    .form-check-input:focus {
        box-shadow: unset;
        border-color: var(--logo-clr);
    }

.form-range {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    border-radius: 5px;
    height: 35px;
    outline: none;
}

    .form-range::-webkit-slider-runnable-track {
        background-color: var(--logo-clr-200);
        height: 20px;
    }

    .form-range::-webkit-slider-thumb {
        -webkit-appearance: none;
        appearance: none;
        width: 30px;
        height: 30px;
        border-radius: var(--border-radius-circle);
        background-color: var(--logo-clr);
        background-image: url(../images/icons/range.png);
        background-position: center;
        background-size: 18px;
        background-repeat: no-repeat;
        cursor: pointer;
    }

    .form-range::-moz-range-thumb {
        width: 30px;
        height: 30px;
        border-radius: var(--border-radius-circle);
        background-color: var(--logo-clr);
        cursor: pointer;
    }

.float {
    animation: float 4s ease-in-out infinite;
    transform: translatey(0px);
}

@keyframes float {
    0% {
        transform: translatey(0px);
    }

    50% {
        transform: translatey(-10px);
    }

    100% {
        transform: translatey(0px);
    }
}

#appFlow {
    position: relative;
    padding: 12rem 0 6rem;
    background-color: #fafafa;
}

    #appFlow .appFlowWrapper ul {
        width: 95%;
        margin-left: auto;
        position: relative;
    }

        #appFlow .appFlowWrapper ul li {
            position: relative;
            padding: 12px 0 15px 70px;
            font-size: var(--font-16);
            font-weight: var(--weight-600);
            border-radius: var(--border-radius-5);
        }

            #appFlow .appFlowWrapper ul li::before {
                content: attr(data-step);
                font-size: 32px;
                font-weight: var(--weight-900);
                position: absolute;
                right: 10px;
                bottom: -3px;
                color: var(--logo-clr);
                opacity: 0.15;
                line-height: 1;
            }

            #appFlow .appFlowWrapper ul li::after {
                position: absolute;
                content: "";
                width: 1.5rem;
                top: 100%;
                left: 40px;
                background-image: url(../images/icons/line.png);
                background-repeat: repeat-x;
                background-size: 10px;
                height: 3px;
                animation: slideInLeft 2s infinite linear;
                z-index: 2;
                transform: rotate(90deg);
                transform-origin: left;
            }

@keyframes slideInLeft {
    from {
        background-position: 0 0;
    }

    to {
        background-position: 40px 0;
    }
}

#appFlow .appFlowWrapper ul li:last-child::after {
    display: none;
}

#appFlow .appFlowWrapper ul li .flowCheck {
    position: absolute;
    left: 30px;
}

#aboutSection {
    position: relative;
    padding: 6rem 0;
}

#scroll_detect .scroll_spy {
    position: relative;
    padding: 16px 20px;
    padding-left: 55px;
    border-radius: var(--border-radius-10);
    margin-bottom: 10px;
    font-size: var(--font-20);
    text-transform: uppercase;
    font-weight: var(--weight-600);
    transition: var(--transition-nrml);
}

    #scroll_detect .scroll_spy span {
        font-size: var(--font-14);
        margin-top: 10px;
        text-transform: capitalize;
        display: none;
        transition: var(--transition-slow);
        color: var(--black-clr);
    }

    #scroll_detect .scroll_spy::before {
        content: "";
        position: absolute;
        width: 30px;
        height: 30px;
        background-image: url(../images/icons/read.png);
        background-position: center;
        background-repeat: no-repeat;
        background-size: 30px;
        left: 15px;
        filter: grayscale(1);
        transition: var(--transition-slow);
    }

    #scroll_detect .scroll_spy.active, #scroll_detect .scroll_spy:hover {
        background: linear-gradient(45deg, var(--logo-clr-100), var(--white-clr));
        color: var(--logo-clr);
        transition: var(--transition-slow);
    }

        #scroll_detect .scroll_spy.active::before, #scroll_detect .scroll_spy:hover::before {
            filter: grayscale(0);
            transform: scale(1.3);
        }

        #scroll_detect .scroll_spy.active span {
            display: block;
            animation: fadeIN 0.5s ease;
        }

@keyframes fadeIN {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

#testimonial_section {
    position: relative;
    padding: 6rem 0;
    background-color: var(--white-light);
}

    #testimonial_section .swiper-horizontal > .swiper-pagination-bullets, #testimonial_section .swiper-pagination-bullets.swiper-pagination-horizontal {
        bottom: 0px;
    }

    #testimonial_section .testimonial_outerWrapper {
        padding: 60px 0 40px;
        position: relative;
    }

        #testimonial_section .testimonial_outerWrapper .testimonial_innerWrapper {
            background: #fff;
            padding: 40px 30px 25px;
            position: relative;
            border-radius: 10px;
        }

        #testimonial_section .testimonial_outerWrapper .quote_icon {
            position: absolute;
            top: -40px;
            right: 40px;
            width: 80px;
            height: 80px;
            box-shadow: var(--box-shadow-rglr);
            border-radius: var(--border-radius-5);
            display: flex;
            justify-content: center;
            align-items: center;
            background: white;
        }

            #testimonial_section .testimonial_outerWrapper .quote_icon img {
                width: 50px;
            }

#loan_categories {
    position: relative;
    padding: 4rem 0 0;
}

    #loan_categories .loanProdutsSlider {
        position: relative;
        top: -65px;
    }

        #loan_categories .loanProdutsSlider .swiper-button-next, #loan_categories .loanProdutsSlider .swiper-button-prev {
            top: 25px;
            width: 30px;
            height: 30px;
        }

        #loan_categories .loanProdutsSlider .swiper-button-next {
            right: 0px;
        }

        #loan_categories .loanProdutsSlider .swiper-button-prev {
            left: auto;
            right: 45px;
        }

            #loan_categories .loanProdutsSlider .swiper-button-next::after, #loan_categories .loanProdutsSlider .swiper-button-next::after, #loan_categories .loanProdutsSlider .swiper-button-prev::after, #loan_categories .loanProdutsSlider .swiper-button-prev::after {
                width: 30px;
                height: 30px;
                background-position: center;
                background-repeat: no-repeat;
                background-size: 30px;
            }

    #loan_categories .loan_categoriesWrapper {
        position: relative;
        margin: 60px 0 30px;
        background: #fff;
        box-shadow: 0 10px 10px -5px rgba(0, 0, 0, 0.1);
        padding: 15px 10px;
        text-align: center;
        border-radius: 10px;
        border: 1px solid #e2e2e2;
        transition: var(--transition-nrml);
    }

        #loan_categories .loan_categoriesWrapper img {
            width: 80px;
            margin-bottom: 15px;
            filter: grayscale(0.8) opacity(0.6);
            transition: var(--transition-slow);
        }

        #loan_categories .loan_categoriesWrapper a {
            font-size: var(--font-16);
            font-weight: var(--weight-600);
            color: var(--black-light);
        }

        #loan_categories .loan_categoriesWrapper:hover {
            box-shadow: var(--box-shadow-lg);
            transform: translateY(-6px);
        }

            #loan_categories .loan_categoriesWrapper:hover img {
                filter: drop-shadow(0px 10px 5px rgba(0, 0, 0, 0.1));
            }

            #loan_categories .loan_categoriesWrapper:hover a {
                color: var(--logo-clr);
            }

#download_app {
    background: linear-gradient(90deg, #9ecb8a 0%, #DCE775 35%, #e6d155 100%);
    padding-top: 3rem;
    position: relative;
}

#quick_apply {
    position: relative;
    padding: 30px 0;
}

    #quick_apply .quick_applyWrapper h4 {
        font-weight: var(--weight-700);
        color: black;
        font-size: var(--font-36);
    }

    #quick_apply .quick_applyWrapper span {
        display: block;
        font-size: var(--font-14);
        font-weight: var(--weight-500);
        color: var(--logo-clr);
    }

#callback_section {
    position: relative;
    padding: 7rem 0;
    background-color: var(--logo-clr-100);
}

    #callback_section .callback_formSection {
        min-width: 400px;
        padding: 30px;
        box-shadow: var(--box-shadow-lg);
        background: var(--white-clr);
        border-radius: var(--border-radius-10);
    }

#blog_listing {
    position: relative;
    padding: 6rem 0;
    background: #fafafa;
}

    #blog_listing .blog_listing_item {
        position: relative;
        padding: 10px;
        border: 1px solid #c4c4c4;
        border-radius: 10px;
        background: white;
        transition: var(--transition-nrml);
    }

        #blog_listing .blog_listing_item:hover {
            box-shadow: var(--box-shadow-lg);
            border: 1px solid var(--logo-clr-100);
        }

        #blog_listing .blog_listing_item .blog_listing_item_img {
            margin-bottom: 25px;
        }

        #blog_listing .blog_listing_item .blog_listing_item_text .upldType li {
            font-weight: var(--weight-700);
            padding-left: 25px;
            font-size: var(--font-14);
            position: relative;
        }

            #blog_listing .blog_listing_item .blog_listing_item_text .upldType li::before {
                position: absolute;
                content: "";
                width: 14px;
                height: 14px;
                background-repeat: no-repeat;
                background-position: center;
                background-size: contain;
                background-image: var(--bg-url);
                left: 0;
                top: 2px;
            }

        #blog_listing .blog_listing_item .blog_listing_item_text h4 {
            font-size: 20px;
            font-weight: 700;
            color: #000;
            line-height: 30px;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
            margin-bottom: 10px;
        }

        #blog_listing .blog_listing_item .blog_listing_item_text p {
            line-height: 26px;
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
            overflow: hidden;
            color: #545454;
        }

.page-link {
    --bs-pagination-color: var(--logo-clr);
    --bs-pagination-border-color: var(--logo-clr-300);
}

    .page-link:hover {
        --bs-pagination-hover-bg: var(--logo-clr-100);
        --bs-pagination-hover-border-color: var(--logo-clr-300);
        --bs-pagination-hover-color: var(--logo-clr-800);
    }

    .page-link:focus {
        --bs-pagination-focus-bg: var(--logo-100) color: var(--logo-clr);
        box-shadow: unset;
    }

#mv_section {
    position: relative;
    padding: 5rem 0;
    background-color: var(--logo-clr-200);
    overflow: hidden;
}

#faqs_section {
    position: relative;
    padding: 6rem 0;
    background-color: var(--logo-clr-100);
}

.accordion-button {
    font-size: var(--font-20);
    padding-left: 0;
    height: auto;
}

    .accordion-button:focus {
        box-shadow: unset;
    }

    .accordion-button::after {
        background-image: url(../images/icons/pluss-circle.png);
    }

    .accordion-button:not(.collapsed)::after {
        background-image: url(../images/icons/minus-circle.png);
    }

    .accordion-button:not(.collapsed) {
        --bs-accordion-active-bg: var(--logo-clr-100);
        color: var(--logo-clr);
    }

.accordion-body {
    padding: 15px 45px 15px 0;
    color: #616161;
}

.accordion-item {
    --bs-accordion-bg: var(--logo-clr-100);
    border: unset;
    border-bottom: 1px solid var(--logo-clr-200);
}

.accordion-header {
    --bs-accordion-btn-bg: var(--logo-clr-100);
}

#contact_section {
    position: relative;
    padding: 5rem 0;
}

    #contact_section .contact_detailsWrapper {
        position: relative;
        border-left: 3px solid var(--logo-clr-200);
        padding-left: 15px;
    }

        #contact_section .contact_detailsWrapper::after {
            position: absolute;
            content: "";
            width: 3px;
            height: 24px;
            background-color: var(--logo-clr);
            left: -3px;
            top: 0;
        }

    #contact_section .contact_section_left {
        position: relative;
        padding: 50px 30px;
        background: linear-gradient(90deg, var(--logo-clr-100), var(--white-clr));
        border-radius: var(--border-radius-20);
    }

#team_seciton {
    position: relative;
    padding: 6rem 0;
    background-color: var(--white-light);
}

    #team_seciton .teamDetailswrapper {
        position: relative;
    }

        #team_seciton .teamDetailswrapper .teamDetailswrapperText .textText h3 {
            font-size: var(--font-20);
            font-weight: var(--weight-600);
            margin-bottom: 5px;
            color: var(--logo-clr-700);
        }

        #team_seciton .teamDetailswrapper .teamDetailswrapperText .textText a {
            display: block;
            width: -moz-fit-content;
            width: fit-content;
            color: #747474;
            border-bottom: 1px solid;
            transition: var(--transition-nrml);
        }

            #team_seciton .teamDetailswrapper .teamDetailswrapperText .textText a:hover {
                color: rgb(41, 41, 41);
            }

.teamdetails .btn-close {
    top: 25px;
    right: 30px;
}

    .teamdetails .btn-close:focus {
        box-shadow: unset;
        border: unset;
    }

#team_header {
    position: relative;
    padding: 6rem 0;
}

.joinNow_section {
    background: linear-gradient(90deg, #9ecb8a 0%, #DCE775 35%, #e6d155 100%);
    padding: 1rem 3rem;
    margin: 5rem 0;
    position: relative;
    border-radius: var(--border-radius-30);
}

    .joinNow_section .pill_btn {
        border-radius: var(--border-radius-10);
        background: rgb(0, 0, 0);
        background: linear-gradient(90deg, rgb(0, 0, 0) 0%, rgb(68, 65, 65) 35%, rgb(122, 122, 122) 100%);
        color: var(--white-clr);
    }

    .joinNow_section .heading h1 {
        background: linear-gradient(90deg, rgb(13, 135, 163) 0%, rgb(35, 206, 54) 35%, rgb(0, 255, 146) 100%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

#partner_section {
    position: relative;
    padding: 6rem 0;
    background-image: url(../images/partner-bg.png);
    background-position: center;
    background-size: 100%;
    background-repeat: no-repeat;
    background-color: var(--white-light);
}

    #partner_section .partner_section {
        padding: 3rem 0;
        background-color: rgba(255, 255, 255, 0.431372549);
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        border: 1px solid var(--white-clr);
        border-radius: var(--border-radius-15);
        box-shadow: var(--box-shadow-sm);
    }

        #partner_section .partner_section .choose_prtnr {
            margin-top: 30px;
        }

            #partner_section .partner_section .choose_prtnr .choose_prtnrLi .choose_prtnrType {
                cursor: pointer;
                transition: var(--transition-nrml);
            }

                #partner_section .partner_section .choose_prtnr .choose_prtnrLi .choose_prtnrType:hover {
                    background-color: var(--logo-clr-100);
                    box-shadow: var(--box-shadow-sm);
                    color: var(--logo-clr);
                    transform: translateY(-5px);
                    font-weight: var(--weight-700);
                }

.logo_clr {
    color: var(--logo-clr) !important;
}

#loginWrapper {
    position: relative;
    padding: 6rem 0;
    background: linear-gradient(180deg, var(--logo-clr-300) 70%, var(--logo-clr-500) 71%, var(--logo-clr-200) 30%);
}

    #loginWrapper .loginWrapper .loginWrapperOuter {
        background-color: var(--logo-clr-100);
        padding: 40px 30px;
        box-shadow: var(--box-shadow-sm);
        border: 1px solid var(--white-light);
        border-radius: var(--border-radius-15);
        -webkit-backdrop-filter: blur(20px);
        backdrop-filter: blur(20px);
    }



#toastWrapper {
    display: none;
    transition: all 0.2s;
}

.hiddensss {
    visibility: hidden;
    opacity: 0;
    height: 0;
    transform: translateY(-140px);
}

.img_bg {
    background-image: url(../images/loanBg.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    height: 100%;
    background-color: #398a6a;
}

#borrowerSection {
    z-index: 1;
    position: relative;
    padding: 6rem 0;
    background-image: url(../images/borrowBg.png);
}

#borrowForm_section .accordion-header {
    --bs-accordion-btn-bg: transparent;
}

    #borrowForm_section .accordion-header .accordion-button:not(.collapsed) {
        --bs-accordion-active-bg: transparent;
        color: var(--logo-clr);
    }

#borrowForm_section .accordion-item {
    --bs-accordion-bg: var(--white-clr);
    border: unset;
    padding: 10px;
    margin-bottom: 10px;
    background-color: var(--white-light);
    border-radius: var(--border-radius-5);
}

#lender_section {
    position: relative;
    padding: 6rem 0;
    background-color: var(--logo-clr-100);
}

#media_center {
    position: relative;
}

    #media_center .awardSectionWrapper {
        background: var(--logo-clr-100);
        height: 150px;
        padding: 20px 45px;
        display: flex;
        justify-content: center;
        transition: var(--transition-slow);
        align-items: center;
    }

@media only screen and (max-width: 768px) {
    #media_center .awardSectionWrapper {
        padding: 10px;
    }
}

#media_center .awardSectionWrapper img {
    height: 60px;
    -o-object-fit: contain;
    object-fit: contain;
    transition: var(--transition-slow);
}

#media_center .awardSectionWrapper:hover {
    cursor: pointer;
    box-shadow: var(--box-shadow-sm);
}

    #media_center .awardSectionWrapper:hover img {
        transform: scale(1.1);
    }

#newsandevents {
    position: relative;
    padding: 6rem 0;
}

    #newsandevents .newsandeventsWrapper .videoWrapper {
        background: var(--logo-clr-100);
        padding: 20px;
        transition: var(--transition-nrml);
    }

@media only screen and (max-width: 768px) {
    #newsandevents .newsandeventsWrapper .videoWrapper {
        padding: 0;
    }
}

#newsandevents .newsandeventsWrapper .videoWrapper:hover {
    box-shadow: var(--box-shadow-rglr);
}

#newsandevents .newsandeventsWrapper .videoWrapper .videoWrapperImg {
    position: relative;
}

    #newsandevents .newsandeventsWrapper .videoWrapper .videoWrapperImg img {
        border-radius: var(--border-radius-5);
        height: 220px;
        width: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: top;
        object-position: top;
    }

#newsandevents .newsandeventsWrapper .videoWrapper .videoWrapperText a {
    font-size: var(--font-18);
    font-weight: var(--weight-500);
    margin-bottom: 0;
    line-height: 28px;
}

#careerSection {
    position: relative;
    padding: 12rem 0;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../images/careerBg.png);
    background-size: 100%;
}

#careerAbout {
    position: relative;
    padding: 6rem 0 9rem;
    background-color: var(--white-light);
}

    #careerAbout .careerAboutLeft .careerAboutLeftWrapper {
        background-color: var(--white-clr);
        padding: 30px 20px;
        border-radius: var(--border-radius-10);
        box-shadow: 0 10px 20px -10px rgba(0, 0, 0, 0.1);
        transform: var(--trsan-top);
    }

        #careerAbout .careerAboutLeft .careerAboutLeftWrapper h6 {
            color: var(--black-clr);
            font-size: var(--font-18);
            font-weight: var(--weight-600);
            margin: 15px 0;
        }

        #careerAbout .careerAboutLeft .careerAboutLeftWrapper p {
            color: #8d8d8d;
        }

#jobOpneing {
    position: relative;
    padding: 6rem 0;
}

    #jobOpneing .jobOpneingWrapper {
        padding: 10px;
        border-radius: var(--border-radius-5);
        box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.08);
        background-color: var(--white-clr);
    }

        #jobOpneing .jobOpneingWrapper .jobOpneingImg {
            padding: 25px 20px;
            background-color: var(--logo-clr-100);
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: var(--border-radius-5);
        }

            #jobOpneing .jobOpneingWrapper .jobOpneingImg img {
                width: 65px;
            }

.jobOpneingText ul li {
    position: relative;
    padding-left: 25px;
    margin-right: 8px;
}

    .jobOpneingText ul li:last-child {
        margin-left: 0;
    }

    .jobOpneingText ul li::before {
        position: absolute;
        content: "";
        width: 20px;
        height: 20px;
        background-image: var(--bg-url);
        background-size: 16px;
        background-position: left;
        background-repeat: no-repeat;
        left: 0;
        top: 1px;
    }

#homeAbout {
    position: relative;
    padding: 6rem 0 0;
}
/*----- Styling the sliders ----*/
#emiCalcSection {
    position: relative;
    padding: 6rem 0;
    background-color: var(--logo-clr-100);
}

.formRange {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 10px 0;
    width: 100%;
}

    .formRange:focus {
        outline: none;
    }

    .formRange::-webkit-slider-runnable-track {
        width: 100%;
        height: 6px;
        cursor: pointer;
        background: var(--logo-clr);
        border-radius: 10px;
    }

    .formRange::-webkit-slider-thumb {
        box-shadow: 2px 2px 5px #b3b3b3, -1px -1px 3px grey;
        border: 5px solid #ffffff;
        height: 20px;
        width: 20px;
        border-radius: 50%;
        background: var(--logo-clr);
        cursor: pointer;
        margin-top: -6px;
        -webkit-appearance: none;
    }

    .formRange:focus::-webkit-slider-runnable-track {
        background: #b3b3b3;
    }

    .formRange::-moz-range-track {
        width: 100%;
        height: 6px;
        cursor: pointer;
        background: var(--logo-clr);
        border-color: transparent;
        border-width: 16px 0;
        color: transparent;
        border-radius: 10px;
    }

    .formRange::-moz-range-thumb {
        box-shadow: 2px 2px 5px #b3b3b3, -1px -1px 3px grey;
        border: 5px solid #ffffff;
        height: 20px;
        width: 20px;
        border-radius: 50%;
        background: var(--logo-clr);
        cursor: pointer;
        margin-top: -6px;
    }

    .formRange::-ms-track {
        width: 100%;
        height: 6px;
        cursor: pointer;
        background: var(--logo-clr);
        border-color: transparent;
        border-width: 16px 0;
        color: transparent;
        border-radius: 10px;
    }

    .formRange::-ms-fill-lower {
        background: var(--logo-clr);
        border-radius: 5px;
    }

    .formRange::-ms-fill-upper {
        background: var(--logo-clr);
        border-radius: 5px;
    }

    .formRange::-ms-thumb {
        box-shadow: 2px 2px 5px #b3b3b3, -1px -1px 3px grey;
        border: 5px solid #ffffff;
        height: 20px;
        width: 20px;
        border-radius: 50%;
        background: var(--logo-clr);
        cursor: pointer;
        margin-top: -6px;
    }

    .formRange:focus::-ms-fill-lower {
        background: var(--logo-clr);
    }

    .formRange:focus::-ms-fill-upper {
        background: var(--logo-clr);
    }

.congrats {
    position: fixed;
    width: 100%;
    height: 100vh;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.65);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    z-index: 11111;
    display: block;
    /*opacity: 0;
    visibility: hidden;*/
}

    .congrats .congrats_inner {
        max-width: 400px;
        width: 100%;
        background-color: var(--white-clr);
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        border-radius: var(--border-radius-10);
        padding: 20px 30px 30px;
        box-shadow: var(--box-shadow-lg);
    }

        .congrats .congrats_inner .congrats_imgWrapper {
            text-align: center;
        }

            .congrats .congrats_inner .congrats_imgWrapper img {
                width: 200px;
            }

    .congrats.visible {
        display: block !important;
        animation: showani 0.4s ease-in forwards;
    }

@keyframes showani {
    0% {
        display: block;
        opacity: 0.3;
    }

    50% {
        opacity: 0.5;
    }

    100% {
        opacity: 1;
    }
}

#loan_details {
    position: relative;
    padding: 5rem 0;
}

    #loan_details .nav-link {
        font-size: var(--font-18);
        font-weight: var(--weight-700);
    }

        #loan_details .nav-link:focus, #loan_details .nav-link:hover {
            --bs-nav-link-hover-color: var(--logo-clr);
            background-color: var(--logo-clr-100);
        }

    #loan_details .nav-pills .nav-link.active {
        background-color: var(--logo-clr);
    }

/*-------------------------------------*/
@media only screen and (max-width: 992px) {
    .navbar-brand img {
        width: 180px;
    }
}

@media only screen and (max-width: 480px) {
    .heading {
        width: 100% !important;
    }

        .heading h1, .heading .h1 {
            font-size: var(--font-24);
        }

        .heading p {
            font-size: var(--font-16);
            line-height: var(--font-28);
        }

    #appFlow {
        padding: 3rem 0;
        overflow: hidden;
    }

    #loan_categories .loan_categoriesWrapper a {
        display: block;
        line-height: 20px;
        margin: 0 auto;
        text-align: center;
        word-wrap: break-word;
    }

    .liveFeed {
        top: 0;
        margin-top: 0;
    }

        .liveFeed .liveFeedWrapper {
            -webkit-backdrop-filter: blur(10px);
            backdrop-filter: blur(10px);
            background: rgba(244, 249, 255, 0.168627451);
            border: 1px solid #fff;
        }

    /*.liveFeed .liveFeedWrapper .liveFeed_text .heading p {
                color: var(--white-clr);
            }*/

    #callback_section {
        padding: 4rem 0;
    }

        #callback_section .callback_formSection {
            min-width: 100%;
        }

    #download_app {
        padding-bottom: 3rem;
        overflow: hidden;
    }

    .hero_btn.btn_lg {
        --hb-px: 10px;
        --hb-py: 26px;
        font-size: var(--font-18);
    }

    .menu_outer.navbar-nav .nav-item.signUp .nav-link {
        padding: 0.4rem 1rem;
        font-size: var(--font-14);
    }

    #quick_apply .quick_applyWrapper h4 {
        font-size: var(--font-24);
        margin-bottom: 0px;
    }

    #quick_apply .quick_applyForm .heading h4 {
        font-size: var(--font-18);
        color: var(--logo-clr-800);
    }

    #homeAbout {
        padding: 3rem 0 0;
        overflow: hidden;
    }

        #homeAbout .heading .h1 br {
            display: none;
        }

    #careerSection {
        padding: 2rem 0;
        background-position: 60% 60px;
        background-size: cover;
        background-color: var(--logo-clr-200);
    }

    #careerAbout {
        padding: 3rem 0 3rem;
    }

        #careerAbout .careerAboutLeft .careerAboutLeftWrapper {
            transform: unset;
        }

    .accordion-body {
        padding: 15px 5px 15px 0;
    }

    #blog_listing {
        padding: 3rem 0;
    }

    section {
        overflow: hidden !important;
    }

    #contact_section {
        padding: 2rem 0 3rem;
    }

        #contact_section .contact_section_left {
            padding: 40px 20px;
            background: var(--logo-clr-100);
        }

    #congrats .congrats_inner {
        width: 85%;
    }

        #congrats .congrats_inner .congrats_imgWrapper img {
            width: 120px;
        }

    .mobPos {
        position: relative !important;
        width: 100%;
        margin: 0 auto;
    }

    #borrowerSection {
        padding: 1rem 0 4rem;
    }

    #lender_section {
        padding: 3rem 0;
    }

    #faqs_section {
        padding: 3rem 0 !important;
    }

    #jobOpneing {
        padding: 2rem 0;
    }

    #testimonial_section {
        padding: 2rem 0;
    }

    #media_center {
        padding: 3rem 0;
    }

    #newsandevents {
        padding: 0 0 3rem;
    }

        #newsandevents .newsandeventsWrapper .videoWrapper {
            padding: 15px;
        }

    .joinNow_section {
        padding: 1rem 1rem 2rem;
        border-radius: var(--border-radius-10);
    }

        .joinNow_section .heading h1 {
            color: #000;
            background-clip: unset;
            -webkit-background-clip: unset;
            background: unset;
            -webkit-text-fill-color: unset;
        }

    .parentMenu {
        --menu-width: 100% !important;
        --pos-left: 0 !important;
    }

    .menu_outer.navbar-nav .nav-item {
        width: 100%;
    }
}

.mmbg {
    background-color: var(--logo-clr);
    position: absolute;
    inset: 0;
    z-index: -1;
}

.op5 {
    opacity: 0.05;
}

.op10 {
    opacity: 0.1;
}

.op15 {
    opacity: 0.15;
}

.op20 {
    opacity: 0.2;
}

#supportWrapper {
    position: relative;
    background-color: var(--white-clr);
}

    #supportWrapper .support_topWrapper {
        position: relative;
        padding: 12px 0;
        background-color: var(--white-light);
    }

        #supportWrapper .support_topWrapper li a:hover {
            transition: var(--transition-nrml);
            color: var(--logo-clr);
            text-decoration: underline;
        }

    #supportWrapper .supportWrapper {
        position: relative;
        padding: 5rem 0;
    }

        #supportWrapper .supportWrapper .supportWrapperTab a {
            transition: var(--transition-fast);
            padding: 12px 10px;
            background-color: var(--logo-clr-100);
            font-size: var(--font-18);
            text-align: center;
            display: block;
        }

            #supportWrapper .supportWrapper .supportWrapperTab a.active {
                background-color: var(--logo-clr);
                color: var(--white-clr);
                font-weight: var(--weight-600);
            }

.hero_btn.btn_invers:hover {
    color: var(--logo-clr);
}

.errorlabels {
    background-image: url('../../../images/cancel.png');
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 13px 13px;
    color: #f00;
    display: inline-block;
    padding: 0px 5px 0px 20px;
    border-radius: 3px;
    position: relative;
    margin: 4px 0;
}


/*----- fixed-header section ----*/
.fixed-header {
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 1000;
    background-color: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

    .fixed-header .navbar {
        padding: 10px 0;
    }

    .fixed-header .container {
        max-width: 1200px;
        margin: 0 auto;
    }

.navbar-toggler {
    border: none;
    background-color: transparent;
}

.navbar-nav .nav-link {
    color: #000;
    padding: 5px 10px;
}

    .navbar-nav .nav-link:hover {
        color: #007bff;
    }

/*.navbar-nav .dropdown-menu {
    border-radius: 0.5rem;
    padding: 0.5rem 1rem;
    border: 1px solid rgba(0, 0, 0, 0.15);
    min-width: 12rem;
}

    .navbar-nav .dropdown-menu a {
        display: block;
        padding: 5px 10px;
        color: #000;
        text-decoration: none;
    }

        .navbar-nav .dropdown-menu a:hover {
            background-color: #f8f9fa;
            color: #007bff;
        }*/

.menu_outer {
    display: flex;
    align-items: center;
}

    .menu_outer .signUp {
        position: relative;
    }

        .menu_outer .signUp .collapse {
            background-color: #fff;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
            min-width: 200px;
        }

@media (max-width: 991px) {
    .fixed-header .navbar-collapse {
        background-color: #fff;
    }

    .fixed-header .navbar-nav {
        flex-direction: column;
        align-items: flex-start;
    }

        .fixed-header .navbar-nav .dropdown-menu {
            position: static;
            float: none;
            background-color: #fff;
            border: none;
            box-shadow: none;
            padding: 0;
            width: 100%;
        }

            .fixed-header .navbar-nav .dropdown-menu .dropdown-item {
                padding: 10px 15px;
            }
}
/*-----End fixed-header section ----*/
/*-----Deena180924 ----*/
.section_heading {
    color: var(--white-clr);
    background: var(--white-clr);
    border-left: 7px solid var(--primary);
    font-weight: 900;
    padding-right: 20px;
}

    .section_heading h3 {
        background: var(--logo-clr-700);
        height: 50px;
        line-height: 50px;
        padding: 0px 20px 0 20px;
        position: relative;
    }

        .section_heading h3::after {
            position: absolute;
            content: "";
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 51px 0 0 51px;
            border-color: transparent transparent transparent var(--logo-clr-700);
            left: 100%;
            bottom: 0;
            margin-left: -1px;
        }

        .section_heading h3.invers {
            background: var(--logo-clr-200);
            color: var(--logo-clr);
            margin-left: 50px;
        }

            .section_heading h3.invers::after {
                border-color: transparent transparent transparent var(--logo-clr-200);
            }

            .section_heading h3.invers::before {
                position: absolute;
                content: "";
                width: 0;
                height: 0;
                border-style: solid;
                border-width: 0 51px 51px 0;
                border-color: transparent var(--logo-clr-200) transparent transparent;
                right: 100%;
                bottom: 0;
                margin-left: -1px;
            }

.subHeading {
    display: block;
    text-align: center;
    margin: 1rem 0;
    overflow: hidden;
    white-space: nowrap;
    background: #f5f5f5;
    padding: 10px;
}

    .subHeading h3 {
        position: relative;
        display: inline-block;
        font-size: var(--font-18);
        padding: 0rem 1rem;
        margin-bottom: 0;
    }

        .subHeading h3::before, .subHeading h3::after {
            content: "";
            position: absolute;
            top: 50%;
            width: 100vw;
            border-top: 1px solid var(--logo-clr-300);
        }

        .subHeading h3::before {
            right: 100%;
        }

        .subHeading h3::after {
            left: 100%;
        }

.border_500 {
    border: 1px solid var(--logo-clr-600);
}

.border_500 {
    border: 1px solid var(--logo-clr-600);
}

.logo_bgClr {
    background-color: var(--logo-clr);
}

/*-----RBI Certified  Date21_09_2024deena ----*/
.success-message {
    color: green;
}

.errorlabels {
    color: red;
}

.ValidationError {
    color: red;
}

.logo_bgClr {
    background-color: var(--logo-clr);
}

.badgeRBI_500 {
    border: 1px solid var(--logo-clr-600);
}

.badgeRBI {
    display: inline-flex;
    align-items: center;
    background-color: #94e2a429;
    border: 1px solid #3dd068;
    border-radius: 20px;
    padding: 5px 15px;
    font-size: 14px;
    color: #4a4a4a;
}

.badgeRBI-icon {
    width: 20px;
    height: 20px;
    margin-right: 10px;
}

.badgeRBI-text {
    font-weight: 400;
}
/* Mobile Responsiveness */
@media only screen and (max-width: 480px) {
    .badgeRBI {
        padding: 3px 9px;
        font-size: 9px;
    }

    .pill_btn {
        --hb-px: 16px;
        --hb-py: 35px;
    }

    .badgeRBI-text {
        font-weight: 900;
    }
}
/*-----END RBI Certified NBFC ----*/

/*------------ Login new Header Design ---------------*/
    .login-header {
        position: absolute;
        top: -1px;
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: var(--logo-clr-500);
        width: 275px;
        height: 48px;
        border-radius: 0 0 20px 20px;
    }

    @media (max-width: 768px) {
        .login-header {
            width: 200px !important;
        }
    }

    .login-header::before {
        content: "";
        position: absolute;
        top: 0;
        left: -30px;
        width: 30px;
        height: 30px;
        border-top-right-radius: 50%;
        background: transparent;
        box-shadow: 15px 0 0 0 var(--logo-clr-500);
    }

    .login-header::after {
        content: "";
        position: absolute;
        top: 0;
        right: -30px;
        width: 30px;
        height: 30px;
        border-top-left-radius: 50%;
        background: transparent;
        box-shadow: -15px 0 0 0 var(--logo-clr-500);
    }
/*-------------- Login new Header Design End --------------*/

.login-headerr {
    position: absolute;
    top: -1px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--logo-clr-500);
    width: 57rem;
    height: 48px;
    border-radius: 0 0 20px 20px;
}

@media (max-width: 768px) {
    .login-headerr {
        width: 200px !important;
    }
}

.login-headerr::before {
    content: "";
    position: absolute;
    top: 0;
    left: -30px;
    width: 30px;
    height: 30px;
    border-top-right-radius: 50%;
    background: transparent;
    box-shadow: 15px 0 0 0 var(--logo-clr-500);
}

.login-headerr::after {
    content: "";
    position: absolute;
    top: 0;
    right: -30px;
    width: 30px;
    height: 30px;
    border-top-left-radius: 50%;
    background: transparent;
    box-shadow: -15px 0 0 0 var(--logo-clr-500);
}



    .Email-header {
        position: absolute;
        top: -30px;
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: var(--logo-clr-500);
        width: 258px;
        height: 47px;
        border-radius: 0 0 20px 20px;
    }

    @media (max-width: 768px) {
        .Email-header {
            width: 200px !important;
        }
    }

    .Email-header::before {
        content: "";
        position: absolute;
        top: 0;
        left: -30px;
        width: 30px;
        height: 30px;
        border-top-right-radius: 50%;
        background: transparent;
        box-shadow: 15px 0 0 0 var(--logo-clr-500);
    }

    .Email-header::after {
        content: "";
        position: absolute;
        top: 0;
        right: -30px;
        width: 30px;
        height: 30px;
        border-top-left-radius: 50%;
        background: transparent;
        box-shadow: -15px 0 0 0 var(--logo-clr-500);
    }

:root {
    --primary-bg-color: white;
    --box-shadow-color: rgba(0, 0, 0, 0.2);
    --border-color: #ddd;
    --focus-border-color: #de8e2c;
    --gradient-start-color: #de8e2c;
    --gradient-end-color: #e56b27;
    --hover-color: #0056b3;
    --text-color: white;
    --padding-container: 30px;
    --padding-button: 3px 10px;
    --border-radius-container: 8px;
    --border-radius-box: 4px;
    --border-radius-button: 5px;
    --box-width: 300px;
    --box-width-otp: 50px;
    --box-height-otp: 50px;
    --font-size-otp: 24px;
    --flex-justify-center: center;
    --flex-align-center: center;
}

.otp-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: var(--flex-justify-center);
    align-items: var(--flex-align-center);
}

.otp-container {
    background-color: var(--primary-bg-color);
    padding: var(--padding-container);
    border-radius: var(--border-radius-container);
    text-align: center;
    box-shadow: 0 4px 8px var(--box-shadow-color);
    width: var(--box-width);
}

.otp-inputs {
    display: flex;
    justify-content: space-between;
    margin: 4px 0;
}

.otp-box {
    width: var(--box-width-otp);
    height: var(--box-height-otp);
    text-align: center;
    font-size: var(--font-size-otp);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-box);
}

    .otp-box:focus {
        border-color: var(--focus-border-color);
        outline: none;
    }

.verify-btn, .resend-btn {
    background: linear-gradient(60deg, var(--gradient-start-color) 40%, var(--gradient-end-color) 100%);
    color: var(--text-color);
    border: none;
    padding: var(--padding-button);
    border-radius: var(--border-radius-button);
    cursor: pointer;
    margin: 10px 0;
}

    .verify-btn:hover, .resend-btn:hover {
        background-color: var(--hover-color);
    }
.emailValClass {
    background-color: #fff;
    max-width: 450px;
    width: 100%;
    padding: 40px 30px;
    box-shadow: var(--box-shadow-lg);
    border-radius: 10px;
}

.show-password-label {
    display: flex;
    align-items: center;
    margin-top: 10px;
    position: absolute;
    top: 3px;
    right: 15px;
}

    .show-password-label input {
        margin-right: 5px;
    }

.modalBackground {
    background-color: rgb(0 0 0 / 66%);
    backdrop-filter: blur(5px);
}

.login-headerr h4 {
    color: var( --logo-clr-100);
}
.login-header h4 {
    color: var( --logo-clr-100);
}
.card-header {
    background-color: rgba(0, 0, 0, 0.075);
    border-radius: 5px;
}
.error-message {
    color: red;
    font-size: 13px;
    font-style: normal;
}
/*-------------- Login new Header Design End --------------*/
:root {
    /* Color Variables */
    --success-color: #28a7458f;
    --error-color: #db3646b8;
    --modal-bg-color: #fff;
    /* Size Variables */
    --border-radius: 20px;
    --iconn-size: 80px;
    /* Stroke Variables */
    --stroke-width: 6;
    --circle-radius: 62.1;
    --dasharray: 1000;
    /* Animation Timing Variables */
    --dash-duration: 0.9s;
    --check-delay: 0.35s;
    --check-duration: 0.95s;
}

/* Success Modal */
/*#AccountSuccess .modal-content {
    border-radius: var(--border-radius);
    background-color: var(--modal-bg-color);
    box-shadow: 0 4px 15px var(--modal-shadow-color);
    padding: 20px;
    width:450px;
}*/
#Accountsuccess .card-body svg {
    width: var(--iconn-size);
    display: block;
    margin: 0 auto;
}
#Accountsuccess .card-body .path {
    stroke-dasharray: var(--dasharray);
    stroke-dashoffset: 0;
}

    #Accountsuccess .card-body .path.circle {
        animation: dash var(--dash-duration) ease-in-out;
        fill: none;
        stroke: var(--success-color);
        stroke-width: var(--stroke-width);
        stroke-miterlimit: 10;
    }

    #Accountsuccess .card-body .path.check {
        stroke-dashoffset: -100;
        animation: dash-check var(--check-duration) var(--check-delay) ease-in-out forwards;
        fill: none;
        stroke: var(--success-color);
        stroke-width: var(--stroke-width);
        stroke-linecap: round;
        stroke-miterlimit: 10;
    }

/* Error Modal */


#AccountError .card-body svg {
    width: var(--iconn-size);
    display: block;
    margin: 0 auto;
}

#AccountError .card-body .path {
    stroke-dasharray: var(--dasharray);
    stroke-dashoffset: 0;
}

    #AccountError .card-body .path.circle {
        animation: dash var(--dash-duration) ease-in-out;
        fill: none;
        stroke: var(--error-color);
        stroke-width: var(--stroke-width);
        stroke-miterlimit: 10;
    }

    #AccountError .card-body .path.line {
        stroke-dashoffset: var(--dasharray);
        animation: dash var(--check-duration) var(--check-delay) ease-in-out forwards;
        fill: none;
        stroke: var(--error-color);
        stroke-width: var(--stroke-width);
        stroke-linecap: round;
        stroke-miterlimit: 10;
    }

/* Animations */
@keyframes dash {
    0% {
        stroke-dashoffset: var(--dasharray);
    }

    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes dash-check {
    0% {
        stroke-dashoffset: -100;
    }

    100% {
        stroke-dashoffset: 900;
    }
}