/*
    Primary Blue:   #25589D

    Sky Blue:       #43AEE3
    -Text on l-bg   #307CA2
    -Text on d-bg   #68BEE9
    
    Royal Blue:     #323087

    Coral:          #F05168
    -Text on l-bg   #DD3058

    Light Coral:    #F37D7C 
    -Text on d-bg   #FD8A8A 

    Dark bg footer: #272727
     
*/
hr {
    /*color: #43AEE3;*/
}
.cs-color-primary-color {
    color: #25589D;
}

.cs-header-nav, .cs-header-nav:hover {
    color: #fff;
}
.cs-color-coral {
    color: #F05168
}
.cs-color-coral-txt {
    color: #DD3058
}
/* google material hard-code fill*/
.material-symbols-rounded {
    font-variation-settings: 'FILL' 1;
}

/* client source css */
 
/* standard html tags */
body {
    background-color: #FEFFFF;
    /*background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='728' height='728' viewBox='0 0 800 800'%3E%3Cg fill='none' stroke='%23F1F2F5' stroke-width='1'%3E%3Cpath d='M769 229L1037 260.9M927 880L731 737 520 660 309 538 40 599 295 764 126.5 879.5 40 599-197 493 102 382-31 229 126.5 79.5-69-63'/%3E%3Cpath d='M-31 229L237 261 390 382 603 493 308.5 537.5 101.5 381.5M370 905L295 764'/%3E%3Cpath d='M520 660L578 842 731 737 840 599 603 493 520 660 295 764 309 538 390 382 539 269 769 229 577.5 41.5 370 105 295 -36 126.5 79.5 237 261 102 382 40 599 -69 737 127 880'/%3E%3Cpath d='M520-140L578.5 42.5 731-63M603 493L539 269 237 261 370 105M902 382L539 269M390 382L102 382'/%3E%3Cpath d='M-222 42L126.5 79.5 370 105 539 269 577.5 41.5 927 80 769 229 902 382 603 493 731 737M295-36L577.5 41.5M578 842L295 764M40-201L127 80M102 382L-261 269'/%3E%3C/g%3E%3Cg fill='%23F2FAFE'%3E%3Ccircle cx='769' cy='229' r='5'/%3E%3Ccircle cx='539' cy='269' r='5'/%3E%3Ccircle cx='603' cy='493' r='5'/%3E%3Ccircle cx='731' cy='737' r='5'/%3E%3Ccircle cx='520' cy='660' r='5'/%3E%3Ccircle cx='309' cy='538' r='5'/%3E%3Ccircle cx='295' cy='764' r='5'/%3E%3Ccircle cx='40' cy='599' r='5'/%3E%3Ccircle cx='102' cy='382' r='5'/%3E%3Ccircle cx='127' cy='80' r='5'/%3E%3Ccircle cx='370' cy='105' r='5'/%3E%3Ccircle cx='578' cy='42' r='5'/%3E%3Ccircle cx='237' cy='261' r='5'/%3E%3Ccircle cx='390' cy='382' r='5'/%3E%3C/g%3E%3C/svg%3E");*/
    font-family: 'Roboto', Arial;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

h4, h5, h6 {
    color: #323087;
}

h1 {
    font-size: 1.5rem;
    color: #25589D;
    display: block;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
    unicode-bidi: isolate;
}
.cs-h1 {
    border-bottom: 1px solid;
    padding-bottom: 17px;
}
a {
    cursor: pointer;
    text-decoration: none;
}

    a:hover {
        text-decoration: underline;
    }

::placeholder {
    color: #808284;
    font-size: .8em;
}

table th {
    /*color: #005FAE;*/
    /*font-size: 18px;*/
    font-weight: 500;
}

table td {
    vertical-align: middle;
    padding: 0px 5px !important;
}

/* sub table headers */
.col-title {
    /*font-size: 18px;*/
    font-weight: 500 !important;
}

.cs-header-sub-text {
    font-size: 1.1rem;
    font-weight: 300;
    color: #DD3058; 
}

.cs-global-search-header .cs-header-sub-text {
    font-size: 1.0rem;
}

.cs-global-search-header h5 span {
}

.cs-global-search-header div.cs-header-sub-text {
    font-size: 1.0rem;
}

.cs-header-ui2 {
    /*border-bottom: 1px solid;*/
    position: relative;
    top: -6px;
    /*padding-bottom: 3px;*/
}

.cs-3d {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.cs-header-search {
}
.cs-table-col-fix thead tr th {
    padding: .5rem .0rem !important;
} 
.cs-sub-table {
    background: #f9f9f9;
    border: 1px solid lightgrey;
    border-radius: 5px;
    
}

    .cs-sub-table td {
        padding: 8px !important;
    }

    .cs-sub-table th {
        padding: .5rem .0rem !important;
    }
.cs-reports-table {
    background: #f9f9f9;
    border: 1px solid lightgrey;
    border-radius: 5px;
}

    .cs-reports-table td {
        padding: 8px !important;
    }

    .cs-reports-table th {
        padding: .5rem .5rem !important;
    }

table .table-empty {
    margin: 20px;
}

table > :not(caption) > * > * {
    padding: .5rem .0rem !important;
}

/* axspoint reports */
#axspoint-report {
    text-align: center;
}

.axspoint-report-body {
    min-height: 80vh;
}

.modal-dialog {
    max-width: 80%;
    margin: 1.75rem auto;
}

.spacer-width-20 {
    margin-right: 20px;
}

.spacer-width-50 {
    margin-right: 100px;
}

.spacer-width-100 {
    margin-right: 100px;
}

.spacer-width-150 {
    margin-right: 150px;
}

.spacer-width-200 {
    margin-right: 200px;
}

.page-controls {
    border: 0px;
    border-radius: 25px;
    padding: 5px;
    margin: 5px;
}

.tooltips {
    position: relative;
    display: inline-block;
    cursor: default;
}

    .tooltips .tooltipstext {
        visibility: hidden;
        padding: 0.25em 0.5em;
        font-size: 0.85rem;
        background-color: lightyellow;
        color: black;
        border: 2px solid #dcdcdc;
        border-radius: 4px;
        width: 220px;
        word-break: break-word;
        /* Position the tooltip */
        position: absolute;
        z-index: 1;
        transition-property: visibility;
        transition-delay: 0s;
        left: -215px;
    }

    .tooltips:hover .tooltipstext {
        visibility: visible;
        transition-delay: 0.3s;
    }

/* bootstrap overrides */ 

.form-control {
    border-radius: 0px !important;
}
.alert { 
    margin-bottom: .2rem;
}
.btn:hover {
    /*color: #333 !important;*/
}

#coverage-tabs .nav-link {
    color: lightgray !important
}

    #coverage-tabs .nav-link.active {
        color: #2f5cab !important;
    }

#coverage-tabs-content p {
    color: black !important
}

.active {
    color: #2f5cab !important;
}

/* document viewer */
iframe {
}

.iframe-display {
    width: 100%;
    height: 60vh;
}

cs-tabular-data {
    font-size: .8em;
}

.display_window_box {
    width: 100%;
    margin-bottom: 100px;
}

/* client source */
.cs-page {
    margin: 15px 3%;
    padding: 20px 50px 10px 50px;
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
}

.cs-ui-form-fix {
    /*max-width: 1600px;*/
}

.cs-main-page .tall-page,
.cs-main-page.tall-page {
    height: 190vh !important;
}

.cs-page .tall-page, .cs-page.tall-page {
    /*height: 200vh !important;*/
}

.cs-login-page {
    /*display: flex;
    justify-content: center;
    text-align: center;*/
    margin: 100px 0px;
}
.footer-blue-bar::before {
    /*content: "desktop screen";*/
}
.cs-login-marquee {
    /*border: 1px solid #f1f1f1;
    margin: 10px;
    
    margin-left: 10%;
    border-radius: 10px;*/
    margin: 50px 15% 15% 15%;
}

    .cs-login-marquee div {
       /* color: #005FAE;
        font-size: 2em;*/
    }

    .cs-login-marquee p {
        color: #808284;
        font-size: 1.0em;
        /*line-height: 2;*/
        text-align: left;
    }

    .cs-login-marquee div span {
        font-size: .8em;
    }

    .cs-login-marquee #cs_application_name {
        /*height: 55px;*/
    }

.cs-login-title {
    color: #005FAE;
    text-align: center;
    font-size: 1.2em;
}

    .cs-login-title span {
        font-size: .7em;
    }
.cs-login-body {
    margin: 0px 40px 40px;
}

.cs-login-container {
    content: "normal";
    border: 1px solid #43AEE3;
    /*height: 500px;*/
    /*border-radius: 10px;*/
    /* margin: 10px 10px 10px 10px;*/
    /*padding: 30px;*/
    width: 400px;
    /* text-align: center;*/
    vertical-align: top; 
}

    .cs-login-container .cs-login-header {
        background: #43AEE3;
        padding: 15px 0px 15px 40px;
        color: #fff;
        font-size: 1.6rem;
    }
    .cs-login-container input[type=text],
    .cs-login-container input[type=password] {
        background: #f1f1f1;
        padding: 10px;
    }
.cs-logout:hover {
    color:#fff;
}
.cs-tab {
    color: #57575B;
    font-size: 1.1em;
}
.cs-header-login {
    background-color: #323087;
    padding: 15px;
}
.cs-header {
    /*background-color: #323087;*/
    padding:15px;
}
    .cs-header .cs-header-menu {
        position: absolute;
        top: 1px;
        right: 120px;
        font-size: .8rem;
    }

    .cs-header .cs-logo {
        height: 65px;
    } 

    .cs-header #cs_application_logo_white {
        height: 55px;
        position: relative;
        left: 30px;
    }

.cs-header-sub {
    background-color: #323087;
    /*border-bottom: 4px solid #43AEE3;*/
    padding-top: 5px;
    padding-bottom: 5px;
}

.cs-link {
    text-decoration: underline;
    color: #25589D;
}

    .cs-link:hover { 
        color: #43AEE3;
    }

.cs-link2 {
    margin: 6px;
    text-decoration: none;
}

.cs-link-social {
    text-decoration: none;
    color: #fff;
}
    .cs-link2:hover {
        text-decoration: underline;
    }
.cs-link2-reset {
    margin: 0px !important;
}
    .cs-label {
        font-size: .9em;
        font-weight: 600;
        color: #444 !important; 
    }
.cs-label-top {
    font-size: .9em;
    color: #444;
    padding-top: 20px;
    font-weight: 600;
    padding: 10px 0px 5px 0px;
}

.cs-ddl-client {
    width: 150px;
}

.cs-select-client {
    width: 350px;
    height: 35px;
}
    .cs-select-client option.active,
    .cs-select-client option:active {
        background-color: #43AEE3;
    }
    .cs-loan-search-box {
        width: 225px;
        height: 35px;
    }

.cs-last-login {
    font-size: 0.7rem;
    position: relative; 
    right: -9px;
}

.cs-setting-dropwdown {
    margin-right: 2px;
}

.cs-company-name {
}

    .cs-company-name #natgen_logo_white {
        height: 55px;
    }

.cs-card-icon {
    font-size: 1.2rem !important;
    font-weight: 400 !important;
    color: #fff;
}
.card {
    border: 1px solid #43aee3;
    border-radius: 0px;
}
    .card .card-header {
        background-color: #43aee3;
        border-radius: 0px;
    }
.card .card-body label {
   /* font-weight: 400;
    color: #222;
    font-size: 0.95rem;*/
}
.cs-form-control {
    border-radius: 0px;
    background: #f3f3f3;
    border: 0px;
}
.cs-select-control {
    border-radius: 0px;
    background-color: #f3f3f3;
    border: 0px;
}
.cs-form-control[readonly],
.cs-select-control[readonly],
.cs-form-control[disabled],
.cs-select-control[disabled] 
{
    background-color:#ddd;
}
.cs-form-controls {
    text-align: right;
}

.cs-btn-primary {
    background: #43AEE3;
    color: #000;
    font-weight: bold !important;
    align-content: center;
    padding:10px;
    border-radius: 0px !important;
    border:0px;
}

    .cs-btn-primary:hover,
    .cs-btn-primary:active,
    .cs-btn-primary:focus {
        color: #000 !important;
        background: #43AEE3;
    } 

.cs-btn-cancel {
    background: #d3d3d3;
    color: #111;
    align-content: center;
    padding: 10px;
    border-radius: 0px !important;
}

    .cs-btn-cancel:hover {
        color: #111 !important;
        border: 1px solid #111;
    }

.cs-btn-search {
    color: #fff;
}

    .cs-btn-search:hover {
        color: #fff !important;
    }

.cs-menu-settings {
    margin-left: 50px;
    margin-right: 20px;
}

.cs-button {
    background: #e5e5e5;
    padding: 3px;
}
/* footer */
.cs-footer {
    margin-top: auto;
    background: #272727;
    /*height: 500px;*/
}

    .cs-footer #footer_logo {
        height: 30%;
        z-index:1;
        position:relative;
    }
    .cs-footer .footer-blue-bar {
        background: #43AEE3;
        height:55px;
    }
    /* background colors */
    .cs-primary-blue-bg {
        background: #25589D;
    }

.cs-primary-orange-bg {
    background-color: #F7901E;
}

.cs-primary-grey-bg {
    /*background: #808284;*/
}

.cs-secondary-blue-bg {
    /*background: #043673;*/
}

.cs-secondary-maroon-bg {
    /*background: #72113F;*/
}

.cs-secondary-teal-bg {
    /*background: #00747A;*/
}

.cs-secondary-green-bg {
    /*background: #749B3D;*/
}

/* font colors */
.cs-primary-blue {
    color: #25589D;
}

.cs-primary-orange {
    color: #F7901E;
}

.cs-primary-grey {
    color: #808284;
}

.cs-secondary-blue {
    color: #043673;
}

.cs-secondary-maroon {
    color: #72113F;
}

.cs-secondary-teal {
    color: #00747A;
}

.cs-secondary-green {
    color: #749B3D;
}

/* font sizes */
cs-align-text-center {
    text-align: center;
}

cs-width-100percent {
    width: 100%
}

.cs-font-small {
    font-size: 13px;
    color:#fff;
}

.cs-font-medium {
    font-size: .9em;
}

.cs-font-large {
    font-size: 1.0em;
}

.cs-font-footer a {
    font-size: 1.1rem;
    color: #fff;
}

.cs-font-500 {
    font-weight: 500;
}

.cs-underlined {
    border-bottom: 1px solid #999;
}

.cs-dashed {
    border-bottom: 1px dashed #999;
}

.cs-dashed-light {
    border-bottom: 1px dashed #dcdcdc;
}

.cs-width-25 {
    width: 25%;
}

.cs-width-35 {
    width: 35%;
}

.cs-width-50 {
    width: 50%;
}

.cs-width-75 {
    width: 75%;
}

/* action links */
.cs-actionlink {
    margin-right: 40px;
    padding: 10px;
    color: white;
    text-align: center;
    margin-bottom: 0;
    transition: transform .1s;
    border-radius: 0.25rem !important;
    width: 70px;
    height: 70px;
    box-shadow: 0 4px 8px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%);
}

    .cs-actionlink .cs-actionlink-icon {
        width: 50px;
        height: 50px;
    }

    .cs-actionlink .cs-actionlink-caption {
        font-size: 0.75rem;
    }

.cs-actionlink-teal {
    background: #00747A;
}

.cs-actionlink-green {
    background: #749B3D;
}

.cs-actionlink-orange {
    background: #F7901E;
}

.cs-actionlink:hover {
    cursor: pointer;
    transform: scale(1.1);
}
/* dashboard tiles */

.cs-tile-box {
    height: 155px;
    width: 155px;
    display: inline-table;
    border-radius: 0px;
    margin: 10px;
    text-align: center;
    padding: 20px 10px;
    /*border: 1px solid #25589D;*/
    background: #ededed;
    /*box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);*/
}

    .cs-tile-box:hover { 
        outline: 0 none;
        /*position: relative;
        top: -4px; */
        /*transform: scale(1.01)*/
    }

.cs-tile-icon img {
    /*font-size: 55px !important;
    color: #25589D;*/
}
.cs-tile-image {
    height:55px;
}

.cs-tile-text {
    color: #25589D;
    text-decoration: none;
    font-size: 20px;
    width: 100%;
}

.cs-dashboard-link {
    text-decoration: none !important;
}

.cs-dashboard-bulletings {
}

    .cs-dashboard-bulletings p {
        border-bottom: 1px dashed #d3d3d3;
    }

        .cs-dashboard-bulletings p span {
            font-weight: 100;
        }

.cs-tile-blue {
    /*background: #005FAE;*/
}

.cs-tile-green {
    /*background: #749B3D;*/
}

.cs-tile-orange {
    /*background: #F7901E;*/
}

.cs-tile-maroon {
    /*background: #72113F;*/
}

.cs-tile-teal {
    /*background: #00747A;*/
}

.cs-tile-secondary-blue {
    /*background: #043673;*/
}
/* PBI Dashboard */

#text-container > div > p {
    font: 1.2em "segoe ui", arial, sans-serif;
}

#report-container {
    height: calc(0.5625 * 80vw); /* 16:9 aspect ratio */
}

.cs-tile-board {
}

iframe {
    border: none;
}

@media only screen and (max-width: 1313px) {
    .footer-blue-bar::before {
        /*content: "1313px screen";*/
    }
    .cs-footer #footer_logo {
        height: 25%;
    }
}

@media only screen and (max-width: 1145px) {
    .footer-blue-bar::before {
        /*content: "1145px screen";*/
    }
    .cs-login-marquee {
        margin: 3%;
    }
    .cs-login-container {
        margin: 0px;
    }
    .cs-footer #footer_logo {
        height: 20%;
    }

    .cs-tile-board {
        transform: scale(.9);
    }
}

@media only screen and (max-width: 990px) {
    .footer-blue-bar::before {
        /*content: "990px screen";*/
    }
    .cs-page {
        margin: 10%;
    }
    .cs-tile-board {
        transform: scale(.8);
    }

    .cs-login-page {
        margin-top: 50px;
        margin-bottom: 0px;
        flex-direction: column;
    }
    .cs-login-marquee {
        margin: 1% 10%;
    }
    .cs-login-container {
        margin: 1% 20%;
    }
    .cs-header #cs_chevron {
        display: none;
    }

    .cs-pipe {
        font-size: 25px;
    }

    .cs-header #cs_application_logo_white {
        height: 55px;
        left: 0px;
    }

    .cs-pipe img {
        width: 35px;
    }

    .cs-setting-dropwdown {
        top: 5px;
    }

    .cs-company-name {
        font-size: 2.0em;
        margin-left: 20px;
    }

    #natgen_logo_white {
    }

    .cs-loan-search-box {
        width: 245px;
    }

    .cs-select-client {
        width: 245px;
    }

    .cs-footer {
        margin-top: auto;
    }

        .cs-footer #footer_logo {
            height: 12%;
        }

    .cs-footer-logo-box {
        text-align: center;
    }

    .cs-footer-copy {
        text-align: center;
    }

    .cs-font-footer a {
        font-size: 0.95rem;
    }
}

@media only screen and (max-width: 574px) {
    .footer-blue-bar::before {
        /*content: "574px screen";*/
    }
    /*.cs-page {
        margin: 10px 10px 220px 10px;
    }*/
    .cs-login-page {
        margin: 50px 0px 0px 0px;
    }
    .cs-tile-board {
        transform: scale(.7);
    }

    .cs-login-marquee {
        margin: 1% 10%;
    }

    .cs-login-container {
        margin: 10%;
    }

    #report-container {
        height: calc(0.5625 * 100vw); /* 16:9 aspect ratio */
    }

    .cs-header {
    }

        .cs-header #cs_application_logo_white {
            height: 45px;
            left: 0px;
        }

    .cs-select-client {
        width: 180px;
    }

    .cs-loan-search-box {
        width: 170px;
    }
    /* dashboard tiles */
    .cs-tile-box {
        height: 115px;
        width: 115px;
        border-radius: 4px;
        margin: 20px;
        text-align: center;
        padding: 20px 10px;
        border: 3px;
    }

        .cs-tile-box:hover {
            /*border-color: rgb(234, 225, 53, 0.8);*/
            /*box-shadow: 0px 4px 8px rgba(126, 239, 104, 0.8);*/
            outline: dashed auto;
            position: relative;
            /*top: -4px;*/
        }

    .cs-tile-icon {
        font-size: 35px !important;
        color: white;
    }

    .cs-tile-text {
        color: white;
        text-decoration: none;
        font-size: 0.9rem;
        width: 100%;
    }

    .cs-dashboard-link {
        text-decoration: none !important;
    }

    .cs-footer {
        margin-top: auto;
    }

        .cs-footer #footer_logo {
            height: 8%;
        }

    .cs-footer-logo-box {
        text-align: center;
    }

    .cs-footer-copy {
        text-align: center;
    }

    .cs-font-footer a {
        font-size: 0.8rem;
    }
}

 
/*Bootstrap extensions*/
.modal-dialog.modal-2xl {
    max-width: 1444px;
}

/* ANIMATIONS */
.fade-in {
    animation: fadeInAnimation ease 1s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

@keyframes fadeInAnimation {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.loader {
    text-align: center;
    vertical-align: middle;
    position: absolute;
    top: 0;
    left: 0;
    border: 1px solid red;
}

.cs-link-back {
    text-decoration: none;
}

.cs-power-bi-dashboard {
    width: 100%;
    height: 980px;
}

.cs-zoom-control {
    /*position: relative;
top: -30px;*/
}

    .cs-zoom-control a span:hover, .cs-zoom-control a span:hover {
        color: darkorange;
    }

.cs-icon-word-fix {
    position: relative;
    top: 4px;
}

.cs-icon-alert {
    font-size: 22px;
}

.cs-alerts {
    width: 80px;
}

    .cs-alerts:hover {
        color: #005FAE;
    }

    .cs-alerts .cs-alerts-active {
        color: #005FAE;
        /*font-size: 24px;*/
    }

        .cs-alerts .cs-alerts-active:hover {
            color: #777;
        }

    .cs-alerts .cs-alerts-inactive {
        color: #777;
        /*font-size: 22px;*/
    }

        .cs-alerts .cs-alerts-inactive:hover {
            color: #25589D;
        }

.cs-icon-fix {
    font-size: 16px;
    position: relative;
    top: 5px;
}

.cs-switch input.form-check-input:checked {
    background-color: #25589D !important;
    border: #25589D !important;
    cursor: pointer;
}
#lender_services_img {
    height:35px;
}


/* redesign 2025*/

.angled-background {
    background-image: linear-gradient(284deg, #313131 0% 50%, #272727 50% 100%);
}
.footer-light-bg {
    background: #313131;
}

.social-linked-in {
    color:#fff;
}

.shimmer-effect:hover {
    width: 155px; /* Adjust as needed */
    height: 155px; /* Adjust as needed */
    background: linear-gradient(to right, #f0f0f0 0%, #e0e0e0 20%, #f0f0f0 40%, #f0f0f0 100%);
    background-size: 200% 100%; /* Make the background wider than the element */
    animation: shimmer 1.0s both linear;
}

@keyframes shimmer {
    0% {
        background-position: 100% 0; /* Start the gradient off-screen to the right */
    }

    100% {
        background-position: -100% 0; /* Move the gradient off-screen to the left */
    }
}

.micro-text {
    font-size: 0.7em; /* Or a specific pixel value like 10px */
    color: #888;
}
