/* Feedback 360 Template Colors */
:root {
    --fdbk-blue: #0091D5;
    --fdbk-dk-blue: #1C4E80;
    --fdbk-txt: #202020;
    --fdbk-warning: #ffd309;
    --fdbk-danger: #E9002b;
    --fdbk-grey-01: #F1F1F1;
    --fdbk-grey-02: #7E909A;
    --fdbk-grey-03: #666;
    --fdbk-aqua: #A5D8DD;
    --fdbk-green: #198754;
    --fdbk-orange: #EA6A47;
    --fdbk-link: #00699A;
}

/ /* danger - #D50027;*/
/*#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;
  /*  color: var(--fdbk-txt);*/
}

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::before, h2::after {
    content: "- ";
}*/

h2 {
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
    color: #fff;
    background-color: var(--fdbk-grey-02);
    /* color: var(--fdbk-dk-blue); */
    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: #fff;*/
    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;
}

    .btn.disabled, .btn:disabled, .btn.disabled:hover, .btn.disabled:active {
        opacity: .85;
        text-transform: none;
        padding: 3px 32px;
        color: var(--fdbk-grey-01);
        background: #fff;
        border: var(--fdbk-grey-01) 2px solid;
        margin: 1rem auto;
    }

.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: var(--fdbk-green) linear-gradient( 180deg,#588235,#588235) repeat-x !important;*/
    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-danger {
    text-transform: none;
    padding: 3px 32px;
    color: var(--fdbk-dk-blue);
/*    background: var(--fdbk-danger) linear-gradient( 180deg,#f26425,#f26425) repeat-x;
    border-color: var(--fdbk-danger);*/
    background: #fff;
    border: 2px solid var(--fdbk-dk-blue) !important;
    margin: 1rem auto;
}

    .btn-danger:not(:disabled):not(.disabled).active, .btn-danger:not(:disabled):not(.disabled):active, .show > .btn-danger.dropdown-toggle {
        color: #fff;
        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;
        background: #c90e50 linear-gradient( 180deg,#c90e50,#7c042f) repeat-x;
        border-color: var(--fdbk-danger);
        border: 2px solid var(--fdbk-danger) !important;
        box-shadow: none;
    }

.btn-warning {
    text-transform: none;
    padding: 3px 32px;
    color: var(--fdbk-dk-blue) !important;
    /*background: var(--fdbk-warning);
    border-color: var(--fdbk-warning);*/
    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-outline {
    border: 2px solid var(--fdbk-dk-blue) !important;
    color: var(--fdbk-dk-blue) !important;
    background: #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;
    /*border-bottom: 1px solid #e7f1dc;*/
    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;
}