@media (max-width: 991px) {
    .desktop {
        display: none !important;
    }

    .mobile {
        display: block !important;
    }

    .main-appbar {
        background-color: white;
    }

    .emptylayout-rightpanel {
        margin: 0px;
        border-radius: 0px;
        width: 100%;
        min-width: 100%;
    }

    .mud-drawer-close-mini-md-left.mud-drawer-left-clipped-never .mud-appbar {
        margin-left: 0 !important;
        width: 100%;
    }

    .mud-drawer-close-mini-md-left .mud-main-content {
        margin-left: 0 !important;
        width: 100%;
    }

    .main-appbar svg {
        color: #10567E !important;
    }


    .mud-toolbar-gutters {
        padding-left: 6px;
        padding-right: 6px;
    }

    .mud-toolbar-gutters {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    .mud-appbar .mud-toolbar-appbar {
        height: auto !important;
    }


    .cliper-tabs-container .mud-tabs-toolbar-wrapper > .mud-tooltip-root {
        flex-grow: 1;
    }

    .main-container {
        height: calc(100% - 168px) !important;
    }

    .cliper-tabs-container .mud-tabs-toolbar {
        margin-left: -16px;
        margin-right: -16px;
    }

    .two-tabs-container > .mud-tabs-toolbar > .mud-tabs-toolbar-inner > .mud-tabs-toolbar-content > .mud-tabs-toolbar-wrapper > .mud-tooltip-root {
        width: 50%;
    }

    .mud-table-container{
        height: calc(100% - 50px) !important;
    }

    .mud-pagination{
        width: 100% !important;
    }

    .mud-main-content {
        height: calc(100% - 6px) !important;
        max-height: calc(100% - 6px) !important;
    }

    .data-grid-action{
        width:100%;
    }

    .cliper-switch-container > .content-text {
        flex: 1 1 0% !important;
    }
}

@media(max-width: 700px){
    .sign-in-provider-button {
        height: 48px;
        width: 48px;
    }

    .mud-xs-table .mud-table-row {
        display: table-row !important;
        min-width: 100% !important;
    }

    .mud-xs-table.mud-table-dense .mud-table-cell {
        padding: 0px;
        display: block;
        width: 99.9%;
        clear: both;
    }
}

@media(max-width:599px){
    .stretched-icon-button {
        width: 100%;
        /*padding-right: 0px;
        padding-left: 0px;*/
        margin-right:-16px;
        margin-left:-8px;
    }

    .stretched-icon-button > .mud-button-label > .mud-button-icon-end {
        margin-left: calc(100% - 165px) !important;
        margin-right: 9px;
    }

    .page-header-label{
        font-size:16px !important;
    }

    .data-grid-action{
        margin-bottom: 10px;
    }
}

@media(max-width: 376px) {
    :root {
        --h2px: 1px;
        --h4px: 2px;
        --h6px: 3px;
        --h8px: 4px;
        --h10px: 5px;
        --h12px: 6px;
        --h14px: 7px;
        --h16px: 8px;
        --h18px: 9px;
        --h20px: 10px;
        --h24px: 12px;
        --h28px: 14px;
        --h32px: 16px;
        --h36px: 18px;
        --h40px: 20px;
        --h48px: 24px;
        --h56px: 28px;
        --h64px: 32px;
    }
}

@media (max-height: 768px) {
    :root {
        --v2px: 1px;
        --v4px: 2px;
        --v6px: 3px;
        --v8px: 4px;
        --v10px: 5px;
        --v12px: 6px;
        --v14px: 7px;
        --v16px: 8px;
        --v18px: 9px;
        --v20px: 10px;
        --v24px: 12px;
        --v28px: 14px;
        --v32px: 16px;
        --v36px: 18px;
        --v40px: 20px;
        --v48px: 24px;
        --v56px: 28px;
        --v64px: 32px;
        --mud-typography-default-size: .75rem;
        --mud-typography-body1-size: .9rem !important;
    }

    .mud-button {
        font-size: 16px
    }

    .mud-input{
        font-size:0.9rem;
    }

    .login-title {
        font-size: 26px;
        line-height: 32px;
    }
    .page-header-label{
        font-size:15px;
    }

    .emptylayout-leftpanel-image{
        max-width:65%;
    }

    .emptylayout-rightpanel{
        width:400px;
    }
}