/*DESTKOP STYLES*/
@media (min-width: 601px) {
    .table-container,
    .table-container *,
    .compact-table,
    .compact-table * {
        font-family: Verdana, sans-serif !important;
    }

    /* Also cover the top notice text */
    .mud-typography {
        font-family: Verdana, sans-serif !important;
    }

    /*delete the padding at the top*/
    .mud-main-content {
        padding-top: 1rem;
    }

    /*ovverride of padding for the normal cells*/
    .compact-table .mud-table-cell {
        padding: 4px 6px !important;
    }

    /*ovverride of padding for the chips representing the type of the document*/
    .compact-table .mud-chip {
        margin: 2px !important;
    }

    /*ovverride of padding for the first unused cell */
    .compact-table .mud-table-row > td:first-child {
        padding: 0 !important;
        padding-left: 1px !important;
    }

    /*Fill iframe width */
    .table-container {
        width: 100%;
    }

    .mud-table-container {
        overflow-x: visible !important;
        overflow-y: visible !important;
    }

    /*This will hide scrollbars for the whole page , no loop and laging */
    html, body {
        overflow: hidden !important;
        margin: 0;
        padding: 0;
    }

    .compact-table .mud-table-root {
        width: 100% !important;
    }

    /*change the font size to 12px as in previous example*/
    .compact-table .mud-table-cell {
        white-space: normal;
        overflow-wrap: break-word;
        word-break: break-word !important;
        font-size: .700rem;
    }

    .compact-table .mud-chip-container {
        display: flex;
        flex-wrap: wrap;
    }

    .compact-table .mud-table-cell.date-box {
        word-break: normal !important;
    }

    .compact-table .mud-table-head th {
        background-color: #00A1E0;
        color: white !important;
        line-height: 1rem !important;
    }

    /*Only do not break vyrizeni in the middle of the word*/
    .compact-table .mud-table-head th:nth-child(6) {
        white-space: nowrap !important;
    }

    .compact-table .mud-table-head th:nth-child(7) {
        white-space: nowrap !important;
    }

    .compact-table table {
        table-layout: fixed;
        width: 100%;
    }

    .compact-table th:nth-child(1),
    .compact-table td:nth-child(1) {
        width: 3%;
    }

    .compact-table th:nth-child(2),
    .compact-table td:nth-child(2) {
        width: 12%;
    }

    .compact-table th:nth-child(3),
    .compact-table td:nth-child(3) {
        width: 12%;
    }

    .compact-table th:nth-child(4),
    .compact-table td:nth-child(4) {
        width: 39%;
    }

    .compact-table th:nth-child(5),
    .compact-table td:nth-child(5) {
        width: 8%;
    }

    .compact-table th:nth-child(6) {
        white-space: nowrap;
        width: 7%;
    }

    .compact-table td:nth-child(6) {
        width: 7%;
    }

    .compact-table th:nth-child(7) {
        white-space: nowrap;
        width: 7%;
    }

    .compact-table td:nth-child(7) {
        width: 7%;
    }

    .compact-table th:nth-child(8),
    .compact-table td:nth-child(8) {
        width: 12%;
    }
}

/*MOBILE STYLES*/
@media (max-width: 600px) {
    .table-container,
    .table-container *,
    .compact-table,
    .compact-table * {
        font-family: Verdana, sans-serif !important;
    }

    /* Also cover the top notice text */
    .mud-typography {
        font-family: Verdana, sans-serif !important;
    }

    /*Fill iframe width */
    .table-container {
        width: 100%;
    }

    .mud-table-container {
        overflow-x: visible !important;
        overflow-y: visible !important;
    }
    /*ovverride of padding for the normal cells*/
    .compact-table .mud-table-cell {
        padding: 1px 1px !important;
        display: revert;
        font-size: 11px;
    }

    .compact-table .mud-table-root {
        width: 100% !important;
    }
    .compact-table .mud-table-cell::before {
        display: none !important;
        content: none !important;
    }

    .compact-table .mud-chip-content {
        display: flex;
        flex-wrap: wrap;
        font-size: 0.350rem !important;
    }
    html, body {
        overflow: hidden !important;
        margin: 0;
        padding: 0;
    }

    .compact-table .mud-table-head th {
        background-color: #00A1E0;
        color: white !important;
        line-height: 1rem !important;
    }
    .compact-table table {
        table-layout: fixed;
        width: 100%;
    }
    
    .compact-table th:nth-child(1),
    .compact-table td:nth-child(1) {
        width: 3%;
        word-break: break-word !important;
    }

    .compact-table th:nth-child(2),
    .compact-table td:nth-child(2) {
        width: 12%;
        word-break: break-word !important;
    }

    .compact-table th:nth-child(3),
    .compact-table td:nth-child(3) {
        width: 12%;
        word-break: break-word !important;
    }

    .compact-table th:nth-child(4),
    .compact-table td:nth-child(4) {
        width: 32%;
        word-break: break-word !important;
    }

    .compact-table th:nth-child(5){
        width: 10%;
        word-break: break-word !important;
    },
    .compact-table td:nth-child(5) {
        width: 10%;
    }

    .compact-table th:nth-child(6) {
        word-break: break-word !important;
        width: 10%;
    },

    .compact-table td:nth-child(6) {
        width: 10%;
    }

    .compact-table th:nth-child(7) {
        word-break: break-word !important;
        width: 10%;
    }

    .compact-table td:nth-child(7) {
        width: 10%;
    }
    .compact-table th:nth-child(8)
    {
        width: 10%;
        word-break: break-word !important;
    }
    .compact-table td:nth-child(8) {
        width: 10%;
    }
}