/*1025-1199*/
@media only screen and (min-width: 1025px) and (max-width: 1199px) {
    .bg-light.border.rounded-3.d-flex.align-items-center.justify-content-center.p-3.h-100 {
        height: 105px !important;
    }
}

/*992-1024*/
@media only screen and (min-width: 992px) and (max-width: 1024px) {

    .bg-light.border.rounded-3.d-flex.align-items-center.justify-content-center.p-3.h-100 {
        height: 105px !important;
    }
}

/*768-991*/
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .step::before {
        content: "";
        position: absolute;
        top: 50%;
        left: -34.5%;
        width: 100%;
    }

    .cmnimg img {
        width: 85%;
        text-align: center;
    }

    .supplier-option {
        padding: 0px !important;
    }

    .step_2 {
        padding: 5px 20px;
    }

    .imgdiv {
        max-width: 71%;
        width: 50%;

    }

}

/*576-767*/
@media only screen and (min-width: 576px) and (max-width: 767px) {
    .step::before {
        left: -29.5%;
        width: 100%;

    }

    .supplier-option {
        padding: 0px !important;
    }

    .step_2 label {
        font-size: 14px;
    }

    .step_2 {
        padding: 5px 20px;
    }

    .imgs {
        flex-direction: column;
    }

    .imgdiv {
        width: 100%;
        max-width: 96%;
        margin: auto;
    }

    .imgoverlaytext {
        width: 100%;
        padding-right: 48px !important;
    }

    .imgoverlaytext p {
        justify-content: end;
    }

    div#imagedivava {
        width: 100%;
    }

    section.background-gradient.px-4.pt-5.pb-5.px-sm-5.pt-sm-5.pt-md-5.pb-md-5 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .d-flex.justify-content-between.align-items-center.faq-header p {
        font-size: 16px !important;
    }
}

/*480-575*/
@media only screen and (min-width: 480px) and (max-width: 575px) {
    .step::before {
        left: -26%;
        width: 100%;

    }

    .supplier-option {
        padding: 10px !important;
    }

    .step_2 label {
        font-size: 14px;
    }

    .step_2 {
        padding: 5px 20px;
    }

    .imgs {
        flex-direction: column;
    }

    .imgdiv {
        width: 100%;
        max-width: 96%;
        margin: auto;
    }

    .imgoverlaytext {
        width: 100%;
        padding-right: 48px !important;
    }

    .imgoverlaytext p {
        justify-content: end;
    }

    div#imagedivava {
        width: 100%;
    }

    section.background-gradient.px-4.pt-5.pb-5.px-sm-5.pt-sm-5.pt-md-5.pb-md-5 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .d-flex.justify-content-between.align-items-center.faq-header p {
        font-size: 16px !important;
    }
}

/*425-479*/
@media only screen and (min-width: 425px) and (max-width: 479px) {
    .step::before {
        left: -23%;
        width: 100%;

    }

    .supplier-option {
        padding: 0px !important;
    }

    .step_2 label {
        font-size: 14px;
    }

    .step_2 {
        padding: 5px 20px;
    }

    .card {
        width: 100%;
    }

    img.imggase {
        width: 100%;
    }

    button.btn.btn-success.btn-lg.px-5.rounded-pill.shadow-sm.d-inline-flex.align-items-center.gap-2 {
        font-size: 18px;
    }

    .txt {
        width: 96%;
    }

    .thankyou {
        width: 100%;
    }

    .imgs {
        flex-direction: column;
    }

    .imgdiv {
        width: 100%;
        max-width: 96%;
        margin: auto;
    }

    .imgoverlaytext {
        width: 100%;
        padding-right: 48px !important;
    }

    .imgoverlaytext p {
        justify-content: end;
    }

    div#imagedivava {
        width: 100%;
    }

    section.background-gradient.px-4.pt-5.pb-5.px-sm-5.pt-sm-5.pt-md-5.pb-md-5 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .d-flex.justify-content-between.align-items-center.faq-header p {
        font-size: 16px !important;
    }

}

/*375-424*/
@media only screen and (min-width: 375px) and (max-width: 424px) {

    .step::before {
        left: -20%;
        width: 100%;

    }

    .supplier-option {
        padding: 0px !important;
    }

    .step_2 label {
        font-size: 14px;
    }

    .step_2 {
        padding: 5px 10px;
    }

    .col-6.col-md-4.pay_col {
        width: 100%;
        margin-top: 11px;
    }

    .card {
        width: 100%;
    }

    img.imggase {
        width: 100%;
    }

    button.btn.btn-success.btn-lg.px-5.rounded-pill.shadow-sm.d-inline-flex.align-items-center.gap-2 {
        font-size: 18px;
    }

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



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

    .txt {
        width: 96%;
    }

    .thankyou {
        width: 100%;
    }

    .imgs {
        flex-direction: column;
    }

    .imgdiv {
        width: 100%;
        max-width: 96%;
        margin: auto;
    }

    .imgoverlaytext {
        width: 100%;
        padding-right: 48px !important;
    }

    .imgoverlaytext p {
        justify-content: end;
    }

    div#imagedivava {
        width: 100%;
    }

    section.background-gradient.px-4.pt-5.pb-5.px-sm-5.pt-sm-5.pt-md-5.pb-md-5 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .d-flex.justify-content-between.align-items-center.faq-header p {
        font-size: 16px !important;
    }
}


/*320-374*/
@media only screen and (min-width: 320px) and (max-width: 374px) {

    .txt {
        width: 96%;
    }

    .step::before {
        left: -13%;
        width: 100%;

    }

    .supplier-option {
        padding: 0px !important;
    }

    .step_2 label {
        font-size: 11px;
    }

    .step_2 {
        padding: 5px 5px;
    }

    .step_3 label {
        padding: 10px;
    }

    .step_2 label {
        padding: 10px;
    }

    .col-6.col-md-4.pay_col {
        width: 100%;
        margin-top: 11px;
    }

    .card {
        width: 100%;
    }

    img.imggase {
        width: 100%;
    }

    button.btn.btn-success.btn-lg.px-5.rounded-pill.shadow-sm.d-inline-flex.align-items-center.gap-2 {
        font-size: 16px;
    }

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

    .thankyou {
        width: 100%;
    }

    .imgs {
        flex-direction: column;
    }

    .imgdiv {
        width: 100%;
        max-width: 96%;
        margin: auto;
    }

    .imgoverlaytext {
        width: 100%;
        padding-right: 48px !important;
    }

    .imgoverlaytext p {
        justify-content: end;
    }

    div#imagedivava {
        width: 100%;
    }

    section.background-gradient.px-4.pt-5.pb-5.px-sm-5.pt-sm-5.pt-md-5.pb-md-5 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .d-flex.justify-content-between.align-items-center.faq-header p {
        font-size: 16px !important;
    }
}









/* Mobile devices only */
@media (max-width: 768px) {
    .top_content {
        width: 100%;
    }

    .form {
        width: 100%;
        padding: 24px 5px;
    }

    /* top content */
    h2.cmn_h2 {
        font-size: 21px;
    }

    /* progress div */
    .circle {
        width: 35px;
        height: 35px;
        font-size: 14px;
    }


    /* cmn p */
    p.cmnp {
        font-size: 20px;
    }




    .option {
        display: inline-block;
        margin: 10px;
        width: 43%;
    }

    .radio-card span {
        font-size: 14px;
    }

    .radio-card .name_checkbox {
        flex-direction: column;
    }

    .radio-card .checkmark {
        width: 18px;
        height: 18px;
    }

    .radio-card {
        padding: 0.5rem;
    }

    img.electricityimg {
        width: 60px !important;
        height: 60px !important;
    }

    .step_3 label {
        padding: 10px;
    }

    .step_2 label {
        padding: 10px;
    }

    .cmncssforstepdiv {
        padding: 5px 10px;
    }

    .hero-section h1 {
        font-size: 27px;
    }

    .cardsectionwhy {
        background-color: #F5EEFF;
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    .d-flex.bg-white.rounded.p-4.p-lg-5.h-100 {
        padding: 20px !important;
    }

    span.text-muted {
        font-size: 15px !important;
    }

    .col-12 span.fw-bold {
        font-size: 19px !important;
    }

    .faq-item.mb-4.bg-white.rounded-3.px-4.py-4.shadow-faq {
        padding: 16px 10px !important;
        border: 1px solid #0000001f;
    }

    nav.navbar.navbar-expand-md.bg-white.px-4.py-3 {
        padding: 15px 5px !important;
    }
    .d-flex.flex-column.flex-md-row.justify-content-center.gap-3.mb-4.animate__animated.animate__slideInUp {
    margin: 5px 18px;
}

.d-flex.flex-column.flex-md-row.justify-content-center.gap-3.mb-4.animate__animated.animate__slideInUp a {
    font-size: 17px;
}
span.fw-semibold.fs-5 {
    font-size: 14px !important;
}

span.fs-6 {
    font-size: 13px !important;
}
}