html, body
{
    height: 100%;
    margin: 0;
    overflow: hidden;
}

body
{
    min-width:1024px;
}

.portal-text
{
    font-size: 26px;
    color: #3fb4d7;
    padding-top:15px;
    padding-bottom:40px;
}
.recovery-text
{
    font-size: 26px;
    color: rgba(182, 215, 109, 0.98);
    padding-top:15px;
    padding-bottom:40px;
}
.el-test
{
    background-color: red;
}

.light-grey-bot-border
{
    border-bottom: 1px solid #a1a1a1;
}

.header-bar
{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 76px;
    padding: 0;
    z-index: 100;
}

.inner-header-bar
{
    width: 100%;
    height: 76px;
    padding-left: 30px;
    padding-right: 30px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
}

.main-container
{
    position: fixed;
    top: 76px;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0;
    width: 100%;
}

/* White rounded chip behind the per-tenant logo so any uploaded logo reads cleanly on the dark header */
.inner-header-logo-span
{
    display: inline-flex;
    align-items: center;
    padding: 4px;
    background: #ffffff;
    border-radius: 6px;
    margin: 0;
}

.inner-header-logo-span img
{
    display: block;
    height: 34px;
    width: auto;
}


.nav-header-container
{
    margin: 0 0 0 auto;
    padding: 0;
    float: none;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #5d5d5d;
}

#session-user
{
    margin-left: 0;
    color: #5d5d5d;
}

.nav-header-container a
{
    padding: 0;
    color: #5d5d5d;
    text-decoration: none;
}

.nav-header-container a:hover
{
    color: #337ab7;
}


.content-pane
{
    width: 100%;
    flex: 1 1 0;
    min-height: 0;
    height: auto;
    overflow-y: auto;
    padding: 0;
}

.content-column
{
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 28px 30px 0 30px;
    box-sizing: border-box;
}

.content-table
{
    width: calc(100% - 40px);
    border-collapse: collapse;
}

.content-header
{
    padding-top: 0;
    font-size: 24px;
    color: #5e5e5e;
}

.content-header-space
{
    height:12px;
}

.content-box-label
{
    color: #7e7e7e;
    font-size:16px;
    padding-bottom:4px;
    padding-top: 15px;
}

.listing-table
{
    margin-top:20px;
    max-width: 100%;
    cursor: pointer;
}

.listing-table-bot-bord
{
    border-bottom: 1px solid #ddd;
}
.listing-table-left-bord
{
    border-left: 1px solid #ddd;
}
.listing-table-bot-bord
{
    border-bottom: 1px solid #ddd;
}
.listing-table-right-bord
{
    border-right: 1px solid #ddd;
}
.form-checkbox
{
    width:20px;
    height:20px;
    cursor: pointer;
}

.checkbox-label
{
    color: #7e7e7e;
    font-size:16px;
    padding-top: 25px;
}

.content-check
{
    padding-top: 23px;
}

.button-bar
{
    padding-top: 35px;
}

.button-bar-row td
{
    padding: 10px;
}
.button-bar-row button
{
    min-width: 100px;
}

/* Detail-page static action box
   Sticky to the bottom of the scrolling .content-pane. Width matches the form fields
   (calc(100% - 40px), max 800px). A fade above + an 8px solid white gap soften the edge
   where scrolling form fields meet the bar. The scrollbar runs the full pane height
   alongside the bar. */
.detail-floating-bar
{
    position: sticky;
    bottom: 16px;
    z-index: 10;
    width: calc(100% - 40px);
    max-width: 800px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    background: #ffffff;
    border: 1px solid #dddddd;
    border-radius: 4px;
    padding: 11px;
    box-sizing: border-box;
}

/* Solid-white strip below the bar, full bar-width, to hide form fields scrolling past behind it. */
.detail-floating-bar::after
{
    content: '';
    position: absolute;
    left: -1px;
    right: -1px;
    top: calc(100% + 1px);
    height: 17px;
    background: #ffffff;
}

.detail-floating-bar > table
{
    margin: 0;
    border-collapse: collapse;
}

.detail-floating-bar .button-bar-row td
{
    padding: 0 6px;
}

.detail-floating-bar .button-bar-row td:first-child
{
    padding-left: 0;
}

.detail-floating-bar .button-bar-row td:last-child
{
    padding-right: 0;
}

.detail-floating-bar .button-bar-row button
{
    min-width: 100px;
}

.detail-floating-bar-fade
{
    position: absolute;
    left: -1px;
    right: -1px;
    bottom: calc(100% + 1px);
    height: 60px;
    pointer-events: none;
    background: linear-gradient(
        to top,
        rgba(255, 255, 255, 1) 0%,
        rgba(255, 255, 255, 1) 33%,
        rgba(255, 255, 255, 0) 100%
    );
    opacity: 0;
    transition: opacity 0.2s ease;
}

.detail-floating-bar-fade.is-overflowing
{
    opacity: 1;
}

.page-footer
{
    padding-top:100px;
}

.search-icon {padding-right:8px; font-size: 12px;}

.listing-filter-table-buttons
{
    margin-top:10px;
}

.listing-filter-table-buttons td
{
    padding-right:10px;
}

.listing-filter-table-buttons button
{
    width: 140px;
}

.listing-filters-table
{
    margin-top:20px;
}
.listing-table-filter-fields-row td
{
    background-color: #5bc0de;
}


.listing-table-head-row th
{
    cursor: pointer;
    color: #0a3d6e;
}
.panel-body { padding:0px; }
.panel-body table tr td { padding-left: 15px }
.panel-body .table {margin-bottom: 0px; }
.panel-group .glyphicon { margin-right:10px; }
.panel-group a { text-decoration: none; }

.select2-result-repository__statistics a
{
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 12px;
}

.select2-result-repository__statistics .glyphicon
{
    font-size: 9px;
    }

.form-section
{
    padding-top:35px;
    padding-bottom:10px;
    font-size: 18px;
    color: #5e5e5e;
    border-bottom:1px solid #eee;
}

.template-step-tableheader td{
    padding:1px;
    font-size:16px;
}

.instruction-detail-table
{
    margin-top:10px;
    background-color: #e8feff;
}
.instruction-detail-table td
{
    vertical-align: top;
    padding:5px;
}
.instruction-detail-table p
{
    padding-top:5px;
}

.instruction-list-options td
{
    padding:5px;
}

.instruction-summary-glyphs
{
    padding-top:6px;
}
.instruction-delete
{
    padding-top:8px;
}
.instruction-list-options
{
    cursor: pointer;
}

.instruction-step-container td
{
    padding: 5px;
}

.instruction-type-glyph
{
    color: white;
    background-color: #337ab7;
    border-radius: 3px;
    padding:6px;
}

.instruction-step-header td
{
    border-bottom:1px solid #ccc;
}

.instruction-step-sub-header td
{
    height: 20px;
}

.instruction-step-container tr
{
    cursor: pointer;
}


.instruction-step-container tbody {
    color: #4e4e4e;
}

.instruction-detail-footer td
{
    height: 40px;
    border-top: 1px solid #ccc;
    background-color: white;
}
.glyphicon-remove
{
    color: #c12e2a;
}
.submenu-glyph
{
    color: #3d3d3d;
}
.glyphicon-plus
{
    color: #449d44;
}

.glyphicon-triangle-bottom
{
    color: #4e4e4e;
}

.glyphicon-triangle-bottom, .glyphicon-triangle-bottom
{
    color: #4e4e4e;
}

.instruction-table-color
{
    background-color: rgba(136, 238, 101, 0.05);
}

.instruction-table-color td
{
    vertical-align: top;
}

.answer-sort-glyph
{
    padding-top:8px;
}
.answer-del-glyph
{
    padding-top:15px;
}

.new-instruction-row td
{
    padding-top: 20px;
}

.text-primary
{

}
.search-glyph
{
 color:white;
}

.bank-table td
{
    padding:2px;
    padding-left: 8px;
}
.bank-table strong
{
    color:black;
}

.credit-summary-table td{
    padding: 5px;

}

.list-paginate
{
    font-size: 14px;
    padding:3px;
    margin-left:10px;
}

.change-user-detail
{
    margin-left: 10px;
    font-size:12px;
}

.red-input-border
{
    border: 2px solid red;
}

.form-multi-select
{
    width:180px;
}

.rs-preloader {
    border: 6px solid #f3f3f3; /* Light grey */
    border-top: 6px solid #5bc0de; /* Blue */
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: spin 1s linear infinite;
    margin-left:10px;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

#import-mapping-table td{
    padding:5px;
}

#import-mapping-table-body td{
    border-bottom:1px solid black;
    font-family: Verdana;
    font-size: 12px;
}

.row-color
{
    color: orangered;
}

.import-header-row
{
    background-color: rgba(0, 183, 232, 0.09);
}

.google-map
{
    height: calc(100% - 100px);
    width:100%;
    border: 1px solid #5d5d5d;
    border-radius: 3px;
}

.call-planner-bar
{
    position:relative;
    margin-left:4px;
    height:20px;
    width:10px;
}

#dashboard_designer_div
{
    position: absolute;
    top:70px;left:0;
    right:0;
    bottom:0;
    right:0;
    background-color: rgba(30,30,30,0.98);
    /*background-color:grey;*/
    z-index: 100;
    display: none;
}

.close-designer
{
    color:#efefef;
    font-size: 24px;
    cursor: pointer;
    margin-top:0px;

}
.save-designer
{
    color:#5cb85c;
    font-size: 24px;
    cursor: pointer;
    margin-top:0px;
}

.dashboard-designer-title
{
    padding-top:40px;
    padding-bottom:55px;
    color:#efefef;
    font-size: 24px;
}

.dashloader
{
    width:200px;
    height:200px;
}

.dashboard-grid-unavail
{
    padding-top:48px;
    color:#efefef;
    font-size: 16px;
}

.dash-widget-div
{
    background-color: #2d2d2d;
    border: 2px dashed #1d1d1d;
}

#dashboard-widget-area
{
    border: 5px solid white;
}

.dash-containment-area
{
    background-color: #5d5d5d;
    padding:4px;
}

.dash-droppable-block
{
    background-color: black;
    float:left;
    border:2px solid #5d5d5d;
    display:table;
}

.add-widget-glyph:hover
{
    opacity: 1;
}

.add-widget-glyph
{
    color:#efefef;
    font-size: 24px;
    opacity: 0.2;
    display:table-cell;
    vertical-align:middle;
    cursor: pointer;
    margin-left: auto;
    margin-right: auto;
    width:24px;
}

.default-dash-widget
{
    width:100px;
    height:100px;
    background-color: black;
    z-index:999;
    cursor: pointer;
}

.widget-edit-but
{
    width:24px;
    height:24px;
    position: absolute;
    top:5px;
    left:5px;
}
.edit-widget-glyph
{
    color: #3d3d3d;
}
.edit-widget-glyph:hover
{
    color: #efefef;
}

.widget-del-but
{
    width:24px;
    height:24px;
    position: absolute;
    top:5px;
    right:5px;
}
.del-widget-glyph
{
    color: #3d3d3d;
}
.del-widget-glyph:hover
{
    color: red;
}

.widget-add-border
{

}

.widget-canvas
{
    margin-top:30px;
}


/*********************************/

.dashboard-dark-background
{
    background-color: #1d1d1d;
}

.dashboard-full-screen
{
    position: absolute;

    z-index: 1;

    display:none;

    top:0;
    left:0;
    bottom:0;
    right:0;

    background-color: #1d1d1d;
}

.rocksoft-logo-med
{
    width: 600px;
    height: 96px;

    margin-left: auto;
    margin-right:auto;
    margin-top:60px;
    background-size: 100% auto;
    background-image: url('../images/RS_Black_Dash.png');
    background-repeat: no-repeat;
}

.dashboard-input-labels
{
    color:#efefef;
    font-size: 32px;
    padding-top:20px;
}

.dashboard-login-input
{
    padding:30px;
    text-align: center;
    font-size:32px;
    margin-top:10px;
    width: 400px;
}

.dashboard-login-but
{
    margin-top: 50px;
    width: 200px;
}

.tv-screen-area
{
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color: black;
}

.dashboard-title-div
{
    position:absolute;
    left:0;
    right:0;
    top:0;
    background-color: #2b2b2b;
}

.dashboard-content-area
{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
//background-color: #1d1d1d;
    background-color: black;

}

.dashboard-title-label
{
    color: #efefef;
    font-size: 28px;
    padding-top:12px;
}

.dashboard-title-time
{
    padding-right:30px;
}

.dashboard-cropped-area
{
    margin-left:auto;
    margin-right:auto;

    background-color: black;
}

.dashboard-template-block
{
//background-color: #1d1d1d;
    background-color: black;
    position: absolute;
    text-align: center;
    display:table;
}

.widget-main-container
{
    width: 100px;
    height: 100px;
    background-color: #0f0f0f;
    position: absolute;
    cursor: pointer;
}

.widget-title-div
{
    color: #dfdfdf;
    font-size: 24px;
    position: absolute;
    left: 10px;
    top: 3px;
    right: 10px;
    height: 30px;
    padding: 0;
    white-space: nowrap;
    overflow:hidden;
}
.widget-subtitle-div
{
    color: #adadad;
    font-size: 12px;
    position: absolute;
    left: 12px;
    top: 35px;
    right: 10px;
    height: 20px;
    padding: 0;
    white-space: nowrap;
    overflow:hidden;
}

.widget-content-element
{
    width:100%;
    height: 100%;
}

.widget-edit-div
{
    position: absolute;
    left:8px;
    bottom: 5px;
    cursor: pointer;
    color:#efefef;
    font-size: 14px;
    opacity: 0.2;
}
.widget-delete-div
{
    position: absolute;
    left:32px;
    bottom: 5px;
    cursor: pointer;
    color:#efefef;
    font-size: 14px;
    opacity: 0.2;
}

.widget-delete-div:hover
{
    opacity: 1;
}
.widget-edit-div:hover
{
    opacity: 1;
}

.list-container
{
    position: absolute;
    top: 60px;
    left: 4px;
    right: 10px;
    bottom: 25px;
    white-space: nowrap;
    overflow:hidden;
    /*background-color: red;*/
}

.list-page-number
{
    color:#dfdfdf;
    font-size: 12px;
    position: absolute;
    bottom: 5px;
}

.widget-list-primary-stat
{
    color:white;
}
.widget-list-secondary-stat
{
    color:rgb(227, 189, 2);
    font-size: 12px;
}
.widget-list-tertiary-stat
{
    color:#90c564;
    font-size: 12px;
}

.widget-list-item-container
{
    margin-top:10px;
}
.widget-list-item-stat-container
{
    margin-left:5px;
    float:left;
}
.widget-list-item-rank-container
{
    float:left;
    color:#dfdfdf;
    width: 24px;
    height: 24px;
    font-size:24px;
    text-align: left;
}

.stat-trophy
{
    width: 16px;
    margin-top:-4px;
}

.image-field-upload
{
    margin-left:10px;
    font-size: 14px;
    color: orange;
    cursor: pointer;
}

.server-activity-h1
{
    color: #aeaeae;
    font-size: 20px;
}
.server-activity-h3
{
    color: #cecece;
    font-size: 16px;
    padding: 5px;
}
.server-activity-canvas
{
    width:48%;
}

.inline-listing-page-icon
{
    font-size: 12px;
    margin-left: 10px;
    color: #337ab7;
    cursor:pointer;
}

.left-menu-container
{
    width: 280px;
    vertical-align: top;
    height: 100%;
}

.left-menu-container > div
{
    height: calc(100vh - 76px);
    overflow: hidden;
    padding: 30px 10px 30px 30px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
}

.nav-menu-label
{
    position: relative;
    flex: 0 0 auto;
    font-size: 14px;
    font-weight: 700;
    color: #3a3a3a;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    line-height: 29px;
    margin: 0 0 18px 0;
    padding: 0 0 4px 0;
    border-bottom: 1px solid #e0e0e0;
}

.nav-menu-label-fade
{
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 1px);
    height: 30px;
    pointer-events: none;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.nav-menu-label-fade.is-scrolled
{
    opacity: 1;
}

/* Fade at the BOTTOM of the nav-menu scroll area (mirror of nav-menu-label-fade) */
.nav-menu-bottom-fade
{
    position: sticky;
    bottom: 0;
    height: 30px;
    margin-top: -30px;
    pointer-events: none;
    background: linear-gradient(to top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
    opacity: 0;
    transition: opacity 0.2s ease;
    z-index: 5;
}

.nav-menu-bottom-fade.is-overflowing
{
    opacity: 1;
}

/* Fade above the page title — sits at the top of .content-pane, sticky during scroll.
   height + negative margin-bottom keeps it out of normal flow so the page title stays
   exactly where it was (preserving vertical centre alignment with NAVIGATION MENU). */
.content-pane-top-fade
{
    position: sticky;
    top: 0;
    height: 30px;
    margin-bottom: -30px;
    pointer-events: none;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
    opacity: 0;
    transition: opacity 0.2s ease;
    z-index: 5;
}

.content-pane-top-fade.is-scrolled
{
    opacity: 1;
}

.left-menu-container .panel-group
{
    flex: 1 1 0;
    min-height: 0;
    overflow-y: auto;
    margin-bottom: 0;
}

.main-td-container
{
    vertical-align: top;
    height: 100%;
}

.main-container > table
{
    width: 100%;
    height: 100%;
    border-collapse: collapse;
}

#resource-timeline-div
{
    position: absolute;
    left: 340px;
    top: 150px;
    right: 30px;
    bottom: 30px;
}

.fc-widget-content
{
    cursor: pointer;
}

.resource-planner-zoom
{
    display: block;
    font-size:20px;
    cursor: pointer;
}