@media screen and (min-width:1241px) and (max-width:1500px) {

    /* ==== login page start ==== */

    .login-screen-logo-image,
    .login-screen-heading {
        margin-bottom: 20px;
    }

    .login-screen-heading h1 {
        font-size: 28px;
        margin-bottom: 4px;
    }

    .login-page-sbmt-button {
        margin-top: 20px;
    }

    .account-created-icon-main {
        margin-bottom: 20px;
    }

    /* ==== login page End ==== */

    /* ==== sidebar Start ==== */

    .deshboard-sidebar-main.active {

        ul {
            width: unset;
            margin: unset;
        }

        ul li {
            width: unset;
        }

    }

    .deshboard-sidebar-main ul {
        padding: 0px;
        margin: 0px;
        display: flex;
        flex-direction: column;
        gap: 10px;
        height: 76vh;
        padding-right: 4px;
        overflow: auto;
        scrollbar-width: thin;
        scrollbar-color: #1F9254 white;
    }

    /* ==== sidebar End ==== */

}

@media screen and (min-width:1025px) and (max-width:1240px) {

    /* ==== login page start ==== */

    .login-screen-logo-image,
    .login-screen-heading {
        margin-bottom: 20px;
    }

    .login-screen-heading h1 {
        font-size: 28px;
        margin-bottom: 4px;
    }

    .login-page-sbmt-button {
        margin-top: 20px;
    }

    .account-created-icon-main {
        margin-bottom: 20px;
    }

    /* ==== login page End ==== */

    /* ==== sidebar Start ==== */

    .deshboard-sidebar-main.active {

        ul {
            width: unset;
            margin: unset;
        }

        ul li {
            width: unset;
        }

    }

    .deshboard-sidebar-main ul {
        padding: 0px;
        margin: 0px;
        display: flex;
        flex-direction: column;
        gap: 10px;
        height: 76vh;
        padding-right: 8px;
        overflow: auto;
        scrollbar-width: thin;
        scrollbar-color: #1F9254 white;
    }

    /* ==== sidebar End ==== */

    /* ==== dashboard page start ==== */

    .dashboard-over-view-graph-box-one-main {
        flex-wrap: wrap;
    }

    .dashboard-over-view-graph-box-inside-main {
        width: calc(50% - 12px);
    }

    .dashboard-graph-mini-left-box h2 {
        font-size: 36px;
        line-height: normal;
    }

    /* ==== dashboard page end ==== */

}

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

    /* ==== login page start ==== */

    .login-screen-logo-image,
    .login-screen-heading {
        margin-bottom: 20px;
    }

    .login-screen-heading h1 {
        font-size: 28px;
        margin-bottom: 4px;
    }

    .login-page-sbmt-button {
        margin-top: 20px;
    }

    .account-created-icon-main {
        margin-bottom: 20px;
    }

    /* ==== login page End ==== */

    /* ==== sidebar Start ==== */

    .deshboard-sidebar-main.active {

        ul {
            width: unset;
            margin: unset;
        }

        ul li {
            width: unset;
        }

    }

    .deshboard-sidebar-main ul {
        padding: 0px;
        margin: 0px;
        display: flex;
        flex-direction: column;
        gap: 10px;
        height: 76vh;
        padding-right: 8px;
        overflow: auto;
        scrollbar-width: thin;
        scrollbar-color: #1F9254 white;
    }

    /* ==== sidebar End ==== */

    /* ==== driver management add new page Start ==== */

    .driver-management-company-details-inside-main .driver-management-input-section-inside {
        width: 48.50%;
    }

    /* ==== driver management add new page End ==== */

    /* ==== dashboard page start ==== */

    .dashboard-over-view-graph-box-one-main {
        flex-wrap: wrap;
    }

    .dashboard-over-view-graph-box-inside-main {
        width: calc(50% - 12px);
    }

    .dashboard-graph-mini-left-box h2 {
        font-size: 36px;
        line-height: normal;
    }

    .dashboard-ttl-erng-box-head-mn h2 {
        line-height: normal;
        font-size: 26px;
    }

    .dashboard-ttl-erng-box-head-mn .dashboard-graph-mini-left-box h5 {
        margin-bottom: 0px;
        font-size: 20px;
    }

    .deshboard-main-section.active {

        .drvr-info-persnl-detailsbox .driver-management-input-section-inside {
            width: 48%;
        }

    }

    /* ==== dashboard page end ==== */

}

@media screen and (min-width:768px) and (max-width:991px) {

    /* ==== login page start ==== */

    .login-screen-logo-image,
    .login-screen-heading {
        margin-bottom: 20px;
    }

    .login-screen-heading h1 {
        font-size: 28px;
        margin-bottom: 4px;
    }

    .login-page-sbmt-button {
        margin-top: 20px;
    }

    .account-created-icon-main {
        margin-bottom: 20px;
    }

    /* ==== login page End ==== */

    /* ==== sidebar Start ==== */

    .deshboard-sidebar-main.active {

        ul {
            width: unset;
            margin: unset;
        }

        ul li {
            width: unset;
        }

    }

    .deshboard-sidebar-main ul {
        padding: 0px;
        margin: 0px;
        display: flex;
        flex-direction: column;
        gap: 10px;
        height: 76vh;
        padding-right: 8px;
        overflow: auto;
        scrollbar-width: thin;
        scrollbar-color: #1F9254 white;
    }

    /* ==== sidebar End ==== */

    /* ==== driver management add new page Start ==== */

    .deshboard-main-section.active {

        .driver-management-input-section-inside {
            width: 100%;
            margin-bottom: 24px;
        }

        .driver-mngmnt-truck-photo-uploader-section {
            width: 100%;
        }

    }

    .driver-management-company-details-inside-main .driver-management-input-section-inside {
        width: 48.50%;
    }

    /* ==== driver management add new page End ==== */

    /* ==== dashboard page start ==== */

    .dashboard-over-view-graph-box-one-main {
        flex-wrap: wrap;
    }

    .dashboard-over-view-graph-box-inside-main {
        width: calc(50% - 12px);
    }

    .dashboard-graph-mini-left-box h2 {
        font-size: 36px;
        line-height: normal;
    }

    .dashboard-ttl-erng-box-head-mn h2 {
        line-height: normal;
        font-size: 26px;
    }

    .dashboard-ttl-erng-box-head-mn .dashboard-graph-mini-left-box h5 {
        margin-bottom: 0px;
        font-size: 20px;
    }

    .dashboard-over-view-graph-box-inside-main {
        width: 100%;
    }

    .dashboard-total-earning-driver-and-admin-box {
        flex-wrap: wrap;
    }

    .dashboard-total-earning-driver-and-admin-box-inside-main {
        width: 100%;
    }

    .deshboard-main-section.active {

        .drvr-info-persnl-detailsbox .driver-management-input-section-inside {
            width: 100%;
        }

        .driver-information-personal-information-box-one {
            flex-direction: column;
        }

        .driver-documnt-ppr-upload-section {
            flex-wrap: wrap;
        }

        .driver-documnt-ppr-upload-section .driver-management-input-section-inside {
            width: 100%;
        }

        .view-driver-order-history-traking-and-profile-basic-details {
            gap: 24px;
        }

        .view-drvr-ordr-hstry-trkng-prfl-box-one {
            width: 100%;
        }

        .view-driver-order-heading-and-pera-box h5 {
            font-size: 24px;
        }

        .drvr-info-persnl-detailsbox .driver-management-input-section-inside {
            width: 100%;
        }

    }

    .drvr-info-persnl-detailsbox .driver-management-input-section-inside {
        width: 49%;
    }

    /* ==== dashboard page end ==== */

}

@media (max-width: 767px) {

    /* ==== login page start ==== */

    .login-screen-logo-image,
    .login-screen-heading {
        margin-bottom: 20px;
    }

    .login-screen-heading h1 {
        font-size: 28px;
        margin-bottom: 4px;
    }

    .login-page-sbmt-button {
        margin-top: 20px;
    }

    .account-created-icon-main {
        margin-bottom: 20px;
    }

    /* ==== login page End ==== */

    /* ==== sidebar Start ==== */

    .deshboard-sidebar-main.active {

        ul {
            width: unset;
            margin: unset;
        }

        ul li {
            width: unset;
        }

    }

    .deshboard-sidebar-main ul {
        padding: 0px;
        margin: 0px;
        display: flex;
        flex-direction: column;
        gap: 10px;
        height: 76vh;
        padding-right: 8px;
        overflow: auto;
        scrollbar-width: thin;
        scrollbar-color: #1F9254 white;
    }

    /* ==== sidebar End ==== */

    .deshboard-page-heading-and-button-main h1,
    .deshboard-page-heading-and-button-main h1 {
        font-size: 28px;
    }

    .header-main {
        padding: 14px 20px;
    }

    .deshboard-contant-section-main {
        width: 100%;
    }

    .deshboard-sidebar-main {
        left: 0px;
        transition: 0.3s;
        height: 100vh;
    }

    .deshboard-main-section.active {

        .deshboard-contant-section-main {
            width: 100%;
        }

    }

    .deshboard-sidebar-main.active {
        left: -260px;
        width: 260px;
        min-width: 260px;
        transition: 0.3s;
        padding: 30px 16px;
    }

    .deshboard-sidebar-main.active {
        ul li a span {
            display: flex;
        }
    }

    .deshboard-sidebar-main.active {
        ul li a {
            width: 100%;
            height: fit-content;
            justify-content: unset;
            transition: 0.3s;
        }
    }

    .sidebar-close-button {
        display: none;
    }

    .mobile-sidebar-toggle-button {
        display: block;
    }

    .mobile-sidebar-toggle-button .toggle {
        position: relative;
        width: 50px;
        height: 50px;
        background: transparent;
        border-radius: 10px;
        display: flex;
        justify-content: center;
        align-items: center;
        overflow: hidden;
    }

    .mobile-sidebar-toggle-button .toggle span {
        position: absolute;
        width: 40px;
        height: 4px;
        border-radius: 4px;
        background: #46A56C;
        transition: 0.3s;
    }

    .mobile-sidebar-toggle-button .toggle span:nth-child(2) {
        transform: translateY(-12px);
        width: 25px;
        left: 7px;
    }

    .mobile-sidebar-toggle-button .toggle span:nth-child(3) {
        transform: translateY(12px);
        width: 15px;
        left: 7px;
    }

    .mobile-sidebar-toggle-button .toggle.active span:nth-child(1) {
        transform: translateX(60px);
    }

    .mobile-sidebar-toggle-button .toggle.active span:nth-child(2) {
        width: 40px;
        transform: translateX(0) rotate(45deg);
        transition-delay: 0.2s;
    }

    .mobile-sidebar-toggle-button .toggle.active span:nth-child(3) {
        width: 40px;
        transform: translateX(0) rotate(-45deg);
        transition-delay: 0.3s;
    }

    /* ==== driver management add new page Start ==== */

    .driver-management-company-details-inside-main .driver-management-input-section-inside {
        width: 48.50%;
    }

    /* ==== driver management add new page End ==== */

    /* ==== dashboard page start ==== */

    .dashboard-over-view-graph-box-one-main {
        flex-wrap: wrap;
    }

    .dashboard-graph-mini-left-box h2 {
        font-size: 36px;
        line-height: normal;
    }

    .dashboard-ttl-erng-box-head-mn h2 {
        line-height: normal;
        font-size: 26px;
    }

    .dashboard-ttl-erng-box-head-mn .dashboard-graph-mini-left-box h5 {
        margin-bottom: 0px;
        font-size: 20px;
    }

    .dashboard-over-view-graph-box-inside-main {
        width: 100%;
    }

    .dashboard-total-earning-driver-and-admin-box {
        flex-wrap: wrap;
    }

    .dashboard-total-earning-driver-and-admin-box-inside-main {
        width: 100%;
    }

    .drvr-info-persnl-detailsbox .driver-management-input-section-inside {
        width: 49%;
    }

    .driver-information-personal-information-box-one {
        flex-direction: column;
    }

    .driver-documnt-ppr-upload-section {
        flex-wrap: wrap;
    }

    .driver-documnt-ppr-upload-section .driver-management-input-section-inside {
        width: 100%;
    }

    .view-driver-order-history-traking-and-profile-basic-details {
        gap: 24px;
    }

    .view-drvr-ordr-hstry-trkng-prfl-box-one {
        width: 100%;
    }

    .view-driver-order-heading-and-pera-box h5 {
        font-size: 24px;
    }

    /* ==== dashboard page end ==== */

}

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

    /* ==== deshboard page start ==== */

    .deshboard-page-heading-and-button-main h1,
    .deshboard-page-heading-and-button-main h1 a {
        font-size: 24px;
    }

    /* ==== deshboard page End ==== */

    /* ==== driver management add new page Start ==== */

    .driver-management-input-section-inside {
        width: 100%;
        margin-bottom: 12px;
    }

    .driver-management-company-details-inside-main .driver-management-input-section-inside,
    .driver-mngmnt-truck-photo-uploader-section {
        width: 100%;
    }

    .drvr-info-persnl-detailsbox .driver-management-input-section-inside {
        width: 100%;
    }

    .driver-information-personal-information-box-one {
        flex-direction: column;
    }

    .driver-documnt-ppr-upload-section {
        flex-wrap: wrap;
    }

    .driver-documnt-ppr-upload-section .driver-management-input-section-inside {
        width: 100%;
    }

    .driver-managemnt-delete-popup-main .logout-popup-button a,
    .reject-request-popup-box-main .logout-popup-button a {
        width: 47%;
    }

    /* ==== driver management add new page End ==== */

}

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

    /* ==== login page start ==== */

    .login-screen-logo-image,
    .login-screen-heading {
        margin-bottom: 20px;
    }

    .login-screen-heading h1 {
        font-size: 24px;
        margin-bottom: 4px;
    }

    .login-page-sbmt-button {
        margin-top: 20px;
    }

    .login-field-lable-inside-main input {
        padding: 12px 16px;
    }

    .login-page-sbmt-button button {
        padding: 12px;
    }

    .verify-your-email-address-code-main input {
        width: 32px;
        height: 32px;
        border-radius: 8px;
        font-size: 16px;
    }

    .verify-otp-enter-time {
        margin-bottom: 10px;
    }

    .account-created-icon-main {
        width: 160px;
        height: 160px;
    }

    /* ==== login page End ==== */

    /* ==== driver management add new page Start ==== */

    .driver-management-input-section-inside label {
        font-size: 14px;
    }

    .driver-management-input-section-inside input,
    .dropodwn-driver-mngmnt-add-new-page-one .dropdown-selected,
    .driver-mngmnt-multiselect-dropdown-searcheble,
    .driver-management-input-section-inside textarea {
        padding: 10px 14px;
        font-size: 14px;
    }

    .document-upload-details-section-main .drag-your-document-table-main {
        overflow: auto;
    }

    .document-upload-details-section-main .drag-your-document-table-main table {
        width: 500px;
    }

    .driver-management-add-details-main-itp-section,
    .driver-management-company-details-section,
    .document-upload-details-section-main {
        margin-bottom: 12px;
    }

    .driver-mngmnt-truck-photo-uploader-section {
        margin-bottom: 24px;
    }

    .drvr-mngmnt-cmpny-dtls-tital h2 {
        font-size: 18px;
    }

    .add-new-button a {
        font-size: 14px;
        padding: 8px 16px;
    }

    .setting-service-type-heading-and-add-btn-main h2 {
        font-size: 22px;
    }

    .notificaton-and-my-profile-main {
        gap: 20px;
    }

    .notification-list-main-row {
        padding: 14px;
    }

    .noti-filter-selected {
        padding: 8px 12px;
    }

    /* ==== driver management add new page End ==== */

    /* ==== dashboard page start ==== */

    .dashboard-over-view-graph-box-one-main {
        flex-wrap: wrap;
    }

    .dashboard-graph-mini-left-box h2 {
        font-size: 30px;
        line-height: normal;
    }

    .dashboard-graph-mini-left-box h5 {
        font-size: 16px;
        line-height: normal;
    }

    .dashboard-ttl-erng-box-head-mn {
        gap: 10px;
    }

    .dashboard-ttl-erng-box-head-mn h2 {
        line-height: normal;
        font-size: 24px;
    }

    .dashboard-ttl-erng-box-head-mn .dashboard-graph-mini-left-box h5 {
        margin-bottom: 0px;
        font-size: 20px;
    }

    .dashboard-over-view-graph-box-inside-main {
        width: 100%;
        flex-direction: column;
    }

    .dashboard-graph-mini-left-box {
        width: 100%;
    }

    .dashboard-mini-graph-mn-box-one {
        width: 100%;
    }

    .active-driver {
        width: 100%;
        max-width: 100%;
        height: 100px;
    }

    .dashboard-total-earning-driver-and-admin-box {
        flex-wrap: wrap;
    }

    .dashboard-total-earning-driver-and-admin-box-inside-main {
        width: 100%;
        overflow: auto;
    }

    .total-driver-rarnings-graph-box-main {
        width: 480px;
    }

    .driver-information-and-order-history-tab-main .tab-btn {
        padding: 8px;
        font-size: 14px;
    }

    .driver-information-verification-box-one {
        flex-wrap: wrap;
    }

    .driver-information-personal-information-box {
        padding: 16px;
    }

    .dpdn-ttl-left h4 {
        font-size: 22px;
    }

    .driver-managemnt-delete-popup-main .logout-popup-button a,
    .reject-request-popup-box-main .logout-popup-button a {
        width: 47%;
    }

    /* ==== dashboard page end ==== */

}

/* ==== header responsive Start ==== */

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

    .notificaton-and-my-profile-main {
        gap: 12px;
    }

    .my-account-header-main {
        gap: 10px;
    }

    .profile-icon-main-hdr {
        width: 38px;
        height: 38px;
    }

    .profile-usr-account-details-name-main p {
        font-size: 10px;
    }

    .profile-usr-account-details-name-main a p {
        font-size: 12px;
    }

    .mobile-sidebar-toggle-button .toggle {
        width: 43px;
        height: 43px;
    }

    .mobile-sidebar-toggle-button .toggle span {
        width: 36px;
        left: 4px;
    }

}

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

    .profile-usr-account-details-name-main a p,
    .profile-usr-account-details-name-main p {
        display: none;
    }

}

/* ==== header responsive End ==== */