/* ============================================================================ */
/*      FONT FACE                                                               */
/* ============================================================================ */
@font-face {
    font-family: "Roboto";
    src: url(/TenantsContent/Default/content/fonts/Roboto/Roboto-Thin.ttf);
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: "Roboto";
    src: url(/TenantsContent/Default/content/fonts/Roboto/Roboto-ThinItalic.ttf);
    font-weight: 100;
    font-style: italic;
}
@font-face {
    font-family: "Roboto";
    src: url(/TenantsContent/Default/content/fonts/Roboto/Roboto-Light.ttf);
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: "Roboto";
    src: url(/TenantsContent/Default/content/fonts/Roboto/Roboto-LightItalic.ttf);
    font-weight: 300;
    font-style: italic;
}
@font-face {
    font-family: "Roboto";
    src: url(/TenantsContent/Default/content/fonts/Roboto/Roboto-Regular.ttf);
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: "Roboto";
    src: url(/TenantsContent/Default/content/fonts/Roboto/Roboto-Italic.ttf);
    font-weight: 400;
    font-style: italic;
}
@font-face {
    font-family: "Roboto";
    src: url(/TenantsContent/Default/content/fonts/Roboto/Roboto-Bold.ttf);
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: "Roboto";
    src: url(/TenantsContent/Default/content/fonts/Roboto/Roboto-BoldItalic.ttf);
    font-weight: 700;
    font-style: italic;
}
@font-face {
    font-family: "Roboto-Condensed";
    src: url(/TenantsContent/Default/content/fonts/Roboto_Condensed/RobotoCondensed-Light.ttf);
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: "Roboto-Condensed";
    src: url(/TenantsContent/Default/content/fonts/Roboto_Condensed/RobotoCondensed-LightItalic.ttf);
    font-weight: 300;
    font-style: italic;
}
@font-face {
    font-family: "Roboto-Condensed";
    src: url(/TenantsContent/Default/content/fonts/Roboto_Condensed/RobotoCondensed-Regular.ttf);
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: "Roboto-Condensed";
    src: url(/TenantsContent/Default/content/fonts/Roboto_Condensed/RobotoCondensed-Italic.ttf);
    font-weight: 400;
    font-style: italic;
}
@font-face {
    font-family: "Roboto-Condensed";
    src: url(/TenantsContent/Default/content/fonts/Roboto_Condensed/RobotoCondensed-Bold.ttf);
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: "Roboto-Condensed";
    src: url(/TenantsContent/Default/content/fonts/Roboto_Condensed/RobotoCondensed-BoldItalic.ttf);
    font-weight: 700;
    font-style: italic;
}
@font-face {
    font-family: "Roboto-Mono";
    src: url(/TenantsContent/Default/content/fonts/Roboto_Mono/RobotoMono-VariableFont_wght.ttf);
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: "Roboto-Mono";
    src: url(/TenantsContent/Default/content/fonts/Roboto_Mono/RobotoMono-Italic-VariableFont_wght.ttf);
    font-weight: 400;
    font-style: italic;
}

/*
==========================================================================================================
     INSTRUCTIONS FOR SETTING COLOR VARIATIONS
==========================================================================================================
    + Go to : https://learnui.design/tools/data-color-picker.html#single
----------------------------------------------------------------------------------------------------------
    SETTING THE "LIGHT" COLOR VARIATION
----------------------------------------------------------------------------------------------------------
    + Adjust The Settings :
        - set the "number of colors" to 6...
        - set the "brightness" all the way to the RIGHT...
        - set the "color intensity" all the way to the LEFT...
    + Get Results :
        - in the first box from the LEFT, input the hex code for the color of choice...
        - in the second box from the LEFT, use this hex code as the "light" color variation...
----------------------------------------------------------------------------------------------------------
    SETTING THE "DARK" COLOR VARIATION
----------------------------------------------------------------------------------------------------------
    + Adjust The Settings :
        - set the "number of colors" to 6...
        - set the "brightness" all the way to the LEFT...
        - set the "color intensity" all the way to the LEFT...
    + Get Results :
        - in the first box from the LEFT, input the hex code for the color of choice...
        - in the second box from the LEFT, use this hex code as the "dark" color variation...
*/

:root {
    /* 
    ======================================================================================================
        DEFAULT BRANDING COLOR VARIABLES
    ======================================================================================================
    */
    --color-default-dark: #293037;
    --color-default-dark-inactive: #8D97A1;
    --color-default-dark-active: #3C444D;
    --color-default-light: #E2E4E7;
    --color-default-light-inactive: #F0F1F3;
    --color-default-gray: #9f9f9f;
    --color-default-gray-opaque: #9f9f9f20;
    --color-default-blue: #008d93;
    --color-default-green: #52b967;
    --color-default-green-opaque: #52b96720;
    --color-default-yellow: #ffcc33;
    --color-default-yellow-opaque: #ffcc3320;
    --color-default-orange: #e87600;
    --color-default-red: #ff0000;
    --color-default-red-dark: #e30000;
    --color-default-red-light: #ff8969;
    --color-default-red-opaque: #ff000020;
    --color-default-purple: #844683;
    --color-client-primary: #FFB547; /* --------------- Primary color of companies branding */
    --color-client-primary-opaque: #FFB54740; /* ------ Add "40" to the end of the companies primary branding (hex) color */
    --color-client-primary-light: #FFC36E; /* --------- Reference "setting the light color variation" instructions above */
    --color-client-primary-dark: #C78E3A; /* ---------- Reference "setting the dark color variation" instructions above */
    --color-client-secondary: #75777B; /* ------------- Secondary color of companies branding */
    --color-client-secondary-opaque: #75777B40; /* ---- Add "40" to the end of the companies secondary branding (hex) color */
    --color-client-secondary-light: #8F9194; /* ------- Reference "setting the light color variation" instructions above */
    --color-client-secondary-dark: #5D5E61; /* -------- Reference "setting the dark color variation" instructions above */
    /* 
    ======================================================================================================
        DEFAULT FONT SIZE VARIABLES
    ======================================================================================================
    */
    --fgs-font-family: Roboto, sans-serif;
    --fgs-font-family-alt: Roboto-Condensed, sans-serif;
    --fgs-font-size-body: 1.10rem;
    --fgs-font-size-body-sm: calc(var(--fgs-font-size-body) * 0.85);
    --fgs-font-size-body-lg: calc(var(--fgs-font-size-body) * 1.15);
    --fgs-font-size-heading-4: calc(var(--fgs-font-size-body) * 1.25);
    --fgs-font-size-heading-3: calc(var(--fgs-font-size-body) * 1.45);
    --fgs-font-size-heading-2: calc(var(--fgs-font-size-body) * 1.85);
    --fgs-font-size-heading-1: calc(var(--fgs-font-size-body) * 2.25);
    --fgs-line-height-body: 1.4;
    --fgs-line-height-heading: 1.3;
    --fgs-font-weight-body: 400;
    --fgs-font-weight-ui: 400;
    --fgs-font-weight-heading: 700;
    --fgs-font-weight-heading-alt: 600;
    --fgs-font-size-nav-item: calc(var(--fgs-font-size-body) * 1.10);
    --fgs-font-size-pagination-text: calc(var(--fgs-font-size-body) * 0.9);
    /* 
    ======================================================================================================
        DEFAULT FONT SIZE VARIABLES
    ======================================================================================================
 */
    --fgs-gutter-x: 0px;
    --fgs-gutter-y: 0px;
    --fgs-gutter: 1rem;
    --fgs-gutter-offset: calc(var(--fgs-gutter) * -1);
    --fgs-gutter-xl: calc(var(--fgs-gutter) * 2.5);
    --fgs-gutter-xl-offset: calc(var(--fgs-gutter-xl) * -1);
    --fgs-gutter-lg: calc(var(--fgs-gutter) * 1.5);
    --fgs-gutter-lg-offset: calc(var(--fgs-gutter-lg) * -1);
    --fgs-gutter-sm: calc(var(--fgs-gutter) * 0.5);
    --fgs-gutter-sm-offset: calc(var(--fgs-gutter-sm) * -1);
    --fgs-gutter-xs: calc(var(--fgs-gutter-sm) * 0.5);
    --fgs-gutter-xs-offset: calc(var(--fgs-gutter-xs) * -1);
    --fgs-form-min-height: 38px;
}

/*
===============================================================================
    FONT
===============================================================================
*/
body, p, h1, h2, h3, h4, h5, a, li {
    padding: 0px;
    margin: 0px;
}

/* ---- FONT : Body & General Formatting -------------------------------------- */
body, p, a, ol li, ul li {
    font-family: var(--fgs-font-family);
    font-size: var(--fgs-font-size-body);
    line-height: var(--fgs-line-height-body);
    font-weight: var(--fgs-font-weight-body);
    font-style: normal;
}
h1, .h1 {
    font-family: var(--fgs-font-family);
    /*font-size: 46px;*/
    font-size: var(--fgs-font-size-heading-1);
    line-height: var(--fgs-line-height-heading);
    font-weight: var(--fgs-font-weight-heading);
    font-style: normal;
    margin-bottom: 10px;
}
h2, .h2 {
    font-family: var(--fgs-font-family-alt);
    /*font-size: 36px;*/
    font-size: var(--fgs-font-size-heading-2);
    line-height: var(--fgs-line-height-heading);
    font-weight: 400;
    font-style: normal;
    margin-bottom: 15px;
}
h2.subtitle, .h2.subtitle {
    font-family: var(--fgs-font-family-alt);
    /*font-size: 30px;*/
    font-size: calc(var(--fgs-font-size-heading-2) * 0.85);
    line-height: var(--fgs-line-height-heading);
    font-weight: var(--fgs-font-weight-body);
    font-style: normal;
    margin-bottom: auto;
}
h3, .h3 {
    font-family: var(--fgs-font-family);
   /* font-size: 28px;*/
   font-size: var(--fgs-font-size-heading-3);
    line-height: var(--fgs-line-height-heading);
    font-weight: var(--fgs-font-weight-heading);
    font-style: normal;
    margin-bottom: 10px;
}
h4, .h4 {
/*h4, .h4, table .tab-container thead tr th, table.tab-container thead tr th a, table.tab-container tbody tr.thead-row td {*/
    font-family: var(--fgs-font-family-alt);
   /* font-size: 24px;*/
    font-size: var(--fgs-font-size-heading-4);
    line-height: var(--fgs-line-height-heading);
    font-weight: var(--fgs-font-weight-heading-alt);
    font-style: normal;
    margin-bottom: 5px;
}
h5, .h5, .notice-text, .placeholder-text, .disclaimer, .error, .remember-category-checkbox, .label-tip {
    font-family: var(--fgs-font-family-alt);
/*    font-size: 30px;
    font-size: 1.5vw;*/
    /*font-size: 18px;*/
    font-size: var(--fgs-font-size-body);
    line-height: var(--fgs-line-height-heading);
    font-weight: var(--fgs-font-weight-body);
    font-style: italic;
    letter-spacing: 0.025rem;
}

h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child {
    margin-bottom: 0px;
}

.notice-text, .disclaimer, .error, .remember-category-checkbox, .label-tip {
    font-style: normal;
}
.disclaimer {
    font-size: var(--fgs-font-size-body-sm);
}

h1 a:not(.btn), h1 span, h1.subtitle a:not(.btn), h1.subtitle span, .h1 a:not(.btn), .h1 span, .h1.subtitle a:not(.btn), .h1.subtitle span ,
h2 a:not(.btn), h2 span, h2.subtitle a:not(.btn), h2.subtitle span, .h2 a:not(.btn), .h2 span, .h2.subtitle a:not(.btn), .h2.subtitle span ,
h3 a:not(.btn), h3 span, h3.subtitle a:not(.btn), h3.subtitle span, .h3 a:not(.btn), .h3 span, .h3.subtitle a:not(.btn), .h3.subtitle span ,
h4 a:not(.btn), h4 span, h4.subtitle a:not(.btn), h4.subtitle span, .h4 a:not(.btn), .h4 span, .h4.subtitle a:not(.btn), .h4.subtitle span ,
h5 a:not(.btn), h5 span, h5.subtitle a:not(.btn), h5.subtitle span, .h5 a:not(.btn), .h5 span, .h5.subtitle a:not(.btn), .h5.subtitle span {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    font-weight: inherit;
    font-style: inherit;
    margin-bottom: inherit;
}

/*.notice-text, .placeholder-text {
    font-family: Roboto-Condensed, sans-serif;
    font-size: 18px;
    line-height: 1.4;
    font-weight: 400;
}*/

/*.disclaimer, .error, .remember-category-checkbox, .label-tip {
    font-family: Roboto-Condensed, sans-serif;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 400;
    font-style: normal;
}*/

/*.notice-text {
    font-style: normal;
    margin-bottom: 15px;
}*/

/*.placeholder-text {
    font-style: italic;
    opacity: 0.75;
}*/

.alert {
    padding: 0px;
    margin-bottom: auto;
    border: none;
    -webkit-border-radius: unset;
    -moz-border-radius: unset;
    border-radius: unset;
}
.updated {
    font-size: 14px;
}
.large-text {
    font-size: 80px;
}

p > *, a > *, ol li > *, ul li > * {
    line-height: inherit;
}
strong, * > strong, b, * > b {
    font-weight: bold;
}

/* ---- FONT : Header & Footer ------------------------------------------------ */
.navbar ul.navbar-nav li.nav-item a.nav-link,
#default-nav .default-nav-content ul.navbar li a,
#default-nav.sidebar-menu .sidebar-body ul.navbar li a,
.footer-group .footer-title {
    font-family: var(--fgs-font-family-alt);
    font-size: var(--fgs-font-size-nav-item);
    line-height: var(--fgs-line-height-heading);
    font-weight: var(--fgs-font-weight-heading);
    font-style: normal;
    letter-spacing: 0.035rem;
    text-transform: capitalize;
}

.navbar ul.navbar-nav li.nav-item a.nav-link {
    font-weight: normal;
    font-family: 'Poppins';
    font-weight:800;
}

.footer-group .footer-link {
    font-family: var(--fgs-font-family);
    font-size: var(--fgs-font-size-body);
}
.link-primary,
.link-default,
.link-remove,
.header-group .header-group-inner a {
    font-family: var(--fgs-font-family-alt);
    font-size: var(--fgs-font-size-heading-3);
    line-height: var(--fgs-line-height-heading);
    font-weight: var(--fgs-font-weight-heading-alt);
    font-style: normal;
    white-space: nowrap;
}
#main-footer .grwc_ref .notice-text {
    font-size: 16px;
    text-align: center;
    margin-bottom: 25px;
}

/* ---- FONT : Forms & Input -------------------------------------------------- */
label, .label, .form-row .form-group .inline-group p, .form-row .form-group .inline-group span,
input, input.ui-widget, select, textarea, label input, label select, label textarea {
    font-family: var(--fgs-font-family);
    font-size: var(--fgs-font-size-body);
    line-height: var(--fgs-line-height-body);
    font-weight: var(--fgs-font-weight-heading-alt);
    font-style: normal;
    letter-spacing: 0.035rem;
}
label.checkbox-container,
label.radio-container {
    line-height: 1;
}
label small, .form-row .form-group .inline-group p, .form-row .form-group .inline-group span,
input, input.ui-widget, select, textarea, label input, label select, label textarea {
    font-weight: var(--fgs-font-weight-body);
}
label:not(:last-child) {
    margin-bottom: 5px;
}
.label {
    white-space: nowrap;
}

label + .label-tip {
    margin-top: -5px;
    margin-bottom: 5px;
}
input {
    line-height: 0px;
}
span input ~ span, span select ~ span {
    font-size: 18px;
    font-weight: bold;
}
.progress-bar-container .progress-title {
    font-weight: bold;
}
.progress-bar-container .progress-details small > span {
    font-weight: 400;
}

/* ---- FONT : Tables --------------------------------------------------------- */
/*table tbody tr.thead-row td, */
table tbody tr td.report-title, table tbody tr td.report-title + .value {
    font-family: Roboto, sans-serif;
    font-size: 18px;
    line-height: 1.4;
    font-weight: 600;
    font-style: normal;
}

/* ---- FONT : Misc. Formatting ----------------------------------------------- */
/*#main-body p, #main-body p a, #main-body p span {
    font-size: 22px;
}*/
.divider-title {
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.divider-title::after {
    content: "";
    position: absolute;
    top: calc(50% + 1px);
    
    width:100%;
    margin-left: 0px;
    border-top-width: 2px;
    border-top-style: dashed;
    border-top-color: inherit;
    opacity: 0.5;
}
.flex-row-spaced-center > .divider-title {
    width: auto;
    flex: 1 1 auto;
}
.flex-row-spaced-center > .divider-title + * {
    width: auto;
    flex: 0 0 auto;
    margin-left: 12px;
}
body small, p small, span small, a small, li small, h3 small, h4 small {
    font-family: inherit;
    font-size: 90%;
    line-height: 1.2;
    font-weight: 400;
    font-style: inherit;
}
h1 small, h2 small {
    font-family: Roboto-Condensed, sans-serif;
    font-size: 80%;
    line-height: 1.2;
    font-weight: 400;
    font-weight: 300;
    font-style: inherit;
}
.pagination-container > .pagination > ul > li > * {
    font-family: inherit;
    font-size: 90% !important;
    line-height: inherit;
    font-weight: inherit;
}
body small > *, h1 small > *, h2 small > *, h3 small > *, h4 small > *, p small > *, span small > *, a small > *, li small > *, .pagination-container > .pagination > ul > li > * > * {
    font-size: inherit !important;
}
#completed-goals .tab-container .tab-header h4 {
    font-size: 22px;
}
#completed-goals .tab-container .tab-header h4 small {
    font-size: 75% !important;
}
body strong, strong > *, .description, .description > * {
    font-weight: bold;
}
#validation-container ul li {
    font-size: 18px;
}
table tbody tr.thead-row td.report-title {
    text-transform: uppercase;
}
h3 > .notice-text,
h4 > .notice-text {
    margin: 0px;
}
.page-title {
    margin-bottom: var(--fgs-gutter);
}


/* ============================================================================ */
/*      GENERAL                                                                 */
/* ============================================================================ */
/* ---- GENERAL : Body -------------------------------------------------------- */
body.colorbox-open {
    overflow-y: hidden !important;
    overflow-x: hidden !important;
}
.scrollable {
    overflow-x: hidden;
    overflow-y: scroll;
}
.calendar-preloader {
    float: left;
    width: 128px;
    height: 15px;
    margin-left: 40px;
    margin-top: 5px;
    background: url(/TenantsContent/Default/content/images/calendar-ajax-loader.gif) no-repeat;
}

/* ---- GENERAL : Rows -------------------------------------------------------- */
.row, .container, .container-fluid, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl {
    --bs-gutter-x: var(--fgs-gutter);
    --bs-gutter-y: var(--fgs-gutter);
}
.row,
[style="display:none;"] + .row,
[style="display:none"] + .row,
[style="display: none;"] + .row,
[style="display: none"] + .row {
    margin-top: var(--fgs-gutter-offset);
}

*:not(script, [style="display:none;"], [style="display:none"], [style="display: none;"], [style="display: none"]) + .row:not(:first-child),
form:not(:first-child) > .row:first-child {
    margin-top: 0px;
}

h3 {
    margin-bottom: var(--fgs-gutter);
}
h3 + .row:not([display="none"]) {
    margin-top: var(--fgs-gutter-offset);
}


ol > li:not(:last-child),
ul > li:not(:last-child) {
    margin-bottom: var(--fgs-gutter-sm);
}
ol:not(:last-child),
ul:not(:last-child) {
    margin-bottom: var(--fgs-gutter);
}

/* ---- GENERAL : Formatting --------------------------------------------------- */
.content-area {
    padding-top: var(--fgs-gutter-y);
    padding-bottom: var(--fgs-gutter-y);
}
.content-area-sm {
    padding-top: var(--fgs-gutter-sm);
    padding-bottom: var(--fgs-gutter-sm);
}
.content-area-fullscreen {
    position: relative;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    top: 0px;
    width: 100%;
    height: 100vh;
}
.content-area-auto {
    -webkit-flex: 0 0 0%;
    -ms-flex: 0 0 0%;
    flex: 0 0 0%;
}
 .content-area-fill {
    -webkit-flex: 1 0 0%;
    -ms-flex: 1 0 0%;
    flex: 1 0 0%;
}

#result-body.content-area {
    padding-top: 100px;
    padding-bottom: 50px;
}




/* ============================================================================ */
/*      LAYOUT                                                                  */
/* ============================================================================ */
/* ---- LAYOUT : DOM Elements & Overlays -------------------------------------- */
.data-loading-overlay {
    position: absolute;
    top: 0;
    height: 100%;
    width: 100%;
    opacity:.9;
    background-color: black;    
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    color:black;
    border-radius: 30px;   
}

.loading-spinner {
    width: 100%;
    height: 120px;
    opacity: 1;
    background-image: url(/TenantsContent/Default/content/images/eclipse-loading-spinner.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100px 100px;
    animation: spin .7s infinite linear;
}

.data-loading-content {
    position: absolute;
    top: 40%;
    left: 50%;
    margin-left: -350px;
    opacity: 1;
    border: 10px solid var(--color-client-primary);
    background-color: white;
    width: 700px;
    padding: 25px;
}

.data-loading-text {
    padding-top:10px;
    text-align:center;
    font-size: 32px;
    font-family:Lato;
    color: dimgray;
}

/* ============================================================================ */
/*      FORMATTING                                                                                                                                                                                                   */
/* ============================================================================ */
/* ---- BODY ---------------------------------------------------------------------------- */
/*body {
    position: relative;
    top: 0px;
    left: 0px;
    right: 0px;
    width: 100vw;
    height: 100vh;
    padding: 0px;
    margin: 0px;
    overflow: hidden;
}*/
.app-layout,
.lightbox-layout {
    position: relative;
    top: 0px;
    left: 0px;
    right: 0px;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 0px;
    margin: 0px;
}
.app-layout {
    width: 100vw;
    height: 100vh;
    overflow-x: auto;
    overflow-y: auto;
}
.lightbox-layout {
    width: 100%;
    height: auto;
}
#colorBoxContent.lightbox-layout {
    height: 100%;
}
.app-layout > *,
.lightbox-layout > * {
    -webkit-box-flex: initial;
    -moz-box-flex: initial;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}
.app-layout > .body-content,
.lightbox-layout > .body-content,
.app-layout > .inline-body-content,
.lightbox-layout > .inline-body-content {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -webkit-flex: 1 0 0%;
    -ms-flex: 1 0 0%;
    flex: 1 0 0%;
}

.app-layout > .inline-body-content,
.lightbox-layout > .inline-body-content {
    position: relative;
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-line-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -moz-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-item-align: start;
    align-items: flex-start;
    overflow: hidden;
}
.app-layout > .inline-body-content > .body-content,
.lightbox-layout > .inline-body-content > .body-content {
    height: 100%;
    max-width: 100%;
}



#auth-layout.app-layout {
    overflow-x: auto;
    overflow-y: auto;
}
#dash-layout.app-layout,
#admin-layout.app-layout,
.lightbox-layout {
    overflow-x: hidden;
    overflow-y: hidden;
}
#dash-layout.app-layout > .inline-body-content > .body-content,
#admin-layout.app-layout > .inline-body-content > .body-content,
.lightbox-layout > .inline-body-content > .body-content {
    overflow-y: scroll;
    overflow-x: auto;
}




/*body:not(#corporate-body) {
    display: flex;
    flex-direction: column;
    height: 100vh;
    overflow: hidden;
}
body:not(#corporate-body) > * {
    -webkit-box-flex: initial;
    -moz-box-flex: initial;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}
body:not(#corporate-body) > .body-content {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -webkit-flex: 1 0 0%;
    -ms-flex: 1 0 0%;
    flex: 1 0 0%;
    overflow-y: scroll;
    overflow-x: auto;
}*/

/* ============================================================================ */
/*       HEADER & NAVBAR CONTENT                                                                                                                                                                */
/* ============================================================================ */
.navbar {
    --nav-position: relative;
    --nav-gutter-x: var(--fgs-gutter);
    --nav-gutter-y: var(--fgs-gutter-sm);
    --nav-content-gutter-x: 0px;
    --nav-content-gutter-x-offset: calc(var(--nav-content-gutter-x) * -1);
    --nav-content-gutter-y: 0px;
    --nav-bk-color: #ffffff;
    --nav-link-color: var(--color-default-dark);
    --nav-link-color-active: var(--color-default-dark-active);
    --nav-form-label-color: #000000;
    --nav-form-color: #000000;
    --nav-form-bk-color: #ffffff;
    --nav-border-width: 0px;
    --nav-border-color: var(--color-default-light);
    --nav-min-height: 50px;
    --nav-min-height-adjustment: calc(var(--nav-min-height) - var(--nav-border-width));
    --nav-brand-max-width: 200px;
    --nav-brand-max-height: var(--nav-min-height-adjustment);
    position: var(--nav-position);
    top: 0px;
    left: 0px;
    width: 100%;
    height: auto;
    min-height: var(--nav-min-height-adjustment);
    background-color: var(--nav-bk-color);
    border-bottom-width: var(--nav-border-width);
    border-bottom-style: solid;
    border-bottom-color: var(--nav-border-color);
    padding-top: var(--nav-gutter-y);
    padding-bottom: var(--nav-gutter-y);
    padding-left: calc(var(--nav-gutter-x) * 0.5);
    padding-right: calc(var(--nav-gutter-x) * 0.5);
    z-index: 5;
}
.navbar.fixed-top {
    position: fixed;
    top: 0px;
    right: 0px;
    left: 0px;
    z-index: 1030;
}
.navbar.nav-shadow {
    -webkit-box-shadow: 0px -5px 10px 5px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0px -5px 10px 5px rgba(0, 0, 0, 0.15);
    box-shadow: 0px -5px 10px 5px rgba(0, 0, 0, 0.15);
}
.navbar > .container.justify-center {
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
}
.navbar .navbar-brand {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-inline-flex;
    display: inline-flex;
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-box-align: center;
    -moz-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    width: auto;
    height: var(--nav-brand-max-height);
    max-width: var(--nav-brand-max-width);
    padding-top: var(--nav-content-gutter-y);
    padding-bottom: var(--nav-content-gutter-y);
    padding-left: 0px;
    padding-right: 0px;
    margin-right: var(--nav-gutter-x);
}
.navbar .navbar-brand:only-child {
    margin-right: 0px;
}
.navbar .navbar-brand > img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
}
.navbar .navbar-brand.text-center > img {
    margin: auto;
}
.navbar .navbar-nav .nav-item > *:not(.btn) {
    padding-top: var(--nav-content-gutter-y);
    padding-bottom: var(--nav-content-gutter-y);
    padding-left: var(--nav-content-gutter-x);
    padding-right: var(--nav-content-gutter-x);
}
.navbar .navbar-collapse {
    -webkit-box-align: center;
    -moz-box-align: center;
    -webkit-align-items: center;
    -ms-flex-item-align: center;
    align-items: center;
    padding-left: 0px;
    padding-right: 0px;
}
.navbar .navbar-collapse > * {
    margin-left: var(--nav-gutter-x);
}
.navbar .navbar-nav > * {
    margin: 0px;
}
.navbar .navbar-nav > *:not(:first-child) {
    margin-left: var(--nav-content-gutter-x);
}
.navbar .navbar-nav {
    height: auto;
}
.navbar .navbar-nav .nav-item {
    flex: 0 0 auto;
}
.navbar .navbar-nav .nav-item .nav-link {
    color: var(--nav-link-color);
    text-decoration: none;
    white-space: nowrap;
}
.navbar .navbar-nav .nav-item .nav-link:hover,
.navbar .navbar-nav .nav-item .nav-link:focus,
.navbar .navbar-nav .nav-item .nav-link:active {
    color: var(--nav-link-color-active);
}
.navbar .form-group > label {
    color: var(--nav-form-label-color);
    margin-bottom: 0px;
}
.navbar .form-group > label > select {
    color: var(--nav-form-color);
    background-color: var(--nav-form-bk-color);
}
.navbar .form-group > label + * {
    margin-left: var(--nav-content-gutter-x);
}
.navbar .navbar-nav .nav-item #toggle-calendar.nav-link {
    position: relative;
    color: var(--color-default-gray);
}
.navbar .navbar-nav .nav-item #toggle-calendar.nav-link > i {
    position: relative;
    display: block;
}
.navbar .navbar-nav .nav-item #toggle-calendar.nav-link > i > .event-num-container {
    position: absolute;
    display: block;
    top: calc(var(--nav-content-gutter-y) * -0.5);
    right: calc(var(--nav-content-gutter-x) * -0.5);
    bottom: unset;
    left: unset;
    font-style: normal;
    border-radius: 50%;
    width: auto;
    height: auto;
    color: #ffffff;
    background-color: var(--color-client-secondary);
    padding: 4px 6px;
}
.navbar .navbar-nav .nav-item #toggle-calendar.nav-link > i > .event-num-container > .event-num {
    display: block;
    font-size: 12px;
    line-height: 1;
    font-weight: 400;
}
.fixed-toolbar {
    position: absolute;
    display: none;
    top: 0px;
    left: 0px;
    width: 100%;
    height: auto;
    padding: 0px;
    z-index: 5;
    overflow: hidden;
}
.fixed-toolbar::after {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: url(/TenantsContent/Default/content/images/overlay.png) repeat 0 0;
    opacity: 0.90;
}
.fixed-toolbar .fixed-toolbar-content {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    padding-top: var(--body-gutter-y);
    padding-bottom: var(--body-gutter-y);
    padding-left: 0px;
    padding-right: 0px;
    z-index: 6;
    overflow-y: scroll;
    overflow-x: auto;
}
/* ------------------------------------------------------------------------------------------------------------------------------------- */
/* ---- HEADER : main (variables) ---------------------------------------------------------------------------------------------------------- */
#home-layout.app-layout .navbar {
    --nav-position: sticky;
    --nav-gutter-x: var(--fgs-gutter);
    --nav-gutter-y: var(--fgs-gutter-xs);
    --nav-content-gutter-x: var(--fgs-gutter-sm);
    --nav-content-gutter-y: var(--fgs-gutter-xs);
    --nav-bk-color: transparent;
    --nav-link-color: var(--color-default-dark);
    --nav-link-color-active: var(--color-default-dark-active);
    --nav-form-label-color: #000000;
    --nav-form-color: #000000;
    --nav-form-bk-color: #ffffff;
    --nav-border-width: 0px;
    --nav-border-color: transparent;
    --nav-min-height: 10vh;
    --nav-brand-max-width: 200px;
}
/* ---- HEADER : default (variables) --------------------------------------------------------------------------------------------------------- */
#default-header.navbar {
    --nav-position: relative;
    --nav-gutter-x: 0px;
    --nav-gutter-y: 0px;
    --nav-content-gutter-x: 0px;
    --nav-content-gutter-y: 0px;
    --nav-bk-color: #ffffff;
    --nav-link-color: var(--color-default-dark);
    --nav-link-color-active: var(--color-default-dark-active);
    --nav-form-label-color: #000000;
    --nav-form-color: #000000;
    --nav-form-bk-color: #ffffff;
    --nav-border-width: 0px;
    --nav-border-color: var(--color-default-light);
    --nav-min-height: 50px;
    --nav-brand-max-width: 200px;
}
#auth-layout.app-layout .navbar {
    --nav-position: relative;
    --nav-gutter-x: 0px;
    --nav-gutter-y: var(--fgs-gutter-sm);
    --nav-content-gutter-x: 10px;
    --nav-content-gutter-y: 10px;
    --nav-bk-color: #ffffff;
    --nav-link-color: var(--color-default-dark);
    --nav-link-color-active: var(--color-default-dark-active);
    --nav-form-label-color: var(--color-client-primary);
    --nav-form-color: #ffffff;
    --nav-form-bk-color: var(--color-client-primary);
    --nav-border-width: 0px;
    --nav-border-color: transparent;
    --nav-min-height: 150px;
    --nav-brand-max-width: 450px;
}
#dash-layout.app-layout .header-content .navbar,
#admin-layout.app-layout .header-content .navbar {
    --nav-position: sticky;
    --nav-gutter-x: var(--fgs-gutter-xl);
    --nav-gutter-y: 0px;
    --nav-content-gutter-x: var(--fgs-gutter-sm);
    --nav-content-gutter-y: var(--fgs-gutter-sm);
    --nav-bk-color: #ffffff;
    --nav-link-color: var(--color-client-primary);
    --nav-link-color-active: var(--color-client-primary-dark);
    --nav-form-label-color: var(--color-client-primary);
    --nav-form-color: #ffffff;
    --nav-form-bk-color: var(--color-client-primary);
    --nav-border-width: 4px;
    --nav-border-color: var(--color-default-light);
    --nav-min-height: 80px;
    --nav-brand-max-width: 250px;
}
#dash-layout.app-layout .header-content .navbar .navbar-collapse > *:first-child,
#admin-layout.app-layout .header-content .navbar .navbar-collapse > *:first-child {
    margin-left: auto;
}
#colorbox #dash-layout.app-layout .header-content .navbar,
#colorbox #admin-layout.app-layout .header-content .navbar {
    --nav-position: fixed;
}

/* SIDEBAR NAV*/
.sidebar-content {
    padding: 0px;
}
 .sidebar-content .navbar {
    --nav-gutter-y: var(--fgs-gutter);
    padding-top: 0px;
    padding-bottom: 0px;
}
.sidebar-content .navbar .navbar-nav .nav-item .nav-link {
    padding-top: var(--nav-gutter-y);
}
.sidebar-content .navbar .navbar-nav > *:not(:first-child) {
    margin: 0px;
    margin-top: var(--nav-content-gutter-x);
}
#dash-layout.app-layout .sidebar-content,
#admin-layout.app-layout .sidebar-content {
    position: sticky;
    top: 0px;
    left: 0px;
    width: 250px;
    height: 100vh;
    background-color: var(--color-client-primary);
}
.lightbox-layout .sidebar-content {
    position: relative;
    top: 0px;
    left: 0px;
    width: auto;
    height: 100%;
    background-color: var(--color-client-secondary);
}
#dash-layout.app-layout .sidebar-content .navbar,
#admin-layout.app-layout .sidebar-content .navbar,
.lightbox-layout .sidebar-content .navbar {
    --nav-position: relative;
    --nav-gutter-x: 0px;
    --nav-gutter-y: var(--fgs-gutter);
    --nav-content-gutter-x: var(--fgs-gutter-lg);
    --nav-content-gutter-y: var(--fgs-gutter);
    --nav-bk-color: transparent;
    --nav-link-color: #ffffff;
    --nav-link-color-active: #ffffff;
    --nav-form-label-color: #ffffff;
    --nav-form-color: var(--color-client-primary);
    --nav-form-bk-color: #ffffff;
    --nav-border-width: 0px;
    --nav-border-color: var(--color-default-light);
    --nav-min-height: unset;
    --nav-brand-max-width: unset;
}
#dash-layout.app-layout .sidebar-content .navbar > .container-fluid,
#admin-layout.app-layout .sidebar-content .navbar > .container-fluid,
.lightbox-layout .sidebar-content .navbar > .container-fluid {
    padding: 0px;
}
#dash-layout.app-layout .sidebar-content .navbar .navbar-nav,
#admin-layout.app-layout .sidebar-content .navbar .navbar-nav,
.lightbox-layout .sidebar-content .navbar .navbar-nav {
    width: 100%;
}
#dash-layout.app-layout .sidebar-content .navbar .navbar-nav > *,
#admin-layout.app-layout .sidebar-content .navbar .navbar-nav > *,
.lightbox-layout .sidebar-content .navbar .navbar-nav > * {
    margin: 0px;
}
#dash-layout.app-layout > .inline-body-content > .sidebar-content,
#admin-layout.app-layout > .inline-body-content > .sidebar-content,
.lightbox-layout > .inline-body-content > .sidebar-content {
    height: 100%;
}
.sidebar-content .navbar {
    background-color: transparent;
}
.sidebar-content .navbar .navbar-nav > li + li {
    border-top: 1px solid rgba(0, 0, 0, 0.25);
}

.sidebar-content .navbar .navbar-nav > .nav-item > .nav-link,
.sidebar-content .navbar .navbar-nav > .nav-item > .nav-link:hover,
.sidebar-content .navbar .navbar-nav > .nav-item > .nav-link:focus,
.sidebar-content .navbar .navbar-nav > .nav-item > .nav-link:active,
.sidebar-content .navbar .navbar-nav > .nav-item > .nav-link.active {
    position: relative;
    color: #ffffff;
    background-color: transparent;

}
.sidebar-content .navbar .navbar-nav > .nav-item > .nav-link::after {
    content: "";
    position: absolute;
    top: 0px;
    left: -100%;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0);
    transition: all 0.35s ease-in-out;
    z-index: -1;
}

.sidebar-content .navbar .navbar-nav > .nav-item > .nav-link:hover:not(.active, .selected)::after,
.sidebar-content .navbar .navbar-nav > .nav-item > .nav-link:focus:not(.active, .selected)::after,
.sidebar-content .navbar .navbar-nav > .nav-item > .nav-link:active:not(.active, .selected)::after {
    color: #ffffff;
    background-color: transparent;
    left: 0;
    background: var(--color-client-primary-dark);
    opacity: 0.35;
    z-index: -1;
}
.sidebar-content .navbar .navbar-nav > .nav-item > .nav-link.active::after,
.sidebar-content .navbar .navbar-nav > .nav-item > .nav-link.selected::after {
    left: 0;
    background: var(--color-client-primary-dark);
    opacity: 0.75;
}
.lightbox-layout .sidebar-content .navbar .navbar-nav > .nav-item > .nav-link:hover:not(.active, .selected)::after,
.lightbox-layout .sidebar-content .navbar .navbar-nav > .nav-item > .nav-link:focus:not(.active, .selected)::after,
.lightbox-layout .sidebar-content .navbar .navbar-nav > .nav-item > .nav-link:active:not(.active, .selected)::after {
    background: var(--color-client-secondary-dark);
}
.lightbox-layout .sidebar-content .navbar .navbar-nav > .nav-item > .nav-link.active::after,
.lightbox-layout .sidebar-content .navbar .navbar-nav > .nav-item > .nav-link.selected::after {
    background: var(--color-client-secondary-dark);
}

/* ============================================================================ */
/*       SIDEBAR MENU                                                                                                                                                                                              */
/* ============================================================================ */
#default-nav {
    --sidebar-position: relative;
    --sidebar-gutter-x: var(--fgs-gutter);
    --sidebar-gutter-y: var(--fgs-gutter-sm);
    --sidebar-content-gutter-x: var(--fgs-gutter);
    --sidebar-content-gutter-y: 0px;
    --sidebar-height: 150px;
    --sidebar-width: auto;
    --sidebar-width-offset: calc(var(--sidebar-width) * -1);
    --sidebar-content-width: auto;
    --sidebar-content-height: 58px;
    --sidebar-bk-color: #ffffff;
    --sidebar-link-color: var(--color-default-dark);
    --sidebar-link-color-active: var(--color-default-dark-active);

    position: var(--sidebar-position);
    width: var(--sidebar-width);
    height: var(--sidebar-height);
    background-color: var(--sidebar-bk-color);
}
#default-nav .default-nav-content {
    margin: 0px auto;
}
#default-nav ul li {
    margin-bottom: 0px;
}
#default-nav ul li a {
    height: var(--sidebar-content-height);
}

#default-nav .default-nav-content ul.navbar {
    display: inline-block;
    overflow: hidden;
}
#default-nav .default-nav-content .inline-nav ul.navbar {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
}
#default-nav .default-nav-content ul.navbar li {
    display: inline;
    margin-bottom: 0px;
}
#default-nav .default-nav-content ul.navbar li a {
    display: block;
    height: var(--sidebar-content-height);
    width: var(--sidebar-content-width);
    padding-top: var(--sidebar-content-gutter-y);
    padding-bottom: var(--sidebar-content-gutter-y);
    padding-left: var(--sidebar-content-gutter-x);
    padding-right: var(--sidebar-content-gutter-x);
}
#default-nav .default-nav-content ul.sub-navbar {
    width: 100%;
    height: calc(var(--sidebar-content-height) * 0.5);
    margin: 1px 0 10px 0;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-left: 0 none;
    border-right: 0 none;
}
#default-nav .default-nav-content ul.sub-navbar li a {
    line-height: calc(var(--sidebar-content-height) * 0.5);
    height: calc(var(--sidebar-content-height) * 0.5);
    float: left;
    width: auto;
    border: 0 none;
    padding: 0 10px;
}
#default-nav .default-nav-content ul.sub-navbar li a.active,
#default-nav .default-nav-content ul.sub-navbar li a:hover {
    background: #596775;
    background: -moz-linear-gradient(top, #8c9aa8 0%, #596775 50%, #4e5a67 51%, #8c9aa8 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8c9aa8), color-stop(50%, #596775), color-stop(51%, #4e5a67), color-stop(100%, #8c9aa8));
    background: -webkit-linear-gradient(top, #8c9aa8 0%, #596775 50%, #4e5a67 51%, #8c9aa8 100%);
    background: -o-linear-gradient(top, #8c9aa8 0%, #596775 50%, #4e5a67 51%, #8c9aa8 100%);
    background: -ms-linear-gradient(top, #8c9aa8 0%, #596775 50%, #4e5a67 51%, #8c9aa8 100%);
    filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorstr='#6f8192', endColorstr='#434d58');
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#6f8192', endColorstr='#434d58')";
    background: linear-gradient(top, #8c9aa8 0%, #596775 50%, #4e5a67 51%, #8c9aa8 100%);
    border: #596775 1px solid;
    color: #fff;
    border: 0;
}
.sub-navbar-nav {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    padding-left: 0px;
    margin-bottom: 0px;
    list-style: none;
}
@media(min-width: 992px) {
    .sub-navbar-nav {
        -webkit-flex-direction: row;
        flex-direction: row;
    }
}



#default-nav .default-nav-content ul.navbar li a {
    color: var(--color-default-dark);
}
#default-nav .default-nav-content ul.sub-navbar {
    background: #f7f8f9;
    border-bottom-color: #999;
}
#default-nav .default-nav-content ul.sub-navbar li a {
    color: #596775;
}






    /*#default-nav.sidebar-menu .sidebar-body ul.navbar li a:hover::before,
#default-nav.sidebar-menu .sidebar-body ul.navbar li a:focus::before,
#default-nav.sidebar-menu .sidebar-body ul.navbar li a:active::before,
#default-nav.sidebar-menu .sidebar-body ul.navbar li a.active::before {
    width: 100%;
}*/
    /*#default-nav.sidebar-menu .sidebar-body ul.navbar li a:not(.active):hover,
#default-nav.sidebar-menu .sidebar-body ul.navbar li a.active {
    filter: unset !important;
    background-color: var(--color-client-primary);
}*/
    /*#default-nav.sidebar-menu .sidebar-body ul.navbar li a:not(.active):hover {
    background-color: var(--color-client-secondary);
}*/
    #default-nav.sidebar-menu .sidebar-body {
        padding: 80px 0px;
    }
#default-nav.sidebar-menu .sidebar-body ul.navbar {
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    height: 100%;
    padding: 0;
}

#default-nav.sidebar-menu .sidebar-body ul.navbar li,
#default-nav.sidebar-menu .sidebar-body ul.navbar li a {
    width: 100%;
}
#default-nav.sidebar-menu .sidebar-body ul.navbar li a {
    display: block;
    padding: 20px 0px 20px 30px;
    transition: all 0.2s ease;
}



#default-nav.no-nav {
    --sidebar-height: 0px;
}


/* ============================================================================ */
/*      BODY CONTENT                                                                                                                                                                                             */
/* ============================================================================ */
.body-content {
    --body-position: relative;
    --body-min-height: 30vh;
    --body-width: 100%;
    --body-width-offset: 0px;
    --body-gutter-x: var(--fgs-gutter-lg);
    --body-gutter-y: var(--fgs-gutter-xl);
    --body-content-gutter-x: var(--fgs-gutter);
    --body-content-gutter-y: var(--fgs-gutter);
    --body-bk-color: #ffffff;
    position: var(--body-position);
    width: calc(var(--body-width) - var(--body-width-offset));
    min-height: var(--body-min-height);
    left: var(--body-width-offset);
    right: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
    background-color: var(--body-bk-color);
}
.body-content .content-area {
    padding-top: var(--body-gutter-y);
    padding-bottom: var(--body-gutter-y);
}
.body-content .content-area-sm {
    padding-top: calc(var(--body-gutter-y) * 0.5);
    padding-bottom: calc(var(--body-gutter-y) * 0.5);
}
.body-content .content-area:not(.container, .container-fluid) {
    padding-left: var(--body-gutter-x);
    padding-right: var(--body-gutter-x);
}
.body-content .content-area > .container,
.body-content .content-area > .container-fluid {
    padding-left: calc(var(--fgs-gutter-sm) - var(--body-gutter-x));
    padding-right: calc(var(--fgs-gutter-sm) - var(--body-gutter-x));
}
/* -------------------------------------------------------------------------------------- */
/* ---- BODY : main (variables) ------------------------------------------------------------- */
#home-layout.app-layout .body-content {
    --body-min-height: unset;
    --body-width: 100%;
    --body-width-offset: 0px;
    --body-gutter-x: 0px;
    --body-gutter-y: calc(var(--fgs-gutter-xl) * 2);
    --body-bk-color: #ffffff;
}
/* ---- BODY : default (variables) ----------------------------------------------------------- */
#default-body.body-content {
    --body-min-height: unset;
    --body-width: 100%;
    --body-width-offset: 0px;
    --body-bk-color: #ffffff;
}
#auth-layout.app-layout .body-content {
    --body-min-height: unset;
    --body-width: 100%;
    --body-width-offset: 0px;
    --body-gutter-x: 0px;
    --body-gutter-y: var(--fgs-gutter-lg);
    --body-bk-color: #ffffff;
    background: -moz-linear-gradient(0deg, var(--color-default-light-inactive), #ffffff);
    background: -webkit-gradient(linear, 0deg, var(--color-default-light-inactive), #ffffff);
    background: -webkit-linear-gradient(0deg, var(--color-default-light-inactive), #ffffff);
    background: -o-linear-gradient(0deg, var(--color-default-light-inactive), #ffffff);
    background: -ms-linear-gradient(0deg, var(--color-default-light-inactive), #ffffff);
    background: linear-gradient(0deg, var(--color-default-light-inactive), #ffffff);
}
#dash-layout.app-layout .body-content,
#admin-layout.app-layout .body-content {
    --body-min-height: unset;
    --body-width: 100%;
    --body-width-offset: 200px;
    --body-gutter-x: var(--fgs-gutter-lg);
    --body-gutter-y: var(--fgs-gutter-lg);
    --body-bk-color: var(--color-default-light-inactive);
}

#dash-layout.app-layout > .inline-body-content > .body-content,
#admin-layout.app-layout > .inline-body-content > .body-content {
    --body-width: auto;
    --body-width-offset: 0px;
    height: 100%;
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -webkit-flex: 1 0 auto;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
}
#dash-layout.app-layout.no-nav > .body-content {
    --body-width: 100%;
    --body-width-offset: 0px;
}


/* ============================================================================ */
/*      FOOTER CONTENT                                                                                                                                                                                         */
/* ============================================================================ */
.footer-content {
    --footer-min-height: unset;
    --footer-width: 100%;
    --footer-width-offset: 0px;
    --footer-gutter-x: var(--fgs-gutter-lg);
    --footer-gutter-y: var(--fgs-gutter-xl);
    --footer-content-gutter-x: var(--fgs-gutter);
    --footer-content-gutter-y: var(--fgs-gutter);
    --footer-bk-color: var(--color-default-dark);
    --footer-text-color: var(--color-default-light);
    --footer-title-color: white;
    --footer-link-color: var(--color-default-light-inactive);
    --footer-link-color-active: var(--color-default-light);
    position: relative;
    width: calc(var(--footer-width) - var(--footer-width-offset));
    min-height: var(--footer-min-height);
    left: var(--footer-width-offset);
    right: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
    background-color: var(--footer-bk-color);
}
.footer-content:not(.container, .container-fluid) {
    padding-left: var(--footer-gutter-x);
    padding-right: var(--footer-gutter-x);
}
.footer-content .container,
.footer-content .container-fluid {
    padding-left: calc(var(--fgs-gutter-sm) - var(--footer-gutter-x));
    padding-right: calc(var(--fgs-gutter-sm) - var(--footer-gutter-x));
}
.footer-content .content-area {
    padding-top: var(--footer-gutter-y);
    padding-bottom: var(--footer-gutter-y);
}
.footer-content .footer-logo {
    width: 100%;
    max-width: 300px;
    height: 125px;
    margin-bottom: 15px;
}
.footer-content .footer-logo > img {
    max-width: 100%;
    max-height: 100%;
}
.footer-content p {
    color: var(--color-default-light);
}
.footer-content .footer-group > .footer-title {
    color: var(--footer-title-color);
}
.footer-content .footer-group > .footer-link,
.footer-content .footer-group > .footer-link > a {
    color: var(--footer-link-color);
}
.footer-content .footer-group > .footer-link:hover,
.footer-content .footer-group > .footer-link:focus,
.footer-content .footer-group > .footer-link:active,
.footer-content .footer-group > .footer-link > a:hover,
.footer-content .footer-group > .footer-link > a:focus,
.footer-content .footer-group > .footer-link > a:active {
    color: var(--footer-link-color-active);
}
.footer-content .footer-tick {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(0, 0, 0, 0.20);
    padding: var(--fgs-gutter);
    padding-top: var(--fgs-gutter-sm);
    padding-bottom: var(--fgs-gutter-sm);
}
.footer-content .footer-tick *,
.footer-content .disclaimer {
    color: var(--footer-text-color);
}
.footer-content .footer-tick > *:not(:first-child),
.footer-content .footer-tick .tradingview-widget-container > *:not(:first-child, style) {
    margin-top: var(--fgs-gutter-xs);
}
.footer-content .footer-tick iframe {
    background-color: rgba(0, 0, 0, 0.15);
    padding: 10px;
}
/* -------------------------------------------------------------------------------------- */
/* ---- FOOTER : home (variables) ----------------------------------------------------------- */
#home-layout.app-layout .footer-content {
    --footer-min-height: unset;
    --footer-width: 100%;
    --footer-width-offset: 0px;
    --footer-gutter-x: 0px;
    --footer-gutter-y: calc(var(--fgs-gutter-xl) * 1.5);
    --footer-bk-color: var(--color-client-primary);
    --footer-text-color: var(--color-default-light);
    --footer-title-color: var(--color-default-light);
    --footer-link-color: var(--color-default-light-inactive);
    --footer-link-color-active: var(--color-default-light);
}
/* ---- FOOTER : default (variables) ---------------------------------------------------------- */
#auth-layout.app-layout .footer-content {
    --footer-min-height: unset;
    --footer-width: 100%;
    --footer-width-offset: 0px;
    --footer-gutter-x: 0px;
    --footer-gutter-y: var(--fgs-gutter-xl);
    --footer-bk-color: #ffffff;
    --footer-text-color: var(--color-default-dark);
    --footer-title-color: var(--color-default-light);
    --footer-link-color: var(--color-default-dark);
    --footer-link-color-active: var(--color-default-dark-active);
}
#dash-layout.app-layout .footer-content,
#admin-layout.app-layout .footer-content {
    --footer-min-height: unset;
    --footer-width: 100%;
    --footer-width-offset: 0px;
    --footer-gutter-x: 0px;
    --footer-gutter-y: var(--fgs-gutter-xl);
    --footer-bk-color: #ffffff;
    --footer-text-color: var(--color-default-dark);
    --footer-title-color: var(--color-default-light);
    --footer-link-color: var(--color-default-dark);
    --footer-link-color-active: var(--color-default-dark-active);
}



/* ============================================================================ */
/*      HOMEPAGE SLIDESHOW                                                                                                                                                                              */
/* ============================================================================ */
.slideLoadingOverlay {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 3;
    background-color: #ffffff;
}
.slideshow {
    position: relative;
    width: 100%;
    height: 100%;
}
.slideshow .slideshow-content {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 100%;
}
.slideshow .slideshow-content .slide-content-left,
.slideshow .slideshow-content .slide-content-right {
    width: 50%;
    height: 100%;
}
.slideshow .slideshow-content .slide-content-left {
    padding-left: 300px;
}
.slideshow .slideshow-content .slide-content-left .slide-viewport,
.slideshow .slideshow-content .slide-content-right .slide-graphic-viewport,
.slideshow .slideshow-content .slide-content-right .slide-graphic-viewport .slide-item {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
.slideshow .slideshow-content .slide-content-left .slide-viewport {
    position: relative;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    width: 100%;
    height: 100%;
}
.slideshow .slideshow-content .slide-content-left .slide-viewport .slide-item {
    position: absolute;
    width: 100%;
    height: auto;
}
.slideshow .slideshow-content .slide-content-left .slide-viewport .slide-item h1 {
    margin-bottom: var(--fgs-gutter-lg);
}
.slideshow .slideshow-content .slide-content-left .slide-viewport .slide-item h2 {
    margin-bottom: var(--fgs-gutter-xl);
}
.slideshow .slideshow-content .slide-content-right {
    padding: 0px;
    margin: 0px;
}
.slideshow .slideshow-content .slide-content-right .slide-graphic-viewport {
    position: relative;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.slideshow .slideshow-content .slide-content-right .slide-graphic-viewport::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 3;
    background-image: url(/TenantsContent/Default/content/images/slideshow-background-overlay.png);
    background-repeat: no-repeat;
    background-position: left;
    background-size: auto 100%;
    background-position-x: right;
    background-position-y: bottom;
}
.slideshow .slideshow-content .slide-content-right .slide-graphic-viewport .slide-item {
    position: absolute;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 15% 25% 15% 15%;
    mix-blend-mode: multiply;
}
.slideshow .slideshow-content .slide-content-right .slide-graphic-viewport .slide-item img {
    width: 100%;
    height: auto;
}
@supports not (mix-blend-mode: multiply) {
    .slideshow .slideshow-content .slide-content-right .slide-graphic-viewport .slide-item {
        opacity: 0.5;
    }
}

.slideshow > .slideshow-content {
    height: calc(100% - 30px);
}
.slideshow > .slideshow-nav {
    height: 30px;
}

.slideshow .slideshow-nav .slide-controls li {
    display: inline;
}
.slideshow .slideshow-nav .slide-controls .s-nav-btn {
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    -webkit-border-radius: 1rem;
    -moz-border-radius: 1rem;
    border-radius: 1rem;
    border: 1px solid var(--color-client-secondary-dark);
    margin: 0rem 1rem;
    -webkit-box-shadow: inset 0px 0px 2px 0px var(--color-client-secondary);
    -moz-box-shadow: inset 0px 0px 2px 0px var(--color-client-secondary);
    box-shadow: inset 0px 0px 2px 0px var(--color-client-secondary);
    transition-duration: 0.5s;
    cursor: pointer;
}
.slideshow .slideshow-nav .slide-controls .s-nav-btn:hover,
.slideshow .slideshow-nav .slide-controls .s-nav-btn.active {
    -webkit-box-shadow: inset 0px 0px 2px 10px var(--color-client-secondary);
    -moz-box-shadow: inset 0px 0px 2px 10px var(--color-client-secondary);
    box-shadow: inset 0px 0px 2px 10px var(--color-client-secondary);
}
@media(max-width: 768px) {
    .slideshow .slideshow-content .slide-content-left {
        width: 100%;
    }
    .slideshow .slideshow-content .slide-content-right {
        display: none;
    }
}
.slideshow .slideshow-content .slide-content-left {
    background-color: #ffffff;
}
.slideshow .slideshow-content .slide-content-right {
    background-color: var(--color-client-primary-opaque);
}
.slideshow .slideshow-content .slide-content-left .slide-viewport .slide-item h1 {
    color: var(--color-client-primary);
}
















/* ---- LAYOUT : Images & Graphics -------------------------------------------- */
.img-container img {
    width: 430px;
}
.img-responsive {
    width: 100%;
    height: auto;
}
.company-logo img {
    width: 100%;
    height: auto;
}
.colorbox-content-area .company-logo {
    max-height: 75px;
}

/* ---- LAYOUT : Banners ------------------------------------------------------ */
.background-texture {
    position: relative;
}
.background-texture::before {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: url(/TenantsContent/Default/content/images/overlay.png) repeat 0 0;
    opacity: 0.35;
    z-index: 0;
}
.background-texture > * {
    position: relative;
    z-index: 1;
}

.fullwidth-banner {
    width: 100%;
    padding-top: var(--fgs-gutter-lg);
    padding-bottom: var(--fgs-gutter-lg);
    padding-left: var(--fgs-gutter-lg);
    padding-right: var(--fgs-gutter-lg);
    background-color: var(--color-client-primary);
}
.fullwidth-banner.background-texture {
    position: relative;
    background-color: none;
}
.fullwidth-banner.background-texture::after {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: var(--color-client-primary);
    opacity: 1;
    z-index: -1;
}


/* ============================================================================ */
/*      HEADER                                                                  */
/* ============================================================================ */


/* ============================================================================ */
/*      BODY                                                                    */
/* ============================================================================ */






















.form-group,
.action-group {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-box-align: baseline;
    -moz-box-align: baseline;
    -ms-flex-item-align: baseline;
    -webkit-align-items: baseline;
    align-items: baseline;
}
.form-group.inline, .form-group.inline-right,
.action-group.inline, .action-group.inline-right {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    -webkit-flex-direction: row;
    flex-direction: row;
}
.form-group.inline-right,
.action-group.inline-right {
    -webkit-box-pack: end;
    -moz-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}
.form-group > *,
.action-group > * {
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
}
.form-group > .form-control,
.form-group > input:not([type="checkbox"], [type="radio"]),
.form-group > select,
.form-group > textarea {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1 0 auto;
    -webkit-flex: 1 0 auto;
    flex: 1 0 auto;
}
.form-group:not([class^="col-"]) {
    margin-top: var(--form-gutter-y-offset);
    margin-left: var(--form-gutter-x-offset);
}
.action-group:not([class^="col-"]) {
    margin-top: var(--action-gutter-y-offset);
    margin-left: var(--action-gutter-x-offset);
    width: calc(100% + var(--action-gutter-x));
}
.form-group:not([class^="col-"]) > * {
    margin-top: var(--form-gutter-y);
    margin-left: var(--form-gutter-x);
    margin-right: 0px;
    margin-bottom: 0px;
}
.action-group:not([class^="col-"]) > * {
    margin-top: var(--action-gutter-y);
    margin-left: var(--action-gutter-x);
    margin-right: 0px;
    margin-bottom: 0px;
}
.form-group[class^="col-"],
.action-group[class^="col-"] {
    align-self: flex-end;
}
.form-group[class^="col-"] > *,
.action-group[class^="col-"] > * {
    margin: 0px;
}
.form-group[class^="col-"] > *:not(:first-child) {
    margin-top: var(--form-gutter-y);
}
.action-group[class^="col-"] > *:not(:first-child) {
    margin-top: var(--action-gutter-y);
}
.form-group.inline[class^="col-"] > *:not(:first-child) {
    margin-left: var(--form-gutter-x);
}
.action-group.inline[class^="col-"] > *:not(:first-child) {
    margin-left: var(--action-gutter-x);
}
.form-group.inline[class^="col-"] > .checkbox-container:not(:first-child),
.form-group.inline[class^="col-"] > .radio-container:not(:first-child) {
    margin-left: calc(var(--form-gutter-x) * 2);
}
.form-group.inline > .btn:not(:first-child) {
    margin-left: calc(var(--form-gutter-x) * 2);
}
.form-group.inline > .btn:not(:last-child) {
    margin-right: calc(var(--form-gutter-x) * 2);
}
/*.form-group:not([class^="col-"], .inline, .inline-right),
.action-group:not([class^="col-"], .inline, .inline-right) {
    width: 100%;
}*/
.form-group:not(:first-child, [class^="col-"]) {
    margin-top: calc(var(--bs-gutter-y) - var(--form-gutter-y));
}
.action-group:not(:first-child, [class^="col-"]) {
    margin-top: calc(var(--bs-gutter-y) - var(--action-gutter-y));
}

.action-group:not(:first-child, [class^="col-"]),
[class^="col-"] > .action-group:not(:first-child) {
    margin-top: var(--fgs-gutter-lg);
}
.action-group:not(:last-child, [class^="col-"]),
[class^="col-"] > .action-group:not(:last-child) {
    margin-bottom: var(--fgs-gutter);
}


.lightbox-layout .form-group label {
    white-space: nowrap;
}


.input-group > * {
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
}
.form-group:not(.inline) > .input-group {
   width: calc(100% - var(--form-gutter-x));
}

.input-group .form-control {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1 0 auto;
    -webkit-flex: 1 0 auto;
    flex: 1 0 auto;
}

.input-group-secondary > .form-control {
    border-color: var(--color-client-secondary);
}
.input-group-secondary > .form-control:placeholder-shown {
    background-color: var(--color-client-secondary-opaque);
}


::placeholder {
    font-style: italic;
}

form:not(:first-child) {
    margin-top: var(--fgs-gutter);
}

.form-control,
input,
select,
textarea {
    border-color: rgba(0, 0, 0, 0.125);
}

.form-group .inline-group label,
.form-group .inline-group input,
.form-group .inline-group select {
    width: auto;
}
.form-group:not(.inline) > label, [class^="col-"] > .form-group:not(.inline) > label,
.form-group:not(.inline) > input, [class^="col-"] > .form-group:not(.inline) > input,
.form-group:not(.inline) > select, [class^="col-"] > .form-group:not(.inline) > select,
.form-group:not(.inline) > textarea, [class^="col-"] > .form-group:not(.inline) > textarea {
    width: 100%;
}


[class^="col-"].form-group:not(.inline) .checkbox-container > input, [class^="col-"] > .form-group:not(.inline) .checkbox-container > input,
[class^="col-"].form-group:not(.inline) .radio-container > input, [class^="col-"] > .form-group:not(.inline) .radio-container > input {
    width: 0px;
}

.inline-group {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: baseline;
    align-items: baseline;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: auto;
    margin-top: var(--fgs-gutter-xs-offset);
    margin-left: var(--fgs-gutter-sm-offset);
}
.form-group > .inline-group {
    --offset-height: calc(var(--form-gutter-y-offset) + var(--fgs-gutter-xs));
    margin-top: calc(var(--offset-height) * -1);
}
.form-group:not(.inline, .inline-right) > .inline-group {
    width: calc(100% - var(--fgs-gutter-sm));
}
.inline-group > * {
    margin-top: var(--fgs-gutter-sm);
    margin-left: var(--fgs-gutter-sm);
}
.form-group > .inline-group > * {
    margin-top: var(--fgs-gutter-xs);
    margin-left: 0px;
    margin-right: 0px;
}
.form-group > .inline-group > *:not(:last-child) {
    margin-right: var(--fgs-gutter-sm);
}
.form-group > .inline-group,
.form-group > .inline-group > input:not([type="checkbox"], [type="radio"]),
.form-group > .inline-group > select,
.form-group > .inline-group > textarea,
.form-group > .inline-group > .form-control {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -webkit-flex: 1 0 0%;
    -ms-flex: 1 0 0%;
    flex: 1 0 0%;
}









.form-layout .form-footer,
.lightbox-content-area .lightbox-footer {
    padding: var(--fgs-gutter);
}
.form-layout .form-body:not(:first-child),
.lightbox-content-area .lightbox-body:not(:first-child),
.form-layout form:not(:first-child) .form-body,
.lightbox-content-area form:not(:first-child) .lightbox-body {
    border-top: 2px solid var(--color-default-light-inactive);
    margin-top: var(--fgs-gutter);
    padding-top: var(--fgs-gutter);
}
.form-layout .form-body + .form-footer,
.lightbox-content-area .lightbox-body + .lightbox-footer {
    margin-top: var(--fgs-gutter-lg);
}
.form-layout .form-footer,
.lightbox-content-area .lightbox-footer {
    text-align: right;
    border-radius: 5px;
    background-color: var(--color-default-light-inactive);
}
.form-layout .form-footer > *,
.lightbox-content-area .lightbox-footer > * {
    display: inline-block;
    margin-left: var(--fgs-gutter-sm);
}


@media(min-width: 768px) {
    .col-md-auto.form-group {
/*        -webkit-box-flex: 1;
        -moz-box-flex: 1;
        -webkit-flex: 1 0 auto;
        -ms-flex: 1 0 auto;
        flex: 1 0 auto;*/
    }
}


.form-group {
    --form-gutter-x: var(--fgs-gutter-xs);
    --form-gutter-y: var(--fgs-gutter-xs);
    --form-gutter-x-offset: calc(var(--form-gutter-x) * -1);
    --form-gutter-y-offset: calc(var(--form-gutter-y) * -1);
    --form-border-color: rgba(0, 0, 0, 0.125);
}
.form-group.inline, .form-group.inline-right {
    --form-gutter-x: 5px;
    --form-gutter-y: 5px;
}
.action-group, .action-group.inline, .action-group.inline-right {
    --action-gutter-x: var(--fgs-gutter-sm);
    --action-gutter-y: var(--fgs-gutter-sm);
    --action-gutter-x-offset: calc(var(--action-gutter-x) * -1);
    --action-gutter-y-offset: calc(var(--action-gutter-y) * -1);
}








.lightbox-content-area {
    padding: var(--fgs-gutter);
}
@media(min-width: 768px) {
    .lightbox-content-area {
        max-width: 80vw;
    }
}
@media(min-width: 1200px) {
    .lightbox-content-area {
        max-width: 65vw;
    }
}


.lightbox-header h1,
.lightbox-header .lightbox-title {
    color: var(--color-client-secondary);
}
.lightbox-content-area h2,
.lightbox-content-area h2.lightbox-title {
    color: var(--color-client-primary);
}
.lightbox-header h1,
.lightbox-header h2,
.lightbox-header h3,
.lightbox-header .lightbox-title {
    line-height: 1;
}
.lightbox-content-area h3,
.lightbox-content-area h4 {
    color: var(--color-client-secondary);
}
.lightbox-header h1:last-child,
.lightbox-header .lightbox-title:last-child,
.lightbox-content-area h2.lightbox-title:last-child {
    margin-bottom: 0px;
}
.lightbox-content-area .content-box {
    color: var(--color-client-secondary-dark);
    background-color: var(--color-client-secondary-opaque);
}
.lightbox-content-area .content-box  * {
    color: inherit;
}
.lightbox-content-area .content-box h4 {
    color: var(--color-default-dark);
    margin-bottom: var(--fgs-gutter);
}

/* ============================================================================ */
/*      TABLES                                                                  */
/* ============================================================================ */
.table-container,
*:not(.table-container) > table {
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    border-width: 3px;
    border-style: solid;
    -webkit-box-shadow: 0 0 0 5px var(--color-default-light);
    -moz-box-shadow: 0 0 0 5px var(--color-default-light);
    box-shadow: 0 0 0 5px var(--color-default-light);
    margin: 5px 0px 0px 0px;
    overflow: hidden;
    width: 100%;
    border-collapse: unset;
}
/*.table-container {
    overflow: auto;
}*/
table.table-scrollable tbody {
    overflow-y: scroll;
    overflow-x: auto;
    width: 100%;
    height: auto;
}

#usersGrid table.table-scrollable,
#usersGrid .table-container {
    max-height: 500px;
}
table tr, table tr td {
    border: none;
}
table.ui-datepicker-calendar {
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
table thead tr th, table tbody tr th, table tbody tr.thead-row td, table tbody tr.totals-row td {
    vertical-align: middle;
}
table:not(.ui-datepicker-calendar) thead tr th, table:not(.ui-datepicker-calendar) tbody tr td {
    padding: 7px 7.5px;
}
table:not(.ui-datepicker-calendar) thead tr th:first-of-type, table:not(.ui-datepicker-calendar) tbody tr td:first-of-type {
    padding-left: 25px;
}
table:not(.ui-datepicker-calendar) thead tr th:last-of-type, table:not(.ui-datepicker-calendar) tbody tr td:last-of-type {
    padding-right: 25px;
}
table.default-dark  {
    border-color: var(--color-default-dark);
}
table.default-dark tr th {
    background-color: var(--color-default-dark);
    color: #ffffff;
}
table tbody tr td {
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: var(--color-default-light);
}
table tbody tr.double-underline td {
    border-bottom-width: 6px;
    border-bottom-style: double;
}
table tbody tr:last-of-type td {
    border-bottom: none;
}
table tbody tr td > label, table thead tr th h4, table tbody tr th h4 {
    margin: 0px;
}
table.transactions tbody tr td._entrySelector:not(.trans_date) {
    white-space: normal;
}
#editableTable tbody tr:not(.no-transaction-data):hover {
    cursor: pointer;
}
#editableTable tbody tr:not(.no-transaction-data):hover > td {
    background-color: var(--color-client-primary-opaque);
}

table thead tr th.col-account {
    width: 55px;
}
table thead tr th.col-date {
    width: 70px;
}
table thead tr td.col-date {
    font-size:10px;
}
table thead tr th.col-description {
    width: 160px;
}
table thead tr th.col-category {
    width: 160px;
}
table thead tr th.col-amount {
    width: 100px;
}
table tr td.col-amount {
    text-align:right;
    padding-right:12px !important;
}
table thead tr th.col-edit {
    width: 60px;
}
table thead tr th.col-delete {
    width: 60px;
}

table.transactions td {
    font-size: 13px !important;
}

#chartOfAccountsTable table thead tr th.col-name {
}
#chartOfAccountsTable table thead tr th.col-type {}
#chartOfAccountsTable table thead tr th.col-balance {}
#chartOfAccountsTable thead tr th.col-actions {
   /* width: 350px;*/
    width: 300px;
}
.ui-sortable a {
    width: auto !important;
}

table tbody tr._entrySelector {
    cursor: pointer;
}

table tbody tr td .form-row > .form-group > h4,
table tbody tr td .form-row > .form-group > p {
    color: var(--color-client-primary);
    margin-bottom: 0px;
}










/* ---- DISPLAY AREAS : Slide Out Content ------------------------------------- */


















/* ============================================================================ */
/*      BUTTONS                                                                                                                                                                                                           */
/* ============================================================================ */
/* --- BUTTONS : General ------------------------------------------------------------------ */
button, .btn, [class^="btn-"], .recover-text {
    font-family: var(--fgs-font-family);
    font-size: var(--fgs-font-size-body);
    line-height: var(--fgs-line-height-body);
    font-weight: var(--fgs-font-weight-ui);
    text-decoration: none;
}
.recover-text a:not(.btn), .recover-text span {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    font-weight: inherit;
    text-decoration: inherit;
}
button, .btn, [class^="btn-"] {
    --btn-color: #ffffff;
    --btn-color-active: #ffffff;
    --btn-bk-color: #000000;
    --btn-bk-color-active: #7b7b7b;
    --btn-border-color: rgba(0, 0, 0, 0.25);
    --btn-border-color-active: rgba(0, 0, 0, 0.50);
    --btn-box-shadow: none;
    --btn-box-shadow-active: inset 0px 0px 0px 20px var(--btn-bk-color-active);
    --btn-box-shadow-sm: none;
    --btn-box-shadow-sm-active: inset 0px 0px 0px 10px var(--btn-bk-color-active);
    line-height: 1;
    color: var(--btn-color);
    background-color: var(--btn-bk-color);
    border-width: 0px;
    border-style: solid;
    border-color: var(--btn-border-color);
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    padding: 0.75rem 1.25rem;
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}
/*button, .btn, [class^="btn-"], .ui-datepicker .ui-datepicker-buttonpane button {
    padding: 0.5rem 1.25rem;
}*/
.btn-sm, .btn-small {
    font-size: var(--fgs-font-size-body-sm);
    padding: 0.5rem 0.875rem;
}
.btn-lg,
.btn-large {
   font-size: var(--fgs-font-size-body-lg);
    font-weight: 600;
    letter-spacing: 0.035rem;
    padding: 1.50rem 1.75rem;
}

button > i, .btn > i, [class^="btn-"] > i {
    font-size: inherit;
    line-height: inherit;
}

button:hover, button:focus, button:active,
.btn:hover, .btn:focus, .btn:active,
[class^="btn-"]:hover, [class^="btn-"]:focus, [class^="btn-"]:active {
    color: var(--btn-color-active);
    background-color: var(--btn-bk-color-active);
    border-color: var(--btn-border-color-active);
}



/* ---- BUTTONS : Styling ----------------------------------------------------- */
.btn-default:hover, .btn-default:focus, .btn-default:active,
.btn-delete:hover, .btn-delete:focus, .btn-delete:active,
.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
    -webkit-box-shadow: var(--btn-box-shadow);
    -moz-box-shadow: var(--btn-box-shadow);
    box-shadow: var(--btn-box-shadow);
}
.btn-transparent:hover, .btn-transparent:focus, .btn-transparent:active {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.btn-default-outline,
.btn-delete-outline,
.btn-primary-outline,
.btn-secondary-outline {
    --btn-box-shadow: inset 0px 0px 0px 3px var(--btn-border-color);
    --btn-box-shadow-active: inset 0px 0px 0px 3px var(--btn-border-color), inset 0px 0px 25px 25px var(--btn-bk-color-active);
    --btn-box-shadow-sm: inset 0px 0px 0px 1.5px var(--btn-border-color);
    --btn-box-shadow-sm-active: inset 0px 0px 0px 1.5px var(--btn-border-color), inset 0px 0px 15px 15px var(--btn-bk-color-active);
    color: var(--btn-color);
    background-color: transparent;
    -webkit-box-shadow: var(--btn-box-shadow);
    -moz-box-shadow: var(--btn-box-shadow);
    box-shadow: var(--btn-box-shadow);
}
.btn-default-outline.btn-small, .btn-default-outline.btn-sm,
.btn-delete-outline.btn-small, .btn-delete-outline.btn-sm,
.btn-primary-outline.btn-small, .btn-primary-outline.btn-sm,
.btn-secondary-outline.btn-small, .btn-secondary-outline.btn-sm {
    -webkit-box-shadow: var(--btn-box-shadow-sm);
    -moz-box-shadow: var(--btn-box-shadow-sm);
    box-shadow: var(--btn-box-shadow-sm);
}
.btn-default-outline.btn-small:hover, .btn-default-outline.btn-small:focus, .btn-default-outline.btn-small:active,
.btn-delete-outline.btn-small:hover, .btn-delete-outline.btn-small:focus, .btn-delete-outline.btn-small:active,
.btn-primary-outline.btn-small:hover, .btn-primary-outline.btn-small:focus, .btn-primary-outline.btn-small:active,
.btn-secondary-outline.btn-small:hover, .btn-secondary-outline.btn-small:focus, .btn-secondary-outline.btn-small:active {
    -webkit-box-shadow: var(--btn-box-shadow-sm-active);
    -moz-box-shadow: var(--btn-box-shadow-sm-active);
    box-shadow: var(--btn-box-shadow-sm-active);
}
.btn-default-outline.selected, .btn-default-outline:hover, .btn-default-outline:focus, .btn-default-outline:active,
.btn-delete-outline.selected, .btn-delete-outline:hover, .btn-delete-outline:focus, .btn-delete-outline:active,
.btn-primary-outline.selected, .btn-primary-outline:hover, .btn-primary-outline:focus, .btn-primary-outline:active,
.btn-secondary-outline.selected, .btn-secondary-outline:hover, .btn-secondary-outline:focus, .btn-secondary-outline:active {
    color: var(--btn-color-active);
    background-color: transparent;
    -webkit-box-shadow: var(--btn-box-shadow-active);
    -moz-box-shadow: var(--btn-box-shadow-active);
    box-shadow: var(--btn-box-shadow-active);
}


/* ---- BUTTONS : Set Variables ----------------------------------------------------- */
.btn-default {
    --btn-color: #ffffff;
    --btn-color-active: #ffffff;
    --btn-bk-color: var(--color-default-dark);
    --btn-bk-color-active: var(--color-default-dark);
    --btn-border-color: var(--color-default-dark);
    --btn-border-color-active: var(--color-default-dark);
    --btn-shadow-color: var(--color-default-dark-active);
}
.btn-default-inverted {
    --btn-color: var(--color-default-dark);
    --btn-color-active: var(--color-default-dark);
   --btn-bk-color: #ffffff;
   --btn-bk-color-active: var(--color-default-light);
   --btn-border-color: var(--color-default-light);
   --btn-border-color-active: var(--color-default-light);
   --btn-shadow-color: var(--color-default-light);
}
.btn-default-outline {
    --btn-color: var(--color-default-dark);
    --btn-color-active: #ffffff;
    --btn-bk-color: transparent;
    --btn-bk-color-active: var(--color-default-dark-inactive);
    --btn-border-color: var(--color-default-dark);
    --btn-border-color-active: var(--color-default-dark);
    --btn-shadow-color: var(--color-default-dark);
}
.btn-default-outline.selected, .btn-default-outline.selected:hover, .btn-default-outline.selected:focus, .btn-default-outline.selected:active {
    --btn-bk-color-active: var(--color-default-dark);
}
.btn-delete {
    --btn-color: #ffffff;
    --btn-color-active: #ffffff;
    --btn-bk-color: var(--color-default-red);
    --btn-bk-color-active: var(--color-default-red);
    --btn-border-color: var(--color-default-red);
    --btn-border-color-active: var(--color-default-red);
    --btn-shadow-color: var(--color-default-red-dark);
}
.btn-delete-outline {
    --btn-color: var(--color-default-red-dark);
    --btn-color-active: #ffffff;
    --btn-bk-color: transparent;
    --btn-bk-color-active: var(--color-default-red-light);
    --btn-border-color: var(--color-default-red);
    --btn-border-color-active: var(--color-default-red);
    --btn-shadow-color: var(--color-default-red);
}
.btn-delete-outline.selected, .btn-delete-outline.selected:hover, .btn-delete-outline.selected:focus, .btn-delete-outline.selected:active {
    --btn-bk-color-active: var(--color-default-red);
}
.btn-primary,
.input-group-primary > .btn {
    --btn-color: white;
    --btn-color-active: #ffffff;
    --btn-bk-color: var(--color-client-primary);
    --btn-bk-color-active: var(--color-client-primary-dark);
    --btn-border-color: var(--color-client-primary-dark);
    --btn-border-color-active: var(--color-client-primary-dark);
    box-shadow: 1px 1px 4px 1px dimgray;
}
.btn-primary-inverted {
    --btn-color: var(--color-client-primary);
    --btn-color-active: var(--color-client-primary-dark);
    --btn-bk-color: var(--color-default-light-inactive);
    --btn-bk-color-active: var(--color-default-light);
    --btn-border-color: var(--color-default-light);
    --btn-border-color-active: var(--color-default-light);
    --btn-shadow-color: var(--color-default-light);
}
.btn-primary-outline {
    --btn-color: var(--color-client-primary);
    --btn-color-active: #ffffff;
    --btn-bk-color: transparent;
    --btn-bk-color-active: var(--color-client-primary-light);
    --btn-border-color: var(--color-client-primary);
    --btn-border-color-active: var(--color-client-primary);
    --btn-shadow-color: var(--color-client-primary);
}
.btn-primary-outline.selected, .btn-primary-outline.selected:hover, .btn-primary-outline.selected:focus, .btn-primary-outline.selected:active {
    --btn-bk-color-active: var(--color-client-primary);
}
.btn-secondary,
.input-group-secondary > .btn {
    --btn-color: #ffffff;
    --btn-color-active: #ffffff;
    --btn-bk-color: var(--color-client-secondary);
    --btn-bk-color-active: var(--color-client-secondary-dark);
    --btn-border-color: var(--color-client-secondary-dark);
    --btn-border-color-active: var(--color-client-secondary-dark);
}
.btn-secondary-outline {
    --btn-color: var(--color-client-secondary);
    --btn-color-active: #ffffff;
    --btn-bk-color: transparent;
    --btn-bk-color-active: var(--color-client-secondary-light);
    --btn-border-color: var(--color-client-secondary);
    --btn-border-color-active: var(--color-client-secondary);
    --btn-shadow-color: var(--color-client-secondary);
}
.btn-secondary-outline.selected, .btn-secondary-outline.selected:hover, .btn-secondary-outline.selected:focus, .btn-secondary-outline.selected:active {
    --btn-bk-color-active: var(--color-client-secondary);
}

.btn-transparent, .btn-transparent-default, .btn-transparent-light, .btn-transparent-delete, .btn-transparent-primary, .btn-transparent-secondary {
    --btn-bk-color: transparent;
    --btn-bk-color-active: transparent;
    --btn-border-color: transparent;
    --btn-border-color-active: transparent;
    --btn-shadow-color: transparent;
}
.btn-transparent, .btn-transparent-default {
    --btn-color: var(--color-default-dark);
    --btn-color-active: var(--color-default-dark-active);
}
.btn-transparent-light,
.background-default-dark .btn-transparent {
    --btn-color: #ffffff;
    --btn-color-active: var(--color-default-light-inactive);
}
.btn-transparent-delete {
    --btn-color: var(--color-default-red);
    --btn-color-active: var(--color-default-red-dark);
}
.btn-transparent-primary {
    --btn-color: var(--color-client-primary);
    --btn-color-active: var(--color-client-primary-dark);
}
.btn-transparent-secondary {
    --btn-color: var(--color-client-secondary);
    --btn-color-active: var(--color-client-secondary-dark);
}


ul.refine-filter > li {
    display: inline-block;
    margin-bottom: 0px;
}
.refine-filter > li > label {
    margin-bottom: 0px;
}







/*.btn.btn-primary, .btn.btn-primary-outline, .btn.btn-default, .btn.btn-default-outline, .btn-delete, .btn-delete-outline, p.recover-text, p.recover-text a, p.recover-text span {
    font-family: Roboto, sans-serif;
    font-size: 18px;
    line-height: 1.4;
    font-weight: 400;
    text-decoration: none;
}*/





/*.btn.btn-primary, .btn.btn-primary > i, .btn.btn-primary-outline, .btn.btn-primary-outline > i, .btn.btn-default, .btn.btn-default > i, .btn.btn-default-outline, .btn.btn-default-outline > i, .btn-delete, .btn-delete > i, .btn-delete-outline, .btn-delete-outline > i {
    line-height: 1;
    white-space: nowrap;
}*/

/*.btn i {
    font-size: 20px;
    line-height: initial;
}*/

/*.btn-small i, .link-small i {
    font-size: 16px;
}*/

.link-small {
    font-size: 18px !important;
}
.ui-datepicker .ui-datepicker-buttonpane button {
    font-size: 16px;
    line-height: 1;
}
.accountLink {
    cursor: pointer;
    font-weight: bold;
}
.pagination-container > .pagination > ul > li {
    font-family: Roboto, sans-serif;
    font-size: 18px;
    line-height: 0;
    font-weight: bold;
}








/*.btn-default, .btn-default-outline, .btn-primary, .btn-primary-outline, .btn-delete, .btn-delete-outline, .btn-box, .inline-button-group, .refine-filter li {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
}
.btn-default, .btn-default-outline, .btn-primary, .btn-primary-outline, .btn-delete, .btn-delete-outline, .btn-box {
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    background: transparent;
}*/

/*.btn-default, .btn-default-outline, .btn-primary, .btn-primary-outline, .btn-delete, .btn-delete-outline {
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
}*/

/*.btn-default, .btn-default-outline, .btn-primary, .btn-primary-outline, .btn-delete, .btn-delete-outline, .ui-datepicker .ui-datepicker-buttonpane button {
    padding: 8px 18px;
}
.btn-default.btn-small, .btn-default-outline.btn-small, .btn-primary.btn.small, .btn-primary-outline.btn-small, .btn-delete.btn-small, .btn-delete-outline.btn-small {
    padding: 6px 16px;
}*/

/*.refine-filter li a {
    padding: 6px 10px;
}*/
.btn-box {
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    padding: 12px;
}
.refine-filter li a, button.ui-corner-all {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
/*.refine-filter li label {
    margin: 0px 10px 0px 0px;
}*/

/* ---- BUTTONS : Icons ------------------------------------------------------- */
/*a i, .btn i, .link-default i, .link-primary i {
    margin-right: 5px;
}*/

/* ---- BUTTONS : Transitions & Events ---------------------------------------- */
a, a:hover, a:focus, a:active {
    text-decoration: none;
    cursor: pointer;
}
.btn-default, .btn-default-outline, .btn-primary, .btn-primary-outline, .btn-delete, .btn-delete-outline, .btn-box, a {
    -webkit-transition: all 0.25s ease-in;
    -moz-transition: all 0.25s ease-in;
    -o-transition: all 0.25s ease-in;
    transition: all 0.25s ease-in;
}
a[class^="ui-"] {
    -webkit-transition: all 0.25s ease;
    -moz-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    transition: all 0.25s ease;
}

/* ---- BUTTONS : Formatting -------------------------------------------------- */
.inline-button-group {
    width: calc(100% + 15px);
    margin-left: -15px;
    margin-bottom: -15px;
}
.inline-button-group .btn, .inline-button-group .link-default, .inline-button-group .link-primary {
    margin-left: 15px;
    margin-bottom: 15px;
}
.cta-button-container {
    display: flex;
    width: calc(100% + 10px);
    height: 100%;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    margin-left: -10px;
    margin-bottom: -10px;
}
.cta-button-container .btn-box {
    -webkit-flex: 1 1 50%;
    flex: 1 1 50%;
    -webkit-flex-direction: column;
    flex-direction: column;
    text-align: center;
    max-width: calc(50% - 10px);
    height: 80px;
    margin-left: 10px;
    margin-bottom: 10px;
    background-color: var(--color-client-secondary);
    -webkit-box-shadow: 0px 0px 0px 4px var(--color-default-light);
    -moz-box-shadow: 0px 0px 0px 4px var(--color-default-light);
    box-shadow: 0px 0px 0px 4px var(--color-default-light);
    color: #ffffff;
}
.btn-box.delete-item:hover {
    -webkit-box-shadow: 0px 0px 0px 0px var(--color-default-light), inset 0px 0px 40px 40px var(--color-default-red);
    -moz-box-shadow: 0px 0px 0px 0px var(--color-default-light), inset 0px 0px 40px 40px var(--color-default-red);
    box-shadow: 0px 0px 0px 0px var(--color-default-light), inset 0px 0px 40px 40px var(--color-default-red);
    background-color: var(--color-default-red);
}
.btn-box.edit-item:hover {
    -webkit-box-shadow: 0px 0px 0px 0px var(--color-default-light), inset 0px 0px 40px 40px var(--color-client-primary);
    -moz-box-shadow: 0px 0px 0px 0px var(--color-default-light), inset 0px 0px 40px 40px var(--color-client-primary);
    box-shadow: 0px 0px 0px 0px var(--color-default-light), inset 0px 0px 40px 40px var(--color-client-primary);
    background-color: var(--color-client-primary);
}
.btn-box.complete-item:hover {
    -webkit-box-shadow: 0px 0px 0px 0px var(--color-default-light), inset 0px 0px 40px 40px var(--color-default-green);
    -moz-box-shadow: 0px 0px 0px 0px var(--color-default-light), inset 0px 0px 40px 40px var(--color-default-green);
    box-shadow: 0px 0px 0px 0px var(--color-default-light), inset 0px 0px 40px 40px var(--color-default-green);
    background-color: var(--color-default-green);
}
.btn-box.archive-item:hover {
    -webkit-box-shadow: 0px 0px 0px 0px var(--color-default-light), inset 0px 0px 40px 40px var(--color-default-dark);
    -moz-box-shadow: 0px 0px 0px 0px var(--color-default-light), inset 0px 0px 40px 40px var(--color-default-dark);
    box-shadow: 0px 0px 0px 0px var(--color-default-light), inset 0px 0px 40px 40px var(--color-default-dark);
    background-color: var(--color-default-dark);
}
.btn-box > i {
    margin-right: 0px;
    margin-bottom: 5px;
    color: #ffffff !important;
}


/* ============================================================================ */
/*      LISTS                                                                   */
/* ============================================================================ */
ol, ul {
    list-style: none;
    margin-bottom: 0px;
    padding: 0;
}

/* ---- LISTS : Introduction -------------------------------------------------- */
#introduction-content ol, #introduction-content ul {
    list-style: disc;
}

/* ---- LISTS : Disclaimer ---------------------------------------------------- */
ul.disclaimer {
    list-style-type: "*";
}
ul.disclaimer li {
    padding-left: 10px;
}
ul.disclaimer li::marker {
    font-size: 20px;
    line-height: 30px;
    font-weight: 800;
    color: #dc0606;
}

/* ---- LISTS : Sign Up Advantages -------------------------------------------- */
ul.signup-advantages {
    padding: 0;
}
ul.signup-advantages li {
    margin-bottom: 25px;
}
ul.signup-advantages li:last-of-type {
    margin-bottom: 0px;
}
ul.signup-advantages li.adv1, ul.signup-advantages li.adv2, ul.signup-advantages li.adv3, ul.signup-advantages li.adv4 {
    background-size: 50px 50px;
    background-position: left top;
    background-repeat: no-repeat;
    padding-top: 8px;
    padding-left: 65px;
}
ul.signup-advantages li.adv1 {
    background-image: url(/TenantsContent/Default/content/images/signup-advantage1.png);
}
ul.signup-advantages li.adv2 {
    background-image: url(/TenantsContent/Default/content/images/signup-advantage2.png);
}
ul.signup-advantages li.adv3 {
    background-image: url(/TenantsContent/Default/content/images/signup-advantage3.png);
}
ul.signup-advantages li.adv4 {
    background-image: url(/TenantsContent/Default/content/images/signup-advantage4.png);
}

/* ---- LISTS : Institutions -------------------------------------------------- */
ul.institutions-list {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    width: 100%;
}
ul.institutions-list li {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center;
    width: auto;
    height: 30px;
    -webkit-flex: 1 0 50%;
    flex: 1 0 50%;
    font-weight: 600;
}

/* ---- LISTS : Trends & Budgets ---------------------------------------------- */
.list-inline-flex > li {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
}
/*ul.trends-months li,
ul.budget-months li {
    display: inherit;
}*/
ul.trends-months li a, ul.budget-months li a {
    text-align: center;
    font-weight: bold;
    margin-left: 10px;
    width: 60px;
    border-top-width: 5px;
    border-top-style: solid;
    padding-top: 4px;
}
ul.trends-months li:first-of-type a, ul.budget-months li:first-of-type a {
    margin-left: 0px;
}
ul.trends-months li a, ul.trends-months li a span, ul.budget-months li a, ul.budget-months li a span {
    line-height: 1;
}
ul.trends-months li a .year, ul.budget-months li a .year {
    font-size: 75%;
    font-weight: initial;
}

/* ---- LISTS : Category ------------------------------------------------------ */
ul.category-list {
    padding-left: 0px;
    padding-right: 25px;
}
ul.category-list li.category-item {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    position: relative;
    font-weight: 700;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center;
    width: 100%;
    height: 50px;
    padding: 0px 25px;
    margin-bottom: 5px;
}
ul.category-list li.category-item:hover {
    cursor: pointer;
}
ul.category-list li.category-item.active::after {
    content: "";
    position: absolute;
    border-top-width: 25px;
    border-top-style: solid;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    right: -30px;
    transform: rotate(-90deg);
}
.accordion ul.category-list li.category-item, .accordion ul.category-list li.category-item a {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
.accordion ul.category-list li.category-item {
    position: relative;
    font-weight: 700;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center;
    width: 100%;
    height: 30px;
    padding: 0px;
    margin-bottom: 0px;
}
.accordion ul.category-list li.category-item a {
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center;
    padding-left: 0px;
    width: 100%;
    transition: all 0.25s ease;
}
.accordion ul.category-list li.category-item a:hover, .accordion ul.category-list li.category-item a.aboutLink2Sel {
    font-size: 20px;
    padding-left: 30px;
}
.accordion ul.category-list li.category-item a.aboutLink2Sel::before {
    content: "";
    position: absolute;
    border-top-width: 18px;
    border-top-style: solid;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    left: 0px;
    transform: rotate(-90deg);
}

/* ---- LISTS : Additional Info ----------------------------------------------- */
/*ul.additional-info-nav li {
    display: inline;
}
ul.additional-info-nav li a {
    font-weight: bold;
    display: block;
    float: left;
    width: auto;
    line-height: 1;
    height: 18px;
    padding: 5px;
    padding-left: 15px;
    margin-right: 10px;
    background: url(/TenantsContent/Default/content/images/additional-info-nav.png) left 7px no-repeat;
}*/

/* ---- LISTS : Type Of Account ----------------------------------------------- */
ul.type-of-account {
    list-style: none;
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}
ul.type-of-account li {
    display: inline;
}
ul.type-of-account li a {
    text-align: center;
    display: block;
    width: 250px;
    padding: 100px 15px 15px 15px;
    background-position-x: center;
    background-position-y: 15px;
    background-repeat: no-repeat;
    background-size: 80px auto;
    line-height: 22px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    transition-duration: 0.5s;
}
ul.type-of-account li + li {
    margin-left: 25px;
}
ul.type-of-account li a.acc-option1 {
    background-image: url(/TenantsContent/Default/content/images/what-acc-1.png);
}
ul.type-of-account li a.acc-option2 {
    background-image: url(/TenantsContent/Default/content/images/what-acc-2.png);
}
ul.type-of-account li a:hover {
    background-size: 85px auto;
    background-position-y: 10px;
    font-size: 20px;
}

/* ---- LISTS : Goal Items ---------------------------------------------------- */
#goal-accordions.accordion .item > ul {
    padding: 15px 25px;
    cursor: pointer;
    background-color: #ffffff;
    transition: all 0.5s ease;
}
#goal-accordions.accordion .item.active > ul {
    background-color: var(--color-default-light-inactive);
}
#goal-accordions.accordion .item > ul:hover {
    background-color: var(--color-default-light);
}
#goal-accordions.accordion .item ul li,
#goal-accordions.accordion .item ul li > p {
    display: inline-block;
}
#goal-accordions.accordion .item ul li.image {
    width: 80px;
    height: 80px;
}
#goal-accordions.accordion .item ul li.title {
    width: calc(100% - 80px);
    float: right;
    padding: 12px 0px 12px 25px;
}


/* ============================================================================ */
/*      BREADCRUMBS                                                             */
/* ============================================================================ */
.breadcrumb-container {
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    border-width: 2px;
    border-style: solid;
    overflow: hidden;
}
.breadcrumb-container .breadcrumb-default, .breadcrumb-container .breadcrumb-default .breadcrumb-item {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
.breadcrumb-container .breadcrumb-default {
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
    list-style: none;
}
.breadcrumb-container .breadcrumb-default .breadcrumb-item {
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: baseline;
    align-items: baseline;
    padding: 6px 12px;
    border-left-width: 2px;
    border-left-style: solid;
}
.breadcrumb-container .breadcrumb-default .breadcrumb-item:first-of-type {
    border-left: none;
}
.breadcrumb-container .breadcrumb-default .breadcrumb-item a {
    width: 100%;
    text-align: center;
}
.breadcrumb-container .breadcrumb-default .breadcrumb-item + .breadcrumb-item::before {
    display: none;
}
.breadcrumb-container .breadcrumb-default .breadcrumb-item .bc-number {
    font-size: 30px;
    line-height: 1.25;
    font-weight: 600;
    margin-right: 10px;
}
.breadcrumb-container .breadcrumb-default .breadcrumb-item .bc-text {
    font-size: 20px;
    font-weight: 400;
    letter-spacing: 0.75px;
}


/* ============================================================================ */
/*      FORMS                                                                   */
/* ============================================================================ */

/* FORM ========================= */
form {
    width: auto;
}
form .content-area {
    padding: 25px 0px;
}

/* FORM ROW ========================= */
.form-row {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
}
/*.form-row {
    flex-wrap: wrap;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    width: calc(100% + 10px);
    margin-left: -10px;
    margin-bottom: -10px;
}*/

/*.form-row + .form-row {
    margin-top: 10px;
}*/

.form-row.inline {
    flex-wrap: nowrap;
    -webkit-align-items: baseline;
    align-items: baseline;
}
.form-row.inline > .button-group {
    width: auto;
}

/*.form-row.inline > .button-group > * {
    margin-bottom: 0px;
}*/
.search-form .form-row.inline {
    -webkit-align-items: flex-end;
    align-items: flex-end;
}

/*.form-row > .form-group {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-flex: 1 1 200px;
    flex: 1 1 200px;
    margin: 0px 0px 10px 10px;
}*/

/*.form-row > *:not(.button-group) {
    margin: 0px 0px 10px 10px;
}*/

/*.form-row > .button-group > * {
    margin: 0px 0px 10px 10px;
}*/

.form-row > .form-group > label.checkbox-container,
.form-row > .form-group > label.radio-container,
.form-row > .form-group.inline > label.checkbox-container,
.form-row > .form-group.inline > label.radio-container {
    margin: 0px 0px 10px 0px;
}
.form-row > .form-group > label.checkbox-container:last-of-type,
.form-row > .form-group > label.radio-container:last-of-type {
    margin-bottom: 0px;
}
.form-row > .form-group.inline > label.checkbox-container:first-of-type,
.form-row > .form-group.inline > label.radio-container:first-of-type {
    margin-left: 0px;
}

.form-row > *:not(.form-group, .button-group) {
    width: 100%;
}
@media(min-width: 768px) {
    .form-row > .form-group.sm-group {
        max-width: calc(25% - 10px);
    }
    .form-row > .form-group.md-group {
        max-width: calc(50% - 10px);
    }
}
.form-row > .form-group.inline {
    -webkit-align-items: baseline;
    align-items: baseline;
    /*margin-bottom: 0px;*/
    margin-bottom: 10px;
}
.form-row > .form-group.inline > label {
    width: auto;
    /*margin-right: 15px;*/
    /*margin-right: 0px;*/
    margin-right: 10px;
}
.form-row > .form-group.inline > label,
.form-row > .form-group.inline > .field-group > * {
    /*margin-bottom: 10px;*/
    margin-bottom: 0px;
}
.form-row > .form-group.inline > .field-group {
    display: inherit;
    -webkit-align-items: inherit;
    align-items: inherit;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    /*margin-left: -15px;*/
}
.form-row > .form-group.inline > .field-group > * {
    margin-top: 2.5px;
    margin-left: 15px;
}
.form-row > .form-group.inline > .field-group label.checkbox-container,
.form-row > .form-group.inline > .field-group label.radio-container {
    line-height: 1.4;
}

/* INPUT / SELECT / TEXTAREA ========================= */
input, select, textarea {
    height: unset;
    min-height: var(--fgs-form-min-height);
    max-height: unset;
    border-width: 1px;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 4px 12px;
}
input:focus, select:focus, textarea:focus {
    outline: none;
}
textarea {
    width: 100%;
    min-height: 100px;
    padding: 6px 12px;
}
input {
    min-width: 50px;
}
input[type='checkbox'],
input[type='radio'] {
    min-width: unset;
}
*:not(.form-group) > select {
    min-width: 150px;
}
select:hover {
    cursor: pointer;
}
*:not(.form-group) > select.field-sm,
*:not(.form-group) > input.field-sm,
*:not(.form-group) > .field-sm select,
*:not(.form-group) > .field-sm input {
    max-width: 80px;
    min-width: 75px;
}
*:not(.form-group) > select.field-md,
*:not(.form-group) > input.field-md,
*:not(.form-group) > .field-md select,
*:not(.form-group) > .field-md input {
    max-width: 350px;
    min-width: 100px;
}
*:not(.form-group) > select.field-lg,
*:not(.form-group) > input.field-lg,
*:not(.form-group) > .field-lg select,
*:not(.form-group) > .field-lg input {
    min-width: 400px;
}
.form-group.field-sm, .form-group.field-md, .form-group.field-lg {
    -webkit-flex: 0 1 auto;
    flex: 0 1 auto;
}
.form-row > .form-group.field-md {
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
}
*:not(.form-group) > .form-group.field-md input,
*:not(.form-group) > input.field-md {
    max-width: 250px;
}
*:not(.form-group) > .form-group.field-lg input,
*:not(.form-group) > input.field-lg {
    max-width: 350px;
}
.form-row .form-group label.radio-container, .form-row .form-group label.checkbox-container {
    width: auto;
    line-height: 1.2;
}
.form-row > .form-group.noShrink {
    -webkit-flex: 1 0 auto;
    flex: 1 0 auto;
}
.form-row > .form-group.noGrow {
    -webkit-flex: 0 1 auto;
    flex: 0 1 auto;
}
.form-row > .form-group.noBasis {
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
}
.form-row > .form-group.field-md-no-basis {
    -webkit-flex: 0 0 350px;
    flex: 0 0 350px;
}
.form-row > .form-group.field-md-no-basis input {
    width: 350px;
}
/*.form-row > .form-group.field-md-no-basis > .inline-group input {
    width: 150px;
}*/
/**:not(td) > .form-row:last-of-type {
    margin-bottom: 0px;
}*/
/*.form-row + *:not(.form-row, .button-row, .no-margin) {
    margin-top: 15px;
}*/
.form-row + .form-content {
    margin-top: 10px;
}
.form-row > .form-group.radio-container, .form-row > .form-group > .radio-container,
.form-row > .form-group.checkbox-container, .form-row > .form-group > .checkbox-container {
    width: auto;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
}
.form-row.inline > .form-group.radio-container, .form-row.inline > .form-group > .radio-container,
.form-row.inline > .form-group.checkbox-container, .form-row.inline > .form-group > .checkbox-container {
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}
.group-label {
    width: auto;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    margin: 0px 15px 10px 10px;
    color: var(--color-default-gray);
}
.form-row.lightbox-footer > * {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

/* FORM GROUP ========================= */

/*.form-group.inline {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex: 1 1 !important;
    flex: 1 1 auto !important;
}
.form-group.inline label {
    width: auto;
    white-space: nowrap;
}
.form-group.inline input + input,
.form-group.inline > label.checkbox-container + label.checkbox-container,
.form-group.inline > label.radio-container + label.radio-container {
    margin-left: 10px;
}*/

/*.form-group .inline-group {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: baseline;
    align-items: baseline;
    width: 100%;
}*/

/*.form-group .inline-group > label + input, .form-group .inline-group > label + select, .form-group .inline-group > label + div, .form-group .inline-group > p + input, .form-group .inline-group > p + select, .form-group .inline-group > input + input, .form-group .inline-group > input + select, .form-group .inline-group > input + div, .form-group .inline-group > select + select, .form-group .inline-group > select + input, .form-group .inline-group > select + div, .form-group .inline-group > div + label {
    margin-left: 10px;
}*/

/*.form-group .inline-group > .radio-container + .radio-container {
    margin-left: 10px;
}*/

/*.form-group .inline-group > p {
    white-space: nowrap;
}*/

/*.form-group .inline-group > input + a, .form-group .inline-group > input + p, .form-group .inline-group > input + span, .form-group .inline-group > select + a, .form-group .inline-group > select + p, .form-group .inline-group > select + span {
    -webkit-flex: 1 0 auto;
    flex: 1 0 auto;
    margin-left: 5px;
    margin-bottom: 0px;
    white-space: nowrap;
}*/

/*.form-group .inline-group > * + * {
    -webkit-flex: 1 0 auto;
    flex: 1 0 auto;
    margin-left: 5px;
    margin-bottom: 0px;
    white-space: nowrap;
}*/

/* BUTTON GROUP ========================= */
.button-group {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    align-items: center;
    width: 100%;
}
.form-row > .button-group {
    width: calc(100% + 10px);
}
.form-row > .button-group[class$="filter"] {
    flex: 1 1 auto;
    justify-content: flex-end;
    flex-wrap: wrap;
    width: auto;
}
.form-row > .form-group.inline + .button-group:not(.inline) {
    margin-top: -10px;
}
.button-group.inline {
    width: auto;
}
.form-row > .button-group {
    margin-left: 0px;
}
.form-row > .button-group.inline {
    width: auto;
    margin: 0px 0px 0px 0px;
}
.form-row > ul.button-group.inline {
    margin-left: 5px;
}
.form-row > .form-group + .button-group:not(.inline, [class$="filter"]) {
    margin-top: 10px;
}
.form-row.inline > .form-group + .button-group > * {
    margin-bottom: 0px;
}
.button-group.spaced {
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
.form-row .button-group.centered {
    -webkit-justify-content: center;
    justify-content: center;
}
.button-group.inline-right {
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
}
.button-group.inline-left {
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
}
.form-row > .button-group.label-margin {
    margin-top: 30px;
}
.button-group > * {
/*    margin-left: 10px;
    margin-top: 10px;*/
    margin: 10px 0px 0px 10px;
}
.button-group.inline > * {
    margin: 0px 0px 10px 10px;
}
.form-row ul.button-group.inline {
    margin-bottom: 5px;
}
ul.button-group.inline > li {
    margin: 0px 0px 5px 5px;
}
.form-row > :not(ul).button-group.inline > * {
    margin-top: 10px;
}
/*ul.button-group > li {
    margin-left: 5px;
}*/

/* CALENDAR / EVENTS ========================= */
.calendar-container {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
    position: relative;
    width: 100%;
}
.calendar-container input.datetimepicker, .calendar-container input.datepicker, .calendar-container input.date-range {
    padding-right: 38px;
}
.calendar-container .ui-datepicker-trigger {
    position: absolute;
    top: 0;
    right: 0;
    width: 40px;
    height: 100%;
    padding: 6px;
    background-color: transparent;
}
.calendar-field {
    background-image: url(/TenantsContent/Default/content/images/icons/calendar-week-fill.svg);
    background-repeat: no-repeat;
    background-size: 20px auto;
    background-position: calc(100% - 12px);
    padding-right: 44px;
}
.calendar-field + .ui-datepicker-trigger {
    display: none;
}

/* CHECKBOX / RADIO ========================= */
.checkbox-container, .radio-container {
    display: block;
    position: relative;
    padding-left: 20px;
    cursor: pointer;
}
.checkbox-container input[type='checkbox'], .radio-container input[type='radio'] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
.checkbox-container .checkmark, .radio-container .radiomark {
    position: absolute;
    top: 2px;
    left: 0;
    height: 15px;
    width: 15px;
    border-width: 1px;
    border-style: solid;
}
.checkbox-container .checkmark {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}
.radio-container .radiomark {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

table thead tr th .checkbox-container .checkmark, table thead tr th .radio-container .radiomark {
    width: 20px;
    height: 20px;
    border-width: 2px;
}
table thead tr th .checkbox-container, table thead tr th .radio-container {
    display: inline;
    top: -3px;
}
.remember-category-checkbox {
    display: none;
}
.checkbox-container.remember-category-checkbox {
    padding-left: 20px;
    margin-bottom: 0px;
}
.checkbox-container.remember-category-checkbox .checkmark {
    top: 2px;
}

/* WIZARD FORM ========================= */
ul.wizard-form {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
    flex-wrap: wrap;
    list-style: none;
    width: 100%;
}
ul.wizard-form li {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: baseline;
    align-items: baseline;
    width: 100%;
    padding: 15px 25px;
}
ul.wizard-form li + li {
    margin-top: 5px;
}
ul.wizard-form li > span + span {
    padding-left: 10px;
}
ul.wizard-form li label {
    width: auto;
    min-width: 250px;
    -webkit-flex: 0 1 auto;
    flex: 0 1 auto;
}
ul.wizard-form li input {
    width: 100%;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    background-color: #ffffff;
}
ul.wizard-form li a {
    text-align: right;
    width: auto;
    -webkit-flex: 0 1 auto;
    flex: 0 1 auto;
    min-width: 100px;
}
ul.wizard-form li input + input {
    margin-left: 15px;
}

/* FORM DIVIDE ELEM ========================= */
.form-divide-group .form-divide-item {
    padding-top: 10px;
    padding-bottom: 15px;
    margin-bottom: 5px;
}
.form-divide-group .form-divide-item input {
    width: 100%;
    background-color: #ffffff;
}
.form-divide-group .form-divide-item .add-another-text {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    padding-bottom: 5px;
}
.form-divide-group .form-divide-item, .wizard-form li {
    background-color: var(--color-default-light-inactive);
}

/* MENU ========================= */
#menu {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    width: 100%;
}
#menu input, #menu button {
    display: inherit;
}
#menu button {
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    padding: 0px;
    width: 25px;
    min-height: var(--fgs-form-min-height);
    -webkit-border-top-left-radius: 0px;
    -moz-border-radius-topleft: 0px;
    border-top-left-radius: 0px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topright: 5px;
    border-top-right-radius: 5px;
    -webkit-border-bottom-left-radius: 0px;
    -moz-border-radius-bottomleft: 0px;
    border-bottom-left-radius: 0px;
    -webkit-border-bottom-right-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    border-bottom-right-radius: 5px;
}
#menu button::after {
    content: "";
    position: absolute;
    border-top: 8px solid #ffffff;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
}
select::before {
    content: "";
    position: absolute;
    width: 30px;
    height: 100%;
    background-color: var(--color-default-dark);
}
#menu button.ui-state-default .ui-icon {
    background-image: none;
}
#menu button span {
    padding: 0px;
}
#menu select, #menu input {
    margin-right: 0px;
}
.ui-menu {
    max-height: 300px;
    overflow: auto;
    padding: 5px 15px 0px 15px;
}

.ui-menu > .ui-autocomplete-category {
    font-size: 22px;
    font-weight: bold;
    line-height: 2;
}
.ui-menu > .ui-menu-item:not(:first-of-type) {
    margin-top: -5px;
    margin-bottom: 5px;
}
.ui-menu > .ui-menu-item a {
    font-size: 18px;
    line-height: 1.3;
    padding: 6px 10px 4px 10px;
}
.ui-menu > .ui-menu-item:first-of-type a {
    font-style: italic;
}
.ui-menu > .ui-menu-item > a > span {
    float: right;
    font-size: 80%;
}
.ui-menu .ui-menu-item a.ui-state-hover,
.ui-menu .ui-menu-item a.ui-state-active {
    margin: 0px;
    border: none;
}

/* THEME UI ========================= */

.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl {
    -webkit-border-top-left-radius: 5px;
    -moz-border-radius-topleft: 5px;
    border-top-left-radius: 5px;

    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topright: 5px;
    border-top-right-radius: 5px;


    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-left-radius: 5px;

    -webkit-border-bottom-right-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    border-bottom-right-radius: 5px;
}

.ui-corner-bottom {
    -webkit-border-top-right-radius: 0px;
    -moz-border-radius-topright: 0px;
    border-top-right-radius: 0px;

    -webkit-border-bottom-right-radius: 0px;
    -moz-border-radius-bottomright: 0px;
    border-bottom-right-radius: 0px;
}

.ui-corner-left {
    -webkit-border-top-right-radius: 0px;
    -moz-border-radius-topright: 0px;
    border-top-right-radius: 0px;

    -webkit-border-bottom-right-radius: 0px;
    -moz-border-radius-bottomright: 0px;
    border-bottom-right-radius: 0px;
}


/* ============================================================================ */
/*      VALIDATION                                                              */
/* ============================================================================ */
.add-another-text {
    margin-top: 10px;
}
.alerts {
    min-height: 50px;
    max-height: 240px;
    overflow:auto;
}
label.error {
    color: var(--color-default-red);
}
/*#ajax-errors, #ajax-success, #ajax-message, .validation-container {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    overflow: hidden;
    margin: 0px auto;
}*/
/*#ajax-errors, #ajax-success, #ajax-message, .validation-summary-errors, .validation-summary-success {
    padding: 10px 0px;
    margin: 5px 0px;
    width: auto;
}*/
/*#ajax-errors, #ajax-success, #ajax-message {
    padding-left: 30px;
    padding-right: 10px;
}*/
/*.validation-summary-errors ul, .validation-summary-success ul {
    list-style: none;
    padding-left: 45px;
    width: auto;
}*/
/*#ajax-errors #ajax-message ul li, .validation-summary-errors ul li, .validation-summary-success ul li {
    position: relative;
    padding-left: 10px;
    margin-bottom: 10px;
    width: auto;
    font-weight: bold;
}*/
/*.validation-summary-errors ul li:last-of-type, .validation-summary-success ul li:last-of-type, #ajax-message ul li:last-of-type {
    margin-bottom: 0px;
}*/
/*.validation-summary-errors ul li::before {
    content: url(/TenantsContent/Default/content/images/icons/exclamation-octagon-fill.svg);
    position: absolute;
    width: 20px;
    height: 20px;
    left: -20px;
}*/
/*.validation-summary-success ul li::before {
    content: url(/TenantsContent/Default/content/images/icons/check-circle-fill.svg);
    position: absolute;
    width: 20px;
    height: 20px;
    left: -20px;
}*/
/*#ajax-message ul li::before {
    content: url(/TenantsContent/Default/content/images/icons/exclamation-triangle-fill.svg);
    position: absolute;
    width: 20px;
    height: 20px;
    left: -20px;
}*/

#validation-container {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    overflow: hidden;
    padding: 10px 25px;
    margin: 0px auto;
}
#validation-container #val-success,
#validation-container #val-warnings,
#validation-container #val-errors {
    list-style: none;
    padding: 0px;
    margin: 0px;
    width: auto;
}
#validation-container ul + ul {
    margin-top: 5px;
}
#validation-container #val-success li,
#validation-container #val-warnings li,
#validation-container #val-errors li {
    position: relative;
    padding: 5px 5px 3px 38px;
    width: auto;
    border-radius: 5px;
    font-weight: bold;
}
#validation-container ul li + li {
    margin-top: 5px;
}
#validation-container #val-success li::before {
    content: url(/TenantsContent/Default/content/images/icons/check-circle-fill.svg);
    position: absolute;
    line-height: 1;
    width: auto;
    height: auto;
    top: 8px;
    left: 12px;
}
#validation-container #val-warnings li::before {
    content: url(/TenantsContent/Default/content/images/icons/exclamation-triangle-fill.svg);
    position: absolute;
    line-height: 1;
    width: auto;
    height: auto;
    top: 8px;
    left: 12px;
}
#validation-container #val-errors li::before {
    content: url(/TenantsContent/Default/content/images/icons/exclamation-octagon-fill.svg);
    position: absolute;
    line-height: 1;
    width: auto;
    height: auto;
    top: 8px;
    left: 12px;
}
#loading-container {
    position: absolute;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    z-index: 10000;
    top:0px;
    left:0px;
    background: rgba(250, 250, 250, 0.65);
}
#loading-container img {
    margin: 15px;
}
#loading-graphic {
    width: auto;
    height: auto;
    background: transparent;
    background-color: transparent;
}
#loading-graphic img {
    width: 25px;
    height: auto;
}
#loading-graphic img.lg-loader {
    width: 50px;
    height: auto;
}
#updatingMessage p, #updatingCategoriesMessage p {
    padding: 10px 25px;
}
#updatingMessage p:not(.alt), #updatingCategoriesMessage p:not(.alt) {
    font-style: italic;
}
/*.alerts-notifications .form-row .form-group .inline-group {
    -webkit-align-items: flex-end;
    align-items: flex-end;
}
.alerts-notifications .form-row .form-group .inline-group label {
    white-space: nowrap;
}*/




/* ============================================================================ */
/*      DISPLAY AREAS                                                           */
/* ============================================================================ */
/* ---- DISPLAY AREAS : Cards ------------------------------------------------- */
.card-container {
    -webkit-box-shadow: 0px 0px 10px -2px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 0px 10px -2px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 0px 10px -2px rgba(0, 0, 0, 0.25);
    background-color: white;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
    overflow: hidden;
    margin-bottom: 20px;
}
div > .row .card-container {
    margin-bottom: 9px;
}
div > .row:last-child .card-container {
    margin-bottom: 20px;
}
.card-header, .card-body, .card-footer {
    padding: 0;
    background: transparent;
    background-color: transparent;
    border: none;
}
.card-header {
    padding: var(--fgs-gutter) var(--fgs-gutter-lg);
}
.card-container .card-header h2,
.card-container .card-header h3,
.card-container .card-header h4 {
    color: var(--color-client-primary);
}
.card-body {
    display: inline-block;
    width: 100%;
    padding: 25px;
    margin: auto;
}
@media(min-width: 768px) {
    .card-body.col-6 {
        flex: 0 0 auto;
        width: 50%;
        float: left;
    }
}
.card-footer {
    padding: 0px 28px 25px 28px;
}
.card-container.split-card .card-header {
    min-height: 60px;
}
.card-box-center {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    padding: 50px;
    border: 2px dashed var(--color-default-dark);
    background: transparent;
    background-color: transparent;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
    overflow: hidden;
    margin: 50px 0px;
}
.card-box-center > * + * {
    margin-top: 25px;
}

.card-container h2 {
    color: var(--color-client-primary);
}
.card-container > .card-body + .card-header {
    padding-top: 10px;
}

.card-container.split-card.card-secondary {
    border: 2px solid var(--color-client-secondary);
}
.card-container.split-card.card-secondary .split-card-dark {
    background-color: var(--color-client-secondary);
}
.card-container.split-card.card-secondary .split-card-dark * {
    color: #ffffff;
}

.card-container.split-card.card-secondary .split-card-dark input[type='text'],
.card-container.split-card.card-secondary .split-card-dark input[type='password'] {
    color: black;
}

.card-dark {
    background-color: var(--color-client-secondary-dark);
}

.card-dark * {
    color: #ffffff;
}
/* ---- DISPLAY AREAS : 3D Background ----------------------------------------- */
.cutout-background-wrapper {
    --content-height: 350px;
    position: relative;
    overflow: hidden;
    height: var(--content-height);
}
.cutout-background-wrapper::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: transparent;
    top: 0;
    z-index: 1;
}
.cutout-background-wrapper:nth-child(odd)::before {
    background: #ffffff;
    background: -moz-linear-gradient(-155deg, #ffffff 40%, transparent 90%);
    background: -webkit-gradient(linear, -155deg, color-stop(40%, #ffffff), color-stop(90%, transparent));
    background: -webkit-linear-gradient(-155deg, #ffffff 40%, transparent 90%);
    background: -o-linear-gradient(-155deg, #ffffff 40%, transparent 90%);
    background: -ms-linear-gradient(-155deg, #ffffff 40%, transparent 90%);
    background: linear-gradient(-155deg, #ffffff 40%, transparent 90%);
}
.cutout-background-wrapper:nth-child(even)::before {
    background: #ffffff;
    background: -moz-linear-gradient(155deg, #ffffff 40%, transparent 90%);
    background: -webkit-gradient(linear, 155deg, color-stop(40%, #ffffff), color-stop(90%, transparent));
    background: -webkit-linear-gradient(155deg, #ffffff 40%, transparent 90%);
    background: -o-linear-gradient(155deg, #ffffff 40%, transparent 90%);
    background: -ms-linear-gradient(155deg, #ffffff 40%, transparent 90%);
    background: linear-gradient(85deg, #ffffff 40%, transparent 90%);
}
.cutout-background-wrapper .cutout-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #ffffff;
}
.cutout-background-wrapper:nth-child(odd) .cutout-background {
    -webkit-border-top-left-radius: 175px;
    -moz-border-radius-topleft: 175px;
    border-top-left-radius: 175px;
    -webkit-border-top-right-radius: 0px;
    -moz-border-radius-topright: 0px;
    border-top-right-radius: 0px;
    -webkit-border-bottom-left-radius: 175px;
    -moz-border-radius-bottomleft: 175px;
    border-bottom-left-radius: 175px;
    -webkit-border-bottom-right-radius: 0px;
    -moz-border-radius-bottomright: 0px;
    border-bottom-right-radius: 0px;
    -webkit-box-shadow: inset 15px -10px 45px -25px rgba(0, 0, 0, 0.45);
    -moz-box-shadow: inset 15px -10px 45px -25px rgba(0, 0, 0, 0.45);
    box-shadow: inset 15px -10px 45px -25px rgba(0, 0, 0, 0.45);
   padding: var(--fgs-gutter-xl);
   padding-right: calc(var(--fgs-gutter-xl) * 1.5);
   padding-left: calc(var(--fgs-gutter-xl) * 1.5);
}
.cutout-background-wrapper:nth-child(even) .cutout-background {
    -webkit-border-top-left-radius: 0px;
    -moz-border-radius-topleft: 0px;
    border-top-left-radius: 0px;
    -webkit-border-top-right-radius: 175px;
    -moz-border-radius-topright: 175px;
    border-top-right-radius: 175px;
    -webkit-border-bottom-left-radius: 0px;
    -moz-border-radius-bottomleft: 0px;
    border-bottom-left-radius: 0px;
    -webkit-border-bottom-right-radius: 175px;
    -moz-border-radius-bottomright: 175px;
    border-bottom-right-radius: 175px;
    -webkit-box-shadow: inset -15px -10px 45px -25px rgba(0, 0, 0, 0.45);
    -moz-box-shadow: inset -15px -10px 45px -25px rgba(0, 0, 0, 0.45);
    box-shadow: inset -15px -10px 45px -25px rgba(0, 0, 0, 0.45);
    padding: var(--fgs-gutter-xl);
    padding-right: calc(var(--fgs-gutter-xl) * 1.5);
    padding-left: calc(var(--fgs-gutter-xl) * 1.5);
}
.cutout-background-wrapper .cutout-background > * > * {
    position: relative;
    z-index: 1;
}
.cutout-background-wrapper .cutout-background > .row,
.cutout-background-wrapper .cutout-background > .row > [class^="col-"] {
   margin-top: 0px;
}
.cutout-background-wrapper .cutout-background > .row,
.cutout-background-wrapper .cutout-background > .row > [class^="col-"]:not(.align-self-center) {
    height: 100%;
}
.cutout-background-wrapper .cutout-background .cutout-img-container {
    width: 100%;
    height: 100%;
}
.cutout-background-wrapper:nth-child(odd) .cutout-background .cutout-img-container > img {
    margin-top: 10px;
}
.cutout-background-wrapper .cutout-background .cutout-img-container > img {
    max-width: 100%;
    max-height: 100%;
}

/* ---- DISPLAY AREAS : Tabs & Accordions -------------------------------------------- */
.tab-container,
table.tab-container,
.accordion-container {
    --content-gutter: var(--fgs-gutter);
    --content-gutter-offset: calc(var(--content-gutter) * -1);
    --content-gutter-double: calc(var(--content-gutter) * 2);
    --content-gutter-half: calc(var(--content-gutter) * 0.5);
    --content-gutter-half-offset: calc(var(--content-gutter-half) * -1);
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    border-width: 3px;
    border-style: solid;
    -webkit-box-shadow: 0 0 0 5px var(--color-default-light);
    -moz-box-shadow: 0 0 0 5px var(--color-default-light);
    box-shadow: 0 0 0 5px var(--color-default-light);
    overflow: hidden;
    margin: 0px;
}
.tab-container, table.tab-container {
    margin-top: 4px;
    margin-bottom: 4px;
}
.accordion-container.default-none {
    box-shadow: none;
}
* > .tab-container:not(:last-child),
* > .accordion-container:not(:last-child) {
    margin-bottom: var(--fgs-gutter);
}

.tab-container .tab-header,
.tab-container .tab-body,
.tab-container .tab-footer,
.accordion-container .accordion-button,
.accordion-container .accordion-body {
    padding: var(--content-gutter-half) var(--content-gutter);
}
.tab-container .tab-header,
.tab-container .tab-footer,
.accordion-container .accordion-button {
    padding-top: var(--content-gutter-half);
    padding-bottom: var(--content-gutter-half);
}
.accordion-container .accordion-button {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
    text-decoration: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
.accordion-container .accordion-button h4 {
    margin-bottom: 0px;
}
.accordion-container .accordion-button:focus {
    border: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
.accordion-container .accordion-button::after {
    display: none;
    content: "";
}
.accordion-container .accordion-button .accordion-icon {
    font-size: 24px;
    transition: all 0.2s ease-out;
}
.accordion-container .accordion-button:not(.visible) .accordion-icon {
    transform: rotate(0deg);
}
.accordion-container .accordion-button.visible .accordion-icon {
    transform: rotate(180deg);
}


.tab-container .tab-header h4,
table.tab-container thead tr th,
.tab-container .tab-header h4,
table.tab-container tbody tr.thead-row td,
.accordion-container .accordion-button .accordion-header {
    letter-spacing: 0.5px;
    margin: 0;
}

.tab-container .tab-body table,
.accordion-container .accordion-body table {
    border-radius: 0px;
    border: none;
    box-shadow: none;
    margin: 0px;
}
.tab-container .tab-body table thead tr th,
.tab-container .tab-body table thead tr td,
.tab-container .tab-body table tbody tr td,
.accordion-container .accordion-body table thead tr th,
.accordion-container .accordion-body table thead tr td,
.accordion-container .accordion-body table tbody tr td {
    padding: var(--content-gutter-half);
}
.tab-container .tab-body > table,
.tab-container .tab-body > .content-heading,
.accordion-container .accordion-body > table,
.accordion-container .accordion-body > .content-heading {
/*    margin: var(--content-gutter-offset);
    width: calc(100% + var(--content-gutter-double));*/
    margin: var(--content-gutter-half-offset) var(--content-gutter-offset);
    width: calc(100% + var(--content-gutter-double));
}
.tab-container .tab-body > table > thead > tr > th,
.tab-container .tab-body > table > thead > tr > td,
.tab-container .tab-body > table > tbody > tr > td,
.tab-container .tab-body > .content-heading,
.accordion-container .accordion-body > table > thead > tr > th,
.accordion-container .accordion-body > table > thead > tr > td,
.accordion-container .accordion-body > table > tbody > tr > td,
.accordion-container .accordion-body > .content-heading {
    /*padding: var(--content-gutter);*/
    padding: var(--content-gutter-half) var(--content-gutter);
}
.accordion-container .accordion-body .content-heading,
.accordion-container .accordion-body table thead th,
.accordion-container .accordion-body table thead td {
    font-weight: bold;
    color: var(--color-default-dark);
    background-color: var(--color-default-light-inactive);
}
.accordion-container .accordion-body table thead th > *,
.accordion-container .accordion-body table thead td > * {
    font-weight: inherit;
    color: inherit;
}
.accordion-container.default-dark.active .accordion-button {
    background-color: var(--color-default-dark);
}

.accordion-container .accordion-body a:not(.btn) {
    text-decoration: none;
    color: var(--color-client-primary);
}
.accordion-container .accordion-body a:not(.btn):hover,
.accordion-container .accordion-body a:not(.btn):focus,
.accordion-container .accordion-body a:not(.btn):active, {
    text-decoration: none;
    color: var(--color-client-primary-dark);
}
.tab-container .tab-footer:not(:first-child) {
    margin-top: var(--fgs-gutter-sm);
}
.tab-container .tab-body > .inline-content > .image {
    display: inherit;
    width: auto;
    height: 90px;
    flex: 0 0 90px;
}
.tab-container table.tab-body tbody tr td:first-of-type *:not(.form-row, .form-group),
table.tab-container tbody tr td:first-of-type *:not(.form-row, .form-group) {
    display: inline;
}
.tab-container table.tab-body tr td .table-cell-top-left,
.tab-container table.tab-body tr td.emphasized-text,
.tab-container table.tab-body tr td span.emphasized-text,
table.tab-container tr td .table-cell-top-left,
table.tab-container tr td.emphasized-text,
table.tab-container tr td span.emphasized-text {
    font-weight: bold;
    color: var(--color-client-primary);
}
.tab-container table.tab-body tr td .table-cell-top-left ~ *,
table.tab-container tr td .table-cell-top-left ~ * {
    float: left;
    margin-top: 3px;
    margin-right: 10px;
}
.tab-container table.tab-body tr td input,
table.tab-container tr td input {
    margin-right: 10px;
}
.tab-container table.tab-body tbody tr.totals-row {
    background-color: var(--color-default-light-inactive);
}
.tab-container table.tab-body tbody tr.thead-row + tr.totals-row {
    background-color: transparent;
}

.toggle-accordions-group {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
}
.toggle-accordions-group span.toggle-icon {
    margin-right: 5px;
}
.toggle-accordions-group.isCollapsed span.toggle-icon {
    transform: rotate(180deg);
}
.toggle-accordions-group:not(.isCollapsed) span.toggle-icon {
    transform: rotate(0deg);
}
.toggle-accordions-group span.toggle-icon::before {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-self: center;
    align-self: center;
    transition-duration: 0.5s;
}
.toggle-accordions-group.isCollapsed span.toggle-text::after {
    content: "Expand All";
}
.toggle-accordions-group:not(.isCollapsed) span.toggle-text::after {
    content: "Collapse All";
}


/* ---- DISPLAY AREAS : Selection Box ----------------------------------------- */
.content-box {
    padding: 15px 25px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}
.content-box .content-box-inner {
    height: calc(100% - 20px);
    margin-top: 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 25px;
}
.content-box .form-row h3 {
    line-height: 1;
}
.goal-link *, .selection-box::before {
    transition: all 0.5s ease;
}
.goal-link .selection-box {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    position: relative;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    min-width: 150px;
    min-height: 150px;
    padding: 25px;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
    overflow: hidden;
    transition: all 0.5s ease;
}
.goal-link .selection-box::before {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-image: url(/TenantsContent/Default/content/images/overlay-light.png);
    background-position: center;
    opacity: 0.25;
    transition: all 0.5s ease;
}
.goal-link.emergency .selection-box::before {
    background-image: url(/TenantsContent/Default/content/images/goals/ian-taylor-WyAKyPBs5Q8-unsplash.jpg);
    background-size: cover;
}
.goal-link.retirement .selection-box::before {
    background-image: url(/TenantsContent/Default/content/images/goals/diana-parkhouse-sjor4I5nE7o-unsplash.jpg);
    background-size: cover;
}
.goal-link.buy-home .selection-box::before {
    background-image: url(/TenantsContent/Default/content/images/goals/tierra-mallorca-rgJ1J8SDEAY-unsplash.jpg);
    background-size: cover;
}
.goal-link.buy-car .selection-box::before {
    background-image: url(/TenantsContent/Default/content/images/goals/erik-mclean-2MYD5NO0O9k-unsplash.jpg);
    background-size: cover;
}
.goal-link.college .selection-box::before {
    background-image: url(/TenantsContent/Default/content/images/goals/md-duran-1VqHRwxcCCw-unsplash.jpg);
    background-size: cover;
}
.goal-link.trip .selection-box::before {
    background-image: url(/TenantsContent/Default/content/images/goals/aaron-burden-cEukkv42O40-unsplash.jpg);
    background-size: cover;
}
.goal-link.improve-home .selection-box::before {
    background-image: url(/TenantsContent/Default/content/images/goals/annie-gray-WEWTGkPUVT0-unsplash.jpg);
    background-size: cover;
}
.goal-link.custom .selection-box::before {
    background-image: url(/TenantsContent/Default/content/images/overlay-light.png);
    top: 4px;
    bottom: 4px;
    left: 4px;
    right: 4px;
    width: auto;
    height: auto;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    opacity: 0.15;
}
.goal-link .selection-box p {
    position: absolute;
    text-align: center;
    margin-bottom: 0px;
    font-weight:bold;
    font-size:1.5rem;
    text-shadow:0px 0px 1px black;
    font-family:Poppins;
}
.goal-link:not(.custom):hover > .selection-box::before {
    background-size: 110% auto;
}
.goal-link:hover > .selection-box p {
    font-size: 22px;    
}
.crop-image-container .default-image-wrapper,
.crop-image-container .selected-image {
    width: 150px;
    height: 150px;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
    border-width: 1px;
    border-style: solid;
    -webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.25);
    text-align: center;
    margin: 25px auto 15px auto;
    overflow: hidden;
}
.crop-image-container .default-image-wrapper img,
.crop-image-container .selected-image img {
    width: 100%;
    height: auto;
}
#upload-link {
    position: relative;
}
.upload-actions span input[type="file"] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}
.crop-image-container.ready .croppie-container .cr-slider-wrap {
    margin-bottom: 10px;
}
.goal-image-container {
    width: 110px;
    height: 110px;   
    overflow: hidden;
}
.goal-image-container img {
    width: 100%;
    height: auto;
}
.crop-image-container .upload-actions span:hover,
.crop-image-container .upload-actions span > *:hover {
    cursor: pointer;
}
.selection-button .selection-box {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    position: relative;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    min-height: 150px;
    padding: 25px;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
    overflow: hidden;
}
.selection-button:hover .selection-box p {
    font-size: 22px;
}

/* ---- DISPLAY AREAS : Progress Bars ----------------------------------------- */
.progress-bar-container {
    position: relative;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
    width: 100%;
    margin-bottom:46px;
}



.item-content-area .progress-bar-container {
    margin-bottom: 1px;
}
.progress-bar-container .progress-title,
.progress-bar-container .progress-bar,
.progress-bar-container .progress-details,
.progress-bar-container .progress-details-container {
    display: initial;
}
.progress-bar-container .progress-title {
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    text-align: right;
    width: auto;
    white-space: nowrap;
}
.progress-bar-container .progress-bar {
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    position: relative;
    border-width: 1px;
    border-style: solid;
min-width: 0px;
    margin: 0px 15px;
    -webkit-box-shadow: inset 0 0 4px 2px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: inset 0 0 4px 2px rgba(0, 0, 0, 0.15);
    box-shadow: inset 0 0 4px 2px rgba(0, 0, 0, 0.15);
}
.progress-bar-container .progress-details {
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    text-align: left;
    width: auto;
    white-space: nowrap;
}
.progress-bar-container .progress-details .notice-text {
    margin-bottom: 0px;
}
.progress-bar-container .button-group {
    width: auto;
}

.progress-bar-container .progress-title.hasSubAcc {
    position: relative;
    padding-right: 20px;
}
.progress-bar-container .progress-bar, .progress-bar-container .progress-bar .progress-bar-color {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}
.progress-bar-container .progress-bar, .progress-bar-container .progress-bar .progress-bar-color, .progress-slider-container .progress-slider, .progress-slider-container .progress-slider .pct-bar-color {
    height: 20px;
}
.progress-bar-container .button-group {
    width: auto;
}
.progress-bar-container .progress-bar:not(.hasSlider) {
    overflow: hidden;
}
.goal-section .progress-bar-container .progress-bar {
    overflow: visible;
}
.progress-bar-container .progress-bar:only-child {
    width: 100%;
    margin: 0px 0px 15px 0px;
}
#update-goal-content .progress-bar-container .progress-bar:only-child, #update-goal-content .progress-bar-container .progress-bar:only-child .progress-bar-color {
    height: 40px;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    border-radius: 40px;
}
#update-goal-content .progress-bar-container .progress-bar:only-child .progress-bar-color {
    background-size: auto 100%;
}
.progress-bar-container .inline-button-group {
    margin: 0px;
}
.progress-bar-container .progress-bar .slider-icon, .progress-slider-container .progress-slider .slider-icon {
    width: 12px;
    height: var(--fgs-form-min-height);
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
    border-radius: 24px;
    border-width: 4px;
    border-style: solid;
    border-color: var(--color-client-primary);
    background-color: var(--color-client-primary-light);
    position: absolute;
    float: left;
    top: -6px;
    z-index: 2;
    cursor: pointer;
    -webkit-box-shadow: 0px 0px 0px 2px #ffffff, 0px 0px 8px 2px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 0px 0px 2px #ffffff, 0px 0px 8px 2px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 0px 0px 2px #ffffff, 0px 0px 8px 2px rgba(0, 0, 0, 0.25);
}
.progress-bar-container .progress-bar.vertical .slider-icon, .progress-slider-container .progress-slider.vertical .slider-icon {
    width: var(--fgs-form-min-height);
    height: 12px;
    -webkit-border-radius: 24px;
    -moz-border-radius: 24px;
    border-radius: 24px;
    border-width: 4px;
    border-style: solid;
    border-color: var(--color-client-primary);
    background-color: var(--color-client-primary-light);
    position: absolute;
    float: left;
    left: -6px;
    z-index: 2;
    cursor: pointer;
    -webkit-box-shadow: 0px 0px 0px 2px #ffffff, 0px 0px 8px 2px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 0px 0px 2px #ffffff, 0px 0px 8px 2px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 0px 0px 2px #ffffff, 0px 0px 8px 2px rgba(0, 0, 0, 0.25);
}
.progress-slider-container {
    width: auto;
    height: 170px;
}
.progress-slider-container .progress-slider {
    border: none;
    position: relative;
    width: 100%;
    float: left;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    border-radius: 40px;
}
.progress-slider-container.inline-group {
    flex-wrap: wrap;
    -webkit-align-items: center;
    align-items: center;
    padding-top: 6px;
    height: 32px;
}
.progress-slider-container.inline-group > * {
    display: inherit;
    width: auto;
}
.progress-slider-container.inline-group > .progress-slider {
    -webkit-flex: 1 1 80%;
    flex: 1 1 80%;
    min-width: 300px;
}
.progress-slider-container.inline-group > .slider-val {
    padding-left: 25px;
    -webkit-flex: 0 0 20%;
    flex: 0 0 20%;
}
.progress-bar.stepped.vertical, .progress-slider.vertical {
    position: relative;
    top: 14px;
    width: 20px;
    height: calc(100% - 26px);
}
.progress-slider-container .progress-slider ~ ul {
    padding-left: 40px;
}
.progress-bar-container .progress-bar.stepped.vertical, .pct-slider-container .pct-bar-bg.stepped.vertical {
    position: absolute;
    top: 0px;
    height: 100%;
    margin-bottom: 0px;
    width: 8px;
}
.progress-bar-container .progress-bar.stepped.vertical .slider-icon, .pct-slider-container .pct-bar-bg.stepped.vertical .slider-icon {
    width: 20px;
    height: 15px;
    top: 7px;
    left: -7px;
    background: url(/TenantsContent/Default/content/images/slider-vertical.png) 0 0 no-repeat;
    background-size: contain;
}
.progress-bar-container i {
    cursor: pointer;
}
.progress-bar-container .bi-caret-down-fill {
    position: absolute;
    font-size: initial;
    line-height: 0px;
    top: 5px;
    right: 0px;
    transition-duration: 0.5s;
}
.progress-bar-container .bi-caret-down-fill.show {
    transform: rotate(180deg);
}

.sub-content-container {
    width: 100%;
    transition: background-color 0.5s ease;
}
.sub-content-container > .form-row {
    width: calc(100% + 25px);
    margin-left: -25px;
    justify-content: space-between;
    align-items: center;
}
.sub-content-container > .form-row > * {
    margin: 0px 0px 0px 15px !important;
}
.sub-content-container > .form-row > .progress-bar-container {
    flex-wrap: wrap;
    flex: 1 1 auto;
}
.sub-content-container > .form-row > .progress-bar-container > .progress-title,
.sub-content-container > .form-row > .progress-bar-container > .progress-bar,
.sub-content-container > .form-row > .progress-bar-container > .progress-details,
.sub-content-container > .form-row > .button-group > * {
    margin-top: 0px !important;
    margin-right: 0px !important;
    margin-left: 10px !important;
    margin-bottom: 10px !important;
}
.sub-content-container > .form-row > .progress-bar-container > .progress-bar {
    min-width: 300px;
}

.budget-graph-item.progress-bar-container {
    padding-top: 0px;
    margin-bottom:0px;
}

.progress-bar-item {
    height: 40px;
}

table.childContainer {
    border: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    margin-top: 10px;
    margin-bottom: 10px;
    width: 100%;
    padding: 15px 25px 15px 24%;
}
table.childContainer tbody tr td {
    padding: 0px 0px 5px 0px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}
.goal-section .item .image {
    width: 80px;
    height: 80px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background: var(--color-default-light);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.goal-section .item .item-content-area {
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    width: calc(100% - 80px);
    padding:4px;    
}
.goal-section .item .item-content-area .cta-header {
    width: 100%;
    padding: 3px 0px 5px 25px;
    background-color: var(--color-default-light-inactive);
}
.goal-section .item .item-content-area .cta-header .view-goal-details-btn {
    padding: 5px 15px;
}
.goal-section .item .item-content-area .btn {
    float: right;
}

.goal-title {
    font-family:Roboto;
    font-weight:300;
    font-size:18pt;
    position:relative;
    top:-8px;
}

.goal-title-completed {  
    font-size: 12pt;
    position: relative;
    top: -2px;
}

.goal-date-status {
    position: relative;
    font-size: 11pt;
    top: -9px;
    margin-left: 10px;
}

.goal-date-projected {
    position: relative;
    font-weight:300;
    font-family:Roboto;
    font-size: 12pt;
    top: -2px;    
}

.goal-date-completed {
    font-size: 12pt;
}

#completed-goals .tab-container .tab-header > * {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#completed-goals .item .image {
    width: 50px;
    height: 50px;
}
#completed-goals .item .cta-header {
    display: block;
    float: right;
    width: auto;
    text-align: right;
}
#completed-goals .item .cta-header > * {
    line-height: 1;
}
#completed-goals .item .progress-bar-container .progress-title,
#completed-goals .item .progress-bar-container .progress-bar,
#completed-goals .item .progress-bar-container .progress-details-container {
    width: auto;
}
#completed-goals .item .progress-bar-container .progress-title.complete {
    padding-left: 0px;
}
#completed-goals .item .progress-bar-container .progress-bar .slider-icon {
    display: none;
}













table.progress-bar-group > tbody > tr.progress-bar-item + tr.progress-bar-sub-item > td {
    background-color: var(--color-default-light-inactive);
    padding: 0px;
}
table.progress-bar-group > tbody > tr.progress-bar-item.isShowing > td {
    background-color: var(--color-default-light);
}
table.progress-bar-group > tbody > tr.progress-bar-item.isShowing + tr.progress-bar-sub-item.show > td {
    background-color: var(--color-default-light-inactive);
}
table.progress-bar-group > tbody > tr.isShowing + tr.progress-bar-sub-item.show > td > table tbody tr td {
    background-color: transparent;
}
table.progress-bar-group tbody tr td.pb-title {
    text-align: right;
}
table.progress-bar-group tbody tr td.pb-title .progress-title.hasSubAcc {
    position: relative;
    cursor: pointer;
}
table.progress-bar-group tbody tr td.pb-title .progress-title > i {
    position: relative;
    display: inline-block;
    font-size: inherit;
    line-height: 0px;
    top: 0px;
    right: 0px;
    transition-duration: 0.35s;
    margin-left: var(--fgs-gutter-xs);
}
table.progress-bar-group tbody tr td.pb-title .progress-title:not(.collapsed) > i {
    transform: rotate(180deg);
}
table.progress-bar-group tbody tr td.pb-bar .progress-bar-container .progress-bar {
    width: 100%;
    margin: 0px;
}


table thead tr th.cell-w-auto,
table thead tr td.cell-w-auto,
table tbody tr td.cell-w-auto {
    width: 1px;
}
table thead tr th.cell-wrap-0,
table thead tr td.cell-wrap-0,
table tbody tr td.cell-wrap-0,
.cell-wrap-0 > .form-group,
.cell-wrap-0 > .action-group,
.cell-wrap-0 > .inline-group {
    white-space: nowrap;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

/* ---- DISPLAY AREAS : Tab Container & Content Box --------------------------- */
.progress-slider-container {
    --ps-list-item-height: 30px;
    --ps-list-item-height-half: calc(var(--ps-list-item-height) * 0.5);
    position: relative;
    height: auto;
}
.progress-slider-container .progress-slider.vertical {
    position: absolute;
    top: var(--ps-list-item-height-half);
    height: calc(100% - var(--ps-list-item-height));
}
ul.invests > li {
    margin-bottom: 0px;
    line-height: var(--ps-list-item-height);
    height: var(--ps-list-item-height);
}

.pct-slider-container ul.invests {
    padding-left: 25px;
}

ul.invests, ul.is-agr-panel {
    list-style: none;
}
ul.invests li, ul.is-agr-panel li {
    width: auto;
    cursor: pointer;
}
.tab-container ul.tab-header {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
    width: 100%;
    padding: 0px;
    border-bottom-width: 3px;
    border-bottom-style: solid;
}
.tab-container ul.tab-header li {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 8px 25px;
    transition-duration: 0.25s;
}
.tab-container ul.tab-header li h4 {
    opacity: 0.75;
    font-size: 22px;
    transition-duration: 0.25s;
}
.tab-container ul.tab-header li.selected h4 {
    opacity: 1;
    font-size: 24px;
}
.desc {
    width: 100%;
}
.desc .desc-details, .stats .stats-details {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
    width: 100%;
}
.desc .desc-details > *, .stats .stats-details > * {
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    margin-left: 10px;
}
.desc .desc-details .desc-title, .stats .stats-details .stats-title {
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
}
.stats .stats-details .stats-title {
    font-weight: bold;
}
.desc .desc-details:last-of-type, .stats .stats-details:last-of-type {
    margin-bottom: 0px;
}
.desc .desc-details > *:not(.desc-title) {
    font-weight: bold;
}
.content-box.summary-box p {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: baseline;
    align-items: baseline;
    width: 100%;
    margin-bottom: 10px;
}
.content-box.summary-box p:last-of-type {
    margin-bottom: 0px;
}
.content-box.summary-box p.summary {
    font-weight: bold;
}
.content-box + *, .pct-slider-container + * {
    margin-top: 15px;
}

/* ---- DISPLAY AREAS : Lightbox ---------------------------------------------- */
#lightbox-help {
    position: relative;
}
.lightbox-content-container {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
}
#lightbox-container, #lightbox-container2 {
    width: auto;
    /* overflow: initial; */
    height: auto;
    margin: 0 auto;
    background-color: white;
}
#lightbox-container.lightbox-full, #lightbox-container .lightbox-full, #lightbox-container2.lightbox-full, #lightbox-container2 .lightbox-full {
    padding: 15px;
}
#lightbox-container .accordion {
    width: auto;
}

/*.lightbox-content-area .lightbox-header {
    padding-bottom: 15px;
}*/


.lightbox-side-nav {
    position: absolute;
    height: auto;
    top: 0;
    left: 0;
    bottom: 0;
    padding: 25px 0px;
}
.lightbox-side-nav h3 {
    padding: 0px 15px;
    margin-bottom: 15px;
    line-height: 1;
}
.lightbox-side-nav .lightbox-title {
    padding: 0px 15px;
}
.lightbox-side-nav .lightbox-title > h1 {
    line-height: 1;
    color: #ffffff;
}
ul.lightbox-nav {
    list-style: none;
    padding-left: 0px;
}
ul.lightbox-nav li {
    margin-bottom: 2px;
}
ul.lightbox-nav li a {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    font-weight: 700;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center;
    width: 100%;
    height: 50px;
    padding: 0px 15px;
}












/* ---- DISPLAY AREAS : Colorbox ---------------------------------------------- */
#cboxOverlay {
    position: fixed;
    width: 100%;
    height: 100%;
    background: url(/TenantsContent/Default/content/images/overlay.png) repeat 0 0;
    z-index: 1040;
}
#colorbox, #cboxWrapper {
    position: absolute;
    z-index: 9999;
    overflow: visible !important;
}
#cboxContent {
    position: relative;
    overflow: visible;
}
#cboxLoadedContent {    
    padding:10px;
}
#cboxMiddleLeft, #cboxBottomLeft {
    clear: left;
}
#cboxTopLeft, #cboxTopRight, #cboxBottomLeft, #cboxBottomRight, #cboxMiddleLeft, #cboxMiddleRight {
    width: 12px;
}
#cboxTopLeft, #cboxTopRight, #cboxBottomLeft, #cboxBottomRight, #cboxTopCenter, #cboxBottomCenter {
    height: 12px;
}
#cboxLoadingOverlay {
    background: url(/TenantsContent/Default/content/images/loading_background.png) no-repeat center center;
}
#cboxLoadingGraphic {
    background: url(/TenantsContent/Default/content/images/eclipse-loading-spinner.png) no-repeat center center;
    animation: spin .7s infinite linear;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
.cboxIE6 #cboxTopLeft {
    background: url(/TenantsContent/Default/content/images/ie6/borderTopLeft.png);
}
.cboxIE6 #cboxTopCenter {
    background: url(/TenantsContent/Default/content/images/ie6/borderTopCenter.png);
}
.cboxIE6 #cboxTopRight {
    background: url(/TenantsContent/Default/content/images/ie6/borderTopRight.png);
}
.cboxIE6 #cboxBottomLeft {
    background: url(/TenantsContent/Default/content/images/ie6/borderBottomLeft.png);
}
.cboxIE6 #cboxBottomCenter {
    background: url(/TenantsContent/Default/content/images/ie6/borderBottomCenter.png);
}
.cboxIE6 #cboxBottomRight {
    background: url(/TenantsContent/Default/content/images/ie6/borderBottomRight.png);
}
.cboxIE6 #cboxMiddleLeft {
    background: url(/TenantsContent/Default/content/images/ie6/borderMiddleLeft.png);
}
.cboxIE6 #cboxMiddleRight {
    background: url(/TenantsContent/Default/content/images/ie6/borderMiddleRight.png);
}
#cboxLoadingOverlay, #cboxLoadingGraphic {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow {
    cursor: pointer;
}
#cboxClose {
    position: absolute;
    top: -25px;
    right: -25px;
    background: url(/TenantsContent/Default/content/images/lightbox-close.png) no-repeat left top;
    background-repeat:none;    
    width: 30px;
    height: 30px;
    text-indent: -9999px;
    z-index: 99999;
}
#cboxClose.hover {
    background-position: left bottom;
}
#cboxTitle {
    margin: 0;
    position: absolute;
    bottom: 4px;
    left: 0;
    text-align: center;
    width: 100%;
}
.cboxPhoto {
    float: left;
    margin: auto;
    border: 0;
    display: block;
}
.cboxIframe {
    width: 100%;
    height: 100%;
    display: block;
    border: 0;
}
#cboxError {
    padding: 50px;
    border: 1px solid #ccc;
}
#cboxCurrent {
    position: absolute;
    bottom: 4px;
    left: 58px;
}
#cboxSlideshow {
    position: absolute;
    bottom: 4px;
    right: 30px;
    color: #0092ef;
}
#cboxPrevious {
    position: absolute;
    bottom: 0;
    left: 0;
    background: url(/TenantsContent/Default/content/images/controls.png) no-repeat -75px 0;
    width: 25px;
    height: 25px;
    text-indent: -9999px;
}
#cboxPrevious.hover {
    background-position: -75px -25px;
}
#cboxNext {
    position: absolute;
    bottom: 0;
    left: 27px;
    background: url(/TenantsContent/Default/content/images/controls.png) no-repeat -50px 0;
    width: 25px;
    height: 25px;
    text-indent: -9999px;
}
#cboxNext.hover {
    background-position: -50px -25px;
}









/*.content-area-fullscreen > [class*="content-area"]:not(:first-child) {
    margin-top: 30px;
}*/





/* ---- DISPLAY AREAS : Events Container -------------------------------------- */
.panel {
    --panel-gutter-x: var(--fgs-gutter);
    --panel-gutter-x-offset: calc(var(--panel-gutter-x) * -1);
    --panel-gutter-y: calc(var(--panel-gutter-x) * 0.75);
    --panel-gutter-y-offset: calc(var(--panel-gutter-y) * -1);
    --panel-gutter-y-double: calc(var(--panel-gutter-y) * 2);
    --panel-body-bg-color: #ffffff;
    --panel-head-color: #ffffff;
    --panel-header-bg-color: var(--color-default-dark);
    --panel-border-color: var(--color-default-dark-active);
    --panel-border-width: 3px;
    --panel-header-height-offset: calc(var(--panel-gutter-y-double) + var(--panel-border-width));
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 0px;
    margin: 0px;
    background-color: transparent;
}
.panel > * {
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}
.panel .panel-header {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-inline-flex;
    display: inline-flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-line-pack: start;
    justify-content: flex-start;
    -webkit-box-align: baseline;
    -moz-box-align: baseline;
    -webkit-align-items: baseline;
    -ms-flex-item-align: baseline;
    align-items: baseline;

    width: 100%;
    padding-top: var(--panel-gutter-y);
    padding-bottom: var(--panel-gutter-y);
    padding-left: var(--panel-gutter-x);
    padding-right: var(--panel-gutter-x);
    background-color: var(--panel-header-bg-color);
}
.panel .panel-header > *:not(.btn) {
    color: var(--panel-head-color);
}

.panel .panel-header.tab-heading-group {
    padding-left: 0px;
    padding-right: 0px;
    background-color: transparent;
}
.panel .panel-header.tab-heading-group > *:not(.tab-heading, .btn) {
    margin-left: var(--panel-gutter-x);
    margin-right: var(--panel-gutter-x);
}
.panel .panel-header.tab-heading-group > .tab-heading {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-inline-flex;
    display: inline-flex;
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-line-pack: start;
    justify-content: flex-start;
    -webkit-box-align: baseline;
    -moz-box-align: baseline;
    -webkit-align-items: baseline;
    -ms-flex-item-align: baseline;
    align-items: baseline;
    align-self: stretch;
    width: auto;
    min-height: calc(var(--fgs-form-min-height) + var(--panel-header-height-offset));
    border-width: var(--panel-border-width);
    border-style: solid;
    -webkit-border-top-left-radius: 10px;
    -moz-border-radius-topleft: 10px;
    border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topright: 10px;
    border-top-right-radius: 10px;
    border-bottom: none;
    padding-top: var(--panel-gutter-y);
    padding-bottom: var(--panel-gutter-y);
    padding-left: var(--panel-gutter-x);
    padding-right: var(--panel-gutter-x);
    margin-top: var(--panel-gutter-y-offset);
    margin-bottom: var(--panel-gutter-y-offset);
    background-color: var(--panel-header-bg-color);
    border-color: var(--panel-border-color);
}
.panel .panel-body {
    border-width: var(--panel-border-width);
    border-style: solid;
    border-color: var(--panel-border-color);
    padding: var(--panel-gutter-x);
    background-color: var(--panel-body-bg-color);
}
.panel .panel-header.tab-heading-group > .tab-heading > * {
    line-height: 1;
    margin: 0px;
}


.panel.panel-primary {
    --panel-body-bg-color: #ffffff;
    --panel-head-color: #ffffff;
    --panel-header-bg-color: var(--color-client-primary);
    --panel-border-color: var(--color-client-primary-dark);
}
.panel.panel-secondary {
    --panel-body-bg-color: #ffffff;
    --panel-head-color: #ffffff;
    --panel-header-bg-color: var(--color-client-secondary);
    --panel-border-color: var(--color-client-secondary-dark);
}


.fixed-toolbar-content > .content-area {
    height: 100%;
}
.fixed-toolbar-content > .content-area > .container,
.fixed-toolbar-content > .content-area > .container > .row,
.fixed-toolbar-content > .content-area > .container > .row > [class^="col-"] {
    height: inherit;
}
#toolbar-calendar-panel.panel,
#toolbar-calendar-panel.panel .panel-body #calendar,
#toolbar-calendar-panel.panel .panel-body #calendar #default-calendar,
#toolbar-calendar-panel.panel .panel-body #calendar #default-calendar .ui-datepicker,
#toolbar-events-panel.panel,
#toolbar-events-panel.panel .panel-body #events {
    height: 100%;
}
#toolbar-events-panel.panel .panel-body #events {
    height: auto;
}
#toolbar-calendar-panel.panel .panel-body #calendar,
#toolbar-calendar-panel.panel .panel-body #alterView,
#toolbar-events-panel.panel .panel-body #events,
#toolbar-events-panel.panel .panel-body #alterEventsView {
    width: 100%;
}
#toolbar-calendar-panel.panel > .panel-body,
#toolbar-events-panel.panel > .panel-body {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -webkit-flex: 1 0 0%;
    -ms-flex: 1 0 0%;
    flex: 1 0 0%;
    overflow-y: auto;
}

.ui-datepicker-header, .tasks-filter {
    height: 55px;
}

#toolbar-calendar-panel.panel .panel-body #calendar #default-calendar .ui-datepicker {
    display: -webkit-box !important;
    display: -moz-box !important;
    display: -webkit-flex !important;
    display: -ms-flexbox !important;
    display: flex !important;
}
#toolbar-calendar-panel.panel .panel-body #calendar #default-calendar .ui-datepicker,
#toolbar-events-panel.panel .panel-body #events {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}
#toolbar-calendar-panel.panel .panel-body #calendar #default-calendar .ui-datepicker > *,
#toolbar-events-panel.panel .panel-body #events > * {
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}
#toolbar-calendar-panel.panel .panel-body #calendar #default-calendar .ui-datepicker > .ui-datepicker-calendar,
#toolbar-events-panel.panel .panel-body #events > .tasks-container {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -webkit-flex: 1 0 0%;
    -ms-flex: 1 0 0%;
    flex: 1 0 0%;
}


.hidden {
    display: none !important;
}




.event-container .event-header, .tasks-filter form, #eventFilter {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
.event-container .event-header {
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
    width: 100%;
    padding: 0px 25px 0px 0px;
}
.event-container .event-header .event-header-tab {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
    width: 65%;
    min-height: 66px;
    border-width: 3px;
    border-style: solid;
    -webkit-border-top-left-radius: 10px;
    -moz-border-radius-topleft: 10px;
    border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topright: 10px;
    border-top-right-radius: 10px;
    border-bottom: none;
    padding: 15px 25px 10px 25px;
}
.event-container .event-header .event-header-tab h4 {
    margin-right: 10px;
    margin-bottom: 0px;
}
.event-container .event-body {
    border-width: 3px;
    border-style: solid;
}
.event-container .event-body .content-area {
    padding: 25px;
}
.tasks-filter form {
    -webkit-flex-direction: row;
    flex-direction: row;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: baseline;
    align-items: baseline;
    padding-right: 25px;
}
#eventFilter {
    -webkit-flex-direction: row;
    flex-direction: row;
    padding: 0px;
    margin-bottom: 0px;
}
#eventFilter li {
    display: inherit;
}
#eventFilter li + li {
    border-left-width: 2px;
    border-left-style: solid;
}
#eventFilter li a {
    display: inherit;
    min-width: 85px;
    height: 55px;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    transition: all 0.2s ease;
}
.tasks-container {
    padding: 25px;
    margin-bottom: 0px;
}
#default-calendar .ui-datepicker-calendar, .tasks-container {
    height: 500px;
}

.event-body #alterView, .event-body #alterEventsView {
    height: 555px;
}
.event-body #alterView #Description {
    min-height: 273px;
}
.event-body #alterEventsView #Description {
    min-height: 148px;
}
#calendar .ui-datepicker .ui-state-default, #calendar .ui-datepicker.ui-widget-content .ui-state-default {
    height: calc(100% - 4px);
}

/* ---- DISPLAY AREAS : Calendar Container ------------------------------------ */
.ui-datepicker .ui-datepicker-header, .ui-datepicker .ui-datepicker-header .ui-datepicker-prev, .ui-datepicker .ui-datepicker-header .ui-datepicker-next, .ui-datepicker .ui-datepicker-title, .ui-datepicker .ui-datepicker-header .ui-datepicker-title {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
.calendar-preloader {
    float: left;
    width: 128px;
    height: 15px;
    margin-left: 40px;
    margin-top: 5px;
    background: url(/TenantsContent/Default/content/images/calendar-ajax-loader.gif) no-repeat;
}
.ui-datepicker {
    width: 100%;
    padding: 0px;
}
.ui-datepicker table {
    margin-bottom: 0px;
}
.ui-datepicker table, .ui-datepicker table tr, .ui-datepicker table tr td, .ui-datepicker table tr td a {
    border: none;
}
.ui-datepicker table th {
    font-family: Roboto, sans-serif;
    font-size: 18px;
    line-height: 24px;
    font-weight: 700;
    font-style: normal;
}
.ui-datepicker table tr td, .ui-datepicker .ui-state-default, .ui-datepicker.ui-widget-content .ui-state-default {
    font-family: Roboto, sans-serif;
    font-size: 18px;
    line-height: 24px;
    font-weight: 400;
    font-style: normal;
}
.ui-datepicker table tr td a {
    padding: 15px;
}
.ui-datepicker.ui-widget-content {
    border: none;
    background: transparent;
    color: unset;
}
.ui-datepicker .ui-state-default, .ui-datepicker.ui-widget-content .ui-state-default {
    margin: 2px;
    transition: all 0.2s ease;
}
.ui-datepicker .ui-state-default:hover, .ui-datepicker.ui-widget-content .ui-state-default:hover {
    border: none;
}
.ui-datepicker .ui-datepicker-header {
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    padding: 10px 25px;
}
.ui-datepicker .ui-datepicker-header.ui-widget-header {
    border: none;
    color: unset;
    font-weight: unset;
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-prev, .ui-datepicker .ui-datepicker-header .ui-datepicker-next {
    position: absolute;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    width: 25px;
    height: 25px;
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-prev {
    top: 13px;
    left: 25px;
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-next {
    top: 13px;
    right: 25px;
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-prev:hover, .ui-datepicker .ui-datepicker-header .ui-datepicker-next:hover {
    cursor: pointer;
    background: transparent;
    background-color: transparent;
    border: none;
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-prev span.ui-icon, .ui-datepicker .ui-datepicker-header .ui-datepicker-next span.ui-icon {
    position: initial;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top-width: 13px;
    border-top-style: solid;
    margin: 0px;
    background-image: none;
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-prev span.ui-icon {
    transform: rotate(90deg);
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-next span.ui-icon {
    transform: rotate(-90deg);
}
.ui-datepicker .ui-datepicker-title, .ui-datepicker .ui-datepicker-header .ui-datepicker-title {
    justify-self: center;
    line-height: 1;
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-title .ui-datepicker-month, .ui-datepicker .ui-datepicker-header .ui-datepicker-title .ui-datepicker-year {
    font-family: Roboto-Condensed, sans-serif;
    font-size: 24px;
    line-height: inherit;
    font-weight: 600;
    font-style: normal;
}
#ui-datepicker-div {
    width: auto;
    min-width: 250px;
}
#ui-datepicker-div.ui-datepicker.ui-widget-content {
    display: none;
    border-width: 2px;
    border-style: solid;
}
#ui-datepicker-div.ui-datepicker, #ui-datepicker-div.ui-datepicker.ui-widget-content {
    -webkit-box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.25);
}
#ui-datepicker-div.ui-datepicker .ui-datepicker-header {
    height: auto;
    padding: 5px 10px;
}
#ui-datepicker-div.ui-datepicker .ui-datepicker-header .ui-datepicker-prev span.ui-icon, #ui-datepicker-div.ui-datepicker .ui-datepicker-header .ui-datepicker-next span.ui-icon {
    border-top-width: 10px;
    border-left-width: 7px;
    border-right-width: 7px;
}
#ui-datepicker-div.ui-datepicker .ui-datepicker-header .ui-datepicker-prev {
    top: 10px;
    left: 5px;
    height: auto;
}
#ui-datepicker-div.ui-datepicker .ui-datepicker-header .ui-datepicker-next {
    top: 10px;
    right: 5px;
    height: auto;
}
#ui-datepicker-div.ui-datepicker table tr td a {
    padding: 8px;
    font-size: 12px;
    line-height: 16px;
}
#ui-datepicker-div.ui-datepicker table th {
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
}
#ui-datepicker-div.ui-datepicker .ui-datepicker-header .ui-datepicker-title .ui-datepicker-month, #ui-datepicker-div.ui-datepicker .ui-datepicker-header .ui-datepicker-title .ui-datepicker-year {
    font-size: 18px;
    line-height: 20px;
}
#ui-datepicker-div.ui-datepicker .ui-state-default, #ui-datepicker-div.ui-datepicker .ui-widget-content .ui-state-default {
    margin: 1px;
}
#ui-datepicker-div.ui-datepicker .ui-timepicker-div {
    padding: 0px 10px;
    margin-bottom: 18px;
}
#ui-datepicker-div.ui-datepicker .ui-timepicker-div dl {
    margin-bottom: 0px;
}
#ui-datepicker-div.ui-datepicker .ui-timepicker-div dl dt, #ui-datepicker-div.ui-datepicker .ui-timepicker-div dl dd {
    font-size: 12px;
    line-height: 16px;
}
#ui-datepicker-div.ui-datepicker .ui-timepicker-div dl dt {
    height: 22px;
    margin-top: 12px;
}
#ui-datepicker-div.ui-datepicker .ui-timepicker-div dl dd {
    top: 0px;
    margin: -18px 10px 0px 65px;
}
#ui-datepicker-div.ui-datepicker .ui-timepicker-div dl dd.ui_tpicker_time {
    position: relative;
    top: -4px;
}
#ui-datepicker-div.ui-datepicker .ui-timepicker-div .ui-slider-horizontal {
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}
#ui-datepicker-div.ui-datepicker .ui-timepicker-div .ui-slider-horizontal .ui-slider-handle {
    top: -8px;
}
#ui-datepicker-div.ui-datepicker .ui-timepicker-div .ui-slider-horizontal .ui-slider-handle.ui-state-default {
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}
#ui-datepicker-div.ui-datepicker .ui-datepicker-buttonpane {
    min-height: 36px;
    padding: 6px;
}

/* ---- DISPLAY AREAS : Tasks Container --------------------------------------- */
.task-item {
    border-bottom-width: 1px;
    border-bottom-style: dashed;
    padding: 15px 0px;
}
.task-item:first-of-type {
    padding: 0px 0px 15px 0px;
}
.task-item:last-of-type {
    border-bottom: none;
    padding: 15px 0px 0px 0px;
}
.task-item a.task-edit {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: -webkit-flex;
    display: inline-flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    width: 100%;
}
.task-item a.task-edit.completed {
    text-decoration: line-through;
}
.task-item a.task-edit input.check-lg {
    min-width: 20px;
    min-height: 20px;
    margin-top: 2px;
    margin-right: 10px;
}
.task-item p.task-date {
    font-size: 14px;
}
.task-item a.task-delete i {
    margin-top: 5px;
    margin-right: 0px;
}

/* ---- DISPLAY AREAS : Pagination -------------------------------------------- */
/* ============================================================================ */
/*      PAGINATION                                                              */
/* ============================================================================ */
.pagination-container {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    width: 100%;
}
.pagination-container > .pagination {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -moz-box-align: center;
    -webkit-align-items: center;
    -ms-flex-item-align: center;
    align-items: center;
    width: 100%;
    margin-bottom: 0px;
}
.pagination-container > .pagination > .totals,
.pagination-container > #transactions-show-number .form-group {
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}
.pagination-container > #transactions-show-number .form-group > label,
.pagination-container > #transactions-show-number .form-group > select {
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    -ms-flex: 0 0 auto;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    width: auto;
    min-width: unset;
}

.pagination-container > .pagination > ul {
    display: inherit;
    list-style: none;
    margin: 0px auto;
    padding: 0px;
    width: auto;
}
.pagination-container > .pagination > ul > li {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    margin: 0px 2.5px;
    padding: 9px 8px 8px 8px;
    cursor: pointer;
    transition: box-shadow 0.25s ease-in;
}
.pagination-container > .pagination > ul > li.active, .pagination-container > .pagination > ul > li.disabled {
    cursor: default;
}
.pagination-container > .pagination > ul > li > *, .pagination-container > .pagination > ul > li > * > * {
    margin: 0px;
    cursor: inherit;
}
.pagination-container > .pagination > ul > li[data-type='prev'] {
    margin-right: 15px;
}
.pagination-container > .pagination > ul > li[data-type='next'] {
    margin-left: 15px;
}
.pagination-container > .pagination > ul > li > * {
    transition: color 0.25s ease-in;
}

.pagination-container > .pagination > .totals {
    font-size: var(--fgs-font-size-pagination-text);
}


/* ============================================================================ */
/*      TOOL-TIPS                                                               */
/* ============================================================================ */
.joyride-tip-guide {
    position: absolute;
    background: #000000;
    background: rgba(0, 0, 0, 0.8);
    padding: 15px;
    color: #fff;
    width: 350px;
    z-index: 10;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    border-radius: 15px;
}
.joyride-tip-guide span.joyride-nub {
    display: block;
    position: absolute;
    left: 22px;
    width: 0;
    height: 0;
    border: solid 14px;
    border: solid 14px;
}
.joyride-tip-guide span.joyride-nub.top {
    border-top-color: transparent !important;
    border-left-color: transparent !important;
    border-right-color: transparent !important;
    border-bottom-color: #000;
    border-bottom-color: rgba(0, 0, 0, 0.8);
    top: -28px;
    bottom: none;
}
.joyride-tip-guide span.joyride-nub.bottom {
    border-bottom-color: transparent !important;
    border-left-color: transparent !important;
    border-right-color: transparent !important;
    border-top-color: #000;
    border-top-color: rgba(0, 0, 0, 0.8) !important;
    bottom: -28px;
    bottom: none;
}
.joyride-tip-guide h1, .joyride-tip-guide h2, .joyride-tip-guide h3, .joyride-tip-guide h4, .joyride-tip-guide h5, .joyride-tip-guide h6 {
    line-height: 1;
    margin: 0px 0px 5px 0px;
    font-weight: bold;
    color: #fff;
}
.joyride-tip-guide .joyride-next-tip:after {
    clear: both;
}
.joyride-tip-guide .joyride-next-tip {
    width: auto;
    padding: 6px 18px 4px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    float: left;
    margin: 0 6px 0px 0px;
    border: solid 1px #666;
    text-shadow: none;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
.joyride-tip-guide h1 {
    font-size: 30px;
}
.joyride-tip-guide h2 {
    font-size: 26px;
}
.joyride-tip-guide h3 {
    font-size: 22px;
}
.joyride-tip-guide h4 {
    font-size: 18px;
}
.joyride-tip-guide h5 {
    font-size: 16px;
}
.joyride-tip-guide h6 {
    font-size: 14px;
}
.joyride-tip-guide p {
    margin: 0 0 15px 0;
    font-size: 16px;
    line-height: 20px;
    color: #fff;
}
.joyride-tip-guide a {
    color: white;
    text-decoration: none;
    border-bottom: dotted 1px rgba(255, 255, 255, 0.6);
}
.joyride-tip-guide a:hover {
    color: rgba(255, 255, 255, 0.8);
    border-bottom: none;
}
.joyride-next-tip:hover {
    color: #ffffff !important;
    border: solid 1px #666 !important;
}
.joyride-timer-indicator-wrap {
    width: 50px;
    height: 3px;
    border: solid 1px rgba(255, 255, 255, 0.1);
    position: absolute;
    right: 17px;
    bottom: 16px;
}
.joyride-timer-indicator {
    display: block;
    width: 0;
    height: inherit;
    background: rgba(255, 255, 255, 0.25);
}
.joyride-close-tip {
    position: absolute;
    right: 15px;
    top: 15px;
    color: rgba(255, 255, 255, 0.4) !important;
    text-decoration: none;
    line-height: 1;
    font-weight: bold;
    border-bottom: none !important;
}
.joyride-close-tip:hover {
    color: rgba(255, 255, 255, 0.9) !important;
}


/* ============================================================================ */
/*      PAGE SPECIFIC STYLING                                                   */
/* ============================================================================ */
/* ---- PAGE SPECIFIC STYLING : Introduction & About Us ----------------------- */
#introduction-content {
    padding-left: 50px;
}
#introduction-content .row p {
    margin-bottom: 15px;
}
#introduction-content .row p:last-of-type {
    margin-bottom: 0px;
}
#introduction-content ol, #introduction-content ul {
    margin: 0px 0px 15px 50px;
}

.body-content-heading {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    width: calc(100% + 25px);
    margin: 0px 0px 0px -25px;
}
.body-content-heading > *:not(script, style) {
    display: inherit;
    -webkit-flex: initial;
    flex: initial;
    margin: 0px 0px 15px 25px;
}
.body-content-heading h1 {
    -webkit-align-items: baseline;
    align-items: baseline;
}

/* ============================================================================ */
/*      HELPER CLASSES                                                          */
/* ============================================================================ */
/* ---- HELPER CLASSES : General Formatting ----------------------------------- */
.text-right { text-align: right; }
.pull-left { float: left; }
.pull-right { float: right; }
/* ---- HELPER CLASSES : Flex Formatting -------------------------------------- */
.flex-row-center, .flex-row-spaced-center, .flex-row-spaced-baseline, .flex-row-spaced-top, .flex-align-left, .flex-align-right, .flex-col-center, .inline-content { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; }
.flex-row-center, .flex-row-spaced-center, .flex-row-spaced-baseline, .flex-row-spaced-top, .inline-content { -webkit-flex-direction: row; flex-direction: row; }
.flex-row-center { -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; }
.flex-row-spaced-center { -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; align-items: center; }
.flex-row-spaced-baseline { -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: baseline; align-items: baseline; }
.flex-row-spaced-top { -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: flex-end; align-items: flex-end; }
.flex-align-left { -webkit-align-items: flex-start; align-items: flex-start; }
.flex-align-right { -webkit-align-items: flex-end; align-items: flex-end; }
.flex-col-center { -webkit-flex-direction: column; flex-direction: column; -webkit-justify-content: center; justify-content: center; -webkit-align-items: flex-start; align-items: flex-start; }
.inline-content { -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: center; align-items: center; width: 100%; }
.inline-content > * { display: inherit; -webkit-flex: initial; flex: initial; }
.inline-content > h1 { -webkit-align-items: baseline; align-items: baseline; }
/* ---- HELPER CLASSES : Spacing & Padding ------------------------------------ */
.no-padding { padding: 0px !important; }
.no-padding-l { padding-left: 0px !important; }
.no-padding-t { padding-top: 0px !important; }
.padding-sm { padding: 25px !important; }
.padding-sm-l { padding-left: 25px !important; }
.padding-sm-lr { padding-left: 25px !important; padding-right: 25px !important; }
.padding-md-tb { padding-top: 50px !important; padding-bottom: 50px !important; }
.no-margin { margin: 0px !important; }
.no-margin-b { margin-bottom: 0px !important; }
.margin-xs-b { margin-bottom: 15px !important; }
.margin-xxs-b { margin-bottom: 5px !important; }
.margin-xs-r { margin-right: 15px !important; }
.margin-sm-b { margin-bottom: 25px !important; }
.margin-md-r { margin-right: 50px !important; }
.margin-md-b { margin-bottom: 50px !important; }

/* ============================================================================ */
/*      BRANDING / COLORING                                                     */
/* ============================================================================ */




/* GENERAL COLORS ------------------------------------------------------------- */
.color-white { color: #ffffff !important; }
.color-default-dark { color: var(--color-default-dark) !important; }
.color-default-light { color: var(--color-default-light-inactive) !important; }
.color-red, .red { color: var(--color-default-red) !important; }
.color-gray { color: var(--color-default-gray) !important; }

/* BACKGROUND COLORS ---------------------------------------------------------- */
.background-white, .background-default-dark, .background-default-light { background: transparent; }
.background-white { background-color: #ffffff !important; }
.background-default-dark { background-color: var(--color-default-dark) !important; }
.background-default-light { background-color: var(--color-default-light-inactive) !important; }
#corporate-body { background-color: #ffffff; }

#result-body { background-color: var(--color-default-light-inactive); }

/* BUTTON & LINK COLORS ------------------------------------------------------- */
/*a:not(.btn, .navbar-brand, .nav-item, [class^="ui-"]):hover,
a:not(.btn, .navbar-brand, .nav-item, [class^="ui-"]):focus,
a:not(.btn, .navbar-brand, .nav-item, [class^="ui-"]):active,
a:not(.btn, .navbar-brand, .nav-item, [class^="ui-"]):hover > i,
a:not(.btn, .navbar-brand, .nav-item, [class^="ui-"]):focus > i,
a:not(.btn, .navbar-brand, .nav-item, [class^="ui-"]):active > i {
    filter: brightness(0.80) !important;
}*/

/*a.navbar-brand:hover {
    background-color: unset !important;
    background: unset !important;
}*/

/*.btn-primary, .btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-primary-outline, .btn-primary-outline:hover, .btn-primary-outline:focus, .btn-primary-outline:active,
.btn-default, .btn-default:hover, .btn-default:focus, .btn-default:active,
.btn-default-outline, .btn-default-outline:hover, .btn-default-outline:focus, .btn-default-outline,
.btn-delete, .btn-delete:hover, .btn-delete:focus, .btn-delete:active,
.btn-delete-outline, .btn-delete-outline:hover, .btn-delete-outline:active {
    border: none;
    background-color: transparent;
}*/

/*.btn-default, .btn-default:hover, .btn-default:focus, .btn-default:active {
    color: #ffffff;
    background-color: var(--color-default-dark);
}
.btn-default:hover, .btn-default:focus, .btn-default:active {
    color: #ffffff;
    -webkit-box-shadow: inset 0px 0px 0px 20px var(--color-default-dark-active);
    -moz-box-shadow: inset 0px 0px 0px 20px var(--color-default-dark-active);
    box-shadow: inset 0px 0px 0px 20px var(--color-default-dark-active);
}*/

/*.btn-default-outline {
    color: var(--color-default-dark);
    -webkit-box-shadow: inset 0px 0px 0px 3px var(--color-default-dark);
    -moz-box-shadow: inset 0px 0px 0px 3px var(--color-default-dark);
    box-shadow: inset 0px 0px 0px 3px var(--color-default-dark);
}
.btn-default-outline.btn-small {
    -webkit-box-shadow: inset 0px 0px 0px 1.5px var(--color-default-dark);
    -moz-box-shadow: inset 0px 0px 0px 1.5px var(--color-default-dark);
    box-shadow: inset 0px 0px 0px 1.5px var(--color-default-dark);
}
.btn-default-outline:hover, .btn-default-outline:focus, .btn-default-outline:active {
    color: #ffffff;
    -webkit-box-shadow: inset 0px 0px 0px 3px var(--color-default-dark), inset 0px 0px 25px 25px var(--color-default-dark-inactive);
    -moz-box-shadow: inset 0px 0px 0px 3px var(--color-default-dark), inset 0px 0px 25px 25px var(--color-default-dark-inactive);
    box-shadow: inset 0px 0px 0px 3px var(--color-default-dark), inset 0px 0px 25px 25px var(--color-default-dark-inactive);
}
.btn-default-outline.btn-small:hover, .btn-default-outline.btn-small:focus, .btn-default-outline.btn-small:active {
    -webkit-box-shadow: inset 0px 0px 0px 1.5px var(--color-default-dark), inset 0px 0px 25px 25px var(--color-default-dark-inactive);
    -moz-box-shadow: inset 0px 0px 0px 1.5px var(--color-default-dark), inset 0px 0px 25px 25px var(--color-default-dark-inactive);
    box-shadow: inset 0px 0px 0px 1.5px var(--color-default-dark), inset 0px 0px 25px 25px var(--color-default-dark-inactive);
}
ul.refine-filter li a.btn-default-outline.selected, ul.refine-filter li a.btn-default-outline:focus {
    color: #ffffff;
    -webkit-box-shadow: inset 0px 0px 0px 1.5px var(--color-default-dark), inset 0px 0px 25px 25px var(--color-default-dark);
    -moz-box-shadow: inset 0px 0px 0px 1.5px var(--color-default-dark), inset 0px 0px 25px 25px var(--color-default-dark);
    box-shadow: inset 0px 0px 0px 1.5px var(--color-default-dark), inset 0px 0px 25px 25px var(--color-default-dark);
    filter: unset !important;
}*/

/*.btn-delete, .btn-delete:hover, .btn-delete:focus, .btn-delete:active {
    color: #ffffff;
    background-color: var(--color-default-red);
}
.btn-delete:hover, .btn-delete:focus, .btn-delete:active {
    color: #ffffff;
    -webkit-box-shadow: inset 0px 0px 0px 20px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: inset 0px 0px 0px 20px rgba(0, 0, 0, 0.15);
    box-shadow: inset 0px 0px 0px 20px rgba(0, 0, 0, 0.15);
}*/

/*.btn-delete-outline {
    color: var(--color-default-red);
    -webkit-box-shadow: inset 0px 0px 0px 3px var(--color-default-red);
    -moz-box-shadow: inset 0px 0px 0px 3px var(--color-default-red);
    box-shadow: inset 0px 0px 0px 3px var(--color-default-red);
}
.btn-delete-outline:hover, .btn-delete-outline:focus, .btn-delete-outline:active {
    color: #ffffff;
    -webkit-box-shadow: inset 0px 0px 0px 3px var(--color-default-red), inset 0px 0px 25px 25px var(--color-default-red-light);
    -moz-box-shadow: inset 0px 0px 0px 3px var(--color-default-red), inset 0px 0px 25px 25px var(--color-default-red-light);
    box-shadow: inset 0px 0px 0px 3px var(--color-default-red), inset 0px 0px 25px 25px var(--color-default-red-light);
}
.btn-delete-outline.btn-small {
    -webkit-box-shadow: inset 0px 0px 0px 1.5px var(--color-default-red);
    -moz-box-shadow: inset 0px 0px 0px 1.5px var(--color-default-red);
    box-shadow: inset 0px 0px 0px 1.5px var(--color-default-red);
}
.btn-delete-outline.btn-small:hover, .btn-delete-outline.btn-small:focus, .btn-delete-outline.btn-small:active {
    -webkit-box-shadow: inset 0px 0px 0px 1.5px var(--color-default-red), inset 0px 0px 25px 25px var(--color-default-red-light);
    -moz-box-shadow: inset 0px 0px 0px 1.5px var(--color-default-red), inset 0px 0px 25px 25px var(--color-default-red-light);
    box-shadow: inset 0px 0px 0px 1.5px var(--color-default-red), inset 0px 0px 25px 25px var(--color-default-red-light);
}*/

.link-default, .link-default:hover, .link-default:focus, .link-default:active {
    color: var(--color-default-dark) !important;
}
.link-default.color-gray, .link-default.color-gray:hover, .link-default.color-gray:focus, .link-default.color-gray:active {
    color: var(--color-default-gray) !important;
}
.link-remove, .link-remove:hover, .link-remove:focus, .link-remove:active {
    color:var(--color-default-red) !important;
}

/* ICON COLORS ---------------------------------------------------------------- */
.btn > .bi { color: inherit; }
*:not(.btn-delete, .btn-delete-outline) > .bi-trash { color: var(--color-default-red); }

/* FONT COLORS ---------------------------------------------------------------- */
body, p { color: var(--color-default-dark); }
.background-default-dark h1, .background-default-dark h2, .background-default-dark h3, .background-default-dark h4, .background-default-dark p, .background-default-dark p a, .background-default-dark label, .background-default-dark .label {
    color: var(--color-default-light);
}
.background-default-light h1,
.background-default-light h2,
.background-default-light h3,
.background-default-light h4,
.background-default-light p {
    color: var(--color-default-dark);
}
.color-secondary {
    color: var(--color-client-secondary) !important;
}

/* FORM COLORS ---------------------------------------------------------------- */
input, input.ui-widget-content, select, select.ui-widget-content, textarea, textarea.ui-widget-content, .checkbox-container .checkmark, .radio-container .radiomark {
    color: var(--color-default-dark);
    border-color: var(--color-default-gray);
    background-color: var(--color-default-light-inactive);
    background: var(--color-default-light-inactive);
}
.content-box input,
.content-box textarea,
.content-box select {
    background-color: #ffffff;
    background: #ffffff;
}
.checkbox-container .checkmark, .radio-container .radiomark {
    border-color: var(--color-client-primary);
    -webkit-box-shadow: inset 0px 0px 0px 3px var(--color-default-light-inactive);
    -moz-box-shadow: inset 0px 0px 0px 3px var(--color-default-light-inactive);
    box-shadow: inset 0px 0px 0px 2px var(--color-default-light-inactive);
}
.checkbox-container input:checked ~ .checkmark, .radio-container input:checked ~ .radiomark {
    background-color: var(--color-client-primary);
}
.remember-category-checkbox {
    color: var(--color-client-primary);
}
#menu button, #menu button.ui-state-default {
    background: transparent;
    background-color: var(--color-default-dark);
    border: none;
    color: #ffffff;
}
#menu button:hover, #menu button.ui-state-default.ui-state-hover {
    -webkit-box-shadow: inset 0px 0px 10px 20px rgba(0, 0, 0, 0.10);
    -moz-box-shadow: inset 0px 0px 10px 20px rgba(0, 0, 0, 0.10);
    box-shadow: inset 0px 0px 10px 20px rgba(0, 0, 0, 0.10);
}
.background-default-dark input, .background-default-dark select, .background-default-dark textarea, .background-default-dark label input, .background-default-dark label select, .background-default-dark label textarea {
    background: transparent;
    color: var(--color-default-dark);
    border-color: var(--color-default-dark);
    background-color: var(--color-default-light-inactive);
}
.background-default-light input, .background-default-light textarea, .background-default-light label input, .background-default-light label textarea {
    background: transparent;
    color: var(--color-default-dark);
    border-color: var(--color-default-dark-active);
    background-color: var(--color-default-light-inactive);
}
.background-default-light select, .background-default-light label select {
    background: transparent;
    color: var(--color-default-light);
    border-color: var(--color-default-dark-active);
    background-color: var(--color-default-dark);
}
.background-default-light select option, .background-default-light label select option {
    background: transparent;
    color: var(--color-default-light);
    background-color: var(--color-default-dark-inactive);
}

/* ============================================================================ */
/*      BRANDING / COLORING (CLIENT)                                            */
/* ============================================================================ */

/* GENERAL COLORS ------------------------------------------------------------- */
.color-primary { color: var(--color-client-primary); }

/* BACKGROUND COLORS ---------------------------------------------------------- */
.background-primary {
    background-color: var(--color-client-primary);
}
.background-secondary {
    background-color: var(--color-client-secondary);
}

/* BUTTON & LINK COLORS ------------------------------------------------------- */
/*.btn-primary, .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    color: #ffffff;
    background-color: var(--color-client-primary);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    color: #ffffff;
    -webkit-box-shadow: inset 0px 0px 0px 20px var(--color-client-primary-dark);
    -moz-box-shadow: inset 0px 0px 0px 20px var(--color-client-primary-dark);
    box-shadow: inset 0px 0px 0px 20px var(--color-client-primary-dark);
}*/

/*.btn-primary-outline {
    color: var(--color-client-primary);
    -webkit-box-shadow: inset 0px 0px 0px 3px var(--color-client-primary);
    -moz-box-shadow: inset 0px 0px 0px 3px var(--color-client-primary);
    box-shadow: inset 0px 0px 0px 3px var(--color-client-primary);
}
.btn-primary-outline.btn-small {
    -webkit-box-shadow: inset 0px 0px 0px 1.5px var(--color-client-primary);
    -moz-box-shadow: inset 0px 0px 0px 1.5px var(--color-client-primary);
    box-shadow: inset 0px 0px 0px 1.5px var(--color-client-primary);
}
.btn-primary-outline:hover, .btn-primary-outline:focus, .btn-primary-outline:active {
    color: #ffffff;
    -webkit-box-shadow: inset 0px 0px 0px 3px var(--color-client-primary), inset 0px 0px 25px 25px var(--color-client-primary-light);
    -moz-box-shadow: inset 0px 0px 0px 3px var(--color-client-primary), inset 0px 0px 25px 25px var(--color-client-primary-light);
    box-shadow: inset 0px 0px 0px 3px var(--color-client-primary), inset 0px 0px 25px 25px var(--color-client-primary-light);
}
.btn-primary-outline.btn-small:hover, .btn-primary-outline.btn-small:focus, .btn-primary-outline.btn-small:active {
    -webkit-box-shadow: inset 0px 0px 0px 1.5px var(--color-client-primary), inset 0px 0px 25px 25px var(--color-client-primary-light);
    -moz-box-shadow: inset 0px 0px 0px 1.5px var(--color-client-primary), inset 0px 0px 25px 25px var(--color-client-primary-light);
    box-shadow: inset 0px 0px 0px 1.5px var(--color-client-primary), inset 0px 0px 25px 25px var(--color-client-primary-light);
}*/

.link-primary, .link-primary:hover, .link-primary:focus, .link-primary:active {
    color: var(--color-client-primary) !important;
}
.joyride-tip-guide .joyride-next-tip {
    color: var(--color-default-dark);
    background: var(--color-default-yellow);
}
#default-header .header-group .header-group-inner .header-link {
    color: var(--color-client-primary);
}

/* FONT COLORS ---------------------------------------------------------------- */
h1 a, h1 a:hover, h1 a:focus, h1 a:active, h2 a, h2 a:hover, h2 a:focus, h2 a:active, h3 a, h3 a:hover, h3 a:focus, h3 a:active, h4 a, h4 a:hover, h4 a:focus, h4 a:active, p a, p a:hover, p a:focus, p a:active, span a, span a:hover, span a:focus, span a:active {
    color: var(--color-client-primary);
}
.tab-header > h4 > a {
    color: inherit;
}
a:hover, a:focus, a:active {
    color: inherit;
}
.background-primary h1, .background-primary h2, .background-primary h3, .background-primary h4, .background-primary p, .background-primary label, .background-primary .label {
    color: #ffffff;
}

/* ============================================================================ */
/*      COLORING OF WEB ELEMENTS                                                */
/* ============================================================================ */
/* ---- COLORING : Main Layout ------------------------------------------------ */

.navbar .navbar-collapse .navbar-nav li.nav-item a.nav-link {
    color: var(--color-default-gray);
}
.navbar .navbar-collapse .navbar-nav li.nav-item a.nav-link:hover {
    color: var(--color-client-primary);
}
.navbar .navbar-collapse .navbar-nav li.nav-item a.nav-link:not(.active):hover {
    filter: none !important;
}
.navbar .navbar-collapse .navbar-nav li.nav-item a.nav-link.active {
    color: var(--color-client-primary);
}
.background-default-dark .footer-group .footer-title, .background-default-dark .footer-group .footer-title a {
    color: var(--color-client-primary);
}
.background-default-dark .footer-group .footer-link a {
    color: var(--color-default-light);
}

.footer-container {
    background-color: var(--color-default-dark);
}

/* ---- COLORING : Default Layout --------------------------------------------- */
#default-header.dash-header {
    background-color: #ffffff;
    border-bottom-color: var(--color-default-light);
}
#default-header .header-group .header-group-inner .header-link {
    color: var(--color-client-primary);
}


/* ---- COLORING : Tables ----------------------------------------------------- */
table tbody tr td a {
    color: var(--color-client-primary);
}
table thead tr:hover, table tbody tr:hover {
    background-color: initial;
}
#editableTable tbody tr:not(.no-transaction-data):hover, table tbody tr._entrySelector:hover {
    background-color: var(--color-client-primary-opaque);
}

/* ---- COLORING : Tab Content Boxes ------------------------------------------ */
.tab-container.default-dark, table.tab-container.default-dark {
    border-color: var(--color-default-dark);
}
#completed-goals .tab-container {
    border-color: var(--color-default-green);
}
#completed-goals .tab-container .tab-header {
    background-color: var(--color-default-green);
}
.tab-container.default-dark .tab-header, table.tab-container.default-dark thead, table.tab-container.default-dark tbody tr.thead-row td {
    background-color: var(--color-default-dark);
    color: var(--color-default-light);
}
.tab-container.default-dark .tab-header h4, table.tab-container.default-dark thead tr th, table.tab-container.default-dark thead tr th a, table.tab-container.default-dark tbody tr.thead-row td {
    color: #ffffff;
}
.tab-container.tab-primary, table.tab-container.tab-primary {
    border-color: var(--color-client-primary);
}
.tab-container.tab-primary .tab-header, table.tab-container.tab-primary .tab-header {
    background-color: var(--color-client-primary);
    color: var(--color-default-light);
}
.tab-container.tab-primary .tab-header h4, table.tab-container.tab-primary thead tr th, table.tab-container.tab-primary thead tr th a {
    color: #ffffff;
}

/* ---- COLORING : Accordions ------------------------------------------------- */
.accordion-container.default-dark {
    border-color: var(--color-default-dark-inactive);
}
.accordion-container.default-dark.active {
    border-color: var(--color-default-dark);
}
.accordion-container.default-none,
.accordion-container.default-none.active {
    border: none;
}
.accordion-container.default-dark .accordion-button {
    background-color: var(--color-default-dark-inactive);
    color: var(--color-default-light);
}
.accordion-container.default-dark .accordion-button.visible {
    background-color: var(--color-default-dark);
}
.accordion-container.default-none .accordion-button {
    background-color: transparent;
    color: var(--color-client-primary);
}
.accordion-container.default-none .accordion-button.visible {
    background-color: var(--color-default-light-inactive);
}
.accordion-container.default-dark .accordion-button::after {
    border-top-color: var(--color-default-light);
}
.accordion-container.default-dark .accordion-button .accordion-header {
    color: #ffffff;
}
.accordion-container .accordion-body {
    background-color: #ffffff;
}
.accordion-container.default-none .accordion-body {
    background-color: var(--color-default-light-inactive);
}

/* ---- COLORING : Selection Box ---------------------------------------------- */
.content-box {
    background-color: var(--color-default-light-inactive);
}
.content-box .content-box-inner {
    background-color: #ffffff;
}
.goal-link .selection-box {
    background-color: var(--color-default-light);
}
.goals div:nth-child(1) .goal-link .selection-box {
    background-color: var(--color-default-dark);
}
.goals div:nth-child(2) .goal-link .selection-box {
    background-color: var(--color-default-blue);
}
.goals div:nth-child(3) .goal-link .selection-box {
    background-color: var(--color-default-green);
}
.goals div:nth-child(4) .goal-link .selection-box {
    background-color: var(--color-default-yellow);
}
.goals div:nth-child(5) .goal-link .selection-box {
    background-color: var(--color-default-orange);
}
.goals div:nth-child(6) .goal-link .selection-box {
    background-color: var(--color-default-red);
}
.goals div:nth-child(7) .goal-link .selection-box {
    background-color: var(--color-default-purple);
}
.goals div:nth-child(8) .goal-link .selection-box {
    background-color: #ffffff;
    -webkit-box-shadow: inset 0px 0px 0px 4px var(--color-default-dark);
    -moz-box-shadow: inset 0px 0px 0px 4px var(--color-default-dark);
    box-shadow: inset 0px 0px 0px 4px var(--color-default-dark);
}
.goals div:nth-child(1) .goal-link .selection-box p, .goals div:nth-child(2) .goal-link .selection-box p, .goals div:nth-child(3) .goal-link .selection-box p, .goals div:nth-child(4) .goal-link .selection-box p, .goals div:nth-child(5) .goal-link .selection-box p, .goals div:nth-child(6) .goal-link .selection-box p, .goals div:nth-child(7) .goal-link .selection-box p {
    color: #ffffff;
}
.goals div:nth-child(8) .goal-link .selection-box p {
    color: var(--color-default-dark);
}
.goal-link:hover > .selection-box {
    filter: brightness(0.90);
}
.selection-button .selection-box p {
    text-align: center;
    margin-bottom: 0px;
}
/*.goal-image-container {*/
.crop-image-container .default-image-wrapper {
    border-color: var(--color-default-dark);
    background-color: var(--color-default-light);
}
.selection-button .selection-box {
    background-color: var(--color-default-light);
}
.selection-button:hover > .selection-box {
    filter: brightness(0.90);
}

/* ---- COLORING : Progress Bars ---------------------------------------------- */
.progress-bar-container .progress-bar {
    border-color: var(--color-default-light);
    background-color: var(--color-default-light-inactive);
}
.progress-bar-container.default-light .progress-bar {
    background-color: var(--color-default-light-inactive);
}
.progress-bar-container .progress-bar .progress-bar-color.green-bar {
    background: url(/TenantsContent/Default/content/images/budget-bar-green.png) no-repeat left center;
}
.progress-bar-container .progress-bar .progress-bar-color.yellow-bar {
    background: url(/TenantsContent/Default/content/images/budget-bar-orange.png) no-repeat left center;
}
.progress-bar-container .progress-bar .progress-bar-color.red-bar {
    background: url(/TenantsContent/Default/content/images/budget-bar-red.png) repeat-x left center;
}
.progress-slider-container .progress-slider {
    background: var(--color-default-dark-inactive);
    background: -moz-linear-gradient(left, var(--color-default-dark-inactive) 0%, var(--color-default-dark) 50%, var(--color-default-dark-active) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, var(--color-default-dark-inactive)), color-stop(50%, var(--color-default-dark)), color-stop(100%, var(--color-default-dark-active)));
    background: -webkit-linear-gradient(left, var(--color-default-dark-inactive) 0%, var(--color-default-dark) 50%, var(--color-default-dark-active) 100%);
    background: -o-linear-gradient(left, var(--color-default-dark-inactive) 0%, var(--color-default-dark) 50%, var(--color-default-dark-active) 100%);
    background: -ms-linear-gradient(left, var(--color-default-dark-inactive) 0%, var(--color-default-dark) 50%, var(--color-default-dark-active) 100%);
    filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorstr='#8d97a1', endColorstr='#3c444d');
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#8d97a1', endColorstr='#3c444d')";
    background: linear-gradient(90deg, var(--color-default-dark-inactive) 0%, var(--color-default-dark) 50%, var(--color-default-dark-active) 100%);
}
.progress-slider-container .progress-slider.vertical {
    background: var(--color-default-dark-inactive);
    background: -moz-linear-gradient(top, var(--color-default-dark-inactive) 0%, var(--color-default-dark) 50%, var(--color-default-dark-active) 100%);
    background: -webkit-gradient(linear, top left, top right, color-stop(0%, var(--color-default-dark-inactive)), color-stop(50%, var(--color-default-dark)), color-stop(100%, var(--color-default-dark-active)));
    background: -webkit-linear-gradient(top, var(--color-default-dark-inactive) 0%, var(--color-default-dark) 50%, var(--color-default-dark-active) 100%);
    background: -o-linear-gradient(top, var(--color-default-dark-inactive) 0%, var(--color-default-dark) 50%, var(--color-default-dark-active) 100%);
    background: -ms-linear-gradient(top, var(--color-default-dark-inactive) 0%, var(--color-default-dark) 50%, var(--color-default-dark-active) 100%);
    filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorstr='#8d97a1', endColorstr='#3c444d');
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#8d97a1', endColorstr='#3c444d')";
    background: linear-gradient(180deg, var(--color-default-dark-inactive) 0%, var(--color-default-dark) 50%, var(--color-default-dark-active) 100%);
}
.progress-slider-container .progress-slider .slider-val,
.progress-slider-container ul li > strong {
    color: var(--color-client-primary);
}
table.childContainer tbody tr td {
    border-bottom-color: var(--color-default-dark);
}
.childContainer {
    background-color: var(--color-default-light-inactive);
}
.progress-bar-color.green-bar, .pct-bar-color.green-bar {
    background: #a0d43f;
    background: -moz-linear-gradient(top, #c9e792 0%, #a0d43f 50%, #95cc2e 51%, #c9e792 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #c9e792), color-stop(50%, #a0d43f), color-stop(51%, #95cc2e), color-stop(100%, #c9e792));
    background: -webkit-linear-gradient(top, #c9e792 0%, #a0d43f 50%, #95cc2e 51%, #c9e792 100%);
    background: -o-linear-gradient(top, #c9e792 0%, #a0d43f 50%, #95cc2e 51%, #c9e792 100%);
    background: -ms-linear-gradient(top, #c9e792 0%, #a0d43f 50%, #95cc2e 51%, #c9e792 100%);
    filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorstr='#b5dd69', endColorstr='#85b729');
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#b5dd69', endColorstr='#85b729')";
    background: linear-gradient(top, #c9e792 0%, #a0d43f 50%, #95cc2e 51%, #c9e792 100%);
    border: none;
}
.progress-bar-color.yellow-bar, .pct-bar-color.yellow-bar {
    background: #f8ce0a;
    background: -moz-linear-gradient(top, #fbe26d 0%, #f8ce0a 50%, #e2bb06 51%, #fbe26d 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fbe26d), color-stop(50%, #f8ce0a), color-stop(51%, #e2bb06), color-stop(100%, #fbe26d));
    background: -webkit-linear-gradient(top, #fbe26d 0%, #f8ce0a 50%, #e2bb06 51%, #fbe26d 100%);
    background: -o-linear-gradient(top, #fbe26d 0%, #f8ce0a 50%, #e2bb06 51%, #fbe26d 100%);
    background: -ms-linear-gradient(top, #fbe26d 0%, #f8ce0a 50%, #e2bb06 51%, #fbe26d 100%);
    filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorstr='#f9d83c', endColorstr='#c9a706');
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9d83c', endColorstr='#c9a706')";
    background: linear-gradient(top, #fbe26d 0%, #f8ce0a 50%, #e2bb06 51%, #fbe26d 100%);
    border: none;
}
.progress-bar-color.red-bar, .pct-bar-color.red-bar {
    background: #f91c1c;
    background: -moz-linear-gradient(top, #fc7f7f 0%, #f91c1c 50%, #f50606 51%, #fc7f7f 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fc7f7f), color-stop(50%, #f91c1c), color-stop(51%, #f50606), color-stop(100%, #fc7f7f));
    background: -webkit-linear-gradient(top, #fc7f7f 0%, #f91c1c 50%, #f50606 51%, #fc7f7f 100%);
    background: -o-linear-gradient(top, #fc7f7f 0%, #f91c1c 50%, #f50606 51%, #fc7f7f 100%);
    background: -ms-linear-gradient(top, #fc7f7f 0%, #f91c1c 50%, #f50606 51%, #fc7f7f 100%);
    filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorstr='#fa4e4e', endColorstr='#dc0606');
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#fa4e4e', endColorstr='#dc0606')";
    background: linear-gradient(top, #fc7f7f 0%, #f91c1c 50%, #f50606 51%, #fc7f7f 100%);
    border: none;
}

/* ---- COLORING : Tab Container & Content Box -------------------------------- */
.tab-container tr td {
    background-color: #ffffff;
}
.tab-container.default-dark ul.tab-header {
    background-color: var(--color-default-dark-inactive);
    border-bottom-color: var(--color-default-dark);
}
.tab-container.default-dark ul.tab-header li.selected {
    background-color: var(--color-default-dark);
}

/* ---- COLORING : Lightbox --------------------------------------------------- */
.lightbox-side-nav {
/*    background-color: var(--color-default-light);*/
    background-color: var(--color-default-gray);
}
ul.lightbox-nav li a {
    background-color: transparent;
/*    color: var(--color-default-dark-active);*/
    color: #ffffff;
}
ul.lightbox-nav li a:not(.selected):hover, ul.lightbox-nav li a:not(.selected):active {
/*    background-color: var(--color-default-light-inactive);*/
    background-color: var(--color-client-secondary);
    color: #ffffff;
}
ul.lightbox-nav li a.selected {
    filter: unset !important;
    background-color: var(--color-client-primary);
    color: #ffffff;
}

/*.lightbox-content-area *:not(.lightbox-header, .lightbox-footer) h3,
.lightbox-content-area *:not(.lightbox-header, .lightbox-footer) h4 {
    color: var(--color-client-primary);
}*/

/* ---- COLORING : Colorbox --------------------------------------------------- */
#cboxContent {
    background: #ffffff;
}
#cboxMiddleLeft, #cboxTopCenter, #cboxMiddleRight, #cboxBottomLeft, #cboxBottomCenter, #cboxBottomRight {
    background-color: var(--color-default-dark-inactive);
}
.colorbox-content-container .colorbox-nav-area {
    background-color: var(--color-default-light);
}
#cboxTopCenter, #cboxBottomCenter, #cboxMiddleLeft, #cboxMiddleRight, #cboxTopLeft, #cboxTopRight, #cboxBottomLeft, #cboxBottomRight {
    background-color: var(--color-client-primary);
}
.cboxIE #cboxTopLeft, .cboxIE #cboxTopCenter, .cboxIE #cboxTopRight, .cboxIE #cboxBottomLeft, .cboxIE #cboxBottomCenter, .cboxIE #cboxBottomRight, .cboxIE #cboxMiddleLeft, .cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}
#cboxTitle, #cboxCurrent {
    color: var(--color-default-dark);
}



/* ---- COLORING : Slide Out Content ------------------------------------------ */

.fixed-toolbar-content .slide-page-content {
    background-color: transparent;
}
#alterEventsView {
    background-color: #ffffff;
}

/* ---- COLORING : Events Container ------------------------------------------- */
#eventFilter li + li {
    border-left-color: #ffffff;
}
#eventFilter li a {
    background-color: transparent;
    color: var(--color-default-dark);
}
#eventFilter li a:hover {
    filter: unset !important;
}
#eventFilter li a:not(.selected):hover {
    color: #ffffff;
    background-color: var(--color-client-secondary);
}
#eventFilter li a.selected {
    background: var(--color-client-primary);
    color: #ffffff;
}
.tasks-filter {
    background-color: var(--color-default-light);
}
.tasks-container {
    background-color: #ffffff;
}
.event-container .event-body {
    background-color: #ffffff;
}
.event-container.default-dark .event-header .event-header-tab {
    background-color: var(--color-default-dark);
    border-color: var(--color-default-dark-active);
}
.event-container.default-dark .event-header .event-header-tab h4 {
    color: #ffffff;
}
.event-container.default-dark .event-body {
    border-color: var(--color-default-dark-active);
}

/* ---- COLORING : Calendar Container ----------------------------------------- */
.ui-datepicker table.ui-datepicker-calendar {
    background-color: #ffffff;
}
.ui-datepicker table th {
    color: #ffffff;
    background-color: var(--color-default-dark);
}
.ui-datepicker table tr td, .ui-datepicker .ui-state-default, .ui-datepicker.ui-widget-content .ui-state-default {
    color: var(--color-default-dark);
}
.ui-datepicker .ui-state-default, .ui-datepicker.ui-widget-content .ui-state-default {
    background: var(--color-default-light);
}
.ui-datepicker .ui-state-default:hover, .ui-datepicker.ui-widget-content .ui-state-default:hover {
    filter: unset !important;
    background: var(--color-client-secondary);
    color: #ffffff;
}
.ui-datepicker .ui-state-default.ui-state-active, .ui-datepicker.ui-widget-content .ui-state-default.ui-state-active {
    background: var(--color-default-gray);
    color: #ffffff;
}
.ui-datepicker .ui-state-default.ui-state-highlight, .ui-datepicker.ui-widget-content .ui-state-default.ui-state-highlight {
    background: var(--color-client-primary);
    color: #ffffff;
}
.ui-datepicker .ui-datepicker-header.ui-widget-header {
    background: var(--color-default-light);
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-title .ui-datepicker-month, .ui-datepicker .ui-datepicker-header .ui-datepicker-title .ui-datepicker-year {
    color: var(--color-default-dark);
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-prev span.ui-icon, .ui-datepicker .ui-datepicker-header .ui-datepicker-next span.ui-icon {
    border-top-color: var(--color-default-dark);
}
.ui-datepicker .ui-datepicker-header .ui-datepicker-prev:hover span.ui-icon, .ui-datepicker .ui-datepicker-header .ui-datepicker-next:hover span.ui-icon {
    border-top-color: var(--color-default-dark-active);
}
#ui-datepicker-div.ui-datepicker.ui-widget-content {
    background: #ffffff;
    border-color: var(--color-default-light);
}
#ui-datepicker-div.ui-datepicker .ui-timepicker-div .ui-slider-horizontal .ui-slider-handle.ui-state-default {
    background: var(--color-default-dark);
}

/* ---- COLORING : Tasks Container -------------------------------------------- */
.task-item {
    border-bottom-color: var(--color-default-dark);
    background-color: transparent;
}
.task-item a.task-edit {
    color: var(--color-default-dark);
}

/* ---- COLORING : Pagination ------------------------------------------------- */
.pagination-container > .pagination > ul > li > a, .pagination-container > .pagination > ul > li:hover > a, .pagination-container > .pagination > ul > li > a:hover {
    background-color: transparent;
    background: transparent;
}
.pagination-container > .pagination > ul > li > a, .pagination-container > .pagination > ul > li > a > i, .pagination-container > .pagination > ul > li:hover > a, .pagination-container > .pagination > ul > li:hover > a > i, .pagination-container > .pagination > ul > li > a:hover, .pagination-container > .pagination > ul > li > a:hover i {
    filter: unset !important;
}
.pagination-container > .pagination > ul > li {
    color: var(--color-client-primary);
    -webkit-box-shadow: inset 0px 0px 0px 1.5px var(--color-client-primary);
    -moz-box-shadow: inset 0px 0px 0px 1.5px var(--color-client-primary);
    box-shadow: inset 0px 0px 0px 1.5px var(--color-client-primary);
}
.pagination-container > .pagination > ul > li.disabled {
    color: var(--color-default-light);
    -webkit-box-shadow: inset 0px 0px 0px 1.5px var(--color-default-light);
    -moz-box-shadow: inset 0px 0px 0px 1.5px var(--color-default-light);
    box-shadow: inset 0px 0px 0px 1.5px var(--color-default-light);
}
.pagination-container > .pagination > ul > li:not(.disabled):hover {
    color: #ffffff;
}
.pagination-container > .pagination > ul > li > *, .pagination-container > .pagination > ul > li:hover > * {
    color: inherit;
}
.pagination-container > .pagination > ul > li:not(.active, .disabled):hover, .pagination-container > .pagination > ul > li:not(.active, .disabled):focus, .pagination-container > .pagination > ul > li:not(.active, .disabled):active {
    -webkit-box-shadow: inset 0px 0px 0px 1.5px var(--color-client-primary), inset 0px 0px 25px 25px var(--color-client-primary);
    -moz-box-shadow: inset 0px 0px 0px 1.5px var(--color-client-primary), inset 0px 0px 25px 25px var(--color-client-primary);
    box-shadow: inset 0px 0px 0px 1.5px var(--color-client-primary), inset 0px 0px 25px 25px var(--color-client-primary);
}
.pagination-container > .pagination > ul > li.active {
    background-color: var(--color-client-primary);
    background: var(--color-client-primary);
    color: #ffffff;
}

/* ---- COLORING : Lists ------------------------------------------------------ */
ul.trends-months li a, ul.budget-months li a {
    border-top-color: var(--color-default-light);
    color: var(--color-default-dark);
}
ul.trends-months li a:hover, ul.trends-months li a:focus, ul.trends-months li a:active, ul.trends-months li a.current, ul.budget-months li a:hover, ul.budget-months li a:focus, ul.budget-months li a:active, ul.budget-months li a.current {
    border-top-color: var(--color-client-primary);
}
ul.type-of-account li a {
    color: var(--color-default-dark);
    background-color: var(--color-default-light);
}
ul.category-list.default-dark li.category-item {
    background-color: var(--color-default-light);
    color: var(--color-default-dark);
}
ul.category-list.default-dark li.category-item.active {
    background-color: var(--color-default-dark);
    color: #ffffff;
}
ul.category-list.default-dark li.category-item.active::after {
    border-top-color: var(--color-default-dark);
}
ul.category-list.client-primary li.category-item {
    background-color: var(--color-default-light);
    color: var(--color-default-dark);
}
ul.category-list.client-primary li.category-item.active {
    background-color: var(--color-client-primary);
    color: #ffffff;
}
ul.category-list.client-primary li.category-item.active::after {
    border-top-color: var(--color-client-primary);
}

/* ---- COLORING : Breadcrumbs ------------------------------------------------ */
.breadcrumb-container.default-dark {
    background-color: var(--color-default-light);
    border-color: var(--color-default-dark);
    align-items:stretch;
    padding:0px;
    margin:0px;
}
.breadcrumb-container.default-light {
    background-color: var(--color-default-light);
    border-color: var(--color-default-gray);
}
.breadcrumb-container.default-dark .breadcrumb-default .breadcrumb-item {
    border-left-color: var(--color-default-dark);
}
.breadcrumb-container.default-light .breadcrumb-default .breadcrumb-item {
    border-left-color: var(--color-default-gray);
}
.breadcrumb-container.default-dark .breadcrumb-default .breadcrumb-item:hover {
    background-color: var(--color-default-gray-opaque);
}
.breadcrumb-container.default-light .breadcrumb-default .breadcrumb-item:hover {
    background-color: var(--color-default-gray-opaque);
}
.breadcrumb-container.default-dark .breadcrumb-default .breadcrumb-item .bc-number, .breadcrumb-container.default-dark .breadcrumb-default .breadcrumb-item .bc-text {
    color: var(--color-default-dark);
 }
.breadcrumb-container.default-light .breadcrumb-default .breadcrumb-item .bc-number, .breadcrumb-container.default-light .breadcrumb-default .breadcrumb-item .bc-text {
    color: var(--color-default-gray);
}
.breadcrumb-container.default-dark .breadcrumb-default .breadcrumb-item.active, .breadcrumb-container.default-dark .breadcrumb-default .breadcrumb-item.current-step {
    background-color: var(--color-default-dark);
}
.breadcrumb-container.default-light .breadcrumb-default .breadcrumb-item.active, .breadcrumb-container.default-light .breadcrumb-default .breadcrumb-item.current-step {
    background-color: var(--color-client-primary);
}
.breadcrumb-container.default-dark .breadcrumb-default .breadcrumb-item.active .bc-number, .breadcrumb-container.default-dark .breadcrumb-default .breadcrumb-item.current-step .bc-number, .breadcrumb-container.default-dark .breadcrumb-default .breadcrumb-item.active .bc-text, .breadcrumb-container.default-dark .breadcrumb-default .breadcrumb-item.current-step .bc-text {
    color: #ffffff;
}
.breadcrumb-container.default-light .breadcrumb-default .breadcrumb-item.active .bc-number, .breadcrumb-container.default-light .breadcrumb-default .breadcrumb-item.current-step .bc-number, .breadcrumb-container.default-light .breadcrumb-default .breadcrumb-item.active .bc-text, .breadcrumb-container.default-light .breadcrumb-default .breadcrumb-item.current-step .bc-text {
    color: var(--color-default-dark);
}

.breadcrumb-item {
    margin: 0px;
    align-self: stretch;
    margin-bottom: 0px !important;
}
.breadcrumb-item {
    border-left:none !important;
}

.breadcrumb-item:hover {
    cursor:pointer;
}

/* ---- COLORING : Validation ------------------------------------------------- */
/*#ajax-errors,
.validation-summary-errors {
    color: var(--color-default-red);
    background-color: var(--color-default-red-opaque);
}*/
/*#ajax-success,
.validation-summary-success {
    color: var(--color-default-green);
    background-color: var(--color-default-green-opaque);
}*/
/*#ajax-message {
    color: var(--color-default-yellow);
    background-color: var(--color-default-yellow-opaque);
}*/
#validation-container #val-success li {
    color: var(--color-default-green);
    background-color: var(--color-default-green-opaque);
}

#validation-container #val-warnings li {
    color: var(--color-default-yellow);
    background-color: var(--color-default-yellow-opaque);
}

#validation-container #val-errors li {
    color: var(--color-default-red);
    background-color: var(--color-default-red-opaque);
}

#updatingMessage p.alt, #updatingCategoriesMessage p.alt {
    background-color: var(--color-default-green-opaque);
}
#updatingMessage p.alt > a, #updatingCategoriesMessage p.alt > a {
    color: var(--color-default-green);
    font-style: italic;
}


/* ============================================================================ */
/*      MEDIA QUERIES                                                           */
/* ============================================================================ */
@media(min-width: 1600px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1400px;
    }
}





.hide-overflow {
    overflow: hidden !important;
}
.scroll-overflow {
    overflow: scroll !important;
}


.padding-sm {
    padding: var(--fgs-gutter-sm) !important;
}

.content-group {
    margin-top: var(--fgs-gutter-sm-offset);
    margin-left: var(--fgs-gutter-sm-offset);
}
.content-group > * {
    margin-top: var(--fgs-gutter-sm);
    margin-left: var(--fgs-gutter-sm);
}


@media(min-width: 992px) {
    .max-w-lg-800 {
        max-width: 800px;
    }
    .max-w-lg-600 {
        max-width: 600px;
    }
}


#popup_container {
    background-color: white;
    border: 10px solid var(--color-default-dark-active);
    padding: 25px;
    min-width:400px;
    border-radius:10px;
}

#popup_container * {
    color: var(--color-default-dark-active);        
}

#popup_panel {
    padding:10px;
    text-align:center;
}

#popup_panel input[type=button] {
    color: var(--color-default-dark-active);
}

#expenseContainer {
    width:80%;
    margin:auto;
}

#expenseContainer div {
    padding: 2px;
    margin-bottom: 1px;
}

#expenseContainer div input[type="text"],
#expenseContainer div input[type="number"] {
    text-align: right;
    width:90%;
    padding-right:10px;
}

#expenseContainer .row {
    padding:0px;
    margin:0px;
}

#expenseContainer div {
    margin-top:0px;
}

.goal-tab-header {   
    padding-top:2px;
    height:32px;
}

.stats-details {
    width:80% !important;
}

.incrementer {
    border: none;
    color:white;
    border-radius: 17px;
    display: inline-block;
    height: 34px;
    width: 33px;
    padding: 1px;
    text-align: center;
    cursor: pointer;
    font-size:16pt;
    font-weight: 800;
    font-family:Roboto;
}

.incrementer-add {
    background-color: #2e5a01;
}

.incrementer-subtract {
    background-color: #872d2d;
}

#increment-right-payment, #increment-right-date {
    margin-right: 10px;
}

div.tab-body.budget > div.row
{
    margin-top: 0px;
}

div.tab-body.budget > div.row .progress-bar-container {
    margin-bottom:0px;
}

.color-green {
    color: var(--color-default-green);
}

.color-red {
    color: var(--color-default-red);
}

.header-site-green {
    color:var(--color-default-green);
}

.frequency {
    display:inline-block;
    width: 70px;
}

.goal-details-header {
    width: 180px;
    float:left;
}

.completed-badge {
    border-radius: 8px;
    padding: 6px 14px;
    background-color: forestgreen;
    color: white;
    font-size: 18pt;
    box-shadow: 0px 0px 2px gray;
    display: inline-block;
    margin-left: 16px;
    font-family: 'Open Sans';
}

#finishdateslidermax {
    font-size: 12pt;
}

#tb-monthly-budget {
    font-size: 1.4em;
    width: 240px;
    padding: 11px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

.dollar-sign-span {
    border: 1px solid gray;
    padding: 15px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    position: relative;
    top: -2px;
    left: 1px;
}