@media screen and (max-width: 800px)
{
    .show-menu-btn,.hide-menu-btn
    {
        display: block;
    }

    .menu
    {
        top: 0;
        width: 100%;
        right: -100%;
        height: 100%;
        position: fixed;
        background: #333;
        transition: 0.7s;
        min-height: 100vh;
        text-align: center;
        overflow-y: scroll;
        line-height: normal;
    }
    .menu a
    {
        padding: 20px;
        display: block;
        overflow-y: scroll;
    }

    #MobileMenu:checked ~ .menu
    {
        right: 0;
    }

    .hide-menu-btn
    {
        top: 15px;
        right: 15px;
        position: absolute;
    }

    .qr-dashboard-quick-view
    {
        box-shadow: none;
    }

    .qr-dashboard-quick-view > .qr-widget
    {
        width: 100%;
        max-width: 100%;
        margin-bottom: 10px;
        border-radius: 5px 5px 5px 5px;
    }

    .menu a:hover, .show-menu-btn:hover, .hide-menu-btn:hover, .menu a.current
    {
        color: #000;
        background-color: rgba(255, 255, 255, 0.95);
    }

    .qr-login-validate:before
    {
        opacity: 1;
        visibility: visible;
    }

    .qr-change-department select#ChangeDepartment
    {
        width: 100%;
        margin-top: 10px!important;
    }

    .qr-dashboard > .col-6:nth-child(2n)
    {
        padding-left: 0!important;
        padding-right: 0!important;
        padding-top: 30px!important;
    }

    .dataTables_wrapper .dataTables_info
    {
        white-space: unset!important;
    }

    table tr td button:nth-of-type(2n)
    {
        margin-left: 5px;
        margin-right: 5px;
    }
    table tr td button
    {
        display: inline-block!important;
    }

    .qr-room-btn > button:nth-of-type(2n)
    {
        margin-top: 5px;
        margin-bottom: 5px;
    }

    .qr-floor-wrap button
    {
        width: fit-content;
        height: fit-content;
        display: inline-block;
        margin: 5px!important;
        padding: 10px!important;
    }

    .qr-floor-wrap button > div.progress { display: none }

    .qr-align-middle { margin-bottom: 1rem }

    .main { padding-top: 10px; }

    .qr-footer { margin-top: 10px; }

    .error-container
    {
        flex: 0 0 100% !important;
    }

    .mobile-error-container
    {
        background-color: rgba(255, 255, 255, 0.4) !important;
        height: 45% !important;
        width: 45% !important;
        margin: auto;
        order: 1;
    }

    .qr-bill-comment
    {
        width: 100%;
        margin-bottom: 10px;
    }

    .qr-bill-comment:last-child
    {
        margin-bottom: 0!important;
    }

    .qr-bill-comment .qr-bill-title-color
    {
        width: 30px;
        height: 30px;
        transform: translateY(5px);
    }

    .container-fit {
        max-width: 95% !important;
    }
}