@media only screen and (max-width: 767px) {
    .main-nav nav .navbar-nav .nav-item.agent-register a {
        display: inline;
    }

    .content-wrapper {
        padding-top: 40px;
    }

    /* WELCOME PAGE DESIGN   WELCOME PAGE DESIGN  WELCOME PAGE DESIGN  WELCOME PAGE DESIGN  WELCOME PAGE DESIGN  WELCOME PAGE DESIGN  WELCOME PAGE DESIGN  WELCOME PAGE DESIGN */

    .banner .hero-content {
        width: 100%;
        max-width: 100%;
        padding-top: 70px;
    }

    .banner .hero-content .headline {
        padding-inline: 5px;
    }

    .banner .hero-content .headline h1 {
        font-size: 24px;
        line-height: 36px;
    }

    .banner .hero-content .headline p {
        font-size: 14px;
        font-weight: 500;
        line-height: 24px;
        width: 100%;
        color: #010c22;
        margin-top: 30px;
    }

    .banner .hero-content .headline .cta-button {
        padding: 8px 16px;
        margin-top: 20px;
        font-size: 14px;
    }

    .banner .hero-content .hero-cert-bg {
        margin-top: 140px;
    }

    .banner .decorations .button-left {
        display: none;
    }

    .banner .decorations .icon-left1 {
        top: 250px;
        left: 40px;
    }

    .banner .decorations .icon-left2 {
        top: 370px;
        left: 120px;
    }

    .banner .decorations .arrow {
        top: 40%;
        left: 10%;
    }

    .banner .decorations .icon-right1 {
        top: 60px;
        right: 220px;
    }

    .banner .decorations .icon-right3 {
        top: 290px;
        right: 40px;
    }

    .banner .decorations .button-right {
        position: absolute;
        content: "";
        bottom: 220px;
        right: 120px;
    }

    /* General animation timing */
    .banner .decorations img {
        animation-duration: 4.2s;
        animation-timing-function: ease-in-out;
        animation-iteration-count: infinite;
    }

    /* Animation for icon-left1: Rotate continuously */
    @keyframes rotate {
        0% {
            transform: rotate(0deg);
        }

        100% {
            transform: rotate(360deg);
        }
    }

    .banner .decorations .icon-left1 img {
        animation-name: rotate;
    }

    .banner .decorations .arrow img {
        display: block;
        animation: moveLeftRight 4s ease-in-out infinite;
    }

    @keyframes moveLeftRight {
        0% {
            transform: translateX(0);
        }

        50% {
            transform: translateX(40px);
        }

        100% {
            transform: translateX(0);
        }
    }

    /* Animation for icon-left2: Bounce up and down */
    @keyframes bounce {

        0%,
        100% {
            transform: translateY(0);
        }

        50% {
            transform: translateY(-20px);
        }
    }

    .banner .decorations .icon-left2 img {
        animation-name: bounce;
    }

    @keyframes hexagonalMotion {
        0% {
            transform: translate(0, 0);
        }

        16.6% {
            transform: translate(20px, -40px);
        }

        33.2% {
            transform: translate(60px, -40px);
        }

        49.8% {
            transform: translate(80px, 0);
        }

        66.4% {
            transform: translate(60px, 40px);
        }

        83% {
            transform: translate(20px, 40px);
        }

        100% {
            transform: translate(0, 0);
        }
    }

    .banner .decorations .icon-right1 img {
        display: inline-block;
        animation: hexagonalMotion 15s ease-in-out infinite;
    }

    @keyframes scaleAnimation {

        0%,
        100% {
            transform: scale(1);
        }

        50% {
            transform: scale(0.3);
        }
    }

    .banner .decorations .icon-right3 img {
        display: inline-block;
        animation: scaleAnimation 6s ease-in-out infinite;
    }

    /* BRAND  */
    .brand-section {
        padding-top: 30px;
        padding-bottom: 90px;
    }

    .brand-section.brand-section-for-price-plan {
        padding-bottom: 0px;
        position: relative;
    }

    .brand-section .brand-logo-area {
        background-color: #001e14;
        padding: 10px 0;
    }

    .brand-section .brand-logo-area .brand-logo-item h2 {
        color: #99a5a1;
        font-size: 22px;
    }

    .brand-section .brand-logo-area .owl-carousel .owl-item {
        width: 200px !important;
    }

    .brand-logo-slider .brand-logo-item {
        justify-content: center !important;
        align-items: center;
        gap: 40px;
    }

    .brand-section .main-content {
        margin-top: 30px;
    }

    .brand-section .main-content .left h1 {
        font-size: 26px;
        line-height: 42px;
        width: 406px;
    }

    .brand-section .main-content .right {
        display: flex;
        flex-direction: column;
        justify-content: start;
        align-items: start;
        width: 345px;
        margin-top: 30px;
    }

    .brand-section .main-content .right p {
        font-size: 16px;
    }

    .brand-section .main-content .right .pay-plan {
        display: flex;
        justify-content: start;
        align-items: start;
    }

    .brand-section .main-content .right .cta-button {
        padding: 8px 16px;
        z-index: 1;
        font-size: 14px;
    }

    /* TESTIMONIAL  */
    .deco1 {
        display: inline-block;
        animation: rotateImage 4s linear infinite;
    }

    @keyframes rotateImage {
        0% {
            transform: rotate(0deg);
        }

        100% {
            transform: rotate(360deg);
        }
    }

    .testimonial-decoration .deco2 {
        position: absolute;
        content: "";
        top: 100px;
        left: 350px;
    }

    .testimonial-decoration .deco3 {
        position: absolute;
        content: "";
        top: 119px;
        left: 338px;
    }

    .testimonial-area {
        padding-top: 70px;
    }

    .testimonial-image .main-img {
        width: 300px;
    }

    /* PRICING  */
    .pricing-section {
        padding: 70px 0px;
        padding-bottom: 100px;
    }

    .pricing-section .rect-shape img {
        position: absolute;
        width: 100%;
        bottom: 0;
        content: "";
    }

    .pricing-section .section-title {
        font-size: 22px;
        line-height: 25px;
    }

    .pricing-section .sub-title {
        font-size: 13px;
    }

    .pricing-section .pricing-cards {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        gap: 50px;
        margin-top: 40px;
        max-width: 100%;
    }

    .pricing-section .pricing-cards .option {
        border-radius: 8px;
        border: 1px solid #aebbb6;
        padding: 40px 16px 16px 16px;
        border-radius: 8px;
        z-index: 1;
    }

    .pricing-section .pricing-cards .option .option-badge {
        font-size: 12px;
    }

    .pricing-section .pricing-cards .option .type {
        font-size: 13px;
        line-height: 18px;
        font-weight: 500;
    }

    .pricing-section .pricing-cards .option .price {
        font-size: 24px;
        line-height: 24px;
        margin-top: 10px;
    }

    .pricing-section .pricing-cards .option .price .duration {
        font-size: 14px;
        line-height: 24px;
    }

    .pricing-section .pricing-cards .option .price .currency {
        font-size: 14px;
    }

    .pricing-section .pricing-cards .option .payment-info {
        font-family: var(--poppins-font);
        font-size: 16px;
        font-weight: 500;
        line-height: 24px;
        text-align: left;
        color: #010c22;
        margin-top: 20px;
    }

    /* .pricing-section .pricing-cards .option:hover .payment-info {
    color: #fff;
} */

    .pricing-section .pricing-cards .option ul {
        padding-left: 0px !important;
        list-style: none;
        display: flex;
        flex-direction: column;
        gap: 15px;
        padding-bottom: 20px;
    }

    .pricing-section .pricing-cards .option ul li {
        font-size: 12px;
        line-height: 18px;
    }

    .pricing-section .pricing-cards .option .choose-plan {
        padding: 8px 16px;
        font-size: 14px;
    }

    .footer-widget .footer-img h1 {
        font-size: 20px;
        font-weight: 700;
        line-height: 30px;
    }

    .footer-widget p {
        max-width: 258px;
        margin-bottom: 20px;
        color: #d9d9d9;
        font-size: 12px;
    }

    .footer-widget .footer-social-icon .footer-register {
        font-size: 14px;
        padding: 8px 16px;
    }

    .footer-widget .image1 {
        position: relative;
        z-index: 5;

    }

    .footer-widget .image1 img {
        width: 160px;
        position: absolute;
        right: 20px;
        bottom: -80px;
    }

    .footer-widget .holder {
        margin-top: -10px;
        z-index: 1;
        position: relative;
    }

    .footer-widget .holder img {
        height: 85px;
    }

    /* SIGNUP PAGE SINGUP PAGE SIGNUP PAGE SINGUP PAGE SIGNUP PAGE SINGUP PAGE  SIGNUP PAGE SINGUP PAGE SIGNUP PAGE SINGUP PAGE SIGNUP PAGE SINGUP PAGE SIGNUP PAGE SINGUP PAGE SIGNUP PAGE SINGUP PAGE SIGNUP PAGE SINGUP PAGE SIGNUP PAGE SINGUP PAGE SIGNUP PAGE SINGUP PAGE SIGNUP PAGE SINGUP PAGE */
    .sign-in-area {
        padding-top: 50px !important;
        padding-bottom: 40px;
    }

    .sign-in-area .side-image {
        display: flex;
        justify-content: center !important;
    }

    .user-all-img {
        margin-bottom: 0px;
        width: 180px;
    }

    .contact-form {
        padding: 30px 20px 25px 20px;
        width: 100%;
    }

    .contact-form .section-title h2 {
        font-size: 20px;
        line-height: 25px;
    }

    .contact-form .section-title span {
        font-size: 13px;
        line-height: 18px;
    }

    .user-all-form .contact-form .account-desc {
        font-size: 14px;
    }

    /* PLAN PAYMENT METHOD PLAN PAYMENT METHOD PLAN PAYMENT METHOD PLAN PAYMENT METHOD PLAN PAYMENT METHOD PLAN PAYMENT METHOD PLAN PAYMENT METHODPLAN PAYMENT METHOD PLAN PAYMENT METHOD  PLAN PAYMENT METHOD */

    .CAC-content .content .payment-card {
        max-width: 460px;
    }

    .CAC-content .content .payment-card .form-content {
        padding: 16px;
        border-radius: 8px;
        margin-top: 25px;
    }

    .CAC-content .content .payment-card .form-content .type {
        font-family: var(--poppins-font);
        font-size: 14px;
        font-weight: 500;
        line-height: 21px;
        text-align: left;
        color: #010c22;
    }

    .CAC-content .content .payment-card .form-content .price {
        font-size: 24px;
        line-height: 40px;
        margin-top: 10px;
        margin-bottom: 15px;
    }

    .CAC-content .content .payment-card .form-content .price .currency {
        font-size: 14px;
    }

    .payment-card .form-group {
        margin-bottom: 20px;
        position: relative;
    }

    .payment-card .form-group .bank-logo {
        position: absolute;
        top: 42px;
        right: 20px;
    }

    .payment-card .after-payment {
        padding: 8px 16px;
        margin-top: 10px;
        font-size: 14px;
        font-weight: 500;
        margin-top: 20px;
    }

    .payment-card .timer {
        margin-bottom: 60px;
        margin-top: 10px;
    }

    .payment-card .timer span {
        font-weight: 500;
    }

    /* SUCCESSFUL PAYMENT MODAL  */
    .successful-payment-modal .body-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        padding-top: 20px;
    }

    .successful-payment-modal .body-content img {
        width: 300px;
    }

    .successful-payment-modal .body-content h2 {
        font-size: 18px;
        line-height: 22px;
    }

    .successful-payment-modal .body-content p {
        font-size: 12px;
        line-height: 18px;
        margin-bottom: 30px;
    }

    /* LIABILITY PLAN PAGE  */
    .liability-plan {
        max-width: 100%;
        margin-top: 30px;
    }

    .liability-plan .form-group {
        margin-bottom: 20px;
        position: relative;
    }

    .liability-plan .info-section h2 {
        font-size: 14px;
    }

    .liability-plan .info-section p {
        font-size: 12px;
    }

    .liability-plan .info-section .payment-plans {
        background: #e6f9f2;
        border: 1.5px solid #007a4f;
        padding: 16px;
        border-radius: 8px;
        margin-top: 20px;
        display: flex;
        flex-direction: column;
        gap: 18px;
    }

    .liability-plan .continue-btn {
        margin-bottom: 60px !important;
    }

    /* CAC PLAN REGIGRATION  CAC PLAN REGIGRATION CAC PLAN REGIGRATION CAC PLAN REGIGRATION CAC PLAN REGIGRATION CAC PLAN REGIGRATION CAC PLAN REGIGRATION CAC PLAN REGIGRATION CAC PLAN REGIGRATION CAC PLAN REGIGRATION CAC PLAN REGIGRATION CAC PLAN REGIGRATION CAC PLAN REGIGRATION */
    .CAC-content .content {
        display: grid;
        grid-template-columns: 1fr;
    }

    .CAC-content .content .right {
        background: #f4fffb;
        padding: 40px 30px;
    }

    .faq-accordion .accordion .accordion-title {
        font-size: 14px;
    }

    .faq-accordion .accordion .accordion-content p {
        line-height: 22px;
        font-size: 13px !important;
    }

    .CAC-content .content .right .section-title span {
        font-family: var(--cabinet-font);
        font-size: 20px;
        font-weight: 700;
        line-height: 24.8px;
        text-align: left;
    }

    .CAC-content .content .right .faq-content {
        margin-top: 30px;
    }

    .CAC-content .content .left {
        padding-inline: 15px;
        padding-top: 55px;
    }

    .CAC-content .content .left .left-title h2 {
        font-family: var(--cabinet-font);
        font-size: 20px;
        line-height: 25px;
    }

    .CAC-content .content .left .left-title .sub-title {
        font-size: 13px;
        line-height: 18px;
    }

    .CAC-content .steps-container {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-top: 25px;
    }

    .CAC-content .steps-container .step {
        display: flex;
        align-items: center;
        gap: 3px;
        color: #99a5a1;
    }

    .CAC-content .steps-container .step.active {
        color: #010307;
    }

    .CAC-content .steps-container .step-number {
        width: 15px;
        height: 15px;
        font-size: 9px;
    }

    .CAC-content .steps-container .step.active .step-label {
        color: #010307;
    }

    .CAC-content .steps-container .step.active .step-number {
        background-color: #00be7c;
        color: #fff;
    }

    .CAC-content .steps-container .step-label {
        font-size: 11px;
    }

    .CAC-content .plan-card {
        width: 100%;
        max-width: 600px;
        background: #fbfbfb;
        border-radius: 8px;
        padding: 20px;
        font-family: "Poppins", serif;
        margin-top: 30px;
    }

    .CAC-content .plan-card .plan-header h2 {
        font-size: 24px;
        font-weight: 600;
        text-align: left;
        margin-bottom: 0px;
    }

    p {
        margin-bottom: 0px;
    }

    .CAC-content .plan-card .plan-subheader {
        display: flex;
        justify-content: space-between;
        align-items: end;
    }

    .CAC-content .plan-card .plan-subheader .plan-type {
        font-size: 14px;
        font-weight: 500;
        line-height: 24px;
        margin-bottom: 0px !important;
    }

    .CAC-content .plan-card .plan-subheader .next-pay-btn {
        border-radius: 25px;
        padding: 8px 14px;
        font-size: 12px;
        cursor: pointer;
    }

    .CAC-content .plan-card .progress-container {
        display: flex;
        align-items: center;
        width: 100%;
        max-width: 290px;
        margin-block: 35px;
    }

    .CAC-content .plan-card .progress-container .progress-bar {
        width: 100%;
        height: 6px;
        margin-right: 10px;
    }

    .CAC-content .plan-card .progress-container .progress-text {
        font-size: 10px;
        font-weight: 500;
        text-align: left;
    }

    .CAC-content .plan-card .amount-details {
        display: flex;
        justify-content: space-between;
        margin-top: 20px;
    }

    .CAC-content .plan-card .amount-details:last-child {
        padding-right: 10px;
    }

    .CAC-content .plan-card .amount-details .amount-item p:first-child {
        font-size: 10px;
        font-weight: 500;
    }

    .CAC-content .plan-card .amount-details .amount-item p:last-child {
        font-size: 14px;
    }

    .CAC-content .payment-breakdown-card {
        width: 100%;
        max-width: 100%;
        padding-block: 24px;
        padding-bottom: 0px;
        padding-inline: 3px;
    }

    .CAC-content .payment-title {
        font-size: 12px;
        font-weight: 500;
    }

    .CAC-content .payment-breakdown-card .payment-table {
        width: 100%;
        border-collapse: collapse;
        margin-bottom: 20px;
    }

    .CAC-content .payment-table th {
        text-align: left;
        color: #2d3130;
        padding-bottom: 10px;
        font-size: 12px;
        padding-right: 0px;
        padding-inline-start: 10px;
    }

    .CAC-content .payment-table td {
        padding: 20px 10px;
        font-size: 12px;
        font-weight: 500;
        line-height: 24px;
    }

    .CAC-content .payment-table td.active {
        color: #010307;
    }

    .CAC-content .payment-table td .circle {
        display: inline-flex;
        justify-content: center;
        align-items: center;
        width: 20px;
        height: 20px;
        color: #fff;
        border-radius: 50%;
        font-size: 10px;
        margin-right: 12px;
        background: #99a5a1;
    }

    .CAC-content .payment-table td .paid.circle {
        background: #00be7c !important;
    }

    .CAC-content .payment-table td .status-paid {
        color: #00be7c;
    }

    .CAC-content .continue-btn {
        padding: 8px 16px;
        margin-top: 30px;
        font-size: 14px;
        margin-bottom: 20px;
    }

    /* SELECT PLAN  */
    .pricing-container {
        margin-top: 40px;
    }

    .pricing-container .pricing-header {
        font-family: var(--poppins-font);
        font-size: 18px;
        font-weight: 500;
        line-height: 27px;
        text-align: left;
        color: #1e1e1e;
        margin-bottom: 30px;
        display: none;
    }

    .pricing-container .pricing-options {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        row-gap: 30px;
        width: 100%;
        max-width: 500px;
    }

    .pricing-container .pricing-options .pricing-option {
        width: 100%;
        display: flex;
        gap: 15px;
    }

    .pricing-container .pricing-options .pricing-option .pricing-content {
        padding: 40px 16px 16px 16px;
    }

    .pricing-container .pricing-options .pricing-content .tag {
        padding: 2px 8px;
        font-size: 12px;
    }

    .pricing-container .pricing-options .pricing-content .type {
        font-size: 12px;
    }

    .pricing-container .pricing-options .pricing-content .price {
        font-size: 24px;
    }

    .pricing-container .pricing-options .pricing-content .price .currency {
        font-size: 14px;
    }

    .pricing-container .pricing-options .pricing-content .price .duration {
        font-size: 14px;
    }

    .pricing-container .pricing-options .pricing-content .payment-info {
        font-size: 14px;
        line-height: 21px;
    }

    .pricing-container .pricing-options .pricing-content hr {
        margin: 0.5rem 0;
    }

    .pricing-container .pricing-options .pricing-content ul {
        padding-left: 15px !important;
        display: flex;
        flex-direction: column;
        margin-top: 10px;
        margin-bottom: 0px;
    }

    .pricing-container .pricing-options .pricing-content ul li {
        font-size: 12px;
        line-height: 18px;
    }

    .pricing-container .pricing-option .radio-btn {
        margin-top: 25px;
    }

    .pricing-container .pricing-option .radio-btn {
        margin-top: 25px;
    }

    .pricing-container .pricing-option .radio-btn input[type="radio"] {
        width: 18px;
        height: 18px;
    }

    /* PERSONAL DETAILS PERSONAL DETAILS PERSONAL DETAILS PERSONAL DETAILS PERSONAL DETAILS PERSONAL DETAILS PERSONAL DETAILS PERSONAL DETAILS PERSONAL DETAILS PERSONAL DETAILSPERSONAL DETAILS PERSONAL DETAILS PERSONAL DETAILS PERSONAL DETAILS PERSONAL DETAILS */

    .personal-details {
        width: 100%;
        margin-top: 55px;
        padding-bottom: 60px;
    }

    .personal-details .title h2 {
        font-size: 20px;
        line-height: 25px;
    }

    .steps-container {
        display: flex;
        flex-wrap: wrap;
    }

    .personal-details .steps-container {
        display: flex;
        align-items: center;
        gap: 15px;
        margin-top: 25px;
        position: relative;
        flex-wrap: wrap;
    }

    .personal-details .steps-container .step {
        display: flex;
        align-items: center;
        gap: 10px;
        color: #99a5a1;
    }

    .personal-details .steps-container .step.active {
        color: #010307;
    }

    .personal-details .steps-container .step.active .step-number {
        background-color: #00be7c;
        color: #fff;
    }

    .personal-details .steps-container .step-number {
        width: 15px;
        height: 15px;
        display: flex;
        font-size: 10px;
        font-weight: 500;
    }

    .personal-details .steps-container .step.active .step-label {
        color: #010307;
    }

    .personal-details .steps-container .step-label {
        font-size: 10px;
        font-weight: 500;
        text-align: left;
    }

    .personal-details .save-to-continue-later {
        padding: 8px 16px;
        font-size: 14px;
        margin-left: 0px;
        position: absolute;
        right: 10px;
        top: 45px;
    }

    .personal-details .form-details {
        margin-top: 100px;
        display: flex;
        gap: 40px;
        flex-direction: column;
        max-width: 930px;
    }

    .personal-details .form-details .information h5 {
        font-family: var(--poppins-font);
        font-size: 14px;
    }

    .personal-details .form-details .information .content {
        padding: 15px;
        border-radius: 12px;
        background: #fbfbfb;
    }

    .personal-details .form-details .information .content .form-group label {
        font-family: var(--poppins-font);
        font-size: 14px;
        font-weight: 500;
        line-height: 21px;
        text-align: left;
        color: #1e1e1e;
    }

    .personal-details .form-details .information .content .form-group .form-control {
        height: 50px;
        color: #1e1e1e;
        background-color: #ffffff;
        border-radius: 0;
        font-size: 14px;
        padding: 10px;
        width: 100%;
        border-radius: 8px;
        border: 1px solid #aebbb6;
    }

    .custom-file-label {
        padding: 10px 15px;
        border: 1px solid #aebbb6;
        height: 50px;
    }

    .personal-details .btn-continue {
        padding: 8px 16px;
        font-size: 14px;
        width: 100%;
    }





    /* SERVICES PAGE CSS  */
    .service-wrapper {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        column-gap: 25px;
        row-gap: 15px;
        padding-inline: 20px;
    }

    .section-title span {
        font-size: 14px;
    }



    /* my services  */
    .my-services {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        column-gap: 30px;
        row-gap: 30px;
    }

    .price-width {
        margin-top: 35px;
        max-width: 100%;
        padding: 50px 5px 20px 5px;
    }


    .pricing-card .pricing-card-into {
        padding: 0 15px 20px;
    }

    .pricing-card .pricing-card-into h3 {
        font-size: 14px;
        padding: 7px 3px;
    }

    .pricing-card .price-rate span {
        font-size: 12px;
    }

    .pricing-card .view-info-btn {
        padding: 8px 16px;
        font-size: 14px;
    }

    .register-agent-button a {
        display: none !important;
    }
}