@media (max-width: 991.5px) {

    /* Header-responsive-css::Start */
    .header-main .dns-logo img {
        width: 150px;
    }

    .header-main {
        padding: 0px !important;
    }

    .header-main .dns-logo {
        padding: 3px 10px !important;
    }

    .profile-img {
        width: 40px;
        height: 40px;
    }

    .profile-img img {
        width: 35px;
        height: 35px;
    }

    .user-role-content p {
        font-size: 14px;
    }

    .user-role-content span {
        font-size: 12px;
    }

    /* Header-responsive-css::End */

    /* Index-page-responsive-css::Start */
    .notification-drawer-main {
        width: 100%;
        top: 0px;
        left: 100%;
        display: none;
    }
    .notification-card {
        height: 95vh;
    }

    .all-win-top-btn,
    .drawer-close-btn {
        display: block !important;
    }

    .all-vins-col,
    .all-underbody-col {
        position: unset;
        max-width: 100% !important;
    }

    .all-vins-col {
        margin-top: 70px;
    }

    .all-underbody-col .card {
        margin: 0px;
    }
    .under-body-image-slider img
    {
        height:350px !important;
        margin-bottom: 20px;
    }
    .under-body-image-slider {
        margin-top: 5px;
    }
    /* Index-page-responsive-css::End */

    /* Login-page-responsive-css::Start */
    .login-wrapper .card-main {
        min-height: 50vh;
    }

    /* Login-page-responsive-css::End */
    .custom-toggle-button
    {
        margin-top: 10px;
    }
}

@media (min-width:600px) and (max-width:1024px) {}

@media (min-width:600px) and (max-width:1024px) and (orientation:portrait) {}

@media (max-width: 576px) {

    /* Image-show-page-responsive-page-css::Start */
    .pass-fail-button-top {
        margin-top: 15px;
        text-align: center;
    }
    .all-underbody-col .card-body {
        padding: 0px 15px !important;
    }
    .mark-damage-button-main .damage-button {
        justify-content: center;
    }

    .slick-arrow-btn {
        display: none !important;
    }

    .header-main .dns-logo img {
        width: 115px;
    }

    .user-role-content .btn.dropdown-toggle {
        padding: 0px !important;
    }

    .all-vins-col {
        margin-top: 60px !important;
    }

    /* Image-show-page-responsive-page-css::End */
}


@media (min-width:768px) and (max-width:1024px) and (orientation:portrait) {}

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

    /* Index-page-responsive-css(04-08-2023)::Start */
    .notification-col {
        max-width: 35% !important;
        flex: 0 0 35% !important;
    }

    .image-modal-col {
        max-width: 65% !important;
        flex: 0 0 65% !important;
    }

    /* Index-page-responsive-css(04-08-2023)::End */
    
}

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

    /* Index-page-responsive-css::Start */
    /* .car-details span,
    .car-details p {
        font-size: 13px !important;
    } */
    /* Index-page-responsive-css::End */
    .custom-toggle-button
    {
        margin-top: 10px;
    }
}

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

    /* Index-page-responsive-css::Start */
    /* .all-vins-col {
        max-width: 400px;
    }

    .all-underbody-col {
        left: 400px;
        max-width: calc(100% - 400px);
    } */

    /* .car-details p,
    .car-details span {
        font-size: 13px;

    } */
    .notification-card {
        height: 84vh;
    }

}

/* Location-responsive-breakpoints::End */

@media (min-width:1920px) and (max-width:2500px) {

    /* Index-page-responsive-css::Start */
    .all-vins-col {
        top: 80px;
        width: 450px;
        position: sticky;
        left: 0;
        height: calc(100% - 0px);
    }  
    .notification-col {
        max-width: 25% !important;
        flex: 0 0 25% !important;
    }

    .image-modal-col {
        max-width: 75% !important;
        flex: 0 0 75% !important;
    }


    /* Index-page-responsive-css::End */
}

@media (min-width:1440px) and (max-width:1919px){

    /* Index-page-responsive-css(04-08-2023)::Start */
    .notification-col {
        max-width: 30% !important;
        flex: 0 0 30% !important;
    }

    .image-modal-col {
        max-width: 70% !important;
        flex: 0 0 70% !important;
    }

    /* Index-page-responsive-css(04-08-2023)::End */
}