:root {
    --main-bg-color: #f8f8f8;
    --slate-primary-color: #3c4443;
    --concrete-primary-color: #e3e2e2;
    --gold-primary-color: #b6862d;
    --rust-primary-color: #964b2c;
    --moss-primary-color: #606637;
    --slate-digital-primary-color: #3d4543;
    --slate-digital-primary-tint: #6e7373;
    --slate-digital-primary-shade: #202826;
    --rust-digital-primary-color: #934320;
    --rust-digital-primary-tint: #a16d54;
    --rust-digital-primary-shade: #70331d;
    --gold-digital-primary-color: #b6872d;
    --gold-digital-primary-tint: #c5a76f;
    --gold-digital-primary-shade: #956c3a;
    --moss-digital-primary-color: #51602d;
    --moss-digital-primary-tint: #767f5c;
    --moss-digital-primary-shade: #3e4723;
    --systems-purple-digital-tertiary-color: #57435d;
    --systems-purple-digital-tertiary-tint: #79697d;
    --systems-purple-digital-tertiary-shade: #413246;
    --section-blue-digital-tertiary-color: #3f677d;
    --section-blue-digital-tertiary-tint: #708e9f;
    --section-blue-digital-tertiary-shade: #305566;
    --component-green-digital-tertiary-color: #418073;
    --component-green-digital-tertiary-tint: #7da098;
    --component-green-digital-tertiary-shade: #375d54;
    --concrete-digital-tertiary-color: #e3e2e2;
    --concrete-digital-tertiary-tint: #f8f8f8;
    --concrete-digital-tertiary-shade: #aeaeae;
    --inspection-green-plus: #38672c;
    --inspection-green: #548645;
    --inspection-green-minus: #679b59;
    --inspection-amber-plus: #dbc63a;
    --inspection-amber: #e6d756;
    --inspection-amber-minus: #f6eb57;
    --inspection-red-plus: #ab261e;
    --inspection-red: #c23d31;
    --inspection-red-minus: #dd3f2f;
    --alloy-header: #903f01;
    --sage-header: #5f6638;
    --DIGON-gold-50: #faf8ec;
    --DIGON-gold-100: #f4efcd;
    --DIGON-gold-200: #ebde9d;
    --DIGON-gold-300: #dfc665;
    --DIGON-gold-400: #d5ae3a;
    --DIGON-gold-500: #c5992d;
    --DIGON-gold-600: #a47423;
    --DIGON-gold-700: #885820;
    --DIGON-gold-800: #724821;
    --DIGON-gold-900: #623d21;
    --DIGON-gold-950: #381f10;
    --DIGON-gray-50: #f6f7f7;
    --DIGON-gray-100: #e2e5e4;
    --DIGON-gray-200: #c4cbc9;
    --DIGON-gray-300: #9eaaa6;
    --DIGON-gray-400: #7a8783;
    --DIGON-gray-500: #5f6d69;
    --DIGON-gray-600: #4b5653;
    --DIGON-gray-700: #3d4543;
    --DIGON-gray-800: #343b39;
    --DIGON-gray-900: #2e3332;
    --DIGON-gray-950: #181b1a;
    --DIGON-SAGE-green-50: #f6f6ef;
    --DIGON-SAGE-green-100: #eaecdb;
    --DIGON-SAGE-green-200: #d8dbbb;
    --DIGON-SAGE-green-300: #bec393;
    --DIGON-SAGE-green-400: #a5ac6f;
    --DIGON-SAGE-green-500: #879052;
    --DIGON-SAGE-green-600: #5f6638;
    --DIGON-SAGE-green-700: #525833;
    --DIGON-SAGE-green-800: #43482c;
    --DIGON-SAGE-green-900: #393e29;
    --DIGON-SAGE-green-950: #1e2112;
    --DIGON-rust-50: #fcf7ee;
    --DIGON-rust-100: #f6e9cf;
    --DIGON-rust-200: #ecd29b;
    --DIGON-rust-300: #e3b666;
    --DIGON-rust-400: #dc9d43;
    --DIGON-rust-500: #d3802d;
    --DIGON-rust-600: #ba6225;
    --DIGON-rust-700: #934320;
    --DIGON-rust-800: #7f3921;
    --DIGON-rust-900: #692f1e;
    --DIGON-rust-950: #3b170d;
    --asset-purple-50: #f9f8fb;
    --asset-purple-100: #f4f1f6;
    --asset-purple-200: #e8e1ed;
    --asset-purple-300: #d7cadd;
    --asset-purple-400: #bfaac8;
    --asset-purple-500: #a286af;
    --asset-purple-600: #856891;
    --asset-purple-700: #6e5477;
    --asset-purple-800: #56425d;
    --asset-purple-900: #4d3c53;
    --asset-purple-950: #2e2032;
    --inventory-blue-50: #f1f8fa;
    --inventory-blue-100: #dcecf1;
    --inventory-blue-200: #bedae3;
    --inventory-blue-300: #91bfcf;
    --inventory-blue-400: #5c9cb4;
    --inventory-blue-500: #3e7a92;
    --inventory-blue-600: #396981;
    --inventory-blue-700: #33576b;
    --inventory-blue-800: #304a5a;
    --inventory-blue-900: #2c3f4d;
    --inventory-blue-950: #192833;
    --condition-green-50: #f5faf3;
    --condition-green-100: #e8f4e4;
    --condition-green-200: #d1e8ca;
    --condition-green-300: #aed4a1;
    --condition-green-400: #82b870;
    --condition-green-500: #5f9b4c;
    --condition-green-600: #447435;
    --condition-green-700: #3c6530;
    --condition-green-800: #33512a;
    --condition-green-900: #2b4324;
    --condition-green-950: #13240f;
    --condition-red-50: #fef2f2;
    --condition-red-100: #fee3e2;
    --condition-red-200: #fdcccb;
    --condition-red-300: #fba8a6;
    --condition-red-400: #f67773;
    --condition-red-500: #ed4b46;
    --condition-red-600: #d02924;
    --condition-red-700: #b7221e;
    --condition-red-800: #97211d;
    --condition-red-900: #7e211e;
    --condition-red-950: #440d0b;
    --condition-yellow-50: #fffee7;
    --condition-yellow-100: #fffec1;
    --condition-yellow-200: #fff886;
    --condition-yellow-300: #ffec41;
    --condition-yellow-400: #ffdb0d;
    --condition-yellow-500: #ffcc00;
    --condition-yellow-600: #d19500;
    --condition-yellow-700: #a66a02;
    --condition-yellow-800: #89530a;
    --condition-yellow-900: #74430f;
    --condition-yellow-950: #442304;
    --component-green-50: #f4f9f8;
    --component-green-100: #daede7;
    --component-green-200: #b5dacf;
    --component-green-300: #88c0b2;
    --component-green-400: #5fa294;
    --component-green-500: #418073;
    --component-green-600: #356c62;
    --component-green-700: #2e5750;
    --component-green-800: #284742;
    --component-green-900: #253c39;
    --component-green-950: #112220;
}

html {
    min-height: 100%;
    height: auto;
}

body {
    font-size: 0.75rem;
    margin: 0;
    padding: 0;
    min-height: 100%;
    height: auto;
    font-family: sans-serif;
    width: 100%;
    /*background: transparent url('../img/hub-background-image.png')no-repeat center center fixed;*/
}

.noPad{
    padding: 0;
}

.container-fluid {
    margin: 0 auto;
    height: calc(100vh - 100 px);
    padding: 0px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.fill-height {
    min-height: 100%;
    height: auto !important; /* cross-browser */
    height: 100%; /* cross-browser */
}

.login-body-background {
    top: 0px;
    background: transparent url('../img/hub-background-image.png')no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-color: var(--main-bg-color);
    opacity: 1;
}


.login-Center {
    background-color: #fff;
    margin: auto;
    position: relative;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

    .login-Center.is-Responsive {
        width: 33%;
        height: auto;
        min-width: 200px;
        max-width: 500px;
        /*padding: 40px;*/
    }


.layout-container {
    padding: 0;
}

h1 {
    color: var(--rust-digital-primary-color);
    padding-top: 10px;
    padding-bottom: 5px;
    font-weight: 600;
    display: block;
    font-size: 1.6em;
}
    h1.restore-font {
        font-size: 2.5em;
    }

h2 {
    color: var(--rust-digital-primary-color);
    font-size: 1.6em;
    padding-top: 10px;
    padding-bottom: 5px;
}

h4 {
    font-size: 1.2em;
}

h5 {
    font-size: 0.8em;
}

.row {
    padding-bottom: 10px;
    margin: 0px;
}

    .row.product-header {
        padding-bottom: 0px;
    }

        .row.product-header.full-height {
            height: 100%;
        }

.col.footer-right-col {
    padding-right: 0px;
    color: white;
}


.card-body{
    padding: 0px;

}

.admin-hub-card {
    border: 1px solid rgba(0,0,0,.125);
    padding: 0;
    width: 100%;
}

    .admin-hub-card.project-details {
        width: 25%;
    }

.admin-hub-column {
    padding: 0;
    flex-grow: 0;
}

    .admin-hub-column.first-column {
        margin-left: 40px;
    }    

    .admin-hub-column.second-column {
        margin-left: 25px;
        margin-right: 15px;
    }

    .admin-hub-column.second-status-column {
        margin-left: 50px;
    }

    .admin-hub-column.second-user-column {
        margin-left: 75px;
    }

.col-full-page {
    padding: 0px;
    margin: 0px;
    width: 100%;
}

    .col-full-page.management-page {
        padding: 10px 15px 10px 15px;
        margin: 0px;
        width: 100%;
    }

    .col-full-page.index-page {
        padding: 0px 50px 20px 50px;
    }

/* Set padding to keep content from hitting the edges */
/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
/*input,
select,
textarea {
    max-width: 280px;
}*/




div.dataTables_wrapper div.dataTables_length label {
    font-weight: 500;
    text-align: left;
    white-space: nowrap;
}

div.dataTables_wrapper div.dataTables_filter label {
    font-weight: 500;
    white-space: nowrap;
    text-align: left;
}

div.dataTables_wrapper div.dataTables_length label {
    font-weight: 500;
    text-align: left;
    white-space: nowrap
}

/* Set padding to keep content from hitting the edges */
.body-content {
    background: #fff;
}



.spirefooter {
    background: transparent url('../img/hub-footer-background.png');
    padding-left: 5px;
}

    .spirefooter a {
        color: var(--concrete-digital-tertiary-shade);
        font-weight: 500;
    }

    .spirefooter .contact {
        height: auto;
        margin: 0px 0px 8px 0px;
        padding: 20px 10px 10px 0px;
    }

    .spirefooter .copyright {
        margin-right: 0px;
        padding-right: 10px;
        padding-left: 10px
    }

.loginfooter {
    background: transparent url('../img/hub-footer-background.png');
    background-color: transparent;
}

.left-footer-column {
    padding-top: 5px;
    color: white;
}

.security-msg-col {
    padding-top: 5px;
    color: var(--inspection-red);
    font-weight: bold;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    /*max-width: 280px;*/
    border: none;
    margin: 2px 0px 10px 10px;
    padding: 7px;
    color: black;
}

.form-text {
    margin-left: 10px;
    float: right;
}

.form-right-floater {
    float: right;
}

.form-text-file {
    margin-left: 10px;
    float: left;
    margin-top: -13px;
    margin-bottom: 15px;
}


.logoutlink {
    position: relative;
    display: block;
    padding: 10px 15px;
    color: var(--concrete-digital-tertiary-shade);
    padding-top: 29px;
    line-height: 21px;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 14px;
    text-decoration: none !important;
    padding-bottom: 5px;
}


.sign-out {
    color: var(--gold-digital-primary-shade);
    border: 1px solid;
    height: auto;
    width: auto;
    margin-bottom: 0px;
}

.page-nav {
    background: var(--gold-digital-primary-shade);
    padding: 1px 1px 6px 8px;
    margin: 40px 0px 14px 0px;
}

    .page-nav h1, .page-nav-history h1, .page-nav-new h1 {
        font-family: 'Montserrat', sans-serif;
        font-weight: 600;
        color: #fff;
        text-transform: uppercase;
        line-height: 6px;
        font-size: 18px;
        margin-left: 10px;
    }

.page-nav-new {
    padding: 2px 15px 8px 15px;
    margin: 25px 15px 0px 15px;
}

.page-nav-history {
    background: var(--slate-digital-primary-color);
    padding: 2px 0px 8px 8px;
    margin: 37px 0px 0px 0px;
}


.view-more {
    font-size: 12px;
    margin-left: 12px;
    font-weight: 500;
    text-decoration: none;
}

.page-nav-history a {
    color: var(--gold-digital-primary-shade);
    text-decoration: none;
    text-transform: uppercase;
}

    .page-nav-history a:hover {
        text-decoration: underline;
        text-transform: uppercase;
    }

.new-sync {
    padding: 22px;
    width: 100%;
    margin-bottom: 15px;
}

.panel-digon {
    border-color: var(--gold-digital-primary-shade);
}

    .panel-digon > .panel-heading {
        color: #333;
        background-color: var(--gold-digital-primary-shade);
        border-color: var(--gold-digital-primary-shade);
    }

.table th {
    color: var(--slate-digital-primary-color);
    background-color: var(--main-bg-color);
    font-weight: normal;
}

.table tr {
    color: var(--slate-digital-primary-color);
    font-weight: 500;
    font-size: 12px;
}

.panel-digon > .panel-body {
    color: var(--slate-digital-primary-color);
    font-weight: normal;
}

.emboldening {
    font-weight: bold;
}

.digon {
    background-color: var(--gold-digital-primary-shade);
    border-color: var(--gold-digital-primary-color);
}

.digon-txt {
    color: var(--slate-digital-primary-tint);
    font: Regular 13px/16px Montserrat;
    font-weight: 500
}

.icon-success {
    color: var(--inspection-green-plus);
}

.icon-danger {
    color: var(--inspection-red-plus);
}

.icon-not-good {
    color: var(--inspection-amber-plus);
}

.icon-warning {
    color: var(--rust-digital-primary-color);
}

small {
    color: var(--slate-digital-primary-color);
}

.title-txt {
    color: var(--slate-digital-primary-color);
}

.green-plus-background {
    background-color: var(--inspection-green-plus);
}

.green-background {
    background-color: var(--inspection-green);
}

.green-minus-background {
    background-color: var(--inspection-green-minus);
}

.amber-plus-background {
    background-color: var(--inspection-amber-plus);
}

.amber-background {
    background-color: var(--inspection-amber);
}

.amber-minus-background {
    background-color: var(--inspection-amber-minus);
}

.red-plus-background {
    background-color: var(--inspection-red-plus);
}

.red-background {
    background-color: var(--inspection-red);
}

.red-minus-background {
    background-color: var(--inspection-red-minus);
}

.status-banner-rounding {
    border-radius: 15px;
}

.btn-signout {
    margin: 7px 30px 0px 0px;
    color: var(--gold-digital-primary-color);
    border-radius: 5;
    border: 1px solid var(--gold-digital-primary-color);
    text-transform: uppercase;
}

    .btn-signout:hover {
        margin: 7px 30px 0px 0px;
        color: var(--slate-digital-primary-shade);
        border-radius: 2px;
        border: 1px solid var(--slate-digital-primary-shade);
        text-transform: uppercase;
    }

.btn-sync {
    border-radius: 5px;
    float: left;
    background: var(--gold-digital-primary-color);
    color: #fff !important;
    text-transform: uppercase;
}
    .btn-sync.right-align {
        float: none;
    }

    .btn-sync.float-right {
        float: right;
    }

.btn-sage {
    border-radius: 5px;
    float: left;
    background: var(--moss-digital-primary-color);
    color: #fff !important;
    text-transform: uppercase;
}

    .btn-sage.right-align {
        float: none;
    }

.btn-cancel {
    color: white;
    background: var(--slate-digital-primary-color);
    height: 45px;
    padding: 10px 50px 10px 50px;
    vertical-align: middle;
}

.btn-back {
    color: white;
    background: var(--slate-digital-primary-color);
    padding: 10px 50px 10px 50px;
    vertical-align: middle;
}

.btn-skip {
    color: white !important;
    background: var(--slate-digital-primary-color) !important;
}

.btn-save {
    color: white;
    background: var(--gold-digital-primary-color);
    background-image: url('../img/HUB-icon-set-25px-check-wht.png');
    background-repeat: no-repeat;
    background-position: 10px 5px;
    height: 45px;
    padding: 10px 30px 10px 50px;
    vertical-align: middle;
    background-size: 35px;
}
    .btn-save.right-align {
        float: none;
    }

.btn-disabled {
    opacity: .4;
    cursor: default !important;
    pointer-events: none;
}

.custom-input-margins {
    margin: 0px 10px 10px 0px;
}

.custom-select {
    max-width: 95%
}

.sync-form select {
    color: var(--slate-digital-primary-color);
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    font-size: 12px;
}

.form-group p {
    margin: 2px 10px 10px 10px;
    padding: 7px;
    color: var(--slate-digital-primary-color);
}


.builder {
    background: none;
    color: var(--slate-digital-primary-tint);
    margin-left: 17px
}

.highlight {
    color: var(--gold-digital-primary-color);
}

.builder-catalog {
    border: 2px solid var(--slate-digital-primary-tint);
    width: 226px;
    margin-bottom: 31px;
}

    .builder-catalog:hover {
        border: 2px solid var(--gold-digital-primary-color);
        color: var(--gold-digital-primary-color);
    }

    .builder-catalog a:hover {
        color: var(--gold-digital-primary-color);
    }

.request p {
    margin: 7px 0px;
    color: var(--slate-digital-primary-tint);
}

.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
}

.center-cell-child {
    position: absolute;
    top: 10%; left: 40%;
}

    .center-cell-child.double-digit {
        left: 30%;
    }

.bottom-cell-child {
    position: absolute;
    top: 65%; left: 20%;
}

.sysCircle {
    width: 80%;
    color: #fff;
    position: relative;
    line-height: 2;
    padding-bottom: 50%;
    border-radius: 10%;
}

    .sysCircle h5 {
        position: absolute;
        top: 30%;
        left: 50%;
        transform: translate(-50%, -70%);
        margin: 0;
    }

    .sysCircle h2 {
        position: absolute;
        top: 65%;
        left: 50%;
        transform: translate(-50%, -30%);
        margin: 0;
    }


.glyphicon-share-alt {
    color: var(--slate-digital-primary-color);
    position: relative;
    margin-left: 8px;
    margin-right: -12px;
    top: 1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: normal;
    line-height: 2;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

    .glyphicon-share-alt:hover {
        color: var(--gold-digital-primary-color);
    }

.glyphicon-envelope {
    color: var(--slate-digital-primary-tint);
    position: relative;
    margin-left: 0px;
    margin-right: -7px;
    top: 1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.glyphicon-book {
    color: var(--slate-digital-primary-tint);
    position: relative;
    top: 1px;
    margin-right: 5px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.glyphicon-question-sign {
    color: var(--slate-digital-primary-tint);
    position: relative;
    margin-left: 0px;
    margin-right: -7px;
    top: 1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/*@font-face {
    font-family: 'Glyphicons Halflings';
    src: url('../fonts/glyphicons-halflings-regular.eot');
    src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}*/



/*DATA TABLE */

#myTable_wrapper {
    color: var(--slate-digital-primary-color);
    font-size: 12px;
    font-weight: 500;
}

.dataTables_wrapper div.dataTables_length select {
    width: 75px;
    display: inline-block;
}

.form-inline .form-control {
    display: inline-block;
    width: auto;
    vertical-align: middle;
}

.input-sm, .form-horizontal .form-group-sm .form-control {
    height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}



.dataTables_wrapper, .dataTables_filter label {
    white-space: nowrap;
    text-align: left;
    font-weight: 500;
}

.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.42857143;
    color: var(--slate-digital-primary-color);
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

    .form-control:focus {
        border-color: var(--slate-digital-primary-color);
        outline: 0;
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(255,255,255,0.6);
        box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(255,255,255,0.6);
    }

    .form-control.center-block {
        display: block;
        margin-right: auto;
        margin-left: auto;
    }

    .form-control.reduce-it {
        width: 67%;
    }

    .form-control.shrink-it {
        width: 33%;
    }

    .form-control.tall-boy {
        height: 10rem;
    }

    .form-control.medium-guy {
        height: 6.67rem;
    }

.login-form-control {
    display: block;
    width: 160%;
    height: 34px;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.42857143;
    color: var(--slate-digital-primary-color);
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    margin: 2px 0px 0px -25px;
}

    .login-form-control:focus {
        border-color: var(--slate-digital-primary-color);
        outline: 0;
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(255,255,255,0.6);
        box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(255,255,255,0.6);
    }

.checkbox-form-control {
    width: 100%;
    height: 24px;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.42857143;
    color: var(--slate-digital-primary-color);
    background-color: #fff;
    background-image: none;
    border-radius: 4px;
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

    .checkbox-form-control.in-line {
        display: inline;
        margin: 10px 0px 0px 25px;
    }

    .checkbox-form-control.g-reduce {
        width: 75%;
    }

    .checkbox-form-control.gt-reduce {
        width: 50%;
    }

    .checkbox-form-control.h-reduce {
        width: 30%;
    }

    label {
        cursor: default;
        font-weight: 700;
        font-size: 0.9em;
    }

.login-control-label {
    padding-left: 0px;
    margin-left: -5px;
}

div.dataTables_wrapper div.dataTables_length select {
    width: 75px;
    display: inline-block;
    border-radius: 0px;
}

div.dataTables_wrapper div.dataTables_filter input {
    margin-left: 0.5em;
    display: inline-block;
    width: auto;
    border-radius: 0px;
}

.dropZoneElement {
    position: relative;
    display: inline-block;
    background-color: #f8f8f8;
    border: 1px solid #c7c7c7;
    width: 600px;
    height: 200px;
    text-align: center;
}

.textWrapper {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    font-size: 18px;
    line-height: 1.2em;
    font-family: Arial,Helvetica,sans-serif;
    color: #000;
}

.dropImageHereText {
    color: #c7c7c7;
    text-transform: uppercase;
    font-size: 12px;
}

.wrapper:after {
    content: ".";
    display: inline-block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.or {
    margin: auto;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 45%;
    transform: translate(-50%,-45%);
}

.pagination {
    color: var(--slate-digital-primary-color);
    background-color: #fff;
    border: 1px solid #d4d6d6;
    cursor: not-allowed;
    border-radius: 0px;
}

    .pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus {
        color: var(--slate-digital-primary-color);
        background-color: #fff;
        cursor: not-allowed;
    }

    .pagination > li > a, .pagination > li > span {
        position: relative;
        float: left;
        padding: 10px 15px;
        line-height: 1.42857143;
        text-decoration: none;
        color: var(--slate-digital-primary-color);
        background-color: #fff;
        margin-left: -1px;
        border-left: 1px solid #d4d6d6;
        border-right: 1px solid #d4d6d6;
    }

    .pagination > li > a, .pagination > li:last-of-type {
        border-right: none;
    }

    .pagination > li:last-child > a, .pagination > li:last-child > span {
        border-bottom-right-radius: 0px;
        border-top-right-radius: 0px;
    }

    .pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
        z-index: 3;
        color: var(--slate-digital-primary-color);
        background-color: #d4d6d6;
        border: 1px solid #d4d6d6;
        cursor: default;
    }

    .pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
        z-index: 2;
        color: var(--slate-digital-primary-color);
        background-color: #d4d6d6;
        border-color: transparent;
    }

.fileUploadModal {
    display: none;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
}

.modal-content {
    background-color: var(--main-bg-color);
    margin: 15% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
}

.close {
    color: var(--slate-digital-primary-tint);
    float: right;
    font-size: 28px;
    font-weight: bold;
}

    .close:hover,
    .close:focus {
        color: black;
        text-decoration: none;
        cursor: pointer;
    }

.header-label {
    display: inline-block;
    font: 18px 'Montserrat', sans-serif;
    font-style: italic;
    font-weight: 400;
    color: #c1c1c1;
    padding: 10px 15px;
}

.table-striped > tbody > tr.processing {
    background-color: aqua;
}

.table-striped-nopadding > tbody > tr.processing {
    background-color: aqua;
    vertical-align: middle;
    padding: 0px;
}

.done {
}



.card-body {
   /* padding-left: 5px;*/
    margin-left: 5px
}

    .card-body.management {
        margin-left: 0px;
    }

.file-upload-header {
    background-color: var(--slate-digital-primary-color);
    color: var(--concrete-digital-tertiary-tint);
    font-size: 16px;
    border-start-start-radius: 0.5rem !important;
    border-start-end-radius: 0.5rem !important;
}

.file-selection-header-text {
    font-size: 16px;
    color: var(--slate-digital-primary-tint);
}

.file-upload-activity-header {
    font-size: 16px;
    font-weight: 700;
    color: whitesmoke;
    background-color: var(--slate-digital-primary-color);
    margin-bottom: 0px;
    padding-left: 10px;
    border-start-start-radius: 0.5rem;
    border-start-end-radius: 0.5rem;
}

.make-it-italic {
    font-style: italic;
}

.make-text-bigger {
    font-size: 16px;
}

.table thead th {
    font-size: 14px;
    padding: .5em;
}

.upload-activity-table-borders {
    border-left: 0px;
    border-right: 0px;
    border-bottom : 0px;
}

.upload-activity-header-left-cell {
    border-right: 1px solid #dee2e6;
}

.upload-activity-header-middle-cell {
    border-right: 1px solid #dee2e6;
    border-left: 1px solid #dee2e6;
}

.upload-activity-header-right-cell {
    border-left: 1px solid #dee2e6;
}

.upload-activity-left-cell {
    border-left: 0px;
    border-right: 1px solid #dee2e6;
    border-top: 2px solid #dee2e6;
}

.upload-activity-middle-cell {
    border-left: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
    border-top: 2px solid #dee2e6;
}

.upload-activity-right-cell {
    border-left: 1px solid #dee2e6;
    border-right: 0px;
    border-top: 2px solid #dee2e6;
}

.no-more-borders {
    border: none!important;
}

.custom-file {
    height: calc(2em + 1rem + 2px);
    padding: 0.375rem 1.75rem 0.375rem 0.75rem;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.5;
    width: 75%;
}

    .custom-file.full-width {
        width: 100%;
    }


.digon-app-logo {
    margin-top:10px;
    height: 35px;
}

.hub-app-logo {
    margin-top: 10px;
    height: 35px;
}

.digon-logo {
    width: 200px;
    height: auto;
}

.footer-logo {
    height: 100%;
    width: auto;
}

.building-image-50 {
    height: 50px;
    width: auto;
}

.building-image-30 {
    height: 30px;
    width: auto;
}

.navbar-dsgrey .navbar-nav > li > a {
    font-size: 14px;
}

    .navbar-dsgrey .navbar-nav > li > a:hover {
        color: var(--slate-digital-primary-shade);
    }

.nav-user {
    height: 45px;
    padding-top: -2px;
    padding-bottom: 2px;
    background-color: var(--slate-digital-primary-color) !important;
    box-shadow: 0px 2px 5px 1px var(--slate-digital-primary-shade) !important;
}

.nav-main-container {
    height: 55px;
    z-index: 2 !important;
    display: flex;
    background-color: #fff !important;
    padding-top: 0px;
    padding-bottom: 0px;
    vertical-align: bottom;
    box-shadow: 0px 3px 8px 0px #999;
}

.nav-main {
    align-self: center;
    padding: 0px;
    margin: 0px;
    width: 100%;
    height: 100%;
    flex: 2;
    display: block;
}

.hub-app {
    height: 55px;
    width: 220px;
    background-color: var(--slate-digital-primary-shade) !important;
}

.hub-app-corner {
    height: 100%;
    width: 20px;
    border-top: 55px solid var(--slate-digital-primary-shade);
    border-right: 40px solid #fff;
}

.nav {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}

.navbar-environment {
    background-color: var(--concrete-digital-tertiary-color) !important
}

.navbar-environment {
    background-color: var(--concrete-digital-tertiary-color) !important
}

.navRow-environment-title {
    background-color: var(--gold-digital-primary-shade) !important;
    height: 100%;
    margin: 0;
}

    .navRow-environment-title > h4 {
        color: var(--main-bg-color);
        padding: 5px;
        font-weight: 700;
        font-size: 14px;
        font: 'Montserrat';
        margin: 0;
    }

.navRow-environment-link {
    /* color: #3D4644 !important;*/
}

/* */

.navbar-left > img {
    max-height: 100%;
    height: 100%;
    width: auto;
    margin: 0 auto;
    /* probably not needed anymore, but doesn't hurt */
    -o-object-fit: contain;
    object-fit: contain;
}


.navbar-inverse {
    background-color: var(--slate-digital-primary-color) !important;
}


.navbar {
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 0px;
    padding-bottom: 0px;

}

.staging-review-navbar {
    padding-right: 18px;
    padding-bottom: 3px;
}

.navRow {
    position: relative;
}


.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus {
    color: var(--concrete-digital-tertiary-shade);
    background-color: transparent;
}

.navbar-nav > li > a:active {
}




.navbar-inverse .navbar-text {
    color: var(--gold-digital-primary-color);
    font-size: 14px;
    font-weight: 500;
}

.navbar-text {
    margin-top: 29.5px;
    padding-bottom: 9px;
    margin-bottom: 0;
}

.nav-item{
    display: block;
    float: left;
    padding-left:4px;
    padding-right:4px;
    color: var(--slate-digital-primary-shade);
}

    .nav-item.hub-admin-dash {
        padding-left: 5px;
        padding-right: 5px;
    }

@media screen and (min-width: 2560px) {
    .nav-item.hub-admin-dash {
        padding-left: 15px;
        padding-right: 15px;
    }
}

    .nav-item-top-most {
        display: block;
        float: left;
        padding-left: 4px;
        padding-right: 4px;
        padding-top: 5px;
        width: 125px;
        flex-wrap: nowrap;
    }

    .nav-item-top-most-larger {
        display: block;
        float: left;
        padding-left: 2px;
        padding-right: 2px;
        padding-top: 5px;
        width: 150px;
        margin-right: 25px;
    }

    .nav-item-dropdown {
        width: 245px;
    }

    .text-orangeheader {
        color: var(--gold-digital-primary-color);
        font-weight: 700;
        font-size: 1.8em;
        margin-left: 15px;
    }

        .text-orangeheader.top-nav-main {
            color: var(--gold-digital-primary-color);
            font-weight: 700;
            font-size: 1.8em;
            margin-left: 0px;
        }

        .text-orangeheader.error-table-header-text {
            margin-left: 0px;
        }

        .text-orangeheader.in-line {
            display: inline;
        }

    .text-tenant {
        color: var(--slate-digital-primary-color);
        font-weight: 700;
        font-size: 1.8em;
    }

    .text-grey {
        color: #999 !important;
        font-size: 1.0em !important;
    }

    .text-nav {
        font-size: 2.4em;
    }

    footer {
        position: fixed;
        height: 35px;
        bottom: 0;
        width: 100%;
    }

    .dropdown-menu-right {
        background-color: var(--gold-digital-primary-color);
    }

    .dropdown-user-span {
        text-align: center;
        font-size: 16px;
        padding-bottom: 5px;
    }

        .dropdown-user-span.product-page {
            text-align: center;
            font-size: 16px;
            margin-left: 10px;
            flex-wrap: nowrap;
        }

    .dropdown-item.top-nav-bar {
        color: var(--concrete-digital-tertiary-tint);
    }

        .dropdown-item.top-nav-bar:hover {
            background-color: var(--gold-digital-primary-shade);
        }

    .tenant-admin-nav-bar {
    }

    .header-info-titles {
        text-align: center;
        font-size: 16px;
        margin-top: 15px;
    }

    .header-link {
        text-align: center;
        font-size: 16px;
        margin-top: 13px;
    }

    .main-nav-item {
        color: var(--slate-digital-primary-shade);
        font-weight: bold;
        font-size: 20px;
    }

    .current-nav-item {
        color: var(--gold-digital-primary-color);
        font-weight: bold;
        font-size: 20px;
    }

    .text-slate-tint {
        color: var(--slate-digital-primary-tint);
    }

        .text-slate-tint.product-select {
            font-size: 18px;
        }

    .title-image {
        width: 30%;
        height: auto;
        margin-top: 2%;
    }

    .title-image.smaller-source {
        width: 35%;
    }

    .product-image-small {
        width: 80%;
        height: auto;
        visibility:hidden;
    }

    .product-image {
        width: 60%;
        height: auto;
    }

    .product-image-larger {
        width: 65%;
        height: auto;
    }

    .product-image-largest {
        width: 75%;
        height: auto;
    }

    .product-image-xl {
        width: 15%;
        height: auto;
    }

    .product-image-bupload {
        width: 5%;
        height: auto;
    }

    .title-image-small {
        width: 2%;
        height: auto;
    }

    .half-col-offset {
        margin-left: 100px;
    }

    .big-time-offset {
        margin-left: 125px;
    }

    .three-quarters-col-offset {
        margin-left: 85px;
    }

    .left-and-right-margins-15 {
        margin-left: 15px;
        margin-right: 15px;
    }


    .top-margin-product-select {
        margin-top: 100px;
    }

    .top-margin-product-select-second-row {
        margin-top: 50px;
    }

    .top-margin-tenant-title {
        margin-top: 25px;
    }

    .top-margin-tenant-admin-nav {
        margin-top: 5px;
    }

    .top-margin-sage-action {
        margin-top: 12px;
    }

    .tiny-left-margin {
        margin-left: 5px;
    }

    .smol-left-margin {
        margin-left: 10px;
    }

    .small-top-padding {
        padding-top: 10px;
    }

    .medium-top-padding {
        padding-top: 15px;
    }

    .large-top-padding {
        padding-top: 20px;
    }

    .quarter-col-offset {
        margin-left: 10px;
        color: var(--slate-digital-primary-tint)
    }

    .one-third-col {
        margin-left: 15px;
    }

    .twenty-left-margin {
        margin-left: 20px;
    }

    .one-half-col {
        margin-left: 25px;
    }

    .first-col-offset {
        margin-left: 30px;
    }

    .second-col-offset {
        margin-left: 40px;
    }

    .second-half-col-offset {
        margin-left: 45px;
    }

    .third-col-offset {
        margin-left: 50px;
    }

    .two-third-col-offset {
        margin-left: 55px;
    }

    .two-col-offset {
        margin-left: 120px;
    }

    .eight-third-col-offset {
        margin-left: 200px;
    }

    .login-request-container {
        margin-top: 10px;
    }

    a.login-request-account {
        margin-top: 5px;
        background-color: var(--main-bg-color);
        color: var(--slate-digital-primary-tint);
        text-decoration: underline;
    }

    .login-form-hr {
        border: none;
        color: var(--concrete-digital-tertiary-shade);
        background-color: var(--concrete-digital-tertiary-shade);
        display: block;
        height: 40px;
    }

        .login-form-hr.management {
            margin: 0px 0px 25px 0px;
        }

        .login-form-hr.logdetails {
            margin: 0px 0px 50px 0px;
        }

        .login-form-hr.wizzy {
            margin: 0px;
        }

    .topnav-image {
        width: 90%;
        height: auto;
        margin-left: 10px;
    }

    .topnav-image-larger {
        width: 100%;
        height: auto;
        margin-right: 50px;
    }

    .grid-column-image {
        max-width: 100%;
        object-fit: contain;
    }

    .grid-image-column {
        max-width: 480px;
    }

    ul li {
        display: block;
        float: left;
    }

        ul li.k-item {
            float: none;
        }

    .upload-button {
        margin-left: 25px;
    }

    .hub-header-text {
        padding-top: 15px;
        padding-left: 10px;
        font-weight: bold;
    }

        .hub-header-text:hover {
            color: var(--gold-digital-primary-color);
        }

    .non-link-header {
        padding-top: 15px;
        padding-left: 10px;
        font-weight: bold;
    }

    .concrete-link-color:hover {
        color: var(--concrete-digital-tertiary-tint);
    }

    .gold-link-color:hover {
        color: var(--gold-digital-primary-color);
    }

    .dashboard-img {
        width: 25px;
        height: 25px;
        margin-top: 10px;
        margin-left: 50px;
    }

    .flow-dashboard-img {
        width: 25px;
        height: 25px;
        margin-top: 10px;
        margin-left: 10px;
    }

    .sage-dashboard-img {
        width: 25px;
        height: 25px;
        margin-right: 5px;
    }

    .dashboard-top-header {
        margin-top: 25px;
    }

    .dashboard-card-img {
        margin-top: 10px;
        margin-left: 25px;
    }

    .dashboard-count-font {
        text-align: center;
        font-size: 70px;
    }

    .job-data-dashboard-count-font {
        text-align: center;
        font-size: 55px;
        white-space: nowrap;
    }

    .center-cell {
        text-align: center !important;
        padding: 0 !important;
    }

    .nopadding {
        padding: 0 !important;
        margin: 0 !important;
    }

    .no-more-margins {
        margin: 0 !important;
    }

    .center-header {
        text-align: center !important;
    }

    .center-column-cell {
        vertical-align: middle !important;
    }

    .dashboard-top-row {
        padding: 50px;
    }


    .dashboard-status-column {
        max-width: 275px;
    }

    tr.k-footer-template td {
        background-color: var(--concrete-digital-tertiary-shade);
    }

    tr.k-group-footer td {
        background-color: var(--concrete-digital-tertiary-shade);
    }

    .column-right-border {
        border-right: 3px solid var(--concrete-digital-tertiary-color);
        width: 50%;
        font-weight: bold;
    }

        .column-right-border.grey-row {
            color: var(--concrete-digital-tertiary-shade);
            font-weight: bold;
        }

        .column-right-border.black-row {
            color: var(--slate-digital-primary-shade);
            font-weight: bold;
        }

    .column-left-border {
        border-left: 3px solid var(--concrete-digital-tertiary-shade);
        width: 50%;
        font-weight: bold;
    }

        .column-left-border.grey-row {
            color: var(--concrete-digital-tertiary-shade);
            font-weight: bold;
        }

    .black-and-bold {
        color: var(--slate-digital-primary-shade);
        font-weight: bold !important;
    }

        .black-and-bold.in-line {
            display: inline-block;
        }

        .black-and-bold.smaller {
            font-size: 8px;
        }

        .black-and-bold.big {
            font-size: 18px;
        }

        .black-and-bold.bigger {
            font-size: 24px;
        }

    .gold-and-bold {
        color: var(--gold-digital-primary-color);
        font-weight: bold;
    }

        .gold-and-bold.big {
            font-size: 18px;
        }

        .gold-and-bold.bigger {
            font-size: 24px;
        }

    .concrete-and-bold {
        color: var(--concrete-digital-tertiary-tint);
        font-weight: bold;
    }
        
        .concrete-and-bold.big {
            font-size: 18px;
        }

    .bigger-textarea {
        max-width: 100%;
        min-height: 50px;
    }

    .flow-alloy-scorecard-header > div.col-2 {
        color: var(--concrete-digital-tertiary-tint);
        background-color: var(--gold-digital-primary-color);
    }

    .flow-alloy-scorecard-header > div.col {
        color: var(--gold-digital-primary-color);
        background-color: white;
    }

    .flow-alloy-scorecard-header.even > div.col-2 {
        color: var(--concrete-digital-tertiary-tint);
        background-color: var(--gold-digital-primary-shade);
    }

    .flow-alloy-scorecard-header.even > div.col {
        color: var(--gold-digital-primary-shade);
        background-color: white;
    }

    .flow-report-header {
        color: var(--concrete-digital-tertiary-tint);
        background-color: var(--gold-digital-primary-color);
    }

    .spire-alloy-scorecard-header > div.col-2 {
        color: var(--concrete-digital-tertiary-tint);
        background-color: var(--slate-digital-primary-color);
    }

    .spire-alloy-scorecard-header > div.col {
        color: var(--slate-digital-primary-color);
        background-color: white;
    }

    .spire-alloy-scorecard-header.even > div.col-2 {
        color: var(--concrete-digital-tertiary-tint);
        background-color: var(--slate-digital-primary-shade);
    }

    .spire-alloy-scorecard-header.even > div.col {
        color: var(--slate-digital-primary-shade);
        background-color: white;
    }

    .spire-report-header {
        color: var(--concrete-digital-tertiary-tint);
        background-color: var(--slate-digital-primary-color);
    }

    .sage-alloy-scorecard-header > div.col-2 {
        color: var(--concrete-digital-tertiary-tint);
        background-color: var(--moss-digital-primary-color);
    }

    .sage-alloy-scorecard-header > div.col {
        color: var(--moss-digital-primary-color);
        background-color: white;
    }

    .sage-alloy-scorecard-header.even > div.col-2 {
        color: var(--concrete-digital-tertiary-tint);
        background-color: var(--moss-digital-primary-shade);
    }

    .sage-alloy-scorecard-header.even > div.col {
        color: var(--moss-digital-primary-shade);
        background-color: white;
    }

    .sage-report-header {
        color: var(--concrete-digital-tertiary-tint);
        background-color: var(--moss-digital-primary-color);
    }

    .alloy-scorecard-header > div.col-2 {
        color: var(--concrete-digital-tertiary-tint);
        background-color: var(--rust-digital-primary-color);
    }

    .alloy-scorecard-header > div.col {
        color: var(--rust-digital-primary-color);
        background-color: white;
    }

    .alloy-scorecard-header.even > div.col-2 {
        color: var(--concrete-digital-tertiary-tint);
        background-color: var(--rust-digital-primary-shade);
    }

    .alloy-scorecard-header.even > div.col {
        color: var(--rust-digital-primary-shade);
        background-color: white;
    }

    .alloy-report-header {
        color: var(--concrete-digital-tertiary-tint);
        background-color: var(--rust-digital-primary-color);
    }

    .hub-alloy-scorecard-header > div.col-2 {
        color: var(--concrete-digital-tertiary-tint);
        background-color: var(--section-blue-digital-tertiary-color);
    }

    .hub-alloy-scorecard-header > div.col {
        color: var(--section-blue-digital-tertiary-color);
        background-color: white;
    }

    .hub-alloy-scorecard-header.even > div.col-2 {
        color: var(--concrete-digital-tertiary-tint);
        background-color: var(--section-blue-digital-tertiary-shade);
    }

    .hub-alloy-scorecard-header.even > div.col {
        color: var(--section-blue-digital-tertiary-shade);
        background-color: white;
    }

    .hub-report-header {
        color: var(--concrete-digital-tertiary-tint);
        background-color: var(--section-blue-digital-tertiary-color);
    }

    .make-it-inline {
        display: inline !important;
    }

    .make-inline-block {
        display: inline-block !important;
    }

    .move-up {
        margin-top: -2px;
    }

    .pull-up {
        margin-top: -25px;
        margin-bottom: 25px;
    }

        .pull-up.no-bottom {
            margin-top: -25px;
            margin-bottom: 0px;
            padding-bottom: 0px;
        }

        .pull-up.less {
            margin-top: -15px;
            margin-bottom: 15px;
        }

        .pull-up.reduced {
            margin-top: -10px;
            margin-bottom: 10px;
        }

        .pull-up.tiny {
            margin-top: 5px;
            margin-bottom: -5px;
        }

    .bottom-border-pads {
        padding-bottom: 20px;
    }

    .push-down {
        margin-bottom: 2px;
    }

    .push-down-further {
        margin-bottom: 10px;
    }

    .pull-down {
        margin-bottom: -5px;
    }

    .pull-left {
        margin-left: -48px;
    }

        .pull-left.less {
            margin-left: -20px;
        }

        .pull-left.more {
            margin-left: -100px;
        }

    .drag-left {
        margin-left: -48px;
    }

        .drag-left.more {
            margin-left: -96px;
        }

        .drag-left.dmore {
            margin-left: -96px;
        }

    .edit-tenant-button {
        margin-left: -20px;
    }

    .top-and-bottom-space {
        margin-top: 25px;
        margin-bottom: 25px;
    }

    .cancel-margins {
        margin: 0px;
    }

    #dataJobQueue .k-grid-content {
        min-height: 350px;
        max-height: 400px;
    }

@media screen and (max-width: 1920px) {
    .smaller-screen {
        margin-left: 150px;
    }

    .small-screen-cancel-button {
        margin-left: -250px;
    }

    .edit-tenant-button {
        margin-left: -185px;
    }

    .add-user-small-screen-button {
        margin-left: -125px;
    }

    .pull-left {
        margin-left: -10px;
    }

        .pull-left.more {
            margin-left: -20px;
        }

    .create-selection-pull-left {
        margin-left: -50px;
    }

    .exclusively-small-pull-left {
        margin-left: -25px;
    }

        .exclusively-small-pull-left.greater {
            margin-left: -50px;
        }

        .exclusively-small-pull-left.more {
            margin-left: -75px;
        }

    .big-screen-font-4 {
        font-size: 1.15em;
    }

    .big-screen-font-3 {
        font-size: 1.00em;
    }

    #repoUL > li > ul > li::before {
        left: -1px;
    }

    #repoUL ul.treeBldgChildren > li::before {
        left: -1px;
    }

            .project-qstatus {
                display: block;
                position: fixed;
                z-index: 1000;
                top: 14% !important;
                left: 0;
                height: 40%;
                width: 20% !important;
            }

    .tenant-wtoken-copy {
        display: block;
        position: absolute;
        z-index: 1001;
        top: 10% !important;
        left: 75% !important;
        height: 5%;
        width: 30%;
        cursor: pointer;
    }
    }

    @media screen and (min-width: 1200px) {
        .dashboard-user-role-panel {
            margin-top: -50px;
        }

            .dashboard-user-role-panel.header-text {
                margin-left: 0px;
            }

            .dashboard-user-role-panel.management-header {
                margin-bottom: 25px;
            }

        .left-right-padding-largish {
            padding: 10px 45px 10px 45px;
        }

        .pull-right {
            margin-right: -500px;
        }

        .report-content-margins {
            margin-left: 0px;
        }

        .no-options-report-content-margins {
            margin-left: 0px;
        }
    }


    @media screen and (min-width: 2560px) {
        .big-screen-pull-left {
            margin-left: -175px !important;
        }

            .big-screen-pull-left.more {
                margin-left: -375px !important;
            }

            .big-screen-pull-left.lesser {
                margin-left: -300px !important;
            }

        .big-screen-pull-left-less {
            margin-left: -48px;
        }

            .big-screen-pull-left-less.lesser {
                margin-left: -70px !important;
            }

        .pull-right-big-screen {
            margin-right: -1000px;
        }

        .report-content-margins {
            margin-left: 0px;
        }

        .no-options-report-content-margins {
            margin-left: 0px;
        }

        .big-screen-font-5 {
            font-size: 1.25em;
        }

        .big-screen-font-4 {
            font-size: 1.5em;
        }

        .big-screen-font-3 {
            font-size: 1.3em;
        }

        .big-screen-font-2 {
            font-size: 2.5em;
        }

        .center-cell-child {
            position: absolute;
            top: 10%;
            left: 45%;
        }

            .center-cell-child.double-digit {
                left: 35%;
            }

        .bottom-cell-child {
            position: absolute;
            top: 65%;
            left: 35%;
        }

        #dataJobQueue .k-grid-content {
            min-height: 850px;
            max-height: 925px;
        }
    }

    

    .add-tenant-button {
        background-image: url('../img/HUB-icon-set-25px-tenant-wht.png');
        background-repeat: no-repeat;
        background-position: 15px 2px;
        height: 25px;
        padding: 2px 25px 2px 50px;
        vertical-align: middle;
        background-size: 20px;
        white-space: nowrap;
    }

    .add-user-button {
        background-image: url('../img/HUB-icon-set-25px-users-wht.png');
        background-repeat: no-repeat;
        background-position: 15px 2px;
        height: 25px;
        padding: 2px 25px 2px 50px;
        vertical-align: middle;
        background-size: 20px;
        white-space: nowrap;
    }

    .remove-user-column {
        background-image: url('../img/HUB-icon-set-25px-remove.png');
        background-repeat: no-repeat;
        background-position: 10px 2px;
        height: 25px;
        padding: 5px 10px 5px 40px;
        vertical-align: middle;
        background-size: 20px;
        color: var(--concrete-digital-tertiary-shade);
        font-weight: bold;
    }

    .remove-global-user-column {
        background-image: url('../img/HUB-icon-set-25px-remove.png');
        background-repeat: no-repeat;
        background-position: 125px 2px;
        height: 25px;
        padding: 5px 50px 5px 10px;
        vertical-align: middle;
        background-size: 20px;
        color: var(--concrete-digital-tertiary-shade);
        font-weight: bold;
    }

    .check-image-button {
        background-image: url('../img/HUB-icon-set-25px-check-wht.png');
        background-repeat: no-repeat;
        background-position: 20px 6px;
        height: 45px;
        padding: 10px 45px 10px 60px;
        vertical-align: middle;
        background-size: 30px;
    }

        .check-image-button.top-margin {
            margin-top: 12px;
        }

    .export-image-button {
        background-image: url('../img/HUB-icon-set-25px-dwnload.png');
        background-repeat: no-repeat;
        background-position: 20px 6px;
        height: 45px;
        padding: 10px 45px 10px 60px;
        vertical-align: middle;
        background-size: 30px;
    }

        .export-image-button.top-margin {
            margin-top: 12px;
        }

    .edit-global-user-column {
        background-image: url('../img/HUB-icon-set-25px-edit.png');
        background-repeat: no-repeat;
        background-position: 50px 2px;
        height: 25px;
        padding: 5px 40px 5px 10px;
        vertical-align: middle;
        background-size: 20px;
        color: var(--concrete-digital-tertiary-shade);
        font-weight: bold;
    }

    .grey-kendo-anchor {
        color: var(--concrete-digital-tertiary-shade);
    }

.add-project-button {
    background-image: url('../img/HUB-icon-set-25px-Project-wht.png');
    background-repeat: no-repeat;
    background-position: 15px 2px;
    height: 25px;
    padding: 2px 25px 2px 50px;
    vertical-align: middle;
    background-size: 20px;
    white-space: nowrap;
}

    .project-status-nochange {
        background-image: url('../img/FLOW-icon-set-25px-nodata.png');
        background-repeat: no-repeat;
        background-position: center;
        height: 25px;
        padding: 5px 5px 5px 5px;
        background-size: 20px;
    }

    .project-status-reviewing {
        background-image: url('../img/FLOW-icon-set-25px-review.png');
        background-repeat: no-repeat;
        background-position: center;
        height: 25px;
        padding: 5px 5px 5px 5px;
        background-size: 20px;
    }

    .project-status-approved {
        background-image: url('../img/FLOW-icon-set-25px-sync-ready.png');
        background-repeat: no-repeat;
        background-position: center;
        height: 25px;
        padding: 5px 5px 5px 5px;
        background-size: 20px;
    }

    .project-status-sent-to-builder {
        background-image: url('../img/FLOW-icon-set-25px-sent.png');
        background-repeat: no-repeat;
        background-position: center;
        height: 25px;
        padding: 5px 5px 5px 5px;
        background-size: 20px;
    }

    .review-data-button {
        background-image: url('../img/flow_icon_complete_white.png');
        background-repeat: no-repeat;
        background-position: 25px 8px;
        height: 45px;
        padding: 10px 25px 10px 75px;
        vertical-align: middle;
        background-size: 25px;
        color: var(--concrete-digital-tertiary-shade);
        font-weight: bold;
        white-space: nowrap;
        overflow: hidden;
    }

    .builder-sync-button {
        background-image: url('../img/flow_icon_sync_wht.png');
        background-repeat: no-repeat;
        background-position: 25px 8px;
        height: 45px;
        padding: 10px 25px 10px 75px;
        vertical-align: middle;
        background-size: 25px;
        font-weight: bold;
        color: #fff !important;
    }

    .grid-item-create-action {
        background-image: url('../img/flow_icon_created_green_fixed.png');
        background-repeat: no-repeat;
        background-position: 25px 8px;
        height: 45px;
        padding: 10px 25px 10px 75px;
        vertical-align: middle;
        background-size: 25px;
        font-weight: bold;
        white-space: nowrap;
        overflow: hidden;
    }

        .grid-item-create-action.single-cell {
            padding: 5px 10px 5px 15px;
            background-position: 5px 4px;
            background-size: 15px;
        }

    .grid-item-edit-action {
        background-image: url('../img/HUB-icon-set-25px-edit.png');
        background-repeat: no-repeat;
        background-position: 25px 8px;
        height: 45px;
        padding: 10px 25px 10px 75px;
        vertical-align: middle;
        background-size: 25px;
        font-weight: bold;
        white-space: nowrap;
        overflow: hidden;
    }

        .grid-item-edit-action.single-cell {
            padding: 5px 10px 5px 15px;
            background-position: 5px 4px;
            background-size: 15px;
        }

    .grid-item-delete-action {
        background-image: url('../img/flow_icon_deleted.png');
        background-repeat: no-repeat;
        background-position: 25px 8px;
        height: 45px;
        padding: 10px 25px 10px 75px;
        vertical-align: middle;
        background-size: 25px;
        font-weight: bold;
        white-space: nowrap;
        overflow: hidden;
    }

        .grid-item-delete-action.single-cell {
            padding: 5px 10px 5px 15px;
            background-position: 5px 4px;
            background-size: 15px;
        }

    .usr-latest-sync-info {
        background-image: url('../img/flow_icon_tablet.png');
        background-repeat: no-repeat;
        background-position: 50% 0%;
        width: 90%;
        position: relative;
        line-height: 2;
        padding-bottom: 130%;
        background-size: cover;
    }

        .usr-latest-sync-info h5 {
            position: absolute;
            top: 25%;
            left: 50%;
            transform: translate(-50%, -70%);
            margin: 0;
        }

        .usr-latest-sync-info h2 {
            position: absolute;
            top: 60%;
            left: 50%;
            transform: translate(-50%, -40%);
            margin: 0;
        }

    .rejection-button-text {
        color: #fff !important;
    }

    .tenant-overview-border {
        border: 2px solid var(--concrete-digital-tertiary-color);
        margin: -10px 50px 25px 50px;
    }

    .table-margins {
        margin: 10px 50px 25px 50px;
    }

    .role-table {
        width: 60%;
    }

    .table-container-padding {
        padding: 10px;
    }

    .bottom-column {
        float: none;
        display: table-cell;
        vertical-align: bottom;
    }

    .button-height {
        height: 45px;
    }

    .save-button-height {
        height: 35px;
    }

    .save-button-margins {
        margin: 5px 0px 2px 6px;
    }

    .one-tenth-height {
        height: 10%;
    }

    .one-fifth-height {
        height: 5%;
    }

    .one-fiftieth-height {
        height: 2%;
    }

    .fill-width {
        width: 100%;
    }

    .three-quarters-width {
        width: 75%;
    }

    .one-quarter-width {
        width: 25%;
    }

    .one-third-width {
        width: 30% !important;
    }

    .half-width {
        width: 50%;
    }

    .four-fifths-width {
        width: 99%;
    }

    .beyond-corners-width {
        width: 96%;
    }

    .left-right-padding {
        padding: 10px 45px 10px 45px;
    }

    .smaller-left-right-padding {
        padding: 5px 15px 5px 10px;
    }

    .unwrap-text {
        white-space: nowrap;
    }

    .Functions {
        padding: .5em;
    }

    .org-level {
        background-image: url('../img/HUB-icon-set-25px-Org.png');
        background-repeat: no-repeat;
        background-position: 35px 5px;
        padding: 10px 25px 10px 75px;
        vertical-align: middle;
        background-size: 35px;
        background-color: var(--gold-digital-primary-color);
    }

    .site-level {
        background-image: url('../img/HUB-icon-set-25px-Site.png');
        background-repeat: no-repeat;
        background-position: 35px 5px;
        padding: 10px 25px 10px 75px;
        vertical-align: middle;
        background-size: 35px;
        background-color: var(--moss-digital-primary-tint);
    }

    .complex-level {
        background-image: url('../img/HUB-icon-set-25px-Complex.png');
        background-repeat: no-repeat;
        background-position: 35px 5px;
        padding: 10px 25px 10px 75px;
        vertical-align: middle;
        background-size: 35px;
        background-color: var(--rust-digital-primary-tint);
    }

    .building-level {
        background-image: url('../img/flow_icon_building.png');
        background-repeat: no-repeat;
        background-position: 35px 5px;
        padding: 10px 25px 10px 75px;
        vertical-align: middle;
        background-size: 35px;
        background-color: var(--concrete-digital-tertiary-tint);
    }

    .treeview-padding {
        padding: 5px 0px 7px 22px !important;
    }

    .k-window-action .k-state-hover {
        border: none;
        background: none;
    }

    .k-treeview .k-in.k-state-hover,
    .k-treeview .k-in.k-state-focused,
    .k-treeview .k-in.k-state-hover.k-state-focused,
    .k-treeview .k-in.k-state-selected {
        border-color: transparent;
        background-color: transparent;
        box-shadow: none;
    }

    .approve-modal {
        display: none;
        position: fixed;
        z-index: 1000;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        background: rgba( 255, 255, 255, .8 ) url('../img/FhHRx.gif') 50% 50% no-repeat;
    }

    body.loading .approve-modal {
        overflow: hidden;
    }

    body.loading .approve-modal {
        display: block;
    }

    .mainCanvas-indicator {
        display: none;
        position: relative;
        top: 40%;
        left: 40%;
        height: 50%;
        width: 10%;
        max-height: 150px;
        background: rgba( 255, 255, 255, .8 ) url('../img/FhHRx.gif') 50% 50% no-repeat;
        z-index: 1337;
    }

    body.loading .mainCanvas-indicator {
        overflow: hidden;
    }

    body.loading .mainCanvas-indicator {
        display: block;
    }

    .mainCanvas-spinny {
        display: none;
        position: fixed;
        top: 40%;
        left: 40%;
        height: 50%;
        width: 10%;
        max-height: 150px;
        background: rgba( 255, 255, 255, .8 ) url('../img/FhHRx.gif') 50% 50% no-repeat;
        z-index: 1337;
    }

    body.loading .mainCanvas-spinny {
        overflow: hidden;
    }
    
    body.loading .mainCanvas-spinny {
        display: block;
    }

    .project-qstatus {
        display: block;
        position: fixed;
        z-index: 1000;
        top: 30%;
        left: 0;
        height: 50%;
        width: 15%; /* maybe change this on tucked? */
    }

    .tenant-wtoken-copy {
        display: block;
        position: absolute;
        z-index: 1001;
        top: 5%;
        left: 80%;
        height: 5%;
        width: 20%;
        cursor: pointer;
        transition: opacity 2s;
    }

/*.project-lpane {
        display: inline;
        width: 85%;
    } */

    .project-rpane {
        top: 50%;
        position: absolute;
    }

    .project-qstatus.tucked {
        top: 50% !important;
        height: 5% !important;
        width: 1% !important;
    }

    .k-grid .flow-tablet-sync {
        background-color: #ffffcc !important;
        color: #000000;
    }

    .k-grid td.flow-tablet-sync, .k-grid tr.flow-tablet-sync > td {
        background-color: #ffffcc !important;
        color: #000000;
    }

    .k-grid .flow-repo-sync {
        background-color: #ffebcc !important;
        color: #000000;
    }

    .k-grid td.flow-repo-sync, .k-grid tr.flow-repo-sync > td {
        background-color: #ffebcc !important;
        color: #000000;
    }

    .k-grid .flow-expo-sync {
        background-color: #ccf5ff !important;
        color: #000000;
    }

    .k-grid td.flow-expo-sync, .k-grid tr.flow-expo-sync > td {
        background-color: #ccf5ff !important;
        color: #000000;
    }

    .k-grid .flow-builder-sync {
        background-color: #ccffcc !important;
        color: #000000;
    }

    .k-grid td.flow-builder-sync, .k-grid tr.flow-builder-sync > td {
        background-color: #ccffcc !important;
        color: #000000;
    }

    .k-grid .flow-rejected-sync {
        background-color: #ffd6cc !important;
        color: #000000;
    }

    .k-grid td.flow-rejected-sync, .k-grid tr.flow-rejected-sync > td {
        background-color: #ffd6cc !important;
        color: #000000;
    }

    .k-grid .builder-snyc-errors {
        background-color: #6b3b3b !important;
        color: #000000;
    }

    .k-grid td.builder-snyc-errors, .k-grid tr.builder-snyc-errors > td {
        background-color: #6b3b3b !important;
        color: #000000;
    }

    .k-filter-row > th {
        padding: 3pt !important;
    }
    
    .k-grid tbody td {
        padding: 1pt;
        font-size: small;
    }

    #stagingChangesGrid.k-grid .k-state-selected {
        background-color: rgba(255,99,88,.25) !important;
        color: #000000;
    }
    
    #stagingChangesGrid.k-grid .k-alt.k-state-selected {
        background-color: rgba(255,99,88,.25) !important;
        color: #000000;
    }
    
    #stagingChangesGrid.k-grid td.k-state-selected, #stagingChangesGrid.k-grid th.k-state-selected, #stagingChangesGrid.k-grid tr.k-state-selected > td {
        background-color: rgba(255,99,88,.25) !important;
        color: #000000;
    }

    #dataJobQueue.k-grid .k-state-selected {
        background-color: var(--gold-digital-primary-tint) !important;
        color: #000000;
    }
    
    #dataJobQueue.k-grid .k-alt.k-state-selected {
        background-color: var(--gold-digital-primary-tint) !important;
        color: #000000;
    }

    #dataJobQueue.k-grid td.k-state-selected, #dataJobQueue.k-grid th.k-state-selected, #dataJobQueue.k-grid tr.k-state-selected > td {
        background-color: var(--gold-digital-primary-tint) !important;
        color: #000000;
    }

    #dataJobQueue .k-pager-nav {
        color: var(--gold-digital-primary-color) !important;
    }

    /*#dataJobQueue .k-grid-header-wrap.k-auto-scrollable {
        margin-right: 13px !important;
    }*/

.k-treeview .k-in.k-state-selected {
    border-color: #3c4443;
    font-weight: bold;
    color: #b6862d;
    background-color: #ffffff;
}

    #listView {
        min-width: 938px;
        min-height: 784px;
    }

    .new-rulebook-addition {
        background-color: #ccf5ff;
    }

    #searchRuleInput {
        box-sizing: border-box;
        background-image: url('../img/searchicon.png');
        background-position: 10px 8px;
        background-repeat: no-repeat;
        font-size: 16px;
        padding: 10px 20px 8px 45px;
        border: none;
        border-bottom: 1px solid #ddd;
        min-width: 75px;
        max-width: 145px;
    }
    
        #searchRuleInput:focus {
            outline: 3px solid #ddd;
        }

    .photo-item {
        float: left;
        position: relative;
        width: 238px;
        height: 140px;
        margin: 5px;
    }

        .photo-item img {
            position: relative;
        }

        .photo-item .overlay {
            position: absolute;
            visibility: hidden;
            left: 0;
            top: 115px;
            z-index: 100;
            width: 232px;
            height: 20px;
            padding: 3px;
            background: #000000;
            background: rgba(0, 0, 0, 0.75);
            font-size: small;
            color: #FFF;
        }

            .photo-item .overlay .title {
                display: inline-block;
                width: 200px;
                height: 20px;
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
            }

        .photo-item:hover .overlay {
            visibility: visible;
        }

.ProductCardTitlePrimary {
    background-color: var(--moss-digital-primary-color) !important;
    color: white;
    font-size: 1.7em;
    font-weight: 600;
}

    .ProductCardTitlePrimary .small {
        color: var(--gold-digital-primary-color);
    }

.ProductTableHeaderPrimary {
    background-color: var(--moss-digital-primary-color) !important;
    font-weight: bolder !important;
    color: white !important;
    padding-bottom: 0.25rem !important;
    padding-top: 0.25rem !important;
}

.ProjectCardHeaderPrimary {
    background-color: var(--moss-digital-primary-color) !important;
    font-weight: bolder !important;
    color: white !important;
}

.ProductTableHeaderSecondary {
    background-color: var(--moss-digital-primary-tint) !important;
    font-weight: bolder !important;
    color: white !important;
    padding-bottom: 0.25rem !important;
    padding-top: 0.25rem !important;
}

.ProductTableHeaderGreen {
    background-color: #00871e !important;
    font-weight: bolder !important;
    color: white !important;
    padding-bottom: 0.25rem !important;
    padding-top: 0.25rem !important;
}

.ProductTableHeaderGold {
    background-color: var(--gold-digital-primary-color) !important;
    font-weight: bolder !important;
    color: white !important;
    padding-bottom: 0.25rem !important;
    padding-top: 0.25rem !important;
}

    .ProductTableHeaderGold.no-pads {
        padding-bottom: 0rem !important;
        padding-top: 0rem !important;
    }

.ProjectCardHeaderGold {
    background-color: var(--gold-digital-primary-color) !important;
    font-weight: bolder !important;
    color: white !important;
}

.ProductTableHeaderSlated {
    background-color: var(--slate-digital-primary-color) !important;
    font-weight: bolder !important;
    color: white !important;
    padding-bottom: 0.25rem !important;
    padding-top: 0.25rem !important;
}

.ProjectCardHeaderSlated {
    background-color: var(--slate-digital-primary-color) !important;
    font-weight: bolder !important;
    color: white !important;
}

.text-truncate {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 75%;
}

.sage-rulebook-rule-title {
    color: var(--moss-digital-primary-tint);
}
    .sage-rulebook-rule-title.rule-messages {
        font-size: 1.5em;
    }

.sage-auto-solve-rule {
    background-color: #babfad;
}

#repoUL {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

    #repoUL li {
        display: block;
        position: relative;
        padding-left: calc(2 * 1.5rem - 10px - 2px);
    }

    #repoUL ul {
        margin-left: calc(10px - 1.5rem);
        padding-left: 0;
    }

        #repoUL ul li {
            border-left: 2px solid #c5a76f;
        }

            #repoUL ul li:last-child {
                border-color: transparent;
            }

            #repoUL ul li::before {
                content: '';
                display: block;
                position: absolute;
                top: -1.74rem;
                left: -2px;
                width: calc(1.5rem + 2px);
                height: calc(2 * 1.5rem - 10px);
                border: solid #c5a76f;
                border-width: 0 0 2px 2px;
            }

            #repoUL ul.treeBldgChildren > li:first-child:before {
                height: calc(2 * 2.2rem + 12px);
                top: calc(2 * -2rem - 10px);
            }

.plusle {
    cursor: pointer;
    user-select: none; /* Prevent text selection */
}

.bldgBatchCaret {
    pointer-events: none;
}

    .bldgBatchCaret::before {
        content: "\25B6";
        color: black;
        display: inline-block;
        margin-right: 6px;
        padding-top: 4px;
        cursor: pointer;
        pointer-events: all;
    }

.bldgBatchCaret-down::before {
    transform: rotate(90deg);
}


.selectedNode {
    background-color: #ccc;
    border: 1px solid #ccc;
    border-radius: 20px;
}

.nested {
    display: none;
}

.active {
    display: block;
}

.tab {
    overflow: hidden;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
}

    .tab button {
        background-color: inherit;
        float: left;
        border: none;
        outline: none;
        cursor: pointer;
        padding: 14px 16px;
        transition: 0.3s;
    }

        .tab button:hover {
            background-color: #ddd;
        }

.tabcontent {
    display: none;
    animation: fadeEffect 1s;
}

@keyframes fadeEffect {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.gutter {
    background-color: #c5a76f;
    background-repeat: no-repeat;
    background-position: 50%;
    /*margin-top: 6.25em;*/
    margin-top: .9em;
    margin-bottom: .9em;
}

    .gutter.gutter-vertical {
        background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAFAQMAAABo7865AAAABlBMVEVHcEzMzMzyAv2sAAAAAXRSTlMAQObYZgAAABBJREFUeF5jOAMEEAIEEFwAn3kMwcB6I2AAAAAASUVORK5CYII=');
    }

    .gutter.gutter-horizontal {
        background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAeCAYAAADkftS9AAAAIklEQVQoU2M4c+bMfxAGAgYYmwGrIIiDjrELjpo5aiZeMwF+yNnOs5KSvgAAAABJRU5ErkJggg==');
    }

.split {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

input.invalid {
    background-color: #ffdddd;
}

.tctab {
    display: none;
}

.tcstep {
    height: 15px;
    width: 15px;
    margin: 0 2px;
    background-color: #bbbbbb;
    border: none;
    border-radius: 50%;
    display: inline-block;
    opacity: 0.5;
}

    /* Mark the active step: */
    .tcstep.active {
        opacity: 1;
    }

    /* Mark the steps that are finished and valid: */
    .tcstep.finish {
        background-color: var(--gold-digital-primary-color);
    }

.login-wrapper {
    padding: 15px;
    max-width: 100%;
}

.login-logo {
    max-width: 100%;
    height: auto;
    padding: 10px;
}

.login-title {
    font-size: 1.5rem;
    margin: 10px 0;
}

.login-form-container {
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    padding: 20px;
}

.login-form-group {
    margin-bottom: 1.25rem;
}

    .login-form-group label {
        display: block;
        margin-bottom: 0.5rem;
        font-weight: 600;
        font-size: 0.95rem;
    }

.login-input {
    width: 100%;
    padding: 12px 15px;
    font-size: 16px; /* Prevents iOS zoom on focus */
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
}

    .login-input:focus {
        outline: none;
        border-color: #b6862d;
        box-shadow: 0 0 0 2px rgba(182, 134, 45, 0.2);
    }

.login-checkbox-group {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 1rem 0;
}

    .login-checkbox-group input[type="checkbox"] {
        width: 20px;
        height: 20px;
        cursor: pointer;
    }

    .login-checkbox-group label {
        margin: 0;
        cursor: pointer;
        font-size: 0.95rem;
    }

.login-submit-container {
    margin-top: 1.5rem;
}

.login-submit-btn {
    width: 100%;
    padding: 14px 20px;
    font-size: 1.1rem;
    font-weight: 600;
}

.login-validation-summary {
    margin-top: 1rem;
}

.login-links-container {
    margin-top: 2rem;
    padding: 15px 15px 30px 15px; /* Added bottom padding for scroll space */
    text-align: center;
}

    .login-links-container a {
        display: inline-block;
        margin: 5px 0;
        font-size: 1rem;
    }

/* Ensure login page is scrollable on all screen sizes */
.login-body-background {
    min-height: 100%;
    height: auto;
    overflow-y: auto;
    padding-bottom: 20px;
}

/* Policy Modal - Mobile Responsive */
.policy-modal .modal-dialog {
    margin: 10px auto;
    max-width: calc(100% - 20px);
}

.policy-modal .modal-content {
    width: 100% !important;
    margin-left: 0 !important;
}

.policy-modal .modal-header-custom {
    padding: 15px;
    font-size: 1rem;
    text-align: center;
    font-weight: bold;
    line-height: 1.4;
}

.policy-modal .modal-body {
    padding: 15px;
    max-height: 60vh;
    overflow-y: auto;
}

.policy-modal .policy-list {
    padding-left: 20px;
    margin: 0;
    list-style: square;
}

    .policy-modal .policy-list li {
        margin-bottom: 12px;
        line-height: 1.5;
        font-size: 0.9rem;
    }

.policy-modal .modal-footer {
    padding: 15px;
    justify-content: center;
}

.policy-modal .btn-accept {
    min-width: 120px;
    padding: 12px 30px;
}

/* Tablet and Desktop styles */
@media (min-width: 576px) {
    .login-wrapper {
        padding: 20px;
    }

    .login-title {
        font-size: 1.75rem;
    }

    .login-form-container {
        padding: 30px;
    }

    .login-submit-btn {
        width: auto;
        min-width: 150px;
    }

    .login-submit-container {
        text-align: center;
    }

    .policy-modal .modal-dialog {
        max-width: 600px;
    }

    .policy-modal .modal-header-custom {
        font-size: 1.2rem;
    }

    .policy-modal .policy-list li {
        font-size: 0.95rem;
    }
}

@media (min-width: 768px) {
    .login-wrapper {
        padding: 30px;
    }

    .login-form-container {
        padding: 40px;
    }

    .policy-modal .modal-dialog {
        max-width: 700px;
    }

    .policy-modal .modal-header-custom {
        font-size: 1.3rem;
        padding: 20px;
    }

    .policy-modal .modal-body {
        max-height: none;
    }
}

@media (min-width: 992px) {
    .policy-modal .modal-dialog {
        max-width: 750px;
    }

    .policy-modal .modal-header-custom {
        font-size: 1.5rem;
    }
}