#app, body{
    background-color: #004085;
}

.bg-lightblue{
    background-color: lightblue;
}

table.mobile, table.desktop-as-mobile {
    border-spacing: 0;
}

table.mobile td,
table.mobile th,
table.desktop-as-mobile td,
table.desktop-as-mobile th{
    padding: 0.5em;
}

table.mobile th,
table.desktop-as-mobile th{
    font-weight: bold;
    text-align: left;
}

table.mobile thead th,
table.desktop-as-mobile thead th{
    background-color: lightblue;
    color: black;
}

table.mobile td > div,
table.desktop-as-mobile td > div{
    float: right;
}

table.mobile tbody tr td input,
table.desktop-as-mobile tbody tr td input{
    border: 1px solid #999;
}

table.dataTable tbody tr.odd, table.table-bordered tbody tr:nth-child(odd)
{
    background-color: lightsteelblue;
}

@media only screen and (max-width: 40em) {
    table.mobile thead th {
        display: none;
    }
    table.mobile td, table.mobile th {
        display: block;
        clear: both;
    }
    table.mobile td[data-th]:before {
        content: attr(data-th);
        float: left;
        padding-right: 5px;
    }
}

table.desktop-as-mobile thead th {
    display: none;
}
table.desktop-as-mobile td, table.desktop-as-mobile th {
    display: block;
    clear: both;
}
table.desktop-as-mobile td[data-th]:before {
    content: attr(data-th);
    float: left;
    padding-right: 5px;
}

