        body {
            background-color: #eee;
            height: 100vh;
        }

        * {
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
        }

        .src-card {
            max-width: 16em;
        }

        /* table displays r always separate, should use a sticky header to keep the column names visible */
        table {
            border-collapse: separate;
        }

        td {
            white-space: nowrap;
        }

        thead tr th {
            position: sticky;
            top: 0 !important;
            text-align: center;
            z-index: 4;
            background-color: #78849f !important;
            border: 2px outset #68718f;
            box-shadow: 0;
            color: #f0ffff !important;
            text-wrap: nowrap;
        }

        /* specifically for the file editor */

        .fileeditor-column {
            text-wrap: nowrap;
        }

        .fileeditor-row #fileeditor-btn-delrow,
        .fileeditor-column #fileeditor-btn-delcol {
            visibility: hidden;
        }

        .fileeditor-row:hover #fileeditor-btn-delrow,
        .fileeditor-column:hover #fileeditor-btn-delcol {
            visibility: visible;
        } 

        .table-editor tr:nth-child(1) th:nth-child(1),
        .table-editor tr:nth-child(1) th:last-child,
        #fileeditor-addrow > td {
            background-color: #fafafa !important;
            border-color: transparent !important;
        }

        .fileeditor-cell > input {
            width: 100%;
            height: 100%;
            border: none;
            background-color: transparent;
        }

        .fileeditor-cell > input:focus {
            border: initial;
            background-color: initial;
        }

        .table-editor tr th:first-child,
        .table-editor tr td:first-child {
            position: sticky;
            left: 0;
            z-index: 1;
        }

        .table-editor * tr th:first-child {
            z-index: 3;
        }

        .table-editor tr,
        th {
            box-shadow: 2px 2px #dee2e6, 2px 2px #dee2e6;
        }

        /* and specifically for the file selection display */
        .table-files * tr td:nth-child(odd) {
            background-color: #fafafa;
        }

        .table-files * tr td:nth-child(even) {
            background-color: rgb(241, 246, 255);
        }

        .table-files * tr td button {
            width: 2.5em;
            height: 2.5em;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-right: 1em;
        }

        /* for file selection */
        .fileselect-row {
            cursor: pointer;
        }

        .fileselect-row:hover td {
            background-color: #d2edf0 !important;
        }

        /* navbar / signout */

        ul {
            list-style-type: none;
        }

        #sitenav {
            background-color: #4e4d5b;
            border-color: #463f4b;
            border-bottom: 1px solid;
            visibility: hidden; /* overwritten by code */
        }

        #navbar-username {
            color: #fff;
            font-weight: 300;
        }

        /* container time */

        .main-header {
            background-color: #64507f;
            color: #eafdff;
            font-weight: bolder;
        }

        .card {
            background-color: #f7f7f5ba;
        }

        #bg-overlay {
            position: fixed;
            display: grid;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: -2;
            overflow: hidden;
        }

        #bg-image {
            position: fixed;
            justify-self: center;
            align-self: center;
            z-index: -1;
            opacity: 1;
        }

        .card-header * {
            font-weight: bolder;
        }

        .container-fluid {
            min-width: 25vh !important;
            min-height: 25vh !important;
            width: 100%;
            height: 100%;
            min-height: 100%;
            margin: 0 auto !important;
            display: flex;
            /* position: fixed; */
            justify-content: center;
            align-items: center;
            display: none;
            /* fixed w/ setVisible(true) */
        }


        .btn-primary {
            --bs-btn-bg: #9480af !important;
        }

        .btn-primary,
        .btn-outline-primary {
            --bs-btn-disabled-bg: #676767 !important;
            --bs-btn-disabled-border-color: #4c4c4c !important;
            --bs-btn-color: #321862 !important;
            --bs-btn-border-color: #64507f !important;
            --bs-btn-active-color: #fff !important;
            --bs-btn-active-bg: #9480af !important;
            --bs-btn-active-border-color: #64507f !important;
            --bs-btn-focus-bg: #9480af !important;
            --bs-btn-focus-border-color: #64507f !important;
            --bs-btn-hover-bg: #af7fee !important;
            --bs-btn-hover-border-color: #9b67df !important;
        }

        .btn-primary:hover,
        .btn-outline-primary:hover {
            background-color: #af7fee !important;
            border-color: #9b67df !important;
        }

        .btn-info,
        .list-group-item.active {
            background-color: #bcd4d6 !important;
            border-color: #9cb4b6 !important;
            color: #486163 !important;
        }

        .spinny-load {
            justify-content: center;
            align-items: center;
            display: none;
            /* fixed w/ setLoading(true) on container */
            opacity: 0;
            position: fixed;
            overflow: hidden;
            left: 0;
            right: 0;
            top: 0;
            bottom: 0;
            margin: -80px;
            background-color: #3337;
            z-index: 9999;
        }

        /* error messages */
        #errorModal-text {
            font-family: monospace;
            font-size-adjust: 0.3;
        }

        #validationTable thead tr td {
            text-wrap: wrap;
        }