div.table-wrapper {
    width: 100%;
    overflow-x: scroll;
}



@media (max-width: 1399.98px) {

    div.table-wrapper {
        width: calc(100vw - 2.25rem - var(--nav-side-width));
    }
}

@media (max-width: 991.98px) {

    div.table-wrapper {
        width: calc(100vw - 2.25rem);
    }
}


table {
    border-collapse: collapse;
}

table td {
}

table.parts td {
    padding-left: 30px;
    font-size: 20px;
}

table.view {
    width: 100%;
    border-collapse: collapse;
}

table.view tr.tr-row0:hover td,
table.view tr.tr-row1:hover td,
table.view tr.row:hover td {
    background: var(--table-row-highlight-background-color);
}


table.view tr.row0 td input:focus, table.view tr.row1 td input:focus, table.view tr.row td input:focus {
    transform: scale(1.1, 1.1);
    font-weight: 600;
    box-shadow: 0px 0px 10px #333;
    background: #FFF;
}

table.view a {
}

table.view td {
    padding: 0.25rem;
    height: 34px;
    border-bottom: 1px solid var(--table-row-border-color);
}

table.view input.forminput {
    border: 1px solid #00B;
    font-size: 20px;
}

table.view input[type=text] {
    margin: 2px;
    border: 1px solid var(--form-input-border-color);
    font-size: 1.4rem;
    padding: 6px;
    background: var(--form-input-background-color);
}

table.view select {
    margin: 2px;
    border: 1px solid #AAA;
    font-size: 1.4rem;
    padding: 5px;
    background: rgba(255, 255, 255, 0.5);
}

.rowtitle {
    /*position: sticky;*/
    top: calc(var(--nav-top-height) - 1px);
}

.rowtitle td {
    text-align: center;
    font-weight: 600;
    font-size: 1.6rem;
    background: var(--table-heading-row-background-color);
    color: var(--table-heading-row-text-color);
    white-space: nowrap;
}

table .tr-row {
    background: var(--table-row-background-color);
    font-size: 1.4rem;
}

table .td-row0 {
    background: var(--table-row-background-color);
    font-size: 1.4rem;
}

table .td-row1 {
    background: var(--table-alt-row-background-color);
    font-size: 1.4rem;
}