/* ===== Responsive CSS last modified by NK on 04-05-2023 at 10:19 Hours ===== */

/* For medium-sized phones/small tablets */
@media only screen and (max-width: 721px) {
    section.banner-and-header .banner-bg-wrapper {
        height: 52em;
    }

    section.banner-and-header article.custom-navbar {
        padding: 1em 2em;
    }

    section.banner-and-header article.custom-navbar .infiflex-logo-wrapper img.infiflex-logo {
        width: 13em;
    }

    section.banner-and-header article.custom-navbar .navbar-icon-links-wrapper {
        gap: 1.5em;
    }

    section.banner-and-header article.custom-navbar .navbar-icon-links-wrapper .call-button-wrapper i {
        margin-right: 0.3em;
        font-size: 1.4em;
    }

    section.banner-and-header article.custom-navbar .navbar-icon-links-wrapper .call-button-wrapper a {
        bottom: 2px;
        font-size: 1.2rem;
    }

    section.banner-and-header .banner-bg-wrapper article.banner-text-content {
        left: 2em;
        width: 80%;
        top: 6em;
    }

    section.banner-and-header article.banner-text-content p.banner-note {
        font-size: 1.5em;
    }

    section.banner-and-header article.banner-text-content .digital-line-banner {
        width: 10%;
        height: 3px;
    }

    section.banner-and-header article.banner-text-content h1.banner-text-main-heading {
        font-size: 3.5em;
        letter-spacing: -1px;
        margin: 0.75em 0;
        width: auto;
    }

    section.banner-and-header article.banner-text-content h1.banner-text-main-heading .banner-span {
        letter-spacing: -1.75px;
    }

    section.banner-and-header article.banner-text-content p {
        margin-bottom: 0.75em;
        line-height: 1.5;
        font-size: 1.5em;
        letter-spacing: -0.5px;
    }

    section.banner-and-header article.banner-text-content button.banner-button {
        padding: 0.5em 1em;
        font-size: 1.2em;
        width: 40vw;
    }

    section.banner-and-header article.banner-text-content ul.banner-points i {
        font-size: 0.8em;
        right: 2.2em;
        top: 1.7em;
    }

    section.banner-and-header article.banner-text-content ul.banner-points li {
        font-size: 1em;
    }

    section.about-infiflex-startpro .section-main-content p.sub-header::before {
        width: 10%;
        height: 3px;
    }

    section.about-infiflex-startpro .section-main-content p.main-para {
        font-size: 1em;
        letter-spacing: 0.4px;
    }

    section.startpro-features .upper article.background-wrapper {
        height: 95vh;
    }

    section.startpro-features .lower article.background-wrapper {
        height: 100vh;
    }

    section.startpro-features .upper .green-bg-wrapper {
        width: 45vw;
        left: 0;
        height: 35vh;
    }

    section.startpro-features .lower .green-bg-wrapper {
        width: 45vw;
        left: 21em;
        height: 35vh;
        top: 2em;
    }

    section.startpro-features article.text-content h3.colored-heading {
        font-size: 1.75em;
    }

    section.startpro-features article.text-content p {
        font-size: 1em;
        margin-bottom: 2em;
    }

    section.startpro-features .upper .green-bg-wrapper article.startpro-features-img-wrapper {
        top: 1.5em;
        left: 6.5em;
    }

    section.startpro-features .lower .green-bg-wrapper article.startpro-features-img-wrapper {
        top: 1.5em;
        right: 2em;
    }

    section.startpro-features .upper .green-bg-wrapper article.startpro-features-img-wrapper img {
        width: 80%;
    }

    section.startpro-features .lower .green-bg-wrapper article.startpro-features-img-wrapper img {
        width: 75%;
    }

    section.startpro-features .upper article.text-content {
        width: 90%;
        left: 2em;
        top: 6em;
    }

    section.startpro-features .lower article.text-content {
        position: relative;
        left: 2em;
        width: 90%;
        top: 2em;
    }

    section.prices .price-card-wrapper {
        justify-content: center;
        gap: 10em;
    }

    section.prices .price-card-wrapper article.price-cards {
        width: auto;
        height: 36em;
    }

    section.prices .price-card-wrapper article.price-cards ul.what-you-get-list {
        margin-top: 2em;
    }

    ul.what-you-get-list li {
        bottom: 1.9em;
    }

    section.prices .price-card-wrapper article.price-cards button.buy-package {
        left: 10%;
        width: 80%;
        top: 3em;
    }

    section.prices .bottom-row {
        margin-top: 12em;
    }

    section.prices .bottom-row p.bottom-info::before {
        width: 10%;
        height: 3px;
    }

    section.prices .bottom-row button.request-quote {
        width: 60%;
    }

    section.testimonials article.heading-colored-wrapper {
        padding: 2em;
        left: 0;
        width: 55vw;
        height: 50vh;
    }

    section.testimonials article.heading-colored-wrapper h2 {
        font-size: 2.5em;
    }

    section.testimonials article.heading-colored-wrapper h2::before {
        width: 20%;
        height: 3px;
        top: 3rem;
    }

    section.testimonials article.main-carousel-content {
        bottom: 17em;
        left: 0;
    }

    section.testimonials article.main-carousel-content #testimonialOwlCarousel .owl-items-container {
        gap: 0.5em;
    }

    section.testimonials .owl-items-container .testimonial-card-wrapper {
        padding: 1em;
    }

    section.testimonials .testimonial-card-wrapper h3.card-title {
        letter-spacing: 0;
        font-size: 1.2em;
    }

    section.testimonials .testimonial-card-wrapper h5.company-name {
        font-size: 1.25rem;
        font-weight: 600;
        letter-spacing: 0.3px;
    }

    section.testimonials .testimonial-card-wrapper p.actual-testimonial-text {
        font-size: 1rem;
        line-height: 1.5;
        letter-spacing: 0.2px;
    }

    section.faqs {
        margin-top: -5em;
    }

    section.faqs h4.panel-title a {
        padding: 1.5em;
        padding-right: 3em;
        padding-right: 1.5em;
        font-size: 1em;
        letter-spacing: 0.3px;
        line-height: 1.5;
    }

    section.faqs #accordion .panel-heading a::before {
        right: 10px;
        top: 1.4rem;
    }

    section.faqs .lower-row .panel .panel-body {
        font-size: 1.2rem;
        padding: 1.5em;
        line-height: 1.6;
        letter-spacing: 0.1px;
    }

    section.new-footer-design {
        padding: 4em 2em;
    }

    section.new-footer-design .left-column,
    section.new-footer-design .center-column {
        margin-bottom: 5em;
    }

    section.new-footer-design .left-column img.infiflex-logo-dark-bg {
        width: 70%;
    }

    section.new-footer-design .left-column article.infiflex-logo-wrapper-and-copyright-text p {
        text-align: left;
        top: 2em;
    }

    section.new-footer-design .center-column article.large-icon-links .large-icon-wrapper {
        justify-content: flex-start;
    }

    section.new-footer-design .center-column article.large-icon-links ul.terms-and-conditions-links {
        justify-content: flex-start;
        top: 2em;
    }

    a.map-location ion-icon {
        font-size: 2.2em;
        left: -4px;
        top: 1.2em;
    }

    ul.address-phone-email-lists li {
        margin-left: 3em;
        bottom: 1px;
    }

    span.display-block {
        display: inline;
    }
}

/* For mobile devices :- */
@media only screen and (max-width: 490px) {
    a.custom-hover-animation::after {
        height: 2px !important;
        bottom: -4px !important;
    }

    section.banner-and-header article.custom-navbar {
        padding: 1rem;
    }

    section.banner-and-header article.custom-navbar .infiflex-logo-wrapper img.infiflex-logo {
        width: 8em;
    }

    section.banner-and-header article.custom-navbar .navbar-icon-links-wrapper {
        gap: 1em;
    }

    section.banner-and-header article.custom-navbar .navbar-icon-links-wrapper .call-button-wrapper i {
        margin-right: 0;
        font-size: 0.9em;
    }

    section.banner-and-header article.custom-navbar .navbar-icon-links-wrapper .call-button-wrapper a {
        bottom: 1px;
        font-size: 1rem;
    }

    section.banner-and-header .banner-bg-wrapper article.banner-text-content {
        left: 1em;
        width: 90%;
        top: 5em;
    }

    section.banner-and-header article.banner-text-content p.banner-note {
        font-size: 1.25em;
    }

    section.banner-and-header article.banner-text-content .digital-line-banner {
        width: 15%
    }

    section.banner-and-header article.banner-text-content h1.banner-text-main-heading {
        font-size: 3em;
        letter-spacing: -1px;
        margin: 0.5em 0;
    }

    section.banner-and-header article.banner-text-content p {
        font-size: 1.3em;
    }

    section.banner-and-header article.banner-text-content ul.banner-points {
        width: auto;
        margin-bottom: 3em;
    }

    section.banner-and-header article.banner-text-content ul.banner-points i {
        right: 2.5em;
    }

    section.banner-and-header article.banner-text-content ul.banner-points li {
        margin-left: -0.5em;
    }


    section.banner-and-header article.banner-text-content button.banner-button {
        font-size: 1em;
        width: 50vw;
    }

    section.about-infiflex-startpro .section-main-content h2.main-header {
        letter-spacing: -0.5px;
    }

    section.about-infiflex-startpro .section-main-content p.sub-header::before {
        width: 15%;
        left: 44%;
    }

    section.startpro-features .upper article.background-wrapper {
        height: 90vh;
    }

    section.startpro-features .upper .green-bg-wrapper {
        width: 50vw;
        height: 25vh;
    }

    section.startpro-features .upper .green-bg-wrapper article.startpro-features-img-wrapper {
        top: 2em;
        left: 3em;
    }

    section.startpro-features .upper .green-bg-wrapper article.startpro-features-img-wrapper img {
        width: auto;
    }

    section.startpro-features .upper article.text-content {
        width: 90%;
        left: 1em;
        top: 10em;
    }

    section.startpro-features article.text-content h3.colored-heading {
        font-size: 1.5em;
    }

    section.startpro-features article.text-content p {
        font-size: 1.3rem;
    }

    section.startpro-features .lower article.background-wrapper {
        width: 95%;
    }

    section.startpro-features .lower .green-bg-wrapper {
        width: 60vw;
        left: 14em;
        height: 30vh;
        top: 1em;
    }

    section.startpro-features .lower .green-bg-wrapper article.startpro-features-img-wrapper {
        top: 2em;
        right: 4em;
    }

    section.startpro-features .lower .green-bg-wrapper article.startpro-features-img-wrapper img {
        width: 80%;
    }

    section.startpro-features .lower article.text-content {
        left: 1em;
        top: 1em;
    }

    section.prices .price-card-wrapper article.price-cards {
        height: 36em;
        padding: 1.5em;
    }

    section.prices .price-card-wrapper article.price-cards button.buy-package {
        left: 5%;
        width: 90%;
        top: 2em;
    }

    section.prices .bottom-row {
        margin-top: 13em;
    }

    section.prices .bottom-row p.bottom-info::before {
        width: 15%;
        left: 43%;
    }

    section.prices .bottom-row button.request-quote {
        width: 80%;
    }

    section.testimonials article.heading-colored-wrapper {
        width: 70vw;
        height: 45vh;
    }

    section.testimonials article.heading-colored-wrapper h2 {
        font-size: 2em;
    }

    section.testimonials article.main-carousel-content {
        left: 1em;
    }

    section.faqs {
        margin-top: -1em;
    }

    section.faqs h4.panel-title a {
        font-size: 1.5rem;
        letter-spacing: 0;
        padding: 1em;
        padding-right: 3em;
    }

    section.faqs #accordion .panel-heading a::before {
        right: 5px;
        top: 2rem;
        font-size: 1.5em;
    }

    section.faqs .lower-row .panel .panel-body {
        padding: 1em;
        line-height: 1.7;
        letter-spacing: 0.2px;
    }

    section.new-footer-design {
        padding: 2em 0.5em;
    }

    section.new-footer-design .center-column article.large-icon-links .large-icon-wrapper {
        gap: 1.3em;
    }

    section.new-footer-design .center-column article.large-icon-links .large-icon-wrapper a {
        width: 3.9em;
        padding: 10px;
    }

    section.new-footer-design .center-column article.large-icon-links .large-icon-wrapper ion-icon {
        font-size: 2em;
        top: 2.5px;
        left: 3.5px;
    }

    section.new-footer-design .center-column article.large-icon-links ul.terms-and-conditions-links {
        gap: 2em;
        font-size: 1.2rem;
    }

    section.new-footer-design .right-column article.address-and-other-text ul.address-phone-email-lists {
        margin-bottom: 2em;
    }
}