/**
 * CSS for laying out and displaying blocks and boxes
 */
:root {

    /* Consistent paddings */

    /* shadows */

    /* All z-index values should be listed here */

    /* widths */
}
/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
/* basic setup for triangles in :before and :after pseudo-elements */
/* clears ul/ol defaults */
/* TODO Deprecated */
/* best pronounced with a texan drawl */
/* is this annoying yet? */
/* Marketing Button Mixins */
#view .session-page-logo,
#view .content {
    z-index: 1;
}
#view-wrapper #view {
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    background-image: url(/static/gradifui/assets/bg_redesign2020_hero.db1ede271cbf44149842.svg);

    padding-bottom: 8px;
}
#view-wrapper #view .session-page-logo {
        background-size: cover;
        background-position: top;
        background-repeat: no-repeat;
        background-image: url(/static/gradifui/assets/Gradifi-Logo-Horiz-Color.dbac622961af3346547b.svg);
        background-size: contain;
        width: 512px;
        height: 64px;
        margin: 40px auto;
        display: block;
    }
@media (max-width: 60em) {
#view-wrapper #view .session-page-logo {
        width: 440px;
    }
    }
@media (max-width: 40em) {
#view-wrapper #view .session-page-logo {
        margin: 32px auto 16px;
        width: 312px;
        height: 48px;
    }
    }
@media (max-width: 23em) {
#view-wrapper #view .session-page-logo {
        width: 256px;
    }
    }
#view-wrapper #view > .session-page-logo {
        display: none;
    }
#view .site-content {
    color: black;
    -webkit-box-align: normal;
    -webkit-align-items: normal;
       -moz-box-align: normal;
        -ms-flex-align: normal;
            align-items: normal;
}
#view .content {
    padding-top: 0;
    padding-bottom: 0;
    margin: 64px 10% auto;
    min-height: auto;
    max-width: none;
    width: 55%;
    background: #fff;
    -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.16), 0 4px 6px rgba(0, 0, 0, 0.23);
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.16), 0 4px 6px rgba(0, 0, 0, 0.23);
}
#view .content .user-login-form,
    #view .content .support-section {
        margin: 0 auto 24px;
        max-width: 640px;
    }
#view .content .user-login-form {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
           -moz-box-orient: vertical;
           -moz-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
#view .content .forgot-password-link {
        -webkit-align-self: flex-end;
            -ms-flex-item-align: end;
                align-self: flex-end;
    }
#view .content .input-container + .input-container {
        margin-bottom: 8px;
    }
#view .content .forgot-password-link,
    #view .content .get-started-link {
        font-family: ETrade-Regular;
        line-height: 150%;
        color: rgb(29, 40, 48);
        font-size: 0.75rem;
        font-weight: 600;
        padding-bottom: 2px;
        border-bottom: 2px solid #005cb9;

        text-transform: uppercase;
        color: #005cb9;
    }
#view .content .get-started-link {
        font-size: 1rem;
    }
#view .content .user-login-submit-button {
        margin-top: 24px;
        width: 85px;
    }
#view .content .get-started-header {
        margin-bottom: 24px;
    }
#view .content .support {
        font-size: 0.875rem;
        line-height: 1.5;
        font-weight: 400;
        font-family: 'Montserrat', Helvetica, sans-serif;

        margin-top: 24px;
    }
#view .content .support .support-text-1,
        #view .content .support .support-text-2 {
            display: inline;
            margin: 0;
        }
#view .content .support .support-text-2 {
            white-space: nowrap;
        }
#view .content .support a {
            color: #005cb9;
        }
@media (max-width: 65em) {
        #view::after {
            width: 96%;
            margin-left: 2%;
        }

        #view .content {
            width: 80%;
        }

        #view *::-ms-backdrop,
        #view .content {
            margin: 64px 0;
        }

        #view .content .user-login-submit-button {
            width: 180px;
        }
}
@media (max-width: 40em) {
    #view-wrapper #view .session-page-logo {
        height: 40px;
        margin: 24px auto;
    }
        #view::after {
            height: 85%;
            margin-top: 8px;
        }

        #view .content {
            margin: 8px 8px auto;
            width: 100%;
        }

            #view .content .input-container {
                margin: 0 4px 16px;
            }

            #view .content .forgot-password-link {
                margin-right: 4px;
            }

            #view .content .user-login-submit-button {
                width: 98%;
                padding-bottom: 24px;
            }

            #view .content .support {
                margin-left: 8px;
                margin-right: 8px;
            }
}

/**
 * CSS for laying out and displaying blocks and boxes
 */
:root {

    /* Consistent paddings */

    /* shadows */

    /* All z-index values should be listed here */

    /* widths */
}
/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
.custom-input .optional-placeholder {
        z-index: 1;
        position: absolute;
        right: 8px;
        bottom: 4px;
        color: #8a8c8f;
        font-weight: 400;
    }

/**
 * CSS for laying out and displaying blocks and boxes
 */
:root {

    /* Consistent paddings */

    /* shadows */

    /* All z-index values should be listed here */

    /* widths */
}
/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
/* basic setup for triangles in :before and :after pseudo-elements */
/* clears ul/ol defaults */
/* TODO Deprecated */
/* best pronounced with a texan drawl */
/* is this annoying yet? */
/* Marketing Button Mixins */
.custom-form *[disabled] {
        color: #8a8c8f;
        background-color: rgb(242, 242, 243);
        cursor: context-menu;
    }
.custom-form h4,
    .custom-form h5 {
        margin: 8px 0;
    }
.custom-form section {
        margin-bottom: 16px;
    }
.custom-form .input-row:before {
        content: '';
        display: table;
    }
.custom-form .input-row:after {
        content: '';
        display: table;
        clear: both;
    }
.custom-form .input-row select,
        .custom-form .input-row input[type="text"],
        .custom-form .input-row input[type="email"],
        .custom-form .input-row input[type="password"] {
            min-width: auto;
            width: 100%;
        }
.custom-form .input-message.submit-error {
        margin-bottom: 8px;
    }
.custom-form .radio-group {
        margin: 8px 0;
    }
.custom-form .radio-group .input-row {
            margin-left: 16px;
            margin-bottom: 4px;
        }
.custom-form .inline-input {
        display: inline-block;
        width: 80px;
        margin-left: 4px;
        margin-right: 4px;
    }
.custom-form span.label::before {
            content: '';
            margin-right: 16px;
        }
.custom-form .top-level-error-message {
        margin-bottom: 16px;
    }
.custom-form .input-message {
        font-size: 0.725rem;
        line-height: 1.5;
        font-weight: 400;
        font-family: 'Montserrat', Helvetica, sans-serif;

        display: inline-block;
        padding: 4px;
        margin-left: 4px;
    }
.custom-form .valid-message {
        color: green;
        font-weight: 600;
    }
.custom-form .invalid-message {
        color: #c8102e;
        border-bottom: 1px dotted #c8102e;
        font-weight: 600;
    }
.custom-form .error-message {
        color: #c8102e;
        border-bottom: 1px dotted #c8102e;
        font-weight: 600;
    }
.custom-form .error-message a {
            color: #c8102e;
            text-decoration: underline;
            font-weight: 700;
        }
.custom-form .error-message-details {
        font-size: 0.725rem;
        line-height: 1.5;
        font-weight: 400;
        font-family: 'Montserrat', Helvetica, sans-serif;

        color: #c8102e;
        font-weight: 600;
    }
.custom-form .warning-message {
        color: #b36200;
        border-bottom-color: #b36200;
    }
.custom-form .has-errors input,
        .custom-form .has-errors select {
            border: #c8102e 1px solid;
        }
.custom-form .custom-multiselect.has-errors input {
            border: none;
        }
.custom-form label.primary {
        font-weight: 600;
    }
.custom-form label .additional-description {
        font-weight: 400;
    }
.custom-form .input-container {
        margin-bottom: 16px;
    }
.custom-form .input-container label {
            margin-bottom: 4px;
            font-weight: 600;
        }
.custom-form .custom-submit,
    .custom-form .custom-button {
        display: inline-block;
        text-decoration: none;
        padding: 8px 16px;
        border-radius: 24px;
        cursor: pointer;
        -webkit-transition: all 0.2s ease-in;
        -o-transition: all 0.2s ease-in;
        transition: all 0.2s ease-in;
        text-align: center;
        display: inline-block;
        text-decoration: none;
        padding: 8px 16px;
        border-radius: 24px;
        cursor: pointer;
        transition: all 0.2s ease-in;
        text-align: center;
        border: 2px solid #005cb9;
        color: white;
        background-color: #005cb9;
    }
@media (max-width: 40em) {
.custom-form .custom-submit,
    .custom-form .custom-button {
        height: 50px;
        margin: 8px 0;
        padding: 16px 16px 8px 16px;
        text-align: center;
        width: 100%;
    }
    }
@media (max-width: 40em) {
.custom-form .custom-submit,
    .custom-form .custom-button {
        height: 50px;
        margin: 8px 0;
        padding: 16px 16px 8px 16px;
        text-align: center;
        width: 100%;
    }
    }
.custom-form .custom-submit:hover, .custom-form .custom-button:hover {
        background-color: rgb(0, 76, 153);
        border-color: rgb(0, 76, 153);
    }
.custom-form .custom-submit:disabled, .custom-form .custom-button:disabled {
        border-color: #8a8c8f;
        background-color: #8a8c8f;
        color: white;
        cursor: default;
    }
.custom-form .custom-button.alt {
        background-color: #e58c23;
        color: white;
        font-weight: 600;
        width: auto;
    }

/**
 * TO BE DEPRECATED
 * Consider using *-common.css or common.css instead, or one of the categorical files below:
 */
/**
 * CSS for laying out and displaying blocks and boxes
 */
:root {

    /* Consistent paddings */

    /* shadows */

    /* All z-index values should be listed here */

    /* widths */
}
/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
/* basic setup for triangles in :before and :after pseudo-elements */
/* clears ul/ol defaults */
/* TODO Deprecated */
/* best pronounced with a texan drawl */
/* is this annoying yet? */
/* Marketing Button Mixins */
.flash-page-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 120;
}
.flash-page-wrapper .flash-container {
        position: fixed;
    }
.flash-message {
    overflow: hidden;
    padding: 8px;
    width: 100%;
}
.flash-message:before {
    content: '';
    display: table;
}
.flash-message:after {
    content: '';
    display: table;
    clear: both;
}
.flash-message.flash-enter {
        padding: 0 8px;
        max-height: 0;
    }
.flash-message.flash-enter.flash-enter-active {
        padding: 8px;
        max-height: 100px;
        -webkit-transition: max-height 0.4s ease-in, padding 0.4s ease-in;
        -o-transition: max-height 0.4s ease-in, padding 0.4s ease-in;
        transition: max-height 0.4s ease-in, padding 0.4s ease-in;
    }
.flash-message.flash-exit {
        padding: 8px;
        max-height: 100px;
    }
.flash-message.flash-exit.flash-exit-active {
        padding: 0 8px;
        max-height: 0;
        -webkit-transition: max-height 0.4s ease-out, padding 0.4s ease-out;
        -o-transition: max-height 0.4s ease-out, padding 0.4s ease-out;
        transition: max-height 0.4s ease-out, padding 0.4s ease-out;
    }
.flash-message .close-button {
        float: right;
        padding: 0;
        margin: 0;
        background-color: transparent;
    }
.flash-message a {
        margin-left: 8px;
        text-decoration: underline;
        color: #005cb9;
        cursor: pointer;
    }
.flash-message a:hover {
            color: blue;
        }
.flash-container {
    width: 100%;
}
.flash-container .flash-message {
        font-size: 1.125rem;
        line-height: 1.5;
        font-weight: 400;
        font-family: 'Montserrat', Helvetica, sans-serif;

        font-weight: 600;
        text-align: center;
    }
.flash-container .flash-message.success {
            color: white;
            background-color: #00843d;
        }
.flash-container .flash-message.warning {
            color: white;
            background-color: #b36200;
        }
.flash-container .flash-message.error {
            color: white;
            background-color: #c8102e;
        }
.message-container .flash-message {
        margin-bottom: 16px;
        font-weight: 600;
        border: 1px solid rgb(177, 178, 180);
    }
.message-container .flash-message.success {
            color: #00843d;
            border-color: #00843d;
        }
.message-container .flash-message.warning {
            color: #e58c23;
            border-color: #e58c23;
        }
.message-container .flash-message.error {
            color: #c8102e;
            border-color: #c8102e;
        }
.message-container .flash-message .icon {
            padding-right: 4px;
        }

/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
.password-requirements-subheader {
    font-weight: 600;
}
.password-requirements {
    margin-top: 0;
}
.password-requirements .validation-message {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
    }
.password-requirements .validation-message .checkmark-container {
            width: 16px;
        }
.password-requirements .validation-message .checkmark-container .icon-ok {
                color: #00843d;
            }
.password-requirements .validation-message .invalid-message {
            border-bottom: none;
        }
.password-requirements .validation-message .tooltip {
            display: -webkit-box;
            display: -webkit-flex;
            display: -moz-box;
            display: -ms-flexbox;
            display: flex;
        }
.password-requirements .validation-message .tooltip-content {
            text-align: center;
        }
.password-requirements .validation-message .example {
            color: rgb(0, 51, 102);
            font-weight: 600;
            padding-left: 4px;
            letter-spacing: 0.08rem;
        }

/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
/**
 * CSS for laying out and displaying blocks and boxes
 */
:root {

    /* Consistent paddings */

    /* shadows */

    /* All z-index values should be listed here */

    /* widths */
}
/* Mixins to be applied to the .tooltip element of Tooltip.js */
.tooltip .tooltip-content {
        color: rgb(29, 40, 48);
    }
.tooltip .tooltip-content {
        background-color: white;
    }
.tooltip .primary-top .tooltip-content::after {
        border-top: 14px solid white;
    }
.tooltip .primary-bottom .tooltip-content::after {
        border-bottom: 14px solid white;
    }
.tooltip .primary-left .tooltip-content::after {
        border-left: 14px solid white;
    }
.tooltip .primary-right .tooltip-content::after {
        border-right: 14px solid white;
    }
.tooltip .tooltip-content {
        border: 1px solid rgb(177, 178, 180);
    }
.tooltip .primary-top .tooltip-content::before {
        border-top: solid 16px rgb(177, 178, 180);
    }
.tooltip .primary-bottom .tooltip-content::before {
        border-bottom: solid 16px rgb(177, 178, 180);
    }
.tooltip .primary-left .tooltip-content::before {
        border-left: 16px solid rgb(177, 178, 180);
    }
.tooltip .primary-right .tooltip-content::before {
        border-right: 16px solid rgb(177, 178, 180);
    }
.tooltip .icon-info-circled {
        background-color: ;
        color: rgb(0, 51, 102) white;
    }
.tooltip .tooltip-content .cancel-button-container {
            color: white;
        }
.tooltip .tooltip-content {
        -webkit-box-shadow: 1px 1px 3px 1px rgba(rgb(29, 40, 48), 0.2);
                box-shadow: 1px 1px 3px 1px rgba(rgb(29, 40, 48), 0.2);
    }
.tooltip {

    display: inline-block;
    text-decoration: none;
}
.tooltip > a {
        text-decoration: none;
    }
.tooltip .icon-info-circled {
        font-size: 0.875rem;
        line-height: 1.5;
        font-weight: 400;
        font-family: 'Montserrat', Helvetica, sans-serif;

        line-height: 1;
        vertical-align: top;
        pointer-events: all;
        cursor: pointer;
    }
.tooltip.has-label > a {
            text-decoration: underline;
        }
.tooltip.has-label .primary-right {
            position: absolute;
            right: 10px;
        }
.tooltip .tooltip-mount {
        width: 0;
        height: 0;
    }
.tooltip .tooltip-content {
        font-size: 0.725rem;
        line-height: 1.5;
        text-transform: uppercase;
        font-weight: 500;
        font-family: 'Montserrat', Helvetica, sans-serif;

        text-transform: none;
        width: 300px;
        position: absolute;
        min-width: 100px;
        min-height: 32px;
        z-index: 60;
        text-align: left;
        border-radius: 8px;
        padding: 12px;
    }
.tooltip .tooltip-content .cancel-button-container {
            position: absolute;
            right: 4px;
            top: 4px;
            font-size: 1rem;
            cursor: pointer;
            z-index: 1;
        }
.tooltip .tooltip-content::before {
            content: "";
            position: absolute;
            border: 10px solid transparent;
            margin-left: -10px;
        }
.tooltip .tooltip-content::after {
            content: "";
            position: absolute;
            border: 8px solid transparent;
            margin-left: -8px;
        }
/* adjust positioning to account for icon size */
.tooltip .primary-right .tooltip-content {
        left: 32px;
    }
.tooltip .primary-right .tooltip-content::before {
            left: -16px;
        }
.tooltip .primary-right .tooltip-content::after {
            left: -14px;
        }
.tooltip .primary-top .tooltip-content {
        bottom: 14px;
    }
.tooltip .primary-top .tooltip-content::before {
            bottom: -26px;
        }
.tooltip .primary-top .tooltip-content::after {
            bottom: -22px;
        }
.tooltip .primary-left .tooltip-content {
        right: 12px;
    }
.tooltip .primary-left .tooltip-content::before {
            right: -26px;
        }
.tooltip .primary-left .tooltip-content::after {
            right: -22px;
        }
.tooltip .primary-bottom .tooltip-content {
        top: 32px;
    }
.tooltip .primary-bottom .tooltip-content::before {
            top: -26px;
        }
.tooltip .primary-bottom .tooltip-content::after {
            top: -22px;
        }
.tooltip .secondary-top .tooltip-content {
        bottom: -30px;
    }
.tooltip .secondary-top .tooltip-content::before {
            bottom: 10px;
        }
.tooltip .secondary-top .tooltip-content::after {
            bottom: 12px;
        }
.tooltip .secondary-bottom .tooltip-content {
        top: -12px;
    }
.tooltip .secondary-bottom .tooltip-content::before {
            top: 12px;
        }
.tooltip .secondary-bottom .tooltip-content::after {
            top: 14px;
        }
.tooltip .secondary-left .tooltip-content {
        right: -30px;
    }
.tooltip .secondary-left .tooltip-content::before {
            right: 10px;
        }
.tooltip .secondary-left .tooltip-content::after {
            right: 12px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-50 {
            right: -80px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-50::before {
            right: 60px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-50::after {
            right: 62px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-100 {
            right: -130px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-100::before {
            right: 110px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-100::after {
            right: 112px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-150 {
            right: -180px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-150::before {
            right: 160px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-150::after {
            right: 162px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-200 {
            right: -230px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-200::before {
            right: 210px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-200::after {
            right: 212px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-250 {
            right: -280px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-250::before {
            right: 260px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-250::after {
            right: 262px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-300 {
            right: -330px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-300::before {
            right: 310px;
        }
.tooltip .secondary-left .tooltip-content.adjusted-300::after {
            right: 312px;
        }
.tooltip .secondary-right .tooltip-content {
        left: -20px;
    }
.tooltip .secondary-right .tooltip-content::before,
        .tooltip .secondary-right .tooltip-content::after {
            left: 26px;
        }
.tooltip .secondary-right .tooltip-content.adjusted-50 {
            left: -70px;
        }
.tooltip .secondary-right .tooltip-content.adjusted-50::before,
        .tooltip .secondary-right .tooltip-content.adjusted-50::after {
            left: 76px;
        }
.tooltip .secondary-right .tooltip-content.adjusted-100 {
            left: -120px;
        }
.tooltip .secondary-right .tooltip-content.adjusted-100::before,
        .tooltip .secondary-right .tooltip-content.adjusted-100::after {
            left: 126px;
        }
.tooltip .secondary-right .tooltip-content.adjusted-150 {
            left: -170px;
        }
.tooltip .secondary-right .tooltip-content.adjusted-150::before,
        .tooltip .secondary-right .tooltip-content.adjusted-150::after {
            left: 176px;
        }
.tooltip .secondary-right .tooltip-content.adjusted-200 {
            left: -220px;
        }
.tooltip .secondary-right .tooltip-content.adjusted-200::before,
        .tooltip .secondary-right .tooltip-content.adjusted-200::after {
            left: 226px;
        }
.tooltip .secondary-right .tooltip-content.adjusted-250 {
            left: -270px;
        }
.tooltip .secondary-right .tooltip-content.adjusted-250::before,
        .tooltip .secondary-right .tooltip-content.adjusted-250::after {
            left: 276px;
        }
.tooltip .secondary-right .tooltip-content.adjusted-300 {
            left: -320px;
        }
.tooltip .secondary-right .tooltip-content.adjusted-300::before,
        .tooltip .secondary-right .tooltip-content.adjusted-300::after {
            left: 326px;
        }

/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
/**
 * CSS for laying out and displaying blocks and boxes
 */
:root {

    /* Consistent paddings */

    /* shadows */

    /* All z-index values should be listed here */

    /* widths */
}
/* basic setup for triangles in :before and :after pseudo-elements */
/* clears ul/ol defaults */
/* TODO Deprecated */
/* best pronounced with a texan drawl */
/* is this annoying yet? */
/* Marketing Button Mixins */
body.gradifi {
    background-color: #fff;
}
#view {
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    background-image: url(/static/gradifui/assets/bg_hp_01_hero.332ad333d91adc8a496c.jpg);

    min-height: 100vh;
}
.site-content {
    color: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
main.content {
    max-width: 640px;
    min-height: 600px;
    width: 100%;
    padding: 16px 16px 140px;
}
main.content select,
    main.content input[type="text"],
    main.content input[type="email"],
    main.content input[type="password"] {
        width: 100%;
        padding: 8px;
    }
main.content input[type="checkbox"] {
        width: auto;
        margin-right: 4px;
    }
main.content .custom-form {
        text-align: left;
    }
main.content button,
    main.content .button,
    main.content .custom-submit {
        display: block;
        width: auto;
        margin: 32px auto;
    }
main.content h1 {
        font-size: 1.5rem;
        line-height: 1.2;
        font-weight: 600;
        font-family: 'Montserrat', Helvetica, sans-serif;

        margin-bottom: 32px;
        text-align: center;
    }
main.content section {
        margin: 16px 0;
        text-align: center;
    }
main.content section p {
            margin: 16px 0;
        }
main.content a {
        color: #00a0d4;
        font-weight: 500;
        text-decoration: none;
    }

/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
.modal-dialog.load-spinner {
    background-color: rgba(255, 255, 255, 0);
    border: 0;
}
.modal-dialog.load-spinner .modal-content {
        background: rgba(255, 255, 255, 0);
    }
.modal-dialog.load-spinner .modal-content .has-message {
            padding: 16px;
            background: white;
            border: 2px solid #005cb9;
            min-width: 70vw;
        }
.modal-dialog.load-spinner .modal-content .has-message .message {
                margin-top: 32px;
                font-size: 1.2rem;
                text-align: center;
                color: #005cb9;
            }
.modal-dialog.load-spinner .modal-content,
        .modal-dialog.load-spinner .modal-content .has-message,
        .modal-dialog.load-spinner .modal-content .no-message {
            min-height: 50vh;
            display: -webkit-box;
            display: -webkit-flex;
            display: -moz-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-direction: column;
               -moz-box-orient: vertical;
               -moz-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            -webkit-box-align: center;
            -webkit-align-items: center;
               -moz-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
               -moz-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
        }
.modal-overlay.load-spinner-overlay {
    background-color: rgba(255, 255, 255, 0.8);
}
.loader,
.loader div {
    width: 10em;
    height: 10em;
}
.loader {
    display: inline-block;
    position: relative;
    margin: auto;
}
.loader div {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    display: block;
    position: absolute;
    border: 8px solid #005cb9;
    border-radius: 50%;
    -webkit-animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
            animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #005cb9 transparent transparent transparent;
}
.loader div:nth-child(1) {
    -webkit-animation-delay: -0.45s;
            animation-delay: -0.45s;
}
.loader div:nth-child(2) {
    -webkit-animation-delay: -0.3s;
            animation-delay: -0.3s;
}
.loader div:nth-child(3) {
    -webkit-animation-delay: -0.15s;
            animation-delay: -0.15s;
}
@keyframes lds-ring {
    0% {
        -webkit-transform: rotate(0deg);
                transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
                transform: rotate(360deg);
    }
}
@-webkit-keyframes lds-ring {
    0% {
        -webkit-transform: rotate(0deg);
                transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
                transform: rotate(360deg);
    }
}
@media (max-width: 30em), (max-width: 46em) and (orientation: landscape) {
    .loader,
    .loader div {
        width: 6em;
        height: 6em;
    }

    .loader div {
        border-width: 8px;
    }
}

/**
 * TO BE DEPRECATED
 * Consider using *-common.css or common.css instead, or one of the categorical files below:
 */
/**
 * CSS for laying out and displaying blocks and boxes
 */
:root {

    /* Consistent paddings */

    /* shadows */

    /* All z-index values should be listed here */

    /* widths */
}
/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
/* basic setup for triangles in :before and :after pseudo-elements */
/* clears ul/ol defaults */
/* TODO Deprecated */
/* best pronounced with a texan drawl */
/* is this annoying yet? */
/* Marketing Button Mixins */
.modal-enter {
    opacity: 0.01;
}
.modal-enter.modal-enter-active {
    opacity: 1;
    -webkit-transition: opacity 300ms ease-in;
    -o-transition: opacity 300ms ease-in;
    transition: opacity 300ms ease-in;
}
.modal-exit {
    opacity: 1;
}
.modal-exit.modal-exit-active {
    opacity: 0.01;
    -webkit-transition: opacity 300ms ease-in;
    -o-transition: opacity 300ms ease-in;
    transition: opacity 300ms ease-in;
}
.modal-appear {
    opacity: 0.01;
}
.modal-appear.modal-appear-active {
    opacity: 1;
    -webkit-transition: opacity 300ms ease-in;
    -o-transition: opacity 300ms ease-in;
    transition: opacity 300ms ease-in;
}
.modal-overlay {
    background-color: rgba(0, 0, 0, 0.5);
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 81;
    max-width: 100vw;

    /* goes above most everything else */
    overflow-y: auto;
}
.modal-overlay .ReactCrop--crop-selection {
        display: none;
    }
.modal-dialog {
    border-radius: 4px;
    position: relative;
    background: white;
    outline: none;
    margin: 32px auto 16px;
    padding: 0;
    max-width: 95vw;
}
@media (min-width: 45em) {
.modal-dialog {
        width: 740px
}
    }
.modal-dialog.message-box {
        width: 300px;
    }
.modal-header {
    font-size: 1.125rem;
    line-height: 1.5;
    font-weight: 400;
    font-family: 'Montserrat', Helvetica, sans-serif;

    border-radius: 4px 4px 0 0;
    font-weight: 500;
    border-bottom: 1px solid rgb(216, 217, 218);
    color: rgb(29, 40, 48);
    padding: 16px;
    background-color: white;
}
.modal-content {
    padding: 32px;
    overflow: auto;
    max-height: 100%;
    background: white;
    border-radius: 0 0 4px 4px;
}
.modal-radio-container {
    margin: 16px 0;
    line-height: 24px;
}
.modal-footer {
    border-radius: 0 0 4px 4px;
    background-color: rgba(0,92,185, 0.1);
    padding: 16px;
}
.modal-footer .modal-footer-close-button {
        display: inline-block;
        text-decoration: none;
        padding: 8px 16px;
        border-radius: 24px;
        cursor: pointer;
        -webkit-transition: all 0.2s ease-in;
        -o-transition: all 0.2s ease-in;
        transition: all 0.2s ease-in;
        text-align: center;

        display: block;
        margin-left: auto;
    }
@media (max-width: 40em) {
.modal-footer .modal-footer-close-button {
        height: 50px;
        margin: 8px 0;
        padding: 16px 16px 8px 16px;
        text-align: center;
        width: 100%;
    }
    }
.modal-close-button {
    float: right;
    display: block;
    border: none;
    background: transparent;
    padding: 0;
    font-size: 1.25rem;
    line-height: 1.25;
    color: rgb(29, 40, 48);
    cursor: pointer;
    width: 32px;
    height: 32px;
    margin: 0;
}
@media (max-width: 50em) {
    .modal-content {
        padding: 16px;
    }
}

/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
/**
 * CSS for laying out and displaying blocks and boxes
 */
:root {

    /* Consistent paddings */

    /* shadows */

    /* All z-index values should be listed here */

    /* widths */
}
/* basic setup for triangles in :before and :after pseudo-elements */
/* clears ul/ol defaults */
/* TODO Deprecated */
/* best pronounced with a texan drawl */
/* is this annoying yet? */
/* Marketing Button Mixins */
.confirmation-modal.modal-dialog {
        margin-top: 32px;
        border-radius: 4px;
        padding: 0;
    }
.confirmation-modal.modal-dialog .modal-header {
            display: -webkit-box;
            display: -webkit-flex;
            display: -moz-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
            -webkit-flex-flow: row wrap;
               -moz-box-orient: horizontal;
               -moz-box-direction: normal;
                -ms-flex-flow: row wrap;
                    flex-flow: row wrap;
            -webkit-box-align: center;
            -webkit-align-items: center;
               -moz-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
               -moz-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between;
            background: white;
            height: initial;
            padding: 32px 16px 0 32px;
            border-bottom: 0;
        }
.confirmation-modal.modal-dialog .modal-header .modal-close-button {
                color: #8a8c8f;
                -webkit-box-shadow: 0;
                        box-shadow: 0;
            }
.confirmation-modal.modal-dialog .modal-content {
            border-radius: 4px;
            background: white;
            padding: 0;
            overflow: visible;
        }
.confirmation-modal.modal-dialog .modal-body {
            padding: 32px;
        }
.confirmation-modal.modal-dialog .button-container {
            padding: 16px;
            display: -webkit-box;
            display: -webkit-flex;
            display: -moz-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
            -webkit-flex-flow: row wrap;
               -moz-box-orient: horizontal;
               -moz-box-direction: normal;
                -ms-flex-flow: row wrap;
                    flex-flow: row wrap;
            -webkit-box-pack: end;
            -webkit-justify-content: flex-end;
               -moz-box-pack: end;
                -ms-flex-pack: end;
                    justify-content: flex-end;
            -webkit-flex-wrap: wrap-reverse;
                -ms-flex-wrap: wrap-reverse;
                    flex-wrap: wrap-reverse;
            background-color: rgb(229, 242, 255);
            border-radius: 0 0 4px 4px;
        }
.confirmation-modal.modal-dialog .button-container a,
            .confirmation-modal.modal-dialog .button-container button {
                margin-left: 16px;
            }
@media (max-width: 40em) {
        .confirmation-modal.modal-dialog {
            margin: 8px;
            max-width: 100vw;
        }

            .confirmation-modal.modal-dialog .modal-header {
                padding: 24px;
            }

            .confirmation-modal.modal-dialog .modal-body {
                padding: 24px;
            }

            .confirmation-modal.modal-dialog .button-container {
                max-width: 100vw;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                   -moz-box-pack: center;
                    -ms-flex-pack: center;
                        justify-content: center;
                padding-bottom: 24px;
            }

                .confirmation-modal.modal-dialog .button-container a,
                .confirmation-modal.modal-dialog .button-container button {
                    margin: 8px;
                }
    }
.confirmation-modal .message {
        margin-bottom: 16px;
    }
.confirmation-modal .button-container .cancel-button {
            text-decoration: underline;
            cursor: pointer;
            padding: 0;
            margin: 8px 16px;
            background: transparent;
            border: none;
            color: rgb(29, 40, 48);
            -webkit-box-shadow: none;
                    box-shadow: none;
        }
.confirmation-modal .button-container .cancel-button:disabled {
        color: rgb(216, 217, 218);
        cursor: default;
    }
.confirmation-modal .button-container .confirm-button {
            display: inline-block;
            text-decoration: none;
            padding: 8px 16px;
            border-radius: 24px;
            cursor: pointer;
            -webkit-transition: all 0.2s ease-in;
            -o-transition: all 0.2s ease-in;
            transition: all 0.2s ease-in;
            text-align: center;
            display: inline-block;
            text-decoration: none;
            padding: 8px 16px;
            border-radius: 24px;
            cursor: pointer;
            transition: all 0.2s ease-in;
            text-align: center;
            border: 2px solid #005cb9;
            color: white;
            background-color: #005cb9;
        }
@media (max-width: 40em) {
.confirmation-modal .button-container .confirm-button {
        height: 50px;
        margin: 8px 0;
        padding: 16px 16px 8px 16px;
        text-align: center;
        width: 100%;
        }
    }
@media (max-width: 40em) {
.confirmation-modal .button-container .confirm-button {
        height: 50px;
        margin: 8px 0;
        padding: 16px 16px 8px 16px;
        text-align: center;
        width: 100%;
        }
    }
.confirmation-modal .button-container .confirm-button:hover {
        background-color: rgb(0, 76, 153);
        border-color: rgb(0, 76, 153);
    }
.confirmation-modal .button-container .confirm-button:disabled {
        border-color: #8a8c8f;
        background-color: #8a8c8f;
        color: white;
        cursor: default;
    }
@media (max-width: 40em) {
            .confirmation-modal.modal-dialog .modal-content .modal-header {
                padding: 16px 24px 8px;
            }

            .confirmation-modal.modal-dialog .modal-content .button-container {
                padding: 8px;
            }

                .confirmation-modal.modal-dialog .modal-content .button-container .cancel-button {
                    margin-top: 4px;
                    height: 35px;
                }
}

/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
/**
 * CSS for laying out and displaying blocks and boxes
 */
:root {

    /* Consistent paddings */

    /* shadows */

    /* All z-index values should be listed here */

    /* widths */
}
/* basic setup for triangles in :before and :after pseudo-elements */
/* clears ul/ol defaults */
/* TODO Deprecated */
/* best pronounced with a texan drawl */
/* is this annoying yet? */
/* Marketing Button Mixins */
.site-footer {
    color: white;
    z-index: 40;
    background: url(/static/shared/assets/FooterDesktop.5fa5dec473a57b27269c.png) no-repeat;
    background-size: cover;
}
.site-footer .content-wrapper {
        max-width: 1180px;
        margin: auto;
    }
.site-footer .site-footer-content {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
           -moz-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        padding: 32px 32px 0;
    }
.site-footer .site-footer-content .social-content {
            width: 296px;
            width: calc(99.9% * 1/3 - (16px - 16px * 1/3));
            -webkit-box-align: center;
            -webkit-align-items: center;
               -moz-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
        }
.site-footer .site-footer-content .social-content:nth-child(1n) {
            float: left;
            margin-right: 16px;
            clear: none;
        }
.site-footer .site-footer-content .social-content:last-child {
            margin-right: 0;
        }
.site-footer .site-footer-content .social-content:nth-child(0n) {
            float: right;
        }
.site-footer .site-footer-content .social-content .logo {
                width: 100%;
                height: 56px;
            }
.site-footer .site-footer-content .social-content .logo .footer-logo {
                    width: 100%;
                    height: 56px;
                    background: url(/static/gradifui/assets/Gradifi-Logo-Horiz-White.cad80791a89446a7ef0f.svg) left center no-repeat;
                    background-size: contain;
                }
.site-footer .site-footer-content .social-content .linkedin-logo {
                right: 2px;
                width: 96px;
                height: 32px;
                background: url(/static/gradifui/assets/linkedin_logo.a6ef97bce84a5262f729.svg) center no-repeat;
                background-size: contain;
            }
.site-footer .site-footer-content .link-content {
            display: -webkit-box;
            display: -webkit-flex;
            display: -moz-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
            -webkit-flex-direction: row;
               -moz-box-orient: horizontal;
               -moz-box-direction: normal;
                -ms-flex-direction: row;
                    flex-direction: row;
            width: calc(99.9% * 2/3 - (16px - 16px * 2/3));
            -webkit-box-pack: justify;
            -webkit-justify-content: space-between;
               -moz-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between;
            padding-top: 8px;
        }
.site-footer .site-footer-content .link-content:nth-child(1n) {
            float: left;
            margin-right: 16px;
            clear: none;
        }
.site-footer .site-footer-content .link-content:last-child {
            margin-right: 0;
        }
.site-footer .site-footer-content .link-content:nth-child(0n) {
            float: right;
        }
.site-footer .site-footer-content .link-content .static-columns {
                display: -webkit-box;
                display: -webkit-flex;
                display: -moz-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: horizontal;
                -webkit-box-direction: normal;
                -webkit-flex-direction: row;
                   -moz-box-orient: horizontal;
                   -moz-box-direction: normal;
                    -ms-flex-direction: row;
                        flex-direction: row;
                -webkit-box-flex: 0;
                -webkit-flex-grow: 0;
                   -moz-box-flex: 0;
                    -ms-flex-positive: 0;
                        flex-grow: 0;
                -webkit-flex-shrink: 0;
                    -ms-flex-negative: 0;
                        flex-shrink: 0;
                -webkit-flex-basis: calc(99.9% * 3/5 - (16px - 16px * 3/5));
                    -ms-flex-preferred-size: calc(99.9% * 3/5 - (16px - 16px * 3/5));
                        flex-basis: calc(99.9% * 3/5 - (16px - 16px * 3/5));
                max-width: calc(99.9% * 3/5 - (16px - 16px * 3/5));
                width: calc(99.9% * 3/5 - (16px - 16px * 3/5));
                -webkit-justify-content: space-around;
                    -ms-flex-pack: distribute;
                        justify-content: space-around;
            }
.site-footer .site-footer-content .link-content .static-columns:nth-child(1n) {
                margin-right: 16px;
                margin-left: 0;
            }
.site-footer .site-footer-content .link-content .static-columns:last-child {
                margin-right: 0;
            }
.site-footer .site-footer-content .link-content .static-columns:nth-child(5n) {
                margin-right: 0;
                margin-left: auto;
            }
/* No member support or demo column on employer-portal */
.site-footer .site-footer-content .link-content .employer-portal {
                -webkit-box-flex: 0;
                -webkit-flex-grow: 0;
                   -moz-box-flex: 0;
                    -ms-flex-positive: 0;
                        flex-grow: 0;
                -webkit-flex-shrink: 0;
                    -ms-flex-negative: 0;
                        flex-shrink: 0;
                -webkit-flex-basis: calc(99.9% * 1/1 - (16px - 16px * 1/1));
                    -ms-flex-preferred-size: calc(99.9% * 1/1 - (16px - 16px * 1/1));
                        flex-basis: calc(99.9% * 1/1 - (16px - 16px * 1/1));
                max-width: calc(99.9% * 1/1 - (16px - 16px * 1/1));
                width: calc(99.9% * 1/1 - (16px - 16px * 1/1));
            }
.site-footer .site-footer-content .link-content .employer-portal:nth-child(1n) {
                margin-right: 16px;
                margin-left: 0;
            }
.site-footer .site-footer-content .link-content .employer-portal:last-child {
                margin-right: 0;
            }
.site-footer .site-footer-content .link-content .employer-portal:nth-child(1n) {
                margin-right: 0;
                margin-left: auto;
            }
.site-footer .site-footer-content .link-content .about-gradifi {
                white-space: nowrap;
            }
.site-footer .site-footer-content .link-content .member-support-column,
            .site-footer .site-footer-content .link-content .demo-column {
                -webkit-box-flex: 0;
                -webkit-flex-grow: 0;
                   -moz-box-flex: 0;
                    -ms-flex-positive: 0;
                        flex-grow: 0;
                -webkit-flex-shrink: 0;
                    -ms-flex-negative: 0;
                        flex-shrink: 0;
                -webkit-flex-basis: calc(99.9% * 2/5 - (16px - 16px * 2/5));
                    -ms-flex-preferred-size: calc(99.9% * 2/5 - (16px - 16px * 2/5));
                        flex-basis: calc(99.9% * 2/5 - (16px - 16px * 2/5));
                max-width: calc(99.9% * 2/5 - (16px - 16px * 2/5));
                width: calc(99.9% * 2/5 - (16px - 16px * 2/5));
                max-width: 240px;
            }
.site-footer .site-footer-content .link-content .member-support-column:nth-child(1n),
            .site-footer .site-footer-content .link-content .demo-column:nth-child(1n) {
                margin-right: 16px;
                margin-left: 0;
            }
.site-footer .site-footer-content .link-content .member-support-column:last-child,
            .site-footer .site-footer-content .link-content .demo-column:last-child {
                margin-right: 0;
            }
.site-footer .site-footer-content .link-content .member-support-column:nth-child(5n),
            .site-footer .site-footer-content .link-content .demo-column:nth-child(5n) {
                margin-right: 0;
                margin-left: auto;
            }
.site-footer .site-footer-content .link-content ul {
                list-style: none;
                padding: 0;
                margin: 0;
            }
.site-footer .site-footer-content .link-content ul li {
                    padding-bottom: 24px;
                    font-size: 0.75rem;
                }
.site-footer .site-footer-content .link-content ul li a {
                        color: white;
                        text-decoration: none;
                    }
.site-footer .site-footer-content .link-content ul li a:hover {
                            color: #00a0d4;
                        }
.site-footer .site-footer-content .link-content ul .member-support-email {
                    word-break: break-word;
                }
.site-footer .site-footer-content .demo-login-content ul li {
            display: -webkit-box;
            display: -webkit-flex;
            display: -moz-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-direction: column;
               -moz-box-orient: vertical;
               -moz-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            -webkit-box-align: center;
            -webkit-align-items: center;
               -moz-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            text-align: center;
        }
.site-footer .site-footer-content .demo-login-content ul li a {
                text-decoration: none;
            }
.site-footer .site-footer-content .demo-login-content ul li a.btn-demo {
                font-size: 0.625rem;
                font-weight: 700;
                text-decoration: none;
                margin-top: 0;
                color: black;
            }
.site-footer .privacy-terms-row,
    .site-footer .cpra-button {
        border-bottom: 1px solid #5a666e;
        font-size: 0.75rem;
        padding: 8px 0;
    }
.site-footer .cpra-button {
        width: auto;
    }
.site-footer .privacy-terms-row {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
           -moz-box-orient: horizontal;
           -moz-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
           -moz-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
    }
.site-footer .privacy-terms-row li {
            display: inline-block;
            margin-right: 24px;
        }
.site-footer .privacy-terms-row a {
            text-decoration: none;
        }
.site-footer .privacy-terms-row .privacy-logged-in {
            display: -webkit-box;
            display: -webkit-flex;
            display: -moz-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
            -webkit-flex-direction: row;
               -moz-box-orient: horizontal;
               -moz-box-direction: normal;
                -ms-flex-direction: row;
                    flex-direction: row;
            margin-top: 8px;
            width: 100%;
            -webkit-box-pack: center;
            -webkit-justify-content: center;
               -moz-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
        }
.site-footer .privacy-terms-row .privacy-logged-in .privacy-section,
            .site-footer .privacy-terms-row .privacy-logged-in .terms-section {
                display: -webkit-box;
                display: -webkit-flex;
                display: -moz-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: horizontal;
                -webkit-box-direction: normal;
                -webkit-flex-direction: row;
                   -moz-box-orient: horizontal;
                   -moz-box-direction: normal;
                    -ms-flex-direction: row;
                        flex-direction: row;
                -webkit-box-pack: center;
                -webkit-justify-content: center;
                   -moz-box-pack: center;
                    -ms-flex-pack: center;
                        justify-content: center;
                margin-bottom: 16px;
            }
.site-footer .privacy-terms-row .privacy-logged-in a,
            .site-footer .privacy-terms-row .privacy-logged-in #cpra-button {
                margin-right: 24px;
            }
.site-footer .disclosure-row {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
           -moz-box-orient: horizontal;
           -moz-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
        font-size: 0.625rem;
    }
.site-footer .disclosure-row .disclosure-items {
            width: calc(99.9% * 1/2);
            padding: 16px;
        }
.site-footer .disclosure-row .disclosure-items:nth-child(1n) {
            float: left;
            margin-right: 0;
            clear: none;
        }
.site-footer .disclosure-row .disclosure-items:last-child {
            margin-right: 0;
        }
.site-footer .disclosure-row .disclosure-items:nth-child(0n) {
            float: right;
        }
@media (max-width: 60em) {
    .site-footer .site-footer-content {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
           -moz-box-orient: vertical;
           -moz-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }

        .site-footer .site-footer-content .social-content {
            margin: 0 auto 32px !important;
            width: calc(99.9% * 1/2 - (16px - 16px * 1/2));
        }

        .site-footer .site-footer-content .social-content:nth-child(1n) {
            float: left;
            margin-right: 16px;
            clear: none;
        }

        .site-footer .site-footer-content .social-content:last-child {
            margin-right: 0;
        }

        .site-footer .site-footer-content .social-content:nth-child(0n) {
            float: right;
        }

        .site-footer .site-footer-content .link-content {
            margin: 0 auto !important;
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
            -webkit-flex-direction: row;
               -moz-box-orient: horizontal;
               -moz-box-direction: normal;
                -ms-flex-direction: row;
                    flex-direction: row;
            -webkit-justify-content: space-around;
                -ms-flex-pack: distribute;
                    justify-content: space-around;
        }

            .site-footer .site-footer-content .link-content .static-columns {
                -webkit-box-flex: 0;
                -webkit-flex-grow: 0;
                   -moz-box-flex: 0;
                    -ms-flex-positive: 0;
                        flex-grow: 0;
                -webkit-flex-shrink: 0;
                    -ms-flex-negative: 0;
                        flex-shrink: 0;
                -webkit-flex-basis: calc(99.9% * 2/3 - (16px - 16px * 2/3));
                    -ms-flex-preferred-size: calc(99.9% * 2/3 - (16px - 16px * 2/3));
                        flex-basis: calc(99.9% * 2/3 - (16px - 16px * 2/3));
                max-width: calc(99.9% * 2/3 - (16px - 16px * 2/3));
                width: calc(99.9% * 2/3 - (16px - 16px * 2/3));
            }

            .site-footer .site-footer-content .link-content .static-columns:nth-child(1n) {
                margin-right: 16px;
                margin-left: 0;
            }

            .site-footer .site-footer-content .link-content .static-columns:last-child {
                margin-right: 0;
            }

            .site-footer .site-footer-content .link-content .static-columns:nth-child(3n) {
                margin-right: 0;
                margin-left: auto;
            }

            .site-footer .site-footer-content .link-content .member-support-column,
            .site-footer .site-footer-content .link-content .demo-column {
                -webkit-box-flex: 0;
                -webkit-flex-grow: 0;
                   -moz-box-flex: 0;
                    -ms-flex-positive: 0;
                        flex-grow: 0;
                -webkit-flex-shrink: 0;
                    -ms-flex-negative: 0;
                        flex-shrink: 0;
                -webkit-flex-basis: calc(99.9% * 1/3 - (16px - 16px * 1/3));
                    -ms-flex-preferred-size: calc(99.9% * 1/3 - (16px - 16px * 1/3));
                        flex-basis: calc(99.9% * 1/3 - (16px - 16px * 1/3));
                max-width: calc(99.9% * 1/3 - (16px - 16px * 1/3));
                width: calc(99.9% * 1/3 - (16px - 16px * 1/3));
            }

            .site-footer .site-footer-content .link-content .member-support-column:nth-child(1n),
            .site-footer .site-footer-content .link-content .demo-column:nth-child(1n) {
                margin-right: 16px;
                margin-left: 0;
            }

            .site-footer .site-footer-content .link-content .member-support-column:last-child,
            .site-footer .site-footer-content .link-content .demo-column:last-child {
                margin-right: 0;
            }

            .site-footer .site-footer-content .link-content .member-support-column:nth-child(3n),
            .site-footer .site-footer-content .link-content .demo-column:nth-child(3n) {
                margin-right: 0;
                margin-left: auto;
            }

                .site-footer .site-footer-content .link-content .member-support-column .member-support-phone,
                .site-footer .site-footer-content .link-content .member-support-column .member-support-email,
                .site-footer .site-footer-content .link-content .demo-column .member-support-phone,
                .site-footer .site-footer-content .link-content .demo-column .member-support-email {
                    white-space: nowrap;
                }
}
@media (max-width: 50em) {
    .site-footer {
        background: url(/static/shared/assets/FooterTablet.496cfa13de421ec361b6.png) no-repeat cover;
    }
            .site-footer .privacy-terms-row ul {
                padding-left: 16px;
                text-align: center;
            }

            .site-footer .privacy-terms-row .privacy-logged-in {
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-direction: column;
                   -moz-box-orient: vertical;
                   -moz-box-direction: normal;
                    -ms-flex-direction: column;
                        flex-direction: column;
            }

                .site-footer .privacy-terms-row .privacy-logged-in .privacy-section,
                .site-footer .privacy-terms-row .privacy-logged-in .terms-section {
                    -webkit-box-pack: left;
                    -webkit-justify-content: left;
                       -moz-box-pack: left;
                        -ms-flex-pack: left;
                            justify-content: left;
                    margin-left: 25%;
                }

                    .site-footer .privacy-terms-row .privacy-logged-in .privacy-section *, .site-footer .privacy-terms-row .privacy-logged-in .terms-section * {
                        width: 180px;
                        margin-right: 0;
                        text-align: left;
                    }
}
@media (max-width: 40em) {
    .site-footer {
        background: url(/static/shared/assets/FooterMobile.88cf36add9bb1c5dba68.png) no-repeat;
    }

        .site-footer .site-footer-content {
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-direction: column;
               -moz-box-orient: vertical;
               -moz-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            -webkit-box-align: center;
            -webkit-align-items: center;
               -moz-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            -webkit-box-flex: 1;
            -webkit-flex-grow: 1;
               -moz-box-flex: 1;
                -ms-flex-positive: 1;
                    flex-grow: 1;
            margin-bottom: 16px;
            padding: 16px 16px 0;
        }

            .site-footer .site-footer-content .social-content {
                width: 300px;
            }

            .site-footer .site-footer-content .link-content {
                max-width: 336px;
                width: 336px;
                min-height: 200px;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -webkit-flex-direction: column;
                   -moz-box-orient: vertical;
                   -moz-box-direction: normal;
                    -ms-flex-direction: column;
                        flex-direction: column;
            }

                .site-footer .site-footer-content .link-content .static-columns {
                    margin-left: 16px;
                    -webkit-box-flex: 0;
                    -webkit-flex-grow: 0;
                       -moz-box-flex: 0;
                        -ms-flex-positive: 0;
                            flex-grow: 0;
                    -webkit-flex-shrink: 0;
                        -ms-flex-negative: 0;
                            flex-shrink: 0;
                    -webkit-flex-basis: calc(99.9% * 1/1 - (16px - 16px * 1/1));
                        -ms-flex-preferred-size: calc(99.9% * 1/1 - (16px - 16px * 1/1));
                            flex-basis: calc(99.9% * 1/1 - (16px - 16px * 1/1));
                    max-width: calc(99.9% * 1/1 - (16px - 16px * 1/1));
                    width: calc(99.9% * 1/1 - (16px - 16px * 1/1));
                    -webkit-box-pack: justify;
                    -webkit-justify-content: space-between;
                       -moz-box-pack: justify;
                        -ms-flex-pack: justify;
                            justify-content: space-between;
                }

                .site-footer .site-footer-content .link-content .static-columns:nth-child(1n) {
                    margin-right: 16px;
                    margin-left: 0;
                }

                .site-footer .site-footer-content .link-content .static-columns:last-child {
                    margin-right: 0;
                }

                .site-footer .site-footer-content .link-content .static-columns:nth-child(1n) {
                    margin-right: 0;
                    margin-left: auto;
                }

                .site-footer .site-footer-content .link-content .member-support-column,
                .site-footer .site-footer-content .link-content .demo-column {
                    -webkit-box-flex: 0;
                    -webkit-flex-grow: 0;
                       -moz-box-flex: 0;
                        -ms-flex-positive: 0;
                            flex-grow: 0;
                    -webkit-flex-shrink: 0;
                        -ms-flex-negative: 0;
                            flex-shrink: 0;
                    -webkit-flex-basis: calc(99.9% * 1/1 - (16px - 16px * 1/1));
                        -ms-flex-preferred-size: calc(99.9% * 1/1 - (16px - 16px * 1/1));
                            flex-basis: calc(99.9% * 1/1 - (16px - 16px * 1/1));
                    max-width: calc(99.9% * 1/1 - (16px - 16px * 1/1));
                    width: calc(99.9% * 1/1 - (16px - 16px * 1/1));
                    margin: 16px auto 0;
                }

                .site-footer .site-footer-content .link-content .member-support-column:nth-child(1n),
                .site-footer .site-footer-content .link-content .demo-column:nth-child(1n) {
                    margin-right: 16px;
                    margin-left: 0;
                }

                .site-footer .site-footer-content .link-content .member-support-column:last-child,
                .site-footer .site-footer-content .link-content .demo-column:last-child {
                    margin-right: 0;
                }

                .site-footer .site-footer-content .link-content .member-support-column:nth-child(1n),
                .site-footer .site-footer-content .link-content .demo-column:nth-child(1n) {
                    margin-right: 0;
                    margin-left: auto;
                }

                    .site-footer .site-footer-content .link-content .member-support-column .member-support-phone, .site-footer .site-footer-content .link-content .demo-column .member-support-phone {
                        white-space: nowrap;
                    }

                    .site-footer .site-footer-content .link-content .member-support-column .member-support-email, .site-footer .site-footer-content .link-content .demo-column .member-support-email {
                        word-break: normal;
                    }

            .site-footer .site-footer-content .demo-login-content {
                min-height: 110px;
            }

        .site-footer *::-ms-backdrop,
        .site-footer .site-footer-content {
            margin: auto;
        }


        .site-footer .disclosure-row {
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-direction: column;
               -moz-box-orient: vertical;
               -moz-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
        }

            .site-footer .disclosure-row .disclosure-items {
                -webkit-box-flex: 0;
                -webkit-flex-grow: 0;
                   -moz-box-flex: 0;
                    -ms-flex-positive: 0;
                        flex-grow: 0;
                -webkit-flex-shrink: 0;
                    -ms-flex-negative: 0;
                        flex-shrink: 0;
                -webkit-flex-basis: calc(99.9% * 1);
                    -ms-flex-preferred-size: calc(99.9% * 1);
                        flex-basis: calc(99.9% * 1);
                max-width: calc(99.9% * 1);
                width: calc(99.9% * 1);
                padding-bottom: 0;
            }

            .site-footer .disclosure-row .disclosure-items:nth-child(1n) {
                margin-right: 0;
                margin-left: 0;
            }

            .site-footer .disclosure-row .disclosure-items:last-child {
                margin-right: 0;
            }

        .site-footer *::-ms-backdrop,
        .site-footer .disclosure-row {
            display: block;
        }

        .site-footer *::-ms-backdrop,
        .site-footer .disclosure-row .disclosure-items:last-of-type {
            padding-bottom: 32px;
        }

        .site-footer *::-ms-backdrop,
        .site-footer .site-footer-content .demo-login-content.demo-login-content {
            margin: auto;
        }

        .site-footer .privacy-terms-row ul {
            margin-bottom: 0;
        }

            .site-footer .privacy-terms-row ul li {
                margin-bottom: 8px;
            }
            .site-footer .privacy-terms-row .privacy-logged-in .privacy-section,
            .site-footer .privacy-terms-row .privacy-logged-in .terms-section {
                margin-left: 15%;
            }
}
@media (max-width: 30em) {
        .site-footer .privacy-terms-row .privacy-logged-in .privacy-section,
        .site-footer .privacy-terms-row .privacy-logged-in .terms-section {
            margin-left: 5%;
        }

            .site-footer .privacy-terms-row .privacy-logged-in .privacy-section *, .site-footer .privacy-terms-row .privacy-logged-in .terms-section * {
                width: 176px;
            }
}
@media (max-width: 23em) {
        .site-footer .site-footer-content .social-content {
            height: 48px;
            margin: 0 auto 32px;
        }

        .site-footer .site-footer-content .social-content,
        .site-footer .site-footer-content .link-content {
            width: 288px;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -webkit-flex-direction: column;
               -moz-box-orient: vertical;
               -moz-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
        }

            .site-footer .site-footer-content .social-content .static-columns, .site-footer .site-footer-content .link-content .static-columns {
                padding-top: 16px;
            }

        .site-footer .site-footer-content {

        padding: 8px;
    }
        .site-footer .privacy-terms-row .privacy-logged-in .privacy-section,
        .site-footer .privacy-terms-row .privacy-logged-in .terms-section {
            margin-left: 4%;
        }

            .site-footer .privacy-terms-row .privacy-logged-in .privacy-section *, .site-footer .privacy-terms-row .privacy-logged-in .terms-section * {
                width: 156px;
            }
}

/**
 * CSS for laying out and displaying blocks and boxes
 */
:root {

    /* Consistent paddings */

    /* shadows */

    /* All z-index values should be listed here */

    /* widths */
}
/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
a.btn-demo {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
       -moz-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    color: rgb(29, 40, 48);
    background-color: #fff;
    border: 2px solid #005cb9;
    -webkit-box-shadow: 0 21px 30px 0 rgba(0, 0, 0, 0.27);
            box-shadow: 0 21px 30px 0 rgba(0, 0, 0, 0.27);
    -webkit-transition:
        color 0.2s ease-in,
        background-color 0.2s ease-in,
        border-color 0.2s ease-in;
    -o-transition:
        color 0.2s ease-in,
        background-color 0.2s ease-in,
        border-color 0.2s ease-in;
    transition:
        color 0.2s ease-in,
        background-color 0.2s ease-in,
        border-color 0.2s ease-in;
}
a.btn-demo:hover {
        color: #fff;
        background-color: #005cb9;
        border-color: #fff;
    }
a.btn-demo {
    border-radius: 32px;
    font-size: 0.75rem;
    font-weight: 600;
    text-align: center;

    -webkit-box-shadow: none;

            box-shadow: none;
    font-size: 0.625rem;
    font-weight: 700;
    padding: 8px 16px;
    color: rgb(29, 40, 48);
    text-decoration: none;
}
a.btn-demo:hover {
        border-color: #005cb9;
    }

/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
/**
 * CSS for laying out and displaying blocks and boxes
 */
:root {

    /* Consistent paddings */

    /* shadows */

    /* All z-index values should be listed here */

    /* widths */
}
/* basic setup for triangles in :before and :after pseudo-elements */
/* clears ul/ol defaults */
/* TODO Deprecated */
/* best pronounced with a texan drawl */
/* is this annoying yet? */
/* Marketing Button Mixins */
#cpra-button {
    background: none;
    -webkit-transition: none;
    -o-transition: none;
    transition: none;
    border: none;
    -webkit-box-shadow: none;
            box-shadow: none;
    padding: 0;
    margin: 0;
    height: auto;
}
#cpra-button .privacy-options-icon {
        max-width: -webkit-fit-content;
        max-width: -moz-fit-content;
        max-width: fit-content;
        top: 2px;
    }

/**
 * TO BE DEPRECATED
 * Consider using *-common.css or common.css instead, or one of the categorical files below:
 */
/**
 * CSS for laying out and displaying blocks and boxes
 */
:root {

    /* Consistent paddings */

    /* shadows */

    /* All z-index values should be listed here */

    /* widths */
}
/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
/* basic setup for triangles in :before and :after pseudo-elements */
/* clears ul/ol defaults */
/* TODO Deprecated */
/* best pronounced with a texan drawl */
/* is this annoying yet? */
/* Marketing Button Mixins */
.session-expiring-modal .session-expiration-info p {
            margin-top: 16px;
        }
.session-expiring-modal .session-expiration-modal-buttons {
        border-top: 1px solid darkgray;
        margin-top: 16px;
        text-align: center;
    }
.session-expiring-modal .session-expiration-modal-buttons button {
            margin-top: 16px;
        }
.session-expiring-modal .session-expiration-modal-buttons .session-logout {
            margin-left: 65px;
        }
.session-expiring-modal .session-expiration-modal-buttons .session-extend {
            display: inline-block;
            text-decoration: none;
            padding: 8px 16px;
            border-radius: 24px;
            cursor: pointer;
            -webkit-transition: all 0.2s ease-in;
            -o-transition: all 0.2s ease-in;
            transition: all 0.2s ease-in;
            text-align: center;
            display: inline-block;
            text-decoration: none;
            padding: 8px 16px;
            border-radius: 24px;
            cursor: pointer;
            transition: all 0.2s ease-in;
            text-align: center;
            border: 2px solid #005cb9;
            color: white;
            background-color: #005cb9;
        }
@media (max-width: 40em) {
.session-expiring-modal .session-expiration-modal-buttons .session-extend {
        height: 50px;
        margin: 8px 0;
        padding: 16px 16px 8px 16px;
        text-align: center;
        width: 100%;
        }
    }
@media (max-width: 40em) {
.session-expiring-modal .session-expiration-modal-buttons .session-extend {
        height: 50px;
        margin: 8px 0;
        padding: 16px 16px 8px 16px;
        text-align: center;
        width: 100%;
        }
    }
.session-expiring-modal .session-expiration-modal-buttons .session-extend:hover {
        background-color: rgb(0, 76, 153);
        border-color: rgb(0, 76, 153);
    }
.session-expiring-modal .session-expiration-modal-buttons .session-extend:disabled {
        border-color: #8a8c8f;
        background-color: #8a8c8f;
        color: white;
        cursor: default;
    }
@media (max-width: 30em) {
            .session-expiring-modal .session-expiration-modal-buttons .session-logout {
                margin-left: 0;
            }
}

/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
/**
 * CSS for laying out and displaying blocks and boxes
 */
:root {

    /* Consistent paddings */

    /* shadows */

    /* All z-index values should be listed here */

    /* widths */
}
.mouseflow-id {
    font-size: 1.4rem;
    line-height: 1.2;
    font-weight: 600;
    font-family: 'Montserrat', Helvetica, sans-serif;

    text-align: center;
    color: white;
    background-color: rgb(29, 40, 48);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    position: relative;
    z-index: 200;
}
@media (max-width: 50em) {
.mouseflow-id {
        font-size: 1.7rem;
}
    }

/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
/**
 * CSS for laying out and displaying blocks and boxes
 */
:root {

    /* Consistent paddings */

    /* shadows */

    /* All z-index values should be listed here */

    /* widths */
}
/* basic setup for triangles in :before and :after pseudo-elements */
/* clears ul/ol defaults */
/* TODO Deprecated */
/* best pronounced with a texan drawl */
/* is this annoying yet? */
/* Marketing Button Mixins */
.legal {
    background-color: rgb(29, 40, 48);
}
.legal .footnotes {
        font-size: 0.725rem;
        line-height: 1.5;
        font-weight: 400;
        font-family: 'Montserrat', Helvetica, sans-serif;

        max-width: 990px;
        margin: 0 auto;
        padding: 32px 8px;
        color: white;
    }
.legal .footnotes .footnote {
            padding-bottom: 8px;
        }

/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
/**
 * CSS for laying out and displaying blocks and boxes
 */
:root {

    /* Consistent paddings */

    /* shadows */

    /* All z-index values should be listed here */

    /* widths */
}
/* basic setup for triangles in :before and :after pseudo-elements */
/* clears ul/ol defaults */
/* TODO Deprecated */
/* best pronounced with a texan drawl */
/* is this annoying yet? */
/* Marketing Button Mixins */
.session-page-logo {
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    background-image: url(/static/gradifui/assets/Gradifi-Logo-Horiz-White.cad80791a89446a7ef0f.svg);

    margin: 80px auto 0;
    width: 400px;
    height: 100px;
    background-size: contain;
    background-repeat: no-repeat;

    /* Make label text only accessible by screenreader */
    line-height: 0;
    font-size: 0;
    color: transparent;
}
@media (max-width: 40em) {
    .session-page-logo {
        width: 312px;
    }
}
@media (max-width: 23em) {
    .session-page-logo {
        width: 280px;
    }
}

/**
 * CSS for colors
 */
/* stylelint-disable color-no-hex */
:root {
    /* TIER ONE - DESCRIPTIVE NAMES */

    /* Default / Text color + Light background / Background color + Light text */        /* dark orange */          /* brand blue */           /* red */        /* purple */         /* dark green */          /* gray */            /* white */        /* yellow */

    /* Highlight / Text color + Dark background / Background color + Dark text */                                /* orange */            /* light red #f0425f */      /* light purple #ce51e1 */                                 /* bright green */                                  /* bright blue - brand color */                                /* light yellow */

    /* Alerts */

    /* Additional blues */         /* dark blue #003366 */  /* medium blue #0066cc */ /* light blue #c7e3ff */  /* light blue #e5f2ff */

    /* Additional reds */  /* light red #fbd0d7 */  /* dark red #8E0B21 */

    /* Additional greens */                                 /* dark green */ /* light green #e5fff1 */

    /* Additional purples */    /* extra light purple #f3d3f8 */       /* very light purple #f3d3f840 */

    /* Additional oranges */    /* light orange #ffe8cc */

    /* Grayscale Colors */  /* Near black */ /* Dark gray #1d2830 */  /* Formerly graphite */       /* medium gray */ /* #b1b2b4 */        /* #d8d9da */  /* Near white #f2f2f3 */

    /* TIER TWO - SEMANTIC NAMES */

    /* Product Colors */

    /* Component Colors */

    /* Partner/Refi Lender Colors */

    /* First Republic palette */    /* forest green */        /* gold hacienda */        /* tan gray concrete */      /* dark gray matterhorn */

    /* Visualization palette */

    /* Marketing Page Colors */ /* #1d2830; */ /* #005cb9; *//* #0f1519; */ /* #1d2830; */ /* #5a666e; *//* #8a8c8f; */ /* #b1b2b4; */ /* #d7d8d9; *//* #f2f2f3; */ /* #e5f2ff; */ /* #eddef0; */
}
/* this section is deprecated - prefer to use device-specific names if possible */
/* device based size names */
/* iPhone 5 width: 20em */
/* iPhone 6 width: */
/* iPhone 5 height: 35.5em */
/* iPhone 6 plus height: 46em */
/* iPad width: 48em */
/* iPad height: 64em */
.desktop {
    display: block;
}
.mobile {
    display: none;
}
@media (max-width: 30em) {
    .desktop {
        display: none;
    }

    .mobile {
        display: block;
    }
}
/**
 * CSS for text, titles, labels. word.
 */
/* Marketing Text Mixins */
/**
 * CSS for laying out and displaying blocks and boxes
 */
:root {

    /* Consistent paddings */

    /* shadows */

    /* All z-index values should be listed here */

    /* widths */
}
/* basic setup for triangles in :before and :after pseudo-elements */
/* clears ul/ol defaults */
/* TODO Deprecated */
/* best pronounced with a texan drawl */
/* is this annoying yet? */
/* Marketing Button Mixins */
.ie-not-supported {
    font-size: 0.875rem;
    padding: 16px;
    background: rgb(253, 231, 235);
}


/*# sourceMappingURL=session-views-login.3b8f99cd6c10fea9278b.css.map*/