body {
    margin: 0;
}

/* Scale down logo by 15% */
.navbar-brand img {
    max-height: 60px !important;
    object-fit: contain;
}

.family-budget-section {
    position: relative;
    padding-top: 130px !important;
    margin-top: 50px;
}

.family-budget-section::before,
.family-budget-section::after {
    content: '';
    background-size: cover;
    width: 100%;
    left: 0;
    right: 0;
    background-repeat: no-repeat;
    position: absolute;
    height: 590px;
}

.family-budget-section::before {
    background-image: url('https://static.timelybills.app/public-site/family_budgeting_new/wave-below.webp');
    top: 80px;
    z-index: 1;
}

.family-budget-section::after {
    background-image: url('https://static.timelybills.app/public-site/family_budgeting_new/wave-above.png');
    top: 180px;
}

.family-container {
    position: relative;
    z-index: 2;
}

.family-budget-heading-block h2 {
    font-size: 64px;
    color: #2B2B2B;
    line-height: 119%;
    letter-spacing: -0.64px;
    text-align: center;
}

.main-family-budget-section {
    padding-bottom: 0 !important;
}

.family-budget-heading-block a {
    border-radius: 10px !important;
}

.family-budget-heading-block h2 span {
    color: #007ED3;
    text-align: center;
}

.family-budget-heading-block>span {
    color: #4B5563;
    font-size: 20px;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 5px;
    display: block;
}

.family-budget-heading-block>p {
    color: #007ED3;
    font-size: 20px;
    font-weight: 600;
    line-height: 120.908%;
    margin-bottom: 5px;
}


.family-budget-right-block {
    width: 100%;
    position: relative;
    top: 10px;
    margin-top: 80px;
}

.family-budget-right-block img {
    max-width: 100%;
}

.family-budget-right-block img.top-img {
    position: absolute;
    top: -50px;
    width: 450px;
    left: -140px;
    height: 280px;
}

.family-budget-right-block img.bottom-img {
    height: 360px;
    position: absolute;
    bottom: 10px;
    width: 560px;
    left: -380px;
    max-width: fit-content;
}

.money-manage-section {
    padding: 100px 0;
}

.money-manage-section .money-manage-left-block {
    position: relative;
    display: flex;
    flex-direction: column;
    z-index: 1;
    width: 100%;
}

.money-manage-section .money-manage-left-block img {
    border-radius: 17px;
    position: relative;
    z-index: 2;
    margin: auto;
    max-width: 100%;
}

.money-manage-section .money-manage-right-block p {
    margin-bottom: 0;
    margin-top: 20px;
    font-size: 20px;
    font-weight: 500;
    line-height: 160%;
}

.money-manage-section .money-manage-right-block h2 {
    font-weight: 600;
    font-size: 48px;
    line-height: 130%;
    letter-spacing: -1px;
    width: 546px;
    color: #2B2B2B;

}

.money-manage-section .money-manage-right-block h2 span {
    color: #007ED3;
}

.text-light-cyan {
    color: #11C7AA;
}

.text-dark-black-shade {
    color: #2B2B2B;
}

.text-light-gray-shade {
    color: #4B5563;
}

.text-new-blue {
    color: #007ED3 !important;
}

/* section {
    padding: 60px 0 !important;
} */

.accordion-budgeting .panel-title span {
    color: #2b2b2b;
}

.accordion-budgeting.accordion-style-03 .panel-heading {
    background: none;
}

.accordion-budgeting.accordion-style-03 .panel {
    background: #f8f8f8;
}

.accordion-budgeting.accordion-style-03 .panel .panel-body {
    padding: 0 20px 20px;
    color: #6B7280;
}

.accordion-style-03 .panel .panel-heading i {
    top: 34px;
}

.bg-off-white {
    background-color: #F9FAFB;
}

.tb-content-box-icon {
    background-color: #EFF8FF;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    position: absolute;
    top: -28px;
    left: 0;
    right: 0;
}

.tb-content-box-icon img {
    max-width: 70%;
    margin-left: 0;
    margin-top: 0;
}

.tb-content-box {
    border: 1px solid transparent;
}

.tb-content-box:hover {
    transform: none;
    cursor: pointer;
    border: 1px solid #007ED3;
    background-color: #fff;
}

.tb-content-box h3 {
    font-size: 20px;
    font-weight: 600;
    color: #2b2b2b;
}

.tb-content-box p {
    font-size: 16px;
    margin-bottom: 0;
    color: #4B5563;
}

.tb-content-box:hover h3 {
    color: #2b2b2b;
}

.your-class .slick-arrow {
    width: 45px;
    height: 45px;
    position: absolute;
    top: 50%;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #FEFDFD;
    box-shadow: 0px 4px 30px 0px rgba(1, 1, 20, 0.10);
    margin-top: -70px;
    z-index: 9;
    border: 0;
    font-size: 0;
}

.your-class .slick-prev::before {
    content: '';
    width: 25px;
    height: 25px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    display: flex;
    align-items: center;
    background-image: url('https://static.timelybills.app/public-site/family_budgeting_new/slick-arrow-left.svg');
    background-size: cover;
}

.your-class .slick-prev {
    left: -30px;
}

.your-class .slick-next {
    right: 15px;
}

.your-class .slick-next::before {
    content: '';
    width: 25px;
    height: 25px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    display: flex;
    align-items: center;
    background-image: url('https://static.timelybills.app/public-site/family_budgeting_new/slick-arrow-right.svg');
    background-size: cover;
}

.your-class .slick-dots button {
    display: none;
}

.your-class .slick-dots li::marker {
    display: none;
}

.your-class .slick-dots {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 10px;
    justify-content: center;
    list-style: none;
    margin-top: 50px;
}

.your-class .slick-dots li {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background-color: rgba(0, 138, 255, 0.30);

}

.your-class .slick-dots li.slick-active {
    width: 21px;
    height: 21px;
    background-color: #008AFF;
}

.your-class .branding-bg {
    border-radius: 27px;
    border: 1px solid #007ED3;
    background: #FFF;
    padding: 25px;
    align-items: flex-start;
    margin-right: 25px;
    width: 31%;

}

.your-class .branding-bg .branding-bg-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #EFF8FF;
}

.your-class .branding-bg .branding-bg-icon img {
    width: 30px;
}

.your-class .branding-bg h3 {
    color: #2B2B2B;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    padding: 20px 0;
    margin: 0;
}

.your-class .branding-bg p {
    color: #4B5563;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin: 0;
    text-align: left;
}

.your-class .slick-track {
    display: flex !important;
}

.your-class .slick-slide {
    height: inherit;
    flex: 1;
}

.your-class .slick-list {
    padding-right: 20px;
}

.color-boxes {
    border-radius: 24px;
    background: #EEF8FF;
    width: 100%;
    padding: 25px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 30px;
}

.color-boxes .user-photo-block {
    margin-bottom: 15px;
}

.color-boxes>p {
    margin: 0;
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    color: #061C3D;
}

.color-boxes .user-photo-block img {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    margin-right: 10px;
}

.color-boxes .user-photo-block span {
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: #061C3D;
}

.quick-glance-app-section {
    background-color: #007ED3;
}

.mobile-app-slider {
    position: relative;
    z-index: 3;
}

.mobile-app-slider .mobile-app-container {
    height: 600px;
    border-radius: 16px;
    border: 5px solid rgba(255, 255, 255, 0.08);
    margin-right: 15px;
    width: 289px !important;
}

.mobile-app-slider .mobile-app-container img {
    height: 100%;
    border-radius: 16px;
    width: 100%;
}

.mobile-app-slider .mobile-app-container:nth-child(even) {
    margin-top: 100px;
}

.your-class.mobile-app-slider .slick-prev {
    left: 0;
}

.your-class.mobile-app-slider .slick-next {
    right: 0;
}

.your-class.mobile-app-slider .slick-arrow {
    top: inherit;
    bottom: -12px;
}

.your-class.mobile-app-slider .slick-dots li {
    background-color: rgba(255, 255, 255, 0.30);
}

.your-class.mobile-app-slider .slick-dots li.slick-active {
    background-color: #fff;
}

.your-class.mobile-app-slider .slick-list {
    margin: 30px 0
}

.your-class.mobile-app-slider .slick-prev.slick-disabled,
.your-class.mobile-app-slider .slick-next.slick-disabled {
    opacity: 0.1;
}

.quick-glance-app-section {
    position: relative;
}

.sky-blue-container {
    height: 920px;
}

.sky-blue-container h3 {
    color: #2B2B2B;
    font-size: 70px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: -1px;
}

.sky-blue-container h3 span {
    color: #007ED3;
}

.sky-blue-container a {
    width: 224px;
    margin: 0 5px;
}

.sky-blue-container a img {
    width: 100%;
}

.sky-blue-container .container {
    height: 100%;
}

.sky-blue-container .container .row {
    height: 100%;
}

.tab-mobile-container img {
    max-width: 100%;
}

.connect-form {
    background-color: #fff;
    box-shadow: 0px 16px 72px 0px rgba(6, 28, 61, 0.08);
    border-radius: 24px;
    padding: 50px;
    min-height: 380px;
    display: flex;
}

.connect-form #submitBtn {
    display: flex;
}

.connect-form .loader {
    padding: 15px;
    left: 20px;
    top: -20px;
}

#success-msg {
    margin: auto;
}

.connect-form label {
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    color: #061C3D;
}

.connect-form input,
.connect-form textarea {
    border-radius: 5px;
    border: 1px solid var(--Gray-100, #E6E8EC);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    color: #838E9E;
}

.connect-form a {
    border-radius: 7px;
    background-color: #0B63E5;
    text-transform: unset !important;
    border-color: #0B63E5;
    height: 40px;
}

.connect-form a:hover {
    background-color: #009CDE;
    border-color: #009CDE;
    color: #fff
}

.connect-form a img {
    margin-left: 6px;
    width: 20px;
}

.text-container {
    display: flex;
    flex-direction: column;
}

.text-container h1 {
    color: #007ED3;
    font-size: 27px;
    font-style: normal;
    font-weight: 600;
    line-height: 36.75px;
    margin-bottom: 5px;
}

.text-container h2 {
    color: #072B4A;
    font-size: 48px;
    font-style: normal;
    font-weight: 700;
    line-height: 65.25px;
    letter-spacing: -1.125px;
}

.features-section .new-text-container h2 {
    color: #007ED3;
    font-size: 27px;
    font-style: normal;
    font-weight: 600;
    line-height: 36.75px;
    margin-bottom: 5px;
}

.features-section .new-text-container h3 {
    color: #072B4A;
    font-size: 48px;
    font-style: normal;
    font-weight: 700;
    line-height: 65.25px;
    letter-spacing: -1.125px;
}

.text-container p {
    margin: 0;
    color: #6B7280;
    font-size: 27px;
    font-style: normal;
    font-weight: 400;
    line-height: 36.75px;
}

.text-container a {
    color: #007ED3;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 18px;
    border-radius: 5px;
    padding: 10px 20px;
    border: 1px solid #007ED3;
    display: inline-block;
    width: 200px;
    margin-top: 30px;
    text-align: center;
}

.text-container a i {
    margin: 0 4px;
}

.text-container a:hover {
    background-color: #007ED3;
    color: #fff;
}

.mobile-img-first-section .mobile-right-container {
    display: flex;
    justify-content: flex-end;
}

.mobile-img-first-section .mobile-left-container {
    display: flex;
    justify-content: flex-start;
}

.mobile-img-first-section .mobile-right-container img,
.mobile-img-first-section .mobile-left-container img {
    max-width: 100%;
}

.mobile-img-first-section .mobile-right-container img {
    margin-right: -20px;
}

.mobile-img-first-section .mobile-left-container img {
    margin-left: -30px;
}

.features-section {
    width: 100%;
}

.features-section {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
    padding: 110px 0 !important;
}


.heading-what-we-offer>h1 {
    color: #007ED3;
    text-align: center;
    font-size: 48px;
    font-style: normal;
    font-weight: 600;
    line-height: 65.25px;
    letter-spacing: -1.125px;
    margin-bottom: 30px;
}

.text-container {
    padding-top: 40px;
}

.join-us-section h4 {
    font-size: 36px;
    font-weight: 700;
    color: #072B4A;
    max-width: 780px;
    margin: auto;
    line-height: 65.25px;
    letter-spacing: -1.125px;
}

.join-us-section h4 span {
    font-weight: 500;
}

.join-us-section h4 span.blue-text {
    font-weight: 700;
    color: #007ED3;
}

.join-us-section img {
    max-width: 100%;
    margin: 100px auto;
}

.testimonial-section {
    padding-top: 0px;
}

.testimonial-section h4 {
    font-size: 48px;
    font-weight: 700;
    color: #072B4A;
    max-width: 780px;
    margin: auto;
    line-height: 65.25px;
    letter-spacing: -1.125px;
    margin-bottom: 50px;
}

.testimonial-section h4 span {
    font-weight: 500;
}

.testimonial-section h4 span.blue-text {
    font-weight: 700;
    color: #007ED3;
}

.testimonial-section .color-boxes {
    border-radius: 15px;
    border: 1px solid #B9E6FE;
    background-color: #fff;
}

.benefit-section {
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/pricing-bg.webp);
    background-size: cover;
    width: 100%;
    padding-top: 0px;
}

.benefit-section-card {
    padding: 20px 20px;
    border-radius: 15px;
    border: 1.5px solid var#B9E6FE;
    background: #fff;
    transition: 0.3s box-shadow linear;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    height: 100%;
}

.benefit-section-card .icon-block {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #E0F3FF;
    border-radius: 10px;
    margin-bottom: 20px;
}

.benefit-section-card .icon-block img {
    width: 20px;
}

.benefit-section-card:hover {
    box-shadow: 0px 3px 34.875px 0px rgba(0, 0, 0, 0.13);
}

.benefit-section-card h4 {
    color: #061C3D;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 15px;
}

.benefit-section-card h3 {
    color: #061C3D;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 15px;
}

.benefit-section-card span {
    color: #42526B;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 24.75px;
    flex: 1;
    margin-bottom: 15px;
}

.benefit-section-card a {
    color: #007ED3;
    text-align: center;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 18px;
    margin-top: auto;
    cursor: default;
}

.benefit-section-card-container {
    row-gap: 30px;
}

.benefit-section .main-heading {
    margin-bottom: 80px;
}

.benefit-section .main-heading h2 {
    font-size: 48px;
    font-style: normal;
    font-weight: 600;
    line-height: 65.25px;
    letter-spacing: -1.125px;
    margin-bottom: 15px;
}

.benefit-section .main-heading span {
    color: #072B4A;
    font-size: 36px;
    font-style: normal;
    font-weight: 500;
    line-height: 48.75px;
    letter-spacing: -1.125px;
}

.managing-bill-section {
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/pricing-bg.webp);
    background-size: cover;
    margin-top: 0px;
    overflow: unset;
    padding: 60px 0 !important;
}

.managing-bill-home-section {
    padding: 60px 0 0 !important;
}

.managing-bill-img-container {
    position: relative;
}

.managing-bill-img-container img {
    position: relative;
    top: 110px;
    max-width: 100%;
    right: -20px;
}

.home-managing-img-container img {
    top: 60px;
}

.learn-smart-section .home-managing-img-container img {
    top: 0;
}

.managing-bill-text-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.managing-bill-text-container h2,
.managing-bill-text-container h1 {
    color: #072B4A;
    font-size: 56.25px;
    font-style: normal;
    font-weight: 700;
    line-height: 71.25px;
    letter-spacing: -1.125px;
}

.managing-bill-text-container p {
    color: #4B5563;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 27.75px;
}

.managing-bill-text-container p span {
    color: #374151;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 27.75px;
}

.managing-bill-text-container .photo-frame {
    display: flex;
    align-items: center;
    gap: 20px;
}

.managing-bill-text-container .photo-frame img {
    max-width: 100%;
}

.managing-bill-text-container .photo-frame h4 {
    color: #007ED3;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin: 0;
}

.managing-bill-text-container .photo-frame h4 span {
    font-weight: 700;
}

.managing-bill-text-container .social-icons {
    margin-top: 30px;
}

.managing-bill-text-container .social-icons a>img {
    width: 160px;
}

.managing-bill-text-container .social-icons a {
    margin-right: 10px;
}

.managing-bill-text-container .social-icons a ul {
    list-style: none;
    padding: 0;
    margin: 20px 0 0;
}

.managing-bill-text-container .social-icons a ul li {
    display: flex;
    align-items: center;
    gap: 3px;
}

.managing-bill-text-container .social-icons a ul li img {
    width: 100px;
}

.managing-bill-text-container .social-icons a ul li span {
    color: #222D39;
    font-size: 13.5px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    position: relative;
    top: 2px;
}

.rating-boxes-section {
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/rating-card-wave.webp);
    background-size: cover;
    position: relative;
    margin-top: 100px;
}

.rating-boxes-section .rating-boxes-card {
    border-radius: 12px;
    border: 1px solid #E0F3FF;
    background: #FFF;
    box-shadow: 0px 9px 44.85px 0px rgba(0, 0, 0, 0.09);
    padding: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 196px;
    position: relative;
}

.rating-boxes-section .rating-boxes-card .top-icon-notch {
    width: 54px;
    height: 54px;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #007ED3;
    ;
    position: absolute;
    top: -27px;
}

.rating-boxes-section .rating-boxes-card .top-icon-notch img {
    width: 24px;
}

.rating-boxes-section .rating-boxes-card h2 {
    color: #072B4A;
    font-size: 27px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    letter-spacing: -0.297px;
    text-transform: uppercase;
    text-align: center;
    margin: 0;
}

.rating-boxes-section .rating-boxes-card span {
    color: #007ED3;
    text-align: center;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    letter-spacing: -0.165px;
    text-transform: uppercase;
}

.timely-bill-app-section {
    overflow: hidden;
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/CTA.webp);
}

.download-white-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 9px;
    border: 1px solid #B9E6FE;
    background: #FFF;
    box-shadow: 0px 9px 24px 0px rgba(6, 28, 61, 0.04);
    padding: 20px;
}

.download-white-box h4 {
    margin: 0;
    color: #072B4A;
    font-size: 36px;
    font-style: normal;
    font-weight: 600;
    line-height: 65.25px;
    letter-spacing: -1.125px;
}

.download-white-box .social-icons {
    margin-top: 5px;
}

.button-section {
    display: flex;
    margin-top: 60px;
    justify-content: center;
}

.button-section a {
    color: #007ED3;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 18px;
    border-radius: 5px;
    padding: 10px 20px;
    border: 1px solid #007ED3;
    display: inline-block;
    width: 200px;
    margin-top: 30px;
    text-align: center;
}

.button-section a:hover {
    background-color: #007ED3;
    color: #fff;
}

.button-section a i {
    margin: 0 4px;
}

.rating-boxes-section h6 {
    color: #072B4A;
    font-size: 64px;
    font-style: normal;
    font-weight: 600;
    line-height: 87px;
    letter-spacing: -1.5px;
    margin-bottom: 80px;
}

#success-msg h4 {
    color: #2e7d32;
    font-size: 16px;
    margin: 0;
    font-weight: 500;
    line-height: 30px;
}

.header-button .theme-btn:hover {
    background: #009CDE !important;
}

.page-main-heading h1 {
    font-weight: 700;
    font-size: 64px;
    line-height: 76.16px;
    color: #2B2B2B;
    margin-bottom: 0;
}

.page-main-heading span {
    color: #007ED2;
    font-weight: 700;
    font-size: 64px;
    line-height: 76.16px;
}

.new-blue {
    color: #007ED2 !important;
}

.black-text {
    color: #2B2B2B !important;
}

.page-main-heading p {
    font-size: 24px;
    margin: 0;
    line-height: 30px;
    margin-top: 10px;
}

.main-header-new {
    margin-bottom: 30px;
    overflow: visible;
}

.features-designed-section {
    position: relative;
    z-index: 1;
    padding-top: 0px;
    padding-bottom: 30px;
}

.shift-container {
    margin-top: -60px;
}

.screenshot-img-container {
    width: 100%;
    position: relative;
    z-index: 1;
}

.screenshot-img-container>div {
    padding: 0 !important;
}

.screenshot-img-container img {
    width: 100%;
}

.features-designed-section .design-main-heading {
    color: #2B2B2B;
    text-align: center;
    font-size: 48px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 40px;
}

.features-designed-section .designed-cards {
    display: flex;
    flex-direction: column;
    width: 47%;
    margin-bottom: 100px;
}

.features-designed-section .designed-cards .design-box {
    border-radius: 28.336px;
    background: #E0F3FF;
    padding: 35px 65px 0px 65px;
    overflow: hidden;
    padding-top: 20px;
    display: flex;
    height: 400px;
}

.features-designed-section .designed-cards .design-box img {
    max-width: 100%;
    margin: auto;
    display: block;
    height: 100%;
}

.features-designed-section .designed-cards h2 {
    margin: 30px 0 15px;
    color: #072B4A;
    font-size: 38px;
    font-style: normal;
    font-weight: 700;
    line-height: 52px;
    letter-spacing: -1.5px
}

.features-designed-section .designed-cards p {
    margin-bottom: 0;
    color: #6B7280;
    font-size: 28px;
    font-style: normal;
    font-weight: 500;
    line-height: 49px;
}

.design-box-rows {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.margin-0px-bottom {
    margin-bottom: 0 !important;
}

.no-bg-img {
    background: none;
}

.borders {
    border-radius: 15px;
    border: 1px solid #B9E6FE;
    background: #fff;
}

.borders .icon-block {
    width: 84px;
    height: 84px;
    border-radius: 50%;
    background: #EFF8FF !important;
}

.borders .icon-block img {
    width: 50px;
}

.borders:hover {
    box-shadow: none;
}

.more-height {
    height: 730px;
}

.low-width {
    width: 100% !important;
    height: 680px;
}

.diff-margin-b {
    margin-bottom: 52px;
}

.design-main-subheading {
    color: #4B5563;
    text-align: center;
    font-size: 32px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 100px;
    padding-top: 10px;
}

.h-100 {
    height: 100% !important;
}

.blue-section {
    background: #DBF1FF;
    padding: 40px 40px 0;
    display: flex;
    height: 990px;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
    position: relative;
}

.blue-section .heading-text h4 {
    color: #2B2B2B;
    text-align: center;
    font-size: 55px;
    font-style: normal;
    font-weight: 400;
}

.blue-section .heading-text h4 strong {
    color: #007ED2;
}

.blue-section .cards-container {
    margin: auto;
    display: flex;
    justify-content: center;
}

.blue-section .cards-container .ellipsis-img-container {
    width: 700px;
    height: 634px;
    border-radius: 700px;
    position: absolute;
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/family-ellipse-photo.jpeg);
    background-repeat: no-repeat;
    background-size: 100%;
    bottom: -170px;
    left: 0;
    right: 0;
    margin: auto;
}

.ellipsis-border {
    width: 900px;
    height: 900px;
    border-radius: 634px;
    border: 420px solid rgba(0, 126, 210, 0.02);
    position: absolute;
    bottom: -300px;
    left: 0;
    right: 0;
    margin: auto;
}

.card-layout {
    position: relative;
    min-width: 380px;
    max-width: 380px;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    box-shadow: 0px 4.42px 18.3px 0px rgba(0, 0, 0, 0.06);
    padding: 26px 26px;
    border-radius: 27px;
    top: 40px;
    align-items: center;
    border: 7px solid rgba(200, 235, 254, 0.40);
    left: 330px;
    justify-content: center;
}

.card-layout .card-img {
    height: 74px;
    border-radius: 18px;
    background: #F0F9FF;
    width: 74px;
    justify-content: center;
    display: flex;
    position: absolute;
    top: -42px;
    align-items: center;

}

.card-layout .card-img img {
    width: 39px;
    height: 39px;
}

.card-layout h4 {
    color: #061C3D;
    font-size: 26px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin: 0;
    text-align: center;
    padding: 15px 0;
}

.card-layout p {
    color: #42526B;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin: 0;
    text-align: center;
}

.card-top-right {
    left: 445px;
}

.card-bottom-left {
    left: -632px;
    top: 430px;
}

.card-bottom-right {
    left: -120px;
    top: 430px;
}

.money-tip-header {
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 30px;
    margin-top: 130px;
    height: 300px;
    position: relative;
    overflow: hidden;
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/green-blue-layers.png);
    background-size: cover;
}

.money-tip-header h2 {
    font-size: 32px;
    color: #072B4A;
    margin: 0;
    text-align: center;
}

.money-tip-header .money-tip-left-img {
    position: absolute;
    left: 0;
    top: 0;
    height: 294px;
}

.money-tip-header .money-tip-right-img {
    position: absolute;
    right: 0;
    top: 0;
    height: 294px;
}

.dollar-img-section {
    position: relative;
    max-width: 600px;
    margin: auto;
}

.dollar-img-section .small-dollar {
    position: absolute;
    width: 50px;
    left: 0;
    top: 40px;
}

.dollar-img-section .large-dollar {
    position: absolute;
    width: 74px;
    right: 0;
    top: -20px;
}

.money-tip-slider-section {
    overflow: hidden;
    padding: 0 200px 100px !important;
}

.content-conatiner {
    margin: auto;
    border: 1px solid #E6E8EC;
    border-radius: 28px;
    padding: 20px;
    display: flex;
    column-gap: 60px;
    width: 100%;
}

.content-conatiner .content-container-left {
    width: 287px;
    overflow: hidden;
    border-radius: 17px;
    min-width: 287px;
}

.content-conatiner .content-container-left img {
    width: 100%;
}

.content-conatiner .content-container-right {
    display: flex;
    flex-direction: column;
    flex: 1;
    row-gap: 20px;
}

.content-conatiner .content-container-right .tips-tag {
    display: flex;
    column-gap: 20px;
}

.content-conatiner .content-container-right .tips-tag .tag-1 {
    padding: 10px 20px;
    background-color: #11C7AA;
    border-radius: 60px;
    text-align: center;
    color: #fff;
    font-size: 20px;
    font-weight: 500;
}

.content-conatiner .content-container-right .tips-tag .tag-1.tag-2 {
    background-color: #DFFCEB;
    color: #072B4A;
}

.content-conatiner .content-container-right h4 {
    font-size: 36px;
    font-weight: 700;
    color: #072B4A;
    margin: 0;
}

.content-conatiner .content-container-right p {
    font-size: 24px;
    font-weight: 400;
    color: #6B7280;
    line-height: 32px;
    margin: 0;
}

.money-tip-slider-section .slick-track {
    display: flex !important;
}

.money-tip-slider-section .slick-slide {
    width: 100% !important;
    display: flex !important;
    justify-content: center;
}

.money-tip-slider-section .slick-arrow {
    position: absolute;
    bottom: 50px;
    left: -100px;
    right: 0;
    width: 28px;
    height: 28px;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
    background-color: #218DEA;
    color: #fff;
    border: none;
}

.money-tip-slider-section .slick-arrow.slick-next {
    right: -100px;
    left: 0;
}

.money-tip-slider-section .slick-arrow.slick-disabled {
    background-color: #DCDCDC;
    pointer-events: none;
}

.money-tip-tab-section {
    padding: 50px 0 !important;
}

.money-tip-tab-section h2 {
    margin: 0;
    font-size: 32px;
    font-weight: 500;
    color: #072B4A;
    text-align: center;
}

.money-tip-tab-section .tabs-container ul {
    display: flex;
    justify-content: space-evenly;
    margin-top: 30px;
}

.money-tip-tab-section .tabs-container ul li {
    padding: 0 !important;
}

.money-tip-tab-section .tabs-container ul li a {
    background-color: #fff !important;
    border: 1px solid #A3DAFF !important;
    border-radius: 50px;
    padding: 12px 24px !important;
    color: #838E9E !important;
    font-size: 20px !important;
    font-weight: 500 !important;
}

.money-tip-tab-section .tabs-container ul li a.active {
    background-color: #218DEA !important;
    color: #fff !important;
    border: 1px solid #218DEA !important;
    font-weight: 600 !important;
}

.money-tip-dos-card {
    border-radius: 20px;
    overflow: hidden;
}

.money-tip-dos-card .money-tip-dos-img {
    height: 390px;
    border-radius: 0 20px 20px 0;
}

.money-tip-dos-card .money-tip-dos-img img {
    height: 100%;
    width: 100%;
    margin: auto;
    display: block;
}

.money-tip-dos-card .money-tip-content {
    border: 1px solid #E6E8EC;
    padding: 20px 10px;
    border-radius: 0px 0px 20px 20px;
    display: flex;
    flex-direction: column;
    row-gap: 10px;
    align-items: flex-start;
}

.money-tip-dos-card .money-tip-content span {
    display: inline-block;
    padding: 6px 15px;
    border-radius: 70px;
    text-align: center;
    background-color: #E6F6FF;
    color: #072B4A;
    font-size: 16px;
    font-weight: 500;
}

.money-tip-dos-card .money-tip-content p {
    margin: 0;
    color: #061C3D;
    font-size: 24px;
    font-weight: 500;
    line-height: 28px;
}

.money-tip-tab-section .tab-content-container .row {
    row-gap: 30px;
}

.learn-smart-section {
    background-image: none;
    position: relative;
    overflow: hidden;
}

.learn-smart-section::before, .phone-section::before {
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/blurrred-colourful-wallpaper.png);
    content: '';
    background-size: cover;
    opacity: 0.56;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.learn-smart-section .managing-bill-text-container h1 {
    font-size: 74px;
    color: #2b2b2b;
    line-height: 78px;
}

.learn-smart-section .managing-bill-text-container p {
    font-size: 24px;
    color: #464646;
}

.learn-smart-section .managing-bill-text-container a {
    width: 250px;
    height: 56px;
    border-radius: 50px;
    color: #fff;
    font-size: 20px;
    font-weight: 500;
    background-color: #218DEA;
    display: flex;
    align-items: center;
    justify-content: center;
}

.balance-life-budget-section {
    padding: 50px 0;
}

.balance-life-budget-section .balance-life-left {
    border-radius: 27px;
    padding: 30px 40px;
    display: flex;
    justify-content: center;
    row-gap: 20px;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}

.balance-life-budget-section .balance-life-left::before {
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/blurrred-colourful-wallpaper.png);
    background-size: cover;
    opacity: 0.56;
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 1;
}

.balance-life-budget-section .balance-life-left h1 {
    color: #2B2B2B;
    font-size: 40px;
    font-weight: 500;
    margin: 0;
    line-height: initial;
    position: relative;
    z-index: 2;
}

.balance-life-budget-section .balance-life-left p {
    color: #2B2B2B;
    font-size: 20px;
    font-weight: 400;
    margin: 0;
    position: relative;
    z-index: 2;
}

.balance-life-budget-section .balance-life-left span {
    background-color: #fff;
    color: #11C7AA;
    font-size: 17px;
    padding: 10px 10px;
    font-weight: 600;
    display: block;
    text-align: center;
    border-radius: 7px;
    position: relative;
    z-index: 2;
}

.balance-life-budget-section .balance-life-right {
    width: 100%;
    border-radius: 27px;
    overflow: hidden;
}

.balance-life-budget-section .balance-life-right img {
    width: 100%;
    max-width: 100%;
    height: 100%;
}

.creatte-budget-5-steps-section {
    padding: 70px 0;
}

.creatte-budget-5-steps-section>h1 {
    font-size: 40px;
    color: #2B2B2B;
    margin: 0;
    text-align: center;
    line-height: initial;
}

.creatte-budget-5-steps-section>h1 strong {
    font-size: 48px;
    color: #218DEA;
}

.creatte-budget-5-steps-section .stepper-blocks {
    margin: 80px 0;
}

.creatte-budget-5-steps-section .stepper-blocks>img.ellipsis-square-img {
    position: absolute;
    left: -20px;
    margin-top: -400px;
}

.creatte-budget-5-steps-section .stepper-blocks .steps-container {}

.creatte-budget-5-steps-section .stepper-blocks .steps-container ul {
    padding: 0;
    list-style: none;
    margin: 0;
    display: flex;
    align-items: flex-start;
    row-gap: 15px;
    flex-direction: column;
    margin-top: 30px;
    padding-left: 35px;
}

.creatte-budget-5-steps-section .stepper-blocks .steps-container ul li {
    border: 1px solid #D6EFFF;
    padding: 18px 12px;
    display: flex;
    align-items: center;
    column-gap: 10px;
    justify-content: center;
    border-radius: 56px;
}

.creatte-budget-5-steps-section .stepper-blocks .steps-container ul li img {
    width: 33px;
    height: 33px;
}

.creatte-budget-5-steps-section .stepper-blocks .steps-container ul li span {
    font-size: 24px;
    font-weight: 400;
    color: #218DEA;
}

.creatte-budget-5-steps-section .stepper-blocks .steps-container .steps-header {
    display: flex;
    align-items: center;
    column-gap: 18px;
}

.creatte-budget-5-steps-section .stepper-blocks .steps-container .steps-header img {
    height: 60px;
}

.creatte-budget-5-steps-section .stepper-blocks .steps-container .steps-header .steps-heading {
    display: flex;
    flex-direction: column;
    row-gap: 10px;
}

.creatte-budget-5-steps-section .stepper-blocks .steps-container .steps-header .steps-heading h4 {
    color: #2B2B2B;
    font-size: 36px;
    font-weight: 500;
    margin: 0;
    line-height: initial;
}

.creatte-budget-5-steps-section .stepper-blocks .steps-container .steps-header .steps-heading h4 strong {
    color: #218DEA;
}

.creatte-budget-5-steps-section .stepper-blocks .steps-container .steps-header .steps-heading p {
    font-size: 24px;
    color: #7C7C7C;
    font-weight: 400;
    margin: 0;
    line-height: initial;
}

.creatte-budget-5-steps-section .steps-img-container {}

.creatte-budget-5-steps-section .steps-img-container img {
    max-width: 100%;
}

.creatte-budget-5-steps-section .tips-block {
    border-radius: 17px;
    background-color: #FFF6D3;
    padding: 20px 12px 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    column-gap: 15px;
    margin: 0 50px;
}

.creatte-budget-5-steps-section .tips-block img {
    width: 136px;
}

.creatte-budget-5-steps-section .tips-block .tips-content {}

.creatte-budget-5-steps-section .tips-block .tips-content h4 {
    font-size: 24px;
    font-weight: 700;
    margin: 0;
    color: #2B2B2B;
    line-height: initial;
}

.creatte-budget-5-steps-section .tips-block .tips-content p {
    font-size: 24px;
    font-weight: 700;
    margin: 0;
    line-height: initial;
    color: #2B2B2B;
}

.creatte-budget-5-steps-section .tips-block .tips-content p span {
    font-weight: 500;
}

.creatte-budget-5-steps-section .custom-notes {
    margin-left: 60px;
    margin-top: 30px;
}

.creatte-budget-5-steps-section .custom-notes>p {
    font-size: 24px;
    font-weight: 400;
    color: #2B2B2B;
    margin: 0;
    padding-bottom: 15px;
    line-height: initial;
}

.creatte-budget-5-steps-section .custom-notes .custom-notes-content {
    display: flex;
    column-gap: 10px;
    margin: 15px 0;
    padding-left: 20px;
}

.creatte-budget-5-steps-section .custom-notes .custom-notes-content.blue-link {
    font-size: 20px;
    color: #218DEA;
    font-weight: 400;
    margin-top: 20px;
}

.creatte-budget-5-steps-section .custom-notes .custom-notes-content>span {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background-color: #218DEA;
    display: inline-block;
    min-width: 15px;
    position: relative;
    top: 8px;
}

.creatte-budget-5-steps-section .custom-notes .custom-notes-content>span.rectangle-box {
    height: 30px;
    border-radius: 7px;
}

.creatte-budget-5-steps-section .custom-notes .custom-notes-content h6 {
    font-size: 24px;
    font-weight: 400;
    color: #2B2B2B;
    margin: 0;
    line-height: initial;
}

.gray-700 {
    color: #7C7C7C !important;
}

.smart-budgeting-hack-section {
    overflow: hidden;
    position: relative;
}

.smart-budgeting-hack-section .main-heading {
    text-align: center;
}

.smart-budgeting-hack-section .main-heading h1 {
    margin: 0;
    font-size: 48px;
    font-weight: 500;
    color: #2B2B2B;
    line-height: initial;
    padding-bottom: 20px;
}

.smart-budgeting-hack-section .main-heading h1 strong {
    color: #218DEA;
}

.smart-budgeting-hack-section .main-heading p {
    line-height: initial;
    margin: 0;
    font-size: 24px;
    font-weight: 400;
}

.smart-budgeting-hack-section .smart-cards-container {
    width: 1000px;
    display: flex;
    margin: 70px auto 0;

}

.smart-budgeting-hack-section .smart-cards-container ul {
    display: flex;
    padding: 0;
    margin: 0;
    list-style: none;
    width: 100%;
    flex-wrap: wrap;
    justify-content: center;
    gap: 35px;
}

.smart-budgeting-hack-section .smart-cards-container ul li {
    border: 1px solid #A3DAFF;
    border-radius: 30px;
    padding: 15px 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 30%;
    align-items: center;
}

.smart-budgeting-hack-section .smart-cards-container ul li .smartt-icon-container {
    background-color: #F5FAFF;
    border-radius: 16px;
    display: flex;
    align-items: center;
    width: 80px;
    height: 80px;
    justify-content: center;
}

.smart-budgeting-hack-section .smart-cards-container ul li .smartt-icon-container img {
    width: 50px;
}

.smart-budgeting-hack-section .smart-cards-container ul li span {
    font-size: 24px;
    font-weight: 400;
    color: #2B2B2B;
    text-align: center;
    display: block;
    margin-top: 25px;
    line-height: initial;
}

.budgeting-fitfalls-section {
    background-color: #c8e4fd;
    padding: 80px 0;
}

.budgeting-fitfalls-section .budgeting-fitfal-img-container {
    width: 438px;
    background-color: #fff;
    border-radius: 27px;
    height: 379px;
    position: relative;
    top: 15px;
}

.budgeting-fitfalls-section .budgeting-fitfal-img-container img {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 20px;
    border-radius: 27px;
    top: -20px;
}

.budgeting-fitfalls-section .budgeting-fitfal-content h2 {
    font-size: 48px;
    color: #2B2B2B;
    margin: 0;
    line-height: initial;
}

.budgeting-fitfalls-section .budgeting-fitfal-content h2 strong {
    color: #218DEA;
}

.budgeting-fitfalls-section .budgeting-fitfal-content p {
    font-size: 24px;
    font-weight: 400;
    color: #2b2b2b;
    line-height: initial;
    padding-top: 20px;
}

.budgeting-fitfalls-section .budgeting-fitfal-content ul {
    margin: 0;
    padding: 20px;
    background-color: #fff;
    list-style: none;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    row-gap: 15px;
}

.budgeting-fitfalls-section .budgeting-fitfal-content ul li {
    display: flex;
    column-gap: 15px;
    font-size: 24px;
    font-weight: 500;
    color: #2B2B2B;
}

.budgeting-fitfalls-section .budgeting-fitfal-content ul li span {
    width: 15px;
    height: 15px;
    background-color: #11C7AA;
    min-width: 15px;
    border-radius: 100%;
    position: relative;
    top: 5px;
}

.square-ellipsis-img {
    position: absolute;
    top: 30%;
    left: -20px;
}

.padding-80px {
    padding: 0 80px;
}

.budgeting-container {
    width: 820px;
    margin: auto;
}

.budgeting-card-container ul {
    margin: 0;
    padding: 90px 0;
    list-style: none;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    row-gap: 70px;
}

.budgeting-card-container ul li {
    width: 48%;
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 20px;
}

.budgeting-card-container ul li h4 {
    line-height: initial;
    margin: 0;
    font-size: 24px;
    font-weight: 500;
    color: #2B2B2B;
}

.budgeting-card-container ul li .budgeting-card-img {}

.budgeting-card-container ul li .budgeting-card-img img {}

.semi-circle-blue {
    position: absolute;
    right: 0;
    bottom: 22%;
}

.custom-notes-minus-margin {
    margin-left: -20px !important;
}

.start-section {
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/start-section-img.png);
    background-size: contain;
    padding: 0;
    background-repeat: round;
}

.green-bg-section {
    padding: 40px 0;
    background-color: #ECFDF3;
    margin: 100px 0;
}

.green-bg-section h2 {
    color: #2B2B2B;
    text-align: center;
    font-size: 40px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin: auto;
    max-width: 1100px;
}

.calculator-icon {
    display: flex;
    margin-left: auto;
    width: 80px;
}

.dollar-icon {
    display: flex;
    margin-left: -70px;
    margin-top: 30px;
    width: 70px;
}

.vertical-hr {
    width: 1000px;
    margin: auto;
    height: 1px;
    background-color: #E6E6E6;
    margin-bottom: 130px;
}

.budget-smartly-footer {
    background-image: none;
    margin-top: 0;
    padding-bottom: 0 !important;
}

.budget-smartly-footer ul {
    list-style: none;
    margin: 30px 0 70px;
    padding: 0;
    display: flex;
    gap: 20px;
}

.budget-smartly-footer ul li {
    display: flex;
    width: 200px;
    flex-direction: column;
}

.budget-smartly-footer ul li a {
    width: 100%;
}

.budget-smartly-footer ul li .star-ratings {
    display: flex;
    justify-content: center;
    column-gap: 5px;
    margin-top: 20px;
    align-items: center;
}

.budget-smartly-footer ul li .star-ratings i {
    font-size: 15px;
    color: #ffab2f;
}

.budget-smartly-footer ul li .star-ratings span {
    color: #222D39;
    font-size: 15px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.budget-smartly-footer ul li .star-ratings i:last-child {
    color: #acb7c2;
}

.budget-smartly-footer .managing-bill-text-container>p {
    font-size: 32px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    color: #525252;
}

.black-shade {
    color: #2b2b2b !important
}

.budget-footer-dollar-img {
    position: absolute !important;
    top: 60px !important;
    right: -60px !important;
    width: 65px;
}

.tilt-mobile.bill-img-bottom {
    top: 10px !important
}

.why-family-important {
    background-color: #218DEA;
    padding: 80px 0;
    position: relative;
}

.why-family-important::after {
    content: '';
    position: absolute;
    right: -319px;
    top: 15%;
    width: 638px;
    height: 638px;
    background-repeat: no-repeat;
    border: 90px solid rgba(255, 255, 255, 0.15);
    border-radius: 50%;
}

.why-family-important h1 {
    text-align: center;
    margin: auto;
    color: #FFF;
    font-size: 64px;
    font-weight: 400;
    line-height: normal;
    padding-bottom: 28px;
    position: relative;
}

.max-section-width {
    max-width: 1100px;
    margin: auto;
}

.why-family-important h1::before {
    content: '';
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/polygon-yellow.svg);
    position: absolute;
    right: 5px;
    top: -5px;
    background-size: cover;
    width: 10px;
    height: 16px;
}

.why-family-important h1::after {
    content: '';
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/polygon-white.svg);
    position: absolute;
    right: -7px;
    top: 0px;
    background-size: cover;
    width: 14px;
    height: 16px;
}

.why-family-important p {
    color: #FFF;
    text-align: center;
    font-size: 40px;
    font-style: normal;
    font-weight: 400;
    line-height: 109%;
    margin: auto;
    max-width: 1100px;
}

.why-family-important ul {
    list-style: none;
    padding: 0;
    margin: 100px 0 0;
    display: flex;
    flex-direction: column;
    row-gap: 50px;
    padding-right: 15%;
}

.why-family-important ul li {
    border-top-right-radius: 160px;
    border-bottom-right-radius: 160px;
    background: #FFF;
    box-shadow: 4.937px 9.873px 0px 0px rgba(0, 0, 0, 0.12);
    display: flex;
    column-gap: 40px;
    padding: 20px 20px 0;

}

.why-family-important ul li img {
    width: 150px;
    margin-top: auto;
}

.why-family-important ul li .family-stress-content h4 {
    color: #2B2B2B;
    font-size: 32.089px;
    font-style: normal;
    font-weight: 600;
    line-height: 109%;
    margin: 0;
    padding-bottom: 8px;
}

.why-family-important ul li .family-stress-content p {
    color: #2B2B2B;
    font-size: 29.62px;
    font-style: normal;
    font-weight: 400;
    line-height: 109%;
    text-align: left;
    margin: 0;
}

.bottom-section-link {
    border-radius: 15px;
    border: 1.5px solid #FFF;
    padding: 25px 25px;
    display: block;
    text-align: center;
    margin: 160px 0 0;
    color: #FFF;
    font-size: 32px;
    font-style: normal;
    font-weight: 500;
    line-height: 109%;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: auto;
    text-decoration-thickness: auto;
}

.three-rules-section .bottom-section-link {
    border: 1.5px solid #218DEA;
    color: #2b2b2b;
    margin-top: 80px;
}

.three-rules-section {
    background-color: #fff;
}

.three-rules-section h1 {
    color: #2B2B2B;
    font-weight: 600;
}

.three-rules-section h1 .large-blue {
    color: #218DEA;
    text-align: center;
    font-size: 154px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.three-rules-section h1 .small-blue {
    color: #218DEA;
}

.three-rules-section p {
    color: #7C7C7C;
    margin-bottom: 80px;
}

.three-rules-section h1::after,
.three-rules-section h1::before {
    display: none;
}

.three-rules-section h1 img {
    position: relative;
    width: 45px;
    height: 45px;
    top: -40px;
    right: 20px;
}

.three-rules-section::after {
    top: 20px;
    left: -319px;
    right: inherit;
    border: 90px solid rgba(2, 112, 187, 0.03);
}

.three-rules-container {
    padding: 0 0 80px;
}

.three-rules-container .rules-with-icon {
    display: flex;
    align-items: center;
    column-gap: 20px;
    margin-bottom: 25px;
}

.three-rules-container .rules-with-icon img {
    width: 90px;
}

.three-rules-container .rules-with-icon h4 {
    color: #218DEA;
    font-size: 40px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.three-rules-container ul {
    row-gap: 25px;
    margin: 0;
    list-style: none;
    padding: 0;
    padding-left: 100px;
    display: flex;
    flex-direction: column;
}

.three-rules-container ul li {
    display: flex;
    align-items: center;
    column-gap: 15px;
    color: #2B2B2B;
    font-size: 36px;
    font-style: normal;
    font-weight: 400;
    line-height: 109%;
    box-shadow: none;
    border-radius: 0;
    padding: 0;
}

.three-rules-container ul li span {
    width: 15px;
    height: 15px;
    min-width: 15px;
    border-radius: 50%;
    background-color: #11C7AA;
}

.why-family-need-budget-section::after {
    display: none;
}

.why-family-need-budget-section .container {
    margin-top: 80px;
}

.why-family-need-budget-section .container .row {
    row-gap: 30px;
}

.family-budget-card {
    border-radius: 40px;
    border: 1px solid #B9E6FE;
    background: #FFF;
    padding: 30px 30px 0;
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.family-budget-card h4 {
    color: #218DEA;
    font-size: 36px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin: 0;
    padding-bottom: 15px;
}

.family-budget-card p {
    color: #2B2B2B;
    font-size: 32px;
    font-style: normal;
    font-weight: 400;
    line-height: 109%;
    margin: 0;
    text-align: left;
}

.family-budget-card img {
    margin-left: auto;
    display: block;
    width: 150px;
    position: relative;
    right: -20px;
    margin-top: auto;
}

.no-after-before::after,
.no-after-before::before {
    display: none;
}

.five-steps-section::after {
    right: inherit;
    top: -30px;
    left: -319px;
    border: 90px solid rgba(227, 242, 255, 0.06);
}

.steps-vertical-container {
    margin-top: 100px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.steps-vertical-container>img {
    margin-left: auto;
    position: absolute;
    top: 50px;
    right: -30px;
}

.steps-vertical-container>img.triangle-wave-icon {
    right: inherit;
    left: 0px;
    width: 80px;
}

.steps-vertical-container h2 {
    display: flex;
    align-items: baseline;
    column-gap: 20px;
    color: #FFF;
    text-align: center;
    font-size: 48px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.steps-vertical-container h2 img {
    height: 90px;
}

.steps-vertical-container p {
    color: rgba(255, 255, 255, 0.80);
    text-align: center;
    font-family: "League Spartan";
    font-size: 36px;
    font-style: normal;
    font-weight: 400;
    line-height: 109%;
}

.premium-cards {
    display: flex;
    padding: 50px 30px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 32px;
    border-radius: 29px;
    background: #F5FBFF;
    height: 100%;
}

.premium-cards h5 {
    margin: 0;
    color: #2B2B2B;
    text-align: center;
    font-size: 48px;
    font-style: normal;
    font-weight: 600;
    line-height: 109%;
}

.premium-cards span {
    color: #2B2B2B;
    text-align: center;
    display: block;
    font-size: 36px;
    font-style: normal;
    font-weight: 400;
    line-height: 109%;
}

.watch-text {
    color: #11C7AA;
    text-align: center;
    font-family: "League Spartan";
    font-size: 36px;
    font-style: normal;
    font-weight: 600;
    line-height: 109%;
    text-align: center;
    width: 100%;
}

.bottom-section-link-less-m {
    margin-top: 20px !important;
}

.stroke {
    background-color: #D1D3D4;
    width: 390px;
    height: 1px;
    margin: 60px auto 80px;
}

.left-circle {
    position: absolute;
    left: -80px;
    right: inherit;
    top: -40px;
}

.line-circle-section {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 100px;
    right: 0;
    row-gap: 15px;

}

.line-circle-section img {
    width: 220px;
}

.line-circle-section img:nth-child(2) {
    margin-left: auto;
    width: 180px;
}

.line-circle-section img:nth-child(3) {
    margin-left: auto;
    width: 140px;
}

.finance-hub-banner-section {
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/family-finance-text-hub-banner-without-text.png);
    background-repeat: no-repeat;
    background-size: cover;
    height: 1800px;
    margin-top: 130px;
    padding-bottom: 0 !important;
}

.finance-hub-banner-section img {
    display: none;
    width: 100%;
    height: 100%;
}

.finance-hub-banner-section h1 {
    width: 100%;
    color: #2B2B2B;
    font-size: 70px;
    font-weight: 600;
    line-height: normal;
    margin: 0;
    padding-bottom: 80px;
}

.finance-hub-banner-section h1 span {
    color: #218DEA;
}

.finance-hub-banner-section p {
    font-size: 32px;
    margin: 0;
    font-weight: 400;
    padding-bottom: 30px;
    line-height: normal;
}

/* budget family css starts from here */

.budget-family-block {
    padding: 200px 0 100px;
}

.ornament-icon {
    position: absolute;
    right: 20px;
    text-align: center;
    display: block;
    bottom: 0
}

.budget-family-block .budget-family-content-block {
    display: flex;
    flex-direction: column;
    row-gap: 35px;
    align-items: flex-start;
}

.budget-family-block .budget-family-content-block h1 {
    color: #2B2B2B;
    font-size: 64px;
    font-weight: bold;
    margin: 0;
    line-height: inherit;
}

.budget-family-block .budget-family-content-block h4 {
    font-size: 48px;
    margin: 0;
    color: #2B2B2B;
    font-weight: bold;
    line-height: inherit;
    position: relative;
    white-space: nowrap;
}

.budget-family-block .budget-family-content-block h4 span {
    position: relative;
    z-index: 1;
}

.budget-family-block .budget-family-content-block h4::before {
    content: '';
    right: -17px;
    width: 72px;
    height: 72px;
    background-color: #B9E6FE;
    border-radius: 100%;
    position: absolute;
    bottom: -32px;
}

.budget-family-block .budget-family-content-block p {
    font-size: 24px;
    color: #2B2B2B;
    margin: 0;
    line-height: 30px;
}

.budget-family-block .budget-family-content-block a {
    background: #218DEA;
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    padding: 20px 60px;
    border-radius: 10px;
}

.budget-family-block .budget-family-img-container {
    width: 100%;
}

.budget-family-block .budget-family-img-container img {
    max-width: 100%;
    width: 100%;
}

.triangle-yellow {
    position: relative;
    left: -20px
}

.zig-zag-lines {
    position: absolute;
    bottom: -10px;
    left: 0;
    right: 0;
    margin: auto;
}

@media (min-width: 768px) {
    .family-budget-essential-block.less-h2-margin {
        margin-top: -60px;
    }
}

.family-budget-essential-block {
    position: relative;
}

.family-budget-essential-block::before {
    position: absolute;
    content: '';
    left: 0;
    width: 252px;
    height: 252px;
    border: 36px solid rgba(85, 85, 85, .05);
    border-radius: 100%;
    left: -66px;
    top: 25px
}

.family-budget-essential-block .family-budget-essenttials-cards {
    background-color: #ECFDF3;
    border-radius: 32px;
    padding: 30px 20px;
    height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
    z-index: 1;
}

.family-budget-essential-block .family-budget-essenttials-cards .img-container {
    border-bottom: 1px solid #292929;
    display: flex;
    margin-bottom: 30px;
}

.family-budget-essential-block .family-budget-essenttials-cards .img-container img {
    margin: auto;
    height: 152px;
    width: 228px;
}

.family-budget-essential-block .family-budget-essenttials-cards h5 {
    font-size: 28px;
    font-weight: 500;
    color: #2B2B2B;
    margin: 0;
    padding-bottom: 14px;
    line-height: 32px;
}

.family-budget-essential-block .family-budget-essenttials-cards p {
    margin: 0;
    color: #525252;
    font-size: 24px;
    line-height: 28px;
}

.orange-text {
    color: #E56A44
}

.blue-black-text-combination {
    font-size: 53px;
    color: #2B2B2B !important;
    margin: 0;
    white-space: nowrap;
    line-height: normal;
    font-weight: 500;
    text-align: center;
    margin-bottom: 140px;

}

.blue-black-text-combination span {
    color: #218DEA;
    font-weight: bold;
}

.small-round-bottom-ellipse,
.small-round-top-ellipse {
    position: relative;
}

.small-round-bottom-ellipse::before {
    content: '';
    position: absolute;
    bottom: -20px;
    left: 0;
    width: 62px;
    height: 62px;
    background-color: #FB9A15;
    border-radius: 100%;
}

.small-round-top-ellipse::before {
    content: '';
    position: absolute;
    top: -20px;
    right: 0;
    width: 62px;
    height: 62px;
    background-color: #A7D9B4;
    border-radius: 100%;
}
.green-color-ellipse::before {
    background-color: #11C7AA;
}
.highlight-text {
    position: relative;
    z-index: 1;
}

.family-budget-simplify-block {}

.family-budget-simplify-block.less-h2-margin {
    margin-top: -100px;
}

.family-budget-simplify-block .row {
    display: flex;
    align-items: center;
    margin-bottom: 100px;
}

.family-budget-simplify-block .row:last-child {
    margin-bottom: 0;
}

.family-budget-simplify-block .family-simplify-card-content {
    display: flex;
    flex-direction: column;
}

.family-budget-simplify-block .family-simplify-card-content h4 {
    color: #2B2B2B;
    font-size: 40px;
    font-weight: 500;
    margin: 0;
    line-height: normal;
    padding-bottom: 10px;
}

.family-budget-simplify-block .family-simplify-card-content p {
    color: #525252;
    font-size: 24px;
    font-weight: 400;
    margin: 0;
    line-height: normal;
}

/* .family-budget-simplify-block .family-simplify-card-content img {
    margin-left: auto;
} */
.right-rounded-arrow {
    margin-left: auto;
    margin-top: 40px;
}

.left-rounded-arrow {
    margin-right: auto;
    margin-top: 40px;
}

/* .family-budget-simplify-block .family-simplify-card-img {}
.family-budget-simplify-block .family-simplify-card-img img {
    width: 100%;
} */
.family-budget-benefit-block {
    position: relative;
    padding-top: 10px;
}
.family-budget-benefit-block > img{
    position: absolute;
    left: 0;
    top: 0;
}
.family-budget-benefit-block .family-budget-benefit-cards {
    padding: 20px;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    position: relative;
    z-index: 1;
}

.family-budget-benefit-block .family-budget-benefit-cards h5 {
    font-size: 24px;
    line-height: 28px;
    font-weight: 500;
    color: #1C1819;
    margin: 0;
    padding-bottom: 14px;
    text-align: center;
}

.family-budget-benefit-block .family-budget-benefit-cards p {
    color: #525252;
    font-size: 20px;
    margin: 0;
    text-align: center;
}

.family-budget-benefit-block .family-budget-benefit-cards .img-container {
    width: 100px;
    height: 100px;
    border-radius: 100%;
    background-color: #ECFDF3;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 50px;
}

.family-budget-benefit-block .family-budget-benefit-cards .img-container img {
    width: 56px;
}

.extra-para {
    margin: 0;
    font-size: 32px;
    color: #525252;
    text-align: center;
    padding-top: 20px;
    padding-bottom: 120px;
}

.margin-bottom-0 {
    margin-bottom: 0;
}
.blue-full-circle {
    background-color: #8C7AFF;
    width: 44px;
    height: 44px;
    border-radius: 100%;
    position: absolute;
    left: -40px;
    top: 40px;
}
.blue-hollow-circle {
    width: 44px;
    height: 44px;
    border-radius: 100%;
    position: absolute;
    right: -40px;
    bottom: 40px;
    border: 4px solid rgba(33, 141, 234, 0.4);
}
.family-budget-explore-more {
    padding: 0 0 100px;
}
.expore-more-cards {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    z-index: 1;
}
.expore-more-cards h5 {
    margin: 0;
    font-size: 32px;
    font-weight: 500;
    color: #000;
    padding: 20px 0
}
.expore-more-cards a {
    border: 1px solid #B9E6FE;
    border-radius: 30px;
    padding: 0 25px;
    height: 41px;
    background-color: #F0F9FF;
    color: #218DEA;
    display: flex;
    align-items: center;
    justify-content: center;
}
.expore-more-cards a img {
    margin-left: 6px;
}
.family-budget-explore-more .top-left-corner::before {
    content: '';
    width: 49px;
    height: 49px;
    border-radius: 100%;
    background-color: #FF9A7A;
    position: absolute;
    left: 0px;
    top: -20px;
}
.family-budget-explore-more .bottom-right-corner::after {
    content: '';
    width: 49px;
    height: 49px;
    border-radius: 100%;
    background-color: #8C7AFF;
    position: absolute;
    right: 0px;
    bottom: 108px;
}
.family-budget-explore-more .bottom-right-corner::after {
    content: '';
    width: 49px;
    height: 49px;
    border-radius: 100%;
    background-color: #8C7AFF;
    position: absolute;
    right: 0px;
    bottom: 108px;
}
.core-features-block .bottom-right-corner::after {
    content: '';
    width: 65px;
    height: 65px;
    border-radius: 100%;
    position: absolute;
    background-color: #218DEA;
    right: -10px;
    bottom: -20px;
}
.margin-diff {
    margin-top: 40px;
}
.real-stories-block {
    padding: 0 0 100px;
    position: relative;
    margin-top: -40px;
}
.real-stories-block::before {
    content: '';
    height: 115px;
    width: 101px;
    position: absolute;
    top: -40px;
    right: 20px;
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/half-circle-vector.svg);
}
.real-stories-block::after {
    content: '';
    width: 50px;
    height: 50px;
    position: absolute;
    top: 150px;
    left: 60px;
    border-radius: 100%;
    border: 4px solid rgba(33, 141, 234, 0.4);
}
.real-stories-block ul.real-stories-small-card-conttainer {
    display: flex;
    flex-wrap: nowrap;
    margin: 0;
    list-style: none;
    column-gap: 20px;
    justify-content: flex-start;
    overflow: auto;
    width: 100%;

}

.real-stories-block ul.real-stories-small-card-conttainer::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.real-stories-block ul.real-stories-large-card-container {
    justify-content: flex-start;
    margin-top: 25px;

}
.real-stories-block ul.real-stories-small-card-conttainer li {
    border: 1px solid #ABEFC6;
    border-radius: 20px;
    background-color: #F6FEF9;
    padding: 20px;
    width: 345px;
    position: relative;
    min-width: 345px;
}
.fade-out-block{
    position: relative;
}
.fade-out-block::before {
    position: absolute;
    content: '';
    left: 0;
    top: 0;
    bottom: 0;
    width: 212px;
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/fade-out.png);
    background-size: contain;
    background-repeat: no-repeat;
    z-index: 1;
}
.fade-out-block::after {
    position: absolute;
    content: '';
    right: 0;
    top: 0;
    bottom: 0;
    width: 212px;
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/fade-out.png);
    background-size: contain;
    background-repeat: no-repeat;
    transform: rotate(180deg);
    z-index: 1;
}
.real-stories-block ul.real-stories-small-card-conttainer li > img {
    position: absolute;
    top: 10px;
    right: 10px;
}
.real-stories-block ul.real-stories-small-card-conttainer li p {
    margin: 0;
    font-size: 17px;
    font-weight: 500;
    color: #333;
}
.real-stories-block ul.real-stories-small-card-conttainer li .story-header{
    display: flex;
    align-items: center;
    column-gap: 15px;
    border-bottom: 1px solid #ABEFC6;
    padding-bottom: 20px;
    margin-bottom: 20px;
}
.real-stories-block ul.real-stories-small-card-conttainer li .story-header img {
    width: 50px;
    height: 50px;
    border-radius: 100%;
}
.real-stories-block ul.real-stories-small-card-conttainer li .story-header .story-header-content{
    display: flex;
    flex-direction: column;
}
.real-stories-block ul.real-stories-small-card-conttainer li .story-header .story-header-content h6{
    color: #1D1D1D;
    margin: 0;
    font-size: 18px;
    font-weight: 600;
}
.real-stories-block ul.real-stories-small-card-conttainer li .story-header .story-header-content .star-ratings {
    display: flex;
    column-gap: 5px;
}
.real-stories-block ul.real-stories-small-card-conttainer li .story-header .story-header-content .star-ratings i {
    font-size: 18px;
    color: #FFD029;
}
.budget-couples-block .budget-family-img-container {
    position: absolute;
    width: 50%;
    right: -100px;
    top: 150px;
}
.budget-couples-block {
    position: relative;
}
.budget-couples-block .ornament-icon {
    right: -40px !important;
}
.budget-couples-block .triangle-yellow {
    left: 50% !important;
} 
.budget-couples-block .budget-family-content-block {
    margin-top: 20px;
}
.budget-couples-block .budget-family-content-block h1 {
    line-height: normal;
}
.budget-couples-block .budget-family-content-block h1 span {
    color: #218DEA
}
.challenges-block {
    background-color: #F2F7FC;
    padding: 60px 0 120px;
}
.challenges-block h2 {
    position: relative;
}
.challenges-block h2::before {
    content: '';
    width: 45px;
    height: 45px;
    border-radius: 100%;
    border: 1px solid rgba(33, 141, 234, 0.4);
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -22.5px;
}
.challenges-block h2::after {
    content: '';
    width: 136px;
    height: 136px;
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/dollar-pot-blue.png);
    position: absolute;
    right: 0;
    top: 50%;
    margin-top:-68px;
    background-size: contain;
}
.challenge-card {
    display: flex;
    flex-direction: column;
    background-color: #fff;
    padding: 20px;
    border-radius: 22px;
    height: 100%;
    margin-top: 60px;
}
.challenge-card h5 {
    font-size: 28px;
    font-weight: 500;
    color: #2B2B2B;
    margin: 0;
    padding-bottom: 14px;
    line-height: 32px;
}
.challenge-card p {
    margin: 0;
    color: #525252;
    font-size: 24px;
    line-height: 28px;
    padding-bottom: 20px;
}
.challenge-card img {
    margin-left: auto;
    margin-top: auto;
}
.real-benefitts-block {
    background-color: #F2F7FC;
    margin: 0px 0 50px;
    padding: 60px 0 100px;
    position: relative;
}
.real-benefitts-block::after {
    width: 412px;
    content: '';
    position: absolute;
    height: 412px;
    border-radius: 50%;
    top: -162px;
    right:-150px;
    border: 66px solid rgba(33, 141, 234, 0.04);
}
.real-benefitts-block h2 {
   position: relative;
}
.real-benefitts-block h2::before {
    content: '';
    position: absolute;
    width: 136px;
    height: 136px;
    left: 0;
    top: 50%;
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/circle-arrow-hit.svg);
    background-size: contain;
 }
 .real-benefit-card {
    padding: 20px;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
 }
 .real-benefit-card h5 {
    margin: 0;
    font-size: 24px;
    line-height: normal;
    font-weight: 500;
    color: #1C1819;
 }
 .real-benefit-card img {
    width: 56px;
    margin-bottom: 20px;
 }
 .real-benefit-card span {
    color: #525252;
    font-size: 20px;
    padding-top: 10px;
    font-weight: 400;
 }
 .remove-circles::after, .remove-circles::before {
    display: none;
 }
 .remove-circles ul li {
    background-color: #F8FAFC !important;
    border-color: #B9E6FE !important
 }
 .remove-circles ul li .story-header {
    border-bottom-color: #B9E6FE !important
 }
 .budget-matter-block {
    padding-top: 40px !important;
 }
 .budget-matter-block .blue-black-text-combination {
    margin-bottom: 100px;
 }
 .budget-matter-block::before {
    left: inherit !important;
    right: -75px !important;
    top: -150px !important;
 }
 .budget-matter-block .family-budget-essenttials-cards {
    background-color: #FEF9F0;
 }
 .key-benefit-cards {
    padding: 20px;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    position: relative;
    z-index: 1;
 }
 .key-benefit-cards .img-container{
    width: 100px;
    height: 100px;
    border-radius: 100%;
    background-color: #FEF9F0;
    display: flex;
    justify-content: center;
    align-items: center;
 }
 .key-benefit-cards .img-container img{
     width: 56px;
     height: 56px;
 }
 .key-benefit-cards h5{
    color: #1C1819;
    font-size: 24px;
    font-weight: 500;
    line-height: 28px;
    text-align: center;
    margin: 0;
    padding: 30px 0 10px;
 }
 .key-benefit-cards p {
    margin: 0;
    font-size: 20px;
    font-weight: 400;
    color: #525252;
    line-height: normal;
    text-align: center;
 }
 .key-benefits-block .top-left-corner::before {
    content: '';
    width: 49px;
    height: 49px;
    border-radius: 100%;
    background-color: #8C7AFF;
    position: absolute;
    left: 0px;
    top: -20px;
}
.key-benefits-block .bottom-right-square::before {
    right: -20px;
    content: '';
    width: 146px;
    height: 146px;
    border-radius: 19px;
    transform: rotate(45deg);
    position: absolute;
    bottom: -40px;
    background-color: #F6DA6F;
}
.key-benefits-block {
    padding: 0 0 160px;
    position: relative;
}
.key-benefits-block::before {
    content: '';
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/solo-benefit-ellipse.svg);
    background-size: contain;
    width: 331px;
    height: 331px;
    right: -40px;
    top: -35px;
    position: absolute;
    background-repeat: no-repeat;
}
.how-use-money-story ul li {
    background-color: #FEFBF5 !important;
    border-color: #F8D38F !important;
}
.how-use-money-story ul li .story-header {
    border-bottom-color: #F8D38F !important;
}
.individuals-budget-block .container::before {
    content: '';
    height: 115px;
    width: 101px;
    position: absolute;
    top: 10px;
    left: 20px;
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/half-circle-vector.svg);
    background-size: contain;
    background-repeat: no-repeat;
}
.individuals-budget-block {
    position: relative;
    overflow: hidden;
    margin-top: -40px;
}
.individuals-budget-block .row {
    margin-bottom: 40px;
}
.individuals-budget-block::after {
    content: '';
    position: absolute;
    bottom: -100px;
    left: -100px;
    width: 243px;
    height: 243px;
    border-radius: 100%;
    background-color: #A7D9B4;
}
.individuals-budget-block .container::after {
    content: '';
    height: 94px;
    width: 94px;
    position: absolute;
    top: 50px;
    right: 20px;
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/half-moon.svg);
    background-size: contain;
    background-repeat: no-repeat;
}
.acheive-block {
    background-color: #EBF5FF;
    padding: 60px 0 120px;
    position: relative;
}
.adapt-for-you-bloock {
    background-color: #fff;
    padding: 60px 0 120px;
    position: relative;
}
.adapt-for-you-bloock .row {
    margin-top: 100px;
}
.adapt-for-you-bloock .expore-more-cards .img-container {
    position: relative;
}
.adapt-for-you-bloock .expore-more-cards .img-bottom-circle.img-container img {
    position: relative;
    z-index: 1;
}
.adapt-for-you-bloock .expore-more-cards h5 {
    font-size: 24px;
}
.adapt-for-you-bloock .expore-more-cards .img-bottom-circle.img-container::before {
    content: '';
    width: 49px;
    height: 49px;
    border-radius: 100%;
    background-color: #8C7AFF;
    position: absolute;
    right: -20px;
    bottom: -20px;
}
.acheive-block::before {
    content: '';
    width: 212px;
    height: 212px;
    opacity: 10%;
    border: 16px solid #218DEA;
    position: absolute;
    right: -100px;
    top: 40px;
    border-radius: 100%;
}
.acheive-block::after {
    content: '';
    width: 22px;
    height: 22px;
    position: absolute;
    right: 50px;
    bottom: 100px;
    border-radius: 100%;
    background-color: #F3A268;
} 
.acheive-block .row {
    display: flex;
    flex-wrap: wrap;
    row-gap: 30px;
    margin-top: 100px;
}
.blue-horizontal-tag {
    background-color: #218DEA;
    color: #fff;
    border-radius: 60px;
    padding: 10px 30px;
    white-space: nowrap;
    text-align: center;
    font-size: 24px;
    margin-top: 20px;
    display: inline-block;
}
.acheiver-card {
    padding: 20px;
    border-radius: 22px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    background-color: #fff;
    height: 100%;
}
.acheiver-card h5 {
    color: #000000;
    font-size: 24px;
    font-weight: 600;
    margin: 0;
    line-height: normal;
    padding: 25px 0 10px;
}
.acheiver-card img {
    width: 75px;
}
.acheiver-card p {
    margin: 0;
    font-size: 16px;
    color: #000;
    font-weight: 400;
    line-height: normal;
}
.green-horizontal-tag {
    background-color: #11C7AA;
}
.core-features-block {
    position: relative;
}
.core-features-block::before {
    content: '';
    width: 212px;
    height: 212px;
    border-radius: 100%;
    border: 16px solid #218DEA;
    opacity: 10%;
    position: absolute;
    left: -22px;
    top:0;
}
.core-features-block::after {
    content: '';
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/ornament-with-ellipse.png);
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    right: 30px;
    top: 100px;
    width: 300px;
    height: 150px;
}
.core-features-block .row {
    display: flex;
    flex-wrap: wrap;
    row-gap: 30px;
    margin-top: 100px;
}
.core-features-block .core-feature-card {
    height: 100%;
    display: flex;
    flex-direction: column;
    row-gap: 20px;
    background-color: #F0FFEB;
    padding: 30px 20px 30px;
    border-radius: 22px;
    align-items: center;
    position: relative;
    z-index: 1;
}
.core-features-block .core-feature-card h5 {
    margin: 0;
    font-size: 32px;
    font-weight: 600;
    color: #000;
    line-height: inherit;
}
.core-features-block .core-feature-card span {
    font-size: 24px;
    font-weight: 400;
    color: #000;
}
.core-features-block .core-feature-card img {
    max-width: 100%;
}
.pros-cons-block {
    padding: 0 0 120px;
    position: relative;
}
.pros-cons-block .row {
    margin-top: 100px;
}
.pros-cons-list-block {
    height: 100%
}
.pros-cons-block .pros-cons-list-block ul {
    list-style: none;
    margin: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.pros-cons-block .pros-cons-list-block .all-blue-text li span {
    color: #218DEA;
}
.pros-cons-block .pros-cons-list-block ul li {
    min-height: 53px;
    border-bottom: 1px solid #BDBDBD;
    margin-bottom: 20px;
    flex: 1

}
.pros-cons-block .pros-cons-list-block ul li:first-child span {
    font-weight: bold;
}
.pros-cons-block .pros-cons-list-block ul li span {
    font-size: 24px;
    display: flex;
    align-items: flex-start;
    color: #000;
}
.pros-cons-block .pros-cons-list-block ul li span img{
    height: 22px;
    margin-right: 5px;
    position: relative;
    top: 0;
}
.pros-cons-block::before {
    content: '';
    width: 212px;
    height: 212px;
    right: -106px;
    position: absolute;
    top: 0px;
    border: 16px solid #218DEA;
    opacity: 10%;
    border-radius: 100%;
}
.smarter-budget-block {
    height: 690px;
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/budget-banner-hand-mobile.svg);
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: 100px;
}


.smarter-budget-block  .triangle-yellow {
    top: -60px !important;
    left: 80% !important
}
.featuring-couples {
    position: relative;
    padding: 50px 0 100px;
}
.featuring-couples .blue-black-text-combination {
    margin-bottom: 80px !important;
}
.featuring-couples::after {
    content: '';
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/three-semi-circle.png);
    background-size: contain;
    width: 330px;
    height: 330px;
    position: absolute;
    bottom: -60px;
    left: 0;
    background-repeat: no-repeat;
}
.featuring-couples::before {
    content: '';
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/three-semi-circle.png);
    background-size: contain;
    width: 330px;
    height: 330px;
    position: absolute;
    top: -60px;
    right: 0;
    background-repeat: no-repeat;
    transform: rotate(180deg);
}
.budget-real-life-section {
    position: relative;
}
.budget-real-life-section::before {
    content: '';
    position: absolute;
    top: -86px;
    left: -150px;
    border: 66px solid #ECF6FD;
    width: 412px;
    height: 412px;
    border-radius: 100%;

}
.budget-couple-bottom-image::before {
    content: '';
    position: absolute;
    bottom: -86px;
    left: -150px;
    border: 66px solid #ECF6FD;
    width: 412px;
    height: 412px;
    border-radius: 100%;

}

.ai-brain-main-banner {
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/radial-gradient-all-banners.svg);
    padding-top: 200px !important;
    background-size: cover;
    position: relative;
}
.money-manager-bannerr-ai.ai-brain-main-banner {
    background-image: none;
    position: relative;
}
.phone-hand-ai-image ul {
    list-style: none;
    padding: 0;
    margin: 60px 0 60px;
    display: flex;
    justify-content: space-between;
}
.phone-hand-ai-image ul li {
    display: flex;
    flex-direction: column;
    width: 25%;
    row-gap: 18px;
    padding: 0 25px;
}
.phone-hand-ai-image ul li h4 {
    color: #072B4A;
    font-size: 48px;
    font-weight: 500;
    margin: 0;
    text-align: center;
}
.phone-hand-ai-image ul li p {
    color: #7C8A93;
    font-size: 24px;
    font-weight: 400;
    margin:0;
    text-align: center;
    line-height: 40px;
}
.phone-hand-ai-image .container {
    padding: 0;
}
.phone-hand-ai-image ul li.vertical-gradient-lines {
    width: auto;
    padding: 0;
}
.phone-hand-ai-image ul li.vertical-gradient-lines img {
    height: 145px;
}
.ai-brain-main-banner .ai-brain-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}
.phone-hand-ai-image {
    padding: 0 !important;
    margin-top: -140px !important;
}
.phone-hand-ai-image img {
    max-width: 80%;
    margin: auto;
    display: block;
}
.ai-brain-main-banner .ai-brain-container .fancy-ai-tag {
    border: 1px solid #E2F2FE;
    width: 296px;
    height: 42px;
    border-radius: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    margin-bottom: 56px;
    box-shadow: 0px 4px 12.6px 0px #00000014;
}
.ai-brain-main-banner .ai-brain-container .fancy-ai-tag span{
    font-size: 20px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(to left, #11C7AA, #0D8CEE);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    column-gap: 10px;
}
.ai-brain-main-banner .ai-brain-container .fancy-ai-tag .dots {
    width: 6px;
    height: 6px;
    background: #0D8CEE;
    border-radius: 100%;
}
.ai-brain-main-banner .ai-brain-container h1,
.ai-brain-main-banner .ai-brain-container h2 {
    font-size: 64px;
    color: #072B4A;
    font-weight: 600;
    margin: 0 auto;
    width: 900px;
    text-align: center;
    padding-bottom: 15px;
    z-index: 1;
    position: relative;
}
.ai-brain-main-banner .ai-brain-container > img {
    position: absolute;
    top: 40px;
    right: 160px;
}
.ai-brain-main-banner .ai-brain-container .app-sent-buttons {
    display: flex;
    justify-content: center;
}
.ai-brain-main-banner .ai-brain-container .app-sent-buttons a {}
.ai-brain-main-banner .ai-brain-container .app-sent-buttons a img {
    position: static;
}
.ai-brain-main-banner .ai-brain-container .tunes-icon img {
    position: static;
}
.ai-brain-main-banner .ai-brain-container .tunes-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 10px;
    margin-top: 20px;
    border: 0;
    padding: 0;
    background-color: transparent;
}
.ai-brain-main-banner .ai-brain-container .tunes-icon span {
    background: linear-gradient(to left, #11C7AA, #0D8CEE);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 20px;
    font-weight: 500;
}
.ai-brain-main-banner .ai-brain-container h1 span,
.ai-brain-main-banner .ai-brain-container h2 span {
    color: #0D8CEE;
}
.ai-brain-main-banner > img {
    position: absolute;
    bottom: 80px;
    left: -80px;
}
.ai-brain-main-banner .ai-brain-container p {
    color: #7C8A93;
    font-size: 28px;
    font-weight: 500;
    margin:0;
    max-width: 900px;
    text-align: center;
    line-height: 36px;
    padding-bottom: 45px;
    position: relative;
    z-index: 1;
}
.ai-brain-main-banner .ai-brain-container div {
    position: relative;
}
.ai-brain-main-banner .ai-brain-container > div img {
    position: absolute;
    right: -40px;
    top: -40px;
}
.ai-brain-main-banner .ai-brain-container p span {
    color: #373F44;
}
.ai-brain-main-banner .ai-brain-container > a {
    border: 2px solid #2196F3;
    border-radius: 4px;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #2196F3;
    font-size: 20px;
    font-weight: 600;
    padding: 13px 28px;
}
.ai-brain-main-banner .ai-brain-container a:hover, .ai-brain-main-banner .ai-brain-container a:focus {
    color: #2196F3;
}

.w-shape-icon {
    position: absolute;
    left: -80px;
    top: 0;

}
.ai-assitant-block {
    background: linear-gradient(to bottom, #2196F3, #13578D);
    padding: 40px 20px !important;
}
.ai-assitant-block ul {
    display: flex;
    margin: 0;
    padding: 0;
    justify-content: center;
}
.ai-assitant-block ul li {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff;
    width: 28%;
}
.ai-assitant-block ul li img {
    margin-bottom: 15px;
}
.ai-assitant-block ul li h4 {
    text-align: center;
    margin: 0;
    font-size: 36px;
    font-weight: 500;
    padding-bottom: 5px;
}
.ai-assitant-block ul li p {
    text-align: center;
    margin: 0;
    font-size: 20px;
    font-weight: 400;
    color: #fff;
    opacity: 80%;
}
.ai-assitant-block ul li.vertical-lines {
    width: auto;
}
.ai-assitant-block ul li.vertical-lines img {
    margin: auto;
}
.financial-assistant-block {
    padding: 40px 0 !important;
}
.financial-assistant-block .financial-assistant-img-container {
    display: flex;
    flex-direction: column;
    position: relative;
    margin-top: -32px;
}
.financial-assistant-block .financial-assistant-img-container .ai-frame-box-img {
    width: 100%;
    height: 355px;
    position: absolute;
}
.financial-assistant-block .financial-assistant-img-container .ai-chatbot-img {
    position: relative;
    width: 100%;
    padding: 50px 20px;
}
.financial-assistant-content-box {
    padding-left: 30px;

}
.financial-assistant-content-box .ai-chat-tag {
    background-color: #EFFFFC;
    color: #11C7AA;
    font-size: 18px;
    font-weight: 500;
    height: 44px;
    width: 110px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    margin-bottom: 15px;
}
.financial-assistant-content-box h2 {
    color: #072B4A;
    font-size: 48px;
    font-weight: 600;
    margin: 0;
    padding-bottom: 24px;
}
.financial-assistant-content-box h2 span {
    background: linear-gradient(to left, #11C7AA, #0D8CEE);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.financial-assistant-content-box p {
    color: #7C8A93;
    font-size: 28px;
    font-weight: 400;
    margin:0;
    line-height: 36px;
    padding-bottom: 24px;
}
.financial-assistant-content-box ul {
    list-style: none;
    padding: 0;
    display: flex;
    flex-direction: column;
    row-gap: 15px;
    margin: 0;
}
.financial-assistant-content-box ul li {
    display: flex;
    align-items: flex-start;
    column-gap: 15px;
}
.financial-assistant-content-box ul li img {
    width: 28px;
    height: 28px;
    min-width: 28px;
}
.financial-assistant-content-box ul li span {
    font-size: 22px;
    font-weight: 400;
    color: #072B4A;
    position: relative;
    top: 3px
}
.core-ai-features-section {
    padding: 60px 0 !important
}
.core-ai-features-section .core-ai-features-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-bottom: 100px;
}
.core-ai-features-section .core-ai-features-header .ai-chat-tag{
    background-color: #EFFFFC;
    color: #11C7AA;
    font-size: 18px;
    font-weight: 500;
    height: 44px;
    width: 174px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    margin-bottom: 15px;
}
.core-ai-features-section .core-ai-features-header h2{
    font-size: 48px;
    font-weight: 500;
    color: #072B4A;
    margin: 0;
    text-align: center;
    padding-bottom: 15px;
}
.core-ai-features-section .core-ai-features-header h2 span{
    background: linear-gradient(to left, #11C7AA, #0D8CEE);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.core-ai-features-section .core-ai-features-header p {
    font-size: 28px;
    font-weight: 400;
    color: #7C8A93;
    margin: 0 auto;
    text-align: center;
    max-width: 740px;
    line-height: 36px;

}
.core-ai-features-section .core-ai-features-header img {
    position: absolute;
    left: -40px;
    top: 70px;
}

.core-ai-features-card {
    display: flex;
    height: 100%;
    flex-direction: column;
    border: 1px solid #D5ECFD;
    box-shadow: 0px 0px 10.2px 0px rgba(0, 0, 0, 0.15);
    background-color: #fff; 
    padding: 17px 22px;
    row-gap: 20px;
    border-radius: 20px;
    align-items: flex-start;
}
.core-ai-features-card img {
    width: 39px;
    height: 39px;
}
.core-ai-features-card h4 {
    font-size: 28px;
    font-weight: 500;
    color: #072B4A;
    margin: 0;
}
.core-ai-features-card p {
    font-size: 20px;
    font-weight: 400;
    color: #7C8A93;
    margin: 0;
    line-height: 26px;
}
.core-ai-features-card a {
    margin-top: auto;
    height: 42px;
    font-size: 16px;
    color: #0D8CEE;
    font-weight: 500;
    background-color: #EFF9FF;
    padding: 0 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 48px;
}
.core-ai-feature-container {
    row-gap: 30px;
}
.predective-alert-section {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.predective-alert-section .ai-chat-tag {
   border-radius: 48px;
   background-color: #ECF6FE;
   height: 44px;
   padding: 0 20px;
   color: #2196F3;
   font-size: 20px;
   font-weight: 500;
   margin-bottom: 12px;
   display: flex;
   align-items: center;
   justify-content: center;
}
.predective-alert-section h4 {
    margin: 0;
    font-size: 40px;
    font-weight: 500;
    padding-bottom: 20px;
}
.predective-alert-section ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    row-gap: 22px;
}
.predective-alert-section ul li {
    display: flex;
    align-items: flex-start;
    column-gap: 20px;
    padding: 17px 22px;
    border: 1px solid #EAEAEB;
    border-radius: 30px;
    box-shadow: 0px 4px 10.2px 0px #00000014;
}
.predective-alert-section ul li img {
    width: 40px;
    position: relative;
    top: 10px;
}
.predective-alert-section ul li .predective-content-box {
    display: flex;
    flex-direction: column;
    row-gap: 6px;
}
.predective-alert-section ul li .predective-content-box h5 {
    margin: 0;
    font-size: 24px;
    color: #072B4A;
    font-weight: 500;
}
.predective-alert-section ul li .predective-content-box p {
    margin: 0;
    font-size: 16px;
    color: #7C8A93;
    font-weight: 400;
}
.predective-alert-section ul li .predective-content-box span {
    background-color: #FDF7E7;
    font-size: 16px;
    font-weight: 500;
    width: 130px;
    border-radius: 48px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
}
.predective-alert-section ul li .predective-content-box span.cash-tip-bg {
    color: #2ACDA4;
    background-color: #EFFFFB ;
}
.predective-alert-section ul li .predective-content-box span.auto-detected-bg {
    background-color: #EFF8FF;
    color: #228BE6;
}
.money-smarter-section {
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/radial-gradient-all-banners.svg);
    padding: 80px 0 0 !important;
    background-size: cover;
    position: relative;
}
.money-smarter-section .money-smarter-left-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    row-gap: 10px;
}
.money-smarter-section .money-smarter-left-content h2 {
    font-size: 48px;
    font-weight: 500;
    color: #072B4A;
    margin: 0;
    position: relative;
}
.money-smarter-section .money-smarter-left-content h2 img {
    position: absolute;
    right: -120px;
    top: -25px
}
.money-smarter-section .money-smarter-left-content h2 span {
    color: #2196F3;
    font-weight: 600;
    font-style: italic;
}
.money-smarter-section .money-smarter-left-content p {
    color: #7C8A93;
    font-size: 28px;
    font-weight: 400;
    margin: 0;
    line-height: 36px;
}
.money-smarter-section .money-smarter-left-content .app-sent-buttons {
    margin-left: -15px;
}
.money-smarter-section .money-smarter-left-content .app-sent-buttons a {}
.money-smarter-section .money-smarter-left-content .app-sent-buttons a img {}
.money-smarter-right {
   display: flex;
   justify-content: flex-end;
   position: relative;
}
.money-smarter-right img {
    position: relative;
    z-index: 1;
    right: 50px
}
.money-smarter-right img.footer-ball {
    position: absolute;
    top: -50px;
    right: 0;
    z-index: inherit;
}
.money-smarter-section > img {
    position: absolute;
    top: 0;
    left: 0;
    width: 140px;
}

.what-we-offer-block {
    padding: 20px 0 80px !important;
}
.what-we-offer-block .what-we-offer-heading{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.what-we-offer-block .what-we-offer-heading .left-offer-dollar-img {
    position: absolute;
    top: -55px;
    right: -110px;
}
.what-we-offer-block .what-we-offer-heading .right-offer-dollar-img {
    position: absolute;
    bottom: -60px;
    left: -55px;
    transform: rotate(75deg);
    width: 70px;
}
.what-we-offer-block .what-we-offer-heading .what-we-offer-tag {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 27px auto;
    font-size: 28px;
    font-style: italic;
    color: #0D8CEE;
    font-weight: 600;
    position: relative;
    letter-spacing: 1.5px;
}

.what-we-offer-block .what-we-offer-heading .what-we-offer-tag::before,
.what-we-offer-block .what-we-offer-heading .what-we-offer-tag::after {
    content: "";
    position: absolute;
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230D8CEE'%3E%3Cpath d='M12 0C12 6.627 17.373 12 24 12C17.373 12 12 17.373 12 24C12 17.373 6.627 12 0 12C6.627 12 12 6.627 12 0Z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}

.what-we-offer-block .what-we-offer-heading .what-we-offer-tag::before {
    top: -8px;
    right: -28px;
}

.what-we-offer-block .what-we-offer-heading .what-we-offer-tag::after {
    bottom: -8px;
    left: -28px;
}
.what-we-offer-block .what-we-offer-heading h2{
    font-size: 48px;
    font-weight: 500;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
}
.what-we-offer-block .what-we-offer-heading p {
    color: #7C8A93;
    font-size: 28px;
    font-weight: 400;
    margin: 0 auto;
    line-height: 36px;
    text-align: center;
    max-width: 840px;
}
.what-we-offer-block .what-we-offer-heading h2 span {
    font-weight: 600;
    font-style: italic;
    color: #2196F3;
}
.what-we-offer-block .what-we-offer-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    row-gap: 25px;

}
.what-we-offer-block .what-we-offer-content .chip-tag{
   background-color: #EFFFFC;
   padding: 8px 24px;
   border-radius: 48px;
   display: flex;
   color: #11C7AA;
   font-size: 20px;
   font-weight: 500;
}
.what-we-offer-block .what-we-offer-content .chip-tag.blue-chip-tag {
    color: #0D8CEE;
    background-color: #EFF9FF;
}
.what-we-offer-block .what-we-offer-content h4 {
    color: #072B4A;
    font-weight: 500;
    font-size: 40px;
    margin: 0;
}

.what-we-offer-block .what-we-offer-content p {
    font-size: 28px;
    font-weight: 400;
    color: #7C8A93;
    margin: 0;
    line-height: 36px;
}

.what-we-offer-block .what-we-offer-content .tunes-icon {
    display: flex;
    align-items: center;
    column-gap: 10px;
    margin-top: 20px;
}
.what-we-offer-block .what-we-offer-content .tunes-icon span{
    background: linear-gradient(to left, #11C7AA, #0D8CEE);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 20px;
    font-weight: 500;
}
.what-we-offer-card {
    margin-top: 60px;
    align-items: center;
}
.what-we-offer-block .what-we-offer-image-container {

}
.what-we-offer-block .what-we-offer-image-container img{
  width: 100%;
}

.financial-life-row {
    margin-bottom: 30px;
}
.financial-life-row .financial-life-cards {
    height: 100%;
    border: 1px solid #D5ECFD;
    /* box-shadow: 0 0 10.2px 0 #00000026; */
    border-radius: 30px;
    overflow: hidden;
    padding: 17px 22px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.financial-life-row .financial-life-cards img {
    width: 40px;
    height: 40px;
}
.financial-life-row .financial-life-cards h4 {
    color: #072B4A;
    font-size: 28px;
    font-weight: 500;
    margin: 0;
    padding: 13px 0;
    line-height: 32px;
}
.financial-life-row .financial-life-cards p {
    font-size: 20px;
    color: #7C8A93;
    font-weight: 400;
    margin: 0;
    line-height: 32px;
}
.first-life-row {
    margin-top: 100px !important;
}

.financial-life-row .financial-life-cards .new-tag {
   position: absolute;
   right: 30px;
   top: -15px;
   background-color: #EFFFFC;
   border: 1px solid #C2F5ED;
   border-radius: 48px;
   width: 82px;
   height: 34px;
   display: flex;
   justify-content: center;
   align-items: center;
   color: #11C7AA;
   font-size: 20px;
   font-weight: 500;
}
.trusted-millions-sectioon {
    padding: 0 !important;
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/trusted-millions-image.png);
    background-size: cover;
    height: 450px;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 450px;
}
.money-banner-bottom-ai {
    padding: 60px 0 !important;
}
.gradient-text {
    background: linear-gradient(to left, #11C7AA, #0D8CEE);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display:  block;
}
.no-ai-tag {
    width: auto !important;
    padding: 0 20px;
    margin-bottom: 20px !important;
}
.no-ai-tag span {
    background: none !important;
    -webkit-background-clip: unset !important;
    -webkit-text-fill-color: unset !important;
    color: #0D8CEE;
}
.money-banner-bottom-ai > img {
    position: absolute;
    right: 50px;
    top: 50%;
    left: inherit;
    width: 200px;
    bottom: inherit;
    margin-top: -86px;
}
.money-banner-bottom-ai h1 img {
    position: absolute;
    top: -20px;
    right: -20px;
    width: 90px;
}
.money-banner-bottom-ai .ai-brain-container > img {
    position: absolute;
    bottom: 0;
    left: 0px;
    top: inherit;
    right: inherit;
    transform: rotate(80deg);
    width: 130px;
}
.new-testimonials-section {
    padding: 75px 0 !important;
}
.new-testimonials-section .blue-black-text-combination {
    margin-bottom: 70px !important; 
    color: #072B4A !important;
    font-size: 48px !important;
}
.testimonials-carousel-wrapper {
    display: flex;
    align-items: center;
    gap: 12px;
}
.testimonials-carousel-wrapper .fade-out-block { flex: 1; min-width: 0; }
.testimonial-arrow {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: none;
    background: #fff;
    box-shadow: 0px 4px 16px rgba(0,0,0,0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #072B4A;
    font-size: 16px;
    transition: background 0.2s, color 0.2s;
    z-index: 2;
}
.testimonial-arrow:hover {
    background: #0D8CEE;
    color: #fff;
}
.testimonial-arrow:disabled {
    opacity: 0.3;
    cursor: default;
    pointer-events: none;
}
.money-manager-bannerr-ai .ai-banner-gradient {
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/radial-gradient-all-banners.svg);
    position: absolute;
    top: 0;
    width: 100%;
    height: 500px;
}
/* budget family css ends here */

@media (max-width: 991px) {
    .finance-hub-banner-section {
        margin-top: 0 !important;
        background: none;
        padding: 0 !important;
        height: auto;
    }

    .creatte-budget-5-steps-section .steps-img-container img {
        width: 100%;
    }

    .smart-budgeting-hack-section .main-heading {
        padding: 0 20px;
    }

    .tilt-mobile.bill-img-bottom {
        top: 20px !important;
        position: relative;
    }

    .start-section {
        background-size: cover;
    }

    .budget-footer-dollar-img {
        right: 0 !important;
    }

    .budgeting-fitfalls-section .budgeting-fitfal-img-container {
        margin-bottom: 20px;
    }

    .budgeting-container {
        width: 100%;
        padding: 0 10px;
        position: relative;
        z-index: 1;
    }

    .smart-budgeting-hack-section .smart-cards-container {
        width: 100%;
        display: flex;
        margin: 70px auto 0;
        padding: 0 20px;
    }

    .balance-life-budget-section .balance-life-left {
        margin-bottom: 10px;
    }

    .learn-smart-section .home-managing-img-container img {
        top: 20px;
        position: relative;
    }

    .dollar-icon {
        margin-left: -360px;
    }

    .learn-smart-section .managing-bill-text-container p {
        text-align: center;
    }

    .premium-cards {
        padding: 20px 10px;
        justify-content: space-between;
        gap: 20px;
    }

    .premium-cards h5 {
        font-size: 30px;
    }

    .premium-cards span {
        font-size: 24px;
    }

    .steps-vertical-container>img.triangle-wave-icon {
        width: 50px;
    }

    .family-stress-content {
        padding-right: 15px;
        padding-bottom: 5px;
    }

    .why-family-important ul {
        padding-right: 2%;
    }

    .finance-hub-banner-section .container {
        display: none;
    }

    .finance-hub-banner-section img {
        display: block;
    }

    .money-tip-header {
        margin-top: 0;
        height: 200px;
    }

    .money-tip-slider-section .slick-slide {
        flex-wrap: wrap;
    }

    .content-conatiner .content-container-left {
        width: 100%;
        height: 250px;
        margin-bottom: 20px;
    }

    .money-tip-tab-section .tabs-container ul {
        gap: 12px;
        justify-content: center;
    }

    .content-conatiner .content-container-left img {
        height: 100%;
    }

    .design-main-subheading {
        font-size: 24px;
    }

    .mobile-img-first-section .mobile-right-container {
        margin-top: 40px;
    }

    .family-budget-right-block img.top-img {
        height: auto;
        position: absolute;
        top: -20px;
        width: 200px;
        left: -110px;
    }

    .family-budget-right-block img.bottom-img {
        height: 190px;
        position: absolute;
        bottom: -80px;
        width: 340px;
        left: -150px;
        max-width: fit-content;
    }

    .color-boxes-container .col-md-6 {
        flex-basis: inherit;
        max-width: 100%;
    }

    .your-class .branding-bg {
        width: 48%;
        margin-right: 0;
    }

    .family-budget-section {
        padding-top: 0px !important;
        margin-top: 0;
    }

    .family-budget-section.main-family-budget-section {
        padding-top: 0px !important;
    }

    .family-budget-heading-block h2 {
        font-size: 36px;
        margin-bottom: 12px;
        text-align: center;
    }

    .family-budget-heading-block>span,
    .family-budget-heading-block>p {
        font-size: 16px;
        margin-bottom: 10px;
        text-align: center;
    }

    .family-budget-right-block {
        width: 100%;
        margin: 40px auto 0;
        position: relative;
        margin-left: 0;
        top: 1px;
    }

    .money-manage-section .money-manage-right-block h2 {
        font-size: 36px;
        width: 100%;
    }

    .money-manage-section .money-manage-right-block p {
        font-size: 16px;
    }

    .money-manage-section .padding-70px-top {
        padding-top: 10px;
    }

    .your-class .slick-arrow {
        display: none !important;
    }

    .connect-form {
        padding: 20px;
        margin-top: 20px;
    }

    .sky-blue-container h3 {
        font-size: 36px;
    }

    .sky-blue-container {
        height: auto;
    }

    .sky-blue-container a {
        width: auto;
    }

    .tab-mobile-container {
        margin-top: 50px;
    }

    .quick-glance-app-section {
        padding-top: 60px !important
    }

    .accordion-style-03 .panel .panel-heading i {
        top: 27px;
    }

    .accordion-budgeting.accordion-style-03 .panel .panel-heading i {
        right: 6px;
    }

    .accordion-style-03 .panel .panel-heading {
        padding: 15px 20px 15px 20px;
    }

    .family-budget-heading-block {
        display: flex;
        flex-direction: column;
    }

    .family-budget-heading-block a {
        width: 230px;
        margin: 30px auto 0;
    }

    .managing-bill-section {
        margin-top: 0;
        padding: 20px 10px !important
    }

    .managing-bill-text-container h2,
    .managing-bill-text-container h1 {
        font-size: 30px;
        line-height: normal;
        letter-spacing: normal;
        text-align: center;
    }

    .managing-bill-text-container p {
        font-size: 16px;
    }

    .managing-bill-text-container p span {
        font-size: 16px;
    }

    .managing-bill-text-container .photo-frame h4 {
        font-size: 16px;
    }

    .managing-bill-img-container {
        margin-top: 30px;
    }

    .managing-bill-img-container img {
        display: block;
        margin: auto;
        position: static;
    }

    .rating-boxes-section {
        margin-top: 20px;
    }

    .rating-boxes-section .rating-boxes-card {
        margin-bottom: 50px;
    }

    .features-section {
        padding: 55px 0 !important;
    }

    .mobile-img-first-section .mobile-left-container img {
        margin-left: 0;
    }

    .mobile-img-first-section .mobile-right-container img {
        margin-right: 0;
    }

    .features-section>h1 {
        font-size: 36px;
        margin-bottom: 60px;
    }

    .text-container h2 {
        font-size: 30px;
        line-height: normal;
    }

    .mobile-img-first-section {
        margin-bottom: 60px;

    }

    .mobile-img-first-section:nth-child(even) {
        flex-direction: column-reverse;
    }

    .join-us-section h4 {
        font-size: 30px;
        line-height: 40px;
    }

    .benefit-section .main-heading h2 {
        font-size: 32px;
    }

    .benefit-section .main-heading span {
        font-size: 30px;
    }

    .testimonial-section h4 {
        font-size: 36px;
    }

    .download-white-box h4 {
        font-size: 30px;
        line-height: normal;
    }

    .text-container p {
        font-size: 24px;
    }

    .rating-boxes-section h6 {
        font-size: 42px;
        line-height: normal;
    }

    .features-section .new-text-container h3 {
        font-size: 30px;
        line-height: normal;
    }
}

@media (min-width: 768px) {
    .mobile-img-first-section:nth-child(even) {
        flex-direction: row !important;
    }

    .connect-form {
        padding: 20px !important
    }
}


.breadcrumbs-container {
    margin-top: 30px;
    padding-bottom: 60px;
}

.breadcrumbs-container ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    column-gap: 20px;
}

.breadcrumbs-container ul li a {
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    color: #007ED3;
}

.breadcrumbs-container ul li span {
    color: #404345;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.budget-img-container {
    margin-top: 50px;
}

.budget-img-container img {
    width: 100%;
    max-width: 400px;
}

.budget-img-container {
    background-color: #CCEBF8;
    padding: 50px;
}

.budget-container-main-heading h2 {
    color: #2B2B2B;
    font-size: 48px;
    font-style: normal;
    font-weight: 700;
    line-height: 44.2px;
    margin: 0;
    margin-top: 20px;
}

.table-of-content-container {
    position: relative;
    padding: 30px 0 !important;
}

.table-of-content-container .table-of-content {
    display: flex;
    flex-direction: column;
}

.table-of-content-container .table-of-content h4 {
    color: #111;
    font-size: 22px;
    font-style: normal;
    font-weight: 500;
    line-height: 33px;
    letter-spacing: 0.05px;
    margin: 0;
    margin-bottom: 8px;
}

.table-of-content-container .table-of-content ul {
    padding: 0;
    margin: 0;
    list-style: none;
    padding-left: 20px;
}

.table-of-content-container .table-of-content ul li {
    border-left: 1px solid #D4D4D4;
    padding: 6px 15px;
}

.table-of-content-container .table-of-content ul li a {
    color: #444444;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 19.2px;
    letter-spacing: 0.05px;
}

.table-of-content-container .table-of-content ul li.active a {
    color: #007ED3;
}

.table-of-content-container .table-content-right-section .question-heading p {
    color: #111;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 27px;
    letter-spacing: 0.05px;
    padding: 0 12px;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section {
    display: flex;
    flex-direction: column;
    padding: 0 12px 50px;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section .heading-icon-with-text-block {
    align-items: center;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section .heading-icon-with-text-block span {
    width: 36px;
    height: 36px;
    min-width: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--Gradient-for-gold, linear-gradient(180deg, #FFD504 0%, #FF9800 100%));
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section .heading-icon-with-text-block span img {
    width: 24px;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section .heading-icon-with-text-block h4 {
    margin: 0;
    color: #2B2B2B;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 31.2px;
    letter-spacing: 0.05px;
    margin-left: 15px;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section p {
    color: #007ED3;
    font-size: 18px;
    font-style: italic;
    font-weight: 400;
    line-height: 27px;
    letter-spacing: 0.05px;
    padding: 10px 0;
    margin-bottom: 15px;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section h6 {
    color: #007ED3;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 27px;
    letter-spacing: 0.05px;
    margin: 0;
    padding-bottom: 30px;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section ul {
    margin: 0;
    padding: 0;
    padding-left: 30px;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section ul li {
    display: flex;
    padding-bottom: 10px;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section ul li .list-circle {
    width: 32px;
    min-width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
    letter-spacing: -0.094px;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section ul li span {
    color: #111;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 27px;
    letter-spacing: 0.05px;
    padding-left: 15px;
    position: relative;
    top: 2px;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section ul li span .text-new-blue {
    font-weight: 600;
    display: inline;
}

.green-circle {
    background-color: rgba(17, 199, 170, 0.1);
    color: #11C7AA;
}

.blue-circle {
    background-color: rgba(0, 126, 211, 0.1);
    color: #007ED3;
}

.green-box-header h2 {
    padding: 20px 12px;
    margin: 0;
    background: rgba(200, 255, 246, 0.5);
    color: #2B2B2B;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 31.2px;
    letter-spacing: 0.05px;
    margin-bottom: 10px;
}

.note-blue-text-container {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    border: 1px solid #007ED3;
    background: #E8F6FF;
    color: #111;
    font-size: 18px;
    font-style: italic;
    font-weight: 600;
    line-height: 27px;
    letter-spacing: 0.05px;
    padding: 30px;
    text-align: center;
}

.note-green-text-container {
    border: 1px solid #11C7AA;
    background: rgba(240, 253, 244, 0.69);
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section ol {
    margin: 0;
    list-style: none;
    padding: 0;
    padding-left: 30px;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section ol+ul {
    padding-left: 60px;
    margin-top: 40px;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section ol li {
    display: flex;
    padding-bottom: 10px;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section ol li .dot-circle {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    min-width: 8px;
    position: relative;
    top: 9px;
}

.green-dot {
    background-color: #11C7AA;
}

.blue-dot {
    background-color: #007ED3;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section ol li span {
    color: #2B2B2B;
    font-size: 16px;
    font-style: italic;
    font-weight: 400;
    line-height: 27px;
    letter-spacing: 0.05px;
    padding-left: 10px;
}

.group-img-container {
    display: flex;
    margin-top: 30px;
    margin-bottom: 30px;
}

.group-img-container img {
    max-width: 100%;
    margin: auto;
}

.group-img-container.justify-content-center img {
    margin: inherit;
}

.mt-n2 {
    margin-top: -30px;
}

.no-padding-left {
    padding-left: 0;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section h5 {
    color: #2B2B2B;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 31.2px;
    letter-spacing: 0.05px;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section .heading-icon-with-blue-text {
    align-items: center;
    flex-wrap: wrap;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section .heading-icon-with-blue-text span {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #DEF2FF;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section .heading-icon-with-blue-text span img {
    width: 24px;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section .heading-icon-with-blue-text h4 {
    color: #007ED3;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 27px;
    letter-spacing: 0.05px;
    margin: 0;
    margin-left: 15px;
}

.table-of-content-container .table-content-right-section .question-heading .icon-content-section .heading-icon-with-blue-text p {
    color: #2B2B2B;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 27px;
    letter-spacing: 0.05px;
    margin: 0;
    padding-left: 51px;
    width: 100%;
}

ol.margin-40px-left {
    margin-left: 40px !important;
}

ul.margin-20px-left {
    margin-left: 20px !important;
}

.padding-0px-bottom {
    padding-bottom: 0 !important;
}

.tracking-all-headings {
    font-size: 24px !important;
}

.big-size-circle {
    width: 48px !important;
    height: 48px !important;
}

.big-size-circle img {
    width: 30px !important;
}

.box-style {
    border-radius: 12px;
    border: 1px solid #E5E7EB;
    background: #fff;
    padding: 30px 20px !important;
    margin-left: 50px !important;
}

.box-style .text-new-blue {
    font-weight: 600 !important;
}

.box-style.no-margin-left {
    margin-left: 0px !important;
}

.block-heading {
    color: #2B2B2B;
    font-size: 20px;
    font-style: italic;
    font-weight: 500;
    line-height: 27px;
    letter-spacing: 0.05px;
    margin-bottom: 30px;
}

.box-image-style {
    padding-bottom: 0 !important;
}

.arrow-down {
    display: flex;
    padding: 20px 0;
    justify-content: center;
}

.budget-finance-text-container h6 {
    color: #2B2B2B;
    font-size: 36px;
    font-style: normal;
    font-weight: 700;
    line-height: 44.2px;
    margin-bottom: 0;
}

.budget-finance-text-container h6 p {
    font-weight: 400;
}

.secure-img-container {
    margin-top: 50px;
}

.secure-img-container img {
    max-width: 100%;
    width: 100%;
}

.padding-left-40px {
    padding-left: 40px !important;
}

.all-step-text {
    font-size: 16px !important;
    padding-bottom: 15px !important;
}

.green-para-text {
    color: #11C7AA !important;
    font-size: 18px !important;
}

.black-blue-text-combination {
    margin-top: 40px;
    margin-bottom: 0px;
}

.black-blue-text-combination h1 {
    color: #2B2B2B;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 31.2px;
    letter-spacing: 0.05px;
}

.black-blue-text-combination h3 {
    color: #007ED3;
    font-family: Roboto;
    font-size: 18px;
    font-style: italic;
    font-weight: 500;
    line-height: 27px;
    letter-spacing: 0.05px;
}

.black-blue-text-combination h3.text-black {
    color: #2B2B2B;
    font-style: normal;
}

.fixed-height img {
    width: 300px;
    height: auto;
}

.no-italic {
    font-style: normal !important;
    padding: 20px !important;
}

@media (max-width: 767px) {
    .new-mobile-view {
        display: flex !important;
        flex-wrap: nowrap !important;
    }
    .ai-assitant-block ul {
        flex-direction: column;
    }
    .financial-assistant-block .financial-assistant-img-container .ai-chatbot-img {
        padding: 80px 20px !important;
    }
    .core-ai-features-section .core-ai-features-header img {
        left: 0;
        top: 70px;
        width: 100px;
    }
    .core-ai-features-section .core-ai-features-header {
        align-items: flex-start;
        margin-bottom: 40px;
    }
    .core-ai-features-section .core-ai-features-header h2 {
        font-size: 28px;
        text-align: left;
        position: relative;
        z-index: 1;
    }
    .core-ai-features-card {
        row-gap: 10px;
        align-items: center;
    }
    .core-ai-features-card h4 {
        font-size: 16px;
    }
    .predective-alert-section h4 {
        font-size: 28px;
    }
    .money-smarter-section > img {
        top: 20px;
        left: 0;
        width: 120px;
    }
    .phone-hand-ai-image ul {
        margin: 60px 0 0;
        flex-wrap: wrap;
        row-gap: 20px;
    }
    .phone-hand-ai-image ul li h4 {
        font-size: 16px;
        line-height: inherit;
    }
    .what-we-offer-card:nth-child(even) {
        flex-direction: column-reverse;
    }
    .what-we-offer-block {
        padding: 80px 0 0 !important;
    }
    .what-we-offer-image-container {
        margin-top: 30px
    }
    .what-we-offer-block .what-we-offer-content .chip-tag {
        font-size: 12px;
    }
    .what-we-offer-card {
        margin-top: 40px;
    }
    .ai-brain-main-banner .ai-brain-container .app-sent-buttons a img {
        width: 120px;
    }
    .new-footer-coontainer .container .row .col-lg-2 {
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
    .new-footer-coontainer .container .row .col-lg-5 {
        text-align: left !important;
    }
    .new-footer-coontainer.footer-application.footer-dark a img {
        width: 150px !important;
    }
    .new-footer-coontainer.footer-application.footer-dark a {
        margin-right: 0 !important;
    }
    .what-we-offer-block .what-we-offer-content h4 {
        font-size: 20px;
    }
    .what-we-offer-block .what-we-offer-heading h2 span {
        padding-left: 5px;
    }
    .what-we-offer-block .what-we-offer-content {
        row-gap: 10px;
    }
    .what-we-offer-block .what-we-offer-content .tunes-icon span {
        font-size: 12px;
    }
    .what-we-offer-block .what-we-offer-content p {
        font-size: 12px;
        line-height: inherit;
    }
    .phone-hand-ai-image ul li p {
        font-size: 11px;
        line-height: inherit;
    }
    .what-we-offer-block .what-we-offer-heading h2 {
        font-size: 28px;
        display: block;
        text-align: center;
    }
    .money-smarter-right img {
        width: 270px;
    }
    .financial-life-row .financial-life-cards img {
        width: 30px;
        height: 30px;
    }
    .new-testimonials-section {
        padding: 0 !important;
    }
    .testimonial-arrow {
        display: none !important;
    }
    .ai-brain-main-banner .ai-brain-container > img {
        top: 140px;
        right: inherit;
        width: 60px;
        left: 0;
    }
    .money-banner-bottom-ai h1 img {
        position: absolute;
        top: -40px;
        right: 0;
        width: 50px;
    }
    .new-testimonials-section .blue-black-text-combination {
        margin-bottom: 110px !important;
        font-size: 28px !important;
    }
    .trusted-millions-sectioon {
        min-height: inherit;
        background-size: contain;
        background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/mobile-trusted-millions-img.png);
    }
    .financial-life-row .financial-life-cards {
        margin-bottom: 20px;
        height: auto;
        align-items: center;
    }
    .financial-life-row {
        margin-bottom: 0;
    }
    .financial-life-row .financial-life-cards h4 {
        font-size: 16px;
    }
    .financial-life-row .financial-life-cards p {
        font-size: 12px;
        text-align: center;
        line-height: inherit;
    }
    .phone-hand-ai-image ul li {
        width: 48% !important;
        border: 1px solid #D5ECFD;
        border-radius: 13px;
        justify-content: center;
        row-gap: 0;
        padding: 10px 0;
    }
    .phone-hand-ai-image .container {
        padding: 0 15px !important;
    }
    .financial-life-row .financial-life-cards .new-tag {
        width: auto;
        height: auto;
        padding: 4px 14px;
        font-size: 9px;
    }
    .what-we-offer-block .what-we-offer-heading p {
        font-size: 14px;
    }
    .phone-hand-ai-image ul li.vertical-gradient-lines {
        width: auto !important;
        display: none;
    }
    .phone-hand-ai-image {
        margin-top: 0 !important;
    }
    .phone-hand-ai-image img {
        max-width: 100% !important;
    }
    .money-smarter-section .money-smarter-left-content {
        position: relative;
        z-index: 1;
        margin-bottom: 40px;
    }
    .new-footer-coontainer.footer-application .footer-links-partition {
        display: none !important;
    }
    .money-smarter-section .money-smarter-left-content h2 {
        font-size: 36px;
    }
    .predective-alert-section ul {
        margin-bottom: 40px;
    }
    .money-smarter-section .money-smarter-left-content .app-sent-buttons a img {
        width: 140px;
    }
    .money-smarter-section .money-smarter-left-content p {
        font-size: 14px;
        line-height: inherit;
    }
    .predective-alert-section ul li .predective-content-box h5 {
        font-size: 16px;
    }
    .predective-alert-section ul li .predective-content-box p {
        font-size: 12px;
    }
    .ai-brain-main-banner .ai-brain-container .fancy-ai-tag {
        margin-bottom: 20px;
    }
    .predective-alert-section ul li .predective-content-box span {
        font-size: 12px;
        padding: 5px 10px;
        width: 120px;
        height: auto;
    }
    .core-ai-features-card p {
        font-size: 14px;
        text-align: center;
        line-height: inherit;
    }
    .core-ai-features-card a {
        font-size: 12px;
    }
    .core-ai-features-card img {
        width: 30px;
        height: 30px;
    }
    .predective-alert-section .ai-chat-tag {
        padding: 0 15px;
        font-size: 12px;
    }
    .core-ai-features-section .core-ai-features-header p {
        font-size: 14px;
        line-height: inherit;
        text-align: left;
        position: relative;
        z-index: 1;
    }
    .financial-assistant-content-box {
        padding: 0;
    }
    .financial-assistant-content-box ul li span {
        font-size: 12px;
        top: -1px
    }
    .financial-assistant-block {
        padding: 40px 0 !important;
    }
    .financial-assistant-content-box h2 {
        font-size: 28px;
    }
    .financial-assistant-content-box p {
        font-size: 14px;
        line-height: inherit;
    }
    .core-ai-features-section .core-ai-features-header .ai-chat-tag {
        font-size: 12px;
        height: auto;
        width: auto;
        padding: 5px 20px;
    }
    .financial-assistant-content-box ul li {
        column-gap: 10px;
    }
    .financial-assistant-content-box ul li img {
        width: 20px;
        height: 20px;
        min-width: 20px;
    }
    .ai-assitant-block ul li.vertical-lines {
        width: auto;
        transform: rotate(90deg);
        height: 62px;
    }
    .financial-assistant-content-box .ai-chat-tag {
        font-size: 12px;
        height: auto;
        width: auto;
        display: inline-flex;
        padding: 5px 20px;
    }
    .ai-assitant-block ul li h4 {
        font-size: 18px;
    }
    .ai-assitant-block ul li p {
        font-size: 12px;
    }
    .ai-assitant-block ul li {
        width: 100%;
    }
    .ai-brain-main-banner .ai-brain-container > a {
        font-size: 12px;
        width: auto;
        height: auto;
        padding: 5px 20px;
        position: relative;
        z-index: 1;
    }
    .ai-assitant-block ul li img {
        width: 40px;
    }
    .ai-assitant-block ul li.vertical-lines img {
        width: auto;
    }
    .ai-brain-main-banner {
        padding-top: 60px !important;
    }
    .ai-brain-main-banner .ai-brain-container p {
        font-size: 14px;
        line-height: 20px;
        padding: 0 20px 20px;
        position: relative;
        z-index: 1;
    }
    .ai-brain-main-banner .ai-brain-container > img {
        top: 140px;
        right: inherit;
        width: 60px;
        left: 0;
    }
    .ai-brain-main-banner .ai-brain-container h1,
    .ai-brain-main-banner .ai-brain-container h2 {
        font-size: 28px;
        width: 100%;
    }
    .ai-brain-main-banner .ai-brain-container .tunes-icon img {
        width: 22px;
    }
    .what-we-offer-block .what-we-offer-heading .what-we-offer-tag {
        font-size: 20px;
        padding: 0;
    }
    .what-we-offer-block .what-we-offer-heading .what-we-offer-tag::before,
    .what-we-offer-block .what-we-offer-heading .what-we-offer-tag::after {
        width: 16px;
        height: 16px;
    }
    .what-we-offer-block .what-we-offer-heading .what-we-offer-tag::before {
        right: -20px;
        top: -4px;
    }
    .what-we-offer-block .what-we-offer-heading .what-we-offer-tag::after {
        left: -20px;
        bottom: -4px;
    }
    .ai-brain-main-banner .ai-brain-container .fancy-ai-tag span {
        font-size: 14px;
    }
    .ai-brain-main-banner .ai-brain-container .tunes-icon span {
        font-size: 12px;
    }
    .fade-out-block::before, .fade-out-block::after {
        display: none;
    }
    .real-stories-block::after {
        width: 30px;
        height: 30px;
        top: 110px;
        left: 10px;
    }
    .budget-couple-bottom-image::before {
        display: none;
    }
    .stroke {
        margin: 30px 20px 10px;
        width: 100%;
    }

    .card-layout .card-img {
        height: 44px;
        width: 44px;
        top: -28px;
    }

    .card-layout .card-img img {
        width: 30px;
        height: 30px;
    }

    .learn-smart-section .managing-bill-text-container h1 {
        font-size: 40px;
        line-height: normal;
    }

    .why-family-important h1 {
        font-size: 28px;
    }

    .why-family-important p {
        font-size: 18px;
    }

    .why-family-important ul li img {
        width: 70px;
    }

    .why-family-important ul li .family-stress-content h4 {
        font-size: 16px;
    }

    .bottom-section-link {
        padding: 16px 8px;
        margin: 60px 0 0;
        font-size: 14px;
    }

    .family-budget-card img {
        width: 70px;
    }

    .watch-text {
        font-size: 24px;
        margin: 0;
    }

    .steps-vertical-container>img {
        top: 10px
    }

    .line-circle-section {
        top: 140px;
    }

    .max-section-width {
        padding: 0 20px;
    }

    .premium-cards span {
        font-size: 16px;
    }

    .premium-cards {
        padding: 15px;
    }

    .premium-cards h5 {
        font-size: 20px;
    }

    .steps-vertical-container h2 img {
        height: 45px;
    }

    .steps-vertical-container h2 {
        font-size: 18px;
    }

    .three-rules-container {
        padding: 0 20px 80px;
    }

    .family-budget-card h4 {
        font-size: 20px;
    }

    .why-family-important ul li .family-stress-content p {
        font-size: 14px;
    }

    .three-rules-container ul li {
        font-size: 14px;
    }

    .three-rules-container ul {
        padding-left: 20px !important;
    }

    .why-family-important {
        padding: 50px 0 !important;
    }

    .three-rules-container .rules-with-icon h4 {
        font-size: 20px;
    }

    .why-family-important::after {
        width: 300px;
        height: 300px;
    }

    .three-rules-section::after {
        left: -150px
    }

    .three-rules-container .rules-with-icon img {
        width: 50px;

    }

    .three-rules-section h1 .large-blue {
        font-size: 50px;
    }

    .three-rules-section h1 img {
        width: 30px;
        height: 30px;
        top: 0;
        right: 0;
    }

    .why-family-important ul {
        padding-right: 0;
        row-gap: 25px;
        margin-top: 40px;
    }

    .why-family-important ul li {
        padding: 10px;
        column-gap: 15px;
    }

    .learn-smart-section .home-managing-img-container img {
        top: 20px;
        position: relative;
        right: 0;
    }

    .learn-smart-section .managing-bill-text-container p {
        font-size: 20px;
        text-align: center;
    }

    .calculator-icon {
        width: 50px;
    }

    .dollar-icon {
        margin-left: -280px;
        width: 50px;
        margin-top: 5px;
    }

    .balance-life-budget-section .balance-life-left {
        padding: 20px 20px;
        row-gap: 15px;
        margin: 0 20px 20px;
    }

    .creatte-budget-5-steps-section .tips-block .tips-content h4 {
        font-size: 14px;
    }

    .creatte-budget-5-steps-section .tips-block .tips-content p {
        font-size: 12px;
    }

    .creatte-budget-5-steps-section .stepper-blocks .steps-container .steps-header img {
        height: 40px;
    }

    .creatte-budget-5-steps-section .tips-block {
        margin: 0;
        padding: 10px;
    }

    .creatte-budget-5-steps-section .stepper-blocks .steps-container .steps-header {
        align-items: flex-start;
    }

    .creatte-budget-5-steps-section .steps-img-container {
        margin-top: 30px;
    }

    .creatte-budget-5-steps-section .stepper-blocks .steps-container ul {
        padding-left: 0;
    }

    .smart-budgeting-hack-section .smart-cards-container ul li span {
        margin-top: 10px;
        font-size: 16px;
    }

    .creatte-budget-5-steps-section .tips-block img {
        width: 64px;
    }

    .smart-budgeting-hack-section .smart-cards-container ul li .smartt-icon-container img {
        width: 30px;
    }

    .smart-budgeting-hack-section .smart-cards-container ul li .smartt-icon-container {
        width: 60px;
        height: 60px;
    }

    .smart-budgeting-hack-section .smart-cards-container ul {
        gap: 20px;
    }

    .smart-budgeting-hack-section .smart-cards-container {
        margin: 40px auto 0;
        width: 100%;
    }

    .creatte-budget-5-steps-section .custom-notes>p {
        font-size: 16px;
    }

    .budgeting-fitfalls-section .budgeting-fitfal-img-container {
        width: 100%;
        height: 260px;
        position: relative;
        top: 0;
    }

    .budgeting-fitfalls-section .budgeting-fitfal-img-container img {
        width: 96%;
        top: -14px;
    }

    .budgeting-card-container ul li h4 {
        font-size: 16px;
    }

    .budgeting-card-container ul {
        padding: 50px 0;
        row-gap: 40px;
    }

    .budgeting-card-container ul li {
        width: 100%;
    }

    .budgeting-container {
        width: 100%;
        padding-top: 50px;
        position: relative;
        z-index: 1;
    }

    .budgeting-fitfalls-section {
        padding: 50px 0;
    }

    .budgeting-fitfalls-section .budgeting-fitfal-content ul li span {
        width: 10px;
        height: 10px;
        min-width: 10px;
        top: 6px;
    }

    .budgeting-fitfalls-section .budgeting-fitfal-content ul {
        padding: 15px;
        row-gap: 10px;
    }

    .budgeting-fitfalls-section .budgeting-fitfal-content ul li {
        column-gap: 10px;
        font-size: 14px;
    }

    .budgeting-fitfalls-section .budgeting-fitfal-content p {
        font-size: 16px;
    }

    .budgeting-fitfal-content {
        margin-top: 30px;
    }

    .budgeting-fitfalls-section .budgeting-fitfal-content h2 {
        font-size: 28px;
    }

    .smart-budgeting-hack-section .main-heading h1 {
        font-size: 28px;
    }

    .smart-budgeting-hack-section .smart-cards-container ul li {
        width: 100%;
    }

    .smart-budgeting-hack-section .main-heading p {
        font-size: 16px;
    }

    .smart-budgeting-hack-section {
        padding: 0 20px 50px;
    }

    .creatte-budget-5-steps-section .custom-notes .custom-notes-content>span {
        width: 10px;
        height: 10px;
        min-width: 10px;
        top: 4px;
    }

    .create-budget-mobile-changes>h1 {
        padding: 0 20px;
    }

    .budget-footer-dollar-img {
        top: -40px !important;
        right: 0px !important;
    }

    .vertical-hr {
        margin-top: 30px;
        margin-bottom: 50px;
    }

    .green-bg-section h2 {
        max-width: 100%;
        font-size: 28px;
    }

    .budget-footer-dollar-img {
        position: absolute !important;
        top: -20px !important;
        right: -10px !important;
        width: 65px;
    }

    .budget-smartly-footer ul {
        margin: 30px 0 0px;
        gap: 10px;
    }

    .tilt-mobile.bill-img-bottom {
        position: relative !important;
        right: 0;
        top: 20px !important;
    }

    .budget-smartly-footer ul li {
        width: 50%;
    }

    .budget-smartly-footer .managing-bill-text-container>p {
        font-size: 16px;
        text-align: center;
    }

    .budget-smartly-footer .padding-80px-top {
        padding-top: 0 !important;
    }

    .green-bg-section {
        padding: 40px 20px;
        margin: 50px 0 30px;
    }

    .start-section {
        background-size: cover;
        background-repeat: no-repeat;
    }

    .creatte-budget-5-steps-section .custom-notes .custom-notes-content h6 {
        font-size: 14px;
    }

    .creatte-budget-5-steps-section .custom-notes {
        margin-left: 44px;
    }

    .creatte-budget-5-steps-section .custom-notes>p {
        font-size: 16px;
    }

    .creatte-budget-5-steps-section .stepper-blocks .steps-container ul li {
        padding: 10px 10px;
    }

    .creatte-budget-5-steps-section .stepper-blocks .steps-container ul li img {
        width: 24px;
        height: 24px;
    }

    .creatte-budget-5-steps-section .stepper-blocks .steps-container ul li span {
        font-size: 14px;
    }

    .creatte-budget-5-steps-section .stepper-blocks {
        margin: 50px 0;
    }

    .creatte-budget-5-steps-section .stepper-blocks .steps-container .steps-header .steps-heading h4 {
        font-size: 22px;
    }

    .creatte-budget-5-steps-section .stepper-blocks .steps-container .steps-header .steps-heading p {
        font-size: 16px;
    }

    .creatte-budget-5-steps-section {
        padding: 20px 0;
    }

    .creatte-budget-5-steps-section>h1 strong,
    .creatte-budget-5-steps-section>h1 {
        font-size: 26px;
    }

    .balance-life-budget-section .balance-life-left h1 {
        font-size: 26px;
    }

    .balance-life-budget-section .balance-life-left span {
        font-size: 14px;
        padding: 10px 5px;
    }

    .balance-life-budget-section .balance-life-left p {
        font-size: 16px;
    }

    .learn-smart-section .managing-bill-text-container a {
        font-size: 16px;
    }

    .dollar-img-section .small-dollar {
        left: -10px;
    }

    .money-tip-dos-card .money-tip-content p {
        font-size: 18px;
    }

    .money-tip-dos-card .money-tip-content span {
        font-size: 12px;
    }

    .money-tip-slider-section {
        padding: 30px 20px 100px !important;
    }

    .money-tip-header h2 {
        font-size: 26px;
    }

    .money-tip-tab-section h2 {
        font-size: 26px;
    }

    .content-conatiner .content-container-right h4 {
        font-size: 24px;
    }

    .money-tip-dos-card .money-tip-dos-img {
        height: 300px;
    }

    .money-tip-tab-section .tabs-container ul li a {
        font-size: 16px !important;
        padding: 6px 12px !important;
    }

    .content-conatiner .content-container-right p {
        font-size: 18px;
        line-height: 24px;
    }

    .content-conatiner .content-container-right .tips-tag {
        column-gap: 10px;
    }

    .content-conatiner .content-container-right .tips-tag .tag-1 {
        font-size: 12px;
        padding: 7px 10px;
    }

    .dollar-img-section .large-dollar {
        right: -15px;
        top: -60px;
    }

    .money-tip-tab-section .tabs-container ul li {
        width: auto !important
    }

    .managing-bill-text-container {
        align-items: center;
    }

    .your-class .branding-bg {
        margin-right: 0;
        width: 100%;
    }

    .family-budget-right-block img.bottom-img,
    .family-budget-right-block img.top-img {
        left: 0;
    }

    .family-budget-right-block img.top-img {
        width: 100%;
        left: -117px;
        top: -52px;
        height: 130px;
    }

    .family-budget-right-block img.bottom-img {
        height: 130px;
        width: auto;
        left: -120px;
        top: 100px;
    }

    .process-step-style-05 .process-step-icon-box .process-step-bfr {
        display: none !important;
    }

    .screenshot-saver-section p {
        font-size: 24px !important;
        max-width: inherit !important;
    }

    .design-main-dessc {
        font-size: 24px !important;
    }

    .screenshot-saver-section h2 {
        font-size: 36px !important;
    }

    .screenshot-saver-section::after {
        width: 300px !important;
        height: 300px !important;
    }

    .breadcrumbs-container {
        margin-top: 0;
        padding-bottom: 30px;
        padding-top: 30px;
    }

    .budget-container-main-heading h2 {
        font-size: 36px;
    }

    .table-of-content {
        margin-bottom: 40px;
    }

    .green-box-header h2 {
        font-size: 24px;
    }

    .table-of-content-container .table-content-right-section .question-heading p {
        font-size: 16px;
    }

    .table-of-content-container .table-content-right-section .question-heading .icon-content-section .heading-icon-with-text-block h4 {
        font-size: 24px;
    }

    .table-of-content-container .table-content-right-section .question-heading .icon-content-section p {
        font-size: 16px !important;
        padding-left: 0 !important;
    }

    .table-of-content-container .table-content-right-section .question-heading .icon-content-section ul {
        padding-left: 0;
        margin-left: 0 !important;
    }

    .table-of-content-container .table-content-right-section .question-heading .icon-content-section ul li span {
        font-size: 16px;
    }

    .table-of-content-container .table-content-right-section .question-heading .icon-content-section ol {
        padding-left: 0;
        margin-left: 0 !important;
    }

    .table-of-content-container .table-content-right-section .question-heading .icon-content-section ol+ul {
        padding-left: 0;
    }

    .note-blue-text-container {
        padding: 15px;
        font-size: 14px;
    }

    .table-of-content-container .table-content-right-section .question-heading .icon-content-section h5 {
        font-size: 24px;
    }

    .table-of-content-container .table-content-right-section .question-heading .icon-content-section .heading-icon-with-blue-text h4 {
        font-size: 20px;
    }

    .group-img-container {
        flex-direction: column;
    }

    .budget-img-container {
        flex-direction: column;
        padding: 20px;
    }

    .budget-finance-text-container h6 {
        font-size: 24px;
        line-height: normal;
    }

    .group-img-container img:nth-child(2) {
        width: 24px;
        margin: auto;
        transform: rotate(90deg);
    }

    .page-main-heading h1 {
        font-size: 36px;
        line-height: normal;
    }

    .page-main-heading h1 br {
        display: none;
    }

    .page-main-heading span {
        font-size: 36px;
        line-height: normal;
    }

    .page-main-heading p {
        font-size: 16px;
    }

    .main-header-new {
        margin-top: 30px !important;
    }

    .screenshot-img-container {
        width: 100%;
    }

    .shift-container {
        margin-top: 0;
    }

    .features-designed-section .designed-cards {
        width: 100%;
        margin-bottom: 60px !important;
    }

    .features-designed-section .design-main-heading {
        font-size: 36px;
    }

    .design-box-rows {
        padding: 0 20px;
    }

    .features-designed-section .designed-cards .design-box {
        height: inherit;
        padding: 20px 0 0;
    }

    .features-designed-section .designed-cards h2 {
        font-size: 30px;
        line-height: normal;
    }

    .features-designed-section .designed-cards p {
        line-height: 30px;
        font-size: 20px;
    }
    .blue-black-text-combination {
        white-space: normal;
        font-size: 32px;
        position: relative;

    }
    .challenges-block h2 br{
       display: none;
    }
    .real-stories-block ul.real-stories-small-card-conttainer li {
        width: 300px;
        min-width: 300px;
    }
    .family-budget-benefit-block .family-budget-benefit-cards p {
        font-size: 16px;
    }
    .challenges-block h2::after {
        width: 50px;
        height: 50px;
        top: 20px;
    }
    .real-benefit-card {
        margin-bottom: 20px;
        align-items: center;
    }
    .challenges-block h2::before {
        width: 25px;
        height: 25px;
        top: inherit;
        bottom: -20px;

    }
    .real-benefit-card img {
        width: 40px;
        margin-bottom: 10px;
    }
    .real-benefit-card span {
        font-size: 16px;
        text-align: center;
        padding-top: 6px;
    } 
    .real-benefit-card h5 {
        font-size: 24px;
        text-align: center;
    } 
    .challenge-card p {
        font-size: 16px;
    }
    .challenge-card h5 {
        font-size: 24px;
        padding-bottom: 2px;
    }
    .challenge-card {
        height: auto;
        margin-top: 20px;
        padding-bottom: 0;
    }
    .family-budget-benefit-block .family-budget-benefit-cards .img-container {
        width: 60px;
        height: 60px;
        margin-bottom: 30px;
    }
    .family-budget-benefit-block .family-budget-benefit-cards {
        height: auto;
        margin-bottom: 20px;
    }
    .family-budget-benefit-block .family-budget-benefit-cards .img-container img {
        width: 36px;
    }
    .challenges-block .row {
        margin-top: 60px;
    }
    .family-budget-benefit-block .family-budget-benefit-cards h5 {
        font-size: 18px;
    }
    .challenge-card img {
        height: 87px;
    }
    .right-rounded-arrow {
        margin-left: 0;
        margin-top: 40px;
        width: 130px;
        margin-bottom: 40px;
    }
    .smarter-budget-block {
        margin-top: 0;
        padding-bottom: 0px !important;
        height: 434px;
        background-size: contain;
        background-color: #fff;
        background-position: bottom;
    }
    .budget-family-block .budget-family-content-block a {
        padding: 13px 50px;
    }
    .budget-family-block .budget-family-content-block h1 {
        font-size: 32px;
    }
    .budget-family-block .budget-family-content-block p {
        font-size: 20px;
    }
    .blue-horizontal-tag {
        white-space: normal;
        font-size: 18px;
    }
    .acheiver-card h5 {
        font-size: 16px;
    }
    .acheiver-card p {
        font-size: 14px;
    }
    .real-stories-block {
        padding-bottom: 60px;
    }
    .budget-family-block .budget-family-content-block a {
        font-size: 16px;
        border-radius: 100px;
    }
    .real-stories-block ul.real-stories-small-card-conttainer {
        justify-content: flex-start;
        row-gap: 20px;
        margin-top: -80px;
    }
    .real-stories-block ul.real-stories-large-card-container {
        margin-top: 20px;
    }
    .real-stories-block ul.real-stories-small-card-conttainer li .story-header .story-header-content h6 {
        font-size: 13px;
    }
    .real-stories-block ul.real-stories-small-card-conttainer li .story-header .story-header-content .star-ratings i {
        font-size: 13px;
    }
    .real-stories-block ul.real-stories-small-card-conttainer li p {
        font-size: 11px;
    }
    .acheive-block .row {
        margin-top: 50px;
    }
    .budget-family-block .budget-family-content-block h4 {
        font-size: 32px;
    }
    .acheive-block::after {
        right: 20px;
        bottom: 50px;
    }
    .expore-more-cards {
        margin-bottom: 30px;
    }
    .family-budget-essential-block .family-budget-essenttials-cards {
        height: auto;
        margin-bottom: 20px;
    }
    .triangle-yellow {
        left: 0;
    }
    .ornament-icon {
        display: none;
    }
    .adapt-for-you-bloock .expore-more-cards h5 {
        font-size: 18px;
    }
    .budget-family-block .budget-family-content-block {
        row-gap: 16px;
    }
    .core-features-block .core-feature-card span {
        text-align: center;
        font-size: 16px;
    }
    .expore-more-cards h5 {
        font-size: 18px;
    }
    .core-features-block::after {
        display: none;
    }
    .core-features-block .core-feature-card {
        row-gap: 10px;
    }
    .core-features-block .core-feature-card h5 {
        font-size: 20px;
    }
    .pros-cons-block .row {
        margin-top: 50px;
    }
    .pros-cons-block .pros-cons-list-block ul li span {
        font-size: 18px;
    }
    .pros-cons-block .pros-cons-list-block ul li {
        min-height: inherit;
        padding-bottom: 20px;
    }
    .managing-bill-text-container h2, .managing-bill-text-container h1 {
        text-align: center !important;
    }
    .budget-couples-block .budget-family-img-container {
        position: static;
        width: 100%;
    }
    .budget-family-block {
        padding: 0;
    }
    .budget-matter-block {
        padding: 80px 0 0; 
    }
    .budget-matter-block .row {
        margin-top:-70px;
        row-gap: 20px;
    }
    .family-budget-essential-block .family-budget-essenttials-cards p {
        font-size: 16px;
    }
    .family-budget-essential-block .family-budget-essenttials-cards h5 {
        font-size: 18px;
        
    }
    .individuals-budget-block .container::after {
        height: 44px;
        width: 44px;
        top: 90px;
    }
    .key-benefit-cards .img-container {
        width: 60px;
        height: 60px;
    }
    .key-benefits-block {
        padding: 60px 0;
    }
    .key-benefits-block .bottom-right-square::before {
        right: 7px;
        width: 66px;
        height: 66px;
        bottom: 7px;
    }
    .key-benefit-cards .img-container img {
        width: 36px;
        height: 36px;
    }
    .key-benefit-cards {
        margin-bottom: 20px;
        height: auto;
    }
    .key-benefit-cards p {
        font-size: 16px;
    }
    .key-benefit-cards h5 {
        font-size: 18px;
    }
    .individuals-budget-block .container::before {
        height: 45px;
        width: 45px;
        top: 10px;
    }
    .extra-para {
        font-size: 20px;
        padding-bottom: 50px;
    }
    .family-simplify-card-img {
        position: relative;
        z-index: 1;
    }
    .family-budget-simplify-block .family-simplify-card-content h4 {
        font-size: 24px;
        text-align: center;
    }
    .family-budget-simplify-block .family-simplify-card-content p {
        font-size: 16px;
        text-align: center;
        margin-bottom: 30px;
    }
    .mobile-spacing {
        margin-top: 40px;
    }
    .less-h2-margin .blue-black-text-combination {
        margin-bottom: 50px !important;
    }
    .family-simplify-card-content > img {
        display: none;
    }
    .family-budget-simplify-block .row {
        margin-bottom: 50px;
    }
    .family-simplify-card-img {
        margin-bottom: 15px;
    }
    .mobile-interchange-block .row:nth-child(odd) {
        display: flex;
        flex-direction: column-reverse;
    }
    .mobile-interchange-block-vice-versa .row {
        position: relative;
        z-index: 1;
    }
    .mobile-interchange-block-vice-versa .row:nth-child(odd) {
        display: flex;
        flex-direction: column-reverse;
    }
    .smarter-budget-block .budget-family-content-block {
        margin-top: 50px !important;
    }
    .acheive-block {
        padding-top: 30px;
    }
    .pros-cons-block {
        padding-bottom: 60px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .process-step-style-05 .process-step-icon-box .process-step-bfr {
        display: none !important;
    }

    .page-main-heading h1 {
        font-size: 50px;
        line-height: normal;
    }

    .page-main-heading span {
        font-size: 50px;
        line-height: normal;
    }

    .page-main-heading p {
        font-size: 20px;
    }

    .features-designed-section .designed-cards {
        margin-bottom: 60px;
    }

    .features-designed-section .designed-cards .design-box {
        padding: 22px 20px 0 20px;
    }

    .features-designed-section .designed-cards h2 {
        font-size: 36px;
        line-height: normal;
    }

    .features-designed-section .designed-cards p {
        font-size: 24px;
    }

    .managing-bill-text-container h2,
    .managing-bill-text-container h1 {
        text-align: center;
    }

    .managing-bill-text-container {
        align-items: center;
    }

    .testimonial-section .row .col-lg-4 {
        max-width: 80%;
        flex: 0 0 100%;
        margin: auto;
    }
}

.bill-img-bottom {
    top: 0 !important
}

.screenshot-saver-section {
    position: relative;
    padding-bottom: 80px;
}

.screenshot-saver-section .row>div {
    padding: 0 !important;
}

.screenshot-saver-section::after {
    content: '';
    position: absolute;
    background-image: url(https://static.timelybills.app/public-site/family_budgeting_new/ellipse-899.png);
    bottom: 0;
    width: 600px;
    height: 600px;
    background-repeat: no-repeat;
    background-size: contain;
    left: 0px;
}

.screenshot-saver-section h2 {
    margin-bottom: 10px;
    font-size: 48px;
    color: #2B2B2B;
    text-align: center;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.screenshot-saver-section h2 span {
    color: #007ED2;
}

.screenshot-saver-section p {
    color: #4B5563;
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin: auto;
    max-width: 756px;
    margin-bottom: 80px;
}

.design-main-dessc {
    color: #4B5563;
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 66px;
}

.branding-container {
    align-items: inherit;
    row-gap: 30px;
}

@media (max-width: 1199px) and (min-width: 768px) {
    .card-layout {
        min-width: 300px;
        max-width: 300px;
        padding: 13px;
        top: 150px;
    }

    .card-top-right {
        left: 335px;
    }

    .card-layout h4 {
        font-size: 14px;
    }

    .card-layout p {
        font-size: 12px;
    }

    .card-bottom-left,
    .card-bottom-right {
        top: 440px;
    }

    .card-bottom-left {
        left: -370px;
    }

    .card-bottom-right {
        left: -230px;
    }

    .ellipsis-border {
        width: 770px;
        height: 770px;
        border: 335px solid rgba(0, 126, 210, 0.02);
    }
}

@media (max-width: 767px) {
    .blue-section .heading-text h4 {
        font-size: 36px;
        line-height: normal;
    }

    .blue-section .cards-container .ellipsis-img-container {
        width: 100%;
        height: 400px;
        bottom: -130px;
    }

    .card-layout {
        min-width: 200px;
        max-width: 200px;
        padding: 15px 10px;
        border-radius: 27px;
        transform: scale(0.7);
        top: 0;
        left: 210px;
    }

    .card-layout h4 {
        font-size: 14px;
        line-height: normal;
        padding: 8px 0;
    }

    .card-layout p {
        font-size: 12px;
    }

    .ellipsis-border {
        width: 100%;
        height: 730px;
        border-radius: 634px;
        border: 210px solid rgba(0, 126, 210, 0.02);
        position: absolute;
        bottom: -300px;
    }

    .blue-section .cards-container .ellipsis-img-container {
        width: 60%;
        height: 540px;
        border-radius: 700px;
        bottom: -390px;
    }

    .card-top-right {
        left: 200px;
    }

    .card-bottom-right {
        left: -189px;
        top: 190px;
    }

    .card-bottom-left {
        left: -212px;
        top: 190px;
    }

    .blue-section {
        height: 640px;
        padding: 40px 20px 0;
    }
}


.login-container {
    display: flex;
    height: 100svh;
}

.login-container .login-left-container {
    width: 60%;
    display: flex;
    flex-direction: column;
}

.login-container .login-left-container .login-logo {
    padding: 20px;
    display: flex;
    position: absolute;
}

.login-container .login-left-container .login-logo img {
    width: 144px;
}

.login-right-container {
    width: 40%;
    background-color: #F0F9FF;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 60px;
    box-sizing: border-box;
}

.login-right-container h2 {
    color: #223263;
    text-align: center;
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    line-height: 129.098%;
    letter-spacing: -0.8px;
    margin: 0;
    padding-bottom: 15px;
}

.login-right-container p {
    color: #7D94A0;
    text-align: center;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 30px;
    margin: 0;
    padding: 20px 0;

}

.login-right-container img {
    max-width: 100%;
}

.left-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 400px;
    margin: auto;
}

.left-content h1 {
    color: #223263;
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    line-height: 110%;
    letter-spacing: -1.6px;
    margin: 0;
    padding-bottom: 15px;
}

.left-content p {
    color: #969696;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    margin: 0;
    padding-bottom: 15px;
}

.material-input {
    position: relative;
    margin: 20px 0;
}

.material-input label {
    position: absolute;
    z-index: 1;
    background-color: #fff;
    left: 10px;
    top: 19px;
    pointer-events: none;
    padding: 0 8px;
}

.material-input label.active {
    top: -8px;
    color: #007ED2;
}

.material-input input {
    color: #2B2B2B;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    border-radius: 10px;
    border: 1.5px solid #D9D9D9;
    padding: 15px 15px;
    width: 100%;
    outline: none !important;
    box-sizing: border-box;
}

.material-input input:focus {
    border-color: #007ED2;
}

.sign-in-btn {
    box-shadow: none;
    outline: none !important;
    border: 0;
    border-radius: 10px;
    color: #fff;
    height: 54px;
    background-color: #007ED2;
    font-size: 18px;
    font-weight: 600;
    width: 100%;
    cursor: pointer;
}

.sign-in-btn:disabled {
    background-color: #D9D9D9;
    pointer-events: none;
}

.sign-in-with-google {
    outline: none !important;
    color: #2b2b2b;
    height: 54px;
    background-color: #fff;
    font-size: 18px;
    font-weight: 600;
    width: 100%;
    cursor: pointer;
    border-radius: 10px;
    border: 1px solid #E6E8E7;
    background: #FFF;
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.03);
    display: flex;
    align-items: center;
    justify-content: center;
}

.sign-in-with-google img {
    margin: 0 12px;
}

.or-divider {
    display: flex;
    align-items: center;
    color: #6E6E6E;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
    justify-content: space-between;
    margin: 25px 0;
}

.or-divider::before,
.or-divider::after {
    content: '';
    width: 46%;
    background-color: #D9D9D9;
    height: 1px;
}

.need-an-account {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #6C6C6C;
    text-align: center;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    margin-top: 32px;
}

.need-an-account a {
    text-decoration: none;
    color: #007ED2;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    margin-left: 10px;
}

.need-an-account a:hover {
    text-decoration: underline;
    cursor: pointer;
}

@media (max-width: 767px) {
    .login-right-container {
        display: none;
    }

    .login-left-container {
        width: 100% !important;
    }

    .left-content {
        width: 90% !important;
        padding-bottom: 50px;
    }

    .login-container .login-left-container .login-logo {
        position: static;
        padding: 20px 0px;
        justify-content: center;
    }

    .left-content h1 {
        font-size: 34px;
    }

    .login-container .login-left-container .login-logo img {
        width: 190px;
    }
}

.quiz-floating-btn {
    position: fixed;
    bottom: 100px;
    right: 20px;
    z-index: 9999;
    background: #003087;
    color: white;
    padding: 15px;
    border-radius: 30px;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    display: flex;
    align-items: center;
    gap: 10px;
}

.quiz-modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 10000;
}

.quiz-content {
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: white;
    padding: 30px;
    border-radius: 15px;
    max-width: 500px;
    text-align: center;
}

.quiz-close {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    font-size: 24px;
}

.quiz-button {
    background: #003087;
    color: white;
    padding: 12px 30px;
    border-radius: 25px;
    text-decoration: none;
    display: inline-block;
    margin-top: 20px;
}

.quiz-content {
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: white;
    padding: 35px;
    border-radius: 15px;
    max-width: 500px;
    text-align: center;
    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.2);
}

.quiz-title {
    font-size: 22px;
    font-weight: bold;
    color: #003087;
    margin-bottom: 15px;
}

.quiz-description {
    font-size: 16px;
    line-height: 1.6;
    color: #333;
    margin-bottom: 20px;
}

.quiz-button {
    background: #003087;
    color: white;
    padding: 12px 30px;
    border-radius: 25px;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    font-weight: bold;
    margin-top: 20px;
    transition: 0.3s;
}

.quiz-button:hover {
    background: #002060;
}

.quiz-divider {
    border: 0;
    height: 1px;
    background: #ddd;
    margin: 25px 0;
}

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

.quiz-results p {
    font-size: 16px;
    line-height: 1.5;
    color: #444;
    margin-bottom: 12px;
}

.result-text {
    display: block;
    margin-top: 5px;
    font-size: 15px;
    color: #555;
}

/* Existing CSS remains the same */

/* Add these media queries at the end */

@media (max-width: 768px) {
    .quiz-floating-btn {
        bottom: 80px;
        right: 15px;
        padding: 12px 20px;
        font-size: 14px;
    }

    .quiz-content {
        max-width: 90%;
        padding: 25px;
        top: 45%;
    }

    .quiz-title {
        font-size: 20px;
    }

    .quiz-description {
        font-size: 15px;
        line-height: 1.5;
    }

    .quiz-button {
        padding: 12px 25px;
        font-size: 15px;
    }

    .quiz-results p {
        font-size: 15px;
    }

    .result-text {
        font-size: 14px;
    }
}

/* Existing quiz styles remain the same */

/* Mobile First Approach */
@media (max-width: 768px) {
    .quiz-floating-btn {
        bottom: 120px;
        /* Increased from 100px */
        right: 15px;
        padding: 12px 20px;
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .quiz-floating-btn {
        bottom: 80px;
        /* Moved higher above chat button */
        right: 10px;
        padding: 12px;
        width: 48px;
        height: 48px;
        border-radius: 50%;
        justify-content: center;
    }

    .quiz-floating-btn span {
        display: none;
    }

    .quiz-floating-btn::after {
        content: "💑";
        font-size: 24px;
        line-height: 1.2;
    }

    /* Ensure chat button remains accessible */
    .freshchat-button {
        bottom: 20px !important;
        right: 20px !important;
    }
}

/* Modal Responsiveness */
@media (max-width: 600px) {
    .quiz-content {
        width: 90%;
        top: 50%;
        transform: translate(-50%, -50%);
        max-height: 90vh;
        overflow-y: auto;
    }

    .quiz-title {
        font-size: 1.2rem;
    }

    .quiz-description {
        font-size: 0.9rem;
    }

    .quiz-button {
        width: 100%;
        padding: 12px;
    }
}

/* Z-index Management */
.quiz-floating-btn {
    z-index: 9998;
    /* Below chat button */
}

.freshchat-button {
    z-index: 9999 !important;
    /* Ensure chat stays on top */
}

.quiz-modal {
    z-index: 10000;
    /* Modal above everything */
}


/* Pricing Page CSS */

.pricing-banner {
    height: 38rem;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    background-image: url('https://static.timelybills.app/public-site/family_budgeting_new/pricing-banner.webp');
    background-size: 100%;
    background-repeat: no-repeat;
    margin-top: 0px;
    padding-top: 180px;
    position: relative;
}

.pricing-banner .pricing-data {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 70rem;
    margin: auto;
}


.pricing-banner .pricing-data p {
    margin: 0;
    color: #4B5563;
    text-align: center;
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 400;
    line-height: 2.3125rem;
    padding: 30px 0
}

.pricing-banner .pricing-data a {
    color: #FFF;
    font-size: 1.28706rem;
    font-style: normal;
    font-weight: 700;
    line-height: 3.86125rem;
    text-transform: capitalize;
    background-color: #007ED2;
    text-decoration: none;
    padding: 0 40px;
    border-radius: 5px;
    display: flex;
    gap: 10px;
}

.pricing-banner .pricing-data>span {
    color: #989898;
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: -0.24px;
    padding-top: 15px;
}

.dollar-top-right {
    position: absolute;
    right: 60px;
    top: 60px;
}

.dollar-top-right img {
    width: 90px;
    height: 96px;
}

.dollar-bottom-left {
    position: absolute;
    left: 60px;
    bottom: 60px;
}

.dollar-bottom-left img {
    width: 134px;
    height: 141px;
}

.money-back-left-part p {
    color: #4B5563;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 37px;
    padding-top: 30px;
    margin: 0;
}

.blue-with-black-text {
    margin: 0;
    color: #2B2B2B;
    text-align: center;
    font-size: 4rem;
    font-style: normal;
    font-weight: 700;
    line-height: 119%;
    letter-spacing: -0.04rem;
}

.blue-with-black-text span {
    color: #007ED2;
}

.money-back-right-part {
    width: 383px;
    height: 410px;
    border-radius: 32px;
    background: #F0F9FF;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    margin-left: auto;
}

.money-back-right-part img {
    height: 463px;
    width: 254px;
}

.money-back-guarantee {
    padding: 60px 0;
}

.pricing-plan .tabs-container {
    display: flex;
    justify-content: center;
    margin: 30px 0 60px;
}

.pricing-plan .tabs-container ul {
    border-radius: 1000px;
    background: #FFF9EE;
    padding: 10px 12px;
    width: auto;
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.pricing-plan.real-time-block .tabs-container ul {
    width: 370px;
}

.pricing-plan .tabs-container ul li {
    padding: 0;
}

.pricing-plan .tabs-container ul li a {
    border: 0 !important;
    padding: 8px 32px;
    border-radius: 170px;
    color: #42526B;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.192px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pricing-plan .tabs-container ul li a.active {
    border: 0 !important;
    background: #FFC759 !important;
    color: #061C3D !important;
}

.discount-tag {
    border-radius: 21px;
    background: #2B2B2B;
    display: flex;
    width: 93px;
    height: 19px;
    padding: 4px 2px;
    justify-content: center;
    align-items: center;
    color: #FFF;
    text-align: center;
    font-size: 10px;
    font-style: normal;
    font-weight: 600;
    line-height: 25.099px;
    letter-spacing: -0.144px;
    margin-left: 10px;
}

.pricing-card-design {
    border-radius: 14.342px;
    border: 1px solid #B9E6FE;
    background: #FFF;
    padding: 22px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.pricing-card-design h4 {
    color: #061C3D;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 25.099px;
    letter-spacing: -0.24px;
    margin: 0;
    display: flex;
    align-items: center;
}

.pricing-card-design .plan-price {
    padding-top: 15px;
    padding-bottom: 0px;
}

.pricing-card-design .plan-price p {
    color: #007ED2;
    text-align: left;
    font-size: 35.856px;
    font-style: normal;
    font-weight: 700;
    line-height: 43.027px;
    letter-spacing: -0.717px;
    margin: 0;
}

.pricing-card-design .plan-price p span {
    color: #42526B;
    text-align: center;
    font-size: 14.342px;
    font-style: normal;
    font-weight: 400;
    line-height: 21.514px;
}

.pricing-card-design .card-desc {
    color: #42526B;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 17.928px;
    padding-bottom: 20px;
}

.pricing-card-design .card-desc p {
    color: #42526B;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 17.928px;
    margin: 0;
    padding-bottom: 6px;
}

.pricing-card-design .plan-feature-list {
    margin: 0;
    padding: 0;
    list-style: none;
    margin-bottom: 20px;
}

.pricing-card-design .plan-feature-list li {
    color: #42526B;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 17.928px;
    padding: 5px 0;
    display: flex;
}

.pricing-card-design .plan-feature-list li span {
    width: 20px;
    min-width: 20px;
    height: 20px;
    border-radius: 89.64px;
    background: #F0F5FF;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #007ED2;
    margin-right: 10px;
}

.pricing-card-design .plan-feature-list li span i {
    font-size: 10px;
}

.pricing-card-design>a {
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 6px;
    border: 1px solid #B9E6FE;
    background: #FFF;
    color: #007ED2;
    font-size: 14.786px;
    font-style: normal;
    font-weight: 700;
    line-height: 44.359px;
    text-transform: capitalize;
    column-gap: 10px;
    margin-top: auto;
    width: 100%;
}

.pricing-card-design>a:hover {
    background-color: #007ED2;
    color: #fff;
}

.tab-content-container .fade:not(.show) {
    display: none;
}

/* .tab-content-container .tab-pane {
    min-height: 660px;
  } */

.pricing-card-design.active-card {
    background-color: #007ED2;
    border: 1px solid #007ED2;
}

.pricing-card-design.active-card * {
    color: #fff !important;
}

.pricing-card-design.active-card .plan-feature-list li span i {
    color: #007ED2 !important
}

.pricing-card-design.active-card>a {
    color: #007ED2 !important;
}

.pricing-card-design.active-card>a i {
    color: #007ED2 !important;
}

.pricing-card-design.active-card>a:hover {
    background-color: #fff !important;
    color: #007ED2 !important;
}

.pricing-card-design.active-card>a:hover i {
    color: #007ED2 !important;
}

.pricing-card-design.active-card h4 .popular-tag {
    background-color: #fff;
    color: #F09300 !important;
    text-align: center;
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 25.099px;
    letter-spacing: -0.168px;
    padding: 2px 9px;
    border-radius: 40px;
    margin-left: 10px;
    margin-right: 10px;
}



.pro-block {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.pro-block img {
    height: 20px;
}

.real-time-block-para {
    color: #4B5563;
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 37px;
    padding-top: 15px;
}

.million-user-block {
    background: #F5FBFF;
    padding: 60px 0 !important;
}

.million-user-block .million-user-data {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 10px;
}

.million-user-block .million-user-data img {
    height: 48px;
}

.million-user-block .million-user-data h3 {
    color: #2B2B2B;
    text-align: center;
    font-size: 48px;
    font-style: normal;
    font-weight: 700;
    line-height: 119%;
    letter-spacing: -0.48px;
    padding-top: 10px;
    margin: 0;
}

.million-user-block .million-user-data p {
    color: #2B2B2B;
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 119%;
    letter-spacing: -0.24px;
    margin: 0;
}

@media (max-width: 767px) {
    .pricing-banner {
        margin-top: 0;
        padding: 70px 0;
        height: auto;
    }

    .dollar-top-right {
        right: 0;
        top: 0px;
    }

    .dollar-top-right img {
        width: 70px;
        height: 70px;
    }

    .dollar-bottom-left {
        left: 0;
        bottom: 0;
    }

    .dollar-bottom-left img {
        width: 70px;
        height: 70px;
    }

    .pricing-banner .pricing-data {
        max-width: 100%;
    }

    .blue-with-black-text {
        font-size: 36px;
    }

    .pricing-banner .pricing-data>span {
        font-size: 14px;
    }

    .money-back-left-part p {
        font-size: 18px;
        margin-bottom: 40px;
    }

    .money-back-right-part {
        width: 100%;
    }

    .pricing-card-design {
        margin-bottom: 20px;
        height: inherit;
    }

    .pricing-plan .tabs-container ul {
        background: none;
        padding: 0;
    }

    .million-user-block .million-user-data {
        margin-bottom: 60px;
    }

    .million-user-block .million-user-data h3 {
        font-size: 30px;
    }

    .million-user-block .million-user-data p {
        font-size: 18px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .pricing-banner {
        margin-top: 0;
    }

    .money-back-right-part {
        width: 100%;
    }

    .pricing-plan .row {
        row-gap: 30px;
    }

    .connect-with-us-section .row>div:first-child img {
        display: block;
        margin: auto;
    }

    .million-user-block .million-user-data p {
        font-size: 18px;
    }

    .million-user-block .million-user-data h3 {
        font-size: 24px;
    }

    .dollar-top-right {
        top: 30px;
        right: 30px;
    }

    .dollar-bottom-left {
        left: 30px;
        bottom: 30px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .pricing-card-design {
        padding: 15px;
    }
}

.coming-soon-card {
    background: #FFF;
    /* Neutral light gray */
    border: 1px solid #B9E6FE;
    /* Subtle border with light blue tone */
    border-radius: 12px;
    /* Rounded corners */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    /* Soft shadow for depth */
    padding: 20px;
    /* Comfortable spacing */
    max-width: 100%;
    /* Constrain width */
    margin: 30px auto;
    /* Center horizontally with vertical spacing */
    text-align: center;
    /* Align text to the center */
    font-family: 'Arial', sans-serif;
    /* Simple, clean font */
}

.coming-soon-card h4 {
    font-size: 2rem;
    margin-bottom: 10px;
    color: #1a73e8;
}

.coming-soon-card p {
    font-size: 1.5rem;
    font-weight: bolder;
    color: #555;
    line-height: 1.5;
    padding: 10px;
}

.coming-soon-card h4::after {
    content: '';
    display: block;
    width: 60px;
    height: 5px;
    background-color: #ffcc00;
    margin: 10px auto 0;
    border-radius: 14.342px;
    border: 1px solid B9E6FE
}

.feature-section {
    margin-top: 5px;
}

.feature-section h5 {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
}

.plan-feature-list {
    list-style: none;
    padding: 0;
}

.plan-feature-list li {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
    font-size: 14px;
}

.plan-feature-list i {
    color: #28a745;
    margin-right: 8px;
}

.tax-exclusion-p {
    color: #4B5563;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin-top: 0.35rem;
}

.loader {
    border: 4px solid #f3f3f3;
    border-top: 4px solid #3498db;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    animation: spin 2s linear infinite;
    margin: 0 auto;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}


@media (min-width: 768px) and (max-width: 1024px) {
    .budget-family-block {
        padding: 20px 0 30px;
    }
    .budget-family-block .budget-family-content-block h1 {
        font-size: 42px;
    }
    .budget-family-block .budget-family-content-block h4 {
        font-size: 32px;
    }
    .blue-black-text-combination {
        white-space: normal;
        font-size: 38px;
        position: relative;
        z-index: 1;
    }
    .family-budget-essential-block .family-budget-essenttials-cards h5 {
        font-size: 22px;
    }
    .family-budget-simplify-block .family-simplify-card-content {
        position: relative;
        z-index: 1;
    }
    .family-budget-essential-block .family-budget-essenttials-cards p {
        font-size: 16px;
    }
    .family-budget-essential-block .family-budget-essenttials-cards .img-container img {
        margin: auto;
        height: 102px;
        max-width: 100%;
    }
    .family-budget-simplify-block .family-simplify-card-content h4 {
        font-size: 24px;
    }
    .family-budget-simplify-block .family-simplify-card-content p {
        font-size: 18px;
    }
    .extra-para {
        line-height: normal;
    }
    .family-budget-benefit-block .row {
        row-gap: 40px;
    }
    .ornament-icon {
        right: -20px;
    }
    .real-benefitts-block .row {
        row-gap: 30px;
    }
    .real-benefit-card {
        height: 100%;
    }
    .challenge-card h5 {
        font-size: 22px;
    }
    .challenge-card p {
        font-size: 18px;
    }
    .budget-couples-block {
        padding-top: 60px;
    }
    .smarter-budget-block {
        margin-top: 0;
        height: auto;
    }
    .smarter-budget-block .budget-family-content-block {
        margin-top: 0;
    }
    .acheiver-card h5 {
        font-size: 18px;
    }
    .core-features-block div.text-center {
        position: relative;
        z-index: 1;
    }
    .core-features-block .core-feature-card h5 {
        font-size: 22px;
    }
    .core-features-block .core-feature-card span {
        font-size: 18px;
        text-align: center;
    }
    .blue-horizontal-tag {
        white-space: normal;
    }
    .pros-cons-block .pros-cons-list-block ul li span {
        font-size: 18px;
    }
    .key-benefits-block .row {
        row-gap: 30px;
    }
    .key-benefit-cards p {
        font-size: 18px;
    }
    .key-benefit-cards h5 {
        font-size: 20px;
    }
}

.sticky .top-bar+.navbar.fixed-top {
    background-color: transparent !important;
}

.menu-new-bar {
    display: flex;
    justify-content: center !important;
    gap: 100px; /* Controls gap between logo and buttons */
    background: #fff;
    border-radius: 43px;
    box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.12);
    width: max-content !important; /* Make capsule wrap tightly around contents */
    margin: 0 auto; /* Center the capsule on the screen */
}

@media (max-width: 991px) {
    .menu-new-bar {
        width: 90% !important; /* Span most of the mobile screen */
        max-width: 400px; /* Cap width on tablets */
        justify-content: space-between !important; /* Push logo and hamburger to edges */
        gap: 0px; /* Prevent wrapping from large desktop gap */
        padding: 8px 20px !important; /* Balanced mobile padding */
    }
    
    /* Remove the white rectangle wrapper around the island capsule */
    header, 
    nav.navbar,
    .navbar.fixed-top,
    .header-reverse-scroll {
        background-color: transparent !important;
        background: transparent !important;
        box-shadow: none !important;
    }
    
    /* Global linear 3vh spacing strictly for the top banners below navbar */
    .ai-brain-main-banner,
    .pricing-banner,
    .budget-family-block,
    .family-budget-section,
    .main-header-new,
    .budget-real-life-section,
    .budget-couples-block {
        padding-top: calc(80px + 3vh) !important; 
    }

    /* Hide TimelyBills text on small screens */
    .navbar-brand span {
        display: none !important;
    }

    /* Hide the original navbar when the modern mobile menu is open to remove the half-circle on the left */
    body.navbar-collapse-show .navbar {
        opacity: 0 !important;
        pointer-events: none !important;
    }

    /* Show the internal close button inside the mobile drawer and position it at the top right */
    .navbar-collapse-show .navbar-modern-inner .navbar-toggler {
        display: block !important;
        position: absolute !important;
        top: 25px !important;
        right: 25px !important;
        left: auto !important;
        z-index: 10000 !important;
        background: transparent !important;
    }

    /* Make the X (close lines) white so they are perfectly visible on the dark blue background */
    .navbar-collapse-show .navbar-modern-inner .navbar-toggler .navbar-toggler-line {
        background-color: #ffffff !important;
    }
}

.menu-new-container {
    margin: auto !important;
}

.menu-new-bar .nav-link {
    font-size: 16px !important; /* Slightly increased text size */
}

.new-footer-coontainer {
    background-color: #fff !important;
}

.lightt-theme-footer-para {
    color: #7C8A93 !important
}

.new-footer-coontainer .social-icon-style-12 .light li a {
    color: #151819 !important;
}

.footer-application.footer-dark.new-footer-coontainer, .new-footer-coontainer.footer-application.footer-dark a {
    color: #7C8A93 !important;
}

.new-footer-coontainer .links-footer-heading {
    color: #072B4A !important
}

.apple-play-store-block {
    margin-top: 30px !important;
    margin-left: -10px !important;
}
.apple-play-store-block a {

}

.new-footer-coontainer .footer-top {
    padding-bottom: 0 !important;
}

.new-footer-coontainer.footer-application .footer-links-partition {
  display: flex;
  align-items: center;
}
.new-footer-coontainer.footer-application .footer-links-partition img {
    height: 250px !important;
}

.footer-application .footer-links-partition {
    display: flex;
    align-items: center;
}

.menu-new-container .navbar-collapse > ul > li {
    display: flex !important;
    align-items: center !important;
}

.menu-new-container .navbar-collapse > ul > li > i {
    display: flex !important;
    cursor: pointer;
}
.menu-new-container .navbar-collapse > ul > li > a {
    padding: 20px 0 !important;
    margin-right: 10px !important;
}

.new-menu-items {
    width: 600px;
    row-gap: 20px;
    display: flex !important;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-right: 0 !important;
}
.new-menu-items.budgeting-new-menu-items {
   width: 300px;
   flex-direction: column;
}
.new-menu-items.budgeting-new-menu-items li {
    width: 100%;
}
.new-menu-items li {
    display: flex;
    flex-direction: column;
    width: 48%;
}
.new-menu-items li a {
    display: flex !important;
    align-items: center !important;
}
.new-menu-items li a img {
    width: 24px !important;
}
.new-menu-items li a .blue-chip-tag {
    color: #0D8CEE;
    background-color: #EFF9FF;
    padding: 2px 12px;
    border-radius: 48px;
    display: flex;
    font-size: 12px;
    display: inline-block !important;
    font-weight: 500;
    margin-left: 10px;
}
.new-menu-items li p {
    margin: 0;
    padding-left: 32px;
    color: #7C8A93;
    font-size: 14px;
    font-weight: 500;
    position: relative;
    top: -4px
}