/* X-Large devices (large desktops, less than 1400px) */
/* @media (min-width: 1100.98px) and (max-width:1600px){

  #plansname-chart {background: red;}

} */


@media (max-width: 1699.98px) {

    .listsearcbar {
        flex-wrap: wrap;
        width: 100%;
        max-width: 100%;
        gap: 10px;
    }
} 


@media (max-width: 1399.98px) {
  .login_outer .login_bg .bg-text {
    left: 4rem;
  }

  .login_outer .login_bg .bg-text h1 {
    font-size: 5rem;
  }

  .login_outer .login_form {
    padding: 3rem 3rem 3rem;
    width: 75%;
  }

  .sidebar .nav-links li {
    margin-bottom: 0;
  }

  .home-content .userHello h3 {
    font-size: 1.3rem;
  }

  .home-content .userHello p {
    font-size: 0.8rem;
  }

  .home-content .box .number {
    font-size: 1.3rem;
  }

  .sidebar .nav-links li a .links_name {
    font-size: 0.9rem;
    padding-top: 5px;
  }

  .home-content .box .boxIcon {
    width: 70px;
  }

  i.boxIcon svg {
    width: 45px;
  }

  .overview-boxes .box-topic {
    font-size: 0.9rem;
  }

  .sales-boxes .box .title {
    font-size: 1.1rem;
  }

  .organiZations-boxes .box .title {
    font-size: 1.1rem;
  }

  table {
    font-size: 0.8rem;
  }

  .dataTables_wrapper.dt-bootstrap5 label {
    font-size: 0.9rem;
  }

  div.dataTables_info {
    font-size: 0.9rem;
  }

  .dataTables_paginate li a {
    font-size: 0.9rem;
  }

  p.pieText {
    font-size: 0.9rem;
  }

  .body_structure .front_body .maincheckTitle .checkline {
    width: 50px;
    border: 0.8px solid var(--orange);
  }

  .body_structure .back_body .maincheckTitle .checkline {
    width: 50px;
    border: 0.8px solid var(--orange);
  }
    .filterdashboard .search_outer {
        flex-grow: 1;
    }
    .filterdashboard .dataTables_length, .filterdashboard .dataTables_filter {
        justify-content: space-between;
    }
    .filterdashboard #vehicleTrackingTable_length .dataTables_filter, .colmn-direction #dateFilterListVehicleMaintenance 
    {
        justify-content: start;
        flex-wrap: wrap;
    }
    .listsearcbar {
        flex-wrap: wrap;
        width: 100%;
        max-width: 100%;
        gap: 10px;
    }
    

        .listsearcbar > input, .listsearcbar > select {
            width: 100%;
            border-radius: .375rem;
        }
    .dirverbx {flex-wrap:wrap;}
}

/* Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
  .login_outer .login_bg .bg-text h1 {
    font-size: 4rem;
  }

  .login_outer .login_form {
    right: 0rem;

  }

  .home-content .sales-boxes {
    flex-direction: column;
  }

  .home-content .sales-boxes .box {
    width: 100%;
    /*overflow-x: scroll;*/
    margin-bottom: 30px;
  }
    .home-content .sales-boxes .box.no-scroll {overflow:unset;}

    .supportHelp .home-content .sales-boxes .box {
        overflow-x: hidden;
    }

  .home-content .sales-boxes .top-sales {
    margin: 0;
  }

  .overview-boxes .box {
    width: calc(100% / 2 - 15px);
    margin-bottom: 0;
  flex-wrap:wrap;
  }


  .home-section nav .profile-details {
    min-width: auto;
    padding: 0;
  }

  .bannerText h1 {
    font-size: 3rem;
  }

  .bannerText p {
    font-size: 1rem;
  }

  .storeImg {
    display: flex;
  }

  .storeImg img {
    width: 95%;
  }

  .mainApp section {
    padding-top: 25px;
    padding-bottom: 25px;
  }

  .OwnerCards .ownerbox {
    height: 400px;
    margin-bottom: 1.5rem;
  }

  .BannerSection, .pricingSection,
  .fleetManage,
  .trust,
  .Appdownloadlinks {
    overflow: hidden;
  }

  .subscribe-pge .pricing-card {
    max-width: 360px;
    gap: 20px;
    width: 100%;
}
.organiZations1 .row >.col-xxl-4 {order: 2;}
.topseling_box {margin-bottom: 30px; }
  /* .mainApp section.contactUS {padding-bottom: 50px;} */
    .search_outer {
        flex-grow: 1;
    }

    .filterdashboard .dataTables_filter {
        justify-content: space-between;
        flex-direction: row-reverse;
    }
  
    .colmn-direction .hr_tblMeta_r {align-items:start; margin-top:12px; }
  
}


/* Medium devices (tablets, less than 1024) */
@media (max-width: 1024px) {

   /* .overview-boxes .box {
        width: calc(100% / 2 - 5px);
    flex-wrap:wrap;
    }*/
}


    /* Medium devices (tablets, less than 992px) */
    @media (max-width: 991.98px) {
        .sidebar {
            width: 0;
        }

            .sidebar.active .nav-links li a .links_name {
                display: block;
            }

            .sidebar.active .nav-links li a {
                justify-content: left;
            }

            .sidebar.active {
                width: 300px;
                z-index: 1;
            }

        .home-section {
            width: 100%;
            left: 0;
        }

        .sidebar.active ~ .home-section {
            left: 0;
            width: 100%;
        }

        .home-section nav.top_bar {
            width: 100%;
            left: 0;
        }

        .sidebar.active ~ .home-section nav.top_bar {
            left: 300px;
            /* width: calc(100% - 320px); */
        }

        .avatar-upload {
            margin-bottom: 30px;
        }

        .bannerText h1 {
            font-size: 2.5rem;
        }

        .bannerText p {
            font-size: 0.9rem;
        }

        .OwnerCards .ownerbox {
            height: auto;
        }

        .OwnerCards .ownerText .textBox h5 {
            font-size: 1rem;
        }

        .OwnerCards .ownerText .textBox p {
            font-size: 0.9rem;
        }

        .OwnerCards .ownerText .textBox {
            padding: 0.8rem;
        }

        .Appdownloadlinks .bannerText h2 {
            font-size: 3.5rem;
        }

        .FooterTop {
            top: -17%;
        }

        /* .appbuttons {
    display: none;
  } */
        /* .app-animation {overflow-x: hidden;} */

        .fleetManage .fleetCards .detailCard {
            margin-bottom: 1.5rem;
        }

        .overview-boxes .form-wrap.form-builder .frmb li.form-field {
            width: 100%;
        }

        .OwnerCards .CaraContent {
            order: 4;
        }

        .OwnerCards .CaraImage {
            order: 3;
        }

        .appHeader .logo {
            width: 50px;
        }

        .listsearcbar > select {
            width: calc(100%- 108px);
        }

        .listsearcbar {
            flex-wrap: nowrap;
        }


        .overview-reportbx {
            flex-wrap: wrap;
        }

        .home-content .overview-reportbx .overview-boxes, .home-content .overview-reportbx .report-bx{
            width: 100%;
        }

        .home-content .overview-reportbx .recentactive-table_bx {
            max-height: 100%;
        }
        .login_outer .login_form {
            margin: 20px auto;
            width: 100%;
        }


    }

    /* Small devices (landscape phones, less than 768px) */
    @media (max-width: 767.98px) {
        /* ===================Login ==============*/

        .login_outer .login_bg {
            min-height: 100vh;
        }


        .sidebar {
            width: 0;
        }

            .sidebar.active {
                width: 300px;
                z-index: 1;
            }

        .home-section {
            width: 100%;
            left: 0;
        }

        .sidebar.active ~ .home-section {
            left: 0;
            width: 100%;
        }

        .home-section nav.top_bar {
            width: 100%;
            left: 0;
        }

        .sidebar.active ~ .home-section nav.top_bar {
            left: 300px;
            /* width: calc(100% - 320px); */
        }


        .main_btn {
            font-size: 0.7rem;
            padding: 0.6rem 0.8rem;
        }

        .secondry_btn {
            font-size: 0.7rem;
            padding: 0.6rem 0.8rem;
        }

        .outline_btn {
            font-size: 0.7rem;
            padding: 0.6rem 0.8rem;
        }

        .delete_btn {
            font-size: 0.7rem;
            padding: 0.6rem 0.8rem;
        }

        .home-content .sales-boxes .sales-details {
            width: 560px;
        }


        .login_outer .login_bg .loginForm {
            display: block;
        }

        .login_outer .login_form .logo {
            margin-bottom: 2rem;
        }

        .login_outer .login_form {
            width: 100%;
            /*padding: 4rem 1rem 7rem;*/
            padding: 2rem 1rem 2rem;
            margin: 20px 0;
        }

        .overview-boxes .box {
            width: 49%;
        }

        .home-section nav .search-box {
            display: none;
        }

        .home-content .sales-boxes .recent-sales {
            margin: 0;
        }

        .home-content .sales-boxes .top-sales {
            margin: 0;
            margin-top: 20px;
        }

        .single-chart {
            width: 52%;
            margin-bottom: 40px;
        }

        select.form-select.form-select-sm {
            margin-bottom: 10px;
        }

        .filterdashboard select.form-select.form-select-sm, .organiZations input.form-control.form-control-sm {
            margin-bottom: 0px;
            max-width: 150px;
        }


        .dataTables_info {
            margin-bottom: 10px;
        }

        .main_form input {
            margin-bottom: 1.2rem;
        }

        .dollarIcon input {
            margin-bottom: 0;
        }

        .dollarIcon-disabled input {
            margin-bottom: 0;
        }


        .login_outer .login_form.signup_form {
            padding: 2rem;
        }

        .oraganizationForm .form_head {
            margin-bottom: 20px;
            font-size: 0.9rem;
        }

        .mainBreadcrumb {
            font-size: 0.8rem;
        }

        .MainStep {
            width: 400px;
        }

        .progress-bar .step p {
            display: none;
        }

        .progress-bar .step .bullet::after,
        .progress-bar .step .bullet::before {
            display: none;
        }

        .progress-bar .step .bullet {
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .progress-bar .step .check {
            position: absolute;
            left: 50%;
            top: 50%;
            font-size: 15px;
            transform: translate(-50%, -50%);
            display: none;
        }

        .step {
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .images_box img {
            height: 220px;
            border-radius: 10px;
            -webkit-border-radius: 10px;
            -moz-border-radius: 10px;
            -ms-border-radius: 10px;
            -o-border-radius: 10px;
        }

        .images_box {
            border: 0;
            margin-bottom: 20px;
        }

        .body_structure .front_body .maincheckTitle .checkline {
            width: 20px;
        }

        .body_structure .back_body .maincheckTitle .checkline {
            width: 20px;
            border: 0.8px solid var(--orange);
        }

        .body_structure .front_body .maincheckTitle input[type="checkbox"] {
            height: 15px;
            width: 15px;
            margin-bottom: 0;
            margin-right: 0px;
            margin-left: 0px;
        }

        .body_structure .back_body .maincheckTitle input[type="checkbox"] {
            height: 15px;
            width: 15px;
            margin-bottom: 0;
            margin-right: 0px;
            margin-left: 0px;
        }

        .body_structure .front_body .maincheckTitle .label {
            font-size: 0.7rem;
        }

        .body_structure .back_body .maincheckTitle .label {
            font-size: 0.7rem;
        }

        form .page .btns button.prev {
            font-size: 14px;
            padding: 0.5rem 1rem;
        }

        form .page .btns button.next {
            font-size: 14px;
            padding: 0.5rem 1rem;
        }

        form .page .field button {
            font-size: 14px;
            padding: 0.5rem 1rem;
        }

        .stepButtons.\.nexBtn {
            top: -5px;
        }

        .multisteps-form__progress-btn:before {
            left: 12%;
        }

        .multisteps-form__progress-btn {
            text-indent: 4px;
        }

        .bannerText h1 {
            font-size: 2rem;
        }

        .storeImg {
            margin-bottom: 3rem;
        }

        .headSection h3 {
            font-size: 1.5rem;
            letter-spacing: 0px;
        }

        .headSection p {
            font-size: 0.9rem;
        }

        .Appdownloadlinks .bannerText {
            margin-top: 3rem;
        }

        .contactImg {
            margin-top: 3rem;
        }

        .FooterTop .email img {
            display: none;
        }

        .FooterTop .email {
            margin-bottom: 1rem;
        }

        .FooterTop .phoneNo img {
            display: none;
        }

        .FooterTop {
            padding: 1.5rem;
            top: -7%;
            width: 90%;
            margin: auto;
            left: 5%;
        }

        .BannerSection {
            margin-top: 60px;
        }

        .OwnerCards .ownerbox {
            height: 450px;
        }

        .pricing-card {
            padding: 70px 20px;
        }

        .bannerText {
            padding-top: 2rem;
        }

        .OwnerCards .ownerbox img {
            height: 100%;
        }

        .OwnerCards .ownerbox:hover .ownerText .textBox {
            overflow-y: auto;
            max-height: 100%;
        }

        .overview-boxes .form-wrap.form-builder .frmb li.form-field {
            width: 100%;
        }

        .privacy-polcy .BannerSection h2 {
            font-size: 21px;
            margin: 30px 0 10px;
        }

        .privacy-polcy .BannerSection h3 {
            margin: 15px 0 10px;
            font-size: 18px;
        }

        .privacy-polcy .BannerSection h4 {
            font-size: 17px;
            margin: 10px 0 10px;
        }

        .Appdownloadlinks {
            justify-content: center;
        }

        .privacy-polcy .BannerSection p {
            text-align: unset;
        }

        .subscribe-pge .pricing-card .cta-btn {
            position: unset;
            transform: inherit;
        }

        .subscribe-pge .pricing-card {
            padding: 70px 20px 30px;
        }

        .filterdashboard .srchstasfilter .dataTables_filter {
            justify-content: space-between;
        }

        .home-content .sales-boxes .warp_graph {
            width: unset;
        }

            .home-content .sales-boxes .warp_graph .single-chart {
                width: 100%
            }

        #vehicleTrackingTable_wrapper .hr_tblMeta_r {
            flex-direction: row;
            margin-top: 16px;
            flex-wrap: wrap;
        }
    }

    /* X-Small devices (portrait phones, less than 576px) */
    @media (max-width: 575.98px) {
        .MainStep {
            box-sizing: border-box;
            border-radius: 0;
            width: 350px;
            padding: 10px;
        }

        filterdashboard {
        }

        .mainBreadcrumb {
            flex-direction: column;
        }

        .home-section nav .profile-details {
            min-width: 20px;
            padding: 0 5px 0 2px;
        }

        .multisteps-form__progress-btn span {
            text-indent: -50px;
        }

        .multisteps-form__progress-btn span {
            position: absolute;
            top: 8px;
            z-index: 9;
            color: #ffffff;
            font-size: 18px;
            font-weight: 600;
            text-indent: -50px;
            right: -3px;
        }

        .appbuttons {
            font-size: 14px;
            padding: 8px 10px;
        }

            .appbuttons .free_btn {
                margin-right: 0 !important;
            }

        .OwnerCards p.prodetail {
            font-size: 15px;
            line-height: 25px;
        }

        .payment-stats-ge .login_form.signup_form {
            width: 90%;
            margin: auto;
        }

        .payment-stats-ge table {
            border: 1px solid #ddd;
        }

        .InvoiceDetails-table tr td:nth-child(2) {
            text-align: left;
        }

        .InvoiceDetails-table tr td {
            width: 100%;
            display: block;
        }

        .InvoiceDetails-table tr:last-child td {
            border-bottom: 1px solid #ddd;
        }

        .pack-detailsbx ul li, .overview-reportbx .overview-boxes .box, .overview-boxes .box, .filterdashboard .dataTables_length > *, .filterdashboard .dataTables_filter > * {
            width: 100%;
        } 

        .hr_tblMeta_r {
            align-items: center;
        }

        .filterdashboard .dataTables_length, .filterdashboard .dataTables_filter {
            flex-wrap: wrap;
            gap: 10px;
        }

           

        .drivr_prark-chekbx {
            flex-wrap: wrap;
        }

            .drivr_prark-chekbx .form-check {
                width: 50%;
            }
     



    }

    .Appdownloadlinks .bannerText h2 {
        font-size: 25px;
    }
    /* X-Small devices (portrait phones, less than 400px) */
    @media (max-width: 400.98px) {
        .multisteps-form__progress-btn span {
            text-indent: -53px;
        }

        div.dataTables_wrapper div.dataTables_paginate ul.pagination {
            flex-wrap: wrap;
        }
    }






    /* For landscape */
    @media screen and (orientation:landscape) and (min-width: 360px) and (max-width: 750px) {
    }

    @media screen and (orientation:landscape) and (min-width: 821px) and (max-width: 960px) {
    }