/* Feedback 360 Template Colors */
/*
    Really nice brand deep amber: ffc001
    Brand orange: ed7d31
    Brand blue/green: 2e4f5c

*/

:root {
    --fdbk-blue: #2e4f5c;
    --bs-primary: #2e4f5c;
    --bs-pagination-color: #2e4f5c;
    --fdbk-dk-blue: #2e4f5c;
    --fdbk-txt: #202020;
    --fdbk-warning: #ffc001;
    --fdbk-danger: #E9002b;
    --fdbk-grey-01: #F1F1F1;
    --fdbk-grey-02: #7E909A;
    --fdbk-grey-03: #666;
    --fdbk-aqua: #A5D8DD;
    --fdbk-green: #198754;
    --fdbk-orange: #ed7d31;
    --fdbk-link: #00699A;
    --dt-row-selected: #2e4f5c;
}

.menu-border {
    border: 1px solid var(--fdbk-blue);
    border-radius: .5rem;
    padding: .5rem;
}

.navbar-light .nav-link, .navbar-light .text-dark {
    font-size: 1.2rem !important;
}

.fdbk-grid-btn {
    width: 170px;
}

.dt-select-checkbox {
    color: #2e4f5c30 !important;
    background-color: #2e4f5c30 !important;
}

.fdbk-white-bg {
    background-color: #fff;
}

table.table.dataTable > tbody > tr.selected > * {
    /*    box-shadow: inset 0 0 0 9999px rgb(13, 110, 253);*/
    box-shadow: inset 0 0 0 9999px #2e4f5c30 !important;
    color: #2e4f5c !important;
    box-shadow: inset 0 0 0 9999px #2e4f5c30 !important;
    color: #2e4f5c !important;
}

.fdbk-main-title a, .fdbk-main-title a:hover, .fdbk-main-title a:active, .fdbk-main-title a:visited {
    color: var(--fdbk-dk-blue);
    font-size: 2.75rem;
    font-weight: 600;
    text-transform: uppercase;
}

/*#region main html elements */
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

.roboto-thin {
    font-family: "Roboto", sans-serif;
    font-weight: 100;
    font-style: normal;
}

.roboto-thin-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 100;
    font-style: italic;
}

.roboto-light {
    font-family: "Roboto", sans-serif;
    font-weight: 300;
    font-style: normal;
}

.roboto-light-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 300;
    font-style: italic;
}

.roboto-regular {
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.roboto-regular-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    font-style: italic;
}

.roboto-medium {
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-style: normal;
}

.roboto-medium-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-style: italic;
}

.roboto-bold {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-style: normal;
}

.roboto-bold-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-style: italic;
}

.roboto-black {
    font-family: "Roboto", sans-serif;
    font-weight: 900;
    font-style: normal;
}

.roboto-black-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 900;
    font-style: italic;
}

body {
    overflow-x: hidden;
    background-color: var(--fdbk-grey-02);
    background-image: url(/images/stars-01.png);
    background-repeat: no-repeat;
    background-size: cover;
}

body, div, p, ul, li, span, label, h1, h2, h3, h4, h5, h6, table, tr, th, td, blockquote, input[type=text], .form-control {
    font-family: 'Roboto', sans-serif;
}

h1,
h3,
h4,
h5,
h6 {
    color: var(--fdbk-blue);
    text-transform: none;
    text-align: left;
    font-weight: normal;
    font-family: 'Roboto', sans-serif;
}

h1 {
    font-family: 'Roboto', sans-serif;
    font-size: 2.2rem;
}

h2 {
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
    color: #fff;
    background-color: var(--fdbk-grey-02);
    font-size: 1.7rem;
    border-radius: .5rem;
    padding: 1rem;
}

h3 {
    font-size: 1.3rem;
    font-family: 'Roboto', sans-serif;
    color: var(--fdbk-green);
}

h4 {
    font-size: 1.3rem;
    font-family: 'Roboto', sans-serif;
}

h5 {
    font-size: 1.2rem;
    font-family: 'Roboto', sans-serif;
}

h6 {
    font-size: 1.2rem;
    font-family: 'Roboto', sans-serif;
    color: var(--fdbk-green);
}

h7 {
    font-size: 1.1rem;
    font-family: 'Roboto', sans-serif;
    color: var(--fdbk-green);
    text-align: left;
    text-transform: none !important;
}

h8 {
    font-size: 1.1rem;
    font-family: 'Roboto', sans-serif;
    color: #fff;
    text-align: left;
    text-transform: none !important;
}

h9 {
    font-size: 1.1rem;
    font-family: 'Roboto', sans-serif;
    color: var(--fdbk-lt-blue-01);
    text-align: left;
    text-transform: none !important;
}

p, ol > li, ul > li {
    font-size: .9rem;
}

p {
    line-height: 1.2rem;
}

a {
    color: var(--fdbk-link);
}

    a:hover {
        color: var(--fdbk-link);
    }

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}

.fdbk-page-container {
    border-radius: .5rem;
    padding: 1.5rem 1.5rem 2rem 1.5rem;
    margin-bottom: 3rem;
    background-color: rgba(255, 255, 255, 0.9);
    min-height: 800px;
}

.fdbk-user-display {
    color: var(--fdbk-dk-blue);
    background-color: var(--fdbk-grey-01);
    border-radius: .25rem;
}

.fdbk-lt-prompt {
    padding: .25rem 1rem;
    color: #fff;
    font-weight: bold;
}
/*#endregion main html elements */

/*#region navs */

.fdbk-top-nav {
    background-color: var(--fdbk-dk-blue);
    color: #fff;
    padding: .25rem;
    min-height: 45px;
    vertical-align: middle;
}

    .fdbk-top-nav a, .fdbk-top-nav a:hover, .fdbk-top-nav a:active, .fdbk-top-nav a:visited {
        color: #fff;
        font-size: .9rem;
        padding: 0 .25rem;
        text-decoration: none;
    }

    .fdbk-top-nav .bi {
        color: #fff;
    }

    .fdbk-top-nav .btn-primary {
        margin: 0;
        background-color: var(--fdbk-blue);
        font-size: .9rem;
        border: 1px solid #fff;
        color: #fff;
    }

        .fdbk-top-nav .btn-primary:hover {
            margin: 0;
            background-color: var(--fdbk-blue);
            font-size: .9rem;
            border: 1px solid #fff;
            color: #fff;
        }

.navbar-light .nav-link, .navbar-light .text-dark {
    color: var(--fdbk-dk-blue) !important;
    font-size: 1.5rem;
}

.navbar-light .dropdown-item {
    color: var(--fdbk-dk-blue) !important;
}

    .navbar-light .dropdown-item.active, .navbar-light .dropdown-item:active {
        background-color: var(--fdbk-dk-blue) !important;
        color: #fff !important;
    }

/*#endregion navs */

/*#region buttons */
.fdbk-link-button {
    color: var(--fdbk-link);
    text-decoration: underline;
    cursor: pointer;
}

.fdbk-link-button-01 {
    color: var(--fdbk-link);
    text-decoration: underline;
    cursor: pointer;
    font-size: .8rem;
    font-weight: bold;
}

.btn {
    max-width: 16.25rem;
    font-size: .9rem;
}

.btn-primary, .btn-info, btn-danger, btn-outline {
    font-size: 1.1rem;
}

.disabled, .btn.disabled, .btn:disabled, .btn.disabled:hover, .btn.disabled:active, .btn[disabled] {
    opacity: .35;
}

.btn-primary {
    text-transform: none;
    padding: 3px 32px;
    color: #fff !important;
    background: var(--fdbk-dk-blue) linear-gradient( 180deg,#1C4E80,#1C4E80) repeat-x;
    border: var(--fdbk-dk-blue) 2px solid;
    margin: 1rem auto;
}

    .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
        color: #fff !important;
        background-color: var(--fdbk-dk-blue);
        border-color: var(--fdbk-dk-blue);
        box-shadow: none;
    }

        .btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show > .btn-primary.dropdown-toggle:focus {
            box-shadow: none;
        }

    .btn-primary:hover {
        color: var(--fdbk-dk-blue) !important;
        background: #fff;
        border: var(--fdbk-dk-blue) 2px solid;
    }

.btn-info {
    text-transform: none;
    padding: 3px 32px;
    color: var(--fdbk-dk-blue) !important;
    background: #1C4E80;
    border: var(--fdbk-dk-blue) 2px solid;
    margin: 1rem auto;
    font-weight: 600;
}

    .btn-info:not(:disabled):not(.disabled).active, .btn-info:not(:disabled):not(.disabled):active, .show > .btn-info.dropdown-toggle {
        color: var(--fdbk-dk-blue) !important;
        background-color: #1C4E80;
        border-color: var(--fdbk-dk-blue);
        box-shadow: none;
    }

        .btn-info:not(:disabled):not(.disabled).active:focus, .btn-info:not(:disabled):not(.disabled):active:focus, .show > .btn-info.dropdown-toggle:focus {
            box-shadow: none;
        }

    .btn-info:hover {
        color: var(--fdbk-dk-blue) !important;
        background: #fff;
        border: var(--fdbk-dk-blue) 2px solid;
    }

    .btn-info.focus, .btn-info:focus {
        background-color: #1C4E80 !important;
        background: #1C4E80 !important;
        border-color: #1C4E80 !important;
        box-shadow: none !important;
    }

.btn-success {
    text-transform: none;
    padding: 3px 32px;
    color: #fff;
    background-color: var(--fdbk-green) !important;
    border: var(--fdbk-green) 2px solid !important;
    margin: 1rem auto;
}

    .btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active, .show > .btn-success.dropdown-toggle {
        color: #fff;
        background-color: var(--fdbk-green) !important;
        border: var(--fdbk-green) 2px solid !important;
        box-shadow: none;
    }

        .btn-success:not(:disabled):not(.disabled).active:focus, .btn-success:not(:disabled):not(.disabled):active:focus, .show > .btn-success.dropdown-toggle:focus {
            box-shadow: none;
        }

    .btn-success:hover {
        color: var(--fdbk-green) !important;
        background: #fff !important;
        border: var(--fdbk-green) 2px solid !important;
        box-shadow: none;
    }

.btn-warning {
    text-transform: none;
    padding: 3px 32px;
    color: var(--fdbk-dk-blue) !important;
    background: #fff;
    border: 2px solid var(--fdbk-dk-blue) !important;
    margin: 1rem auto;
}

    .btn-warning:not(:disabled):not(.disabled).active, .btn-warning:not(:disabled):not(.disabled):active, .show > .btn-warning.dropdown-toggle {
        color: #fff !important;
        background-color: var(--fdbk-warning);
        border-color: var(--fdbk-warning);
        box-shadow: none;
    }

        .btn-warning:not(:disabled):not(.disabled).active:focus, .btn-warning:not(:disabled):not(.disabled):active:focus, .show > .btn-warning.dropdown-toggle:focus {
            box-shadow: none;
        }

    .btn-warning:hover {
        color: #fff !important;
        background: var(--fdbk-warning) linear-gradient( 180deg,#ffd309,#EA6A47) repeat-x;
        border: 2px solid var(--fdbk-warning) !important;
        box-shadow: none;
    }

.btn-danger {
    border: 2px solid var(--fdbk-danger) !important;
    color: var(--fdbk-danger) !important;
    background: #fff !important;
}

    .btn-danger:not(:disabled):not(.disabled).active, .btn-danger:not(:disabled):not(.disabled):active, .show > .btn-danger.dropdown-toggle {
        color: #fff !important;
        background-color: var(--fdbk-danger);
        border-color: var(--fdbk-danger);
        box-shadow: none;
    }

        .btn-danger:not(:disabled):not(.disabled).active:focus, .btn-danger:not(:disabled):not(.disabled):active:focus, .show > .btn-danger.dropdown-toggle:focus {
            box-shadow: none;
        }

    .btn-danger:hover {
        color: #fff !important;
        background-color: var(--fdbk-danger) !important;
        border: 2px solid var(--fdbk-danger) !important;
        box-shadow: none;
    }

    .btn-danger i {
        color: var(--fdbk-danger) !important;
    }

        .btn-danger:hover i {
            color: #fff !important;
        }

.btn-outline {
    border: 2px solid var(--fdbk-dk-blue) !important;
    color: var(--fdbk-dk-blue) !important;
    background: #fff !important;
}

    .btn-outline:not(:disabled):not(.disabled).active, .btn-outline:not(:disabled):not(.disabled):active, .show > .btn-outline.dropdown-toggle {
        color: #fff !important;
        background-color: var(--fdbk-dk-blue);
        border-color: var(--fdbk-dk-blue);
        box-shadow: none;
    }

        .btn-outline:not(:disabled):not(.disabled).active:focus, .btn-outline:not(:disabled):not(.disabled):active:focus, .show > .btn-outline.dropdown-toggle:focus {
            box-shadow: none;
        }

    .btn-outline:hover {
        color: #fff !important;
        background-color: var(--fdbk-dk-blue) !important;
        border: 2px solid var(--fdbk-dk-blue) !important;
        box-shadow: none;
    }

        .btn-outline:hover i {
            color: #fff !important;
        }

.btn-left {
    margin: 1rem 0 !important;
    float: left !important;
}

.fdbk-plain-button {
    background: none;
    border: none;
}

.fdbk-cancel-footer {
    font-size: .7rem;
    color: black;
    padding: 5px 32px;
    margin-top: 1rem;
    height: 1.6rem;
    border: none;
    background-color: #fff;
    box-shadow: 0 1px 4px rgb(0 0 0 / 40%);
    transition: color .4s,background-color .4s,border-color .4s,box-shadow .4s;
}

.fdbk-yes-footer {
    box-shadow: 1px 1px 4px rgb(0 0 0 / 40%);
    font-size: .7rem;
}

.fdbk-display-flex {
    display: flex !important;
}

.fdbk-footer-btn {
    font-size: .9rem;
    padding: .4rem 1.5rem;
    margin-top: 1.45rem !important;
    height: 34px !important;
    display: none;
}

.fdbk-btn-margin {
    width: 100%
}
/*#endregion buttons */
/*#region grids */

table {
    border: 1px solid var(--fdbk-grey-01);
    border-radius: .25rem;
    padding: 1.5rem;
}

th, tr, td, td a, td a:active, td a:visited, td a:hover, td p, td span, td div {
    font-size: .9rem;
    vertical-align: middle;
}

.table thead th {
    vertical-align: middle;
    background-color: var(--fdbk-grey-03);
}

thead th {
    color: var(--fdbk-txt);
    background-color: #fff;
    font-size: .8rem;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: #e7f1dc;
}

.fdbk-col-narrow-00 {
    width: 8px !important;
}

.fdbk-col-narrow-01 {
    width: 30px !important;
}

.fdbk-col-narrow-02 {
    width: 40px !important;
}

.fdbk-col-narrow-03 {
    width: 50px !important;
}

.fdbk-col-narrow-04 {
    width: 60px !important;
}

.fdbk-col-narrow-05 {
    width: 70px !important;
}

.fdbk-col-narrow-06 {
    width: 80px !important;
}

.fdbk-col-narrow-07 {
    width: 90px !important;
}

.fdbk-col-narrow-08 {
    width: 100px !important;
}

.fdbk-col-narrow-09 {
    width: 120px !important;
}

.fdbk-col-med-01 {
    width: 150px !important;
}

.fdbk-col-med-02 {
    width: 160px !important;
}

.fdbk-col-med-03 {
    width: 170px !important;
}

.fdbk-col-med-04 {
    width: 180px !important;
}

.fdbk-col-med-05 {
    width: 190px !important;
}

.fdbk-col-med-06 {
    width: 200px !important;
}

.fdbk-col-med-07 {
    width: 210px !important;
}

.fdbk-col-med-08 {
    width: 220px !important;
}

.fdbk-col-med-09 {
    width: 230px !important;
}

.fdbk-col-lg-01 {
    width: 260px !important;
}

.fdbk-col-lg-02 {
    width: 270px !important;
}

.fdbk-col-lg-03 {
    width: 280px !important;
}

.fdbk-col-lg-04 {
    width: 290px !important;
}

.fdbk-col-lg-05 {
    width: 300px !important;
}

.fdbk-col-lg-06 {
    width: 310px !important;
}

.fdbk-col-lg-07 {
    width: 320px !important;
}

.fdbk-col-lg-08 {
    width: 330px !important;
}

.fdbk-col-lg-09 {
    width: 340px !important;
}

.fdbk-col-xlg-01 {
    width: 370px !important;
}

.fdbk-col-xlg-02 {
    width: 380px !important;
}

.fdbk-col-xlg-03 {
    width: 390px !important;
}
/* Bootstrap div based grid */
.fdbk-grid {
    margin-top: 6px;
    margin-bottom: 6px;
    font-size: .8rem;
}

    .fdbk-grid .row {
        padding: .2rem;
        min-height: 30px;
        border-top: 1px solid var(--fdbk-grey-02);
    }

        .fdbk-grid .row:first-child {
            border-top: none;
        }

    .fdbk-grid .col {
        padding: .2rem;
        min-height: 30px;
    }

    .fdbk-grid .control-col {
        max-width: 2rem;
    }

    .fdbk-grid .fdbk-vert-align {
        display: flex;
        align-items: center;
    }

    .fdbk-grid .fdbk-right-align {
        display: flex;
        justify-content: right;
    }

    .fdbk-grid .fdbk-sp-balance-fund-grid-heading {
        vertical-align: middle;
        border-bottom: 1px solid var(--fdbk-lt-green);
        font-weight: bold;
    }

table.dataTable thead > tr > th.dt-orderable-asc:hover, table.dataTable thead > tr > th.dt-orderable-desc:hover, table.dataTable thead > tr > td.dt-orderable-asc:hover, table.dataTable thead > tr > td.dt-orderable-desc:hover {
    outline: none !important;
    outline-offset: -2px;
}

.page-item.active .page-link {
    z-index: 3;
    color: #fff;
    background-color: var(--fdbk-dk-blue);
    border-color: var(--fdbk-dk-blue);
}

.page-link:hover {
    z-index: 2;
    color: var(--fdbk-blue);
}
/*#endregion grids */
/*#region icons */

.bi {
    color: var(--fdbk-dk-blue);
    font-size: 1.2rem;
    vertical-align: middle;
}
/*#endregion icons */
/*#region survey */

.fdbk-survey li {
    margin: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px dashed var(--fdbk-grey-02);
}

.fdbk-survey span {
    display: inline-block;
    margin: 0 2rem 0 0;
}

.fdbk-survey textarea {
    height: 10rem;
    width: 100%;
    border-radius: .25rem;
}
/*#endregion survey */
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {
    border: 1px solid var(--fdbk-blue) !important;
    background: var(--fdbk-dk-blue) !important;
    font-weight: normal;
    color: #fff;
}

.fdbk-file-upload-container {
    border: 2px solid var(--fdbk-grey-02);
    border-radius: .5rem;
    padding: 1rem;
}

    .fdbk-file-upload-container input {
        width: 100%;
    }

.relationship-table input[type=text] {
    border: none !important;
    max-width: 1.5rem;
}

#dragRoot ol:first-child {
    margin: 1.5rem;
    font-weight: bold;
    cursor: pointer;
}

#dragRoot ol li ol li {
    margin: 1rem;
    font-weight: normal;
    cursor: pointer;
}

.modal-dialog h2 {
    margin-top: 1rem;
}

.participant-icon {
    color: var(--fdbk-danger);
}

.subject-icon {
    color: var(--fdbk-dk-blue);
}

.reorder {
    cursor: pointer;
}

sticky-top {
    top: 30px;
}

.progress-bar {
    background-color: var(--fdbk-dk-blue);
}

.fdbk-color-swatch {
    display: block;
    margin: .5rem;
    height: 1rem;
    width: 1rem;
}

.fdbk-color-picker {
    width: 50px;
}

input[type="color" i]::-webkit-color-swatch,
input[type="color" i]::-moz-color-swatch {
    border-radius: 50%;
    width: 50px;
}

.fdbk-inline-label {
    vertical-align: middle;
    margin: 0;
    padding: 0 !important;
}

.dropdown-item {
    font-size: 1.5rem;
}

.merge-user-border {
    border-right: 3px solid var(--fdbk-dk-blue);
}

.merge-user-label {
    color: #fff;
    background-color: var(--fdbk-dk-blue);
    padding: .5rem;
    border-radius: .5rem;
}

#mergeForm p {
    margin: .5rem auto;
    background-color: #e9ecef;
    padding: .3rem;
    border-radius: .25rem
}

#mergeForm span {
    display: inline-block;
    min-height: 2rem;
    line-height: 2rem;
    border-radius: .25rem;
}

#mergeForm .label {
    width: 35%;
    font-weight: normal;
    padding: 0 .5rem;
    margin: 0;
}

#mergeForm .value {
    width: 65%;
    background-color: #fff;
    text-align: right;
    font-weight: bold;
    padding: 0 1rem 0 0;
    margin: 0;
}

.survey-table th {
    padding: .5rem;
    background-color: var(--fdbk-dk-blue) !important;
    color: #fff;
    min-width: 125px;
    text-align: center !important;
}

.survey-table td:first-child {
    text-align: left;
}

.survey-table td {
    padding: 1rem;
    min-width: 125px;
    text-align: center;
}

.progress-bar {
    padding: 1rem;
    background-color: var(--fdbk-dk-blue);
    color: #fff;
    min-height: 48px;
    min-width: 130px;
    text-align: left;
}

.survey-validation-error {
    border: 3px solid red;
}