@media only screen and (max-device-width: 1024px)  {

     /*Force table to not be like tables anymore*/
     table.db-datatable, table.db-datatable thead, table.db-datatable tbody, table.db-datatable th, table.db-datatable td, table.db-datatable tr {
         display: block;
     }

    /*Hide table headers (but not display: none;, for accessibility)*/
    table.db-datatable thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    table.db-datatable td {
        /*Behave  like a "row"*/
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
    }

    table.db-datatable td:before {
        /*Now like a table header*/
        position: absolute;
        /*Top/left values mimic padding*/
        top: 0;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        word-wrap: break-word;
        padding: 0.25rem 0.25rem 0.25rem 0;
    }

    table.db-datatable td:before {
        content: attr(data-title) " ";
        font-weight: 700;
    }
    .db-td-aktionen:before {
        text-align: left;
    }
    .db-td-aktionen {
        text-align: center;
        padding: 8px 5px 8px 50%;
    }
    table.db-datatable td.db-td-aktionen, table.db-datatable td {
        padding-left: 50%;
        min-height: 50px;
    }
    .db-td-aktionen a {
        text-decoration: none;
    }
    table.db-datatable tr:nth-child(odd) {
        background: transparent;
    }
    table.db-datatable tr {
        padding: 15px 7px;
    }
    .table-striped > tbody > tr:nth-of-type(2n) {
        background-color: var(--grey-4);
    }
    body.darkmode .table-striped > tbody > tr:nth-of-type(2n) {
        background-color: #555657;
    }
    .crudDataColumn div[data-col] {
        display: block;
        min-height: 24px;
    }
    .db-td-aktionen-box {
        display: flex;
        justify-content: flex-start;
    }
    div.db-platzhalter-icon{
        display: none;
    }
    .db-text-align-right {
        text-align: left;
    }
}


@media only screen and (max-width: 580px) {
    table.db-datatable td:before {
        font-size: 14px;
    }
    table.db-datatable td.db-td-aktionen, table.db-datatable td {
        font-size: 14px;
    }
}