:root {
    --nvts-light-navy: #2D3B59;
    --nvts-link-hover: #718CC2;
    --nvts-button-hover: #3F5481;
    --nvts-button-idle: #2D3B59;
    --nvts-border-lt: #b3b3b3;
    --nvts-border-dk: #787878;
    --nvts-font-color: #ff00d4;
    --nvts-table-shading: #3c5280;
    --nvts-navy: #617ca7;
}

body {
    font-family: 'Inter', serif;
    color: var(--nvts-font-color);
    letter-spacing: -0.375px;
    background-color: whitesmoke;
    font-weight: 300;
}

b {
    font-weight: 500;
}

h1 {
    font-size: 25px;
    margin: 30px 40px;
}

hr {
    margin: 10px 0.5px;
}

/* layout */

.row-custom {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    width: 100%;
}
  
.column-custom {
    display: flex;
    flex-direction: column;
    flex-basis: 100%;
    flex: 1;
}

/* button css */

.btn {
    border-radius: 13px;
    border: none;

    padding: 13px 28px;
    
    color: white;
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    line-height: normal;
    letter-spacing: -0.4px;
    white-space: nowrap;
    background-color: var(--nvts-button-idle);
}

.btn:hover, .btn:focus, .btn:visited {
    color: white;
    background-color: var(--nvts-button-hover);
}

.btn-sm {
    border-radius: 13px;
    border: none;

    padding: 8px 28px;
    
    color: white;
    font-size: 16px;
    font-weight: 500;
    font-style: normal;
    line-height: normal;
    letter-spacing: -0.4px;
    white-space: nowrap;
    background-color: var(--nvts-button-idle);
}

.btn-sm:hover, .btn-sm:focus, .btn-sm:visited {
    color: white;
    background-color: var(--nvts-button-hover);
}

.btn-del {
    color: white;
    background-color: red;
}

.btn-del:hover, .btn-del:focus, .btn-del:visited {
    color: white;
    background-color: rgb(255, 70, 70);
}

.text-only-btn {
    border: none;
    background: none;

    color: var(--nvts-button-idle);
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.375px;
    white-space: nowrap;
}

.text-only-btn:hover {
    color: var(--nvts-button-hover)
}

/* card css */

.card {
    margin: 15px;
    border-radius: 13px;

    padding: 25px;

    border: 1px solid var(--nvts-border-lt);
    background-color: white;
}

.card-sm {
    margin: 15px;
    border-radius: 13px;
    padding: 15px 15px;

    border: 1px solid var(--nvts-border-lt);
    background-color: white;
}

.card-sm-text {
    font-weight: 300;
    margin-top: 1px;
    white-space: nowrap;
}

.card-body-2 {
    display: inline-block;
    padding: 0px;
}

.card-title {
    display: inline-block;
    transform: translateY(15%);
    font-size: 25px;
    margin: 0px 5px;
}

.card-holder {
    display: flex;
    flex-direction: row;
    justify-content: top;
    overflow-x: auto;

    height: 100%;
}

/* table css */

table {
    empty-cells: hide;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
}

th {
    border: 1px solid #476cb7;
    background-color: var(--nvts-navy);
    color: white;

    padding: 25px;

    font-weight: 500;
}

td {
    border: 1px solid var(--nvts-border-lt);

    padding: 20px;

    line-height: 87%;
}

.fa-cases-table th,
.far-cases-table th {
    background-color: var(--nvts-light-navy);
    color: white;
}

th:empty, td:empty {
    border: none;
}

/* form css */
.form-input {
    border-radius: 6px;
    border: 1px solid #DBDBDB;
    background: white;
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (max-width: 1000px) {
    .row-custom {
        flex-wrap: wrap;
    }

    .card {
        margin: 15px 30px;
    }
}