/* ===== RESPONSIVE CSS ===== */

/* ===== EXTRA SMALL DEVICES (up to 420px) ===== */
@media only screen and (max-width: 420px) {
    body {
       overflow-x: hidden;
   }

   .section {
       padding: 30px 0 !important;
   }

   .container-fluid.px-5 {
       padding: 0 15px !important;
   }

   .dashboard-section {
        padding: 10px;
        margin-bottom: 0px;
    }

   br {
       display: none;
   }

   .banner-title {
       font-size: 25px !important;
       line-height: 30px !important;
       letter-spacing: 0px;
   }

   .text {
        font-size: 16px;
    }

    .btn-default {
        font-size: 16px;
    }

    .page-title {
        font-size: 25px !important;
       line-height: 40px !important;
    }

    .page-section-title {
        margin-bottom: 30px;
    }

     .tool-box {
        width: 80px !important;
        height: 80px !important;
    }

     .tool-box img {
        width: 30px !important;
        height: 30px !important;
    }

    .performance--tools {
        margin-top: -20px;
    }

    .comman-box {
        padding: 20px;
    }

    .sub-section-title {
        font-size: 22px;
        line-height: 30px;
    }

    .practice-image {
        margin-top: 25px;
    } 

    .details-cards  {
        margin-bottom: 20px;
    }

    .how-works {
        padding: 20px;
    }

    .how-works .login-image .whitebox {
        min-height: 200px;
    }

    .nav.nav-tabs.justify-content-between.border-0 {
        flex-direction: column;
        align-items: start !important;
        justify-content: flex-start !important;
    }

    .how-works .works-tab-nav ul li {
        width: 100%;
        margin-bottom: 15px;
    }

    .learn-more-about {
        padding: 20px;
        margin-top: 20px;
    }

    .comman-box.p-5 {
        padding: 20px !important;
    }

    .ai-counter-items {
        margin-top: 20px;
    }

    .sisf-faq-accordian .accordion-button:not(.collapsed)::before,
    .sisf-faq-accordian .accordion-button::before {
        display: none;
    }

    .learn-more-images {
        width: 100%;
        height: 100%;
    }

    .learn-more-images .image2 {
        position: unset;
        width: 100%;
        margin-top: 20px;
        height: 100%;
    }

    .ai-counter-items .counter-title span {
        font-size: 25px;
        line-height: 30px;
    }

    .ai-counter-items .counter--content .content {
        font-size: 18px;
    }

    .ai-counter-items .counter--content {
        margin-bottom: 0px;
    }

    .luwais-tools.bg-black {
        margin-top: 25px;
    }

    .sisf-faq-accordian .accordion-button:not(.collapsed) {
        padding: 10px 20px;
        min-height: 55px;
    }

    .testimonial-section.px-5 {
        padding: 0 15px !important;
    }

    .testimonial-bg {
        padding: 10px;
    }

    .our-testimonials {
        padding: 15px;
    }

    .btn-default.rounded-5.d-flex.align-items-center.justify-content-between.w-100 {
        flex-direction: column;
    }

    .pricing-plans-table {
       margin-bottom: 15px;
    }

    .sisf-faq-accordian .accordion-button {
        padding: 10px;
    }

    .sisf-faq-accordian .accordion-button span {
        font-size: 14px;
        line-height: normal;
    }

    .sisf-faq-accordian .accordion-body {
        padding: 20px 10px 10px 10px;
    }

    .main-footer {
        padding: 0 15px 15px 15px;
    }

    .footer-top-area {
        padding: 30px 0;
    }

    .footer-middel-area {
        padding: 30px 0;
    }

    .top-image.text-end {
        text-align: center !important;
        margin-top: 30px;
    }

    .list-unstyled.mb-0 {
        margin-bottom: 15px !important;
    }

   .footer-middel-area .bottom-title h1 {
       font-size: 70px;
       text-align: center;
       line-height: normal;
   }

   .footer-copyright-text.py-4 {
      padding: 0 !important;
      margin-bottom: 10px;
   }

   .footer-copyright {
        padding: 20px;
        text-align: center;
   }

   .privacy p {
       text-align: center;
   }

}

@media only screen and (max-width: 767px) {
   body {
       overflow-x: hidden;
   }

   .section {
       padding: 30px 0 !important
   }

   .container-fluid.px-5 {
       padding: 0 15px !important;
   }

   .dashboard-section {
        padding: 10px;
        margin-bottom: 0px;
    }

   br {
       display: none;
   }

   .banner-title {
       font-size: 25px !important;
       line-height: 30px !important;
       letter-spacing: 0px;
   }

   .text {
        font-size: 16px;
    }

    .btn-default {
        font-size: 16px;
    }

    .page-title {
        font-size: 25px !important;
       line-height: 40px !important;
    }

    .page-section-title {
        margin-bottom: 30px;
    }

    .tool-box {
        width: 80px !important;
        height: 80px !important;
    }

     .tool-box img {
        width: 30px;
        height: 30px;
    }

    .performance--tools {
        margin-top: -20px;
    }

    .comman-box {
        padding: 20px;
    }

    .sub-section-title {
        font-size: 22px;
        line-height: 30px;
    }

    .practice-image {
        margin-top: 25px;
    } 

    .details-cards  {
        margin-bottom: 20px;
    }

    .how-works {
        padding: 20px;
    }

    .how-works .login-image .whitebox {
        min-height: 200px;
    }

    .nav.nav-tabs.justify-content-between.border-0 {
        flex-direction: column;
        align-items: start !important;
        justify-content: flex-start !important;
    }

    .how-works .works-tab-nav ul li {
        width: 100%;
        margin-bottom: 15px;
    }

    .learn-more-about {
        padding: 20px;
        margin-top: 20px;
    }

    .comman-box.p-5 {
        padding: 20px !important;
    }

    .ai-counter-items {
        margin-top: 20px;
    }

    .sisf-faq-accordian .accordion-button:not(.collapsed)::before,
    .sisf-faq-accordian .accordion-button::before {
        display: none;
    }

    .learn-more-images {
        width: 100%;
        height: 100%;
    }

    .learn-more-images .image2 {
        position: unset;
        width: 100%;
        margin-top: 20px;
        height: 100%;
    }

    .ai-counter-items .counter-title span {
        font-size: 25px;
        line-height: 30px;
    }

    .ai-counter-items .counter--content .content {
        font-size: 18px;
    }

    .ai-counter-items .counter--content {
        margin-bottom: 0px;
    }

    .luwais-tools.bg-black {
        margin-top: 25px;
    }

    .sisf-faq-accordian .accordion-button:not(.collapsed) {
        padding: 10px 20px;
        min-height: 55px;
    }

    .testimonial-section.px-5 {
        padding: 0 15px !important;
    }

    .testimonial-bg {
        padding: 10px;
    }

    .our-testimonials {
        padding: 15px;
    }

    .btn-default.rounded-5.d-flex.align-items-center.justify-content-between.w-100 {
        flex-direction: column;
    }

    .pricing-plans-table {
       margin-bottom: 15px;
    }

    .sisf-faq-accordian .accordion-button {
        padding: 10px;
    }

    .sisf-faq-accordian .accordion-button span {
        font-size: 14px;
        line-height: normal;
    }

    .sisf-faq-accordian .accordion-body {
        padding: 20px 10px 10px 10px;
    }

    .main-footer {
        padding: 0 15px 15px 15px;
    }

    .footer-top-area {
        padding: 30px 0;
    }

    .footer-middel-area {
        padding: 30px 0;
    }

    .top-image.text-end {
        text-align: center !important;
        margin-top: 30px;
    }

    .list-unstyled.mb-0 {
        margin-bottom: 15px !important;
    }

   .footer-middel-area .bottom-title h1 {
       font-size: 70px;
       text-align: center;
       line-height: normal;
   }

   .footer-copyright-text.py-4 {
      padding: 0 !important;
      margin-bottom: 10px;
   }

   .footer-copyright {
        padding: 20px;
        text-align: center;
   }

   .privacy p {
       text-align: center;
   }
}


@media only screen and (max-width: 991px) {
    .section {
        padding: 30px 0;
    }

    br {
        display: none;
    }

    .container-fluid.px-5 {
       padding: 0 15px !important;
   }

    .dashboard-section {
        padding: 20px;
        margin-bottom: 0px;
    }

    .banner-title {
        font-size: 30px;
        line-height: 45px;
        letter-spacing: 0px;
    }

    .page-section-title {
        margin-bottom: 30px;
    }

    .text {
        font-size: 18px;
    }

    .dashboard-image.rounded-3.mt-5 {
        margin-top: 20px !important;
    }

    .page-title {
        font-size: 30px;
        line-height: 35px;
    }

    .tool-box {
        width: 100px;
        height: 100px;
    }

    .tool-box img {
        width: 30px;
        height: 30px;
    }

    .performance--tools {
        margin-top: -27px;
    }

    .comman-box {
        background-color: #F2F5FF;
        border-radius: 30px;
        padding: 30px 20px;
    }

    .sub-section-title {
        font-size: 22px;
        line-height: 35px;
    }

    .key-words-list {
        width: 100%;
    }

    .details-cards {
        margin-top: 20px;
    }

    .how-works .login-image .whitebox {
        min-height: 0px;
    }

    .comman-box.p-5 {
        padding: 25px !important;
    }

    .learn-more-about {
        margin-top: 30px;
        padding: 25px;
    }

    .learn-more-images {
        width: 90%;
    }

    .ai-counter-items {
        margin-top: 25px;
    }

    .ai-counter-items .counter-title span {
        font-size: 30px;
        line-height: 45px;
    }

    .ai-counter-items .counter--content .content {
        font-size: 20px;
    }

    .ai-counter-items .counter--content {
        margin-bottom: 20px;
    }

    .testimonial-section.px-5 {
        padding: 0 15px !important;
    }

    .testimonial-bg {
        padding: 20px;
    }

    .our-testimonials {
        padding: 15px;
    }

    .quotes-text p {
        font-size: 14px;
    }

    .sisf-faq-accordian .accordion-button span {
        font-size: 16px;
    }

    .sisf-faq-accordian .accordion-button:not(.collapsed) {
        min-height: 65px;
    }

    .footer-top-area,
    .footer-middel-area  {
        padding: 30px 20px;
    }

    .footer-nav .nav-link {
        font-size: 14px;
    }

    .footer-copyright {
        padding: 20px 10px;
    }

    .privacy a {
        font-size: 14px;
    }

    .footer-copyright-text.py-4 {
        padding: 0 !important;
    }

}

@media only screen and (max-width: 1024px) {
    .section {
        padding: 30px 0;
    }

    br {
        display: none;
    }

    .container-fluid.px-5 {
       padding: 0 15px !important;
   }

    .dashboard-section {
        padding: 20px;
        margin-bottom: 0px;
    }

    .banner-title {
        font-size: 30px;
        line-height: 45px;
        letter-spacing: 0px;
    }

    .page-section-title {
        margin-bottom: 30px;
    }

    .text {
        font-size: 18px;
    }

    .dashboard-image.rounded-3.mt-5 {
        margin-top: 20px !important;
    }

    .page-title {
        font-size: 30px;
        line-height: 45px;
    }

    .tool-box {
        width: 100px;
        height: 100px;
    }

    .tool-box img {
        width: 30px;
        height: 30px;
    }

    .performance--tools {
        margin-top: -27px;
    }

    .comman-box {
        background-color: #F2F5FF;
        border-radius: 30px;
        padding: 30px 20px;
    }

    .sub-section-title {
        font-size: 22px;
        line-height: 35px;
    }

    .key-words-list {
        width: 100%;
    }

    .details-cards {
        margin-top: 20px;
    }

    .how-works .login-image .whitebox {
        min-height: 0px;
    }

    .comman-box.p-5 {
        padding: 25px !important;
    }

    .learn-more-about {
        margin-top: 30px;
        padding: 25px;
    }

    .learn-more-images {
        width: 90%;
    }

    .ai-counter-items {
        margin-top: 25px;
    }

    .ai-counter-items .counter-title span {
        font-size: 30px;
        line-height: 45px;
    }

    .ai-counter-items .counter--content .content {
        font-size: 20px;
    }

    .ai-counter-items .counter--content {
        margin-bottom: 20px;
    }

    .testimonial-section.px-5 {
        padding: 0 15px !important;
    }

    .testimonial-bg {
        padding: 20px;
    }

    .our-testimonials {
        padding: 15px;
    }

    .quotes-text p {
        font-size: 14px;
    }

    .sisf-faq-accordian .accordion-button span {
        font-size: 16px;
    }

    .sisf-faq-accordian .accordion-button:not(.collapsed) {
        min-height: 65px;
    }

    .footer-top-area,
    .footer-middel-area  {
        padding: 30px 20px;
    }

    .footer-nav .nav-link {
        font-size: 14px;
    }

    .footer-copyright {
        padding: 20px 10px;
    }

    .privacy a {
        font-size: 14px;
    }

    .footer-copyright-text.py-4 {
        padding: 0 !important;
    }
}

@media only screen and (max-width: 1199px) {

    .section {
        padding: 50px 0;
    }

    .banner-title,
    .page-title {
        font-size: 40px;
        line-height: 50px;
        letter-spacing: 0px;
    }

    .page-section-title {
        margin-bottom: 40px;
    }

    .text {
        font-size: 18px;
    }

    .dashboard-image.rounded-3.mt-5.fade-in-up {
        margin-top: 30px !important;
    }

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

    .tool-box {
        width: 120px;
        height: 120px;
    }

    .tool-box img {
        width: 50px;
        height: 50px;
    }

    .comman-box {
        padding: 30px;
    }

    .key-words-list {
        width: 100%;
    }

    .details-cards .card-title {
        font-size: 22px;
    }

    .details-cards .card-image-overlay {
        padding: 15px;
    }

    .how-works .login-image .whitebox {
        min-height: 250px;
    }

    .learn-more-about {
        padding: 25px;
        margin-top: 30px;
    }

    .comman-box.p-5 {
       padding: 25px !important;
    }

    .learn-more-images {
        width: 85%;
    }

    .ai-counter-items .counter-title span {
        font-size: 40px;
    }

    .ai-counter-items .counter--content .content {
        font-size: 20px;
    }

    .ai-counter-items .counter--content {
        margin-bottom: 15px;
    }

    .ai-counter-items {
        margin-top: 20px;
    } 

    .testimonial-section.px-5 {
        padding: 50px 20px !important;
    }

    .testimonial-bg {
        padding: 30px;
    }

    .sisf-faq-accordian .accordion-button:not(.collapsed) {
        min-height: 80px;
    }

    .footer-top-area,
    .footer-middel-area {
        padding: 40px 20px;
    }

    .footer-copyright {
        padding: 40px 20px;
    }

    .footer-copyright-text.py-4 {
        padding: 0 !important;
    }

    .main-footer {
        padding: 0 25px 25px 25px;
    }

}

@media only screen and (min-width: 1441px) {
     .section {
        padding: 70px 0;
    }
}