:root {

    --system-background-color: #DEF;

    --nav-side-background-color: var(--lone-tree-dark-grey);
    --nav-side-menu-background-color: var(--lone-tree-grey);
    --nav-side-menu-highlight-background-color: var(--lone-tree-light-blue);
    --nav-side-menu-selected-background-color: var(--lone-tree-light-grey);
    --nav-side-menu-text-color: var(--lone-tree-black);
    --nav-side-menu-selected-text-color: var(--lone-tree-black);
    --nav-side-sub-menu-highlight-background-color: var(--lone-tree-light-blue);
    --nav-side-sub-menu-selected-background-color: var(--lone-tree-dark-blue);
    --nav-side-sub-menu-text-color: var(--lone-tree-white);
    --nav-side-sub-menu-selected-text-color: var(--lone-tree-white);

    --nav-top-background-color: var(--lone-tree-white);
    --nav-top-button-background-color: #FFF;
    --nav-top-border-color: var(--lone-tree-dark-blue);
    --nav-top-title-color: var(--lone-tree-dark-blue);
    --nav-top-subtitle-color: var(--lone-tree-black);

    --header-background-color: #FFF;
    --sub-header-background-color: #FFF;

    --table-heading-row-background-color: #FFF;
    --table-heading-row-text-color: var(--lone-tree-dark-blue);
    --table-row-background-color: #FFF;
    --table-row-border-color: #a8d7f0;
    --table-alt-row-background-color: #FFF;
    --table-row-highlight-background-color: #EEE;

    --light-text-color: #FFF;
    --alt-light-text-color: #FFF;
    --dark-text-color: var(--lone-tree-dark-grey);
    --alt-dark-text-color: var(--lone-tree-dark-blue);
    --black-text-color: #FFF;

    --form-label-text-color: var(--lone-tree-dark-blue);
    --form-input-text-color: #FFF;
    --form-input-background-color: #f8fcff;
    --form-input-border-color: #a8d7f0;

    --button-background-color: var(--lone-tree-dark-blue);
    --button-highlight-background-color: var(--lone-tree-light-blue);
    --button-text-color: var(--lone-tree-white);
    --button-highlight-text-color: var(--lone-tree-white);
    --button-border-color: var(--lone-tree-dark-blue);

    --login-box-background: var(--lone-tree-light-blue);

    --card-header-color: var(--lone-tree-white);
    --card-header-background-color: var(--lone-tree-dark-grey);

}

.text-alt-dark {
    color: var(--alt-dark-text-color);
}