﻿
/*Background image*/
.bodybg {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100vh;
}

    .bodybg img {
        /* These properties make sure that the "background image" covers all available space. */
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        min-width: 100%;
        min-height: 100%; /* This bit cetext-dangernters the image. */
        left: 50%;
        transform: translateX(-50%);
        /* Here, we make sure that nothing sticks out on the side that shouldn't. */
        overflow-x: hidden;
    }

.splashGradient {
    border-radius: 0px;
    height: 34px;
    background-color: black;
    width: 100%
    /*background: -webkit-linear-gradient(#004A80, #004A80);*/ /* For Safari 5.1 to 6.0 */
    /*background: -o-linear-gradient(#004A80, #004A80);*/ /* For Opera 11.1 to 12.0 */
    /*background: -moz-linear-gradient(#004A80, #004A80);*/ /* For Firefox 3.6 to 15 */
    /*background: linear-gradient(#004A80, #004A80);*/ /* Standard syntax */
}

div.boxGradient {
    /*display: inline-block; */
    border-radius: 0px;
    margin-bottom: 0px;
    height: 25px;
    /*background: -webkit-linear-gradient(#0070C0, #0070C0);*/ /* For Safari 5.1 to 6.0 */
    /*background: -o-linear-gradient(#0070C0, #0070C0);*/ /* For Opera 11.1 to 12.0 */
    /*background: -moz-linear-gradient(#0070C0, #0070C0);*/ /* For Firefox 3.6 to 15 */
    /*background: linear-gradient(#0070C0, #0070C0);*/ /* Standard syntax */
    /*background-color:slategray;*/ 
    background-color: lightgray;
    color: black;
    font-size: large;
    font-weight: 600;
    text-align: left;
    height: 33px;

}

span.spashGradientAction {
    margin-left: 15px;
    
}

.splashLabel {
    font-size: x-large;
    color: white;
    font-weight: bold;
    margin-left: 20px;
    padding: 5px;
    text-align:left;
    height: 40px;
    
}

.boxLabel {
    font-size: small;
    color: white;
    font-weight: bold;
    margin-left: 20px;
    padding: 5px;
}

.boxBorder {
    border-top-style: solid;
    border-top-width: 1px;
    border-top-color: lightgray; /*was black*/
    border-left-style: solid;
    border-left-width: 1px;
    border-left-color: lightgray;
    border-right-style: solid;
    border-right-width: 1px;
    border-right-color: lightgray;
}

.dataButton {
    width: 75px;
    height: 25px;
    color: black; /*!important;*/
    background-color: lawngreen; /*!important;*/
    border-radius: 5px;
    box-shadow: none;
    border-color: lawngreen !important;
}

.smallDataButton {
    width: 75px;
    height: 18px;
    color: black !important;
    border-radius: 5px;
    box-shadow: none;
    background-color: lawngreen !important;
    border-color: lawngreen !important;
}

.verySmallDataButton {
    width: 50px;
    height: 18px;
    color: black !important;
    border-radius: 5px;
    box-shadow: none;
    background-color: lawngreen !important;
    border-color: lawngreen !important;
}

.custom-expense-modal-dataButton {
    width: 70px;
    height: 18px;
    color: black !important;
    border-radius: 5px;
    box-shadow: none;
    background-color: lawngreen !important;
    border-color: lawngreen !important;
    font-size: x-small;
}



.formButton {
    width: 80px;
    height: 25px;
    color: black;
    border-radius: 5px;
    box-shadow:none;
    background-color: lawngreen;
    border-color: lawngreen;
}



/*Handles issue of bootstrap grid inside Kendo tab strip*/
.tabAlignment *,
.tabAlignment *::before,
.tabAlignment *::after {
    -moz-box-sizing: border-box !important;
    -webkit-box-sizing: border-box !important;
    box-sizing: border-box !important;
}



li.cu-tabstrip-tab {
    width: 100px;
}

span.k-link {
    font-size: 12px;
}

/*Panel Bar*/
div.containerPanelBar {
    margin-top: 1px;
    width: 120px;
    font-size: small;
}

.containerPanelBar ul {
    max-width: 400px;
    margin: 0 auto;
}


.teamMate h2 {
    font-size: 1.4em;
    font-weight: normal;
    padding-top: 20px;
}

.teamMate p {
    margin: 0;
}

.teamMate img {
    display: inline-block;
    margin: 5px 15px 5px 5px;
    border: 1px solid #ccc;
    border-radius: 50%;
}

.details {
    display: inline-block;
    vertical-align: top;
}
/*End Panel Bar*/



.top-left-right-bottom-border {
    border-top-style: solid;
    border-top-width: 1px;
    border-left-style: solid;
    border-left-width: 1px;
    border-right-style: solid;
    border-right-width: 1px;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-color: lightgray; /*was black*/
    margin-left: 2px;
    padding: 5px;
}

.top-left-right-border {
    border-top-style: solid;
    border-top-width: 1px;
    border-left-style: solid;
    border-left-width: 1px;
    border-right-style: solid;
    border-right-width: 1px;
    border-color: lightgray; /*was black*/
    margin-left: 2px;
}

.left-border {
    border-left-style: solid;
    border-left-width: 1px;
    border-color: lightgray; /*was black*/
    margin-left: 2px;
}

.right-border {
    border-right-style: solid;
    border-right-width: 1px;
    border-color: lightgray; /*was black*/
}

div.bottom-border {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-color: lightgray;
    margin-left: 2px;
}

.bottom-left-right-border {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-left-style: solid;
    border-left-width: 1px;
    border-right-style: solid;
    border-right-width: 1px;
    border-color: lightgray; /*was black*/
    margin-left: 2px;
}

.bottom-left-border {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-left-style: solid;
    border-left-width: 1px;
    border-color: lightgray;
    margin-left: 2px;
}

.bottom-right-border {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-right-style: solid;
    border-right-width: 1px;
    border-color: lightgray;
}

.left-right-border {
    border-left-style: solid;
    border-left-width: 1px;
    border-right-style: solid;
    border-right-width: 1px;
    border-color: lightgray;
    margin-left: 2px;
}

.numeric-input {
    text-align: right;
    width: 75px;
    background-color: #FFFF80;
    border-style: hidden;
}

.numeric-label {
    text-align: right;
    width: 100px;
    border-style: hidden;
    /*border-style: solid;*/
    /*border-width: 1px;*/
    height: 22px;
}

.result-numeric-label {
    /*border-color: black;*/
}
modul
.display-box-numeric {
    text-align: right;
    border-style: hidden;
}

.display-box-numeric-center {
    text-align: right;
    padding: 5px;
    border-style: hidden;
}

/*Style for labels in Underwrite*/
.rent-roll-font {
    text-align: right;
    font-size: 11px;
    width: 200px;
}

.contact-info-font {
    text-align: left;
    font-size: 11px;
    width: 200px;
}

.rent-roll-font-wide {
    font-size: 11px;
    width: 150px;
}


.account-font {
    text-align: left;
    font-size: 1.5rem;
    width: 200px;
}

/*Style for Input boxes and lables in Underwrite*/
.input-boxes-labels {
    font-size: 11px;
    text-align: right;
    width: 75px;
}

.share-boxes-labels {
    font-size: 11px;
    text-align: center;
    width: 200px;
    background-color: #FFFF80;
}



.contact-info-labels {
    font-size: 11px;
    text-align: left;
    width: 200px;
    background-color: #FFFF80;
}



.input-boxes-labels-long {
    font-size: 11px;
    text-align: right;
    width: 150px;
}

.radio-label-occupied {
    color: green;
    font-weight: bold;
}

.radio-label-vacant {
    color: red;
    font-weight: bold;
}

.radio-label-step-revenue {
    color: blue;
    font-weight: bold;
    font-size: x-small;
    margin-left: 2px;
}

.radio-label {
    color: blue;
    font-size: x-small;
}

.radio-right {
    text-align: right
}

.lease-stats {
    color: firebrick;
    font-size: x-small;
}

.rent-roll-notes {
    font-size: x-small;
    background-color: #FFFF80;
}

.help-text {
    font-size: x-small;
}

.cu-modal-header {
    background-color: #3E71B6;
    color: white;
    font-weight: bold;
}

button.form-submit-button[disabled] {
    background-color: #C2C2D6;
}

.awesome-grid-icon:hover {
    cursor: pointer;
}

.awesome-grid-icon {
    margin-left: 5px;
    color: cadetblue;
}

.awesome-grid-span:hover {
    width: 20px;
    cursor: pointer;
}



.k-grid table tr:hover td {
    /*background :rgb(214, 245, 214) !important;*/
    /*background :rgb(255,255,255) !important;*/
    color: black;
    cursor: pointer !important;
}

div.long-explanation {
    font-size: xx-small;
    color: black;
    padding: 2px;
}

.padding-right {
    padding-right: 30px !important;
}


input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

.display-box-numeric i {
    cursor: pointer;
}

.k-grid .k-grid-header .k-header .k-link {
    height: auto;
}

.k-grid .k-grid-header .k-header {
    white-space: normal;
}

/*Set the grid font and row height*/
.k-grid {
    font-size: 12px;
}

    .k-grid td {
        line-height: 2em;
    }


input.lease-step-increase {
    width: 75px;
    text-align: right;
}


input.proforma-step-increase {
    width: 75px;
    text-align: right;
    border: none;
}

.lease-end-year {
    background-color: #E0E0E0;
}

.read-only-first-year {
    background-color: gainsboro;
}

.top-nav-bar-user {
    margin-left: 10px;
}

.disabled-wrapper {
    background-color: gainsboro;
}

span.disabled-wrapper {
    background-color: gainsboro;
}

input.disabled-wrapper {
    background-color: gainsboro;
}

.no-padding {
    padding: 0;
}

.nowrap-dashboard {
    display: inline-block;
}

.dashboard-outer-div {
    padding: 0;
    margin: 0px 0px;
    border: 1px solid black;
    min-height: 35px;
    font-size: 10px;
    background-color: black;
}

    .dashboard-outer-div .title {
        text-align: center;
        margin: 0px 0px;
        color: whitesmoke;
    }

    .dashboard-outer-div .inner-div {
        border: 1px solid black;
        padding: 2px;
        text-align: center;
        position: absolute;
        bottom: 0;
        width: 100%;
        background-color: chartreuse;
    }

.dashboard-input-val {
    border: 1px solid black;
    padding: 2px;
    text-align: center;
    position: absolute;
    bottom: 0;
    width: 100%;
    background-color: #FFFF00;
}

.dashboard-input-val-type-2 {
    border: 1px solid black;
    padding: 2px;
    text-align: center;
    position: absolute;
    bottom: 0;
    width: 100%;
    background-color: #0CC7F3;
}


.dashboard-val-guide {
    border: 1px solid black;
    padding: 2px;
    text-align: center;
    position: absolute;
    bottom: 0;
    width: 100%;
    background-color: lightblue;
}


table.analysis-table {
    width: 100%;
    font-size: x-small;
    padding: 5px;
}

.sum_row {
    font-weight: bold;
}

table.analysis-table td {
    text-align: right;
}


tr.analysis-top-header-row {
    font-weight: bold;
}


tr.analysis-section-header {
    font-size: small !important;
    font-weight: bold;
    height: 40px;
}

.no-padding {
    padding: 0;
}

.dashboard-outer-div {
    padding: 0;
    margin: 0px 0px;
    border: 1px solid black;
}

    .dashboard-outer-div h5 {
        text-align: center;
        text-transform: uppercase;
        padding: 6px;
        color: whitesmoke;
        font-weight: 600;
    }

    .dashboard-outer-div .inner-div {
        border: 1px solid black;
        padding: 1px;
        text-align: center;
    }

.dashboard-bg {
    background-image: url(/content/images/metallic-bg.jpg);
    background-size: cover
}

.analysis_underline {
    border-bottom: double #ccc;
}

@media screen and (max-width: 767px) {
    .alt-table-responsive {
        width: 100%;
        margin-bottom: 15px;
        overflow-y: hidden;
        overflow-x: auto;
        -ms-overflow-style: -ms-autohiding-scrollbar;
        border: 1px solid #dddddd;
        -webkit-overflow-scrolling: touch;
    }
}


/* -- User Guide Table of Contents -- */
/**{
      margin: 0px;
      padding: 0px;
}*/

  .toc-background {
    background: #e5e5e7;
}

  nav {
    font-family: Helvetica, Arial, "Lucida Grande", sans-serif;
    line-height: 1.5;
    margin: 50px auto; /*for display only*/
    width: 200px;
    -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
    -moz-box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
    box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
}

  .menu-item {
    background: #fff;
    width: 300px;
    /*height:initial;*/
}



/*Menu Header Styles*/
.menu-item h4 {
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    padding: 7px 12px;
    background: #a90329;
}


    .menu-item h4 a {
        color: white;
        display: block;
        text-decoration: none;
        width: 200px;
    }

/*Menu Header Styles*/
.menu-item h4 {
    border-bottom: 1px solid rgba(0,0,0,0.3);
    border-top: 1px solid rgba(255,255,255,0.2);
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    padding: 7px 12px;
    /*Gradient*/
    background: #a90329; /* Old browsers */
    background: -moz-linear-gradient(top, #a90329 0%, #8f0222 44%, #6d0019 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a90329), color-stop(44%,#8f0222), color-stop(100%,#6d0019)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #a90329 0%,#8f0222 44%,#6d0019 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #a90329 0%,#8f0222 44%,#6d0019 100%); /* Opera 11.10+ */
    /*background: -ms-linear-gradient(top, #a90329 0%,#8f0222 44%,#6d0019 100%); /* IE10+ */ */ background: linear-gradient(top, #a90329 0%,#8f0222 44%,#6d0019 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=0 ); /* IE6-9 */
}


    .menu-item h4:hover {
        color: black;
        font-size: 12px;
        font-weight: 500;
        background: #cc002c; /* Old browsers */
        background: -moz-linear-gradient(top,    #cc002c 0%, #6d0019 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cc002c), color-stop(100%,#6d0019)); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, chartreuse 0%,chartreuse 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top,    #cc002c 0%,#6d0019 100%); /* Opera 11.10+ */
        /*background: -ms-linear-gradient(top,    #cc002c 0%,#6d0019 100%); /* IE10+ */ */ background: linear-gradient(top,    #cc002c 0%,#6d0019 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc002c', endColorstr='#6d0019',GradientType=0 ); /* IE6-9 */
    }


/*First Item Styles*/
/*.alpha p {
    font-size: 13px;
    padding: 8px 12px;
    color: #aaa;
}*/


/*ul Styles*/
.menu-item ol {
    background: #fff;
    font-size: 12px;
    line-height: 30px;
    list-style-type: initial;
    overflow: hidden;
    padding: 0px;
}

  .menu-item ol a {
    margin-left: 20px;
    text-decoration: none;
    color: #aaa;
    display: block;
    width: 200px;
}

 
/*li Styles*/
.menu-item li {
    /*display: flex;*/
    border-bottom: 1px solid #eee;
}

      .menu-item li:hover {
        background: #eee;
    }

/*Collapse and Animate*/
/*ul Styles*/
.menu-item ol {
    background: #fff;
    font-size: 12px;
    line-height: 30px;
    height: 0px; /*Collapses the menu*/
    list-style-type: initial;
    overflow: hidden;
    padding: 0px;
}

/*Animate the transition*/
/*ul Styles*/
.menu-item ol {
    background: #fff;
    font-size: 12px;
    line-height: 30px;
    height: 0px;
    list-style-type: initial;
    overflow: hidden;
    padding: 0px;
    /*Animation*/
    -webkit-transition: height 1s ease;
    -moz-transition: height 1s ease;
    -o-transition: height 1s ease;
    /*-ms-transition: height 1s ease;*/
    transition: height 1s ease;
}

/*Expanding on Hover*/
.menu-item:hover ol {
    height: 150px;
}

div.debt-header {
    text-align: center;
    font-weight: bold;
    font-size: small;
    /*margin-bottom: 12px;*/
    padding: 5px;
    color: #34282C;
}

#debtPartial hr {
    border: none;
    height: 1px;
    /* Set the hr color */
    color: #333; /* old IE */
    background-color: #333; /* Modern Browsers */
}

/*Amortization View Styles*/
.accordion {
    background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 5px;
    width: 97%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 18px;
    transition: 0.4s;
    margin-left: 20px;
    border-radius: 5px;
    margin-top: 20px;
    height: 25px;
}

    .active, .accordion:hover {
        background-color: #ccc;
    }

.panel {
    padding: 0 18px;
    display: none;
    background-color: white;
}

.accordion:after {
    content: '\02795'; /* Unicode character for "plus" sign (+) */
    font-size: 13px;
    color: #777;
    float: right;
    margin-left: 5px;
}

.active:after {
    content: "\2796"; /* Unicode character for "minus" sign (-) */
}
/*End Amortization View Styles*/


/*Assumption Accordian*/
.accordion-assumption {
    height: 25px;
    /*background: -webkit-linear-gradient(#0070C0, #0070C0);*/ /* For Safari 5.1 to 6.0 */
    /*background: -o-linear-gradient(#0070C0, #0070C0);*/ /* For Opera 11.1 to 12.0 */
    /*background: -moz-linear-gradient(#0070C0, #0070C0);*/ /* For Firefox 3.6 to 15 */
    /*background: linear-gradient(#0070C0, #0070C0);*/ /* Standard syntax */
    background-color: lightgray;
    color: black;
    font-size: large;
    font-weight: 600;
    text-align: left;
    height: 33px;
    padding: 5px;
}



    .accordion-assumption:after {
        content: '\02795'; /* Unicode character for "plus" sign (+) */
        font-size: 13px;
        color: white !important;
        float: right;
        margin-left: 5px;
    }

.active-assumption:after {
    content: "\2796"; /* Unicode character for "minus" sign (-) */
    color: white !important;
}

.assumption-block {
    margin-right: 1px;
}
/*End Assumption Accordian*/

div.debt-summary-panel {
    background-color: whitesmoke;
    color:black;
}

input.disabled-debt-panel {
    background-color: gainsboro;
}

.text-danger-background {
    background-color: #b94a48;
    color: #ffffff;
}

.suggested-refinance-amount-link {
    text-decoration: underline;
    color: blue;
    border-color: gray;
}

    .suggested-refinance-amount-link:hover {
        cursor: pointer;
    }

/*Tables in Underwrite*/

.row-stripe {
    background-color: whitesmoke;
}

tr.table-row {
    height: 25px;
}

table.modular-table {
    width: 100%;
    font-size: small;
    padding: 15px;
    /*border: 1px solid #36454f*/
}

tr.modular-table-header {
    font-weight: bold;
    font-size: 14px;
    text-align: right;
    text-decoration: underline;
    /*background-color: lightyellow;*/
    height: 30px;
    padding-top:20pt;
    padding-bottom:20pt;
}





td.modular-table-standard {
    width: 20%;
    text-align: right;
    font-size: 11px;
    height:20px;
    font-weight:100;
}

td.modular-table-display-cell {
    text-align: center;
    font-size: 11px;
}

td.modular-table-input-cell {
    text-align: center;
}

.table-numeric-input {
    text-align: right;
    width: 75px;
    background-color: #FFFF80;
    border-style: hidden;
}


.table-numeric-label {
    /*text-align: right;*/
    width: 200px;
    border-style: hidden;
    /*border-style: solid;*/
    /*border-width: 1px;*/
    /*height: 22px;*/
}

.modular-table-font {
    /*text-align: right;*/
    font-size: 11px;
    width: 200px;
}

.modular-table-font-header {
    /*text-align: right;*/
    font-size: 12px;
    padding:5px;
    font-weight: bold;
}

.table-input-boxes-labels {
    font-size: 11px;
    /*text-align: center;*/
    width: 75px;
}

.table-input-boxes-and-results {
    font-size: 11px;
    /*text-align: center;*/
    width: 100px;
}

.doublebottomborder {
    border-bottom: double;
}


/*Apartment Income*/
table.apartment-income-table {
    width: 100%;
    font-size: small;
    padding: 15px;
    /*border: 1px solid #36454f*/
}

    table.apartment-income-table td, th {
        border: none
    }

tr.apartment-income-header {
    font-weight: bold;
    font-size: 11px;
    text-align:right;
}



td.apartment-income-standard {
    width: 10%;
    text-align: right;
    font-size: 11px;
}

td.display-cell {
    text-align: right;
    font-size: 11px;
}

td.apartment-income-input-cell {
    text-align: right;
}

input.disabled-apartment-income-panel {
    background-color: gainsboro;
}

.table-row-odd {
    background-color: whitesmoke;
}


tr.apartment-income-row {
    height: 25px;
}
/*End Apartment Income*/





/*Capital Improvements*/
table.capital-improvement-table {
    width: 100%;
    font-size: small;
    padding: 150px;
    /*border: 1px solid #36454f*/
}

    table.capital-improvement-table td, th {
        border: none
    }

tr.capital-improvement-header {
    font-weight: bold;
    font-size: 11px;
    text-align: right;
}



td.capital-improvement-standard {
    width: 10%;
    text-align: right;
    font-size: 11px;
}

td.display-cell {
    text-align: right;
    font-size: 11px;
}

td.capital-improvement-input-cell {
    text-align: left;
}


td.capital-improvement-input-text-cell {
    text-align: left;
}


td.capital-improvement-input-text-cell input {
    width: 100%;
    text-align: left;
}

td.capital-improvement-button-text-cell {
    text-align: center;
}


td.capital-improvement-button-text-cell input {
    text-align: center;
}

/*input.disabled-capital-improvement-panel {
    background-color: gainsboro;
}*/

.table-row-odd {
    background-color: whitesmoke;
}


tr.capital-improvement-row {
    height: 25px;
}
/*End Capital Improvements*/







.expense-header {
    font-weight: bold;
    color: black;
    text-align:right;
}

div.property-message {
    text-align: center;
    font-size: x-large;
    font-weight: bold;
    color: firebrick;
}


table.rent-roll-total-table {
    margin-top: 20px;
    width: 100%;
    text-align: right;
    font-size: x-small;
    background-color: gainsboro;
    border: 1px solid #C8C8C8
}

table.rent-roll-total-table td {
    width: 8.7%;
    padding: 2px;
    border: none
}

table.rent-roll-total-data {
    background-color: lightblue; color: black !important
}


td.left-side {
    text-align: right;
}


td.right-side {
    text-align: left;
}


input.kendo-date-input {
    background-color: #FFFF80 !important;
}

.text-soft-warning {
    color: #436EEE
}

.text-soft-warning-background {
    background-color: #436EEE
}






/*
    Start toaster-message
*/
/* The toaster-message - position it at the bottom and in the middle of the screen */
#toaster-message {
    visibility: hidden; /* Hidden by default. Visible on click */
    min-width: 250px; /* Set a default minimum width */
    margin-left: -125px; /* Divide value of min-width by 2 */
    background-color: lawngreen; /* Black background color */
    color: black; /* White text color */
    text-align: center; /* Centered text */
    border-radius: 2px; /* Rounded borders */
    padding: 16px; /* Padding */
    position: fixed; /* Sit on top of the screen */
    z-index: 1; /* Add a z-index if needed */
    left: 50%; /* Center the toaster-message */
    bottom: 52%; /* 52% from the bottom */

}

/* Show the toaster-message when clicking on a button (class added with JavaScript) */
#toaster-message.show {
        visibility: visible; /* Show the toaster-message */
        /* Add animation: Take 0.5 seconds to fade in and out the toaster-message. 
However, delay the fade out process for 2.5 seconds */
        -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
        animation: fadein 0.5s, fadeout 0.5s 2.5s;
    }

/* Animations to fade the toaster-message in and out */
@-webkit-keyframes fadein {
    from {
        bottom: 0;
        opacity: 0;
    }

    to {
        bottom: 52%;
        opacity: 1;
    }
}

@keyframes fadein {
    from {
        bottom: 0;
        opacity: 0;
    }

    to {
        bottom: 52%;
        opacity: 1;
    }
}

@-webkit-keyframes fadeout {
    from {
        bottom: 52%;
        opacity: 1;
    }

    to {
        bottom: 0;
        opacity: 0;
    }
}

@keyframes fadeout {
    from {
        bottom: 52%;
        opacity: 1;
    }

    to {
        bottom: 0;
        opacity: 0;
    }
}
/*
    End toaster-message
*/


.cu-modal-header {
    background-color: lightgray;
    color:black;
}



/*Note: We are overridding bootstrap here !! */
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
    color: black !important;
    background-color: lawngreen !important;
    border-color: lawngreen !important;
}




/* Font Awesome Spinner */
/* Font Awesome Spinner */
/* Font Awesome Spinner */
/* Font Awesome Spinner */
/*.cm-update-spinner {
    color: lawngreen;  
}*/

/** {
    margin: 0;
    padding: 0
}*/

html, body {
    /*height: 100&#37;*/
}

#loading {
    width: 200px;
    line-height: 50px;
    height: 50px;
    position: fixed;
    left: 50%;
    margin-left: -100px;
    top: 50%;
    margin-top: -30px;
    /*z-index: 999;*/
    text-align: center;
}

* html #loading {
    position: absolute
}

#page-content {
    width: 780px;
    margin: auto;
    background: #ffffcc;
    padding: 10px;
    border: 1px solid #000;
}


.fast-spin {
    -webkit-animation: fa-spin 5s infinite linear;
    animation: fa-spin 5s infinite linear;
}

/* End Font Awesome Spinner */
/* End Font Awesome Spinner */
/* End Font Awesome Spinner */
/* End Font Awesome Spinner */
/* End Font Awesome Spinner */




/* Spinner */
/* Spinner */
/* Spinner */
/* Spinner */
.spinner {
    height: 60px;
    width: 60px;
    margin: 0 auto;
    position: relative;
    -webkit-animation: rotation .6s infinite linear;
    -moz-animation: rotation .6s infinite linear;
    -o-animation: rotation .6s infinite linear;
    animation: rotation .6s infinite linear;
    border: 6px solid rgba(0,174,239,.15);
    border-radius: 100%;
}

    .spinner:before {
        content: "";
        display: block;
        position: absolute;
        left: -6px;
        top: -6px;
        height: 100%;
        width: 100%;
        border-top: 6px solid rgba(0,174,239,.8);
        border-left: 6px solid transparent;
        border-bottom: 6px solid transparent;
        border-right: 6px solid transparent;
        border-radius: 100%;
    }

@-webkit-keyframes rotation {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(359deg);
    }
}

@-moz-keyframes rotation {
    from {
        -moz-transform: rotate(0deg);
    }

    to {
        -moz-transform: rotate(359deg);
    }
}

@-o-keyframes rotation {
    from {
        -o-transform: rotate(0deg);
    }

    to {
        -o-transform: rotate(359deg);
    }
}

@keyframes rotation {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(359deg);
    }
}


.spinner-md {
    height: 40px;
    width: 40px;
}

.spinner-lr {
    height: 150px;
    width: 150px;
}

.spinner-green {
    border: 6px solid rgba(124,252,0, .15);
}

    .spinner-green:before {
        border-top: 6px solid rgba(124,252,0,1);
    }
/* End Spinner */
/* End Spinner */
/* End Spinner */
/* End Spinner */
/* End Spinner */




.k-grid-header .k-header {
    background-color: lightyellow;
}

table.center {
    margin-left: auto;
    margin-right: auto;
}

span.properties {
    float: left;
}

span.filter {
    float: right; font-size: small;
}

span.filter input {
    width: 10rem;
    margin-right: .5rem;
}


span.filter-typing {
    float: right;
    font-size: small;
}

button.grid-filter {
    width: 50px;
    color: black !important;
    border-radius: 5px;
    box-shadow: none;
    background-color: lawngreen !important;
    border-color: lawngreen !important;
    font-size: xx-small !important;
    height: 25px !important;
}


/*Begin Stripe Styles*/
/**
 * The CSS shown here will not be introduced in the Quickstart guide, but shows
 * how you can use CSS to style your Element's container.
 */
.StripeElement {
    background-color: white;
    height: 40px;
    padding: 10px 12px;
    border-radius: 4px;
    border: 1px solid transparent;
    box-shadow: 0 1px 3px 0 #e6ebf1;
    -webkit-transition: box-shadow 150ms ease;
    transition: box-shadow 150ms ease;
}

.StripeElement--focus {
    box-shadow: 0 1px 3px 0 #cfd7df;
}

.StripeElement--invalid {
    border-color: #fa755a;
}

.StripeElement--webkit-autofill {
    background-color: #fefde5 !important;
}
/*End Stripe Styles*/


.sign-up-form-control {
    margin-top: 1rem;
}

.form-error {
    color: firebrick;
}


.form-error-from-server {
    color: firebrick; font-weight: bold; font-family: Arial; font-size: medium;
}

.form-sucess-from-server {
    color: darkblue;
    font-weight: bold;
    font-family: Arial;
    font-size: medium;
}

td.pricing {
    text-align: right;
}

input.filter-type {
    font-size: smaller;
    margin-left: 1rem;
    padding: 0px;
}

.filter-type-label {
    font-size: smaller;
    margin-left: 0rem;
    padding: 0px;
}

.user-filter {
    margin-left: 1rem;
}

.investor-return-row{
    color: green;
}

.manager-return-row {
    color: navy;
}

.remaining-cash {
    color:purple;
}

.radio-plan-monthly {
    float: left;
}

label.radio-plan-monthly {
    float: left;
    margin-left:1rem;
}



/*Payment Method*/

table.center {
    margin-left: auto;
    margin-right: auto;
}

table.payment-method-table {
    width: 100%;
    font-size: small;
    padding: 30px;
    /*border: 1px solid #36454f*/
}

table.payment-method-table td, th {
    border: none
}

tr.payment-method-header {
    font-weight: bold;
    font-size: 12px;
    text-align: left;
}


tr.payment-method-row {
    font-size: 11px;
    text-align: left;
    height: 6rem;
}


td.payment-method-standard {
    width: 10%;
    text-align: left;
    font-size: 11px;
}

.red-date {
    color: red;
}