.fti-body {
    overflow-y: visible;
}

    .fti-body > .row {
        width: 100%;
        margin: 0;
    }

.wv-search-details {
    border: none;
    font-size: 0.875rem;
    color: #627895;
}

.wv-filter {
    color: #627895;
}

.workview-dv-body .dv-body {
    padding: 0;
    overflow-x: hidden;
}

.wv-tag {
    background: #dee3e8;
    border-radius: 0.25rem;
    font-size: 0.875rem;
    color: #0076D1;
    font-weight: bold;
    padding: 0 .5rem;
    transition: all .2s ease;
}

    .wv-tag span {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        float: left;
        white-space: pre;
    }

        .wv-tag span:first-child {
            width: 40%;
            color: #627895;
            text-align: left;
        }

        /* last-of-type because there could be another elem after the tags, like remove comp */
        .wv-tag span:last-of-type:not(:first-child) {
            width: 60%;
            text-align: right;
        }

    .wv-tag:after {
        display: block;
        content: '';
        clear: both;
    }

    .wv-tag:not(:last-child) {
        margin-bottom: .25rem;
    }

    .wv-tag[ng-click]:hover {
        cursor: pointer;
        background: rgba(0,118,209, 0.15);
    }

    .wv-tag .watch-item {
        display: inline;
        padding: 0.07rem 0.3rem;
        padding-right: 1.20rem;
    }

        .wv-tag .watch-item span:last-child {
            width: inherit;
            color: inherit;
        }

        .wv-tag .watch-item .watch-btn {
            padding: 0;
            line-height: 1;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
        }

        .wv-tag .watch-item .context-item-btn {
            position: initial;
            padding: 0 0.3rem;
        }

.wv-tag-btn {
    background: #0076D1;
    cursor: pointer;
    color: #fff;
    text-align: center;
}

    .wv-tag-btn:hover,
    .wv-tag.wv-tag-btn:hover {
        background: #148AE5;
    }

    .wv-tag-btn, .wv-tag-btn span {
        color: #fff;
    }

.workview-app-filter {
    padding: .1rem .5rem .1rem 1rem;
    background: rgba(255,255,255,0.1);
    border-radius: 0.25rem;
    font-size: 0.875rem;
    display: inline-block;
}

    .workview-app-filter label {
        font-weight: bold;
        opacity: 0.75;
        margin: 0;
    }

    .workview-app-filter .btn.btn-fa {
        padding: 0;
    }

.prescribed-workview-app-filter {
    padding: .1rem .5rem .1rem 1rem;
    background: #211551;
    color: #fff;
    border-radius: 0.25rem;
    font-size: 0.875rem;
    display: inline-block;
}

    .prescribed-workview-app-filter label {
        font-weight: bold;
        margin: 0;
    }

    .prescribed-workview-app-filter .btn.btn-fa {
        padding: 0;
    }

.wv-header {
    position: fixed !important;
    height: initial;
    z-index: 5;
    width: 100%;
    left: 0;
}

.wv-body {
    padding: .5rem 1rem 1rem;
    overflow: auto;
}

.wv-loader {
    z-index: 200;
    position: fixed;
    width: 100%;
    bottom: 0;
    height: 10rem;
}

.wv-app-icon {
    display: table-cell;
    width: 3rem;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
}

.wv-item-date {
    font-size: .75rem;
    color: #627895;
}

.wv-body iframe {
    width: 100%;
    height: calc(100% - 8rem);
    border: 0;
    overflow: hidden;
    position: absolute;
    left: 0;
    right: 0;
    padding-top: 1rem;
}

.workview-content {
    width: 100%;
}

.wv-body iframe.load-off-screen {
    position: absolute;
    margin-left: -10000px;
}


/* WorkView card styles  */

.wv-card {
    margin-bottom: 0.5rem;
    width: 100%;
    display: flex;
}


    .wv-card.wv-card-stack {
        border: 1px solid #BAC6D6;
        margin: 0 0 1rem;
        position: relative;
    }

        .wv-card.wv-card-stack:before, .wv-card.wv-card-stack:after {
            background: #BAC6D6;
            height: 3px;
            position: absolute;
            content: '';
            display: block;
            bottom: -4px;
            border-radius: 0 0 .25rem .25rem
        }

        .wv-card.wv-card-stack:before {
            bottom: -6px;
            left: .5rem;
            right: .5rem;
        }

        .wv-card.wv-card-stack:after {
            bottom: -10px;
            left: 1rem;
            right: 1rem;
        }


/* WorkView card columns */

.wv-col {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 1.5rem;
    position: relative;
    text-align: center;
    flex-grow: 1;
}

    .wv-col h3 {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        text-align: center;
        padding: 0;
        margin: 0;
        font-size: .875rem;
        border: 0;
    }

    .wv-col > div {
        padding: .5rem 1rem;
        width: 100%;
    }

    .wv-col + .wv-col:before {
        display: block;
        content: '';
        position: absolute;
        top: 1rem;
        left: 0;
        bottom: 1rem;
        border-left: 1px dotted #BAC6D6;
    }

    .wv-col.wv-col-desc:before {
        display: none;
    }

    .wv-col.wv-section-col {
        padding: 0;
        flex-grow: 1;
        flex-basis: 42%;
        width: 42%;
    }

        .wv-col.wv-section-col > div {
            display: flex;
            height: 100%;
            width: 100%;
            padding: 0;
        }


        .wv-col.wv-section-col .wv-col > div {
            font-size: 1.25rem;
            word-break: break-word;
        }

.wv-col-details {
    width: 12rem;
}

wv-col-details-options {
    display: flex;
}

.wv-col-details-options .btn {
    margin-top: .25rem;
}

.wv-col-tags {
    width: 16rem;
}

.wv-col-desc {
    width: 32%;
    text-align: left;
    justify-content: left;
    display: flex;
    padding-bottom: .5rem;
}

.wv-col.wv-col-indicator {
    padding: 0;
    flex: 0 0 auto;
    display: flex;
}

    .wv-col.wv-col-indicator > div {
        padding: 0;
        height: 100%;
        display: flex;
        flex-wrap: nowrap;
    }

.wv-embedded-resource {
    width: 100%;
    height: 100%;
    vertical-align: baseline;
    display: block;
    border: 0;
    margin: 0;
    padding: 0;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}


.card-indicator,
a.card-indicator {
    width: 2rem;
    background: #627895;
    color: #fff;
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
}

    .card-indicator.bg-mild,
    a.card-indicator.bg-mild {
        background: #dee3e8;
        color: #627895;
    }

    .card-indicator:first-child {
        border-radius: .25rem 0 0 .25rem;
    }

    .card-indicator.noclick {
        cursor: default;
    }

/* filters styles */
.wv-filter-dialog .btn {
    margin-right: 0;
}

.wv-filter-dialog .filter-controls {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.wv-filter-dialog .tag-filter-controls {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: .5rem;
}

    .wv-filter-dialog .tag-filter-controls sng-filterbox,
    .wv-filter-dialog .tag-filter-controls input {
        max-width: none;
        width: 100%;
        margin-right: 0;
    }

.wv-filter-dialog .wv-filter-picker {
    margin-right: .5rem;
}

.wv-filter-dialog sng-filterbox div.form-control {
    width: 100%;
    margin-right: 0;
}

.wv-filter-dialog .form-control {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    margin-right: .75rem;
}

.wv-filter-dialog .select-wrapper > span {
    z-index: 1;
}

.wv-filter-dialog .btn-narrow {
    min-width: 3rem;
}

.wv-filter-dialog .filter-controls .fa {
    margin-right: 0;
}

.wv-filter-dialog h3 {
    text-transform: none;
    font-weight: normal;
}

.wv-filter-dialog label {
    display: inline-block;
}

.wv-sng-zugo--no-header {
    padding-top: 5.6rem;
}

.zugo-header.zugo-header--workview {
    min-height: 5.6rem;
    z-index: 2;
}

.wv-prescribed-toolbar {
    gap: .25rem;
}

    .wv-prescribed-toolbar .selected-rows-text {
        padding: 0 .25rem .25rem 1em;
        height: 2rem;
        text-align: left;
        line-height: 2rem;
    }

    .wv-prescribed-toolbar .nav-link span.fa {
        margin-right: .25rem;
        vertical-align: text-bottom;
        transform: translateX(-0.25rem);
    }

@media (min-width: 480px) {
}

@media (min-width: 768px) {
}

@media (min-width: 992px) {

    .wv-col-details-options {
        flex-direction: column;
    }

        .wv-col-details-options .btn,
        .wv-col-details-options div {
            width: 100%;
        }
}

@media (min-width: 1200px) {
    .wv-col-desc {
        width: 30%;
    }

    .wv-col.wv-col-details {
        padding-bottom: 0;
    }
}


/* Bootstrap large breakpoint */
@media only screen and (max-width: 1199.98px) {

    .wv-card:after {
        display: block;
        clear: both;
        content: '';
    }

    .wv-col {
        padding: 1.25rem 0 0;
    }

        .wv-col h3 {
            bottom: auto;
            top: 0;
            text-align: left;
            padding: .25rem 1rem
        }

        .wv-col + .wv-col:not(.wv-col-details):before {
            display: none;
        }

    .wv-card {
        line-height: 1.2rem;
    }

    .wv-card, .wv-col {
        display: flex;
        flex-wrap: wrap;
    }

    .wv-col-desc {
        width: 100%;
        padding-top: .25rem;
    }

    .wv-col.wv-section-col {
        width: 100%;
        flex-basis: 100%;
    }

    .wv-section-col .wv-col {
        display: table-cell;
    }

    .wv-col.wv-section-col .wv-col > div {
        text-align: left;
    }

    .wv-col-tags, .wv-col-details {
        width: 50%;
        float: left;
    }

    .wv-col.wv-col-indicator {
        flex: 1 1 auto;
    }

        .wv-col.wv-col-indicator > div {
            padding: 0;
            height: auto;
            display: flex;
            flex-wrap: nowrap;
            width: 100%;
        }

        .wv-col.wv-col-indicator .card-indicator {
            flex: 1 1 auto;
            padding: .25rem;
            border-radius: 0;
        }

            .wv-col.wv-col-indicator .card-indicator:first-child {
                border-top-left-radius: .25rem;
            }

            .wv-col.wv-col-indicator .card-indicator:last-child {
                border-top-right-radius: .25rem;
            }

    .wv-tag {
        font-size: 1rem;
        padding: .25rem .5rem;
    }


    .wv-section-col .wv-col:first-child:before,
    .wv-tags:before {
        display: none;
    }

    .wv-body iframe {
        height: 28rem !important;
        margin: 1rem 0;
        border: 2px solid #211551;
        position: relative;
        overflow: visible;
        border-radius: .25rem;
        overflow: hidden;
        top: 0 !important;
    }
}

/* Bootstrap MD breakpoint */
@media only screen and (max-width: 991.98px) {
    .wv-col.wv-col-indicator .card-indicator {
        padding: 1rem;
    }
}

/* Bootstrap SM breakpoint */
@media only screen and (max-width: 767.98px) {

    .wv-col:before {
        display: none !important;
    }

    .wv-col > div {
        padding: .125rem 1rem;
    }

    .wv-card .wv-col {
        padding: .5rem 0;
        border: 0;
        border-bottom: 1px solid #dee3e8;
    }

    .wv-col.wv-section-col, .wv-col.wv-col-indicator {
        border: 0;
        padding: 0;
    }

        .wv-col.wv-section-col .wv-col {
            display: block;
            width: 100% !important;
            text-align: left;
        }

        .wv-col.wv-section-col > div {
            flex-wrap: wrap;
        }

        .wv-col.wv-section-col .wv-col > div {
            font-size: 1rem;
        }


    .wv-col {
        padding: 0;
    }

        .wv-col:after {
            display: block;
            content: '';
            clear: both;
        }

        .wv-col h3 {
            width: 35%;
            float: left;
            position: static
        }

        .wv-col > div {
            float: right;
            width: 65%;
        }

    .wv-col-tags, .wv-col-details {
        float: none;
        width: 100%;
    }

    .wv-col-details {
        padding-bottom: .5rem;
    }

    .wv-col.wv-col-details .wv-col-details-options {
        width: 100%;
    }

    .wv-col-desc > div {
        width: 100%;
    }

    .wv-col-desc h1 {
        font-size: 1rem;
    }

    .wv-col-desc :not(h1) span {
        font-size: .875rem;
    }

    .wv-col.wv-col-indicator {
        padding: 0;
        flex: 1 0 auto;
        width: 100%;
        flex-basis: 100%;
        display: flex;
    }

        .wv-col.wv-col-indicator > div {
            display: flex;
            width: 100%;
            flex-basis: 100%;
            align-items: stretch;
            flex-wrap: nowrap;
        }

        .wv-col.wv-col-indicator .card-indicator {
            flex: 1 1 auto;
            text-align: center;
        }

    .wv-col + .wv-col:before {
        display: none;
    }
}

@media only screen and (min-width: 768px) and (max-width: 1199.98px) {
    .wv-card h1 {
        display: inline-block;
        margin-right: 1rem;
    }
}


.fa-bars {
    cursor: move;
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
    margin-right: 2%;
}
.draggable:active {
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing;
}
.draggable {
    cursor: move; /* fallback if grab cursor is unsupported */
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}

/*! angularjs-slider - v7.0.0 -  (c) Rafal Zajac <rzajac@gmail.com>, Valentin Hervieu <valentin@hervi.eu>, Jussi Saarivirta <jusasi@gmail.com>, Angelin Sirbu <angelin.sirbu@gmail.com> -  https://github.com/angular-slider/angularjs-slider -  2019-02-23 */
.rzslider{position:relative;display:inline-block;width:100%;height:4px;margin:35px 0 15px 0;vertical-align:middle;user-select:none}.rzslider.noanimate *{transition:none!important}.rzslider.with-legend{margin-bottom:40px}.rzslider[disabled]{cursor:not-allowed}.rzslider[disabled] .rz-pointer{cursor:not-allowed;background-color:#d8e0f3}.rzslider[disabled] .rz-draggable{cursor:not-allowed}.rzslider[disabled] .rz-selection{background:#8b91a2}.rzslider[disabled] .rz-tick{cursor:not-allowed}.rzslider[disabled] .rz-tick.rz-selected{background:#8b91a2}.rzslider span{position:absolute;display:inline-block;white-space:nowrap}.rzslider .rz-base{width:100%;height:100%;padding:0}.rzslider .rz-bar-wrapper{left:0;z-index:1;width:100%;height:32px;padding-top:16px;margin-top:-16px;box-sizing:border-box;transition:all linear .3s}.rzslider .rz-draggable{cursor:move}.rzslider .rz-bar{left:0;z-index:1;width:100%;height:4px;background:#d8e0f3;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.rzslider .rz-bar-wrapper.rz-transparent .rz-bar{background:transparent}.rzslider .rz-bar-wrapper.rz-left-out-selection .rz-bar{background:#df002d}.rzslider .rz-bar-wrapper.rz-right-out-selection .rz-bar{background:#03a688}.rzslider .rz-selection{z-index:2;background:#0db9f0;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;transition:background-color linear .3s}.rzslider .rz-restricted{z-index:3;background:#f00;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.rzslider .rz-pointer{top:-14px;z-index:3;width:32px;height:32px;cursor:pointer;background-color:#0db9f0;-webkit-border-radius:16px;-moz-border-radius:16px;border-radius:16px;transition:all linear .3s}.rzslider .rz-pointer:after{position:absolute;top:12px;left:12px;width:8px;height:8px;background:#fff;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;content:''}.rzslider .rz-pointer:hover:after{background-color:#fff}.rzslider .rz-pointer.rz-active{z-index:4}.rzslider .rz-pointer.rz-active:after{background-color:#451aff}.rzslider .rz-bubble{bottom:16px;padding:1px 3px;color:#55637d;cursor:default;transition:all linear .3s}.rzslider .rz-bubble.rz-limit{color:#55637d;transition:none}.rzslider .rz-ticks{position:absolute;top:-3px;left:0;z-index:1;width:100%;height:0;margin:0;list-style:none;box-sizing:border-box}.rzslider .rz-ticks-values-under .rz-tick-value{top:auto;bottom:-32px}.rzslider .rz-tick{position:absolute;top:0;left:0;width:10px;height:10px;margin-left:11px;text-align:center;cursor:pointer;background:#d8e0f3;border-radius:50%;transition:background-color linear .3s}.rzslider .rz-tick.rz-selected{background:#0db9f0}.rzslider .rz-tick-value{position:absolute;top:-30px;transform:translate(-50%,0)}.rzslider .rz-tick-legend{position:absolute;top:24px;max-width:50px;white-space:normal;transform:translate(-50%,0)}.rzslider.rz-vertical{position:relative;width:4px;height:100%;padding:0;margin:0 20px;vertical-align:baseline}.rzslider.rz-vertical .rz-base{width:100%;height:100%;padding:0}.rzslider.rz-vertical .rz-bar-wrapper{top:auto;left:0;width:32px;height:100%;padding:0 0 0 16px;margin:0 0 0 -16px}.rzslider.rz-vertical .rz-bar{bottom:0;left:auto;width:4px;height:100%}.rzslider.rz-vertical .rz-pointer{top:auto;bottom:0;left:-14px!important}.rzslider.rz-vertical .rz-bubble{bottom:0;left:16px!important;margin-left:3px}.rzslider.rz-vertical .rz-ticks{top:0;left:-3px;z-index:1;width:0;height:100%}.rzslider.rz-vertical .rz-tick{margin-top:11px;margin-left:auto;vertical-align:middle}.rzslider.rz-vertical .rz-tick-value{top:auto;left:24px;transform:translate(0,-28%)}.rzslider.rz-vertical .rz-tick-legend{top:auto;right:24px;max-width:none;white-space:nowrap;transform:translate(0,-28%)}.rzslider.rz-vertical .rz-ticks-values-under .rz-tick-value{right:24px;bottom:auto;left:auto}

/*
    General classes & global styles
    Notice we use variable parser to add cache busting for urls of deployed assets
*/
/* Webfont: LatoLatin-Italic */
@font-face {
    font-family: 'Lato';
    src: url('../Images/fonts/LatoLatin-Italic.eot?v=2509.1008.20.0'); /* IE9 Compat Modes */
    src: url('../Images/fonts/LatoLatin-Italic.woff?v=2509.1008.20.0') format('woff'), /* Modern Browsers */
    url('../Images/fonts/LatoLatin-Italic.ttf?v=2509.1008.20.0') format('truetype');
    font-style: italic;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* Webfont: LatoLatin-Light */ @font-face {
    font-family: 'Lato';
    src: url('Images/fonts/LatoLatin-Light.eot?v=2509.1008.20.0'); /* IE9 Compat Modes */
    src: url('../Images/fonts/LatoLatin-Light.woff?v=2509.1008.20.0') format('woff'), /* Modern Browsers */
    url('../Images/fonts/LatoLatin-Light.ttf?v=2509.1008.20.0') format('truetype');
    font-style: normal;
    font-weight: 300;
    text-rendering: optimizeLegibility;
}

/* Webfont: LatoLatin-LightItalic */ @font-face {
    font-family: 'Lato';
    src: url('../Images/fonts/LatoLatin-LightItalic.eot?v=2509.1008.20.0'); /* IE9 Compat Modes */
    src: url('../Images/fonts/LatoLatin-LightItalic.woff?v=2509.1008.20.0') format('woff'), /* Modern Browsers */
    url('../Images/fonts/LatoLatin-LightItalic.ttf?v=2509.1008.20.0') format('truetype');
    font-style: italic;
    font-weight: 300;
    text-rendering: optimizeLegibility;
}

/* Webfont: LatoLatin-Medium */ @font-face {
    font-family: 'Lato';
    src: url('../Images/fonts/LatoLatin-Semibold.eot?v=2509.1008.20.0'); /* IE9 Compat Modes */
    src: url('../Images/fonts/LatoLatin-Semibold.woff?v=2509.1008.20.0') format('woff'), /* Modern Browsers */
    url('../Images/fonts/LatoLatin-Semibold.ttf?v=2509.1008.20.0') format('truetype');
    font-style: normal;
    font-weight: bold;
    text-rendering: optimizeLegibility;
}

/* Webfont: LatoLatin-Regular */ @font-face {
    font-family: 'Lato';
    src: url('../Images/fonts/LatoLatin-Regular.eot?v=2509.1008.20.0'); /* IE9 Compat Modes */
    src: url('../Images/fonts/LatoLatin-Regular.woff?v=2509.1008.20.0') format('woff'), /* Modern Browsers */
    url('../Images/fonts/LatoLatin-Regular.ttf?v=2509.1008.20.0') format('truetype');
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}


/* Element styling */

html, body {
    height: 100%;
    overflow: auto;
}

html {
    font-size: 16px;
}

body {
    background: #e1e9f5;
    font-family: 'Lato', 'Helvetica', 'Arial', sans-serif;
    letter-spacing: -0.02em;
}

    body.factboard-select {
        letter-spacing: normal;
    }


h1 {
    border: 0.125rem dotted #BAC6D6;
    border-width: 0 0 0.125rem;
    color: #211551;
    font-size: 1.375rem;
    margin: 0 0 1rem;
    padding: .75rem 0;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

    h1:first-child {
        padding-top: 0.25rem;
    }

h2, .page-lead, .dropdown .dd-menu h2 {
    color: #0076D1;
    font-size: 1.25rem;
}

h2 {
    margin: .75rem 0;
}

h3 {
    color: #627895;
    font-size: 1.125rem;
    margin: 1rem 0;
    padding: .5rem 0;
    border-bottom: 1px dotted #BAC6D6;
    font-weight: 600;
}

h4 {
    font-size: 1rem;
    font-weight: 600;
    color: #0076D1;
    margin: .5rem 0;
    padding: .25rem 0;
}

h3, .dd-menu h3 {
    color: #627895;
}

    h2:first-child,
    h3:first-child,
    h4:first-child {
        margin-top: 0;
    }


.page-subtitle {
    font-size: 1rem;
    color: #627895;
}

button {
    -moz-appearance: none;
    -webkit-appearance: none;
    border: 0;
    background: 0;
    margin: 0;
    padding: 0;
}

a {
    color: #0076D1;
}

    a:focus, a:hover {
        color: #148AE5;
        text-decoration: underline;
    }

    a:active {
        color: #0062BD;
    }


    a:focus {
        outline: 0;
        box-shadow: 0 0 0 0.125rem rgba(0,118,209, 0.5);
    }

a, button {
    cursor: pointer;
}

    a:hover,
    a:focus {
        color: #0076D1;
        text-decoration: underline;
    }

    a.disabled {
        color: #BAC6D6;
    }

ul, ol {
    margin: 0;
    padding: 0;
}

p {
    margin: 0;
}

/* Main classes */

.hidden-old-design{
    display: none !important;
}

.page-content {
    padding: 2rem;
}

.header,
.header-flat,
.header-floating {
    background: #ebf1f7;
    margin-bottom: 1rem;
    padding: 1rem;
    width: 100%;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    position: relative;
    z-index: 2;
    min-height: 4rem;
}

    .header.header-fixed,
    .header .header-fixed {
        left: 0;
        position: absolute;
        top: 0;
        width: 100%;
        margin: 0;
    }

    .header h1 {
        font-size: 1.25rem;
        margin: 0;
        margin-right: .5rem;
    }

    .header h2 {
        font-size: 1.125rem;
        color: #627895;
    }

    .header:after {
        display: block;
        content: '';
        clear: both;
    }

    .header h1, .zugo-header h1 {
        padding: .5rem 0;
        border: 0;
    }

    .header h1, .header h2 {
        display: inline;
        width: auto;
        line-height: 2rem;
    }

/* flat header */

.header-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}


.header-flat {
    position: relative;
    -webkit-backface-visibility: hidden;
    margin: 0;
    margin-bottom: 1rem;
    width: 100%;
    background: #ebf1f7;
    border: 2px solid #dee3e8;
    border-radius: .25rem;
    width: 100%;
    z-index: 1;
}

.header-floating {
    margin-bottom: 0;
    box-shadow: 0 1px 3px #000;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.bg-secondary > h1,
.bg-secondary > h2,
.bg-secondary > h3 {
    color: #fff;
}

.box,
.section,
.stepwise-container,
.dyno-control,
.dd-menu {
    background: #fff;
    border-radius: 0.25rem;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.15);
}

    .dark,
    .box.dark {
        background: rgba(98,120,149, 0.15);
        box-shadow: none;
    }

    .box.box-light {
        background: #ebf1f7;
    }

.content {
    padding: 1rem;
}

.lightbox-content .dyno-control,
.lightbox-content .section {
    box-shadow: none;
    background: 0;
}

.section {
    margin-bottom: 1rem;
}

.col > .section {
    height: 100%;
}

.section-full {
    margin: 0;
    min-height: 100%;
}

.section-title {
    background: #211551;
    border-radius: 0.25rem 0.25rem 0 0;
    color: #fff;
    padding: 0.75rem 1rem;
}

.section-tools {
    background: #BAC6D6;
    padding: 0.5rem 1rem;
    overflow: hidden;
    *zoom: 1;
}

    .section-tools button,
    .section-tools div {
        display: inline-block;
    }

        .section-tools button:not(:last-child),
        .section-tools div:not(:last-child) {
            margin-right: 0.25rem;
        }

    .section-tools > .fa {
        color: #0076D1;
        width: 2rem;
        text-align: center;
        border-radius: 0.5rem;
        cursor: pointer;
        padding: 0.25rem 0;
    }

        .section-tools > .fa:hover {
            background: rgba(0,118,209, 0.1);
        }

        .section-tools > .fa:disabled {
            color: rgba(0, 0, 0, 0.2);
            background: 0 !important;
        }


.fade.in {
    opacity: 1;
}

.dropdown {
    position: relative;
}


/* =============================================*/
/* Menus, popouts and generic hovering elements */

/* Max widths of popovers - put all new popovers in this rule for consistency */

.dd-menu, .sngfilter-menu, .composer-accordion-popup {
    max-width: 36rem;
    min-width: 10rem;
}

.composer-accordion-popup-wide {
    max-width: 36rem;
    min-width: 36rem;
}

@media only screen and (max-width: 991px) {
    .dd-menu, .sngfilter-menu, .composer-accordion-popup {
        max-width: 32rem;
    }
}

@media only screen and (max-width: 767px) {
    .dd-menu, .sngfilter-menu, .composer-accordion-popup {
        max-width: 26rem;
    }

    .avoid-menu {
        max-width: 90vw;
    }
}

/* Bootstrap popovers */

.popover {
    border-color: #BAC6D6;
    background: #fff;
    padding: 0;
    border-radius: 0;
    min-width: 5rem;
}

    .popover.delete-popover {
        max-width: none;
    }

.popover-header,
.popover-body {
    padding: .5rem;
}

.popover-header {
    font-size: .875rem;
    background: 0;
    border: 1px dotted #dee3e8;
    border-width: 0 0 1px 0;
    height: 2.25rem;
    line-height: 1rem;
    margin: 0;
    padding-right: 2rem;
}

.popover-body {
    background: #fff;
    border-radius: 0 0 .25rem .25rem;
}

.cpf-popover-close {
    position: absolute;
    top: .5rem;
    right: 0;
}

.help-bubble {
    background: #fff;
    padding: 0;
    border-color: #BAC6D6;
    border-radius: 0;
    border: 1px solid rgba(0,0,0,.2);
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
    min-width: 5rem;
    max-width: 20rem;
    z-index: 1060;
    display: block;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5;
    text-align: left;
    text-align: start;
    text-decoration: none;
    text-shadow: none;
    text-transform: none;
    letter-spacing: normal;
    word-break: normal;
    word-spacing: normal;
    white-space: normal;
    line-break: auto;
    font-size: .875rem;
    word-wrap: break-word;
}


/* End max widths */

.dd-menu {
    border: 1px solid #0076D1;
    color: #5e5b77;
    position: absolute;
    left: 0;
    margin-top: 0.25rem;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    text-align: left;
    top: 100%;
    display: none;
    min-width: 100%;
}

    .dd-menu li {
        display: block;
        min-width: 14rem;
    }

.dropdown.open > .nav-link {
    background: rgba(0,118,209, 0.1);
}

.dropdown.open .dd-menu {
    max-height: 24rem;
    max-width: 100vw;
    overflow-y: auto;
    opacity: 1;
    z-index: 991;
    display: block;
}

.dropdown.sm-target .dd-menu {
    margin-left: -.5rem;
    margin-right: -.5rem;
}

.dd-menu.pop-top {
    top: auto;
    bottom: 100%;
    margin-top: 0;
    margin-bottom: .25rem;
}

.dd-menu.avoid-menu-fixed {
    right: auto !important;
    min-width: 0;
    width: auto;
    max-width: calc(20rem + 20vw);
}

.dropdown.closed .dd-menu {
    display: block;
    visibility: hidden;
    transition: opacity 0.2s ease;
}

.dropdown.open-left .dd-menu {
    left: auto;
    right: 0;
}

.dd-menu.dd-menu-xs {
    width: 10rem;
}

.dd-menu.dd-menu-sm {
    width: 14rem;
}

.dd-menu.dd-menu-md {
    width: 18rem;
    max-height: 26rem !important;
}

.dd-menu.dd-menu-lg {
    width: 24rem;
    max-height: 30rem !important;
}

.dd-menu.dd-menu-xl {
    width: 36rem;
    max-height: 32rem !important;
}

.dd-menu .dropdown-item {
    color: #0076D1;
    border-radius: 0;
}

.dd-arrow {
    position: absolute;
    top: calc(100% - 0.4375rem);
    left: calc(50% - .75rem);
    border: .75rem solid transparent;
    border-top: 0;
    border-bottom-color: #0076D1;
    display: none;
    z-index: 992;
}

    .dd-arrow:before {
        position: absolute;
        content: '';
        display: block;
        border: .6875rem solid transparent;
        border-top: 0;
        border-bottom-color: #fff;
        left: -.6875rem;
        top: 1px;
    }



.dd-menu.pop-top ~ .dd-arrow {
    bottom: calc(100% - .4375rem);
    top: auto;
    transform: rotate(180deg);
}

.dropdown.open .dd-arrow {
    display: block;
}

.avoid-menu.avoid-menu-fixed {
    position: fixed;
    z-index: 200;
}

.scroll-content {
    width: 100%;
}

.scroll-content, .sidebar {
    height: 100%;
    overflow-y: auto;
    position: relative;
}

.lead {
    font-size: 1.125rem;
    font-weight: normal;
}


.noscroll, .noscroll .scroll-content, .noscroll .sidebar {
    overflow: hidden;
}

    .noscroll .lightbox .sidebar {
        overflow-y: auto;
    }

.mobile-no-optim {
    min-width: 46rem;
}

button.fa,
button.translation-trigger {
    border: 0;
    background: 0;
}

/* support both fontsy and fontawesome font family, add more if we add more fonts */
.universal-icon {
    font-family: 'Fontsy', FontAwesome !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.fontsy {
    font-size: 0.875rem;
    font-family: 'icoMoon';
}

code {
    background: #e1e9f5;
    color: #0076D1;
}

.hiddenOnLoad {
    visibility: hidden;
}

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
    display: none !important;
}

.pointer {
    cursor: pointer !important;
}

.container-fluid {
    padding: 0 0.5rem;
}

.container-max {
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
}

.container-flex {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.search-toolbox ~ .titles {
    width: 60%;
    float: left;
}

.header ~ .page-content {
    height: calc(100% - 4rem);
    flex: 1 1 auto;
    overflow-y: auto;
}


.panel-has-sidebar > .table {
    border: 0;
}

    .panel-has-sidebar > .table th {
        border-top: 0;
    }

.table thead label {
    margin: 0;
    padding: 0;
    line-height: .875rem;
}

/* Layout */

#page {
    width: 100%;
    position: relative;
    height: 100%;
    overflow: visible;
}

    #page.contains-dynoview {
        height: auto;
    }

.page-content {
    padding: 1rem;
    height: 100%;
    width: 100%;
}

#react-app-root {
    height: 100%;
}

#react-overshorts-dashboard-portal,
#engage-portal-root {
    height: 100%;
}

.panel,
.scroll-panel,
div[ng-view] {
    width: 100%;
    height: 100%;
    position: relative;
    min-height: 0;
}

.scroll-panel,
.results-panel {
    overflow-y: auto;
    flex-grow: 1;
    flex: 1 1 auto;
}

.results-panel {
    padding: 0px;
}

.scroll-panel.has-buttons {
    height: calc(100% - 4.5rem);
}

.scroll-panel.has-open-buttons {
    height: calc(100% - 4.5rem);
}

label.file-name-prompt {
    text-align: left;
}

.cpf-box {
    background: #fff;
    border: 1px solid #dee3e8;
    border-radius: .125rem;
    padding: 1rem;
}

.flex-container {
    display: flex;
    flex-direction: column;
    height: 100%;
    flex: 1;
}

.flex-body, div[sng-i-frame] {
    display: flex;
    height: 100%;
    min-height: 0;
    flex: 1 1 auto;
}


    div [sng-i-frame] iframe {
        width: 100%;
        flex-basis: 100%;
        flex-grow: 1;
        height: 100%;
        min-height: 0;
    }


/* Layer styles */

.layer-wrapper {
    display: none;
    position: absolute;
}

.help-layer {
    background: #e1e9f5;
    border: 1px solid #0076D1;
    padding: 1rem;
    color: #0076D1;
}

/* Track Lite */

#track-lite {
    display: none;
    position: fixed;
    z-index: 10;
    background: #fff;
    border: 1px solid #BAC6D6;
    min-width: 18rem;
}

    #track-lite h2 {
        padding: 1rem;
        margin-bottom: 1rem;
    }

#track-lite-details {
    max-height: 400px;
    overflow-x: hidden;
}

#track-lite .table td:first-child,
#track-lite .table th:first-child {
    width: 3rem;
}

/* Black overlay */
.black-overlay,
.ng-lightbox-overlay {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(186,198,214,0.65);
}

.black-overlay {
    position: fixed;
    display: none;
    z-index: 99 !important;
}

.ng-lightbox-overlay {
    position: fixed;
}

    .ng-lightbox-overlay.ng-lightbox-overlay-hidden {
        background: none;
    }

/* Alert */
#alert, .alert,
#refresh-results-box {
    z-index: 1400;
}

#forgot-password-alert,
.refresh-results-box {
    z-index: 12;
}

#alert-buttons {
    display: inline;
}

#alert,
#forgot-password-alert,
#refresh-results-box,
.refresh-results-box {
    position: fixed;
    -webkit-backface-visibility: hidden;
    bottom: -10rem;
    left: 0;
    width: 100%;
    text-align: center;
    border: 0;
    background: transparent;
    margin: 0;
    padding: .75rem;
    opacity: 0;
    font-size: 1rem;
    transition: opacity 0.3s 0.2s ease, bottom 0.2s ease;
}

    #alert.alert-vis,
    #refresh-results-box.alert-vis,
    .refresh-results-box.alert-vis {
        bottom: 0;
        opacity: 1;
    }

.alert a {
    color: #fff;
    text-decoration: underline;
}

.alert-body {
    padding: .5rem;
    background: #0076D1;
    color: #fff;
    position: relative;
    border: 2px solid #fff;
    line-height: 1rem;
    box-shadow: 0 2px 4px 1px rgba(0, 0, 0, 0.15);
    border-radius: .375rem;
}

    .alert-body:after {
        clear: both;
        display: block;
        content: '';
    }

    .alert-body .message {
        display: block;
        float: left;
        margin-right: .5rem;
        padding: .375rem;
        padding: .5rem;
        line-height: 1.25rem;
    }


    .alert-body .fa {
        font-size: 1.25rem;
        padding: .375rem 0;
    }

    .alert-body .alert-buttons {
        float: right;
    }

    .alert-body .btn {
        border-color: #fff;
        color: #fff;
    }

        .alert-body .btn:hover {
            background: #fff;
            color: #0076D1;
        }

    .alert-body.bg-success {
        background: #55c339;
    }

    .alert-body.bg-warning {
        background: #fb9012;
    }

    .alert-body.bg-danger {
        background: #e73b4e;
    }

    .alert-body .message:before {
        display: inline-block;
        margin-right: 1rem;
        font-family: 'FontAwesome';
    }

    .alert-body .mesage:before {
        content: '\f05a';
    }

    .alert-body.bg-danger .message:before {
        content: '\f071';
    }

    .alert-body.bg-warning .message:before {
        content: '\f06a';
    }

    .alert-body.bg-success .message:before {
        content: '\f00c';
    }

    .alert-body.bg-info .message:before {
        content: '\f05a';
    }

    .alert-body.alert-progress .message:before {
        content: '\f1ce';
        -webkit-animation: fa-spin 1.5s infinite linear;
        animation: fa-spin 1.5s infinite linear;
    }

    .alert-body.helpful {
        background: #fff;
        color: #4b81bf;
        padding: 1rem;
        font-size: 1rem;
        margin: 1rem;
    }

        .alert-body.helpful .alert-buttons {
            float: right;
        }

            .alert-body.helpful .alert-buttons .btn {
                color: #4b81bf;
                border: 1px solid #4b81bf;
            }

                .alert-body.helpful .alert-buttons .btn:hover {
                    background: #4b81bf;
                    color: #fff;
                }

        .alert-body.helpful .message {
            font-size: 1rem;
            text-align: left;
            display: block;
            width: calc(100% - 8rem);
        }

            .alert-body.helpful .message:before {
                content: '\f05a';
                font-size: 2rem;
                position: relative;
                top: 0.25rem;
                float: left;
                display: block;
                margin: 0.25rem 1rem 0.25rem 0.25rem;
                clear: both;
                margin-bottom: 2rem;
            }



#show-errorlogs-button {
    display: none;
}

    #show-errorlogs-button .down {
        display: none;
    }

#alert:not(.alert-vis) #error-logs-wrapper {
    display: none !important;
}

#error-logs-wrapper {
    position: relative;
    margin-top: 1rem;
    padding: 1rem;
    display: none;
    z-index: 99;
    clear: both;
}

.closebutton-wrapper {
    cursor: pointer;
    float: right;
    margin-left: .375rem;
}

/* Other Errors */

.error-content {
    margin: 1rem;
    border: 1px solid #dee3e8;
    background: #fff;
    padding: 1rem;
}

    .error-content:after {
        content: '';
        display: block;
        clear: both;
    }

    .error-content .error-icon {
        font-size: 1.125rem;
        margin-right: .25rem;
    }

    .error-content .error-log-show {
        float: right;
    }

    .error-content .error-detail {
        font-size: .875rem;
    }

/* Hide Nav */

body.nav-hidden #prog-line-container {
    display: none;
}

body.nav-hidden #top-bar {
    display: none;
}

body.nav-hidden .navbar {
    height: 2.5rem;
}

body.nav-hidden #secondary-nav {
    top: 2.5rem;
}

/* Hide Chrome */

body.chrome-hidden .navbar {
    display: none;
}

/* Password policy */

#password-policy-message {
    font-size: .875rem;
    color: #627895;
    padding: 1rem 0 0;
    width: 50%;
}

/* User Apps list page */

tr.row-total {
    border-top: 2px solid;
}

    tr.row-total td {
        font-size: 1rem;
        font-weight: bold;
    }

/* ========== */


.caret {
    font-size: .75rem;
    color: inherit;
    margin: 0 .125rem;
}

    .caret:before {
        content: '\f0d7';
        font-family: 'FontAwesome'
    }

.nav-link .caret {
    margin-left: .5rem;
}

/* cpf dropdown */

.cpf-dropdown {
    display: inline-block;
    position: relative;
}

.cpf-dropdown-toggle:after,
.tasks-button::after {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: .75rem;
    margin-right: 0;
    vertical-align: middle;
    content: "";
    border-top: .3em solid #fff;
    border-right: .3em solid transparent;
    border-left: .3em solid transparent;
}

.cpf-dropdown-toggle:hover:after,
.tasks-button:hover:after,
.cpf-dropdown-toggle:active:after,
.tasks-button:active:after {
    border-top-color: #fff;
}

.cpf-dropdown.showing .cpf-dropdown-toggle:after,
.cpf-dropdown-toggle:hover:after,
.tasks-button.mobile-open:after {
    border-top-color: #fff;
}

.cpf-dropdown-toggle.disabled:after,
.tasks-button.disabled:after {
    border-top-color: #BAC6D6;
}

.cpf-dropdown-menu {
    padding: 0;
    position: absolute;
    top: 100%;
    margin-top: -1px;
    border: 1px solid #0076D1;
    border-radius: .25rem;
    background: #fff;
    display: none;
    left: 0;
    max-height: 30rem;
    min-width: 18rem;
    overflow-y: auto;
    z-index: 4;
    color: #5e5b77;
}

    .cpf-dropdown-menu.left {
        right: 0;
        left: auto;
    }

.cpf-dropdown.showing .cpf-dropdown-menu {
    display: block;
}

.cpf-dropdown.showing .cpf-dropdown-toggle,
.tasks-button.mobile-open {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    background: #0076D1;
    color: #fff;
}

    .cpf-dropdown-toggle.btn-link:after,
    .cpf-dropdown.showing .cpf-dropdown-toggle.btn-link:after {
        border-top-color: #0076D1
    }

.cpf-dropdown.showing .btn-link {
    background: rgba(0,118,209,0.15);
    color: #0076D1;
    text-decoration: none;
}

.dropdown-item .checkbox,
.dropdown-item .radio {
    margin-bottom: 0;
}


.dsn-chart {
    padding: 2rem;
    color: #BAC6D6;
    text-align: center;
}

    .dsn-chart .fa {
        font-size: 5rem;
    }

.chartwizard-title {
    padding-top: 1rem;
}

/* Filter box */

.dyno-control div[sng-filterbox],
.dyno-control sng-filterbox {
    display: inline-block;
    width: 13rem;
    max-width: 100%;
}

.dyno-control[data-width="stretch"] div[sng-filterbox],
.dyno-control[data-width="stretch"] sng-filterbox {
    width: 100%;
}

.sngfilter {
    position: relative;
}

    /**
    a text placeholder (should have the same colour as :placeholder)
    Replaces: qa-pleasechoose (?)
*/
    .sngfilter .placeholder {
        color: #768CA9;
    }

    .sngfilter .toggle {
        min-width: 14rem;
        width: 100%;
        padding: 0;
        border: 1px solid #BAC6D6;
        border-radius: 0.125rem;
        cursor: pointer;
        -moz-transition: all 0.2s ease;
        -o-transition: all 0.2s ease;
        -webkit-transition: all 0.2s ease;
        transition: all 0.2s ease;
        height: 2.25rem;
    }

.toggle .selected .title {
    max-width: calc(100% - 1.5rem);
    overflow-x: hidden;
    display: block;
    text-overflow: ellipsis;
    white-space: nowrap;
    float: left;
}

.toggle:hover,
.sngfilter.visible .toggle {
    border-color: #0076D1;
}

.sngfilter.visible .toggle {
    background: #fff;
}

.sngfilter.visible .toggle-label {
    color: #fff;
}

.sngfilter .toggle-label,
.sngfilter .selected,
.sngfilter .selected_category {
    padding: 0.5rem;
    color: #0076D1;
    font-size: 0.875rem;
}

.sngfilter .selected, .sngfilter .selected_category {
    border-color: #dee3e8;
    background: #ebf1f7;
    height: 2.125rem;
    border-left: 2px solid #0076D1;
}

    .sngfilter .selected .fa-remove, .sngfilter .selected_category .fa-remove {
        float: right;
        padding: .125rem;
    }

.invalid .sngfilter .toggle {
    background-color: #fbe5d6;
    border-color: #fb9012;
}

    .invalid .sngfilter .toggle .toggle-label {
        color: #fb9012;
    }

.sngfilter .toggle-label.loading {
    color: #627895;
}

.sngfilter .form-control {
    float: none;
}

.sngfilter.disabled .toggle-label {
    color: #BAC6D6;
}

.sngfilter.disabled-cursor .toggle-label {
    cursor: not-allowed;
}

.disabled-cursor {
    cursor: not-allowed;
    color: #BAC6D6;
}

.sngfilter-menu {
    width: 100%;
    min-width: 15rem;
    position: absolute;
    top: 100%;
    margin: -1px 0 0;
    left: 0;
    border: 1px solid #BAC6D6;
    box-shadow: 0 3px 6px rgba(0,0,0,0.25);
    border-radius: .25rem;
    padding: .5rem;
    background: #fff;
    visibility: hidden;
    z-index: 4;
}

    .sngfilter-menu.pop-top {
        top: auto;
        bottom: calc(100% - 1px);
    }

    .sngfilter-menu .sngfilter-results {
        width: 100%;
        max-height: 18rem;
        border: 1px solid #dee3e8;
        background: #ebf1f7;
        font-size: .875rem;
        overflow: hidden;
        overflow-y: auto;
        border-radius: .125rem;
    }

        .sngfilter-menu .sngfilter-results ul {
            position: relative;
            list-style: none;
            margin: 0;
            padding: 0;
        }

        .sngfilter-menu .sngfilter-results li {
            width: 100%;
            padding: .375rem .5rem;
            border-left: .25rem solid transparent;
        }

            .sngfilter-menu .sngfilter-results li:not(:last-child) {
                border-bottom: 1px solid #dee3e8;
            }


            .sngfilter-menu .sngfilter-results li.exists {
                border-left-color: #55c339;
                color: #627895;
                opacity: .5;
            }

            .sngfilter-menu .sngfilter-results li.sel {
                background: #fff;
                cursor: pointer;
                opacity: 1;
            }

                .sngfilter-menu .sngfilter-results li.sel:not(.exists) {
                    border-left-color: #0076D1;
                }

            .sngfilter-menu .sngfilter-results li.clickable-item:hover,
            .sngfilter-menu .sngfilter-results li.clickable-item.keyboard-highlight {
                background: #fff;
                border-left-color: #0076D1;
                cursor: pointer;
                opacity: 1;
            }

    .sngfilter-menu span.hlt {
        color: #0076D1;
        font-weight: bold;
        text-decoration: underline;
    }

    .sngfilter-menu.visible {
        visibility: visible;
    }

.sngfilter-input {
    padding-right: 2.5rem;
    position: relative;
    margin-bottom: .5rem;
}

    .sngfilter-input input {
        width: 100%;
        margin-bottom: .5rem;
        max-width: none;
        transition-duration: 0s;
    }

.visible .sngfilter-input input {
    transition-duration: 0.2s; /* fix for bug in chrome rendering */
}

.sngfilter-input .fa-chevron-up {
    position: absolute;
    top: .675rem;
    right: .5rem;
    cursor: pointer;
    color: #627895;
}

    .sngfilter-input .fa-chevron-up:hover {
        color: #0076D1;
    }

.sngfilter-existing {
    list-style: none;
    padding: 0;
    margin: .5rem 0 0;
    max-height: 24rem;
    max-width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
}

    .sngfilter-existing li {
        position: relative;
        max-width: 40rem;
        padding: .5rem;
        background: #ebf1f7;
        border: 1px solid #fff;
        font-size: .875rem;
        padding-right: 1.5rem;
        word-break: break-word;
    }

    .sngfilter-existing .none-selected {
        background: 0;
    }

    .sngfilter-existing li:not(:first-child) {
        border-top: 0;
    }

    .sngfilter-existing .fa-remove {
        color: #627895;
        cursor: pointer;
        padding: .25rem;
        position: absolute;
        right: .25rem;
        top: .35rem;
    }

        .sngfilter-existing .fa-remove:hover {
            color: #0076D1;
        }


    .sngfilter-existing .stack {
        border: 1px solid #fff;
        font-size: .875rem;
        height: auto;
    }

        .sngfilter-existing .stack .fa-remove {
            position: static;
            padding: 0;
            top: 0;
        }

    .sngfilter-existing .stack-item:hover {
        background: #ebf1f7;
        cursor: default;
    }

    .sngfilter-existing .stack-item:first-child {
        border-top: 0;
    }

    .sngfilter-existing .stack-item:last-child {
        border-bottom: 0;
    }

.sngfilter-full .sngfilter-existing {
    overflow: visible;
}

.stack-item.to-remove .autocomplete-remove {
    color: #BAC6D6;
}

    .stack-item.to-remove .autocomplete-remove:before {
        content: '\f01e';
    }

.sngfilter.disabled .toggle {
    border-color: #dee3e8;
    cursor: default;
}

.sngfilter.disabled .toggle-label, .sngfilter.disabled .selected {
    color: #BAC6D6;
}

.sngfilter-icon {
    margin-right: .5rem;
    margin-left: .25rem;
}

.sngfilter-has-zugo .sngfilter-existing li {
    border-left: 3px solid #55c339;
    padding-left: .3875rem;
}

/* Expression Buider */

.expression-wrapper,
.composer-accordion-wrapper.expression-wrapper {
    position: fixed;
}

.expression-piece {
    padding: .125rem .5rem;
    border: 1px solid #dee3e8;
    display: block;
    float: left;
    min-height: 2.375rem;
    line-height: 2rem;
    position: relative;
}

    .expression-piece .expression-piece {
        float: none;
        display: inline-block;
    }

    .expression-piece .expression-piece, .expression-piece + .expression-piece {
        margin-left: .5rem;
    }

    .expression-piece:hover {
        position: relative;
        z-index: 1;
    }

.expression-options {
    position: absolute;
    top: -1px;
    left: 100%;
    height: calc(100% + 2px);
    background: #0076D1;
    color: #fff;
    line-height: 1.5rem;
    padding: 0 .25rem;
    border-radius: 0 .25rem .25rem 0;
    display: none;
}


.expression-piece.selected {
    border-color: #0076D1;
    width: 20rem;
    margin-right: 1rem;
}

    .expression-piece.selected .expression-options {
        display: block;
    }

.add-expression {
    min-width: 0;
}



ul.filterbox-print-values {
    margin-bottom: 0;
    padding-left: 1.25rem;
    font-size: .875rem;
}
/* Job System */

#json-plan-validator {
    visibility: hidden;
    width: 0;
    float: right;
    padding: 0;
}

    #json-plan-validator.invalid + div {
        border: 1px solid #e73b4e;
    }
/* IE version warning alerts */

#ie-alert {
    position: fixed;
    top: 6rem;
    left: .5rem;
    right: .5rem;
    padding: .5rem 1rem;
    background: #e73b4e;
    z-index: 500;
    color: #5e5b77;
}

.error-log-show {
    float: right;
}

/* WorkView Dashboard sizes*/

.wv-dboard-panel {
    min-height: 7rem;
}

    .wv-dboard-panel:after {
        display: block;
        clear: both;
        content: '';
    }

.wv-dboard-label {
    color: #627895;
    font-size: .875rem;
}

.wv-dboard-title {
    font-size: 2rem;
    line-height: 2.5rem;
}

.wv-dboard-diff {
    font-size: 1.25rem;
}


/* IE 10+ textbox styling overrides */

::-ms-clear {
    display: none;
    width: 0;
    height: 0;
}

::-ms-reveal {
    width: 0;
    height: 0;
}

/* end */


.progress[value]::-webkit-progress-bar {
    background: #dee3e8;
}

.progress[value]::-moz-progress-bar {
    background: #dee3e8;
}

.progress {
    height: .5rem;
    border: 0;
    background: #dee3e8;
    border-radius: .25rem;
}

.sng-progress-indicator.ng-hide-add,
.sng-progress-indicator progress.ng-hide-add {
    transition: 0.5s linear opacity;
    opacity: 1;
}

.sng-progress-indicator.ng-hide-add-active,
.sng-progress-indicator progress.ng-hide-add-active {
    opacity: 0;
}

.progress-indicator progress {
    width: 100%;
}

.progress-indicator div {
    text-align: center;
    font-size: .875rem;
    color: #627895;
}


.progress[value] {
    color: #0076D1;
}

    .progress[value]::-webkit-progress-value {
        background: #0076D1;
        transition: width .15s ease;
    }

    .progress[value]::-moz-progress-value {
        background: #0076D1;
        transition: width .15s ease;
    }

    .progress[value]::-ms-fill {
        background: #0076D1;
        transition: width .15s ease;
    }

.progress-indicator .progress[value]::-webkit-progress-value {
    transition: width 1s ease;
}

.progress-indicator .progress[value]::-moz-progress-value {
    transition: width 1s ease;
}

.progress-indicator .progress[value]::-ms-fill {
    transition: width 1s ease;
}

.load-error .progress[value] {
    color: #e73b4e;
}

    .load-error .progress[value]::-webkit-progress-value {
        background: #e73b4e;
    }

    .load-error .progress[value]::-moz-progress-value {
        background: #e73b4e;
    }

    .load-error .progress[value]::-ms-fill {
        background: #e73b4e;
    }

.checked-list-item {
    border: 1px solid #BAC6D6;
    display: inline-block;
    margin-right: 0.375rem;
    padding: 0.375rem 0.5rem;
    font-size: 0.875rem;
    border-radius: 0.125rem;
    line-height: 1.125rem;
    height: 2.25rem;
}

    .checked-list-item:hover {
        cursor: default;
    }

    .checked-list-item .list-remove {
        top: .875rem;
        right: 1rem;
        font-size: 1rem;
        cursor: pointer;
        z-index: 101;
        padding-left: 0.5rem;
    }

        .checked-list-item .list-remove:hover {
            color: #0076D1;
        }

/* Vault */

.cache-row {
    color: #627895;
}

.cache-name {
    color: #5e5b77;
}

/* Narrative Builder styles */

.narrative-buttons {
    color: #627895;
}

.narrative-row {
    border-bottom: 1px solid #dee3e8;
    border-top: 1px solid #dee3e8;
}

    .narrative-row + .narrative-row {
        border-top: 0;
    }

/****** Expression Picker ******/

.expression-picker-invalid .sng-expression-picker {
    width: calc(100% - 2rem);
    float: left;
}

.expression-invalid-warning {
    line-height: 2.75rem;
    padding: 0 .5rem;
    float: left;
    color: #fb9012;
    display: none;
}


.expression-picker-invalid .expression-invalid-warning {
    display: block;
}

.sng-expression-picker {
    width: 100%;
    max-width: none;
    display: flex;
}

    .sng-expression-picker .select-wrapper,
    .sng-expression-picker .single-option {
        width: 25% !important;
        display: inline-block;
        flex-basis: 0.25;
    }

    .sng-expression-picker > div:last-child {
        flex-grow: 1;
        padding-left: 1rem;
    }

    .sng-expression-picker .single-option {
        background: #fff;
        border: 1px solid #BAC6D6;
        border-radius: .125rem;
        color: #272633;
        font-size: .875rem;
        padding: .425rem;
        height: 2.25rem;
    }

    .sng-expression-picker .single-option {
        color: #627895;
    }

        .sng-expression-picker .select-wrapper.medium,
        .sng-expression-picker .select-wrapper.medium select,
        .sng-expression-picker textarea.medium,
        .sng-expression-picker .single-option.medium {
            height: 6rem;
        }

        .sng-expression-picker .single-option.medium {
            padding: 2.25rem 0.725rem;
        }

    .sng-expression-picker .select-wrapper:last-child,
    .sng-expression-picker .select-wrapper:last-child select {
        -webkit-border-top-left-radius: 0;
        -webkit-border-bottom-left-radius: 0;
        -moz-border-radius-topleft: 0;
        -moz-border-radius-bottomleft: 0;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

    .sng-expression-picker.with-options input,
    .sng-expression-picker.with-options textarea.medium,
    .sng-expression-picker .select-wrapper:last-child {
    }

    .sng-expression-picker .select-wrapper:last-child {
        width: 100% !important;
        border-left: 1px solid #dee3e8;
    }

    .sng-expression-picker input.compact {
        width: 100%;
    }

    /*.sng-expression-picker.with-options textarea,*/

    .sng-expression-picker button {
        padding: .375rem 0.84rem;
        min-width: initial;
    }

    .sng-expression-picker.expression-picker-expanded {
        margin-top: 18px;
    }

.expression-builder-term {
    padding: 0.25rem .5rem;
    display: inline-block;
    border: 1px solid #dee3e8;
    margin: 0;
}

    .expression-builder-term + .expression-builder-term {
        border-left: 0;
    }

.expression-builder-wrapper {
    border: 1px solid #BAC6D6;
    border-radius: .25rem;
    min-height: 2.25rem;
    padding: .25rem;
    font-size: 1rem;
    overflow: auto;
}

.warning {
    color: #fb9012;
}

/* Alert classes */

.alert-warning,
.alert-danger,
.alert-success {
    color: inherit;
    background: 0;
    padding: .5rem .5rem .5rem 3.5rem;
    position: relative;
}

.alert-warning {
    border: 1px solid #fb9012;
}

.alert-success {
    border: 1px solid #55c339;
}

.alert-danger {
    border: 1px solid #e73b4e;
}

    .alert-warning:before,
    .alert-danger:before,
    .alert-success:before {
        font-family: 'FontAwesome';
        position: absolute;
        left: 1rem;
        top: .5rem;
        font-size: 1.5rem;
    }

.alert-warning:before {
    content: '\f06a';
    color: #fb9012;
}

.alert-success:before {
    content: '\f00c';
    color: #55c339;
}

.alert-danger:before {
    content: '\f071';
    color: #e73b4e;
}

.no-trim {
    white-space: pre;
}

@media print {
    .no-print, .no-print * {
        display: none !important;
    }
}

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

.image-popper-wrapper {
    position: fixed;
    z-index: 1004;
    background: #e1e9f5;
    border: 1px solid #dee3e8;
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
}

    .image-popper-wrapper:hover {
        cursor: move;
    }

    .image-popper-wrapper.popper-popin {
        animation: 200ms zoomIn ease;
    }

    .image-popper-wrapper.popper-popout {
        animation: 200ms zoomOut ease;
    }

.image-popper-close {
    float: right;
    padding: 0.25rem;
}

    .image-popper-close:hover {
        cursor: pointer;
    }

.image-popper-content {
    border-top: 1px solid #dee3e8;
}

@keyframes zoomIn {
    from {
        opacity: 0;
        transform: scale3d(.3, .3, .3);
    }

    50% {
        opacity: 1;
    }
}

@keyframes zoomOut {
    from {
        opacity: 1;
    }

    50% {
        opacity: 0;
        transform: scale3d(.3, .3, .3);
    }

    to {
        opacity: 0;
    }
}

/* Extended Properties */

.category-title {
    white-space: nowrap;
    margin-bottom: .5rem;
    padding-bottom: 0;
}

.category-rows {
}

.category-content {
    padding: 0 0 .75rem;
}

    .category-content + .category-content {
        border-top: 1px dotted #dee3e8;
        padding-top: .75rem;
    }

.margin-sides-10pct {
    margin-left: 10%;
    margin-right: 10%;
}

.margin-sides-5pct {
    margin-left: 5%;
    margin-right: 5%;
}

/* Tags
*/
.tag {
    background: #627895;
    display: inline-block;
    padding: 0.125rem 0.25rem;
    text-transform: uppercase;
    font-weight: bold;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    line-height: 0.875rem;
    color: #fff;
}

    .tag + .tag {
        margin-left: .25rem;
    }

    .tag.clickable {
        cursor: pointer;
    }

    .tag.clickable,
    .tag.tag-accent {
        background: #0076D1;
    }

    .tag.tag-muted {
        background: #627895;
    }

    .tag.tag-secondary {
        background: #211551;
        color: #FFFFFF;
    }

    .tag.tag-warning {
        background: #fb9012;
    }

    .tag.tag-success {
        background: #55c339;
    }

    .tag.tag-danger {
        background: #e73b4e;
    }

    .tag.tag-alt {
        text-transform: none;
        background: rgba(2,0,10,0.05);
        color: #627895;
    }


/* Section and box code */

.dyno-control.nav-item {
    background: none;
}

.section:not(:last-child) {
    margin-bottom: 1rem;
}

.clickable {
    cursor: pointer;
    position: relative;
}

.box.clickable {
    color: #0076D1;
}

    .box.clickable:after,
    .info-tile .clickable:after {
        -ms-transition: opacity 0.2s ease;
        -moz-transition: opacity 0.2s ease;
        -webkit-transition: opacity 0.2s ease;
        transition: opacity 0.2s ease;
        display: block;
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: rgba(0,118,209, 0.15);
        opacity: 0;
        z-index: 0;
        border-radius .25rem;
        pointer-events: none;
    }

    .box.clickable:hover,
    .box.clickable:focus,
    .box.clickable:active {
        text-decoration: none;
    }

        .box.clickable:hover:after,
        .info-tile .clickable:hover:after {
            opacity: 1;
        }

    .box.clickable:active,
    .info-tile .clickable:active {
        box-shadow: 0 0 0 2px rgba(0,118,209, 0.5);
    }

    .box.clickable:focus,
    .info-tile .clickable:focus {
        outline: 0;
        box-shadow: 0 0 0 2px rgba(0,118,209, .5);
        z-index: 1;
    }

    .box.clickable.selected {
        box-shadow: 0 0 0 2px #0076D1;
        cursor: default;
    }

.section .section {
    box-shadow: none;
}

.stepwise-container {
    padding: 1rem;
}
/* Section */
.section-title {
    border-radius: .25rem .25rem 0 0;
    padding: .75rem;
    font-size: 1rem;
    background: #211551;
    color: #FFFFFF;
}

.toggle-section-title {
    text-transform: initial;
    font-weight: bold;
}

.toggle-section-title-answer {
    color: #fff;
}

.toggle-section.disabled .toggle-section-title {
    color: #BAC6D6;
}

.toggle-section-title .title-text {
    max-width: calc(100% - 10rem);
    display: inline-block;
}


.section-order-number {
    position: relative;
    float: left;
    padding-right: .5rem;
    margin-right: .75rem;
    color: #fff;
    font-size: 1rem;
    font-weight: bold;
    text-align: center;
    width: 2rem;
}

.title-wrapper .toggle {
    position: relative;
}

    .section-order-number:after,
    .title-wrapper .toggle:after {
        display: block;
        content: '';
        height: calc(100% - .5rem);
        position: absolute;
        right: 0;
        top: .25rem;
        border-right: 1px dotted #627895;
        opacity: .5;
    }

.title-wrapper .toggle {
    float: left;
    margin: 0 1rem 0 0;
    position: relative;
    padding-right: 1rem;
}

.section-help {
    padding: .5rem;
    font-size: .875rem;
    text-transform: none;
    font-weight: normal;
    box-shadow: none;
    border: 1px solid #dee3e8;
    padding: .5rem;
    border-radius: .5rem;
}

.section-content {
    padding: .75rem;
}

.section-controls.bottom,
.lightbox-buttons {
    position: relative;
}

    .section-controls.bottom:before,
    .lightbox-buttons:before {
        position: relative;
        width: calc(100% - 1rem);
        content: '';
        display: block;
        position: absolute;
        top: 0;
        left: .5rem;
        border-top: 1px dotted #dee3e8;
    }

.fact-board-background {
    background: #fff !important;
}

/* Wizard */

.wizard {
    padding: 1rem;
    margin-bottom: 1rem;
}

.wizard-header {
    display: flex;
    width: 100%;
}

    .wizard-header > div:nth-child(2) {
        white-space: nowrap;
        text-align: center;
        flex-grow: 1;
        padding: .25rem 0;
    }

        .wizard-header > div:nth-child(2) > div {
            display: inline-block;
        }

.wizard .progress {
    width: 100%;
    height: .25rem;
    margin: .5rem 0 1rem;
}


.wizard-progress {
    border-radius: .25rem .25rem 0 0;
    width: 100%;
    height: .25rem;
}

    .wizard-progress + .box {
        border-radius: 0 0 .25rem .25rem;
    }

.wizard-steps {
    margin-bottom: 1.5rem;
    display: table;
    width: 100%;
    height: 1rem;
}

    .wizard-steps > div {
        position: relative;
        cursor: pointer;
    }

        .wizard-steps > div:before,
        .wizard-steps > div:after {
            display: block;
            content: '';
        }

        .wizard-steps > div:before {
            width: 100%;
            height: .25rem;
            background: #dee3e8;
            margin-top: .375rem;
        }

        .wizard-steps > div:after {
            position: absolute;
            top: .125rem;
            left: 50%;
            width: .75rem;
            height: .75rem;
            background: #fff;
            border: 1px solid #0076D1;
            border-radius: .375rem;
            z-index: 1;
        }

        .wizard-steps > div.completed:after {
            background: #0076D1;
        }

        .wizard-steps > div.errors:after {
            background: #fff;
            color: #fb9012;
            font-family: 'FontAwesome';
            content: '\f06a';
            line-height: .625rem;
            text-indent: -1px;
            font-size: .875rem;
        }

    .wizard-steps > .uncomplete ~ .uncomplete {
        cursor: default;
    }

    .wizard-steps .uncomplete ~ div:after {
        background: #e1e9f5;
        border: 1px solid #BAC6D6;
    }

    .wizard-steps > div.selected:after {
        box-shadow: 0 0 0 2px rgba(0,118,209,0.5);
        border-color: #fff;
    }

    .wizard-steps > div.completed.selected:after {
        background: #0076D1;
    }

.wizard-steps {
    display: flex;
    width: 100%;
}

    .wizard-steps > div {
        flex-grow: 1;
    }

        .wizard-steps > div:first-child,
        .wizard-steps > div:last-child {
            flex-grow: 0.5;
        }

            .wizard-steps > div:first-child:after {
                left: 0;
                margin: 0;
            }

            .wizard-steps > div:last-child:after {
                left: auto;
                right: 0;
                margin: 0;
            }

        .wizard-steps > div:only-child {
            flex-grow: 1;
        }

            .wizard-steps > div:only-child:after {
                left: calc(50% - 0.5rem);
                right: auto;
            }




/* Collapsible panels */

.dashboards-list {
    display: flex;
    flex-wrap: wrap;
    padding: .5rem;
}

.dashboards-category {
    padding: .5rem;
}

.dashboards-panel {
    background: #dee3e8;
    width: 100%;
    padding: 1rem;
    border-radius: 0 0 .25rem .25rem;
}

.dashboards-title {
    color: #5e5b77;
    padding: .5rem;
    margin-bottom: 0;
    border-bottom: 2px dotted #627895;
    font-weight: bold;
    border-radius: .25rem .25rem 0 0;
}


/* Dashboard homepage buttons */

.dashboard-button {
    padding: 2rem;
    display: inline-block;
    text-align: center;
    width: 14rem;
    border-radius: 1.75rem
}

    .dashboard-button .title {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        color: #627895;
    }

/* Context overlay */

.context-item,
body.factboard-select .factboard-addable {
    position: relative;
    box-shadow: 0 0 0 2px #0076D1;
    border-radius: .25rem;
    border-bottom-right-radius: 0;
}

    .context-item.context-item-success,
    body.factboard-select .factboard-item-selected,
    body.factboard-select .factboard-item-added {
        box-shadow: 0 0 0 2px #55c339;
    }

    .context-item.context-item-warning {
        box-shadow: 0 0 0 2px #fb9012;
    }

    .context-item.context-item-danger {
        box-shadow: 0 0 0 2px #e73b4e;
    }

    .context-item.context-item-secondary {
        box-shadow: 0 0 0 2px #211551;
    }

    .context-item.context-item-muted {
        box-shadow: 0 0 0 2px #627895;
    }

.context-item-btn {
    position: absolute;
    right: -2px;
    top: 100%;
    margin-top: 1px;
    background: #0076D1;
    width: 1.25rem;
    height: 1.25rem;
    z-index: 1;
    border-radius: 0 0 .25rem .25rem;
    color: #fff !important;
}

    .context-item-btn .fa,
    .factboard-addable .context-item-btn .fa {
        padding: 0;
        margin: 0;
        color: #fff !important;
    }


.factboard-item-selected > .context-item-btn,
.context-item-success .context-item-btn {
    background: #55c339;
}

.context-item-warning .context-item-btn {
    background: #fb9012;
}

.context-item-danger .context-item-btn {
    background: #e73b4e;
}

.context-item-secondary .context-item-btn {
    background: #211551;
    color: #FFFFFF;
}

.context-item-muted .context-item-btn {
    background: #627895;
}

/* Fact board specific */

/* Fix for issue with html2canvas which prints both characters of a ligature over each other */
.factboard-rendering {
    font-feature-settings: "liga" 0;
    -ms-font-feature-settings: "liga" 0;
    letter-spacing: 0;
}

html.factboard-rendering {
    overflow: visible;
    min-height: 100vh;
    height: auto;
}

    html.factboard-rendering body {
        height: 100%;
        min-height: 100vh;
        position: relative;
        overflow: visible;
    }

body:not(.factboard-select) .factboard-addable .context-item-btn {
    display: none;
}

/**
    when capturing page do not crop the height
*/
.factboard-rendering body,
body.factboard-creator-active {
    height: 100%;
    min-height: 100vh;
    position: relative;
    overflow: visible;
}

    /**
    when captureing page make sure that visible alerts are not captured
*/
    .factboard-rendering body .alert-vis,
    .factboard-rendering body #alert,
    body.factboard-creator-active .alert-vis,
    body.factboard-creator-active #alert {
        display: none !important;
    }
/**
    when capturing page do not crop the height
*/
.factboard-creator-active .scroll-content {
    min-height: 100%;
    overflow: visible;
}

/*
   These below two rules are set by the object that actually
   captures the item from the page within factboard service
   a.k.a. content creator
   If we are capturing nested -addable- items, allow creator
   to not capture internal addable-artefacts
*/
.factboard-creator-active .factboard-addable {
    box-shadow: none !important;
}

/**
    hides scrollable headers during factboard screenshot creation
*/
.factboard-creator-active .zugo-container table.fixed-table-header {
    display: none !important;
}
/**
    Hides load more item in zugo grid during factboard screenshot creation
*/
.factboard-creator-active .zugo-container .load-indicator-mini {
    display: none !important;
}

.factboard-creator-active .factboard-addable .context-item-btn {
    display: none !important;
}

.factboard-addable > .context-item-btn span:before {
    content: '\f067';
}

.factboard-item-selected > .context-item-btn span:before {
    content: '\f068';
}

/* Fti watch */

.watch-item {
    box-shadow: 0 0 0 .125rem rgba(251,144,18, 0.5);
    margin: 0 .125rem .375rem;
    border-radius: .25rem;
    padding: 0 1.5rem 0 .125rem;
    position: relative;
}

    .watch-item:last-child {
        margin-bottom: 0;
    }

span.watch-item {
    display: inline-block;
}

.watch-btn {
    display: block;
    position: absolute;
    top: .125rem;
    right: .125rem;
    padding: 0 .125rem;
    border-radius: .25rem;
    color: #fb9012;
    z-index: 0;
    line-height: 1rem;
}

    .watch-btn:hover {
        background: rgba(251,144,18, 0.2);
    }

/* Reports app */

.report-age {
    padding: .375rem 1rem 0;
    font-size: .875rem;
}

.static-header {
    background: #dee3e8;
    border: 2px solid #ebf1f7;
    padding: .5rem;
    border-radius: .25rem;
}

    .static-header h1, .static-header h2 {
        margin: 0;
    }



.confirm-menu {
    white-space: pre;
    padding: .5rem;
    font-size: 1rem;
}

    .confirm-menu .btn {
        margin-left: 1rem;
    }


/*  Sticky navigation bar */

.sticky-bar {
    position: relative;
}

    .sticky-bar.sticky-bar-fixed {
        position: fixed;
        z-index: 3;
    }

.pdf-export-button {
    min-width: 150px;
}

/* Video */
.embed-responsive-item.video-js:not(-webkit-full-screen) {
    z-index: 1;
}

/* impersonating-notification */
#impersonating-notification {
    text-align: center;
    display: inline-block;
    background-color: #e6e6e6;
}

    #impersonating-notification .form-control {
        background-color: #f3f2f2;
    }


#imp-switch {
    color: #5e5b77;
    background-color: white;
    display: inline-block;
    width: 320px;
    height: 26px;
    overflow-y: hidden;
}

#cancel-imp {
    background-color: #bfbfbf;
    padding: 0 20px;
}

    #cancel-imp span {
        margin: 0;
    }

.completed-container {
    display: -ms-flexbox;
    display: flex;
    height: 0.5rem;
    overflow: hidden;
    font-size: .75rem;
    background-color: #e9ecef;
    border-radius: 0.25rem;
    max-width: 18rem;
    margin: 0.5rem;
}

.completed-progress-bar {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    background-color: rgb(44, 160, 0);
    transition: width .6s ease;
}

/* Error viewer */
#error-viewer {
    margin: 20px;
}

    #error-viewer .row {
        margin-bottom: 15pt;
    }

#ie-not-supported-login {
    display:none;
    background-color: #ededbc;
    border: 1px solid #d9d348;
    padding: 10px;
    -webkit-box-shadow: 7px 7px 14px 3px rgba(199,199,199,0.93);
    box-shadow: 7px 7px 14px 3px rgba(199,199,199,0.93);
}
#ie-not-supported-login p
{
    padding: 10px;
}
#ie-not-supported {
    display: none;
    background-color: #ededbc;
    border: 1px solid #d9d348;
    padding: 10px;
    width: 90%;
    position: fixed;
    bottom: 10px;
    font-size: 0.8rem;
    -webkit-box-shadow: 7px 7px 14px 3px rgba(199,199,199,0.93);
    box-shadow: 7px 7px 14px 3px rgba(199,199,199,0.93);
}
#ie-dismiss {
    float: right;
}
#ie-not-supported p {
    padding: 5px;
}

/* Cpf Tour */
.tour-overlay {
    z-index: 990;
}

.tour-preview-container {
    z-index: 99999;
    padding: 1rem;
    margin: -1rem;
    background: white;
    border-radius: 2rem;
    outline: 4px solid rgba(255, 255, 255, 0.2);
}

.tour-desc-box {
    position: fixed;
    z-index: 999999;
    top: 2rem;
    width: 24rem;
    padding: 1rem;
}

.tour-desc-buttons {
    padding-top: 1rem;
    display: flex;
    align-items: center;
}

    .tour-desc-buttons > * {
        flex: 1;
        text-align: center;
    }


.radio-focused {
    border-bottom-color: #0076D1 !important;
    border-bottom-width: 2px !important;
}

.form-group {
    position: relative;
    margin-bottom: 1rem;
}

    .form-group.error-message-container.invalid {
        margin-bottom: .5rem;
    }

        .form-group:last-child, .form-group.error-message-container.invalid:last-child {
            margin-bottom: 0;
        }

button, input, optgroup, select, textarea {
    font-family: 'Lato', 'Helvetica', 'Arial', sans-serif;
}

.form-label, .form-group > label,
.prop-panel-control > label {
    font-size: 0.875rem;
    color: #627895;
    margin: 0;
    display: block;
}

.dyno-control .form-label, .dyno-control .form-group > label {
    display: inline-block;
}

.focuslabel {
    color: #0076D1 !important;
}

.optional {
    font-size: .75rem;
    font-weight: bold;
    text-transform: uppercase;
    color: #BAC6D6;
    margin: 0 .5rem;
}

    .optional:first-child {
        margin-left: 0;
    }

    .optional:last-child {
        margin-right: 0;
    }

.form-control,
.form-control-icon,
.fs-toggle,
.select-wrapper select,
.select-wrapper select + span {
    -webkit-transition: background 0.2s ease, border 0.2s ease, color 0.2s ease;
    -ms-transition: background 0.2s ease, border 0.2s ease, color 0.2s ease;
    transition: background 0.2s ease, border 0.2s ease, color 0.2s ease;
}

.form-control,
.form-control-blocked,
.fs-toggle,
.select-wrapper select {
    border: 2px solid #BAC6D6;
    border-width: 0 0 .125rem 0;
    border-radius: 0.125rem;
    height: 2rem;
    padding: 0.25rem;
    position: relative;
    background: 0;
    font-family: 'Lato', Arial, sans-serif;
    font-size: 1rem;
    height: 2rem;
}

.form-control-blocked,
span.form-control {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    transition: unset;
}

.form-control,
.select-wrapper,
.width-normal {
    width: 18rem;
    max-width: 100%;
}

    .form-control:hover,
    .select-wrapper select:hover {
        border-color: rgba(0,118,209, 0.5);
    }

    .form-control:focus,
    .select-wrapper select:focus {
        border-color: #0076D1;
        box-shadow: none;
        background: rgba($AccentRGB), 0.05);
    }


        .form-control:focus .form-control-icon,
        .form-control:hover .form-control-icon,
        .select-wrapper select:focus .form-control-icon,
        .select-wrapper select:hover .form-control-icon {
            color: #0076D1;
        }

    .form-control.disabled,
    .form-control.disabled:hover,
    .form-control:disabled,
    .form-control:disabled:hover,
    .form-control-blocked,
    .form-control[readonly],
    .select-wrapper select:disabled,
    .select-wrapper select:disabled:hover,
    .sngfilter.disabled .form-control {
        background: rgba(4, 0, 10, 0.05);
        border-color: transparent;
    }

input.form-control:-moz-read-only {
    background: rgba(4, 0, 10, 0.05);
    border-color: transparent;
}

.form-control:disabled,
.select-wrapper select:disabled,
.sngfilter.disabled .form-control {
    color: #627895;
    cursor: not-allowed;
}

.form-control.invalid,
.select-wrapper select.invalid {
    border-color: #fb9012;
    background: rgba(252, 163, 17, 0.1);
}

.form-control::-webkit-input-placeholder {
    color: #BAC6D6;
}

.form-control:-ms-input-placeholder {
    color: #BAC6D6;
}

.form-control::-ms-input-placeholder {
    color: #BAC6D6;
}

.form-control::placeholder {
    color: #BAC6D6;
}

.bg-secondary .form-control::-webkit-input-placeholder {
    color: rgba(255,255,255,0.25);
}

.bg-secondary .form-control:-ms-input-placeholder {
    color: rgba(255,255,255,0.25);
}

.bg-secondary .form-control::-ms-input-placeholder {
    color: rgba(255,255,255,0.25);
}

.bg-secondary .form-control::placeholder {
    color: rgba(255,255,255,0.25);
}

.form-control::-ms-clear,
.form-control::-webkit-search-decoration,
.form-control::-webkit-search-cancel-button,
.form-control::-webkit-search-results-button,
.form-control::-webkit-search-results-decoration {
    display: none;
}

@-webkit-keyframes fadeOutUp {
    from {
        opacity: 1;
    }

    90% {
        opacity: 0;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
}

@keyframes fadeOutUp {
    from {
        opacity: 1;
    }

    90% {
        opacity: 0;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
}

@-webkit-keyframes fadeInDown {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.form-control-icon {
    color: #627895;
    float: right;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
    padding: 0.125rem;
    position: absolute;
    top: 0.25rem;
    right: 0.25rem;
}

.width-small, .width-normal, width-wide {
    max-width: 100%;
}

    .width-small .form-control,
    .width-small .select-wrapper,
    .width-normal .form-control,
    .width-normal .select-wrapper,
    .width-wide .form-control,
    .width-wide .select-wrapper,
    .width-stretch .form-control,
    .width-stretch .select-wrapper {
        width: 100%;
    }

.width-small,
.form-control.width-small,
.select-wrapper.width-small {
    width: 9rem;
}

.width-wide,
.form-control.width-wide,
.select-wrapper.width-wide {
    width: 40rem;
    max-width: 100%;
}

.width-stretch,
.form-control.width-stretch,
.form-control-blocked.width-stretch,
.select-wrapper.width-stretch {
    width: 100%;
}

    /* 40rem as max width for any standard (input-styled) form control */
    .width-stretch .form-control,
    .width-stretch .select-wrapper,
    .form-control.width-stretch,
    .form-control-blocked.width-stretch,
    .select-wrapper.width-stretch {
        max-width: 40rem;
    }

    /* except textareas */
    textarea.form-control.width-stretch,
    textarea.form-control-blocked.width-stretch,
    .width-stretch textarea.form-control {
        max-width: none;
    }

.fs-toggle, .select-wrapper select {
    padding-right: 1.25rem;
}

.select-wrapper {
    padding: 0;
    position: relative;
    line-height: 1rem;
}

    .select-wrapper > span {
        color: #627895;
        display: block;
        font-family: 'FontAwesome';
        font-size: 0.75rem;
        position: absolute;
        right: 0.5rem;
        top: 0.5rem;
        z-index: 0;
    }

        .select-wrapper > span:before {
            content: '\f0dc';
        }

.select-wrapper-loading > span:before {
    content: '\f1ce';
}

.select-wrapper select {
    background: 0;
    position: relative;
    width: 100%;
    z-index: 1;
    -moz-appearance: none;
    -webkit-appearance: none;
}

    .select-wrapper select::-ms-expand {
        display: none;
    }

    .select-wrapper select:disabled {
        color: #627895;
    }

        .select-wrapper select:disabled + span {
            opacity: 0.25;
        }

    .select-wrapper select:focus:not(:disabled) + span, .select-wrapper select:hover:not(:disabled) + span {
        color: #0076D1;
    }

textarea.form-control {
    height: auto;
    min-height: 5rem;
    border-width: 1px 1px 2px 1px;
    border-style: dotted dotted solid dotted;
}

[sng-input-save-textbox] ng-transclude {
    flex-grow: 1;
    flex-shrink: 1;
    overflow: hidden;
}



/* ========== buttons */

.btn, .btn.btn-primary {
    background: #0076D1;
    border-radius: 0.25rem;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.15);
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 600;
    min-width: 6rem;
    padding: 0.5rem 1rem;
    text-align: center;
    transition: background 0.12s ease;
    -webkit-transition: background 0.12s ease;
    margin-right: .5rem;
    min-height: 2rem;
    height: auto;
    word-break: break-word;
    border: 0;
    white-space: normal;
    line-height: 1em;
}

    .btn, .btn:active, .btn:focus, .btn:hover {
        outline: 0;
        color: #fff;
    }

        .btn:hover, .btn.btn-primary:hover {
            background: #148AE5;
        }

        .btn:focus, .btn.btn-primary:focus, .collapsible-btn:focus {
            -webkit-box-shadow: 0 0 0 0.125rem rgba(0,118,209, 0.5);
            box-shadow: 0 0 0 0.125rem rgba(0,118,209, 0.5);
        }

        .btn:active, .btn.btn-primary:active {
            background: #0062BD;
            -webkit-box-shadow: none;
            box-shadow: none;
        }

        .btn.btn-narrow {
            min-width: 0;
        }

        .btn.btn-secondary {
            background: #211551;
            color: #FFFFFF;
        }



            .btn.btn-secondary:hover {
                background: #352965;
            }

            .btn.btn-secondary:focus {
                -webkit-box-shadow: 0 0 0 0.125rem rgba(33,21,81, 0.5);
                box-shadow: 0 0 0 0.125rem rgba(33,21,81, 0.5);
            }

            .btn.btn-secondary:active {
                background: #0D013D;
                -webkit-box-shadow: none;
                box-shadow: none;
            }

        .btn.btn-success {
            background: #55c339;
            color: #fff;
        }

            .btn.btn-success:hover {
                background: #69D74D;
            }

            .btn.btn-success:focus {
                -webkit-box-shadow: 0 0 0 0.125rem rgba(85,195,57, 0.5);
                box-shadow: 0 0 0 0.125rem rgba(85,195,57, 0.5);
            }

            .btn.btn-success:active {
                background: #41AF25;
                -webkit-box-shadow: none;
                box-shadow: none;
            }

        .btn.btn-warning {
            background: #fb9012;
            color: #fff;
        }

            .btn.btn-warning:hover {
                background: #FFA426;
            }

            .btn.btn-warning:focus {
                -webkit-box-shadow: 0 0 0 0.125rem rgba(251,144,18, 0.5);
                box-shadow: 0 0 0 0.125rem rgba(251,144,18, 0.5);
            }

            .btn.btn-warning:active {
                background: #E77C00;
                -webkit-box-shadow: none;
                box-shadow: none;
            }

        .btn.btn-danger {
            background: #e73b4e;
            color: #fff;
        }

            .btn.btn-danger:hover {
                background: #FB4F62;
            }

            .btn.btn-danger:focus {
                -webkit-box-shadow: 0 0 0 0.125rem rgba(231,59,78, 0.5);
                box-shadow: 0 0 0 0.125rem rgba(231,59,78, 0.5);
            }

            .btn.btn-danger:active {
                background: #D3273A;
                -webkit-box-shadow: none;
                box-shadow: none;
            }

        .btn.btn-muted {
            background: #627895;
            color: #fff;
        }

            .btn.btn-muted:hover {
                background: #768CA9;
            }

            .btn.btn-muted:focus {
                -webkit-box-shadow: 0 0 0 0.125rem rgba(98,120,149, 0.5);
                box-shadow: 0 0 0 0.125rem rgba(98,120,149, 0.5);
            }

            .btn.btn-muted:active {
                background: #4E6481;
                -webkit-box-shadow: none;
                box-shadow: none;
            }

        .btn.btn-block, .btn-block {
            margin: 0;
        }

            .btn-block + .btn-block {
                margin-top: .5rem;
            }

.btn-alert {
    font-weight: 500;
    background: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn.btn-alert:hover {
    background: #fff;
    color: #0076D1;
}

.btn-link, .btn.btn-link, .btn.btn-link:hover, .btn.btn-link:active, .btn.btn-link:focus,
.btn-fa, .btn.btn-fa, .btn.btn-fa:hover, .btn.btn-fa:active, .btn.btn-fa:focus {
    color: #0076D1;
}

.btn-link,
.btn-fa,
.btn-faded {
    background: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    text-transform: none;
    font-weight: bold;
}

    .btn-link:hover,
    .btn-fa:hover {
        background: rgba(0,118,209,0.15);
        text-decoration: none;
    }

    .btn-link:active,
    .btn-fa:active {
        background: rgba(0,118,209,0.2);
    }

.btn-fa, .btn.btn-fa {
    background: transparent;
    min-width: 2rem;
    height: auto;
    padding: .25rem .5rem;
    margin: 0;
    min-height: 0;
    line-height: 1.5rem;
}

    .btn-fa.btn-sm {
        min-width: 0;
    }

    .btn-fa.btn-fa-lg {
        min-width: 0;
        font-size: 1.125rem;
        height: 2rem;
        width: 2.25rem;
        text-align: center;
        display: block;
        flex-shrink: 0;
        display: flex;
        align-items: center;
    }

    .btn.btn-fa.btn-danger {
        color: #D3273A;
    }

    .btn.btn-fa.btn-success {
        color: #2D9B11;
    }

    .btn.btn-fa.btn-warning {
        color: #D36800;
    }

.btn:disabled, .btn:disabled:hover, .btn:disabled:active, .btn:disabled:focus,
a.btn[disabled], a.btn[disabled], a.btn[disabled], a.btn[disabled] {
    background: 0;
    !important;
    -webkit-box-shadow: inset 0 0 0 1px #BAC6D6 !important;
    box-shadow: inset 0 0 0 1px #BAC6D6 !important;
    cursor: not-allowed;
    color: #627895 !important;
    text-decoration: none;
}

.btn-fa:disabled, .btn-fa:disabled:hover, .btn-fa:disabled:active, .btn-fa:disabled:focus {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.btn.btn-link-success,
.btn.btn-link-success:hover {
    color: #55c339;
}

    .btn.btn-link-success:hover {
        background: rgba(85,195,57, 0.15);
    }

.btn.btn-link-warning,
.btn.btn-link-warning:hover {
    color: #fb9012;
}

    .btn.btn-link-warning:hover {
        background: rgba(251,144,18, 0.15);
    }


.btn.btn-link-danger,
.btn.btn-link-danger:hover {
    color: #e73b4e;
}

    .btn.btn-link-danger:hover {
        background: rgba(231,59,78, 0.15);
    }

.btn.btn-link-secondary,
.btn.btn-link-secondary:hover {
    color: #0D013D;
}

    .btn.btn-link-secondary:hover {
        background: rgba(33,21,81, 0.15);
    }

.btn.btn-link-muted,
.btn.btn-link-muted:hover {
    color: #627895;
}

    .btn.btn-link-muted:hover {
        background: rgba(98,120,149, 0.15);
    }


.btn-faded, .btn.btn-faded {
    background: rgba(0,118,209,0.1);
    color: #0076D1;
}

    .btn.btn-faded:hover, .btn.btn-faded:active {
        text-decoration: none;
        background: rgba(0,118,209,0.2);
        color: #0076D1;
    }

.btn-faded-secondary, .btn.btn-faded-secondary {
    background: rgba(33,21,81,0.1);
    color: #0D013D;
}

    .btn-faded-secondary:hover, .btn-faded-secondary:active,
    .btn.btn-faded-secondary:hover, .btn.btn-faded-secondary:active {
        text-decoration: none;
        background: rgba(33,21,81,0.2);
        color: #0D013D;
    }


.btn-faded-success, .btn.btn-faded-success {
    background: rgba(85,195,57,0.1);
    color: #0076D1;
}

    .btn-faded-success:hover, .btn-faded-success:active,
    .btn.btn-faded-success:hover, .btn.btn-faded-success:active {
        text-decoration: none;
        background: rgba(85,195,57,0.2);
        color: #0076D1;
    }


.btn-faded-warning,
.btn.btn-faded-warning {
    background: rgba(251,144,18,0.1);
    color: #fb9012;
}

    .btn-faded-warning:hover, .btn-faded-warning:active,
    .btn.btn-faded-warning:hover, .btn.btn-faded-warning:active {
        text-decoration: none;
        background: rgba(251,144,18,0.2);
        color: #fb9012;
    }


.btn-faded-danger,
.btn.btn-faded-danger {
    background: rgba(231,59,78,0.1);
    color: #e73b4e;
}

    .btn-faded-danger:hover, .btn-faded-danger:active,
    .btn.btn-faded-danger:hover, .btn.btn-faded-danger:active {
        text-decoration: none;
        background: rgba(231,59,78,0.2);
        color: #e73b4e;
    }


.btn-faded-muted, .btn.btn-faded-muted {
    background: rgba(98,120,149,0.1);
    color: #627895;
}

    .btn-faded-muted:hover, .btn-faded-muted:active,
    .btn.btn-faded-muted:hover, .btn.btn-faded-muted:active {
        text-decoration: none;
        background: rgba(98,120,149,0.2);
        color: #627895;
    }


.btn-faded-info,
.btn.btn-faded-info {
    background: rgba(91,192,222,0.1);
    color: #5bc0de;
}

    .btn-faded-info:hover, .btn-faded-info:active,
    .btn.btn-faded-info:hover, .btn.btn-faded-info:active {
        text-decoration: none;
        background: rgba(91,192,222,0.2);
        color: #5bc0de;
    }


.btn.btn-outline {
    border: 1px solid #0076D1;
    color: #0076D1;
    background: 0;
}

    .btn.btn-outline:hover {
        background: rgba(0,118,209,0.15);
    }

    .btn.btn-outline:active {
        background: #0076D1;
        color: #fff;
    }

    .btn.btn-outline.btn-outline-inverse {
        border-color: #fff;
        background: rgba(255,255,255,0.1); /* no rgba support on TextContrast variable */
        color: #fff;
    }

.btn.btn-outline-inverse:hover {
    background: rgba(255,255,255,0.2); /* no rgba support on TextContrast variable */
}

.btn.btn-outline-inverse:active {
    background: #fff;
    color: #0076D1;
}


.btn.btn-outline:disabled, .btn.btn-outline-inverse:disabled,
.btn.btn-outline:disabled:hover, .btn.btn-outline-inverse:disabled:hover {
    border: 1px solid rgba(255,255,255,0.3);
    color: #fff !important;
    background: 0;
    box-shadow: none !important;
}

.btn-icon {
    text-align: left;
    display: inline-flex;
    align-items: center;
}

    .btn-icon .fa:first-child {
        border-right: 1px solid rgba(255, 255, 255, 0.4);
        margin-left: -.3875rem;
        margin-right: 0.5rem;
        padding-right: 0.5rem;
    }

    .btn-icon.btn-lg .fa {
        font-size: 1.125rem;
        margin: .125rem .5rem 0 0;
    }

    .btn-icon.btn-sm .fa,
    .btn-icon.btn-link .fa {
        padding-left: .25rem;
    }

    .btn-icon.btn-link .fa {
        border: 0;
        margin: 0;
    }

    .btn-icon.btn-link {
        text-align: center;
    }

.btn.btn-lg {
    font-size: 1rem;
    height: 2.75rem;
}

.btn.btn-launch {
    width: 100%;
    display: flex;
    font-size: 1rem;
    padding: 0.75rem 1rem;
    font-weight: bold;
    align-items: center;
}

    .btn.btn-launch .fa {
        flex: 0;
    }

    .btn.btn-launch .btn-text {
        flex: 1;
    }

.btn.btn-sm,
.btn.btn-xs {
    min-height: 0;
    min-width: 0;
    line-height: 1em;
}

.btn.btn-sm {
    height: 1.5rem;
    padding: .25rem 0.5rem;
}

.btn.btn-xs {
    padding: .125rem .25rem;
    height: 1.25rem;
}

.btn-xs .fa, .btn-xs .fo, .btn-sm .fa, .btn-sm .fo { /* Small button icons */
    margin-right: .25rem;
}

/* #14354 - fixing above .btn:not... rule */
.btn-group > .btn {
    margin-right: 0;
}

/* Input groups and addons */

.input-group-addon {
    height: 2rem;
    background: transparent;
    border: 0;
    border-bottom: 2px transparent;
}

/* Item selector display - resource editor & file input */


/*file input element*/
.item-selector {
    display: flex;
}

    .item-selector.item-selector-inline {
        display: inline-flex;
    }

    .item-selector.width-stretch {
        width: 100%;
    }


.item-selector-info {
    float: left;
    color: #0076D1;
    position: absolute;
    cursor: pointer;
    left: 0;
    top: 0;
    line-height: 2rem;
    bottom: 0;
    width: 2rem;
}

.item-selector-display {
    border-radius: .25rem;
    background: #e1e9f5;
    vertical-align: middle;
    color: #627895;
    text-align: center;
    min-width: 5rem;
    flex: 1 1 auto;
}

    .item-selector-display.item-selector-selected {
        border-left: 3px solid #0076D1;
        color: #0076D1;
    }

.item-selector-item {
    font-size: .875rem;
    min-width: 18rem;
    padding: .5rem 2rem 0.5rem 1.25rem;
    min-height: 2.25rem;
    position: relative;
}

.item-selector-compact .item-selector-item {
    min-width: 4rem;
}

.item-selector-item.has-info-button {
    padding-left: 2rem;
}

.item-selector-text {
    word-break: break-word;
    word-wrap: break-word;
    -ms-word-break: break-word;
    -ms-word-wrap: break-word;
}

.item-selector-remove {
    float: right;
    color: #0076D1;
    position: absolute;
    cursor: pointer;
    right: 0;
    top: 0;
    line-height: 2rem;
    bottom: 0;
    width: 2rem;
}


.item-selector-button {
    /* min-width: 13rem;*/
}

    .item-selector-button:last-child {
        margin: 0 0 0 .5rem;
    }

.item-selector.item-selector-stacked .item-selector-display {
    display: block;
}

.item-selector.item-selector-stacked .item-selector-button {
    width: 100%;
    margin-bottom: 1rem;
}

.item-selector.item-selector-inline .item-selector-display {
    display: inline-block;
    margin-left: 0.75rem;
}

/*  disabled state */
.item-selector-item .item-selector-info[disabled],
.item-selector-item .item-selector-remove[disabled] {
    color: #627895;
    cursor: not-allowed;
}

/* Checkboxes and radio controls */

.alt-radio.focused {
    border-color: #0076D1;
    -webkit-box-shadow: 0 0 0 3px rgba(0,118,209, 0.5);
    box-shadow: 0 0 0 3px rgba(0,118,209, 0.5);
}

.alt-checkbox input,
.alt-radio input,
.checkbox input,
.radio input {
    position: absolute;
    opacity: 0;
    z-index: -1;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: polygon(0px 0px,0px 0px,0px 0px,0px 0px);
    clip-path: polygon(0px 0px,0px 0px,0px 0px,0px 0px);
    height: 0;
    width: 0;
    overflow: hidden;
    float: left;
    -moz-appearance: none;
    appearance: none;
    -webkit-appearance: none;
}

    .alt-checkbox input:focus + span:before,
    .alt-radio input:focus + span:before,
    .checkbox input:focus + span:before,
    .radio input:focus + span:before,
    .checkbox-static:focus:before,
    .radio-static:focus:before {
        border-color: #0076D1;
        -webkit-box-shadow: 0 0 0 3px rgba(0,118,209, 0.5);
        box-shadow: 0 0 0 3px rgba(0,118,209, 0.5);
    }

.alt-radio.vertical,
.alt-checkbox.vertical,
.alt-checkbox.vertical span,
.alt-radio.vertical span {
    width: 100%;
    display: block;
}

    .alt-radio.vertical label,
    .alt-checkbox.vertical label {
        display: block;
        margin: 0 0 .25rem;
    }

    .alt-checkbox.vertical input,
    .alt-radio.vertical input {
        display: block;
    }

    .alt-checkbox.vertical label:last-child,
    .alt-radio.vertical label:last-child {
        margin: 0;
    }

.checkbox,
.radio {
    line-height: 1rem;
    display: inline-block;
    margin-right: 1rem;
    font-size: 1rem;
}

.form-group label.checkbox,
.prop-panel-control label.checkbox,
.form-group label.radio,
.prop-panel-control label.radio {
    font-size: 1rem;
    color: #5e5b77;
}

.checkbox:last-child,
.radio:last-child {
    margin-right: 0;
}

.checkbox.vertical,
.radio.vertical {
    display: block;
    padding-top: 0.5rem;
}

.alt-radio:has(input:focus) {
    border-color: #0076D1;
    -webkit-box-shadow: 0 0 0 3px rgba(0,118,209, 0.5);
    box-shadow: 0 0 0 3px rgba(0,118,209, 0.5);
}

/* Angular buttons that perform as checkboxes */
.checkbox-static,
.radio-static {
    appearance: none;
    background: 0;
    border: 0;
    padding: 0;
    margin: 0;
}

    .checkbox-static:focus,
    .radio-static:focus {
        outline: 0;
    }

    /* Main code for checkboxes*/
    .checkbox input ~ span:before,
    .radio input ~ span:before,
    .checkbox-static:before,
    .radio-static:before {
        background: transparent;
        border: 2px solid #627895;
        cursor: pointer;
        display: inline-block;
        height: 1rem;
        margin-right: 0.5rem;
        overflow: hidden;
        position: relative;
        top: 0.125rem;
        -webkit-transition: all 0.15s ease;
        transition: all 0.15s ease;
        width: 1rem;
    }

.checkbox.checkbox--no-right-margin input ~ span:before {
    margin-right: 0px;
}

.checkbox input ~ span:before,
.checkbox-static:before {
    border-radius: 0.125rem;
    color: transparent;
    content: '\f00c';
    font-family: 'FontAwesome';
    font-size: 0.75rem;
    line-height: 0.75rem;
}

.radio input ~ span:before,
.radio-static:before {
    border-radius: 0.5rem;
    content: '';
}

.radio input:checked + span:before,
.checkbox input:checked + span:before,
.radio-static.checked:before,
.checkbox-static.checked:before {
    border-color: #0076D1;
    color: #fff;
}

.radio input:checked + span:before,
.radio-static.checked:before {
    border-width: .375rem;
}

.radio input:checked:focus + span:before,
.radio-static.checked:focus:before {
    -webkit-box-shadow: 0 0 0 3px rgba(0,118,209, 0.5);
    box-shadow: 0 0 0 3px rgba(0,118,209, 0.5);
}

.checkbox input:checked + span:before,
.checkbox-static.checked:before {
    background: #0076D1;
}

.checkbox input:disabled ~ span,
.radio input:disabled ~ span,
.checkbox-static:disabled,
.radio-static:disabled {
    color: #627895;
}

    .checkbox input:disabled + span:before,
    .radio input:disabled + span:before,
    .checkbox-static:disabled:before,
    .radio-static:disabled:before {
        border-color: #BAC6D6;
        cursor: not-allowed;
    }

.checkbox input:disabled:checked + span:before,
.checkbox-static.checked:disabled:before {
    background: 0;
    color: #BAC6D6;
}

.form-label + .checkbox:before,
.form-label + .radio:before {
    display: block;
    content: '';
}

.alt-checkbox,
.alt-radio {
    border-radius: .5rem;
    padding: 0.25rem;
    border: 1px solid #dee3e8;
    display: inline-block;
}

    .alt-checkbox label,
    .alt-radio label {
        padding: .25rem;
        margin: 0;
    }

        .alt-checkbox label span,
        .alt-radio label span {
            padding: .125rem 0.75rem;
            border-radius: .25rem;
            display: block;
            cursor: pointer;
            -webkit-transition: all 0.2s ease;
            transition: all 0.2s ease;
            min-width: 6rem;
            text-align: center;
            color: #0076D1;
        }

        .alt-checkbox label:hover span,
        .alt-radio label:hover span {
            background: rgba(0,118,209, 0.1);
        }

        .alt-checkbox label input:checked + span,
        .alt-radio label input:checked + span {
            background: #0076D1;
            color: #fff;
        }

    .alt-checkbox span:before {
        font-family: 'FontAwesome';
        margin-right: .5rem;
        content: '\f096';
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        color: #627895;
        width: 1rem;
        display: inline-block;
        text-align: center;
    }

    .alt-checkbox input:checked + span:before {
        content: '\f14a';
        color: #fff;
    }

    .alt-checkbox input:disabled + span,
    .alt-radio input:disabled + span {
        background: 0;
        color: #BAC6D6;
        cursor: not-allowed;
    }

    .alt-checkbox label input:checked:disabled + span,
    .alt-radio label input:checked:disabled + span {
        background: #627895;
        color: #fff;
    }

/* Columns in tables or stacks containing checkboxes */

.checkbox-column, .table .checkbox-column, .t-row .checkbox-column {
    width: 2.5rem;
    padding: 0;
}

    .checkbox-column .checkbox-static {
        padding: .75rem;
    }

        .checkbox-column .checkbox,
        .checkbox-column input ~ span::before,
        .checkbox-column .checkbox-static::before,
        .checkbox-column .radio-static::before {
            margin: 0;
        }

/* Currency controls */

.currency-control {
    padding: 0;
    display: flex;
    flex-wrap: wrap;
}

    .currency-control .select-wrapper {
        flex: 0 0 auto;
        flex-basis: 4.625rem;
    }

    .currency-control select {
        padding-left: 0.5rem;
        text-align: right;
    }

    .currency-control input {
        background: 0;
        padding-left: 1rem;
        width: calc(100% - 4.625rem);
        flex: 1 1 auto;
        flex-basis: calc(100% - 4.625rem);
    }

.date-control {
    max-width: 20rem;
    padding-right: 1.5rem;
}

    .date-control.dd-toggle:after {
        display: none;
    }

.date-control,
.fs-toggle {
    height: auto;
    min-height: 2rem;
}

.open .date-control,
.form-control-toggle:hover {
    cursor: pointer;
    background: rgba(0,118,209, 0.1);
}

    .open .date-control .form-control-icon,
    .form-control-toggle:hover .form-control-icon {
        color: #0076D1;
    }

.disabled .form-control-icon, input:disabled ~ .form-control-icon {
    color: #BAC6D6 !important;
}

/* Toggles */

.toggle {
    display: inline-block;
    margin: 0;
}

    .toggle input {
        width: 0;
        height: 0;
        padding: 0;
        clip: rect(0, 0, 0, 0);
        -webkit-clip-path: polygon(0px 0px,0px 0px,0px 0px,0px 0px);
        clip-path: polygon(0px 0px,0px 0px,0px 0px,0px 0px);
        -webkit-box-shadow: none;
        box-shadow: none;
        -moz-appearance: none;
        appearance: none;
        -webkit-appearance: none;
        opacity: 0;
    }

.tog-switch {
    display: inline-block;
    width: 3.5rem;
    height: 2rem;
    background: #627895;
    border-radius: 1rem;
    float: left;
    margin-right: 0.5rem;
    position: relative;
    cursor: pointer;
    -webkit-box-shadow: inset 0 -15px 20px rgba(255, 255, 255, 0.16);
    box-shadow: inset 0 -15px 20px rgba(255, 255, 255, 0.16);
    line-height: 1rem;
    font-size: 1rem;
}

    .tog-switch, .tog-switch:before {
        -webkit-transition: all 0.2s ease;
        transition: all 0.2s ease;
    }

        .tog-switch:before {
            display: block;
            content: '';
            width: 1.5rem;
            height: 1.5rem;
            border-radius: 0.75rem;
            background: #fff;
            position: absolute;
            top: 0.25rem;
            left: 0.25rem;
            -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0, 0.15);
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0, 0.15);
        }

input:focus + .tog-switch {
    -webkit-box-shadow: 0 0 0 2px rgba(0,118,209, 0.5), inset 0 -15px 20px rgba(255, 255, 255, 0.16);
    box-shadow: 0 0 0 2px rgba(0,118,209, 0.5), inset 0 -15px 20px rgba(255, 255, 255, 0.16);
}

input:checked:focus + .tog-switch {
    -webkit-box-shadow: 0 0 0 2px rgba(85,195,57, 0.5), inset 0 -15px 20px rgba(255, 255, 255, 0.16);
    box-shadow: 0 0 0 2px rgba(85,195,57, 0.5), inset 0 -15px 20px rgba(255, 255, 255, 0.16);
}

input:checked + .tog-switch {
    background: #55c339;
}

    input:checked + .tog-switch:before {
        left: 1.75rem;
    }

.toggle input + span:nth-of-type(2),
.toggle input:checked ~ span:nth-of-type(3),
.toggle span:nth-of-type(2) {
    display: none;
}

    .toggle input:checked ~ span:nth-of-type(2),
    .toggle span:nth-of-type(2):last-child {
        display: inline;
    }

.tog-switch:nth-last-child(2):after {
    display: block;
    content: '\f00d';
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    color: rgba(255, 255, 255, 0.5);
    font-family: 'FontAwesome';
    font-weight: normal;
}

input:checked + .tog-switch:nth-last-child(2):after {
    right: 2.25rem;
    content: '\f00c';
}

.toggle-sm .tog-switch {
    height: 1.5rem;
    width: 3rem;
    line-height: 1.5rem;
}

    .toggle-sm .tog-switch:before {
        height: 1rem;
        width: 1.25rem;
    }

.tog-switch ~ span {
    line-height: 2rem;
}

.toggle-sm .tog-switch ~ span {
    line-height: 1.5rem;
    font-size: .875rem;
}

.toggle-sm input:checked + .tog-switch:before {
    left: 1.375rem;
}

.toggle-sm input:checked + .tog-switch:nth-last-child(2):after {
    right: 1.75rem;
    top: 0;
}

.toggle-sm .tog-switch:nth-last-child(2):after {
    top: 0;
    right: 0.5rem;
}

.toggle input:disabled + .tog-switch {
    background: 0;
    -webkit-box-shadow: 0 0 0 2px #BAC6D6;
    box-shadow: 0 0 0 2px #BAC6D6;
    cursor: not-allowed;
}

    .toggle input:disabled + .tog-switch:before {
        border: 2px solid #BAC6D6;
        background: 0;
    }

.toggle input:disabled:checked + .tog-switch:before {
    background: #BAC6D6;
}

input:disabled + .tog-switch:after {
    color: #BAC6D6;
}

.toggle input:disabled ~ span:not(.tog-switch) {
    color: #627895;
}

.toggle-sm span {
    font-size: .875rem;
}

.required {
    color: #e73b4e;
}

.error-message {
    font-size: 0.875rem;
    color: #fb9012;
    max-width: 100%;
    display: flex;
    padding: .25rem 0;
    height: 1.75rem;
}

.error-icon {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

.error-message:empty {
    display: none;
}

.error-icon,
.help-icon,
.dv-help-icon,
.sng-ui-help {
    font-size: 0.875rem;
    font-family: 'FontAwesome';
}

.help-icon,
.dv-help-icon,
.sng-ui-help {
    margin-left: .5rem;
    cursor: pointer;
}

    .help-icon:before,
    .dv-help-icon:before,
    .sng-ui-help:before {
        content: '\f059';
        color: #BAC6D6;
    }

.error-icon:before {
    content: '\f06a';
    color: #fb9012;
}

.fs-toggle {
}

    .fs-toggle span,
    .fs-toggle:after {
        padding: .25rem 0 0;
    }

    .fs-toggle:after {
        display: block;
        clear: both;
    }

    .fs-toggle:hover {
        cursor: pointer;
        color: #0076D1;
    }

    .fs-toggle .fs-selected {
        color: #5e5b77;
        padding: 0 0 0 .25rem;
        width: 100%;
    }

        .fs-toggle .fs-selected button {
            float: right;
            font-size: .75rem;
            padding: .25rem;
            margin: .125rem 0 0;
            color: #BAC6D6;
            -moz-appearance: none;
            -webkit-appearance: none;
        }

            .fs-toggle .fs-selected button:hover {
                color: #0076D1;
                cursor: pointer;
            }

.fs-selected .title {
    width: calc(100% - 1.375rem);
    float: left;
    font-size: 1rem;
    padding: 0;
    line-height: 1.25rem;
    word-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-word;
    -ms-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}

.visible .fs-toggle {
    -webkit-box-shadow: 0 0 0 2px rgba(0,118,209, 0.5);
    box-shadow: 0 0 0 2px rgba(0,118,209, 0.5);
}

.fs-selected-label {
    float: left;
    max-width: calc(100% - 1.25rem);
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}


.dragover {
    background: rgba(0,118,209, 0.1);
    border-color: #0076D1;
    color: #0076D1;
}

.movefield {
    transition: .3s;
}

.drag-icon {
    height: 14px;
    width: 6px;
    border-left: 2px solid /*Value not set in Theme Parser*/;
    border-right: 2px solid /*Value not set in Theme Parser*/;
}

.draggable {
    cursor: move !important;
    cursor: grab !important;
    cursor: -moz-grab !important;
    cursor: -webkit-grab !important;
    transition: .3s !important;
}

.drag-icon-right-light {
    height: 14px;
    border-right: 2px solid #fff;
}

.drag-icon-left-right {
    height: 14px;
    border-left: 2px solid #fff;
}

.drag-drop-zone {
    width: 100%;
    height: 42px;
    background: rgba(0,118,209, 0.2);
}

/* TABLE STYLING */

.zugo-total .table thead,
.t-head,
tfoot {
    background-color: #BAC6D6;
    color: #212529;
}

.highlightHeader {
    background: #ebf1f7;
    color: #0076D1 !important;
}

.table thead,
.t-head,
tfoot {
    background: #211551;
    color: #FFFFFF;
}

.t-head, .row.t-head {
    margin: 0;
}

    .table thead th,
    .t-head > div {
        padding: 0.5rem 0.75rem;
        border: 0;
    }

    .table-small thead th,
    .t-head > div {
        padding: 0.4rem 0.5rem;
    }

    .t-head:first-child {
        border-top: 0.125rem solid #fff;
        border-radius: .25rem .25rem 0 0;
    }

.t-body {
    border: 0.125rem solid #fff;
    border-width: 0 .125rem;
    border-radius: .25rem;
}

.t-body, .t-row .t-body {
    padding: 0;
}

    .t-body + .t-body {
        margin-top: 1rem;
    }

ul.t-body {
    list-style: none;
}

.table tbody tr,
.t-row {
    border: 0.125rem solid #fff;
    border-width: 0 0 0.125rem;
    background: #ebf1f7;
}

.table tbody tr.dynoview-total-row {
    background: #BAC6D6;
    font-weight: bold;
}

.table tbody tr.dynoview-total-row td {
    padding: 0.5rem 0.75rem;
}

.t-row:first-child {
    border-top-width: 0.125rem;
}

.table tbody tr.clickable:hover,
.t-row.clickable:hover {
    background: #fff;
    color: #0076D1;
    cursor: pointer;
}

.table tbody td,
.t-row > div {
    padding: 0.75rem;
}

.table-small tbody td,
.t-row > div {
    padding: 0.4rem;
}

.t-row > div {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

td.td-with-anchor {
    padding: 0 !important;
}

td.td-with-anchor a {
    display: block;
    padding: 0.75rem;
    height: 100%;
    width: 100%;
    color: inherit;
}

td.td-with-anchor a:hover, a:focus {
    text-decoration: none;
}

.t-row.disabled, .t-row:disabled {
    background: #e1e9f5;
    color: #627895;
}

.t-row.t-row-add {
    appearance: none;
    text-align: center;
    padding: .125rem;
    color: #627895;
    background: #e1e9f5;
    width: 100%;
}

.t-row.t-row-add:hover {
    cursor: pointer;
    background: rgba(0,118,209, 0.2);
    color: #fff;
}

.t-body > .t-row {
    margin: 0;
}

/* new class for new data-grid */
thead.data-grid-sortable {
    cursor: pointer;
}

thead.sortable th,
.t-head.sortable > div,
.sng-results-container th {
    position: relative;
    cursor: pointer;
}

    .sng-results-container th.loading-results,
    .t-head.sortable > div {
        position: relative;
        cursor: default;
    }


    thead.sortable th:before,
    .thead.sortable > div:before {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        background: rgba(255, 255, 255, 0.1);
        content: '';
        opacity: 0;
    }

    thead.sortable th:after,
    .thead.sortable > div:after {
        margin-left: 0.5rem;
        display: inline;
        font-family: 'FontAwesome';
        font-size: 0.75rem;
        padding: 0.25rem;
        position: relative;
        color: #fff;
        opacity: .5;
        content: '\f0dc';
    }

    thead.sortable th.sort:before, thead.sortable th.sort-asc:before, thead.sortable th.sort-desc:before, thead.sortable th:hover:before {
        opacity: 1;
    }

    thead.sortable th.sort:after, thead.sortable th.sort-asc:after, thead.sortable th.sort-desc:after, thead.sortable th:hover:after {
        opacity: .5;
    }

th.sort-column {
    background: #352965;
}

th.sort,
th.sort-asc,
th.sort-desc {
    position: relative;
}

    th.sort:after,
    th.sort-asc:after,
    th.sort-desc:after {
        display: block;
    }

    th.sort-asc:after {
        content: '\f0de' !important;
        top: -.125rem;
    }

    th.sort-desc:after {
        content: '\f0dd' !important;
        top: 0.125rem;
    }


thead.sortable th.no-sort:after {
    content: '';
    content: none;
    display: none;
}


th .sort-spinner {
    display: inline-block;
    margin-left: .25rem;
}


.table tr.disabled,
.t-row .disabled {
    color: #BAC6D6;
    cursor: default;
}

.table tbody td,
.t-row > div {
    overflow-wrap: break-word;
    -ms-word-break: break-word;
    word-break: break-word;
    word-wrap: break-word;
    max-width: 100vw; /* IE11 cannot force word wrap without specified maximum width*/
}

    .table tbody td:only-child,
    .t-row > div:only-child {
        max-width: none;
    }

.table tbody tr.selected,
.t-row.selected {
    color: #0076D1;
}

    .table tbody tr.selected td:first-child,
    .t-row.selected > div:first-child {
        -webkit-box-shadow: inset .1875rem 0 0 #0076D1;
        box-shadow: inset .1875rem 0 0 #0076D1;
    }

.t-row.row {
    margin: 0;
}

.table tbody + tbody {
    border-top: 3px solid #BAC6D6;
}

.table + .table {
    margin-bottom: 0;
}

.table-hover tbody tr:not(.disabled):not(.table-subtotal):hover td {
    background: #fff;
    cursor: pointer;
    color: #0076D1;
}

.table-hover-no-tracks tbody tr:not(.disabled):not(.table-subtotal):hover td {
    background: #fff;
    cursor: default !important;
    color: #0076D1;
}

.table-subtotal {
    background-color: rgba(0,0,0,.075) !important;
}

.table-groupheader {
    text-align: center;
}


.table .mobile-display-name {
    display: none;
}

.sng-checkbox-column, .t-row .sng-checkbox-column, .table td.sng-checkbox-column {
    width: 3rem;
    padding: 0;
}

.col.sng-checkbox-column, .t-row .sng-checkbox-column {
    display: flex;
}

.sng-checkbox-column label {
    padding: .75rem;
    text-align: center;
    flex-grow: 1;
    display: flex;
    align-items: center;
}


/* Tooltip and popover override styling */

.tooltip-inner {
    -webkit-box-shadow: 0 0 0 1px #FFFFFF;
    box-shadow: 0 0 0 1px #FFFFFF;
    background: #211551;
    color: #FFFFFF;
}

    .tooltip-inner::before {
        border: 0;
        background: #211551;
        color: #FFFFFF;
        width: 8px;
        height: 8px;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        border: 0px solid #FFFFFF;
        z-index: 1;
    }

.tooltip.bs-tether-element-attached-bottom .tooltip-inner::before, .tooltip.tooltip-top .tooltip-inner::before {
    border-width: 0 1px 1px 0;
    border-color: #fff;
}

.tooltip.bs-tether-element-attached-left .tooltip-inner::before, .tooltip.tooltip-right .tooltip-inner::before {
    border-width: 0 0 1px 1px;
    border-color: #fff;
}

.tooltip.bs-tether-element-attached-top .tooltip-inner::before, .tooltip.tooltip-bottom .tooltip-inner::before {
    border-width: 1px 0 0 1px;
    border-color: #fff;
}

.tooltip.bs-tether-element-attached-right .tooltip-inner::before, .tooltip.tooltip-left .tooltip-inner::before {
    border-width: 1px 1px 0 0;
    border-color: #fff;
}

.list {
    margin-left: 1.5rem;
}

/* Business calendar */

.calendar-picker, .period-picker {
    display: block;
    max-width: 100%;
}

/* Validation styles */


.error-message-container.invalid > .form-control,
.error-message-container.invalid > .sngfilter .form-control,
.error-message-container.invalid > .select-wrapper select,
.error-message-container.invalid .sng-input-wrapper select {
    border-color: #fb9012;
    background-color: rgba(251,144,18, 0.1);
}

.error-message-container.invalid > .sngfilter .fs-toggle .form-control-icon {
    color: #fb9012;
}

.error-message-container.invalid > .form-control:focus,
.error-message-container.invalid > .sngfilter .form-control:focus,
.error-message-container.invalid > .select-wrapper select:focus {
    background: transparent;
}


.error-message-container.error-animate-in .form-control,
.error-message-container.error-animate-in .select-wrapper select {
    -webkit-transition: background-color 300ms ease-in;
    transition: background-color 300ms ease-in;
}

.error-message-container.error-animate-out .form-control,
.error-message-container.error-animate-out .select-wrapper select {
    -webkit-transition: background-color 300ms ease-out;
    transition: background-color 300ms ease-out;
}

.error-message-container .error-message {
    display: none;
    z-index: 0;
}

.error-message-container.invalid .error-message {
    display: flex;
}

.error-message-container.error-animate-in .error-message {
    -webkit-animation: 150ms fadeInDown ease;
    animation: 150ms fadeInDown ease;
}

.error-message-container.error-animate-out .error-message {
    -webkit-animation: 200ms fadeOutUp ease;
    animation: 200ms fadeOutUp ease;
}

.data-grid-error-icon {
    text-align: center;
    background: white;
}

/* Variables bar */

.variable-bar, .variable-bar .variable {
    border-radius: .25rem;
}

.variable-bar {
    background: #ebf1f7;
    border-radius: .25rem;
    padding: .125rem .25rem;
    margin-bottom: .5rem;
}

    .variable-bar .variable {
        padding: 0 .25rem;
        color: #0076D1;
        font-size: .875rem;
        font-weight: bold;
    }

        .variable-bar .variable:hover {
            background: rgba(0,118,209, 0.15);
            cursor: pointer;
        }

.custom-slider.rzslider .rz-bar {
    background: #ffe4d1;
    height: 2px;
}

.custom-slider.rzslider .rz-selection {
    background: orange;
}

.custom-slider.rzslider .rz-pointer {
    width: 8px;
    height: 16px;
    top: auto; /* to remove the default positioning */
    bottom: 0;
    background-color: #333;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

    .custom-slider.rzslider .rz-pointer:after {
        display: none;
    }

.custom-slider.rzslider .rz-bubble {
    bottom: 14px;
}

.custom-slider.rzslider .rz-limit {
    font-weight: bold;
    color: orange;
}

.custom-slider.rzslider .rz-tick {
    width: 1px;
    height: 10px;
    margin-left: 4px;
    border-radius: 0;
    background: #ffe4d1;
    top: -1px;
}

    .custom-slider.rzslider .rz-tick.rz-selected {
        background: orange;
    }

.rzslider .rz-bar {
    height: 1rem;
}

.rzslider .rz-bar-wrapper {
    padding-top: 12px;
}

.rzslider .rz-pointer {
    border-radius: 6px;
    width: 24px;
    background: #eff1f2;
    border: 1px solid #bac6d6;
    box-shadow: 0 1px 3px rgba(5,0,20,0.2), inset 3px 3px 8px #fff;
}

    .rzslider .rz-pointer::after {
        display: none;
    }

    .rzslider .rz-pointer:hover {
        box-shadow: 0 0 2px 1px rgba(200,0,75,0.3), inset 3px 3px 8px #fff;
    }

    .rzslider .rz-pointer.rz-active {
        box-shadow: 0 0 0 2px rgba(200,0,75,0.4), inset 3px 3px 8px #fff;
        outline: none;
    }

.rzslider .rz-bar-wrapper.rz-left-out-selection .rz-bar {
    background: #5d20bf;
}

.rzslider .rz-bar-wrapper.rz-right-out-selection .rz-bar {
    background: #5dc910;
}
/* KAP styles */
.sidebar.sidebar-wide {
    width: 26rem;
    overflow: hidden;
}

.profile-charts {
    padding: 0.5rem;
}

    .profile-charts h3 {
        padding: 0.5rem;
        margin-bottom: 0.5rem;
    }

.search-description-box {
    background-color: #e1e9f5;
    border-radius: 0.25rem;
}

    .search-description-box .fa {
        color: #0076D1;
        background-color: transparent;
        margin: 0 0.5rem 0 0.5rem;
    }

    .search-description-box.search-description-box--disabled {
        background-color: rgba(4, 0, 10, 0.05);
    }

        .search-description-box.search-description-box--disabled .fa {
            color: #627895;
            cursor: default;
        }

.search-description-text {
    display: inline-block;
    padding-right: 1rem;
    min-width: 10rem;
    max-width: 13rem;
    display: inline-block;
    color: #627895;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    font-size: 0.8em;
    text-align: center;
}

/* searchInfoBtn directive
    [Definition > step 3 > searches] */
button.item-selector-info.fa-info-circle {
    line-height: inherit;
    vertical-align: middle;
}

/* Style when selected item
    [Definition > step 3 > searches] */
li.node.selected div.row.node-text {
    border-radius: 0.25rem;
    background: #e1e9f5;
    color: #ce0037;
}

    li.node.selected div.row.node-text:hover {
        background: #e1e9f5;
    }

/* text-overflow: ellipsis
    [Definition > step 3 > searches] */
.col-ellipsis {
    white-space: nowrap;
    width: 400px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.style-selector {
    width: 30rem;
    border-radius: 1.5rem;
    background: white;
    box-shadow: 2px 4px 12px rgba(10,10,30,0.125);
}

.btn.new-btn-style {
    background: rgba(91,200,217, 0.25);
    color: #1D3E6F;
    box-shadow: none !important;
    border-radius: 1rem;
}

    .btn.new-btn-style:hover {
        background: rgba(91,200,217, 0.35);
        color: #1D3E6F;
    }

    .btn.new-btn-style:active, .btn.new-btn-style:focus {
        box-shadow: 0 0 0 3px rgba(91,200,217, 0.45);
    }

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
    -webkit-appearance: none;
}

@media (max-width: 768px) {
    .style-selector {
        width: 90vw;
        border-bottom-left-radius: 0.2rem;
        border-bottom-right-radius: 0.2rem;
        box-shadow: 0 0 0 2px #17a2b8, 0 3px 6px rgb(0 0 0 / 15%);
    }

    .table tbody td, .t-row > div {
        padding: 0.5rem;
        font-size: 0.875rem;
    }
}

@media only screen and (min-width: 768px) {

    .dg-ellipsis {
        position: relative;
    }

        .dg-ellipsis:before {
            content: '&nbsp;';
            visibility: hidden;
        }

    .dg-ellipsis-content {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        position: absolute;
        left: 12px;
        right: 12px;
    }
}

@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) {
    .dg-ellipsis-content {
        display: grid;
    }
}


/*
    Header, secondary navigation and sidebars
*/
/* RESERVED Z-INDEX VALUES */
.app-container {
    display: flex;
    flex-direction: column;
    height: 100vh;
    width: 100vw;
    position: relative;
}

.app-menu {
    background: #fff;
    min-height: 6rem;
    flex-shrink: 0;
    position: relative;
    z-index: 50;
    box-shadow: 0 2px 4px rgba(12, 23, 76, 0.2);
}

.app-menu-bottom,
.app-menu-top {
    width: 100%;
}

.app-menu-top {
    height: 3.25rem;
    display: flex;
}

.app-menu-bottom {
    min-height: 2.5rem;
    display: flex;
}

.teleport-bar {
    width: 100%;
    height: 0.25rem;
    background: #0076D1;
    position: relative;
    overflow: hidden;
}


    .teleport-bar > div {
        width: 20rem;
        height: 4px;
        background: #fff;
        position: absolute;
        left: 10rem;
        box-shadow: 0 0 40px 30px #fff;
        opacity: .6;
        -webkit-animation: teleport 1.8s ease-in infinite;
        animation: teleport 1.8s ease-in infinite;
        display: none;
    }


@-webkit-keyframes teleport {
    0% {
        left: -22rem;
    }

    100% {
        left: calc(100% + 2rem);
    }
}


@keyframes teleport {
    0% {
        left: -22rem;
    }

    100% {
        left: calc(100% + 2rem);
    }
}


.page-title,
.mobile-btn-large {
    float: left;
    position: relative;
}

.page-title, .mobile-btn-large {
    height: 2.5rem;
}

    /* picture separators as based on page title and toggle overall height without margins: 2rem */
    .page-title:after,
    .mobile-btn-large:after {
        display: block;
        position: absolute;
        top: .2rem;
        right: 0;
        height: 1.75rem;
        border-right: 1px solid #dee3e8;
        content: '';
    }

.mobile-btn-large {
    font-size: 1.5rem;
    color: #0076D1;
    padding: 0 1rem;
    display: none;
    position: relative;
    width: 1.28571429em;
    box-sizing: content-box;
    text-align: center;
    line-height: 2rem;
}

    a.mobile-btn-large{
        text-decoration: none;
    }

    .mobile-btn-large:disabled, .mobile-btn-large[disabled] {
        color: #BAC6D6;
    }

.page-title {
    float: left;
    padding: 0 1rem;
    font-size: 1.25rem;
    max-width: 20rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-shrink: 0;
}

.page-title:empty {
    display: none;
}

.page-title:empty + .navbar-nav {
    padding-left: .5rem;
}

.page-title.sm {
    font-size: 1.125rem;
    padding: .25rem 1.5rem;
}

.beta-icon {
    background-color:#ccc;
    border-radius:4px;
    color:#000;
    font-size:10px;
    margin-left:10px;
    padding:2px 5px;
}

.app-logo {
    max-width: 10rem;
    height: 46px;
    overflow: hidden;
    margin: 0;
    float: left;
    padding: 0 .5rem;
}


.nav {
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.dropdown-item,
.nav-link,
.navbar-nav .nav-link,
.dropdown-section {
    border: 0;
    background: 0;
    padding: 0 1rem 0.25rem;
    line-height: 2rem;
    font-size: .875rem;
    position: relative;
    -moz-appearance: none;
    -webkit-appearance: none;
    transition: background 0.2s ease, color 0.2s ease;
    border-radius: 0.25rem;
}

.dropdown-section {
    display: block;
    border-radius: 0;
    border-top: 1px solid #dee3e8;
    padding: .25rem 1rem;
}

.dropdown-item, .nav-link {
    color: #0076D1;
    cursor: pointer;
}

    .dropdown-item + .nav-link,
    .nav-link + .nav-link {
        margin-left: 0.25rem;
    }

    .dropdown-item .fa,
    .nav-link .fa,
    .dropdown-item .fo,
    .nav-link .fo {
        margin-right: 0.5rem;
        width: 1.28571429em;
        text-align: center;
    }

    .nav-link:hover {
        background: rgba(0,118,209, 0.15);
    }

    .nav-link:active,
    .navbar-nav .nav-link:active {
        background: rgba(0,118,209, 0.25);
    }

    .dropdown-item:hover, .dropdown-item:active {
        background: 0;
    }

.nav-link {
    height: 2rem;
    text-align: left;
}

.nav-item > .nav-link {
    width: 100%;
}

.nav-link .fo {
    position: relative;
    top: 1px;
}


.dropdown-item {
    padding: 0;
}

    .dropdown-item > div,
    .dropdown-item > a,
    .dropdown-item > span,
    .dropdown-item > button {
        color: #1D3E6F;
        display: block;
        padding: .25rem .75rem;
        text-decoration: none;
        height: auto;
        width: 100%;
        text-align: left;
        transition: background 0.2s ease;
        font-size: .875rem;
        line-height: 2rem;
        font-weight: 400;
    }

    .dropdown-item > button,
    .dropdown-item > a {
        -moz-appearance: none;
        appearance: none;
        -webkit-appearance: none;
        background: transparent;
        border: 0;
        color: #0076D1;
    }

        .dropdown-item > button:hover,
        .dropdown-item > a:hover {
            background: rgba(0,118,209, 0.1);
        }

    .dropdown-item .fa {
        color: #0076D1;
        margin-right: .75rem;
        margin-left: .125rem;
        text-align: center;
    }

    .dropdown-item > .nav-link {
        min-width: 100%;
        padding: .25rem .75rem;
    }


.dropdown-header {
    position: relative;
    padding: .25rem .5rem;
    border-radius: .25rem .25rem 0 0;
    font-size: 1rem;
    color: #627895;
    font-weight: bold;
    border-bottom: 1px solid #dee3e8;
    margin-bottom: .5rem;
}

    .dropdown-header + .dropdown-divider {
        margin-top: 0;
    }

.dropdown-content {
    padding: 1rem;
}

.dropdown-header + .dropdown-content {
    padding-top: 0;
}

.dropdown-divider {
    background: #dee3e8;
}

.dropdown-content {
    padding: 1rem;
}

.dropdown-header + .dropdown-content {
    padding-top: .5rem;
}

.nav-link:disabled,
.nav-link.disabled:hover,
.disabled .nav-link,
.disabled .nav-link:hover {
    color: #BAC6D6;
    cursor: not-allowed;
    background: 0 !important;
}

.nav-item {
    display: block;
    position: relative;
}



.toolbar .nav-item {
    float: left;
    flex-shrink: 0;
}

.app-menu-right {
    float: right;
    padding-right: .5rem;
    flex-shrink: 0;
}

    /* the buttons within app menu nav should not wrap into multilines */
    .app-menu-right .nav-link {
        white-space: nowrap;
    }



.searches-menu-col {
    flex: 1;
    width: 50%;
    padding: 0 0.25rem;
}

    .searches-menu-col .btn-icon {
        width: 100%;
        text-align: center;
        justify-content: center;
    }

/* Nav tabs */

.nav-tabs {
    border: 0;
    background: #fff;
}

.nav-tabs, .nav.nav-tabs {
    padding: 0;
}

    .nav-tabs.alt {
        background: #ebf1f7;
    }

    .nav-tabs .nav-link, .nav-tabs .nav-item .nav-link {
        border-radius: 0;
        height: 2.5rem;
        text-align: center;
        font-size: 1rem;
        background: transparent;
        color: #0076D1;
        padding: 0 1rem;
        cursor: pointer;
        line-height: 2.5rem;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        border: 0 solid transparent;
        border-width: 0 0 0.125rem 0;
    }

        .nav-tabs .nav-item .nav-link:hover,
        .nav-tabs .nav-item .nav-link:focus {
            color: #0076D1;
            background: transparent;
            border-radius: 0;
            outline: 0;
        }

        .nav-tabs .nav-item .nav-link:hover {
            background: rgba(0,118,209, .15);
        }

        .nav-tabs .nav-item .nav-link:focus {
            box-shadow: 0 0 0 2px rgba(0,118,209, .15);
        }

        .nav-tabs .nav-item .nav-link.active,
        .nav-tabs .nav-link.active {
            border-color: #0076D1;
            background: 0;
        }

            .nav-tabs .nav-link.active:disabled {
                border-color: transparent;
            }

    .nav-tabs .nav-item, .nav-tabs .nav-item + .nav-item {
        margin: 0;
    }




.tab-ribbon {
    background: #ebf1f7;
}


/* Compass */

.compass {
    float: left;
    padding: 0 1rem;
    margin: 0;
    height: 3rem;
    align-items: center;
    display: flex;
    flex-wrap: wrap;
}

    .compass li {
        display: inline-block;
        flex-grow: 0;
        max-width: 16rem;
        overflow-x: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

        .compass li:first-child {
            color: #627895;
        }

        .compass li + li:before {
            font-family: 'FontAwesome';
            content: '\f105';
            color: #627895;
            margin: 0 0.5rem;
            font-size: .875rem;
        }

    .compass .compass-close,
    .compass-close:before {
        display: none;
    }

    .compass li[ng-click] {
        color: #0076D1;
        cursor: pointer;
    }

    .compass li.breadcrumb-last-item {
        color: #5e5b77;
        cursor: default;
    }

.compass-close {
    margin-left: auto;
    padding: .125rem .5rem;
    color: #627895;
}

.cpf-spinner, .sort-spinner {
    color: #627895;
    -webkit-animation: fa-spin 2s infinite linear;
    animation: fa-spin 2s infinite linear;
    font-family: 'FontAwesome';
}

.app-menu-spinner {
    height: 3rem;
    float: left;
    line-height: 3rem;
}

.cpf-spinner:before, .sort-spinner:before {
    content: "\f1ce" !important;
}



.toolbar, .toolbar-section {
    padding-left: .5rem;
}

    .toolbar, .toolbar-section, .toolbar-section li {
        float: left;
        display: block;
    }

        .toolbar:after, .toolbar-section:after {
            display: block;
            clear: both;
            content: '';
        }

        .toolbar-section:not(:first-child) {
            border-left: 1px solid #dee3e8;
            padding-left: .5rem;
            margin-left: .5rem;
        }


.toolbar-toggle {
    margin: 0 .5rem .5rem;
}

.sub-toolbar-toggle {
    display: none;
}

.navbar-nav .toolbar-noitems-message {
    padding: .5rem;
    color: #768CA9;
    display: none;
}

.icon-nav {
    padding: 0.25rem 0.5rem 0;
    height: 3rem;
    display: flex;
    margin-left: auto;
}

.icon-nav .btn-group:hover {
    background: rgba(0,118,209, 0.15);
    transition: all 0.2s ease;
}

.icon-nav-btn {
    display: flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    border-radius: 0.25rem;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
    color: #0076D1;
}

    .icon-nav-btn:hover {
        background: rgba(0,118,209, 0.15);
    }

    .icon-nav-btn, .icon-nav-btn:hover, .icon-nav-btn:focus {
        text-decoration: none;
    }

.icon-nav-icon {
    font-size: 1.5rem;
    color: #0076D1;
    position: relative;
    top: .0625rem;
    float: left;
}

.icon-nav-btn .mobile-app-name {
    color: #0076D1;
    display: inline-block;
    font-size: 1rem;
    padding: 0 0 0 .5rem;
}

.icon-nav-btn > .caret {
    float: right;
    padding: .375rem 0 0 .25rem;
    margin-right: -.25rem;
}

.icon-nav .dropdown {
    min-width: 0;
    float: left;
}

    .icon-nav .dropdown.open .dd-toggle {
        background: rgba(0,118,209, 0.2);
    }

    .icon-nav .dropdown button:after {
        color: #0076D1;
        padding-left: .125rem;
    }

.icon-item-count {
    background: #627895;
    color: #fff;
    border-radius: .5rem;
    padding: 0 .25rem;
    font-size: .75rem;
    line-height: .875rem;
    font-weight: bold;
    display: inline-block;
    margin-left: .25rem;
    position: relative;
    min-width: 1.25rem;
    text-align: center;
    position: absolute;
    left: 1.5rem;
    top: .25rem;
}

.btn .icon-item-count {
    background: #fff;
    color: #0076D1;
    float: right;
    position: static;
}

.notifications-count.hiddenOnLoad {
    display: none;
}

.charm-title {
    padding-left: .5rem;
}

#preference-box {
    padding: .5rem 1rem 1rem;
}

.user-image {
    background: #0076D1;
    border-radius: 50%;
    float: left;
    padding: .25rem;
    line-height: 1rem;
    color: #fff;
    margin-right: 1rem;
}

    .user-image + h2 {
        padding: 0 1rem 0;
        margin: 0;
    }

.user-domain {
    text-overflow: ellipsis;
    white-space: pre;
    overflow: hidden;
    font-size: .875rem;
}

#user-domain-select select {
    font-size: .875rem;
    border: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding: 2px;
}

#user-display-name {
    border-radius: 0.25rem;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
    color: #0076D1;
}

    #user-display-name:hover {
        background: rgba(0,118,209, 0.15);
    }

    #user-display-name, #user-display-name:hover, #user-display-name:focus {
        text-decoration: none;
    }

#imp-switch-usermenu {
    color: #5e5b77;
    background-color: white;
    display: inline-block;
    width: 180px;
    height: 26px;
    overflow-y: hidden;
}

    #imp-switch-usermenu .title {
        color: #0076D1;
        font-size: 20px;
        font-weight: 500;
        float: none;
        position: relative;
        left: -7px;
    }

    #imp-switch-usermenu .fs-selected {
        display: inline;
    }

    #imp-switch-usermenu .sngfilter-menu {
    }

#imp-switch .sngfilter-menu {
        text-align:left;
    }

.dropvisible > .menu-dropout {
    display: block;
    cursor: default;
}

.navbar-nav {
    min-height: 2.5rem;
    border: 0;
    position: relative;
    flex-grow: 1;
    padding-bottom: .5rem;
    width: 100%;
}

    .navbar-nav.right {
        display: flex;
        flex-direction: row;
        margin-left: auto;
        flex: 0 0 auto;
        flex-wrap: nowrap;
    }

    .navbar-nav > div {
        display: flex;
        flex-wrap: wrap;
        flex-shrink: 1;
    }

    .navbar-nav:not(.right) .nav-item:last-child {
        margin-right: auto;
    }


    .navbar-nav .nav-link:hover,
    .navbar-nav .nav-item.open > .nav-link {
        background: rgba(0,118,209, 0.15);
    }


    .navbar-nav .nav-item + .nav-item,
    .navbar-nav .nav-link + .nav-link {
        margin-left: 0;
    }



    /* danger nav link button */
    .navbar-nav .nav-link.nav-danger .fa {
        color: #e73b4e;
    }

    .navbar-nav .nav-link.nav-danger:not(.disabled):not(:disabled):hover {
        background: #e73b4e;
    }

    .navbar-nav .dropdown-menu {
        background: #fff;
        border: 0;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        margin-top: 0;
        padding: 0;
        box-shadow: 0 2px 5px #444;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
        border-top: 1px solid #e1e9f5;
    }

.nav-link.disabled:hover ~ .dropdown-menu,
.nav-link:disabled:hover ~ .dropdown-menu {
    display: none;
}

.open .dropdown-menu {
    display: block;
}

.ribbon-group, .old-ribbon-group {
    display: block;
    float: left;
}

    /* ribbon groups */
    .ribbon-group > ul,
    .old-ribbon-group > ul {
        padding: 0 .25rem;
        margin: 0 .25rem;
        display: block;
        float: left;
        list-style: none;
        position: relative;
    }

        .ribbon-group > ul:before,
        .old-ribbon-group > ul:before {
            height: 1rem;
            border-left: 1px solid #dee3e8;
            width: 1px;
            content: '';
            display: block;
            position: absolute;
            top: .425rem;
            left: 0;
            z-index: 1;
        }

        .ribbon-group > ul:after,
        .ribbon-group > ul:after {
            height: 1rem;
            border-left: 1px solid #dee3e8;
            width: 1px;
            content: '';
            display: block;
            position: absolute;
            top: .425rem;
            right: 0;
            z-index: 1;
        }

    .ribbon-group:first-child ul:before,
    .ribbon-group:last-child ul:after,
    .old-ribbon-group:first-child ul:before,
    .old-ribbon-group:last-child ul:after {
        display: none;
    }


    .ribbon-group + .ribbon-group > ul,
    .old-ribbon-group + .old-ribbon-group > ul {
        padding-left: 0;
        margin-left: 0;
    }

        .ribbon-group + .ribbon-group > ul:before,
        .old-ribbon-group + .old-ribbon-group > ul:before {
            display: none;
            padding-left: 0;
        }


.dropdown-menu .nav-item {
    display: block;
    float: none;
    background: #fff;
    text-align: left;
    width: auto;
    margin: 0;
}

    .dropdown-menu .nav-item .nav-link {
        padding-right: 1.5rem;
        white-space: nowrap;
        width: auto;
        max-width: none;
    }

.navbar-nav .dropdown-menu .nav-item .nav-link .fa,
.navbar-nav .dropdown-menu .nav-item .nav-link .fo {
    color: #0076D1;
}

.navbar-nav .dropdown-menu .nav-item .nav-link:hover .fa,
.navbar-nav .dropdown-menu .nav-item .nav-link:hover .fo {
    color: #fff;
}


.dropdown-toggle::after {
    border-width: .25rem;
    margin-left: .375rem;
}

.disabled .fa,
.disabled .fo,
.nav-link.disabled,
.navbar-nav .disabled .fa,
.dropdown-item :disabled,
.dropdown-item a.disabled,
.dropdown-item a.disabled:hover,
.dropdown-item :disabled .fa,
.nav-link:disabled,
.nav-link:disabled .fa {
    color: #BAC6D6 !important;
    background: 0 !important;
    cursor: not-allowed !important
}

/* sub toolbar */

.sub-toolbar .nav {
    background: #211551;
}

.sub-toolbar .nav-item .nav-link {
    color: #FFFFFF;
    background: transparent;
    border-radius: 0;
}

    .sub-toolbar .nav-item .nav-link:not(:disabled):hover {
        background: rgba(255,255,255,0.2);
    }

    .sub-toolbar .nav-item .nav-link:disabled, .sub-toolbar .nav-item .nav-link.disabled {
        opacity: .5;
    }


.header-control,
.sub-toolbar .nav-item .nav-link-alt:not(:disabled) {
    background: rgba(0,118,209,0.5);
}

    .header-control:hover,
    .sub-toolbar .nav-item .nav-link-alt:not(:disabled):hover {
        background: rgba(0,118,209,0.75);
    }

    .header-control:active,
    .sub-toolbar .nav-item .nav-link-alt:not(:disabled):active {
        background: rgba(0,118,209,0.4);
    }

    .header-control:disabled {
        color: #627895;
        background: rgba(255,255,255,0.1);
        opacity: .5;
        cursor: not-allowed;
    }


.header-control-btn {
    padding: 0 1rem;
}


/* */

.dropdown-item .label {
    padding-top: .125rem;
    position: relative;
    top: .125rem;
}


/* ------------*/

.panel-has-sidebar {
    width: calc(100% - 18rem);
    float: right;
    position: relative;
    z-index: 1;
}

.lightbox .panel-has-sidebar {
    height: 100%;
}

.sidebar {
    height: 100%;
    position: relative;
    background: #fff;
    border-right: 1px solid #dee3e8;
    width: 18rem;
    font-size: .875rem;
    overflow-y: auto;
    flex-shrink: 0;
}

    .sidebar > h3 {
        margin-left: 1rem;
        margin-right: 1rem;
        margin-top: 0.5rem;
    }

.lightbox .sidebar {
    border-right-color: #dee3e8;
}

#secondary-nav ul:not(#mobile-compass), #secondary-nav ul:not(#mobile-compass) li,
.sidebar ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

    #secondary-nav ul:not(#mobile-compass) ul,
    .sidebar ul ul {
        padding-left: 1rem;
    }

    #secondary-nav ul:not(#mobile-compass) li a,
    .sidebar li a {
        padding: .5rem .5rem .5rem 1rem;
    }

    #secondary-nav ul:not(#mobile-compass) li a,
    .sidebar li a,
    .sidebar-item,
    .node > .node-text {
        border-left: .1875rem solid transparent;
        color: #627895;
        display: block;
        width: 100%;
        cursor: pointer;
    }

        #secondary-nav ul:not(#mobile-compass) li a:hover,
        .sidebar li a:hover,
        .sidebar-item:hover,
        .node > .node-text:hover {
            background: #e1e9f5;
        }

        #secondary-nav ul:not(#mobile-compass) li a.selected,
        #secondary-nav ul:not(#mobile-compass) li a.nested-selected,
        .sidebar li a.selected,
        .sidebar-item.selected,
        .node-text.selected-node,
        .node.selected > .node-text,
        .sidebar li a.active,
        .sidebar-item.active{
            border-color: #0076D1;
            color: #0076D1;
        }

            #secondary-nav ul:not(#mobile-compass) li a.selected:hover,
            .sidebar li a.selected:hover,
            .sidebar-item.selected:hover,
            .sidebar li a.active:hover,
            .sidebar-item.active:hover,
            .node:hover {
                cursor: default;
            }

            .sidebar li a.disabled,
            .sidebar-item.disabled,
            .sidebar-item:disabled{
                color: #BAC6D6 !important;
                background: 0 !important;
                cursor: not-allowed;
            }

.close-nav {
    float: right;
    margin: .25rem;
}

.mobile-nav-header h2 {
    padding: .75rem;
    border-bottom: 1px dotted #dee3e8;
}

.node-text:hover {
    cursor: pointer;
}

.node-container, .sidebar ul {
    font-size: .875rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

    .node-container .node-container {
        padding-left: 1rem;
    }

.node {
    position: relative;
}

.node-text {
    height: 2rem;
    line-height: 2rem;
}

.node-text, .sidebar-item {
    color: #627895;
    display: block;
    line-height: 1.125rem;
    padding: .5rem .75rem;
    overflow: hidden;
    white-space: nowrap;
    -moz-text-overflow: ellipsis;
    text-overflow: ellipsis;
    text-align: left;
}

.sidebar-item {
    padding-left: 2.25rem;
}

    .node-text:hover, .node-text:focus, .sidebar-item:hover, .sidebar-item:focus {
        background: #e1e9f5;
        color: #0076D1;
    }

.node-text.selected {
    border-left: 2px solid #0076D1;
    margin-left: -2px;
    color: #0076D1;
    background-color: #fff;
}

.node-icon {
    color: #FFA426;
    margin-right: .5rem;
}

.selected > .node-text .node-icon {
    color: #0076D1;
}

.node-collapse {
    padding-right: 1rem;
    width: 1.25rem;
}

    .node-collapse.hide-toggle:before {
        content: '' !important;
    }

.node-label-wrapper {
    padding-left: 2.25rem;
}

span.add-link .fa {
    margin-right: .5rem;
}

span.add-link-no-color {
    padding: 0.5rem 0;
    display: block;
}

span.add-link {
    padding: 0.5rem 0;
    display: block;
    color: #0076D1;
}

.search-expandable, #navigation-bar {
    display: none;
}

.navbar-nav a:hover, #secondary-nav li a:hover, #secondary-nav li a:focus {
    text-decoration: none;
}

/* Properties Panels */


.prop-panel-section {
    padding: .75rem;
}


    .prop-panel-section .form-control,
    .prop-panel-section .select-wrapper {
        width: 100%;
        max-width: none;
    }

.prop-panel-control label {
    display: inline-block;
}

.prop-panel-section .input-group [ng-include] .fa-question-circle,
.prop-panel-section .input-group [ng-include] .help-link {
    display: none;
}


/* Breadcrumbs */

.breadcrumb {
    background: 0;
    margin: 0;
    display: block;
}

#compass {
    padding: .75rem 0 0;
    float: left;
}

#mobile-compass {
    padding: 0 .75rem .75rem;
    font-size: 1rem;
}

.breadcrumb li {
    color: #627895;
}

.breadcrumb-item + .breadcrumb-item:before {
    content: '\f105';
    font-family: 'FontAwesome', 'icoMoon';
    color: #BAC6D6;
    line-height: 1rem;
}

.breadcrumb a {
    color: #0076D1;
}

/* Mobile */

.tasks-button {
    position: relative;
    top: .5rem;
}

    .tasks-button.mobile-open {
        background: #0076D1;
        color: #fff;
    }

.tasks-popout .nav-link,
.tasks-popout .dropdown-item a {
    font-size: .9375rem;
}

.tasks-popout .nav-link {
    padding: .5rem .5rem .5rem 2rem;
    white-space: nowrap;
    position: relative;
    width: 100%;
}

.tasks-popout .nav-item:not(:last-child) .nav-link {
    border-bottom: 1px solid #dee3e8;
}

.tasks-popout .fa {
    position: absolute;
    left: .25rem;
    top: .75rem;
}

.tasks-popout {
    padding: 0 .5rem;
}

    .tasks-popout .dropdown-item {
        position: relative;
    }

        .tasks-popout .dropdown-item a {
            padding: .5rem 1rem .5rem 2rem;
        }

    .tasks-popout .dropdown-menu {
        position: absolute;
        top: 0;
        left: 105%;
        padding: 0 .5rem;
        overflow-y: auto;
        overflow-x: hidden;
        white-space: nowrap;
        max-height: 16rem;
        -webkit-overflow-scrolling: touch;
    }

    .tasks-popout .nav-item {
        position: relative;
    }

/* Hidden chrome */

.chrome-hidden .app-menu {
    display: none;
}

.header {
    width: 100%;
}



/* Searches menu in Nav */

.search-item {
    padding: .5rem;
}

    .search-item + .search-item {
        border-top: 1px dotted #dee3e8;
    }

.search-item-details {
    flex: 1 1 auto;
}

    .search-item-details div {
        display: inline-block;
    }

.search-item-details, .search-item-buttons, .search-item-icons {
    padding: 0 .25rem;
}

.search-item-buttons,
.search-item-icons {
    flex: 0 0 auto;
    align-items: center;
    display: flex;
}


/*
    Zugo tables & grid views, Apps panel
*/

#search-toolbox-top {
    width: 40%;
    float: right;
}

.search-results-outer .header {
    margin: 0;
    height: 4rem;
}

.search-results-outer,
.results-container:not(table),
#results-container,
.scroll-search-container,
div[sng-zugo-delayed-request],
div[sng-zugo-triggered-request] {
    height: 100%;
}

#page > .results-container,
#page > #results,
#page > #results-container,
#page > div[sng-zugo] {
    height: 100%;
}

.results-container {
    margin-bottom: 0;
}

.search-bar .input-group {
    float: right;
    width: calc(100% - 10rem);
}

.results-count-message:empty ~ .search-bar .input-group {
    width: 100%;
}

.search-bar .input-group .input-group-addon {
    background: transparent;
    color: #BAC6D6;
    border-color: #BAC6D6;
    cursor: pointer;
}

.search-filter {
    flex-wrap: nowrap;
}

.search-filter .form-control {
    flex-shrink: 1;
}

.search-filter .input-group-addon {
    flex-shrink: 0;
    line-height: 2rem;
}

.search-filter-container .factboard-zugo {
    display: none;
}

.factboard-select .search-filter-container .factboard-zugo {
    display: inline-block;
}

.search-filter-container .factboard-zugo {
    line-height: 0;
}

.search-filter-container button {
    margin-left: 0.75rem;
}

#cancel-search-button {
    z-index: 4;
    color: #627895;
}

.results-count-message {
    width: 10rem;
    text-align: right;
    line-height: 2.4rem;
    font-size: 0.875rem;
    padding-right: 0.75rem;
    color: #627895;
    float: left;
}

.search-results {
    height: 100%;
    overflow-y: auto;
    position: relative;
    width: 100%;
}

.zugo-item {
    position: relative;
}

.panel-item {
    float: left;
}

.apps-panel {
    padding-top: 1rem;
    background: #fff;
}

.apps-panel > div {
    height: 13rem;
    float: left;
}

.apps-panel-item {
    overflow: hidden;
    position: relative;
}

.apps-panel-item:hover {
    overflow: visible;
}

.apps-panel-box {
    position: absolute;
    padding: 0.75rem;
    text-align: center;
    text-decoration: none;
    width: 13rem;
    border-radius: 2rem;
    cursor: pointer;
    position: relative;
    word-break: normal;
    display: block;
    background: 0;
    box-shadow: none;
    transition: background 0.2s ease, box-shadow 0.2s ease;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.apps-panel-box.disabled {
    cursor: default;
}

a.apps-panel-box {
    text-decoration: none;
}

.apps-panel-box:hover {
    background: #ebf1f7;
    box-shadow: 0 4px 12px rgba(26, 20, 64, 0.15);
    z-index: 5;
}

.apps-panel-box.disabled:hover {
    background: 0;
    box-shadow: none;
}

.apps-panel-box.disabled .app-name {
    color: #7d92ad;
}

.apps-panel-box.disabled .app-description {
    display: none;
}

a.apps-panel-box:focus {
    box-shadow: none;
}

a.apps-panel-box:focus:after {
    width: 100%;
    height: 11rem;
    border-radius: 2rem;
    position: absolute;
    top: 0;
    left: 0;
    border: solid 0.125rem rgba(0,118,209, 0.2);
    transition: border 0.2s ease;
    content: "";
}

a.apps-panel-box:focus:hover:after {
    height: 100%;
}

.app-icon {
    padding: 0.875rem 0.75rem 0.75rem;
    position: relative;
    height: 6.5rem;
    width: 8rem;
    background: linear-gradient(
        0deg,
        #006CC7 0%,
        #148AE5 100%
    );
    color: #fff;
    border-radius: 2rem;
    margin: 0 1.25rem 0.5rem;
}

.app-icon.app-icon-platform {
    background: linear-gradient(0deg, #140b3c 0%, #2c1c6a 100%);
}

.app-icon.app-icon-platform.disabled {
    background: 0;
    border: 1px solid #dee3e8;
}

.app-icon-platform .disabled {
    cursor: not-allowed;
}

.app-icon .fa,
.app-icon .fo {
    font-size: 3.875rem;
}

.app-icon .sub-icon {
    font-size: 1.5rem;
    position: absolute;
    bottom: 1rem;
    right: 1.25rem;
    background: #fff;
    border: 2px solid #0076D1;
    padding: 0.25rem 0.125rem;
    border-radius: 0.5rem;
    color: #0076D1;
    box-sizing: content-box;
    width: 1.28571429em;
}

.app-icon.app-folder-icon {
    width: 10rem;
    margin-top: 0.25rem;
    height: 6.25rem;
    padding-top: 0.75rem;
}

.app-icon.app-folder-icon,
.app-icon.app-folder-icon::after {
    border-radius: 0 1rem 1rem 1rem;
    background: #e1e9f5;
    color: #0076D1;
    border: 2px solid #BAC6D6;
}

.app-icon.app-folder-icon::after {
    content: "";
    display: block;
    width: 5rem;
    height: 0.75rem;
    position: absolute;
    top: -0.75rem;
    left: -2px;
    border-radius: 0.675rem 0.675rem 0 0;
    border-bottom: 0;
}

.apps-panel-box .button-icon {
    padding: 0;
    height: 4rem;
    font-size: 3.75rem;
    line-height: 3.75rem;
    display: inline-block;
    width: 5.5rem;
    position: relative;
    text-align: center;
    border-radius: 0.5rem;
    margin: 0.5rem;
}

.app-folder .button-icon:after {
    content: "";
    display: block;
    position: absolute;
    width: 2rem;
    height: 0.5rem;
    top: -0.25rem;
    left: 0.25rem;
}

.button-icon .sub-icon {
    bottom: 0;
    right: 0;
}

.app-name,
.app-description {
    line-height: 1.125rem;
    font-size: 0.8125rem;
    display: block;
}

.app-name {
    padding: 0.25rem;
    font-size: 1.25rem;
    letter-spacing: -0.03rem;
    color: #5e5b77;
}

.app-description {
    color: #627895;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.app-icon:not(.app-folder-icon) {
    margin: 0 1.5rem 0.5rem;
}

.apps-panel-box:hover .app-description {
    opacity: 1;
}

.panel .no-results {
    display: inline-block;
    padding: 2rem;
}

.compass.compass-apps {
    height: 2rem;
    font-size: 1.125rem;
}
/* #13455 */
.panel-item.zugo-item + .no-results {
    display: none;
}

.search-results-wrapper .loading-bar-container {
    text-align: center;
    padding: 10px;
}

.fa.sort-icon-asc,
.fa.sort-icon-desc {
    line-height: 1rem;
    float: right;
    color: #fff;
    padding: 0.25rem 0.5rem;
}

.fa.sort-icon-asc {
    display: none;
}

.fa.sort-icon-desc {
    display: none;
}

.sort.asc .fa.sort-icon-asc {
    display: inline-block;
}

.sort.desc .fa.sort-icon-desc {
    display: inline-block;
}

.dyno-control-wrapper .search-results-wrapper {
    height: 300px;
}

.dyno-control-wrapper .search-loader {
    position: absolute;
    left: 0;
    right: 0;
    width: auto;
}

.search-results-wrapper {
    min-height: 3rem;
    top: 4.5rem;
}

.results-page-tabular-js {
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

.page-content .search-results-wrapper,
.dyno-view .search-results-wrapper {
    position: relative;
    top: 0;
    min-height: 22rem;
}

.dyno-view-body .search-results-wrapper {
    min-height: 8rem;
}

.fixed-table-header,
.sng-fixed-table-header {
    position: relative;
    top: 0;
    left: 0;
    z-index: 3;
    width: 100%;
    overflow-x: hidden;
    table-layout: fixed;
}

.fixed-table-header thead {
    position: fixed;
}

.sng-fixed-table-header {
    position: absolute;
}

#search-loader {
    position: fixed;
    bottom: 0;
    width: 100%;
    padding: 1.5rem;
    background: #fff;
    min-height: 5.5rem;
}

#search-loader .section-controls {
    padding: 0;
}

#search-loader .buttons {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
}

/* stack */

.stack-select-all-wrapper,
.stack-item {
    padding: 0.5rem 1rem;
    cursor: pointer;
}

.stack-item {
    border-bottom: 1px solid #fff;
    background-color: #ebf1f7;
}

.stack-item.to-remove,
.stack-item.to-add {
    border-left-width: 0.1875rem;
    border-left-style: solid;
    padding-left: 0.3125rem;
}

.stack-item.to-remove {
    border-left-color: #e73b4e;
    color: #BAC6D6;
}

.stack-item.to-add {
    border-left-color: #55c339;
}

.stack-item:not(.no-results):hover {
    background-color: #fff;
}

.stack-item-title,
.stack-item-content {
    white-space: normal;
    word-break: break-all;
    word-break: break-word;
    word-wrap: break-word;
}

.stack-item-title {
    color: #0076D1;
}

.stack-item-content {
    font-size: 0.875rem;
    color: #627895;
}

.stack-item .select-wrapper select {
    padding: 0.125rem;
    height: 2rem;
}

.stack-item .select-wrapper,
.stack-item .form-control {
    height: 2rem;
}

.stack-select-all-wrapper {
    margin-bottom: 0;
}

.stack-select-all {
    margin-right: 0.75rem;
}

.stack-item-checkbox {
    float: left;
    padding-right: 0.5rem;
}

.stack-item .disabled {
    color: #627895;
}

/*.stack-item .item-selection-column {
    padding: 1.25rem .75rem .5rem 0;
    float: left;
    height: 35px;
}*/

/*.stack-row-select {
    position: relative;
    top: -0.625rem;
}*/

/*.stack-item .content {
    display: block;
}*/

.stackview-content {
    font-size: 0.875rem;
    color: #627895;
}

.stackview-title {
    display: block;
}

.stackview-additional {
    float: right;
    font-size: 0.875rem;
    color: #627895;
}

.stackview-title .stackview-child {
    margin-left: 0.5rem;
}

.stack-item.zugo-item:after {
    clear: both;
    content: "";
    display: block;
}

.stackview-icon {
    padding: 0 5px 0 0;
}

.item-selection-column label {
    margin: 0;
    line-height: 1rem;
}
/* Apps */

.loading-indication {
    padding: 3.75rem 0 0;
    text-align: center;
    width: 100%;
    color: #BAC6D6;
}

.loading-indication img {
    width: 2.6875rem;
    height: 0.6875rem;
    display: inline-block;
}

/* APPS MENU */
#apps {
    display: none;
    padding: 0.75rem;
}

#apps-search-container .panel {
    padding: calc(1% + 1rem) 5%;
}

#apps-search-container .search-container {
    height: 100%;
}

/* Preview Mode */

#preview-outer {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    display: none;
    background-color: #fff;
    border-top: 1px solid #BAC6D6;
    overflow: hidden;
    height: 50%;
}

#preview-outer .title {
    padding: 0.5rem;
    text-transform: uppercase;
    font-size: 0.875rem;
    border-bottom: 1px solid #dee3e8;
    height: 2.5rem;
}

#preview-outer .title span {
    color: #5e5b77;
}

#preview-outer .title span:not(.fa) {
    font-weight: bold;
}

#preview-outer .title .close {
    position: absolute;
    cursor: pointer;
    font-size: 1rem;
    top: 0.5rem;
    right: 0.5rem;
    text-shadow: none;
    color: #5e5b77;
    opacity: 1;
}

#preview-outer #preview-spinner {
    padding: 0.5rem;
    font-size: 0.875rem;
    color: #627895;
    text-align: center;
}

#preview-outer iframe {
    display: none;
    width: 100%;
    height: 100%;
    border: 0;
    padding-bottom: 2.5rem;
}

.search-results.split-view {
    overflow-y: scroll;
    margin-right: 0;
}

.no-results {
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
}

/* Custom Case Number */

.ccn-label {
    padding: 0.25rem 0.5rem;
    border: 1px solid #BAC6D6;
    background: #dee3e8;
    font-size: 0.875rem;
    font-weight: bold;
    border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    -webkit-border-radius: 0.25rem;
    margin: 0 0.5rem;
}

.ccn-label:hover,
.ccn-label.selected {
    border-color: #0076D1;
}

.ccn-label.selected {
    background: #fff;
}

.ccn-label.empty {
    padding: 0.25rem 2rem;
    border-style: dashed;
}

.ccn-add {
    color: #627895;
}

.ccn-add:hover {
    cursor: pointer;
    color: #0076D1;
}

.ccn-type {
    display: block;
    padding: 0.5rem 0.25rem;
    float: left;
}

.ccn-type .ccn-label {
    margin: 0;
}

.ccn-pad {
    padding-bottom: 1rem;
}

#addNewRow {
    color: #0076D1;
    cursor: pointer;
}

.myTdInput {
    color: #5e5b77;
}

/* Zugo Angular styles */

.zugo-header {
    width: 100%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    position: relative;
    z-index: 1;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

.zugo-hide-title {
    visibility: hidden;
}

.zugo-result-count-message {
    font-size: 0.875rem;
    color: #627895;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.filter-by-search .fa-remove,
.cancel-search {
    padding: 0.5rem;
    margin-left: -1.5rem;
    color: #627895;
    cursor: pointer;
}

.filter-by-search .fa-remove:hover,
.cancel-search:hover {
    color: #0076D1;
}

table.table.table-fixed-header {
    margin-bottom: 0;
}
/* track */

#track-lite-close {
    position: absolute;
    top: 0.625rem;
    right: 0.625rem;
}

.track-loader {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    text-align: center;
    height: 100%;
    padding: 0;
}

#track-lite .table th,
#track-lite .table td {
    padding: 0.5rem;
}

#track-lite .table {
    margin-bottom: 0;
    border: 0;
}

#track-lite tr:last-child,
#track-lite tr:last-child td {
    border-bottom: 0;
}

#track-lite h3 {
    padding: 0.5rem;
}

.track-close {
    position: absolute;
    top: 0.625rem;
    right: 0.625rem;
    cursor: pointer;
}

.track-icon {
    font-size: 20px;
    color: #0076D1;
}

.pop-track-button,
.track-icon {
    font: normal normal normal 14px/1 FontAwesome;
}

.pop-track-wrapper {
    position: absolute;
    z-index: 3;
    top: 10%;
    left: 10%;
    width: 80%;
    height: 60%;
    border: 1px solid #777;
    background: #fff;
}

.pop-track-container {
    position: relative;
    width: 100%;
    height: 100%;
}

.pop-track-header {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 35px;
}

.pop-track-header h3 {
    padding: 0.5rem;
}

.pop-track-content {
    position: absolute;
    left: 0;
    right: 0;
    top: 36px;
    bottom: 0;
}

.pop-track-content iframe,
.zugo-pop-track-content iframe {
    height: 100%;
    width: 100%;
    border-top: 1px solid #777;
    border-bottom: 0;
    border-left: 0;
    border-right: 0;
    background: #ffffff;
}

.sng-pop-track-column {
    text-align: center;
}

.pop-track-button {
    padding: 0.37rem 0.5rem;
    width: 1.28571429em;
    text-align: center;
    border-radius: 0.25rem;
    display: inline-block;
    box-sizing: content-box;
    color: #0076D1;
    cursor: pointer;
}

.pop-track-button:hover {
    background: rgba(0,118,209, 0.15);
}

.zugo-tracks-wrapper {
    position: fixed;
    width: 300px;
    background: #fff;
    border: 1px solid #BAC6D6;
    z-index: 15;
    border-radius: 0.25rem;
    box-shadow: 0.25rem 0.25rem 0.25rem 0px rgb(0 0 0 / 15%);
    padding-bottom: 0.2rem;
}

.zugo-tracks-wrapper h3 {
    padding: 0.5rem;
    margin-bottom: 0;
}

.zugo-track-row {
    padding: 0.25rem 0.5rem;
    cursor: pointer;
}

.sng-pop-track-column {
    width: 50px;
}

.zugo-pop-tracks-wrapper {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 50%;
    background: #fff;
}

.zugo-pop-tracks-wrapper:after {
    display: block;
    clear: both;
    content: "";
}

.zugo-results-split-top {
    height: 40%;
}

.zugo-pop-track-wrapper {
    position: relative;
    height: 100%;
    border: 1px solid #BAC6D6;
    float: left;
}

.zugo-pop-track-content {
    position: absolute;
    left: 0;
    right: 0;
    top: 36px;
    bottom: 0;
    overflow-y: hidden;
}

.zugo-pop-track-container {
    position: relative;
    height: 100%;
}

.zugo-track-icon {
    color: #627895;
    margin-right: 0.5rem;
}

.sng-results-container table.grid.table {
    margin-bottom: 0;
}

.simple-grid-input {
    position: relative;
    padding-right: 8.5rem;
}

.simple-grid-input .form-control {
    max-width: none;
}

.simple-grid-input button {
    position: absolute;
    top: 0;
    right: 0;
    width: 8rem;
}

.filteredselect-full-page .filtered-select {
    height: 100%;
}

.filteredselect-full-page {
    height: calc(100vh - 10rem);
}

.filteredselect-full-page .section {
    height: 100%;
}

.filteredselect-full-page .section-content {
    height: calc(100% - 3rem);
}

.filteredselect-full-page .search-results-wrapper {
    min-height: 0;
}

.filteredselect-full-page .search-results {
    position: relative;
}

.filteredselect-full-page .sngfilter-existing {
    max-height: none;
    margin: 0;
    margin-top: -1px;
    height: calc(100% - 4rem);
}

.filteredselect-full-page .sngfilter {
    margin-bottom: 0.75rem;
}

.filteredselect-full-page .search-results-outer {
    height: 100%;
}
/*
.filteredselect-full-page {
    height: calc(100vh - 5rem);
}

#user-groups-grid,
#user-location-groups-grid {
    height: 100%;
}

.filteredselect-full-page .section {
    height: 100%;
}

.filteredselect-full-page .section-content {
    height: calc(100% - 2rem);
}

.filteredselect-full-page .sngfilter-existing {
    height: 100%;
}
    */

/* new search container styles */

.search-container {
    position: relative;
    height: 100%;
}

.search-container.has-search-header {
    height: calc(100% - 4.5rem);
}

@media (max-width: 576px) {
	.zugobodywithtotals {
		padding-bottom: 0;
	}
}

@media (min-width: 800px) {
	.zugobodywithtotals {
		padding-bottom: 40px;
	}

	.zugo-total-mobile.custom-d-md-none {
		display: none !important;
	}

	.custom-d-md-block {
		display: block !important;
	}
}

.zugo-total {
	background-color: #BAC6D6;
	position: fixed;
	bottom: 0;
	left: 0;
}

#zugoTotalRowTbl.table {
	margin: 0px;
}

.zugo-total #zugoTotalRowTbl.table thead {
	background-color: transparent;
}

.zugobodywithtotals {
    padding-bottom: 41.5px;
}

@media (max-width: 576px) {
    .zugobodywithtotals {
        padding-bottom: 0;
    }
}

.zugo-total {
    background-color: #BAC6D6;
    position: fixed;
    bottom: 0;
}

.zugo-total-mobile {
    background-color: #e1e9f5;
    padding: 8px;
    padding-bottom: 3.5rem;
}

.zugo-total-mobile-span {
    color: #212529;
    width: 9rem;
    font-size: 14px;
}

.hiddenTotal {
    color: #627895;
}

.data-grid-container {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.search-container,
div[sng-zugo],
.zugo-container,
.zugo-body {
    height: 100%;
}

.zugo-container {
    display: flex;
    flex-direction: column;
}

.zugo-body-container {
    flex: 1 1 auto;
    min-height: 0;
}


.zugo-header ~ .zugo-body {
    flex-grow: 1;
    overflow-y: auto;
    position: relative;
    overflow-x: hidden;
}

/*
    Stacking required for fixed header feature in zugo grids:
    - body
        |- container within body for tables
           | - table with fixed header
    Some apps are overriding these stacking
    via cascade e.g. files app, so this has increased specificity
*/
div[sng-zugo] .zugo-body {
    position: relative;
}

div[sng-zugo] .fixed-table-container {
    height: 100%;
    position: static;
}

div[sng-zugo] .sng-fixed-table-header {
    position: absolute;
    z-index: 1;
}

.fixed-table-container table {
    margin: 0;
}

.fixed-table-head,
.fixed-table-body,
.fixed-table-head thead,
.fixed-table-body tbody {
    width: 100%;
}

.fixed-table-head {
    height: 2.5rem;
}

.fixed-table-head thead th {
    border: 0;
}

.fixed-table-body {
    height: calc(100% - 2.5rem);
    overflow-y: auto;
}

.search-container > .fixed-table-head {
    position: absolute;
    top: 0;
    width: auto;
}

.search-container > .fixed-table-head-no-controls {
    position: absolute;
    top: 0;
    width: auto;
}

.sng-results-container {
    height: 100%;
    overflow-y: auto;
}

.zugo-header h1 {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.search-container .table th:not(:last-child),
.zugo-container .table th:not(:last-child) {
    border-right: 1px dotted #352965;
    border-right: 1px dotted rgba(255, 255, 255, 0.25);
}

.search-container .table td:not(:last-child),
.zugo-container .table td:not(:last-child) {
    border-right: 1px dotted #dee3e8;
}

.zugo-title {
    flex-basis: 50%;
}

.zugo-title-header {
    display: inline-block;
    vertical-align: middle;
    padding-bottom: 0 !important;
}

.zugo-title,
.zugo-header .search-filter-container {
    flex: 1 1 auto;
    padding: 1rem;
}

.zugo-header .search-filter-container {
    align-items: center;
    justify-content: center;
    display: flex;
    max-width: 40rem;
}

.zugo-title h1 {
    margin: 0;
    padding: 0 0 0.25rem;
}

.zugo-description {
    color: #627895;
}

.zugo-description--block {
    display: block;
}

.zugo-body th .fa-sort,
.zugo-body th .fa-sort-asc,
.zugo-body th .fa-sort-desc {
    margin-left: 0.5rem;
    line-height: 1.5rem;
    color: #fff;
    opacity: 0.5;
}

/**
    sng-zugo-tracks component
    Lists smart tracks links as actual links with <a> tags
*/
sng-zugo-tracks {
    display: block;
}

sng-zugo-tracks a {
    display: flex;
    align-items: center;
    color: #5e5b77;
}

sng-zugo-tracks a:focus,
sng-zugo-tracks a:hover {
    box-shadow: none;
    outline: none;
    text-decoration: none;
}

.zugo-row-factboard-selected {
    background-color: #d1dcce !important;
}

.zugo-row-factboard-selected > td {
    background-color: #d1dcce !important;
}

.zugo-search-description {
    display: inline-block;
    color: #0076D1;
    vertical-align: middle;
    font-size: small;
    margin-left: 0.25rem;
}

.zugo-title-wrapper {
    padding-bottom: 0.25rem;
}

.variable-help-text {
    color: #55c339;
}

/*
    DynoView, Autocomplete, DatePicker
    Upload Manager
*/

/* Structure and layout */

[dynoview] {
    width: 100%;
    display: block;
}

.dyno-view {
    position: relative;
    display: block;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.dyno-row .span_for_layer {
    position: fixed;
    z-index: 99;
}

.h-100 .dyno-view {
    height: 100%;
}

.dyno-view-body {
    width: 100%;
    padding: 1rem;
    margin: 0 auto;
    background: #e1e9f5;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

    .dyno-view-body .grid-section .col {
        padding-bottom: 1rem;
    }

.dyno-control.section,
.dyno-control .section-content {
    margin: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.dynorow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 100%;
}

    .dynorow:only-child {
        min-width: 100%;
    }

    .dynorow > .grid-section {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        max-width: calc(100% + 1rem); /* account for negative margins of row */
    }

.dyno-control .section-content {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    max-width: 100%;
}

    .dyno-control .section-content .dynorow:only-child {
        -webkit-box-flex: 1;
        -ms-flex: 1 0 auto;
        flex: 1 0 auto;
    }

.dynorow:last-child > .grid-section {
    margin-bottom: 0;
}


.row-separator {
    display: block;
    clear: both;
}

dynoview .grid-section,
div[dynoview] .grid-section {
    margin-bottom: 1rem;
}

/* Headers and navigation */

.dyno-view > .header {
    z-index: 3;
    -webkit-backface-visibility: hidden;
    flex-shrink: 0;
}

.header ~ .dyno-view-body {
    overflow-y: auto;
}

.lightbox .dyno-view-body {
    background: #fff;
}


.notification-body > .dyno-view > .header {
    position: static;
}


/* Attachments */

.dynoview-attachments {
    width: 100%;
    padding: 0.25rem 1rem;
    margin: 0 auto;
    z-index: 2;
    background-color: #e1e9f5;
    border: 1px solid #dee3e8;
    border-radius: .25rem;
    display: none;
}

.dynoview-attachments-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}


.dyno-view #attachments .attachment {
    padding: 0 1rem;
}

.dyno-view #attachments .filename {
    font-size: .875rem;
}

.dyno-view #attachments .remove:hover {
    cursor: pointer;
    color: #0076D1;
}

/* Generic controls */

.dyno-control {
    padding: .75rem;
    min-height: 100%;
}

    .dyno-control.lightbox {
        min-height: 0;
    }

    .dyno-control.chart {
        min-height: 8rem;
    }

    .dyno-control.nav-item,
    .dyno-control.referenced-dynoview,
    .dyno-control.dyno-geo-map {
        padding: 0;
    }

    .dyno-control.nav-item,
    .dyno-control.referenced-dynoview {
        border: 0;
    }

    .dyno-control.referenced-dynoview {
        background: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .dyno-control label.inline {
        display: inline-block;
    }

        .dyno-control label.inline:not(:last-of-type) {
            margin-right: .5rem;
        }

    .dyno-control textarea {
        resize: both;
    }


.dyno-control-hidden {
    display: none;
}

.dyno-control-center {
    text-align: center;
}

.dyno-control-right {
    text-align: right;
}

.section-content .dyno-control:not(:last-child) {
    margin-bottom: .5rem;
}

.form-value {
    padding: .5rem;
    border: 1px solid #dee3e8;
    border-radius: .25rem;
    font-size: 1rem;
    display: block;
    min-height: 2.625rem;
}


.help-link, .help-link-custom {
    color: #BAC6D6;
    padding-left: .25rem;
}

    .help-link:hover, .help-link-custom:hover {
        text-decoration: none;
        color: #0076D1;
    }

/* Deprecated dynoview styles */

.field-validation-valid {
    visibility: hidden;
}

.error-icon,
.field-validation-error {
    background: transparent;
    border: 0;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    color: #fb9012;
    margin-right: .25rem;
}

.field-validation-error {
    visibility: visible;
}

    .field-validation-error:before,
    .error-icon:before {
        content: '\f06a';
        font-family: 'FontAwesome';
        font-size: .875rem;
    }

.checkbox input[type=checkbox],
.checkbox-inline input[type=checkbox],
.radio input[type=radio],
.radio-inline input[type=radio] {
    margin-right: .25rem;
}

.radio-inline label,
.checkbox-inline label {
    display: inline-block;
}

    .radio-inline label:not(:last-child),
    .checkbox-inline label:not(:last-child) {
        margin-right: 2.4rem;
    }

.currency-box {
    border-collapse: collapse;
}

    .currency-box .input-group-addon {
        padding: 1px;
    }

    .currency-box .select-wrapper {
        width: 100%;
        border-right: 0;
        border-radius: .25rem 0 0 .25rem;
        height: 2.1875rem;
    }

    .currency-box .input-group-addon {
        padding: 0;
        background: transparent;
        border: 0;
    }

    .currency-box input {
        border-radius: 0 .25rem .25rem 0;
        min-width: 15ex;
    }

    .currency-box select {
        position: relative;
        width: auto;
        border: 0;
    }

    .currency-box.disabled .select-wrapper {
        background: 0;
        border: 0;
        height: 2.125rem;
    }

/* Datetime */

.datetime {
    display: inline-block;
}

.date-picker {
    max-width: 16rem;
    width: 100%;
    display: inline-block;
}

.time-picker {
    display: inline-block;
}

    .time-picker.is-12-hour {
        min-width: 10.75rem;
    }

    .time-picker.is-24-hour {
        min-width: 6.75rem;
    }

    .date-picker .select-wrapper,
    .time-picker .select-wrapper {
        width: auto;
        display: inline-block;
    }

.date-picker-calendar-button {
    color: #627895;
}

    .date-picker-calendar-button:hover {
        color: #0076D1;
        cursor: pointer;
    }

/* date dropdown */

.date-dropdown,
.datetime-dropdown {
    position: relative;
}

.open.date-dropdown .dd-menu,
.open.datetime-dropdown .dd-menu {
    width: 22rem;
    max-height: none;
}

.date-dropdown .date-picker .select-wrapper,
.date-dropdown .time-picker .select-wrapper,
.datetime-dropdown .date-picker .select-wrapper,
.datetime-dropdown .time-picker .select-wrapper {
    float: left;
}

    .date-dropdown .date-picker .select-wrapper + .select-wrapper,
    .date-dropdown .time-picker .select-wrapper + .select-wrapper,
    .datetime-dropdown .date-picker .select-wrapper + .select-wrapper,
    .datetime-dropdown .time-picker .select-wrapper + .select-wrapper {
        margin-left: .125rem
    }

.datetime-dropdown .datetime-now {
    float: left;
    margin-bottom: .5em;
    margin-left: .25rem
}

.date-dropdown .date-picker,
.datetime-dropdown .date-picker {
    margin-right: .5rem
}

.date-dropdown.open .select-wrapper,
.datetime-dropdown.open .select-wrapper {
    text-transform: capitalize;
    width: auto;
    margin-right: .25rem;
}

.datetime-section {
    display: inline-block;
}

.date-dropdown .datetime-section,
.datetime-dropdown .datetime-section {
    float: left;
    text-align: left;
}

    .date-dropdown .datetime-section:not(:last-child),
    .datetime-dropdown .datetime-section:not(:last-child) {
        margin-right: 1rem;
    }

    .date-dropdown .datetime-section .timezone .datetime-dropdown .datetime-section .timezone {
        margin-left: .5rem;
    }

.date-dropdown .date-picker,
.date-dropdown .time-picker,
.datetime-dropdown .date-picker,
.datetime-dropdown .time-picker {
    margin-bottom: 0;
    min-width: auto;
    max-width: none;
    width: auto;
}

.date-dropdown .ui-datepicker,
.datetime-dropdown .ui-datepicker {
    margin: 0 auto;
}

    .date-dropdown .ui-datepicker.ui-datepicker-inline,
    .datetime-dropdown .ui-datepicker.ui-datepicker-inline {
        width: 100%;
    }

.date-dropdown .ui-datepicker-title,
.datetime-dropdown .ui-datepicker-title {
    text-align: center;
}


.datetime-dropdown .dropdown-menu {
    padding: .5rem 1rem;
    border: 1px solid #0076D1;
    box-shadow: 0 2px 5px 2px rgba(0,0,0,0.15);
}

.datetime-dropdown .ui-datepicker {
    border: 1px solid #e1e9f5;
    padding: .5rem;
    box-shadow: none;
}

/* these are pure CSS specificity hacks to win *forms* general restyle rules
    that unfortunately are inlined after these more specific rules for dynoview controls
*/
.date-dropdown.date-dropdown td.ui-datepicker-other-month a.ui-state-default,
.datetime-dropdown.datetime-dropdown td.ui-datepicker-other-month a.ui-state-default {
    color: #5e5b77;
}

.datetime-dropdown .ui-datepicker-calendar tr,
.date-dropdown .ui-datepicker-calendar tr {
    background: transparent;
}

.date-dropdown .ui-datepicker .select-wrapper,
.date-dropdown .ui-datepicker .ui-datepicker-month,
.date-dropdown .ui-datepicker .ui-datepicker-year,
.datetime-dropdown .ui-datepicker .select-wrapper,
.datetime-dropdown .ui-datepicker .ui-datepicker-month,
.datetime-dropdown .ui-datepicker .ui-datepicker-year {
    min-width: 5rem;
    width: auto;
}

    /* add some module styles back */
    .date-dropdown .ui-datepicker .select-wrapper:first-of-type,
    .datetime-dropdown .ui-datepicker .select-wrapper:first-of-type {
        margin-left: auto;
    }

    .date-dropdown .ui-datepicker .select-wrapper:last-of-type,
    .datetime-dropdown .ui-datepicker .select-wrapper:last-of-type {
        margin-right: auto;
    }

    .date-dropdown .ui-datepicker .select-wrapper .date-dropdown .ui-datepicker .ui-datepicker-month,
    .datetime-dropdown .ui-datepicker .ui-datepicker-month {
        -ms-flex-preferred-size: 13ex;
        flex-basis: 13ex;
    }

.date-dropdown .ui-datepicker .ui-datepicker-month,
.datetime-dropdown .ui-datepicker .ui-datepicker-month {
    -ms-flex-preferred-size: 8ex;
    flex-basis: 8ex;
}


.date-dropdown .ui-datepicker-title,
.datetime-dropdown .ui-datepicker-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    text-align: center;
}

/* sng-date control style fix with CSS for double arrows problem in specific case */
[sng-date] select.date-picker-part.ng-hide + span {
    display: none;
}


@media (min-width: 460px) {

    .date-dropdown .ui-datepicker .ui-datepicker-month,
    .datetime-dropdown .ui-datepicker .ui-datepicker-month {
        /* min-width taken from datetime control */
        min-width: 13ex;
    }

    .date-dropdown .ui-datepicker .ui-datepicker-year,
    .datetime-dropdown .ui-datepicker .ui-datepicker-year {
        /* min width taken from datetime control */
        min-width: 8ex;
    }
}


ul.options {
    padding: 0;
    margin-bottom: 0;
    display: flex;
    flex-wrap: wrap;
    margin: 0 -.5rem;
}

    ul.options.vertical {
        display: block;
    }

    ul.options li {
        padding: 0 .5rem .5rem;
    }

    ul.options.vertical li {
        padding: 0 .5rem;
    }

.options li {
    display: block;
}

.options label {
    display: inline-block;
}

/* Tabbed Section */

.dyno-control.tabbed-section {
    padding: 0;
}

.dyno-control.tabbed-window,
.dyno-control.section {
    padding: 0;
}

.dyno-control .nav.nav-tabs {
    border-radius: .125rem .125rem 0 0;
}

.tabbed-section .nav-tabs .nav-link {
    padding: .75rem 1.25rem;
}

    .tabbed-section .nav-tabs .nav-link.invalid {
        color: #fb9012;
    }

    .tabbed-section .nav-tabs .nav-link.active.invalid {
        border-color: #fb9012;
    }

    .tabbed-section .nav-tabs .nav-link.invalid:after {
        font-family: 'FontAwesome';
        content: '\f06a';
        display: inline-block;
        color: #fb9012;
    }

.nav.nav-tabs .nav-link div {
    display: inline-block;
}

.dyno-control.tabbed-window {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    overflow: hidden;
}

.section-content .dyno-control.tabbed-window {
    border: 1px solid #dee3e8;
}


.tabbed-window-container, .tabbed-window-content, .tabbed-window-content > div {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    max-width: 100%;
}

    .tabbed-window-content > div,
    .tabbed-window-container {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

.tabbed-window-content {
    padding: .75rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    max-width: 100%;
}

    .tabbed-window-content.hide {
        display: none;
    }

.nav.nav-tabs.vertical {
    float: left;
    width: 20%;
    border-right: 1px solid #dee3e8;
    border-bottom: 0;
}

.tabbed-window-content-container.vertical {
    width: 80%;
    float: right;
}

.nav.nav-tabs.vertical .nav-item {
    width: 100%;
    float: none;
}

.nav.nav-tabs.vertical .nav-link {
    border-bottom: 0;
    border-radius: 0;
    border-left-width: 3px;
    border-left-style: solid;
}

.nav-tabs.vertical .nav-item + .nav-item {
    margin-left: 0;
}


.subsection-title {
    text-align: left;
    line-height: 1rem;
    margin: 0 0 1rem;
    margin-right: 1rem;
    position: relative;
}

    .subsection-title:before {
        width: 100%;
        border-bottom: 2px dotted #627895;
        content: '';
        display: block;
        top: 50%;
        position: absolute;
        z-index: 0;
    }


    .subsection-title span {
        background: #fff;
        padding-right: 10px;
        color: #627895;
        font-size: .875rem;
        font-weight: bold;
        z-index: 1;
        position: relative;
        display: inline-block;
        max-width: 90%;
    }

.section-content .sliding-window-body .section-content,
.sliding-window-body .section-content {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 1rem;
}

.section-content .paged-window {
    margin: 0 -.75rem;
}

.section-controls {
    font-size: .875rem;
    padding: 0 1rem;
    line-height: 2rem;
    background: #fff;
    position: relative;
    -webkit-box-shadow: 0 0 0 transparent;
    box-shadow: 0 0 0 transparent;
    -webkit-transition: -webkit-box-shadow 0.3s ease;
    transition: -webkit-box-shadow 0.3s ease;
    transition: box-shadow 0.3s ease;
    transition: box-shadow 0.3s ease, -webkit-box-shadow 0.3s ease;
}

    .section-controls .title-wrapper {
        padding: 1rem;
        font-size: 1.125rem;
        line-height: 2rem;
        color: #5e5b77;
    }

    .section-controls .section-controls-buttons,
    .section-controls .paging {
        padding: 1rem;
    }

        .section-controls .paging > span {
            padding-left: 1rem;
            color: #627895;
        }

.section-controls-buttons {
    text-align: right;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

.section-controls:after {
    display: block;
    content: '';
    width: calc(100% - 2rem);
    position: absolute;
    bottom: 0;
    left: 1rem;
    border-bottom: 1px dotted #BAC6D6;
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
}

.section-controls.sticky-bar-fixed {
    -webkit-box-shadow: 0 2px 4px rgba(0,0,0,0.15);
    box-shadow: 0 2px 4px rgba(0,0,0,0.15);
}

    .section-controls.sticky-bar-fixed:after {
        width: 100%;
        left: 0;
        border-bottom-style: solid;
    }

/* Toggle section */
.togglesection-disabled .section-content {
    display: none;
}

.togglesection-disabled .section-title {
    border-radius: .25rem;
}

.toggle-section.disabled .toggle-switch > div:before {
    left: 0.1875rem;
    opacity: .75;
}



/* ROW TITLES */

/* Horizontal rule*/

.dyno-control.dyno-hr {
    padding: 0;
}

.dyno-hr .rowtitle {
    margin: .5rem 0;
}


.rowtitle {
    text-align: left;
    border-bottom: 2px dotted #BAC6D6;
    line-height: 0.1em;
    margin: 1rem 0;
}

    .rowtitle span {
        background: #fff;
        padding-right: 10px;
        color: #627895;
        font-size: 1rem;
        font-weight: bold;
    }

.rowtitle-help button {
    padding: 0;
    margin: 0;
    line-height: 0;
    display: inline;
}

.rowtitle-help {
    padding: 0 .5rem;
    margin-left: -.5rem;
}

.rowtitle.rowtitle-divider {
    margin: 2rem 0;
}
/* END ROW TITLES */

.required,
.field-validation-error {
    color: #fb9012;
}

.required {
    font-size: .875rem;
    cursor: default;
    font-weight: bold;
    line-height: .875rem;
}

.dyno-control.dyno-critical {
    border-color: #e73b4e;
}

.dyno-critical:after {
    content: 'Critical';
    display: block;
    position: absolute;
    top: .25rem;
    right: .25rem;
    background: #e73b4e;
    color: #fff;
    font-size: .875rem;
    font-weight: bold;
    padding: 0 .25rem;
    border-radius: .125rem;
}

.dyno-control-right.dyno-critical:after {
    right: auto;
    left: .25rem;
}

.table-title {
    padding: .25rem .5rem;
    font-size: .875rem;
    background: #dee3e8;
    font-weight: bold;
}

.dyno-control.table {
    padding: 0;
}

    .dyno-control.table th {
        border-top: 0;
    }

.dyno-table .dyno-control {
    font-size: 1rem;
}

.dyno-table-scroller {
    max-width: 100%;
    overflow-x: auto;
}

    .dyno-table-scroller th {
        white-space: nowrap;
    }

    .dyno-table-scroller td {
        padding: 0;
    }

    .dyno-table-scroller .dyno-control {
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
        background: 0;
    }

.dyno-table-totals-row input,
.dyno-table-row-total {
    border: 0;
    background: 0;
    color: #5e5b77;
}

    .dyno-table-row-total td {
        font-size: 0.75rem;
        padding: .65rem;
        font-weight: bold;
        text-align: right;
        text-transform: uppercase;
    }

.section-content .dyno-control,
.tabbed-window-content .dyno-control,
.notification-dyno-view .dyno-control {
    padding: 0;
    background: 0;
    border-width: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.section-content .critical,
.tabbed-window-content .critical,
.section-content .section,
.tabbed-window-content .section {
    border-width: 1px;
}

.section-content .section,
.tabbed-window-content .section {
    border-color: #dee3e8;
    padding: 0;
}

.section-content .section-title ~ .section-content {
    border: 0;
}

.section-content .section-title {
    padding: 0 0 .5rem;
    font-weight: 600;
    background: 0;
    color: #627895;
}

.section-content .section-content {
    padding: 0;
}

.dyno-view-reference-div > .grid-section > .col:first-child {
    padding-left: 0;
}

.dyno-view-reference-div > .grid-section > .col:last-child {
    padding-right: 0;
}

.dyno-control#divider {
    padding: 0;
    border: 0;
}

.dyno-table .remove-row {
    margin: .5rem;
    margin-left: 0;
    border: 0;
}

/* DynoView Lightboxes */

.dyno-lightbox-content .dyno-control {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.dyno-lightbox-content-row > .grid-section {
    margin: 0;
}

    .dyno-lightbox-content-row > .grid-section > .col {
        padding: 0;
    }

/* Charts */

.dyno-control.chart {
    margin-bottom: 0;
}

/********** Transaction Summary Control ***********/
.transaction-summary .dyno-control {
    border-color: transparent;
}

    .transaction-summary .dyno-control.chart label {
        text-align: center;
    }

.tx-summary-filter-container {
    margin-top: 0.875rem;
    margin-bottom: 0.857rem;
}

.tx-summary-filter {
    display: inline-block;
}

    .tx-summary-filter div {
        display: inline-block;
    }

.tx-summary-all-tx-btn {
}

/* Incident details */

.incident-details-top {
    margin: 0;
    display: block;
    width: 100%;
    position: relative;
    padding: 0.875rem;
    border-bottom: 1px solid #BAC6D6;
    overflow: hidden;
}

.incident-number {
    font-size: 1.2rem;
    padding-bottom: .5rem;
    color: #0076D1;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

#incident-case-details span {
    font-weight: bold;
    word-break: break-word;
}

#incident-case-details {
}

.case-detail-value {
    position: relative;
    font-weight: bold;
    left: .2rem;
    word-break: break-word;
}

.case-detail-title {
    width: 7.5rem;
    font-weight: bold;
    display: inline-block;
    color: #627895;
}


/* SRA dashboard styles */

.dyno-control.hero-section,
.dyno-control.hero-section .section-content,
#decksection,
#decksection .section-content {
    padding: 0;
    border: 0;
    background: transparent;
}

.dyno-control.deck {
    max-width: 26rem;
    min-height: 12rem;
}

    .dyno-control.deck .dyno-control,
    .dyno-control.deck {
        padding: 0;
    }

.dyno-deck-header,
.dyno-deck-footer {
    padding: 1rem;
}

.dyno-deck-header {
    padding-bottom: .75rem;
}

    .dyno-deck-header:after {
        content: '';
        display: block;
        clear: both;
    }

.dyno-deck-footer {
    padding-top: .75rem;
}

.dyno-deck-title {
    text-transform: uppercase;
    font-size: 1rem;
    margin-bottom: 10px;
    float: left;
}

.dyno-deck-icon {
    float: right;
    font-size: 1.25rem;
    width: 1.25rem;
    text-align: center;
    cursor: pointer;
    position: absolute;
    top: .5rem;
    right: .5rem;
}

.severity-high,
.severity-medium,
.severity-low {
    color: #fff;
}

.severity-high,
.section-content .severity-high {
    background: #e73b4e;
}

.severity-medium,
.section-content .severity-medium {
    background: #fb9012;
}

.severity-low,
.section-content .severity-low {
    background: #55c339;
}

.value-map-circle {
    left: -50px;
    position: absolute;
    font-size: 1rem;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    color: white;
    text-align: center;
    opacity: 0.9;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: all .2s cubic-bezier(.4, 0, .2, 1);
    transition: all .2s cubic-bezier(.4, 0, .2, 1);
    border: 2px solid #e8e8e8;
}

    .value-map-circle > div {
        color: #e8e8e8;
    }

    .value-map-circle:hover {
        opacity: 0.95;
        cursor: pointer;
    }

    .value-map-circle.severity-neutral {
        background: #c00000;
    }

.value-map-previous-level {
    display: none;
    position: absolute;
    top: 15px;
    left: 15px;
    font-family: 'icoMoon';
    font-size: 19px;
    /* background: red; */
    padding: 9px;
    cursor: pointer;
    background-color: #ffffff;
    color: rgb(41, 108, 128);
    border-radius: 1px;
    -webkit-box-shadow: 1px 1px 5px -1px rgba(124, 124, 124, 0.75);
    box-shadow: 1px 1px 5px -1px rgba(124, 124, 124, 0.75);
    -webkit-transition: all 0.15s ease;
    transition: all 0.15s ease;
}

    .value-map-previous-level:hover {
        padding-top: 7px;
        padding-bottom: 11px;
        -webkit-transition: all 0.15s ease;
        transition: all 0.15s ease;
    }

.value-map-level-text {
    position: absolute;
    top: 15px;
    right: 15px;
    padding: 9px 10px;
    background: white;
    color: rgb(41, 108, 128);
    font-weight: bold;
    cursor: default;
}

.value-map-label {
    position: absolute;
    top: 0px;
    right: 0px;
    left: 0px;
    /*display: flex;*/
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
}

.value-map-label-text {
    position: absolute;
    background: rgba(124, 124, 124, 0.75);
    color: white;
    font-weight: bold;
    font-size: 15px;
    padding: 10px;
    left: 30px;
    top: -10px;
    border: 2px solid #ffffff;
}

.value-map-label-pin {
    position: absolute;
    color: #505050;
    font-weight: bold;
    font-size: 35px;
    text-align: center;
    opacity: 1.0;
    text-shadow: -2px 0 #ffffff, 0 2px #ffffff, 2px 0 #ffffff, 0 -2px #ffffff;
}

    .value-map-label-pin.severity-high {
        background-color: transparent;
        color: #c00000;
    }

    .value-map-label-pin.severity-medium {
        background-color: transparent;
        color: #fca304;
    }

    .value-map-label-pin.severity-low {
        background-color: transparent;
        color: #548235;
    }

    .value-map-label-pin.severity-neutral {
        background-color: transparent;
        color: #505050;
    }

.value-map-label-description {
    white-space: nowrap;
    text-align: center;
}

.value-map-label-value {
    white-space: nowrap;
    text-align: center;
}


.dyno-view .dyno-control[data-dyno-type="valuemap"] {
    padding: 0;
    height: 500px !important;
    margin-right: 0px;
    margin-left: 0px;
}

    .dyno-view .dyno-control[data-dyno-type="valuemap"] label {
        display: none;
    }


/*Geo map*/
.gm-style .gm-style-iw {
    color: black;
}


.dyno-control.iframe,
.dyno-iframe-container.dyno-iframe-stretch,
.dyno-iframe-stretch .dyno-iframe-wrapper {
    display: flex;
}

.dyno-control.iframe {
    padding: 0;
    position: inherit;
}

.dyno-iframe-container.dyno-iframe-stretch {
    flex-direction: column;
}

.dyno-iframe-title {
    padding: 1rem;
    font-size: .875rem;
    font-weight: bold;
    color: #627895;
}

.dyno-iframe-container.dyno-iframe-stretch,
.dyno-iframe-container .dyno-iframe-wrapper,
.dyno-iframe-container.dyno-iframe-stretch iframe {
    flex-grow: 1;
    width: 100%;
}

.dyno-iframe-container iframe {
    margin: 0;
    padding: 0;
    display: block;
}
/*
.lightbox .dyno-iframe-wrapper {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}*/

.referenced-dynoview .dyno-control {
    margin: 0;
}

/* Charts */

.chart-wrapper-medium {
    height: 165px;
}

.heading2 {
    margin: 0;
    padding: 0;
    font-size: .875rem;
    text-transform: uppercase;
}

.gauge-label {
    width: 120px;
    font-size: 1.75rem;
    font-weight: normal;
    text-align: center;
}


/* New DynoView Visibility */

.dyno-hidden, .hidden {
    display: none !important;
}

.dyno-off {
}

/* DatePicker */

/* states and images */
.ui-icon {
    display: block;
    text-indent: -99999px;
    overflow: hidden;
    background-repeat: no-repeat;
}
/* Overlays */
.ui-widget-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.ui-datepicker {
    width: 240px;
    display: none;
    border: 1px solid #0076D1;
    background-color: #fff;
    margin-left: -221px;
    margin-top: 25px;
    z-index: 900 !important;
    -webkit-box-shadow: 0 4px 8px rgba(0,0,0,0.25);
    box-shadow: 0 4px 8px rgba(0,0,0,0.25);
    border-radius: .25rem;
    padding: .25rem;
}

    .ui-datepicker .ui-datepicker-header {
        position: relative;
        padding: 2px;
        height: 37px;
        *height: 22px;
    }

    .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
        position: absolute;
        top: 12px;
        *top: 2px;
        height: 16px;
        width: 16px;
        border: solid 1px transparent;
    }

    .ui-datepicker .ui-datepicker-prev {
        left: 2px;
        background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAAAQCAYAAACm53kpAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAAKRJREFUWEft1cENgCAMBVBG40AchWEMOzEathESQoBauOE3aTxIq30WNQYHBCAAgUYg3CFRRAq7i8M1cq20UstdzlJEis/5vDbnrD1/BmCEZYi68VJPA1A3nhvSAjDCGkQDoILoNa4B6DW+CaCHGAAUCD96k5TnZ7nSBFCjvjTbO0v55fqsBt9DrIMJePe+avRb1RO+Af/9C4h7BAsgAAEIHCLwAGUsNmwmpyCJAAAAAElFTkSuQmCC') /*../images/arrows.png*/;
        background-position: -14px 50%;
        background-repeat: no-repeat;
        padding: 2px;
    }

    .ui-datepicker .ui-datepicker-next {
        right: 2px;
        background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAAAQCAYAAACm53kpAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAAKRJREFUWEft1cENgCAMBVBG40AchWEMOzEathESQoBauOE3aTxIq30WNQYHBCAAgUYg3CFRRAq7i8M1cq20UstdzlJEis/5vDbnrD1/BmCEZYi68VJPA1A3nhvSAjDCGkQDoILoNa4B6DW+CaCHGAAUCD96k5TnZ7nSBFCjvjTbO0v55fqsBt9DrIMJePe+avRb1RO+Af/9C4h7BAsgAAEIHCLwAGUsNmwmpyCJAAAAAElFTkSuQmCC') /*../images/arrows.png*/;
        background-position: 2px 50%;
        background-repeat: no-repeat;
        padding: 2px;
    }

    .ui-datepicker .ui-datepicker-prev:hover {
        left: 2px;
        background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAAAQCAYAAACm53kpAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAAKRJREFUWEft1cENgCAMBVBG40AchWEMOzEathESQoBauOE3aTxIq30WNQYHBCAAgUYg3CFRRAq7i8M1cq20UstdzlJEis/5vDbnrD1/BmCEZYi68VJPA1A3nhvSAjDCGkQDoILoNa4B6DW+CaCHGAAUCD96k5TnZ7nSBFCjvjTbO0v55fqsBt9DrIMJePe+avRb1RO+Af/9C4h7BAsgAAEIHCLwAGUsNmwmpyCJAAAAAElFTkSuQmCC') /*../images/arrows.png*/;
        background-position: -30px 50%;
        background-repeat: no-repeat;
    }

    .ui-datepicker .ui-datepicker-next:hover {
        right: 2px;
        background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAAAQCAYAAACm53kpAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAAKRJREFUWEft1cENgCAMBVBG40AchWEMOzEathESQoBauOE3aTxIq30WNQYHBCAAgUYg3CFRRAq7i8M1cq20UstdzlJEis/5vDbnrD1/BmCEZYi68VJPA1A3nhvSAjDCGkQDoILoNa4B6DW+CaCHGAAUCD96k5TnZ7nSBFCjvjTbO0v55fqsBt9DrIMJePe+avRb1RO+Af/9C4h7BAsgAAEIHCLwAGUsNmwmpyCJAAAAAElFTkSuQmCC') /*../images/arrows.png*/;
        background-position: -46px 50%;
        background-repeat: no-repeat;
    }

    .ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span {
        display: block;
        position: absolute;
        left: 50%;
        margin-left: -8px;
        top: 50%;
        margin-top: -8px;
    }

    .ui-datepicker .ui-datepicker-title {
        margin: 0 2.3em;
        line-height: 1.8em;
        text-align: center;
    }

        .ui-datepicker .ui-datepicker-title select {
            font-size: 12px;
            margin: 1px 0;
        }

    .ui-datepicker select.ui-datepicker-month-year {
        width: 100%;
    }

    .ui-datepicker table {
        width: 100%;
        font-size: 12px;
        border-collapse: collapse;
        margin: 11px 0 .4em;
    }

    .ui-datepicker th {
        padding: 4px 3px 4px 3px;
        text-align: center;
        font-weight: bold;
        background-color: #211551; /*border-bottom:solid 1px #E8E8E8; border-top:solid 1px #E8E8E8;*/
        color: #fff;
    }

    .ui-datepicker td {
        border: 1px solid #ebf1f7;
    }

        .ui-datepicker td span, .ui-datepicker td a {
            display: block;
            text-decoration: none;
            padding: .25rem;
            width: 100%;
            overflow: hidden;
        }

        .ui-datepicker td.ui-datepicker-other-month a.ui-state-default {
            color: #fff;
        }

        .ui-state-default.ui-state-highlight.ui-state-active,
        .ui-state-default:hover,
        .ui-state-highlight:hover,
        .ui-state-active:hover,
        .ui-datepicker td.ui-datepicker-other-month a.ui-state-default {
            display: block;
        }

            .ui-datepicker td.ui-datepicker-other-month a.ui-state-default:hover a {
                color: #484848;
            }

        .ui-datepicker td.ui-datepicker-other-month.ui-datepicker-unselectable.ui-state-disabled span {
            display: none;
        }

    .ui-datepicker .ui-datepicker-buttonpane {
        background-image: none;
        margin: 6px 0 0 0;
        padding: 6px;
        padding-top: 0;
        border: 0;
        text-align: center;
    }

        .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
            border: 0;
            background-color: transparent;
            font-size: 11px;
            height: 15px;
            width: 100%;
            display: block;
        }

            .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current:hover {
                cursor: pointer;
            }

    .ui-datepicker .ui-datepicker-next:hover, .ui-datepicker .ui-datepicker-prev:hover {
        cursor: pointer;
        background-color: transparent;
    }

    .ui-datepicker .ui-datepicker-close {
        display: none;
    }

.ui-datepicker-current-day {
    background: rgba(0,118,209, 0.2);
}

.ui-datepicker-title .select-wrapper {
    width: 47%;
    margin: 0 2px;
    display: inline-block;
}

.ui-datepicker-calendar tbody td {
    padding: 0;
    text-align: center;
}

/* Autocomplete */

.section-content .search-title {
    font-size: .875rem;
    margin-bottom: .5rem;
}

.ui-helper-hidden-accessible {
    display: none;
}

.ui-autocomplete {
    width: 250px;
    cursor: pointer;
    position: absolute;
    border: 1px solid #BAC6D6;
    background-color: #e1e9f5;
    z-index: 200 !important;
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: .875rem;
}

    .ui-autocomplete li {
        margin: 0;
        padding: .25rem;
    }

.ui-state-hover {
    background-color: /*Value not set in Theme Parser*/;
}

.ui-autocomplete li.ui-menu-item:hover {
    background-color: /*Value not set in Theme Parser*/;
}

.ui-autocomplete li.ui-menu-item.ui-state-focus {
    background-color: #0076D1;
    color: #e1e9f5;
}

.autocomplete-grid .none-selected {
    display: none;
    background: 0;
}

.autocomplete-loader {
    width: 1rem;
    height: 1rem;
    background: /*Value not set in Theme Parser*/;
}

.autocomplete-remove,
.autocomplete-table .action-button .fa {
    color: #BAC6D6;
}

.action-button {
    width: 1rem;
}

.autocomplete-remove {
    padding: .375rem 0 0;
}

    .autocomplete-remove:hover,
    .autocomplete-table .action-button .fa:hover {
        text-decoration: none;
        color: #e73b4e;
    }

.autocomplete-input {
    margin: 0 0 .5rem;
}

    .autocomplete-input input {
        max-width: none;
    }

.none-selected td {
    border: 0;
}

/* Dyno Geo Map */
.dyno-geo-map-label {
    position: absolute;
    top: .625rem;
    left: 7rem;
    z-index: 5;
    background: #fff;
    text-align: center;
    font-size: 1rem;
    padding: .25rem .5rem;
    color: #0076D1;
    height: 2rem;
    border-radius: .125rem;
    -webkit-box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 4px -1px;
    box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 4px -1px;
}

.map-canvas {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
}
/* Upload manager */

div#upload-header {
    width: 100%;
    padding: 0;
}

#upload-page {
    padding: 1rem;
}



    #upload-page .buttons {
        margin-bottom: 1rem;
    }

#start-upload {
    float: right;
}

#add-file-attach {
    position: relative;
    overflow: hidden;
}

#upload-table-wrap {
    border: 1px solid #dee3e8;
    padding: .5rem;
    background: #fff;
    font-size: .875rem;
    height: 16rem;
    overflow-x: hidden;
    overflow-y: auto;
}

    #upload-table-wrap table {
        width: 100%;
    }

#upload-complete-container {
    display: none;
}

#uploads-table .progress-bar {
    text-align: center;
    width: 150px;
    height: 16px;
    background: transparent no-repeat;
}

#uploads-table tr:not(:last-child) {
    border-bottom: 1px solid #fff;
}

#uploads-table td {
    padding: .5rem 0;
}

#uploads-table .progress-bar.active {
    background-image: url("../images/upload-uploader.gif");
}

#uploads-table .progress-bar.complete {
    background-image: url("../images/upload-tick.png");
}

#uploads-table td.remove {
    text-align: center;
    width: 2rem;
}

    #uploads-table td.remove .fa {
        color: #627895;
        cursor: pointer;
    }

#upload-complete-container #upload-complete-footer {
    height: 100%;
    padding: 1rem;
    font-size: 1rem;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 16000;
    background-color: #e1e9f5;
}

#upload-complete-footer .buttons {
    position: absolute;
    bottom: 0;
    right: 1rem;
}

#upload-complete-container span#footer-message {
    display: block;
    margin-bottom: 1rem;
}

#upload-page input#files {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: translate(-300px, 0) scale(4);
    transform: translate(-300px, 0) scale(4);
    font-size: 14px;
    direction: ltr;
    cursor: pointer;
    outline: none;
}

#upload-count {
    background: #ebf1f7;
    border-radius: 0 0 3px 3px;
    font-size: .875rem;
    text-transform: uppercase;
    padding: .25rem;
    border: 1px solid #dee3e8;
    border-top: 0;
    color: #627895;
}

#upload-error-list ul {
    list-style: none;
    margin: .5rem 0 0;
    padding: .5rem;
    font-size: .875rem;
}

#upload-error-list li:not(:last-child) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

#upload-error-list li {
    padding: .25rem;
}

/* Zugo Search in Dynoview */

.dyno-control #search-loader {
    position: absolute;
    left: 0;
}

.cpftext-print {
    font-size: 1rem;
}

/* email pdf lightbox */

#email-pdf-lightbox .lightbox {
    width: 60%;
    height: 70%;
    top: 14%;
}

.dyno-control .search-results {
    max-height: 22rem;
}

.dyno-control.no-scroll .search-results {
    max-height: none;
}

.dyno-control .search-results-count {
    float: right;
    margin-top: 0.25rem;
}

    .dyno-control .search-results-count span {
        margin-right: 0.5rem;
    }

.dyno-control .table-fixed-header-container {
    position: relative;
}

    .dyno-control .table-fixed-header-container > table:first-child {
        margin-bottom: 0;
    }

.dyno-control .fixed-header > table:first-child thead {
    position: absolute;
}

/* Data grid */

.dyno-control .data-grid-results {
    max-height: 28rem;
    overflow: auto;
    width: 100%;
}

    .dyno-control .data-grid-results table {
        margin-bottom: 0;
    }

    .dyno-control .data-grid-results td {
        word-break: break-word;
    }


.data-grid-header {
    padding: .5rem 0 1rem;
    display: flex;
}

.data-grid-title {
    font-size: 1.25rem;
    line-height: 2rem;
    margin: 0;
    flex: 1 1 auto;
}

.data-grid-filter {
    padding-right: 0;
}


/* Embedded Dynoview */
.dyno-embedded {
    padding: 0;
    margin-bottom: 1rem;
    min-height: 11rem;
    position: relative;
}

    .dyno-embedded .header {
        padding: 0;
    }

    .dyno-embedded .dyno-view-body {
        padding: 0;
    }

    .dyno-embedded.hide-header .header {
        display: none;
    }

.dyno-control .load-indicator,
.dyno-control .load-indicator.full {
    background: #fff;
}


/* Search results grid */

.dyno-control.dyno-srg .dyno-control-wrapper > div > .header {
    position: absolute;
    left: 0;
}

.dyno-control.dyno-srg .header {
    padding-top: .25rem;
    background: #fff;
    margin: 0;
    padding: .5rem 0;
}


.narrative-control-missing {
    color: #e73b4e;
}

.filter-box-selected-label {
    float: left;
    max-width: calc(100% - 1.25rem);
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}


.dyno-filteredselect[data-width=stretch] div[sng-filterbox] { /* slow rule, consider rewriting for specificity*/
    width: 100%;
}


.btn.btn-group-vertical {
    display: block;
}

    .btn.btn-group-vertical + .btn.btn-group-vertical {
        margin-top: 10px;
        margin-left: 0;
    }



.hidden {
    display: none;
}

/* Image upload control */

.upload-image.loaded:after {
    content: '\f040';
    position: absolute;
    padding: .25rem .375rem;
    background: rgba(0,0,0,0.2);
    color: #fff;
    font-family: 'FontAwesome';
    border-radius: .5rem;
    line-height: .875rem;
    bottom: .25rem;
    right: .25rem;
}

.upload-image {
    position: relative;
    display: inline-block;
    border: 1px solid rgba(0,0,0,0.1);
    border-radius: .125rem;
}

    .upload-image:hover,
    .showing > .upload-image {
        border-color: #0076D1;
        cursor: pointer;
    }

        .upload-image:hover:after,
        .showing > .upload-image:after {
            background: #0076D1;
        }


.select-image-placeholder {
    padding: 100px 1rem 1rem;
    background: #e1e9f5;
    width: 250px;
    height: 250px;
    padding-top: 100px;
    text-align: center;
    vertical-align: middle;
    max-height: 300px;
}

.upload-image.loaded .select-image-placeholder {
    display: none;
}

.upload-image .cpf-dropdown-menu {
    min-width: 252px;
    width: 252px;
    left: -1px;
    margin-top: 0;
}

    .upload-image .cpf-dropdown-menu .btn-group-vertical {
        display: block;
    }

/*CategoryList*/
.category-list-item {
    padding: 0.375rem;
    display: inline-block;
    border: 1px solid #dee3e8;
    margin: 0;
}

#reset-narrative {
    background: #999;
    color: #fff;
    margin-top: 1rem;
}

.col-lg-c3 {
    position: relative;
    min-height: 1px;
}

@media (min-width: 1200px) {
    .col-lg-c3 {
        width: 33%;
        float: left;
    }
}

.col-lg-c5 {
    position: relative;
    min-height: 1px;
}

@media (min-width: 1200px) {
    .col-lg-c5 {
        width: 20%;
        float: left;
    }
}

.col-lg-c7 {
    position: relative;
    min-height: 1px;
}

@media (min-width: 1200px) {
    .col-lg-c7 {
        width: 14%;
        float: left;
    }
}

.col-lg-c8 {
    position: relative;
    min-height: 1px;
}

@media (min-width: 1200px) {
    .col-lg-c8 {
        width: 12.5%;
        float: left;
    }
}

.col-lg-c9 {
    position: relative;
    min-height: 1px;
}

@media (min-width: 1200px) {
    .col-lg-c9 {
        width: 11.1%;
        float: left;
    }
}

.col-lg-c10 {
    position: relative;
    min-height: 1px;
}

@media (min-width: 1200px) {
    .col-lg-c10 {
        width: 10%;
        float: left;
    }
}

.col-lg-c11 {
    position: relative;
    min-height: 1px;
}

@media (min-width: 1200px) {
    .col-lg-c11 {
        width: 9%;
        float: left;
    }
}

.repeater {
    padding: 0;
    background: #ebf1f7;
    margin-bottom: 1rem;
}

.repeater-row {
    padding: .5rem 1rem;
    padding-right: 0;
    display: table;
    display: -webkit-box;
    display: flex;
    -ms-display: flex;
    -webkit-display: flex;
    -moz-display: flex;
}

.remove-row {
    background: #dee3e8;
    line-height: 2rem;
    border-left: 2px solid #fff;
    padding: 1rem .5rem;
    color: #627895;
    cursor: pointer;
    text-decoration: none;
    position: relative;
    width: 2rem;
}

table .remove-row {
    padding: .25rem .5rem;
}

table .section-controls {
    display: table-row;
}


.remove-row .fa-remove {
    position: absolute;
    top: 40%;
    width: 1.75rem;
    left: 0;
    text-align: center;
}

.repeater-row.title-row + .repeater-row:nth-last-child(2) a.remove-row,
.remove-row.disabled,
.remove-row.disabled:hover,
.remove-row.disabled:active {
    background: #ebf1f7;
    color: #BAC6D6;
    cursor: default;
}


a.remove-row {
    text-decoration: none;
}

.remove-row span {
    color: inherit;
    text-decoration: inherit;
}

.remove-row:hover {
    background: #e73b4e;
    color: #fff;
    text-decoration: none;
}

.repeater-row-content {
    width: 100%;
}

.repeater-remove ~ .repeater-row-content {
    width: calc(100% - 2rem);
}

.repeater-row:not(.title-row) + .repeater-row {
    border-top: 2px solid #fff;
}

.repeater-row.title-row {
    border-radius: .25rem .25rem 0 0;
    font-weight: bold;
    border-bottom: 2px dotted #BAC6D6;
}

.responsiveRowInside > .dyno-control {
    background: #ebf1f7;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.responsiveRowInside .form-control {
    max-width: none !important;
}

.responsiveRowInside .currency-box {
    max-width: none !important;
}


.responsiveRowInside .dyno-cpftxt-styles-currency {
    max-width: none !important;
}

.repeater-row.add-row {
    background: #dee3e8;
    padding: .25rem;
    text-align: center;
    color: #627895;
    cursor: pointer;
    font-size: .875rem;
    display: block;
    border: 0;
    border-radius: 0 0 .25rem .25rem;
}

    .repeater-row.add-row:hover {
        background: #55c339;
        color: #fff;
    }

.repeater-row.totals-row {
    background: #fff;
    padding: 0px;
}

.responsiveTotalInside > .dyno-total {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.repeater-row.totals-row label {
    font-weight: bold;
}

.repeater-row .row {
    width: 100%;
}

.col-lg-c5 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

/* Info Tile Dyno Control */

.info-tile {
    font-size: 1rem;
    background: 0;
    position: relative;
    min-width: 8rem;
    max-width: 15rem;
    padding: 0;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    box-shadow: none;
}

    .info-tile:after {
        content: '';
        display: block;
        padding-top: 100%;
    }

.info-tile-light-yellow {
    background-color: #ffff80 !important;
}

.info-tile-small {
    font-size: 0.75rem;
    min-width: 7.5rem;
    max-width: 11.5rem;
}

.info-tile-large {
    font-size: 1.25rem;
    min-width: 12.5rem;
    max-width: 18.5rem;
}

.info-tile.width-stretch {
    width: 100%;
    min-width: 6rem;
    max-width: none;
    max-height: 11rem;
}

.info-tile-extra-small.width-stretch {
    height: 5.5rem;
    max-height: 5.5rem;
    margin-bottom: 15px;
}

.info-tile-small.width-stretch {
    height: 8rem;
    max-height: 8rem;
}

.info-tile-large.width-stretch {
    height: 15rem;
    max-height: 15rem;
}

.info-tile .tile {
    padding: .5rem;
    overflow: hidden;
    text-decoration: none;
    border-radius: .25rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background: #e1e9f5;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    text-align: center;
    word-break: break-word;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

.info-tile-url.tile {
    text-decoration: none;
}

.info-tile .tile:active,
.info-tile .tile:focus,
.info-tile.info-tile-subtleaccent .tile:active,
.info-tile.info-tile-subtleaccent .tile:focus {
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.15), 0 0 0 2px rgba(0,118,209, 0.5);
    box-shadow: 0 1px 3px rgba(0,0,0,0.15), 0 0 0 2px rgba(0,118,209, 0.5);
}


.info-tile-lead-value {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    font-size: 1em;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

    .info-tile-lead-value .label .fa {
        font-size: 0.75em;
        -webkit-transform: translateY(-10%);
        transform: translateY(-10%);
        margin-right: .5rem;
    }

    .info-tile-lead-value > .fa {
        font-size: 1.25em;
    }

.info-tile-extra-space {
    font-size: 0.65em !important;
    margin-right: 1rem !important;
}

.info-tile-extra-space-for-fo {
    font-size: 0.75em !important;
    margin-right: 8px !important;
}

.info-tile-sublabel,
.info-tile-footer {
    word-break: normal;
}

.info-tile-footer {
    font-size: .75rem;
    line-height: 1em;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    margin-top: auto;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: 0.02rem;
}

.info-tile-footer-small {
    font-size: .65rem;
    line-height: 1em;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    margin-top: auto;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: 0.02rem;
}

.light-gray {
    color: #afb0b1 !important;
}

.info-tile-link-hint {
    position: absolute;
    top: .5rem;
    right: .5rem;
    opacity: .25;
    -webkit-transition: opacity .2s ease;
    transition: opacity .2s ease;
    pointer-events: none;
    color: #fff;
    z-index: 2;
}

.tile:hover + .info-tile-link-hint,
.tile:focus + .info-tile-link-hint {
    opacity: .5;
}


.info-tile-font-xsmall {
    font-size: .875rem;
    line-height: 1em;
}

.info-tile-font-small {
    font-size: 1rem;
    line-height: 1em;
}

.info-tile-font-medium {
    font-size: 1.25rem;
    line-height: 1em;
}

.info-tile-font-large {
    font-size: 1.75rem;
    line-height: 1em;
}

.info-tile-font-xlarge {
    font-size: 2.25rem;
    line-height: 1em;
}

.info-tile-font-xxlarge {
    font-size: 4rem !important;
    line-height: 2em !important;
}

@media only screen and (max-width: 767px) {
    .info-tile-font-xlarge {
        font-size: 2rem;
        line-height: 1em;
    }

    .info-tile-font-xxlarge {
        font-size: 3rem;
        line-height: 1.5em;
    }

    .info-tile-width-stretch {
        min-width: 5rem;
        height: 8rem;
        max-height: 8rem;
    }
}

.info-tile a.tile {
    color: #0076D1;
}

.info-tile:not(.info-tile-subtleaccent) .clickable:after {
    background: rgba(255,255,255,0.15);
}

/* Info Tile BoldAccent */

.info-tile-boldaccent .tile,
.info-tile-boldaccent a.tile,
.info-tile-boldaccent .tile:focus,
.info-tile-boldaccent .tile:hover {
    background: #0076D1;
    color: #fff;
}

/* Info Tile SubtleAccent */

.info-tile-subtleaccent .tile {
    background: #ebf1f7;
}


    .info-tile-subtleaccent .tile.clickable,
    .info-tile-subtleaccent a.tile.clickable {
        background: #fff;
        -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.15), inset 0 0 0 1px rgba(0,118,209, 0.2);
        box-shadow: 0 1px 3px rgba(0,0,0,0.15), inset 0 0 0 1px rgba(0,118,209, 0.2);
        color: #0076D1;
    }

    .info-tile-subtleaccent .tile:not(.clickable) {
        box-shadow: inset 0 0 1px 1px rgba(0,0,0,0.1);
    }

.info-tile-subtleaccent .info-tile-link-hint,
.info-tile-subtleaccent .clickable .info-tile-lead-value {
    color: #0076D1;
}

.info-tile-subtleaccent .tile:not(.clickable) .info-tile-footer {
    color: #627895;
}

/* Info Tile Colors */

.info-tile-default .tile,
.info-tile-muted .tile,
.info-tile-default a.tile,
.info-tile-muted a.tile,
.info-tile-default .tile:focus,
.info-tile-muted .tile:focus,
.info-tile-default .tile:hover,
.info-tile-muted .tile:hover {
    background: #627895;
    color: #fff;
}

.info-tile-success .tile,
.info-tile-success a.tile,
.info-tile-success .tile:focus,
.info-tile-success .tile:hover {
    background: #55c339;
    color: #fff;
}


.info-tile-warning .tile,
.info-tile-warning a.tile,
.info-tile-warning .tile:focus,
.info-tile-warning .tile:hover {
    background: #fb9012;
    color: #fff;
}


.info-tile-danger .tile,
.info-tile-danger a.tile,
.info-tile-danger .tile:focus,
.info-tile-danger .tile:hover {
    background: #e73b4e;
    color: #fff;
}

.info-tile .tile[disabled],
.info-tile a.tile[disabled],
.info-tile .tile[disabled]:focus,
.info-tile .tile[disabled]:hover {
    cursor: not-allowed;
    color: #627895;
    background: 0;
    -webkit-box-shadow: 0 0 0 1px rgba(0,0,0,0.1);
    box-shadow: 0 0 0 1px rgba(0,0,0,0.1);
}

    .info-tile .tile[disabled] .fa,
    .info-tile .tile[disabled] .info-tile-lead-value,
    .info-tile a.tile[disabled] .fa,
    .info-tile a.tile[disabled] .info-tile-lead-value {
        color: #627895;
    }

    .info-tile .tile[disabled]:after,
    .info-tile .tile[disabled] + .info-tile-link-hint {
        display: none;
    }

.info-card {
    background: #fff;
    border-radius: .25rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
    padding: .5rem;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.info-card-shell {
    overflow: hidden;
    box-shadow: 0 0.125rem 0.25rem rgb(0 0 0 / 15%);
}

.info-card-label {
    color: #0076D1;
    font-size: 1.25rem;
    line-height: 1em;
}

    .info-card-label i {
        font-size: 1.75rem;
    }

.info-card-content {
    margin-left: auto;
    text-transform: uppercase;
    letter-spacing: 0.02rem;
}

.info-card-content-section {
    text-align: center;
    font-size: 0.9rem;
}

.info-card-figure {
    font-size: 1.35rem;
    font-weight: bold;
}

/* Bootstrap large breakpoint */
/* @media (max-width: 1199.98px) { */
@media only screen and (max-width: 1199.98px) {
    .info-card-label-inner {
        justify-content: center !important;
    }
}

/* Dyno Control - Markdown */

.dyno-markdown ul {
    list-style-type: disc;
    padding-left: 1.5rem;
    display: block;
}


/* Dyno Control - Stacked List */

.stacked-list.dyno-control {
    padding: 0;
}

.stacked-list .stacked-list-container {
    display: block;
    margin: 0;
}

/* if shown within lightbox */
.stacked-list.stacked-list-lightbox {
    padding: 1rem;
}

@media (min-width: 576px) {
    .stacked-list.stacked-list-lightbox {
        max-width: 80vw;
    }
}

.stacked-list .stacked-list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    outline: none;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5rem;
    min-height: 1.5rem;
    border-radius: .25rem;
    padding: .5rem 0;
}

a.stacked-list-item,
a.stacked-list-item:hover,
a.stacked-list-item:focus,
a.stacked-list-item:active {
    color: #0076D1;
    text-decoration: none;
    outline: none;
}

    a.stacked-list-item:active,
    a.stacked-list-item:hover {
        background: rgba(0,118,209, 0.05);
    }

.stacked-list-items {
    min-width: 20em;
    float: left;
}

    .stacked-list-items:not(:first-of-type) {
        padding-top: 0;
    }

    /* when disabled */
    .stacked-list-items.disabled a {
        pointer-events: none;
    }

    .stacked-list-items.disabled .indicator {
        color: #BAC6D6;
    }


@media (min-width: 576px) {
    .stacked-list .stacked-list-items {
        display: inline-block;
        width: calc(50%);
    }
}

.stacked-list-lightbox .stacked-list-items {
    padding: 0;
}

.stacked-list .icon-container {
    width: 2.5rem;
    text-align: center;
}

.stacked-list .icon-container, .stacked-list-item .indicator {
    padding: 0 0.5rem;
}

.stacked-list-item .icon-container .fa {
    display: inline-block;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: normal;
    width: 2.5rem;
    height: 2.5rem;
    vertical-align: middle;
}

.stacked-list-item dl {
    padding: 0;
    padding-left: 1rem;
    margin: 0;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    word-break: break-word;
    max-width: calc(100% - 2.5rem);
}

.stacked-list-item dt {
    font-weight: 500;
}

.stacked-list dd {
    font-size: 0.875rem;
    color: #5e5b77;
    margin: 0;
}

.stacked-list-item .indicator {
    display: table-cell;
    vertical-align: top;
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 400;
}

    .stacked-list-item .indicator .fa {
        opacity: .5;
        background: 0;
        -webkit-transition: opacity .1s ease;
        transition: opacity .1s ease;
    }

.stacked-list-item:link:hover .indicator .fa,
.stacked-list-item:link:focus .indicator .fa {
    opacity: 1;
}

/* stretch width */
.stacked-list.width-stretch .stacked-list-items {
    display: block;
    width: 100%;
    min-width: auto;
    float: none;
}

.stacked-list .stacked-list-load-more {
    margin-top: 16px;
}

.stacked-list .stacked-list-load-more {
    width: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.stacked-list .help-icon ~ button.stacked-list-view-more {
    width: calc(100% - 2rem);
    flex: 0 1 auto;
    -ms-flex-order: 0;
    order: 0;
}

.stacked-list .help-icon {
    float: right;
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    padding: 0 .25rem;
    margin-right: .25rem;
}

.stacked-list-item .icon-container,
.stacked-list-item dl,
.stacked-list-item .indicator {
    color: #0076D1;
}

.stacked-list-item-subtleaccent .icon-container,
.stacked-list-item-subtleaccent dl,
.stacked-list-item-subtleaccent .indicator {
    color: #0076D1;
}

/* the boldaccent should be discussed - as it fallbacks to subtleaccent now */
.stacked-list-item-boldaccent .icon-container,
.stacked-list-item-boldaccent dl,
.stacked-list-item-boldaccent .indicator {
    color: #0076D1;
}

.stacked-list-item-green .icon-container,
.stacked-list-item-green dl,
.stacked-list-item-green .indicator,
.stacked-list-item-success .icon-container,
.stacked-list-item-success dl,
.stacked-list-item-success .indicator {
    color: #55c339;
}

.stacked-list-item-amber .icon-container,
.stacked-list-item-amber dl,
.stacked-list-item-amber .indicator,
.stacked-list-item-warning .icon-container,
.stacked-list-item-warning dl,
.stacked-list-item-warning .indicator {
    color: #fb9012;
}

.stacked-list-item-red .icon-container,
.stacked-list-item-red dl,
.stacked-list-item-red .indicator,
.stacked-list-item-danger .icon-container,
.stacked-list-item-danger dl,
.stacked-list-item-danger .indicator {
    color: #e73b4e;
}

/* Dyno Control - Container */

.dyno-control.dyno-container {
    overflow: auto;
    margin-left: -.25rem;
    margin-right: -.25rem;
    margin-top: -.5rem;
}

.dyno-container .container-element {
    margin: .5rem .25rem 0;
    padding: 0;
}

.dyno-container .container-element-left {
    float: left;
}

.dyno-container .container-element-right {
    float: right;
}

.dyno-container .container-element-centre {
    float: left;
}

/* Dyno Control - Data Grid/Search */

div[sng-zugo] .search-filter input,
.dyno-control-plus .search-filter input {
    padding-right: 2rem;
}

div[sng-zugo] .search-filter .clear-filter,
.dyno-control-plus .search-filter .clear-filter {
    position: absolute;
    right: 3.4rem;
    text-align: center;
    background: transparent;
    border: none;
    z-index: 10;
    cursor: pointer;
    pointer-events: auto;
}

/* FTI Dynoviews */
.fti-dyno-view-container .dyno-view-body {
    background: #fff;
}

.fti-dyno-view-container .dyno-control {
    -webkit-box-shadow: none;
    box-shadow: none;
}

    .fti-dyno-view-container .dyno-control:last-child {
        margin-bottom: 0;
    }



/* Read mode & Print Mode Specific Styles */

.dv-read {
}

    .dv-read .dyno-control {
        border: 0;
    }

.report-read .form-value {
    font-size: 1.125rem;
}

.report-read-body {
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
    max-width: 980px;
    min-height: calc(100vh - 10rem);
    margin: 1rem auto;
    width: 100%;
    background: #fff;
    padding: 1rem 2rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    flex-shrink: 0;
}

    .report-read-body.report-font {
        font-family: 'Georgia', 'serif';
    }

    .report-read-body.landscape {
        max-width: 1440px;
    }

    .report-read-body .dyno-control {
        box-shadow: none;
    }

    .report-read-body .form-value {
        border: 0;
    }

.report-read-meta {
    text-align: right;
    font-size: 1rem;
}

.report-read-header {
    background: 0;
    border: 0;
}

.report-read-body h1, .report-read-body h2 {
    display: block;
    text-align: center;
    line-height: normal;
    padding: 0;
    border: 0;
    margin: 0 0 .5rem;
}

.report-read-body h1 {
    color: #0076D1;
    font-size: 2rem;
}

.report-read-body h2 {
    color: #627895;
    font-style: italic;
    font-size: 1.25rem;
}


.quicklink {
    cursor: pointer;
    padding: .5rem 1rem;
    align-items: center;
}

    .quicklink a {
        font-weight: normal;
    }

a.quicklink:focus {
    box-shadow: none;
}


/* 
    Lightboxes, floating panels and modal content
*/


.lightbox-overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(125, 146, 173, 0.9);
    top: 0;
    left: 0;
}

/* Old styles below */

.lightbox-sidebar-toggle {
    display: none;
}

.ng-lightbox-container,
.lightbox-container {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100;
    overflow-y: hidden;
    overflow-x: auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.lightbox-container {
    display: none;
}

.dyno-lightbox.lightbox,
.lightbox,
.modal-content {
    font-size: .875rem;
    border-radius: .25rem;
    -moz-border-radius: .25rem;
    -webkit-border-radius: .25rem;
    -o-transition: opacity .2s ease;
    -webkit-transition: opacity .2s ease;
    transition: opacity .2s ease;
    flex-grow: 0;
    min-width: 20rem;
    max-width: 92vw;
    max-height: 90vh;
}

    .lightbox,
    .modal-content .dyno-lightbox.inline {
        background: #fff;
        display: inline-block;
        text-align: left;
        position: relative;
        -webkit-box-shadow: 0 4px 2rem rgba(0,0,0,0.15);
        box-shadow: 0 4px 2rem rgba(0,0,0,0.15);
    }

    .dyno-lightbox.lightbox,
    .dyno-lightbox.lightbox.factboard-addable {
        background: #fff;
        display: none;
        z-index: 100;
        height: 90%;
        width: 92%;
    }

.dyno-lightbox.lightbox-xsmall {
    width: 30rem;
    height: 25rem;
}

.dyno-lightbox.lightbox-small {
    width: 45rem;
    height: 30rem;
}

.dyno-lightbox.lightbox-medium {
    width: 60rem;
    height: 45rem;
}

.dyno-lightbox.lightbox-large {
    width: 70rem;
    height: 55rem;
}

.lightbox-responsive {
    height: 86%;
    width: 92%;
    margin: 0 auto;
    min-width: 20rem;
    max-width: 96%;
}

.dyno-lightbox-title,
.lightbox-title {
    padding: 1rem 4rem 1rem 1rem;
    border-bottom: 0;
    font-size: 1rem;
    cursor: default;
    width: 100%;
    background: #211551;
    color: #FFFFFF;
    line-height: 1rem;
    border-radius: .25rem .25rem 0 0;
    word-break: break-word;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

    .dyno-lightbox-title .icon,
    .lightbox-title .icon {
        float: left;
        display: block;
        margin-right: .5rem;
        font-size: 1.125rem;
        line-height: 1.25rem;
    }


.lightbox-nav-tabs {
    position: absolute;
    right: 3rem;
    top: 0;
    border-bottom: 0;
    background: 0;
}

    .lightbox-nav-tabs.nav-tabs .nav-item .nav-link {
        padding: .75rem 1.5rem;
        height: calc(3rem - 1px);
        line-height: 1.75rem;
        opacity: .6;
        color: #fff;
        border-color: #fff;
    }

        .lightbox-nav-tabs.nav-tabs .nav-item .nav-link:hover {
            background: rgba(255,255,255,0.1);
        }

        .lightbox-nav-tabs.nav-tabs .nav-item .nav-link:hover,
        .lightbox-nav-tabs.nav-tabs .nav-item .nav-link.active {
            opacity: 1;
        }

.dyno-lightbox-close,
.lightbox-close, .cpf-lightbox-close {
    position: absolute;
    top: .875rem;
    right: .875rem;
    font-size: 1.25rem;
    cursor: pointer;
    z-index: 101;
    color: #fff;
}

    .lightbox-close:hover, .cpf-lightbox-close:hover {
        color: #0076D1;
    }

    .lightbox-close:focus, .cpf-lightbox-close:focus {
        outline: 0;
        border-radius: .5rem;
        -webkit-box-shadow: 0 0 0 3px rgba(0,118,209, .5);
        box-shadow: 0 0 0 3px rgba(0,118,209, .5);
        color: #0076D1;
    }

.lightbox .toolbar {
    min-width: initial;
    padding-left: 0;
}

.lightbox-section-header {
    padding: .75rem 1rem;
    border-bottom: 1px solid #dee3e8;
    text-transform: uppercase;
    color: #627895;
    clear: both;
}

    .lightbox-section:not(:first-child) .lightbox-section-header,
    .lightbox-section-header:not(:first-child) {
        border-top: 1px solid #dee3e8;
    }

.lightbox-content .lightbox-content-heading {
    min-width: 20rem;
    padding: 1rem;
    border-bottom: 1px solid #dee3e8;
    height: 6.5rem;
}

.dyno-lightbox-content,
.lightbox-content {
    min-width: 20rem;
    overflow-y: auto;
    position: relative;
}

    .dyno-lightbox-content .content,
    .lightbox-content .content {
        min-width: 20rem;
    }

        .dyno-lightbox-content .content.multiline,
        .lightbox-content .content.multiline {
            white-space: pre-line;
        }

    .lightbox-content h3 + .content {
        padding-top: 0;
    }

    .lightbox-content .content.container-fluid {
        padding-left: 0;
        padding-right: 0;
    }

    .dyno-lightbox-content .content.inner-content .content,
    .lightbox-content .content.inner-content .content {
        padding: 0;
    }

    .lightbox-content > .section-content {
        width: 100%;
    }


.cpf-message-box .content > span > ul {
    list-style-type: none;
}

.cpf-message-box {
    min-width: 22rem;
    max-width: 80%;
}

.dyno-lightbox-buttons,
.lightbox-buttons {
    padding: 1rem;
    text-align: right;
    width: 100%;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

    .lightbox-buttons:after {
        display: block;
        clear: both;
        content: '';
    }

    .lightbox-buttons .btn {
        margin-left: .5rem;
    }

.lightbox-responsive .lightbox-title,
.dyno-lightbox-title {
    height: 3rem;
}

.dyno-lightbox-buttons .dyno-control {
    background-color: transparent;
    border: none;
    display: inline-block;
    padding: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.lightbox-responsive .lightbox-content,
.lightbox-responsive .lightbox-tabs,
.dyno-lightbox-content {
    overflow-y: auto;
    background: #fff;
    position: relative;
}

.lightbox-content {
    flex-grow: 1;
}

.lightbox-buttons, .lightbox-title {
    flex-grow: 0;
}

.lightbox-content.no-buttons {
    border-radius: 0 0 .25rem .25rem;
}

.dyno-lightbox-buttons .btn {
    margin: 0 0 0 .5rem;
}
/* Lightbox content sizing */

.lightbox, .lightbox-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.lightbox-inner {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-height: 100%;
    height: 100%;
}

/* end */



.dyno-lightbox-content.dyno-lightbox-no-footer {
    bottom: 0;
}

.lightbox-tabs .lightbox-content {
    height: 100%;
    width: 100%;
    background: #fff;
}

.lightbox-responsive-toolbar .lightbox-title {
    border-bottom: 0;
}

.lightbox .content {
    width: 100%;
    flex-basis: 100%;
}

.content > h3:first-child {
    padding-top: 0;
}

.lightbox-responsive .lightbox-has-sidebar {
    bottom: 0;
}

.lightbox-content.active {
    z-index: 1;
}


.lightbox .sidebar {
    height: 100%;
    position: static;
}

/* New lightbox styles */

.lightbox-panel {
    display: flex;
    flex-wrap: nowrap;
    flex: 1 1 auto;
}

    .lightbox-panel > .sidebar {
        flex: 0 0 auto;
        height: auto;
    }

    .lightbox-panel .scroll-panel,
    .lightbox-panel .panel {
        height: auto;
    }



.lightbox .panel-has-sidebar {
    overflow: auto;
    height: auto;
}


.panel-container,
.lightbox-inner div[ng-include] {
    height: 100%;
}

.panel-buttons {
    padding: 1rem;
    text-align: right;
    width: 100%;
}

.lightbox-controls {
    width: auto;
    float: right;
}

    .lightbox-controls > .fa, .lightbox-controls .cpf-dropdown > .fa {
        color: #fff;
        background: #0076D1;
        padding: .3875rem .5rem;
        border-radius: .25rem;
        margin-top: -.3125rem;
    }


/* # Floating Panels */

.floating-panel {
    display: flex;
    flex-direction: column;
    position: fixed;
    border: 4px solid #fff;
    border-radius: .25rem;
    z-index: 100;
    box-shadow: 0px 2px 8px 2px rgba(0,0,0,0.25);
    overflow: hidden;
    background: #fff;
}

    .floating-panel .content {
        width: 100%;
    }

.floating-panel-title {
    height: 2rem;
    background: #627895;
    padding: .25rem .5rem;
    color: #fff;
    display: flex;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.floating-panel-body {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    display: flex;
}

    .floating-panel-body div[sng-i-frame] {
        -ms-flex: 1;
        flex: 1;
        height: auto;
    }

.floating-panel-close {
    color: #fff;
    font-size: 1.25rem;
}

.drag-indicator {
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADAQMAAABs5if8AAAABlBMVEUAAAD///+l2Z/dAAAAAXRSTlMAQObYZgAAAAxJREFUCNdjaGAAAgAChgCB/5LsuQAAAABJRU5ErkJggg==') repeat;
    cursor: move;
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}

    .drag-indicator:active {
        cursor: grabbing;
        cursor: -moz-grabbing;
        cursor: -webkit-grabbing;
    }

.floating-panel .drag-indicator {
    margin: .125rem 1rem;
    flex-grow: 1;
}



files-app, [files-app] {
    width: 100%;
    flex-grow: 1;
    display: flex;
    height: 100%;
}

    files-app .sidebar, [files-app] .sidebar {
        overflow-x: auto;
    }

.files-head {
    background: #211551;
    color: #FFFFFF;
}

.files-embedded #files-browser,
.mode-lite #files-browser {
    left: 0;
    border-left: 0;
}

.mode-lite .ribbon > li .files-button-up {
    display: block;
}

#files-lightbox-save-bar {
    float: left;
    width: 70%;
    padding-right: 140px;
    position: relative;
}

.mode-save #files-lightbox-save-bar {
    display: table;
    float: left;
}

.mode-save .files-lite-save-bar {
    display: block;
}

#files-lightbox-save-bar .select-wrapper {
    display: table-cell;
    width: 15rem;
}

#files-userswitcher .autocomplete-content-wrapper {
    display: none;
}

#files-userswitcher .autocomplete-input {
    margin: 0;
}

#files-lite-container {
    z-index: 99;
}


.files-panel {
    background: #ebf1f7;
    overflow: hidden;
}

    .files-panel .table, .files-panel thead th {
        border-width: 0;
        border-bottom-width: 1px;
    }

    .files-panel td {
        word-break: break-word;
    }

    .files-panel tbody tr:hover {
        cursor: pointer;
        background: #fff;
    }

    .files-panel tbody tr.folder .fa {
        font-size: 1.125rem;
        position: relative;
        top: .125rem;
        color: #FFA426;
    }

.files-toggle-switch {
    margin-left: 1rem;
    padding: .25rem 0 0;
}

.navbar-nav .nav-item.files-filter {
    justify-content: flex-end;
    margin-left: auto;
    padding: .25rem .25rem 0 0;
}

.files-filter > input {
    height: 1.875rem;
    width: 15vw;
    min-width: 12rem;
}


.files-filter .cancel-search {
    position: absolute;
    top: 8px;
    right: 10px;
    color: #627895;
}

.files-row {
    background: #dee3e8;
}

.files-col {
    min-width: 3rem;
}

.files-col-checkbox, .files-col-icon{
    width: 2.5rem;
    min-width: 2.5rem;
}

.files-col-description {
    width: 35%;
}

.files-col-displayname {
    width: 25%;
}

.files-col-updateddatetime {
    width: 11rem;
    min-width: 8rem;
}

files-ribbon {
    display: flex;
    width: auto;
    flex-grow: 1;
	align-items: center;
}

.files-ribbon-lightbox {
    width: 100%;
}

.files-selector-button {
    min-width: 9rem;
}

.files-create-button {
    min-width: 6rem;
}


/* Files App */

.files-nodes {
    overflow: hidden;
}

.files-selected-count {
    position: absolute;
    bottom: .5rem;
    left: 50%;
    border: 1px solid #0076D1;
    background: #fff;
    padding: .25rem 1rem;
    width: 18rem;
    text-align: left;
    margin-left: -9rem;
    border-radius: .25rem;
    z-index: 5;
}


.fixed-table-container {
    position: relative;
    height: 100%;
}

.files-save-bar {
    width: calc(100% - 14rem);
    float: left;
    max-width: 60rem;
}


.lightbox files-app, lightbox [files-app] {
    display: flex;
    flex-direction: column;
    width: 100%;
}


.files-lb-buttons {
    flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    -webkit-box-flex: 0 0 auto;
    display: flex;
    width: 100%;
    padding: 1rem;
}

.files-panel .table{
    table-layout: fixed;
    border-collapse: collapse;
}

/* make sure the text node spans at least the width of its parent */

files-app .node > .node-text, [files-app] .node > .node-text {
    text-overflow: ellipsis;
    overflow: hidden;
}


/* ================== RESPONSIVE */

/* Large devices (desktops, less than 1200px)*/
@media (max-width: 1199.98px) {
    .files-col-displayname {
        width: 22%;
    }

    .files-col-description {
        width: 30%;
    }

    .files-col-updateddatetime{
        width: 9rem;
    }
}

@media only screen and (max-width: 991px) {
    .files-directory-path {
        visibility: hidden;
        display: none;
    }

    .files-directory-path-go-up {
        margin-right: 0 !important;
    }
}

.files-directory-path {
    background: #e1e9f5;
    font-size: 1rem;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.25rem;
    height: 2rem;
    white-space: nowrap;
    overflow-x: scroll;
    -ms-overflow-style: none; /* for Internet Explorer, Edge */
    scrollbar-width: none; /* for Firefox */
}

.files-directory-path::-webkit-scrollbar {
    display: none; /* for Chrome, Safari, and Opera */
  }

.files-directory-path-item:hover {
    text-decoration: underline;
    cursor: pointer;
}

.files-directory-path-chevron::after {
    font-family: 'FontAwesome';
    content: '\f105';
    color: #627895;
    margin: 0 0.5rem;
    font-size: .875rem;
}

.files-directory-path-lightbox-title {
    height: 4rem !important;
}

.files-directory-path-go-up {
    background: #e1e9f5;
    margin-right: 0.25rem;
    height: 2rem;
}

.files-directory-path-go-up-icon {
    padding: 0 0.5rem 0;
    line-height: 2rem;
    font-size: .875rem;
    width: 100%;
    margin-right: 0.5rem;
}

.files-directory-path-go-up-icon:hover {
    cursor: pointer;
    background: rgba(0,118,209, .15);
    border-color: #0076D1;
}

.files-compass-chevron {
    margin: 0 0.25rem;
    font-size: .5rem;
}

.files-compass-chevron::before {
    margin-bottom: 0.25rem;
}


/* 
    Log in page
*/

.logon-panel, .sign-in-container-center {
    background: #fff;
    z-index: 1;
    position: relative;
    box-shadow: -2px 0 1rem rgba(30,20,50,0.35);
}

    .logon-panel .form-control {
        width: 100%;
        max-width: 100%;
    }

    .logon-panel > div {
        max-width: 28rem;
        margin: 0 auto;
    }

.logon-container {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: row;
}

.logon-news-container {
    background-size: cover;
    padding: 0;
}

    .logon-container .highlight-info {
        white-space: pre-line
    }

.logon-logo {
    padding: 6rem 0 3rem;
    display: flex;
    justify-content: center;
}


.logon-footer {
    color: #fff;
    background: rgba(33,21,81, 0.85);
    padding: 1rem 1rem 0.5rem;
}

    .logon-footer li {
        display: inline-block;
        padding-right: 1rem;
    }

        .logon-footer li + li {
            border-left: 1px solid #dee3e8;
            padding-left: 1rem;
        }

        .logon-footer a{
            color: #fff;
        }

        .logon-policies{
            opacity: 0.85;
            font-size: 0.875rem;
            padding-top: 1rem;
        }

.logon-footer h2 {
    color: #fff;
}

#logon-news-spacer {
    flex: 1 1 auto;
    background: rgba(30,20,50,0.15);
}

.logon-news-logo {
    padding: 1rem;
}

#news p {
    margin-bottom: 1rem;
    font-size: 0.875rem;
}

#news .col-md-6 + .col-md-6:before {
    content: '';
    display: block;
    height: 85%;
    width: 1px;
    position: absolute;
    background: #fff;
    left: -0.5rem;
    top: 12.5%;
    opacity: 0.2;
}

/* Notifications Styles */
#notifications-wrapper {
    position: relative;
    height: 100%;
    display: flex;
}

.preview-wrapper
#detail-view-wrapper {
    height: 100%;
}

#nodes {
    width: 100%;
}

.preview-wrapper {
    width: 36rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

#preview-list {
    height: 100%;
    overflow: auto;
}

#detail-view-wrapper {
    width: calc(100% - 36rem);
    height: 100%;
    float: right;
    overflow-y: auto;
}

.preview-item {
    position: relative;
    line-height: 1.25rem;
    font-size: 0.875rem;
    border-bottom: 1px solid #d0dde8;
    border-radius: 0.25rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.preview-item p {
    padding-bottom:10px;
}

.preview-item.t-row{
    border-top:0;
}

.preview-item-checkbox {
    float: left;
    height: 1.25rem;
}

.preview-item:hover {
    cursor: pointer;
    background: #d0dde8;
}

.preview-item .preview-unread-indicator {
    display: none;
    font-size: 0.5625rem;
    position: relative;
    bottom: 0.125rem;
    margin-right: 0.25rem;
}
.preview-item-info {
    padding: 10px;
    border-left: 6px solid transparent;
}

.preview-options {
    position: absolute;
    top: 0;
    left: 0;
    padding: .6125rem .5rem 0;
}

.preview-item.preview-item-selected .preview-options {
    border-color: #0076D1;
}

.preview-date-created {
    float: right;
    color: #627895;
}

.preview-item.has-read-false {
    font-weight: bold;
}

.preview-top .fa {
    margin-right: .5rem;
    color: sandybrown;
}
#notification-icon {
    margin-right: .5rem;
    color: sandybrown;
}

.selected-preview-item {
    background: #fff;
}

.selected-preview-item .preview-item-info {
    border-color: #0076D1;
}

.preview-wrapper .sort-seperator {
    padding: 0.75rem 0.5rem;
    text-transform: uppercase;
    font-size: 0.75rem;
    border-bottom: 1px solid #fff;
    text-align: center;
    font-weight: bold; 
    color: #627895;
}

#sort-filter {
    width: 100%;
    padding: 1rem;
    height: 4rem;
    border-bottom: 1px solid #fff;
    background: #fff;
    position: relative;
    z-index: 2;
    box-shadow: 0 2px 4px rgba(0,0,0,0.15);
}

#notification-preview #filter-by-search {
    border: 1px solid #dee3e8;
}

#hide-details-view {
    position: absolute;
    top: 0.5rem;
    left: 0.5rem;
}

.subjects-wrapper {
    clear: both;
    background: #fff;
    border: 1px solid #dee3e8;
    padding: .5rem 0;
    border-radius: .125rem;
}

.subject-value {
    hyphens: auto;
    overflow-wrap: break-word;
    word-break: break-word;
    word-wrap: break-word;
}


.attachments-wrapper a {
    border: 1px solid #dee3e8;
    padding: .25rem .5rem;
    display: inline-block;
}

.attachments-wrapper a:hover {
    text-decoration: none;
    border-color: #0076D1;
}
.attachments-wrapper a > div {
    display: inline-block;
}

#load-more-preview-items, #loading-more-preview-items {
    text-align: center;
    font-size: .875rem;
    padding: 1rem;
}

#notification-banner{
    padding:0.385rem 0.875rem;
    color: #fff;
    margin-top: 1rem;
}

#notification-banner.escalated {
    background: #e73b4e;
}

#notification-banner.delegated {
    background: #fb9012;
}

#detail-view .header {
    background: 0;
    padding: 0;
    box-shadow: none;
    position: static;
}

#detail-view {
    padding: 2rem;
}

.sub-heading span {
    font-size: inherit;
    padding-right: .5rem;
}

.attachments-wrapper {
    margin-bottom: .5rem;
    padding: .5rem;
}

.notification-attachment {
    margin: .2rem;
    border-radius: .5rem;
    padding: 0.5rem;
    border: 1px solid #d0dde8;
    display: inline-block;
    width: 15rem;
    float: left;
}

.attachment-type {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 85%;
}

.notification-attachment span.fa, .notification-attachment span.attachment-type {
    color: #627895;
}

.notification-attachment span.attachment-name {
    color: #0076D1;
}    
    
.notification-body {
    background-color: white;
    padding: 1rem;
}

.notification-dyno-view .dyno-view-body {
    overflow: visible;
    background: 0;
    padding: 1rem 0 0;
}

@media screen and (max-width: 1339px){
    .preview-wrapper{
        width: 26rem;
    }

    #detail-view-wrapper{
        width: calc(100% - 26rem);
    }
}

.notification-title {
    border: 0;
    color: #0076D1;
    font-size: 1.75rem;
}

/* VideoJS Default Styles */
.vjs-default-skin{color:#ccc}@font-face{font-family:'VideoJS';src:url(../images/vjs.eot?v=2509.1008.20.0);src:url(../images/vjs.eot?v=2509.1008.20.0#iefix) format("embedded-opentype"),url(../images/vjs.woff?v=2509.1008.20.0) format("woff"),url(../images/vjs.ttf?v=2509.1008.20.0) format("truetype"),url(../images/vjs.svg?v=2509.1008.20.0#icomoon) format("svg");font-weight:400;font-style:normal}.vjs-default-skin .vjs-slider{outline:0;position:relative;cursor:pointer;padding:0;background-color:#333;background-color:rgba(51,51,51,0.9)}.vjs-default-skin .vjs-slider:focus{-webkit-box-shadow:0 0 2em #fff;-moz-box-shadow:0 0 2em #fff;box-shadow:0 0 2em #fff}.vjs-default-skin .vjs-slider-handle{position:absolute;left:0;top:0}.vjs-default-skin .vjs-slider-handle:before{content:"\e009";text-align:center;text-shadow:0 0 1em #fff;position:absolute;top:0;left:0;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);font:1em/1 VideoJS}.vjs-default-skin .vjs-control-bar{display:none;position:absolute;bottom:0;left:0;right:0;height:3em;background-color:#07141e;background-color:rgba(7,20,30,0.7)}.vjs-default-skin.vjs-has-started .vjs-control-bar{display:block;visibility:visible;opacity:1;-webkit-transition:visibility 0.1s,opacity .1s;-moz-transition:visibility 0.1s,opacity .1s;-o-transition:visibility 0.1s,opacity .1s;transition:visibility 0.1s,opacity .1s}.vjs-default-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar{display:block;visibility:hidden;opacity:0;-webkit-transition:visibility 1s,opacity 1s;-moz-transition:visibility 1s,opacity 1s;-o-transition:visibility 1s,opacity 1s;transition:visibility 1s,opacity 1s}.vjs-default-skin.vjs-controls-disabled .vjs-control-bar{display:none}.vjs-default-skin.vjs-using-native-controls .vjs-control-bar{display:none}.vjs-default-skin.vjs-error .vjs-control-bar{display:none}.vjs-audio.vjs-default-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar{opacity:1;visibility:visible}@media \0screen{.vjs-default-skin.vjs-user-inactive.vjs-playing .vjs-control-bar :before{content:""}}.vjs-default-skin .vjs-control{outline:none;position:relative;float:left;text-align:center;margin:0;padding:0;height:3em;width:4em}.vjs-default-skin .vjs-control:before{position:absolute;top:0;left:0;width:100%;height:100%;text-align:center;text-shadow:1px 1px 1px rgba(0,0,0,0.5);font:1.5em/2 VideoJS}.vjs-default-skin .vjs-control:focus:before,.vjs-default-skin .vjs-control:hover:before{text-shadow:0 0 1em #fff}.vjs-default-skin .vjs-control-text{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.vjs-default-skin .vjs-play-control{width:5em;cursor:pointer}.vjs-default-skin .vjs-play-control:before{content:"\e001"}.vjs-default-skin.vjs-playing .vjs-play-control:before{content:"\e002"}.vjs-default-skin .vjs-playback-rate .vjs-playback-rate-value{font-size:1.5em;line-height:2;position:absolute;top:0;left:0;width:100%;height:100%;text-align:center;text-shadow:1px 1px 1px rgba(0,0,0,0.5)}.vjs-default-skin .vjs-playback-rate.vjs-menu-button .vjs-menu .vjs-menu-content{width:4em;left:-2em;list-style:none}.vjs-default-skin .vjs-mute-control,.vjs-default-skin .vjs-volume-menu-button{cursor:pointer;float:right}.vjs-default-skin .vjs-mute-control:before,.vjs-default-skin .vjs-volume-menu-button:before{content:"\e006"}.vjs-default-skin .vjs-mute-control.vjs-vol-0:before,.vjs-default-skin .vjs-volume-menu-button.vjs-vol-0:before{content:"\e003"}.vjs-default-skin .vjs-mute-control.vjs-vol-1:before,.vjs-default-skin .vjs-volume-menu-button.vjs-vol-1:before{content:"\e004"}.vjs-default-skin .vjs-mute-control.vjs-vol-2:before,.vjs-default-skin .vjs-volume-menu-button.vjs-vol-2:before{content:"\e005"}.vjs-default-skin .vjs-volume-control{width:5em;float:right}.vjs-default-skin .vjs-volume-bar{width:5em;height:.6em;margin:1.1em auto 0}.vjs-default-skin .vjs-volume-level{position:absolute;top:0;left:0;height:.5em;width:100%;background:#66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat}.vjs-default-skin .vjs-volume-bar .vjs-volume-handle{width:.5em;height:.5em;left:4.5em}.vjs-default-skin .vjs-volume-handle:before{font-size:.9em;top:-.2em;left:-.2em;width:1em;height:1em}.vjs-default-skin .vjs-volume-menu-button .vjs-menu{display:block;width:0;height:0;border-top-color:transparent}.vjs-default-skin .vjs-volume-menu-button .vjs-menu .vjs-menu-content{height:0;width:0}.vjs-default-skin .vjs-volume-menu-button:hover .vjs-menu,.vjs-default-skin .vjs-volume-menu-button .vjs-menu.vjs-lock-showing{border-top-color:rgba(7,40,50,0.5)}.vjs-default-skin .vjs-volume-menu-button:hover .vjs-menu .vjs-menu-content,.vjs-default-skin .vjs-volume-menu-button .vjs-menu.vjs-lock-showing .vjs-menu-content{height:2.9em;width:10em}.vjs-default-skin .vjs-progress-control{position:absolute;left:0;right:0;width:auto;font-size:.3em;height:1em;top:-1em;-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;transition:all .4s}.vjs-default-skin:hover .vjs-progress-control{font-size:.9em;-webkit-transition:all .2s;-moz-transition:all .2s;-o-transition:all .2s;transition:all .2s}.vjs-default-skin .vjs-progress-holder{height:100%}.vjs-default-skin .vjs-progress-holder .vjs-play-progress,.vjs-default-skin .vjs-progress-holder .vjs-load-progress,.vjs-default-skin .vjs-progress-holder .vjs-load-progress div{position:absolute;display:block;height:100%;margin:0;padding:0;width:0;left:0;top:0}.vjs-default-skin .vjs-play-progress{background:#66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat}.vjs-default-skin .vjs-load-progress{background:#646464;background:rgba(255,255,255,0.2)}.vjs-default-skin .vjs-load-progress div{background:#787878;background:rgba(255,255,255,0.1)}.vjs-default-skin .vjs-seek-handle{width:1.5em;height:100%}.vjs-default-skin .vjs-seek-handle:before{padding-top:.1em}.vjs-default-skin.vjs-live .vjs-time-controls,.vjs-default-skin.vjs-live .vjs-time-divider,.vjs-default-skin.vjs-live .vjs-progress-control{display:none}.vjs-default-skin.vjs-live .vjs-live-display{display:block}.vjs-default-skin .vjs-live-display{display:none;font-size:1em;line-height:3em}.vjs-default-skin .vjs-time-controls{font-size:1em;line-height:3em}.vjs-default-skin .vjs-current-time{float:left}.vjs-default-skin .vjs-duration{float:left}.vjs-default-skin .vjs-remaining-time{display:none;float:left}.vjs-time-divider{float:left;line-height:3em}.vjs-default-skin .vjs-fullscreen-control{width:3.8em;cursor:pointer;float:right}.vjs-default-skin .vjs-fullscreen-control:before{content:"\e000"}.vjs-default-skin.vjs-fullscreen .vjs-fullscreen-control:before{content:"\e00b"}.vjs-default-skin .vjs-big-play-button{left:.5em;top:.5em;font-size:3em;display:block;z-index:2;position:absolute;width:4em;height:2.6em;text-align:center;vertical-align:middle;cursor:pointer;opacity:1;background-color:#07141e;background-color:rgba(7,20,30,0.7);border:.1em solid #3b4249;-webkit-border-radius:.8em;-moz-border-radius:.8em;border-radius:.8em;-webkit-box-shadow:0 0 1em rgba(255,255,255,0.25);-moz-box-shadow:0 0 1em rgba(255,255,255,0.25);box-shadow:0 0 1em rgba(255,255,255,0.25);-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;transition:all .4s}.vjs-default-skin.vjs-big-play-centered .vjs-big-play-button{left:50%;margin-left:-2.1em;top:50%;margin-top:-1.4em}.vjs-default-skin.vjs-controls-disabled .vjs-big-play-button{display:none}.vjs-default-skin.vjs-has-started .vjs-big-play-button{display:none}.vjs-default-skin.vjs-using-native-controls .vjs-big-play-button{display:none}.vjs-default-skin:hover .vjs-big-play-button,.vjs-default-skin .vjs-big-play-button:focus{outline:0;border-color:#fff;background-color:#505050;background-color:rgba(50,50,50,0.75);-webkit-box-shadow:0 0 3em #fff;-moz-box-shadow:0 0 3em #fff;box-shadow:0 0 3em #fff;-webkit-transition:all 0;-moz-transition:all 0;-o-transition:all 0;transition:all 0}.vjs-default-skin .vjs-big-play-button:before{content:"\e001";font-family:VideoJS;line-height:2.6em;text-shadow:.05em .05em .1em #000;text-align:center;position:absolute;left:0;width:100%;height:100%}.vjs-error .vjs-big-play-button{display:none}.vjs-error-display{display:none}.vjs-error .vjs-error-display{display:block;position:absolute;left:0;top:0;width:100%;height:100%}.vjs-error .vjs-error-display:before{content:'X';color:#666;text-shadow:.05em .05em .1em #000;text-align:center;vertical-align:middle;position:absolute;left:0;top:50%;margin-top:-.5em;width:100%;font:4em/1 Arial}.vjs-error-display div{position:absolute;bottom:1em;right:0;left:0;font-size:1.4em;text-align:center;padding:3px;background:#000;background:rgba(0,0,0,0.5)}.vjs-error-display a,.vjs-error-display a:visited{color:#F4A460}.vjs-loading-spinner{display:none;position:absolute;top:50%;left:50%;font-size:4em;line-height:1;width:1em;height:1em;margin-left:-.5em;margin-top:-.5em;opacity:.75}.vjs-waiting .vjs-loading-spinner,.vjs-seeking .vjs-loading-spinner{display:block;-webkit-animation:spin 1.5s infinite linear;-moz-animation:spin 1.5s infinite linear;-o-animation:spin 1.5s infinite linear;animation:spin 1.5s infinite linear}.vjs-error .vjs-loading-spinner{display:none;-webkit-animation:none;-moz-animation:none;-o-animation:none;animation:none}.vjs-default-skin .vjs-loading-spinner:before{content:"\e01e";font-family:VideoJS;position:absolute;top:0;left:0;width:1em;height:1em;text-align:center;text-shadow:0 0 .1em #000}@-moz-keyframes spin{0%{-moz-transform:rotate(0deg)}100%{-moz-transform:rotate(359deg)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg)}}@-o-keyframes spin{0%{-o-transform:rotate(0deg)}100%{-o-transform:rotate(359deg)}}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(359deg)}}.vjs-default-skin .vjs-menu-button{float:right;cursor:pointer}.vjs-default-skin .vjs-menu{display:none;position:absolute;bottom:0;left:0;width:0;height:0;margin-bottom:3em;border-left:2em solid transparent;border-right:2em solid transparent;border-top:1.55em solid #000;border-top-color:rgba(7,40,50,0.5)}.vjs-default-skin .vjs-menu-button .vjs-menu .vjs-menu-content{display:block;padding:0;margin:0;position:absolute;width:10em;bottom:1.5em;max-height:15em;overflow:auto;left:-5em;background-color:#07141e;background-color:rgba(7,20,30,0.7);-webkit-box-shadow:-.2em -.2em .3em rgba(255,255,255,0.2);-moz-box-shadow:-.2em -.2em .3em rgba(255,255,255,0.2);box-shadow:-.2em -.2em .3em rgba(255,255,255,0.2)}.vjs-default-skin .vjs-menu-button:hover .vjs-control-content .vjs-menu,.vjs-default-skin .vjs-control-content .vjs-menu.vjs-lock-showing{display:block}.vjs-default-skin .vjs-menu-button ul li{list-style:none;margin:0;padding:.3em 0;line-height:1.4em;font-size:1.2em;text-align:center;text-transform:lowercase}.vjs-default-skin .vjs-menu-button ul li.vjs-selected{background-color:#000}.vjs-default-skin .vjs-menu-button ul li:focus,.vjs-default-skin .vjs-menu-button ul li:hover,.vjs-default-skin .vjs-menu-button ul li.vjs-selected:focus,.vjs-default-skin .vjs-menu-button ul li.vjs-selected:hover{outline:0;color:#111;background-color:#fff;background-color:rgba(255,255,255,0.75);-webkit-box-shadow:0 0 1em #fff;-moz-box-shadow:0 0 1em #fff;box-shadow:0 0 1em #fff}.vjs-default-skin .vjs-menu-button ul li.vjs-menu-title{text-align:center;text-transform:uppercase;font-size:1em;line-height:2em;padding:0;margin:0 0 .3em;font-weight:700;cursor:default}.vjs-default-skin .vjs-subtitles-button:before{content:"\e00c"}.vjs-default-skin .vjs-captions-button:before{content:"\e008"}.vjs-default-skin .vjs-chapters-button:before{content:"\e00c"}.vjs-default-skin .vjs-chapters-button.vjs-menu-button .vjs-menu .vjs-menu-content{width:24em;left:-12em}.vjs-default-skin .vjs-captions-button:focus .vjs-control-content:before,.vjs-default-skin .vjs-captions-button:hover .vjs-control-content:before{-webkit-box-shadow:0 0 1em #fff;-moz-box-shadow:0 0 1em #fff;box-shadow:0 0 1em #fff}.video-js{background-color:#000;position:relative;padding:0;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font:400 10px Arial,sans-serif}.video-js .vjs-tech{position:absolute;top:0;left:0;width:100%;height:100%}.video-js:-moz-full-screen{position:absolute}body.vjs-full-window{padding:0;margin:0;height:100%;overflow-y:auto}.video-js.vjs-fullscreen{position:fixed;overflow:hidden;z-index:1000;left:0;top:0;bottom:0;right:0;width:100%!important;height:100%!important;_position:absolute}.video-js:-webkit-full-screen{width:100%!important;height:100%!important}.video-js.vjs-fullscreen.vjs-user-inactive{cursor:none}.vjs-poster{background-repeat:no-repeat;background-position:50% 50%;background-size:contain;cursor:pointer;margin:0;padding:0;position:absolute;top:0;right:0;bottom:0;left:0}.vjs-poster img{display:block;margin:0 auto;max-height:100%;padding:0;width:100%}.video-js.vjs-has-started .vjs-poster{display:none}.video-js.vjs-audio.vjs-has-started .vjs-poster{display:block}.video-js.vjs-controls-disabled .vjs-poster{display:none}.video-js.vjs-using-native-controls .vjs-poster{display:none}.video-js .vjs-text-track-display{text-align:center;position:absolute;bottom:4em;left:1em;right:1em}.video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display{bottom:1em}.video-js .vjs-text-track{display:none;font-size:1.4em;text-align:center;margin-bottom:.1em;background-color:#000;background-color:rgba(0,0,0,0.5)}.video-js .vjs-subtitles{color:#fff}.video-js .vjs-captions{color:#fc6}.vjs-tt-cue{display:block}.video-js.vjs-fullscreen .vjs-text-track{font-size:3em}.vjs-default-skin .vjs-hidden{display:none}.vjs-lock-showing{display:block!important;opacity:1;visibility:visible}.vjs-no-js{padding:20px;color:#ccc;background-color:#333;text-align:center;width:300px;height:150px;margin:0 auto;font:18px Arial,sans-serif}.vjs-no-js a,.vjs-no-js a:visited{color:#F4A460}.videoWrapper{position:relative;padding-bottom:41%;padding-top:0;height:0;z-index:2}video{position:absolute!important;top:0;left:0;width:100%!important;height:100%!important;z-index:0}video.video-js{z-index:1000}.video-js .vjs-controls{z-index:1002}.video-js .vjs-big-play-button{z-index:1002}.videoWrapper .video-js{position:absolute;top:0;left:0;width:100%!important;height:100%!important;z-index:1;background:#000}.videoWrapper object,.videoWrapper embed{position:absolute;top:0;left:0;width:100%;height:100%!important;z-index:1}.vjs-spinner{display:none!important}.video-js img.vjs-poster{height:100%!important;width:100%!important;z-index:1;max-width:100%}



.ebag-item {
    width: 24.6%;
    float: left;
    margin: 0 .5% .5rem 0;
    padding-bottom: 1.75rem;
    position: relative;
}

    .ebag-item.selected {
        border-color: #0076D1;
    }

.ebag-item-bottom {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: .5rem;
    font-size: .875rem;
}

    .ebag-item-bottom .fa {
        width: 1.375rem;
        text-align: center;
    }

    .ebag-item-bottom label {
        display: inline;
    }

.ebag-item > div:first-child {
    height: 6rem;
    background: #dee3e8 no-repeat center center;
    background-size: cover;
    border-bottom: 1px solid #dee3e8;
    cursor: pointer;
}

    .ebag-item > div:first-child div {
        width: 100%;
        height: 100%;
        background: #627895;
        text-align: center;
        padding-top: 2rem;
        color: #627895;
        text-transform: uppercase;
        font-size: .875rem;
        line-height: .875rem;
        transition: all .2s ease;
    }

        .ebag-item > div:first-child div,
        .ebag-item > div:first-child div span {
            -webkit-transition: all .2s ease;
            -moz-transition: all .2s ease;
            -ms-transition: all .2s ease;
            -o-transition: all .2s ease;
            transition: all .2s ease;
            opacity: 0;
        }

    .ebag-item > div:first-child:hover div,
    .ebag-item > div:first-child:hover div span {
        opacity: .6;
    }

    .ebag-item > div:first-child div span {
        display: inline-block;
        padding: .25rem .5rem;
        background: #5e5b77;
        color: #fff;
    }


    .ebag-item > div:first-child:hover {
        background-size: contain;
    }

.ebag-item > div:last-child {
    padding: .5rem;
}

.ebag-title,
.ebag-description-hidden {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.ebag-title {
    font-size: 1rem;
    color: #5e5b77;
    width: calc(100% - 7rem);
}

.ebag-title,
.ebag-description.ebag-description-hidden {
    min-height: 1.5rem;
    
    padding: .125rem .25rem;
}

.ebag-description {
    font-size: .875rem;
    padding: .125rem .25rem;
    width: 100%;
    margin-bottom: .25rem;
}

.ebag-time-ago {
    font-size: .75rem;
    color: #627895;
    float: right;
    padding: 0 0 .5rem .5rem;
    width: 7rem;
    text-align: right;
}

.ebag-item .fa.fa-trash-o {
    padding: .25rem;
    display: inline-block;
}

body.ebag-select .dyno-control:not(.ebag-disabled) {
    border: 1px solid #627895;
    z-index: 4;
    position: relative;
}

body.ebag-select .dyno-control.hover {
    border-color: #0076D1;
    z-index: 5;
}

    body.ebag-select .dyno-control.hover:before {
        display: block;
        content: '';
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        background: #0076D1;
        opacity: .1;
        cursor: pointer;
        z-index: 4;
    }



body.ebag-select .ebag-overlay {
    display: block;
}

.ebag-item-bottom input {
    height: .875rem;
    position: relative;
    top: .125rem;
}

.ebag-image-view {
    padding: 1rem;
    text-align: center;
    overflow: auto;
    height: calc(100% - 6rem);
}

    .ebag-image-view img {
        display: inline-block;
    }

.ebag-image-description {
    width: 100%;
    border-top: 1px solid #dee3e8;
    color: #627895;
    text-align: center;
    padding: 1rem;
}

.ebag-capture,
.ebag-capture header {
    max-width: 1024px;
}

.ebag-capture {
    overflow: visible;
    height: auto;
    min-height: 940px;
}

    .ebag-capture .alert,
    .ebag-capture .alert-vis,
    .ebag-capture #alert,
    .ebag-capture .alert-body {
        display: none !important;
    }

    .ebag-capture .mCSB_scrollTools {
        opacity: 0 !important;
    }

    .ebag-capture > .mCSB_container {
        overflow: visible;
    }

@media all and (min-width: 80em) {
    .ebag-item {
        width: 19.6%;
    }

        .ebag-item:nth-child(5n) {
            margin-right: 0;
        }

        .ebag-item:nth-child(5n+1) {
            clear: both;
        }
}

@media all and (max-width: 79.99em) and (min-width: 64em) {
    .ebag-item:nth-child(4n) {
        margin-right: 0;
    }

    .ebag-item:nth-child(4n+1) {
        clear: both;
    }
}

@media all and (max-width: 63.99em) and (min-width: 56em) {
    .ebag-item {
        width: 33%;
    }

        .ebag-item:nth-child(3n) {
            margin-right: 0;
        }

        .ebag-item:nth-child(3n+1) {
            clear: both;
        }
}

@media all and (max-width: 55.99em) and (min-width: 34em) {
    .ebag-item {
        width: 49.75%;
    }

        .ebag-item:nth-child(2n) {
            margin-right: 0;
        }

        .ebag-item:nth-child(2n+1) {
            clear: both;
        }
}


@media all and (max-width: 33.99em) {
    .ebag-item {
        margin-right: 0;
        width: 100%;
        clear: both;
        float: none;
    }
}


.btn-composer {
    min-width: 1.25rem;
    padding: 0;
    line-height: 1.25rem;
    height: auto;
    margin: 0 !important;
    min-height: 0;
}

.search-history-action {
    float: right;
    padding-top: .5rem;
}

.composer-column {
    display: inline-block;
    padding: .25rem .75rem;
    background: #fff;
    border: 1px solid #dee3e8;
    color: #627895;
}

.composer-row.selected-row .composer-column {
    padding: .5rem .875rem;
    color: #5e5b77;
}

.composer-row.error {
    border-left: 4px solid red !important;
    margin-left: -4px !important;
}

.composer-column.selected {
    border: 1px solid #627895;
    background: #dee3e8;
    color: #627895;
    z-index: 1;
    position: relative;
    width: 20rem;
    text-align: center;
}

.composer-control {
    display: inline-block;
}


.composer-column,
.composer-control,
.accordion-option {
    cursor: pointer;
}

    .accordion-option.selected {
        border: 1px solid #0076D1;
    }

.composer-row .composer-column + .composer-column {
    margin-left: -1px;
}

.composer-row button.fa:disabled {
    color: #BAC6D6;
    cursor: not-allowed;
}

/* Accordion */

.composer-accordion-wrapper {
    position: absolute;
    z-index: 105;
}

.composer-accordion {
    border: 1px solid #0076D1;
    padding: 0;
    background: #fff;
    width: 20rem;
    border-radius: .25rem;
    box-shadow: 0 0 0 2px rgba(0,118,209, 0.5);
}

.accordion-hidden {
    display: none;
}

.composer-accordion > div:first-child {
    border-bottom: 1px solid #dee3e8;
    padding: .375rem;
}

.composer-accordion > div:nth-child(2) {
    max-height: 20rem;
    overflow-y: auto;
}


.composer-accordion > div:first-child input {
    max-width: 100%;
}

.accordion-body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
}

.accordion-row,
.accordion-row-component {
    display: block;
    padding: .375rem .5rem;
    cursor: pointer;
    border: 1px solid #dee3e8;
    border-width: 1px 0 1px 0;
    margin-top: -1px;
    font-size: .875rem;
    transition: all .15s ease;
    min-height: 2rem;
}

.accordion-row, .accordion-row-component {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}

/**
    accordion row
    - category name [optional]
    - display name [required]
    - favourite [optional]
*/
.accordion-row-component {
    padding: .375rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    height: 2rem;
}

    .accordion-row-component .accordion-row-category {
        margin-right: .375rem;
    }

    .accordion-row-component .accordion-row-label {
        margin-right: auto;
    }

    .accordion-row-component .accordion-row-favourite {
        width: 1.75rem;
        height: 1.75rem;
        margin-right: -.375rem;
        padding: .25rem;
        text-align: center;
    }

.accordion-header {
    color: #627895;
    background: #e1e9f5;
    text-align: center;
}

    .accordion-header .fa,
    .accordion-row:hover {
        color: #0076D1;
    }

    .accordion-header:hover {
        background: rgba(0,118,209, 0.2);
    }

    .accordion-header.accordion-disabled {
        background: #fff;
        color: #BAC6D6;
    }

        .accordion-header.accordion-disabled:hover {
            cursor: not-allowed;
        }

        .accordion-header.accordion-disabled:active {
            background: #fff;
        }

        .accordion-header.accordion-disabled .fa {
            color: #BAC6D6;
        }

.accordion-option:hover {
    background: rgba(0,118,209, 0.1);
}

.accordion-header:hover,
.accordion-option:hover {
    border-color: rgba(0,118,209, 0.25);
    z-index: 1;
    position: relative;
}

.accordion-group {
    border-left: 1rem solid #BAC6D6;
}

    .accordion-group .accordion-header {
        background: #dee3e8;
        border-color: #BAC6D6;
    }


        .accordion-group .accordion-header:hover {
            background: rgba(0,118,209, 0.25);
        }

/* Labels of the individual items and the headers */
.accordion-title {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

.accordion-header .accordion-title {
    text-align: center;
}


.accordion-option .fa-star, .accordion-option .fa-star-o {
    padding: .125rem 0;
}

.accordion-option .fa-star-o {
    color: #627895;
}

.accordion-option .fa-star {
    color: #f3c631;
}

.accordion-buttons {
    margin-left: auto;
    flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    padding-left: .5rem;
}
/**
    Conditions Page
*/
.compose-group {
    position: relative;
    position: relative;
    border: 1px dotted #dee3e8;
    border-left: 2px solid;
    border-radius: 0 .25rem .25rem 0;
    margin-bottom: .5rem;
}

    .compose-group > .select-wrapper {
        display: inline-block;
    }

    .compose-group > .fa {
        font-size: 1.125rem;
        margin-left: .5rem;
    }

    .compose-group .compose-group {
        margin: .5rem .25rem;
    }

/* coour palette for composer groups - used e.g. in Designer */
.compose-group-border-left-0 {
    border-left-color: #0E72A1;
}

.compose-group-border-left-1 {
    border-left-color: #32B1A8;
}

.compose-group-border-left-2 {
    border-left-color: #92C61D;
}

.compose-group-border-left-3 {
    border-left-color: #E34F50;
}

.compose-group-border-left-4 {
    border-left-color: #576D8C;
}

.compose-group-border-left-5 {
    border-left-color: #9973AB;
}

.compose-group-border-left-5 {
    border-left-color: #E38B13;
}

.conditions-container {
    margin-left: .5rem;
    padding: .25rem 0;
    position: relative;
}

    .conditions-container:before {
        content: '';
        display: block;
        /*border-left: 2px dotted #BAC6D6;*/
        position: absolute;
        top: 0;
        left: -2px;
        bottom: 1.25rem;
    }

    .conditions-container:after, .compose-condition:after, .add-conditions:after {
        content: '';
        display: block;
        clear: both;
    }

.compose-condition {
    position: relative;
    padding: .25rem 0 .25rem 1rem;
}

    .compose-condition:before, .add-conditions:before, .compose-group .compose-group .select-wrapper:before {
        display: block;
        position: absolute;
        top: 1.25rem;
        /*border-bottom: 2px dotted #BAC6D6;*/
        content: '';
        width: 1rem;
    }

    .compose-condition:before, .add-conditions:before {
        left: 0;
    }

.compose-group .compose-group .select-wrapper:before {
    left: -.5rem;
}

.condition:before {
    top: 1.25rem;
}

.add-conditions:before {
    top: 1rem;
}

.add-conditions {
    padding: 0 0 .25rem 1rem;
    position: relative;
}

.compose-condition > div {
    display: block;
    float: left;
    background: #fff;
    padding: .25rem .75rem;
    position: relative;
    z-index: 0;
    outline: 0;
    color: #627895;
    line-height: 1.25rem;
}

.compose-condition.mandatory > div {
    background: 0;
    padding-left: 0;
}

.compose-condition.active-condition > div:not(.accordion), .accordion .select-label {
    padding: .75rem 1rem;
    color: #5e5b77;
    z-index: 4;
    line-height: 1.5rem;
}

.compose-condition > div + div {
    margin-left: -1px;
}

.compose-condition > div:not(.condition-settings):hover, .compose-condition > div:focus {
    border-color: #0076D1;
    cursor: pointer;
    z-index: 2;
    color: #5e5b77;
}

.compose-condition.mandatory > div, .compose-condition.mandatory > div:hover {
    border-color: #BAC6D6;
    color: #5e5b77;
    cursor: default;
}

.compose-condition > div:focus {
    background: #e1e9f5;
}

.add-conditions .btn {
    padding: .25rem .75rem;
    line-height: 1rem;
    margin-left: 0;
    display: block;
    float: left;
    font-size: .875rem;
    z-index: 1;
}

    .add-conditions .btn + .btn {
        border-radius: 0 .25rem .25rem .0;
        margin-left: -1px;
    }

.compose-condition .condition-button {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    padding: 0;
    border: 0;
    background: 0;
    color: #627895;
}

    .compose-condition .condition-button + .condition-button {
        margin-left: .5rem;
    }

    .compose-condition .condition-button:hover {
        color: #0076D1;
        cursor: pointer;
    }

div[sng-composer] {
    min-height: 8rem;
}


.accordion-selector-submit-button {
    min-width: auto;
    display: inline-block;
    width: 16%;
}

.composer-accordion .has-submit-button {
    width: 82%;
    display: inline-block;
}
/*

.conditions:before,
.compose-group .compose-group:before,
.compose-group .compose-group:after,
.conditions:after {
    position: absolute;
    content: '';
    display: block;
}*/

.conditions {
    padding-left: .5rem;
    position: relative;
}

    .conditions:before {
        border-left: 1px dotted #BAC6D6;
        top: 0;
        bottom: .5rem;
    }

.condition {
    margin: 0 0 0 1rem;
}


.compose-group .compose-group {
    margin: .5rem 0 .5rem 1rem;
}


/* Explorer-specific */


#options {
    height: 100%;
}

.composer-sidebar-title {
    padding-left: 1rem;
    padding-top: 1.6rem;
    padding-bottom: 1.6rem;
    border-bottom: 1px solid #BAC6D6;
    font-size: 1rem;
    margin: 0 !important;
}

.composer-async-nosearches {
    padding-bottom: .5rem;
}

.composer-async-search {
    padding: .8rem;
    border-bottom: 1px solid #BAC6D6;
}

.composer-async-search-pointer {
    cursor: pointer;
}

.composer-async-search-gray {
    color: #627895;
}

.composer-visual-container {
    padding: .8rem;
    display: flex;
}

.composer-visual {
    width: 100%;
}

.composer-results-button {
    min-width: 5rem !important;
}

.composer-async-search-red {
    color: red;
}

.composer-async-search-yellow {
    color: orange;
}

.composer-async-search-green {
    color: green;
}

.composer-async-search-left {
    width: 70%;
    float: left;
    font-size: 1rem;
}

.composer-async-search-right {
    width: 30%;
    float: right;
    font-size: 1.2rem;
    color: #627895;
    text-align: right;
}

.composer-async-search-time {
    float: left;
    font-size: 0.85rem;
    color: #627895;
}

.composer-async-search-time-with-status {
    width: 70%;
}

.composer-async-search-view {
    width: 30%;
    float: right;
    text-align: right;
}

/* Accordion V2 */
.composer-accordion-provider {
    position: relative;
    display: inline-block;
}

.composer-accordion-popup {
    border: 1px solid #BAC6D6;
    box-shadow: 0 3px 6px rgba(0,0,0,0.25);
    padding: 0;
    background: #fff;
    position: absolute;
    z-index: 105;
    top: 100%;
    border-radius: .25rem;
    max-height: 26rem;
}

    .composer-accordion-popup.pop-top {
        top: auto;
        bottom: 100%;
    }

.composer-accordion-loader {
    height: 8rem;
    position: relative;
}

.composer-accordion-content-no-overflow {
    max-height: 19rem;
    width: 25rem;
}

.composer-accordion-content-with-overflow {
    max-height: 19rem;
    overflow: auto;
    width: 20rem;
}

.component-or {
    padding-top: 0.8rem;
    padding-bottom: 0.8rem;
}

.composer-accordion-submit {
    text-align: right;
}

.accordion-list-add-section {
    text-align: center;
    padding-top: 0.8rem;
}

.composer-accordion-content {
    max-height: 19rem;
    overflow-y: auto;
    min-width: 20rem;
}

.composer-accordion-scroll {
    overflow-y: scroll;
}

.accordion-content-spaced {
    padding: .375rem;
}

.accordion-content-border-bottom {
    border-bottom: 1px solid #dee3e8;
}

.accordion-content-maxwidth {
    max-width: 100%;
}

.accordion-content-table-outer {
    display: table;
}

.accordion-content-table-inner {
    display: table-cell;
}

.accordion-content-table-small {
    min-width: 4rem;
    width: 4rem;
}

.accordion-content-table-full {
    width: 100%;
}

.accordion-inline-input {
    width: 15rem;
}

    .accordion-inline-input .btn {
        margin: 0 0 0 0.5rem;
        min-width: 2rem;
    }

.accordion-content-item {
    font-size: .875rem;
    display: block;
    padding: .25rem .5rem;
    cursor: pointer;
}

    .accordion-content-item.selected,
    .accordion-content-item:hover {
        background: rgba(0,118,209, 0.1);
    }

.accordion-content-header {
    font-weight: bold;
    color: #627895;
    text-transform: uppercase;
    font-size: .75rem;
    background: #dee3e8;
    display: block;
    padding: .125rem .375rem;
    margin: .25rem 0;
}

.composer-accordion-info {
    color: #627895;
    padding: .25rem .5rem;
    text-align: center;
}

.composer-accordion-launcher {
    cursor: pointer;
    text-align: center;
    border-radius: .25rem;
    padding: .25rem;
    border: 1px solid #dee3e8;
}

    .composer-accordion-launcher:hover {
        background: rgba(0,118,209, 0.1);
        border-color: #0076D1;
        color: #0076D1;
    }

    .composer-accordion-launcher.active {
        background: rgba(0,118,209, 0.05);
        color: #0076D1;
    }

.composer-row .composer-accordion-launcher {
    border: 0;
}


/* Special coloring */

.composer-operator {
    color: #0275d8;
}

.composer-value {
    color: #fb9012;
}

.composer-selected-field {
    color: #0076D1;
}


/*composer condtion*/
.composer-row {
    padding: 0 .25rem;
    position: relative;
}

    .composer-row > div {
        border: 1px dotted #dee3e8;
        border-width: 1px 0 1px 0;
        padding: .25rem;
        display: flex;
        align-items: center;
    }

        .composer-row > div.invalid {
            border-color: #fb9012;
        }

        .composer-row > div.valid .error-message {
            display: none;
        }

        .composer-row > div:after {
            display: block;
            content: '';
            clear: both;
        }


    .composer-row + .composer-row > div {
        border-top: 0;
    }

    .composer-row:before {
        position: absolute;
        top: 1rem;
        left: -.25rem;
        content: '';
        width: .375rem;
        height: .375rem;
        border-radius: .25rem;
        background: #dee3e8;
        opacity: 0;
    }

.compose-mandatory-condition-item {
    display: inline-block;
    line-height: 1.25rem;
    padding: .25rem .5rem;
    text-align: center;
}

.compose-condition-item {
    display: inline-block;
    padding: 0 .25rem;
}


.composer-controls {
    border-left: 1px dotted #dee3e8;
    color: #0076D1;
    padding: .125rem 0 .125rem .5rem;
    display: inline-block;
    margin-left: auto;
    flex-shrink: 0;
    -ms-flex-shrink: 0;
}

.composer-input-width-full > .form-control,
.composer-input-width-full > .sng-input-wrapper > .form-control,
.composer-input-width-full > .select-wrapper,
.composer-input-width-full > .sng-input-wrapper > .select-wrapper,
.composer-input-width-full > .currency-control,
.composer-input-width-full > .sng-input-wrapper > .currency-control {
    width: 100%;
}

.composer-input-width-small > .form-control,
.composer-input-width-small > .select-wrapper,
.composer-input-width-small > .currency-control {
    width: 8rem;
}

.composer-input-checkbox {
    display: flex;
    flex-wrap: wrap;
}

.composer-input-checkbox-item {
    flex-grow: 0;
    flex-basis: 50%;
}

.conditions-padded-vertical {
    padding-top: .5rem;
    padding-bottom: .5rem;
}

.conditions-padded-full {
    padding-top: 0.5rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

    .conditions-padded-full:last-child {
        padding-bottom: 0.5rem;
    }

/* to overwrite the bootstrap madness we got to get deeeeep */
.conditions-overwrite-btn.btn.btn-sm {
    padding: 0 0.5rem;
}

.conditions-overwrite-btn.btn-primary:active,
.conditions-overwrite-btn.btn-primary:active:focus,
.conditions-overwrite-btn.btn-primary:focus {
    background-color: #e73b4e;
}

/* this is the facto header of the dropdown selects */
/* prevent accidental select of the label/header on cramped list */
.accordion-content-spaced.label {
    user-select: none;
    color: #4E6481;
}

/*
    The special extension to .checkbox, .label custom UI controls
    The reasoning behind is in TFS#14091
    If it works OK we could consider moving it into general solution
    The extensions moves the UI checkbox to the left and the text, wrapped
    to the right - using a media object pattern
*/
.accordion-content-spaced label.checkbox {
    position: relative;
    margin-left: 1.5rem;
    line-height: 1.1875rem;
    vertical-align: middle;
}

    .accordion-content-spaced label.checkbox input ~ span:before {
        position: absolute;
        top: 0;
        left: -1.5rem;
        line-height: 1;
    }

/* animation support within accordion opener */

.accordion-opener-container {
    position: relative;
    z-index: 0;
    overflow: hidden;
}
    /* as the header is transparent - provide fake background for section titles */
    .accordion-opener-container::after {
        position: absolute;
        content: '';
        background-color: #e1e9f5;
        top: 0;
        left: 0;
        right: 0;
        height: 2rem;
    }

    .accordion-opener-container .accordion-header {
        position: relative;
        z-index: 1;
    }

    .accordion-opener-container .accordion-row:active {
        background: rgb(240, 185, 206);
    }

    .accordion-opener-container .accordion-row.accordion-disabled:active {
        background: #fff;
    }

    .accordion-opener-container .accordion-row-collapse {
        position: relative;
        z-index: 0;
        will-change: transform;
    }

        .accordion-opener-container .accordion-row-collapse.sng-animate {
            -webkit-transition: -webkit-transform .1s ease-in-out;
            transition: -webkit-transform .1s ease-in-out;
            transition: transform .1s ease-in-out;
            transition: transform .1s ease-in-out, -webkit-transform .1s ease-in-out;
        }

        .accordion-opener-container .accordion-row-collapse.ng-enter {
            -webkit-transform: translateY(-20%);
            transform: translateY(-20%);
        }

            .accordion-opener-container .accordion-row-collapse.ng-enter.ng-enter-active {
                -webkit-transform: translateY(0);
                transform: translateY(0);
            }

        .accordion-opener-container .accordion-row-collapse.ng-leave {
            -webkit-transform: translateY(0);
            transform: translateY(0);
        }

            .accordion-opener-container .accordion-row-collapse.ng-leave.ng-leave-active {
                -webkit-transform: translateY(-20%);
                transform: translateY(-20%);
            }


.functioncomposer .sidebar > h3 {
    margin-top: 0;
}

#searchDependenciesList a {
    color: #4E6481;
    text-decoration: none;
}

#searchDependenciesList a:hover {
    color: #0076D1;
    text-decoration: none;
}

#searchDependenciesList a .fa{
    color: #768CA9;
}



/*
    Padding and Margin Classes
    Format ({p/m}-{a/x/y/t/r/b/l}-{05/1/2/3})
    Where p or m is padding or margin
    a - all, x/y - x or y axis only, t/r/b/l - top right bottom left only
*/
.pt-05, .p-05, .py-05 {
    padding-top: .5rem !important;
}

.pb-05, .p-05, .py-05 {
    padding-bottom: .5rem !important;
}

.pl-05, .p-05, .px-05 {
    padding-left: .5rem !important;
}

.pr-05, .p-05, .px-05 {
    padding-right: .5rem !important;
}

.mt-05, .ma-05, .m-y-05 {
    margin-top: .5rem !important;
}

.mb-05, .ma-05, .m-y-05 {
    margin-bottom: .5rem !important;
}

.ml-05, .ma-05, .m-x-05 {
    margin-left: .5rem !important;
}

.mr-05, .ma-05, .m-x-05 {
    margin-right: .5rem !important;
}

/* Font size utility classes */
.f-s-0 {
    font-size: .875rem !important;
}

.f-s-1 {
    font-size: 1rem !important;
}

.f-s-2 {
    font-size: 1.5rem !important;
}

.f-s-3 {
    font-size: 2rem !important;
}

.b-r {
    -webkit-border-radius: .25rem;
    -moz-border-radius: .25rem;
    border-radius: .25rem;
}

.full-height {
    height: 100%;
}

.h-100 {
    height: 100%;
}

.w-100 {
    width: 100%;
}

.inline {
    display: inline;
}

.inline-block {
    display: inline-block;
}

.label-light {
    background: #dee3e8;
    color: #627895;
}

    .label-light.label-hover:hover {
        background: #0076D1;
        cursor: pointer;
        color: #fff;
    }

.text-primary {
    color: #5e5b77 !important;
}

.text-accent {
    color: #0076D1 !important;
}

.text-muted {
    color: #627895 !important;
}

.text-danger {
    color: #e73b4e !important;
}

.text-success {
    color: #55c339 !important;
}

.text-warning {
    color: #fb9012 !important;
}

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

.text-secondary {
    color: #211551 !important;
}

.bg-accent {
    background: #0076D1 !important;
    color: #FFFFFF;
}

.bg-secondary {
    background: #211551 !important;
    color: #FFFFFF;
}

.bg-muted {
    background: #627895 !important;
}

.bg-danger {
    background: #e73b4e !important;
}

.bg-warning {
    background: #fb9012 !important;
}

.bg-success {
    background: #55c339 !important;
}

.label-accent {
    background: #0076D1;
}

.label-muted {
    background: #627895;
}

.label-secondary {
    background: #211551;
}

.label-muted {
    background: #627895;
}

.label-danger {
    background: #e73b4e;
}

.label-warning {
    background: #fb9012;
}

.label-success {
    background: #55c339;
}


.ng-link:hover {
    cursor: pointer;
    text-decoration: underline;
}

.d-inline {
    display: inline !important;
}

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

.d-block {
    display: block !important;
}

.d-table {
    display: table !important;
}

/* Utilities / Miscellaneous */

.label-hover {
    background: #BAC6D6;
    color: #fff;
}

    .label-hover:hover {
        background: #0076D1;
        cursor: pointer;
    }

.overflow-visible {
    overflow: visible !important;
}


.fact-board-controls {
    position: fixed;
    z-index: 920;
    background: #fff;
    padding: 0 .25rem;
    top: 0;
    border-bottom-left-radius: .2rem;
    border-bottom-right-radius: .2rem;
    width: 45rem;
    box-shadow: 0 0 0 2px rgba(0,118,209, 0.5), 0 3px 6px rgba(0, 0, 0, 0.15);
    padding: .5rem 1rem;
}

    .fact-board-controls .load-indicator-mini {
        background: #fff;
        height: 3rem;
        z-index: 2;
    }

.fact-select-section {
    /*width: 50%;*/
    float: left;
    padding: .5rem 0 .5rem .5rem;
}

.fact-options-section {
    /*width: 50%;*/
    float: right;
    text-align: right;
    padding: .5rem .5rem 0 .5rem;
}

.fact-select {
    width: 12rem;
}

.fact-add-to {
    color: #fff;
    margin-right: .5rem;
}

.dyno-view-body .grid-section .col {
    transition: padding-bottom 0.2s ease;
}

.factboard-select .dyno-view-body .grid-section .col,
.factboard-select .dv-body .grid-section .col {
    padding-bottom: 1.5rem;
}

/* add some breathing space in factboard mode see: #13459 */
.factboard-select div[dynosection] {
    padding-bottom: 1rem;
}

@media only screen and (max-width: 1024px) {

    .fact-board-controls {
        width: 34rem;
    }

    .fact-select-section,
    .fact-options-section {
        /*width: 100%;
        float: none;
        text-align: center*/
    }

    .fact-select-section {
        /*padding-bottom: 0;*/
    }

    .fact-new {
        padding-top: 0.5rem;
    }
}

@media only screen and (max-width: 576px) {
    .fact-board-controls {
        width: 100%;
    }

    .fact-select {
        width: 100%;
    }

        .fact-select select {
            color: #fff;
        }


    .fact-select-section,
    .fact-options-section {
        /*width: 100%;
        float: none;
        text-align: center*/
    }

    .form-group.fact-add-to {
        margin-bottom: .4rem;
    }

    .form-group.fact-select,
    .form-group.fact-new,
    .form-group.fact-options {
        margin: 0;
    }
}

.factboard-addable {
    transition: margin 0.25s ease;
}

.factboard-tile-default-width-height{
    height:12rem;
    width: 12rem !important;
}

.factboard-tile-header-dropdown{
    margin-left: 9rem !important;
    width: min-content;
}

body.factboard-select .factboard-addable {
    z-index: 1;
    position: relative;
    margin-bottom: 1.5rem;
}

    body.factboard-select .factboard-item-selected:before,
    body.factboard-select .dyno-control.factboard-item-selected:before,
    body.factboard-select .factboard-addable.factboard-item-selected:before,
    body.factboard-select .factboard-item-added:before {
        display: block;
        content: '';
        position: absolute;
        top: .25rem;
        right: .25rem;
        width: .5rem;
        height: .5rem;
        border-radius: .25rem;
        background: rgba(85,195,57, 0.5);
    }


.investigation-title {
    color: #0076D1;
}

.investigation-description {
    flex-grow: 1;
    white-space: pre-line;
}

.investigation-name {
    align-items: center;
}

.area-label {
    color: #ce0037;
    font-weight: bolder;
    font-size: larger;
    margin: .5rem 0 .5rem .5rem;
}

.fact-target-wrapper {
    float: left;
    margin: 0 .5rem .5rem;
    position: relative;
}

.fact-wrapper {
    float: left;
    margin: 0 .5rem .5rem;
    position: relative;
    width: 20rem;
}

/* the bottom most set of controls */
.fact-controls {
    padding: .5rem;
    font-size: 1rem;
    line-height: 1;
    background: rgb(98, 120, 149);
    min-height: 37px;
}

.header-wrapper {
    clear: both;
    width: 100%;
}

.evidence-attachment {
    margin-left: 1.5rem;
    top: -.7rem;
}

.fact-transaction {
    text-align: center;
    height: 10rem;
}

.fact-transaction-label {
    font-size: x-large;
    margin-top: 2rem;
    margin-bottom: 1rem;
}

.fact-transaction-primary-label {
    font-size: medium;
    color: rgb(98, 120, 149);
    margin-top: .5rem;
    margin-bottom: 1.5rem;
}


/* fact file and image share similar LF */

.fact-target,
.fact-image,
.fact-file {
    height: 9rem;
    width: calc(100% - 1rem);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    margin: .5rem;
}

.fact-file {
    position: relative;
}

    .fact-file > div {
        position: absolute;
        top: 0;
        opacity: 0;
    }

/**
    Support different rendering of preview image
*/
/* the default scaling is a contain */
.fact-image[fact-preview-size="contain"] {
    background-size: contain;
    background-position: center;
}
/* the cover - it as many as possible without distortion */
.fact-image[fact-preview-size="cover"] {
    background-size: cover;
    background-position: center;
}
/* above the fold - scale width to fit and align to top */
.fact-image[fact-preview-size="abovethefold"] {
    background-size: 100% auto;
    background-position: 0 0;
}
/* left scale down - scale height to fit and align to left */
.fact-image[fact-preview-size="leftscaledown"] {
    background-size: auto 100%;
    background-position: 0 0;
}

.btn-change-preview-size {
    position: absolute;
    top: 3rem;
    right: .75rem;
    z-index: 1;
    opacity: .3;
    outline: none;
    line-height: 1;
    color: #5e5b77;
}

    .btn-change-preview-size:focus {
        outline: none;
    }

    .btn-change-preview-size svg {
        fill: currentColor;
    }

.btn-change-preview-size {
    opacity: .75;
    color: white;
}

.fact-image > div,
.fact-file > div {
    opacity: 0;
    padding-top: 4rem;
    text-align: center;
    height: 100%;
    width: 100%;
    background: #5e5b77;
}

    .fact-image > div:hover,
    .fact-image > div:hover + div,
    .fact-file > div:hover,
    .fact-file > div:hover + div {
        opacity: .75;
    }

    .fact-image > div > span,
    .fact-file > div > span {
        color: #fff;
        text-align: center;
        height: 100%;
    }

/* extends fact "image" for workview */
.fact-image--workview {
    background-position: -1px -2px;
    background-size: auto 102%;
}

.fact-url {
    cursor: pointer;
    color: #0076D1 !important;
}

.fact-time-ago {
    font-size: .75rem;
    color: #627895;
    float: right;
    padding: .5rem;
    width: 7rem;
    text-align: right;
}


.fact-title {
    height: 1.125rem;
    width: 15rem;
    font-weight: bold;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    font-size: 0.875rem;
}


.fact-title {
    flex-grow: 1;
    text-align: center;
}

.fact-title-bar {
    display: flex;
    padding: .5rem;
    background: #ebf1f7;
}

.fact-url {
    height: 150px;
    width: 300px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}

    .fact-url > div {
        padding-top: 4rem;
        text-align: center;
        height: 100%;
        width: 100%;
    }

        .fact-url > div:hover {
            opacity: .6;
        }

        .fact-url > div > span {
            color: #5e5b77;
            text-align: center;
            height: 100%;
        }

.fact-header {
    width: 100%;
    cursor: pointer;
    position: relative;
    border-radius: .25rem;
    border: .125rem solid #fff;
    background: #dee3e8;
}

    .fact-header > div {
        overflow-y: auto;
        min-height: 100%;
        padding: .5rem;
    }


        .fact-header > div > span {
            text-align: left;
            font-weight: bold;
            color: #627895;
            display: inline-block;
            padding: 0 .5rem;
            width: calc(100% - 12rem);
            max-height: 9rem;
            overflow-y: auto;
        }

            .fact-header > div > span:hover {
                opacity: .75;
            }

.fact-card {
    cursor: pointer;
}

.fact-item-top {
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    font-size: 1rem;
}

.fact-heading {
    padding: .5rem;
}

.wv-col.fact-col {
    padding: 0rem;
}

.fact-cancel-update {
    float: left;
    width: 48%;
}

.fact-save-update {
    float: right;
    width: 48%;
}

.wv-col.fact-col-desc,
.wv-col.fact-col-count {
    width: 20%;
    text-align: left;
}

.wv-col.fact-col-buttons > div {
    width: 10rem;
    float: right;
}

.wv-col.fact-col-buttons.fact-editing-buttons > div {
    width: 20rem;
}

input[type="text"].fact-label {
    font-size: 1.25rem;
    color: #0076D1;
}

input[type="text"].fact-desc {
    font-size: 1rem;
    color: #627895;
}

/* Context buttons on factboard add */
body:not(.factboard-select) .factboard-addable .context-item-btn {
    display: none;
}

.factboard-addable > .context-item-btn span:before {
    content: '\f068';
}

.factboard-addable:not(.factboard-item-selected) > .context-item-btn span:before {
    content: '\f067';
}


body.factboard-select .factboard-addable.dropdown {
    z-index: 2;
}



.factboard-select .event-panel.factboard-addable {
    margin-bottom: 1.5rem;
}

/* Removed facts */

.removed-fact {
    width: 20rem;
    height: 15.25rem;
    border-radius: .25rem;
    background: rgba(0,0,0,0.05);
    padding: 2rem;
    color: #627895;
    text-align: center;
}

@media only screen and (max-width: 1024px) {

    .wv-col.fact-col-desc {
        width: 50%;
        float: left;
    }

    .wv-col.fact-col-count {
        width: 50%;
        float: right;
    }

    .wv-col.fact-col-buttons {
        width: 100%;
        float: right;
    }
}

@media only screen and (max-width: 767px) {

    .wv-col.fact-col-desc {
        width: 50%;
        float: left;
    }

        .wv-col.fact-col-desc > div {
            float: left;
            width: 100%;
            margin: .25rem;
        }

            .wv-col.fact-col-desc > div > h1,
            .wv-col.fact-col-desc > div,
            input[type="text"].fact-label input[type="text"].fact-desc {
                font-size: .875rem;
            }


    .wv-col.fact-col-buttons,
    .wv-col.fact-col-count {
        width: 50%;
        float: right;
    }

        .wv-col.fact-col-buttons > div,
        .wv-col.fact-col-count > div {
            width: 100%;
            float: left;
            margin: .25rem;
        }

        .wv-col.fact-col-buttons > div {
            position: relative;
        }

        .wv-col.fact-col-buttons.fact-editing-buttons,
        .wv-col.fact-col-buttons.fact-editing-buttons > div {
            width: 100%;
        }
}

.btn-icon.btn-link {
    text-align: left;
}

.fb-toggle {
    margin-top: 0.2rem;
    color: #CE0037;
    margin-left: 1.5rem;
}

    .fb-toggle::before {
        display: block;
        position: absolute;
        top: .2rem;
        left: 0;
        height: 1.75rem;
        border-right: 1px solid #dee3e8;
        content: '';
    }

.tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: #352965;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    top: 150%;
    left: 3rem;
    margin-left: -60px;
}

    .tooltiptext::after {
        content: "";
        position: absolute;
        bottom: 100%;
        left: 50%;
        margin-left: -5px;
        border-width: 5px;
        border-style: solid;
        border-color: transparent transparent #352965 transparent;
    }

.toggle:hover .tooltiptext {
    visibility: visible;
}

/* Backgrounds */

.bg-success {
    background-color: #55c339 !important;
}

.bg-warning {
    background-color: #fb9012 !important;
}

.bg-danger {
    background-color: #e73b4e !important;
}

.bg-accent {
    background-color: #0076D1 !important;
}

.bg-secondary {
    background-color: #211551 !important;
}

.bg-muted {
    background-color: #627895 !important;
}

.bg-faded, /* deprecated */
.bg-light {
    background-color: #dee3e8 !important;
}

.bg-success-tr {
    background-color: rgba(85,195,57, 0.15) !important;
}

.bg-warning-tr {
    background-color: rgba(251,144,18, 0.15) !important;
}

.bg-danger-tr {
    background-color: rgba(231,59,78, 0.15) !important;
}

.bg-accent-tr {
    background-color: rgba(0,118,209, 0.15) !important;
}

.bg-secondary-tr {
    background-color: rgba(33,21,81, 0.15) !important;
}

.bg-muted-tr {
    background-color: rgba(98,120,149, 0.15) !important;
}

/* Text coloring */

.text-success {
    color: #55c339 !important;
}

.text-warning {
    color: #fb9012 !important;
}

.text-danger {
    color: #e73b4e !important;
}

.info,
.text-info {
    color: #47ACCA !important;
}

.text-accent {
    color: #0076D1 !important;
}

.text-secondary {
    color: #211551 !important;
}

.text-muted {
    color: #627895 !important;
}

.text-disabled {
    color: #BAC6D6 !important;
}

/* Font size classes */

.fs-1 {
    font-size: 0.875rem !important;
}

.fs-2 {
    font-size: 1rem !important;
}

.fs-3 {
    font-size: 1.125rem !important;
}

.fs-4 {
    font-size: 1.25rem !important;
}

.fs-5 {
    font-size: 1.375rem !important;
}

/* Other font utilities */

.word-wrap {
    word-wrap: break-word;
    white-space: normal;
    height: auto;
}

/* Load indicator classes */

.load-indicator {
    padding: 5%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    min-height: 5rem;
}

.load-indicator.full {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #e1e9f5;
    height: auto;
    z-index: 5;
}

.load-indicator.data-grid {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #e1e9f5;
    height: auto;
    z-index: 5;
    padding: 0%;
    width: 100%;
}

.load-indicator:not(.load-error) > div,
.load-indicator:not(.load-error) > div:before,
.load-indicator:not(.load-error) > div:after {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-animation: load-ind 1.5s infinite ease-in-out;
    animation: load-ind 1.5s infinite ease-in-out;
    background: #5e5b77;
    height: 2rem;
    width: 0.5rem;
    border-radius: 0.25rem;
}

.load-indicator > div {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    position: absolute;
    left: 50%;
    top: 40%;
    margin-top: -1rem;
    opacity: 0.25;
}

.load-indicator-light:not(.load-error) > div,
.load-indicator-light:not(.load-error) > div:before,
.load-indicator-light:not(.load-error) > div:after {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-animation: load-ind-light 1.5s infinite ease-in-out;
    animation: load-ind-light 1.5s infinite ease-in-out;
    background: #fff;
}

.load-indicator-mini {
    min-height: 1.5rem;
    padding: 0.5rem;
    position: relative;
    text-align: center;
}

.load-indicator-mini > div {
    margin-top: -0.125rem;
    display: inline-block;
    position: relative;
}

.load-indicator-mini > div,
.load-indicator-mini > div:before,
.load-indicator-mini > div:after {
    -webkit-animation: load-ind-m 1s infinite ease-in-out;
    animation: load-ind-m 1s infinite ease-in-out;
    background: #BAC6D6;
    height: 0.5rem;
    width: 0.5rem;
    border-radius: 0.5rem;
}

.load-indicator:not(.load-error) > div,
.load-indicator-mini > div {
    -webkit-animation-delay: -0.2s;
    animation-delay: -0.2s;
    margin-left: -0.25rem;
}

.load-indicator.load-error > div {
    width: 5rem;
    text-align: center;
    font-size: 3rem;
    margin-left: -2.5rem;
    margin-top: -3rem;
    color: #BAC6D6;
}

.load-indicator.load-error > div:before {
    content: "\f071";
    font-family: "FontAwesome";
    display: inline-block;
}

.load-indicator:not(.load-error) > div:before,
.load-indicator:not(.load-error) > div:after,
.load-indicator-mini > div:after,
.load-indicator-mini > div:before {
    content: "";
    position: absolute;
    top: 0;
}

.load-indicator:not(.load-error) > div:before,
.load-indicator-mini > div:before {
    animation-delay: -0.4s;
    left: -1.25rem;
    -webkit-animation-delay: -0.4s;
}

.load-indicator-mini > div:after,
.load-indicator > div:after {
    left: 1.25rem;
}

#page > .load-indicator > div {
    top: 15rem;
}

.progress-indicator {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: #e1e9f5;
    padding: 2rem;
    z-index: 6;
    -webkit-transition: opacity 0.4s 0.2s ease;
    transition: opacity 0.4s 0.2s ease;
    opacity: 1;
}

.progress-indicator.ng-hide-remove {
    opacity: 1;
    display: block !important;
}

.progress-indicator.ng-hide {
    opacity: 0;
}

@-webkit-keyframes load-ind {
    0%,
    90%,
    100% {
        -webkit-box-shadow: 0 0 #5e5b77;
        box-shadow: 0 0 #5e5b77;
        height: 2.5rem;
    }

    45% {
        -webkit-box-shadow: 0 -0.75rem #5e5b77;
        box-shadow: 0 -0.75rem #5e5b77;
        height: 3.25rem;
    }
}

@keyframes load-ind {
    0%,
    90%,
    100% {
        -webkit-box-shadow: 0 0 #5e5b77;
        box-shadow: 0 0 #5e5b77;
        height: 2.5rem;
    }

    45% {
        -webkit-box-shadow: 0 -0.75rem #5e5b77;
        box-shadow: 0 -0.75rem #5e5b77;
        height: 3.25rem;
    }
}

@-webkit-keyframes load-ind-light {
    0%,
    90%,
    100% {
        -webkit-box-shadow: 0 0 #fff;
        box-shadow: 0 0 #fff;
        height: 2.5rem;
    }

    45% {
        -webkit-box-shadow: 0 -0.75rem #fff;
        box-shadow: 0 -0.75rem #fff;
        height: 3.25rem;
    }
}

@keyframes load-ind-light {
    0%,
    90%,
    100% {
        -webkit-box-shadow: 0 0 #fff;
        box-shadow: 0 0 #fff;
        height: 2.5rem;
    }

    45% {
        -webkit-box-shadow: 0 -0.75rem #fff;
        box-shadow: 0 -0.75rem #fff;
        height: 3.25rem;
    }
}

@-webkit-keyframes load-ind-m {
    0%,
    100%,
    90% {
        background: rgba(0, 0, 0, 0.08);
    }

    45% {
        background: rgba(0, 0, 0, 0.25);
    }
}

@keyframes load-ind-m {
    0%,
    100%,
    90% {
        background: rgba(0, 0, 0, 0.08);
    }

    45% {
        background: rgba(0, 0, 0, 0.25);
    }
}

/* Search progress indicator */

@-webkit-keyframes search {
    0% {
        top: 0rem;
        left: 0.125rem;
    }

    20% {
        top: 0rem;
        left: 2.5rem;
    }

    33% {
        top: 0rem;
        left: 2.5rem;
    }

    53% {
        top: 1.75rem;
        left: 1.25rem;
    }

    66% {
        top: 1.75rem;
        left: 1.25rem;
    }

    87%,
    100% {
        top: 0;
        left: 0.125rem;
    }
}

@keyframes search {
    0% {
        top: 0rem;
        left: 0.125rem;
    }

    20% {
        top: 0rem;
        left: 2.5rem;
    }

    33% {
        top: 0rem;
        left: 2.5rem;
    }

    53% {
        top: 1.75rem;
        left: 1.25rem;
    }

    66% {
        top: 1.75rem;
        left: 1.25rem;
    }

    87%,
    100% {
        top: 0;
        left: 0.125rem;
    }
}

.search-anim {
    position: relative;
    display: block;
    width: 5rem;
    margin: 0 auto;
}

.search-anim:before,
.search-anim:after {
    font-family: "FontAwesome";
    color: #BAC6D6;
    display: block;
    content: "";
}

.search-anim:before {
    font-size: 4rem;
    line-height: 5.75rem;
    opacity: 0.3;
    content: "\f1c0";
}

.search-anim:after {
    position: absolute;
    top: 0.5rem;
    left: 1rem;
    -webkit-animation: search 4s infinite;
    animation: search 4s infinite;
    content: "\f002";
    font-size: 3rem;
}

/* Alert boxes */

.alert-box {
    padding: 1rem;
    background: rgba(98,120,149, 0.15);
    border: 1px solid rgba(98,120,149, 0.2);
    color: #4E6481;
    border-radius: 0.25rem;
    margin-bottom: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}

.alert-box:last-child {
    margin-bottom: 0;
}

.alert-box .alert-icon {
    font-size: 1.5rem;
    margin-right: 1rem;
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    line-height: 1.5rem;
}

.alert-box .alert-icon:before {
    content: "\f05a";
    font-family: "FontAwesome";
}

.alert-box.accent {
    background: rgba(0,118,209, 0.15);
    border-color: rgba(0,118,209, 0.2);
    color: #0062BD;
}

.alert-box.info .alert-icon:before {
    content: "\f05a";
}

.alert-box.warning {
    background: rgba(251,144,18, 0.15);
    border-color: rgba(251,144,18, 0.2);
    color: #fb9012;
}

.alert-box.warning .alert-icon:before {
    content: "\f06a";
}

.alert-box.success {
    background: rgba(85,195,57, 0.15);
    border-color: rgba(85,195,57, 0.2);
    color: #41AF25;
}

.alert-box.success .alert-icon:before {
    content: "\f058";
}

.alert-box.danger {
    background: rgba(231,59,78, 0.15);
    border-color: rgba(231,59,78, 0.2);
    color: #D3273A;
}

.alert-box.danger .alert-icon:before {
    content: "\f071";
}

.alert-box.info {
    background: rgba(91,192,222, 0.15);
    border-color: rgba(91,192,222, 0.2);
    color: #47ACCA;
}

.alert-box.info .alert-icon:before {
    content: "\f05a";
}

.alert-box-sm {
    padding: 0.5rem;
}

.alert-box-sm .alert-icon {
    font-size: 1rem;
    line-height: 1rem;
}

.alert-box code {
    background: rgba(0, 0, 0, 0.05);
}

/* Flexbox stuff */
.flex-grow {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

.flex-nogrow {
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
}

.flex-shrink {
    -ms-flex-negative: 1;
    flex-shrink: 1;
}

.flex-noshrink {
    -ms-flex-negative: 0;
    flex-shrink: 0;
}
/* separators */

.separator-left:before,
.separator-right:after {
    display: block;
    position: absolute;
    top: 0.5rem;
    bottom: 0.5rem;
    content: "";
}

.separator-left:before {
    left: 0;
    border-left: 1px dotted #BAC6D6;
}

.separator-right:after {
    right: 0;
    border-right: 1px dotted #BAC6D6;
}

/* vertical and horizontal rules. vr is best used within a flexbox model
*/

.vr {
    padding: 0.5rem 0.25rem;
}

.vr:after {
    display: block;
    content: "";
    height: 100%;
    border-left: 1px dotted #BAC6D6;
}

fieldset.hr-text {
    border-top: 2px dotted #BAC6D6;
    padding-left: 0;
}

fieldset.hr-text legend {
    font-size: 0.875rem;
    margin: 0;
    width: auto;
    text-align: left;
    color: #627895;
    padding: 0 0.5rem;
    font-weight: 700;
}

/* Transitions */

.height-transition-start {
    -webkit-transition: max-height 1s ease;
    transition: max-height 1s ease;
    overflow: hidden;
}

/* Alignment */

.align {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.align.align-left {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.align.align-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.align.align-right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.align > div {
    max-width: 100%;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
}

/* font awesome */
.fa-xl {
    font-size: 1.5em;
}



/* Location groups */

.level-number {
    font-size: 1.25rem;
    color: #0076D1;
    padding-bottom: .5rem;
}

.hierarchy-loc-member,
.heirarchy-group-member {
    padding: .375rem .5rem;
    text-align: center;
    min-width: 10rem;
    border: 1px solid rgba(0,118,209,0.15);
    color: #0076D1;
    border-radius: .25rem;
    display: inline-block;
    font-size: .875rem;
    font-weight: bold;
    min-height: 2rem;
    word-break: break-word;
    max-width: 100%;
}

    .hierarchy-loc-member:hover,
    .heirarchy-group-member:hover {
        background: rgba(0,118,209,0.15);
        cursor: pointer;
    }

    .hierarchy-loc-member + div:not(.hierarchy-loc-member) {
        padding: .5rem .5rem .5rem 2rem;
        position: relative;
    }

    .hierarchy-loc-member.selected {
        border-left: 3px solid #0076D1;
    }

    .hierarchy-loc-member + div:not(.hierarchy-loc-member):before {
        display: block;
        content: '';
        width: 1.25rem;
        height: 1.5rem;
        border: 1px dotted #BAC6D6;
        border-width: 0 0 1px 1px;
        position: absolute;
        left: .75rem;
        top: 0;
    }

.heirarchy-group-member {
    margin-bottom: .5rem;
    width: calc(100% - 1.5rem);
}

    .heirarchy-group-member.locked {
        width: 100%;
    }

        .hierarchy-loc-member.locked:before,
        .heirarchy-group-member.locked:before {
            float: left;
            opacity: .25;
            margin-right: .25rem;
            content: '\f023';
            font-family: 'FontAwesome';
        }

.heirarchy-member-delete {
    width: 1rem;
    text-align: center;
    padding: .125rem 0;
    display: inline-block;
    color: #0076D1;
}

.hierarchy-search:first-child{
    border-top: 1px solid #dee3e8;
}

.saving-indicator {
    width: 1.5rem;
    height: 2rem;
    float: left;
    position: relative;
    padding: .5rem .125rem;
}

    .saving-indicator .fa {
        position: absolute;
        transition: opacity .75s ease;
        opacity: 1;
    }

        .saving-indicator .fa.ng-hide {
            opacity: 0;
        }

    .saving-indicator .ng-show-animate {
        opacity: 1;
    }

.show-ar-users {
	margin-left: auto !important;
}

	.show-ar-users button {
		color: #627895;
	}

/* platform help related style */
/*
    ===================================
    components
    ===================================
*/
/* inline help directive */

sng-local-help-item,
[sng-local-help-item] {
    display: inline-block;
    white-space: nowrap;
}

sng-local-help-item a,
sng-local-help-item button,
[sng-local-help-item] a,
[sng-local-help-item] button {
    display: inline-block;
    position: relative;
    z-index: 1;
    top: auto;
    float: none;
    vertical-align: middle;
    text-align: center;
    border-radius: 50%;
    line-height: 1;
    border: none;
}

sng-local-help-item a:focus,
sng-local-help-item button:focus,
[sng-local-help-item] a:focus,
[sng-local-help-item] button:focus {
    border: none;
    box-shadow: none;
}

sng-local-help-item .help-icon,
sng-local-help-item .help-icon,
[sng-local-help-item] .help-icon,
[sng-local-help-item] .help-icon {
    z-index: 1;
    top: auto;
    float: none;
    margin-left: auto;
    font-size: 1.25rem;
}

sng-local-help-item .help-icon:before,
sng-local-help-item .help-icon:before,
[sng-local-help-item] .help-icon:before,
[sng-local-help-item] .help-icon:before {
    content: '\f29c';
    color: #0076D1;
}


/* custom rules for sngFullscreen controls */

/* a close button within a lightbox title (header) */
.lightbox-title .sng-fullscreen-btn {
    position: absolute;
    top: .875rem;
    right: calc(1.25rem + 2 * .875rem);
    font-size: 1.25rem;
    cursor: pointer;
    z-index: 101;
    color: #fff;
}

.lightbox-title .sng-fullscreen-btn:hover {
    color: #0076D1;
}

.lightbox-title .sng-fullscreen-btn:focus {
    outline: 0;
    border-radius: .5rem;
    -webkit-box-shadow: 0 0 0 3px rgba(0,118,209, .5);
    box-shadow: 0 0 0 3px rgba(0,118,209, .5);
    color: #0076D1;
}


#dsn-visual-container .form-group {
    padding-bottom: 1.2rem;
}

.fti-container {
    padding-top: 1rem;
}

    .fti-container .header {
        top: 0;
        left: 0;
        z-index: 2;
        background: #fff;
        box-shadow: rgba(0, 0, 0, 0.15);
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow-x: hidden;
    }

.fti-row {
    background: #e1e9f5;
    border: 2px solid #fff;
    display: table;
    width: 100%;
}

    .fti-row + .fti-row {
        border-top: 0;
    }

.ia-tile-row h2 {
    margin: 0 0 .5rem;
}

/* inline help  within FTI tile */
.fti-row sng-local-help-item,
.ia-tile-row sng-local-help-item {
    -webkit-transform: translate(5px, -1px);
    transform: translate(5px, -1px);
}

.priority-col {
    width: 1rem;
    background: #55c339;
    padding: .25rem;
    position: relative;
    vertical-align: middle;
}

.wv-sng-zugo .zugo-header {
    display: none;
}

.wv-sng-zugo .zugo-body table td.priority-col div {
    margin: auto;
}

/* This style is used for the first column to show red/amber/green icon */
.outlier-metric-sng-zugo .zugo-body table th:nth-child(1),
.outlier-metric-sng-zugo .zugo-body table td:nth-child(1) {
    width: 1rem;
    padding: 0;
    background-color: transparent;
}

.outlier-metric-sng-zugo .zugo-body table th:nth-child(1) .sort-spinner {
    display: none;
}

.outlier-metric-sng-zugo .zugo-body th:nth-child(1) .fa-sort,
.outlier-metric-sng-zugo .zugo-body th:nth-child(1) .fa-sort-asc,
.outlier-metric-sng-zugo .zugo-body th:nth-child(1) .fa-sort-desc {
    margin: auto;
    margin-top: .5rem !important;
    align-self: end;
}

    .priority-col div, .priority-col div:before, .priority-col div:after {
        width: .5rem;
        height: 0.3875rem;
        background: #fff;
        border-radius: .5rem;
    }

    .priority-col div {
        position: relative;
    }

        .priority-col div:before, .priority-col div:after {
            display: block;
            content: '';
            position: absolute;
            left: 0;
        }

        .priority-col div:before {
            top: -.75rem;
        }

        .priority-col div:after {
            bottom: -.75rem;
            top: auto;
        }

.red .priority-col {
    background: #e73b4e !important;
}

.green .priority-col {
    background: #55c339 !important;
}

    .green .priority-col div,
    .green .priority-col div:before,
    .amber .priority-col div:before {
        background: rgba(255, 255, 255, 0.4);
    }

.amber .priority-col {
    background: #fb9012 !important;
}

.amber .fti-message {
    color: #fb9012;
}

    .amber .fti-message .fa:before {
        content: '\f06a';
    }

.red .fti-message {
    color: #e73b4e;
}

    .red .fti-message .fa:before {
        content: '\f071';
    }

.green .fti-message .fa {
    display: none;
}

/* not processed tile */
.fti-row.notprocessed .priority-col {
    background: #627895;
}

.fti-row.notprocessed .fti-message {
    color: #627895;
}

.fti-row.notprocessed .fti-message .fa:before {
    content: '\f06a';
}

.fti-row.notprocessed .btn-link {
    display: none;
}

.fti-row:after {
    display: block;
    clear: both;
    content: '';
}

.priority-col, .priority-col + .container-fluid {
    display: table-cell;
}

    .priority-col + .container-fluid {
        width: calc(100% - 1rem);
        float: left;
    }

.fti-container .header + .fti-body {
    height: calc(100% - 4.5rem);
    top: 4.5rem;
    padding-top: 1rem;
}

.synopsis-preview {
    background: #ebf1f7;
    padding: 1rem;
    border-radius: .25rem;
    min-height: 100%;
    border: 1px solid #e1e9f5;
}

.target-search-validation {
    background: #ebf1f7;
    padding: 1rem;
    border-radius: .25rem;
    border: 1px solid #e1e9f5;
}

    .target-search-validation ul {
        list-style: none;
    }

    .target-search-validation .fa {
        color: #627895;
    }

    .target-search-validation .fa-check {
        color: #55c339;
    }

    .target-search-validation .fa-times {
        color: #e73b4e;
    }

.supporting-search {
}

    .supporting-search .supporting-search-title, .supporting-search .supporting-search-subtitle {
        color: #627895;
        font-weight: 600;
        padding-bottom: 1rem;
    }

    .supporting-search .supporting-search-title {
        font-size: 1.125rem;
    }

    .supporting-search .supporting-search-subtitle {
        font-size: 1rem;
    }

    .supporting-search .supporting-search-sidebar {
        border-right: 1px dotted #dee3e8;
    }

    .supporting-search .supporting-search-navlink {
        color: #4E6481;
        border-left: 3px solid transparent;
        margin-left: -1rem;
        padding-left: 1.1rem;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

        .supporting-search .supporting-search-navlink.active {
            border-left: 3px solid #0076D1;
            color: #0076D1;
        }

.param-mapping-group {
    position: relative;
    border: 1px dotted #d0dde8;
    border-left: 3px solid;
    border-radius: 0 .25rem .25rem 0;
    margin-bottom: .5rem;
    border-left-color: rgb(14,114,161);
}

.guidelines-list {
    list-style: none;
    padding: 0;
    margin: .5rem, 0 0;
    max-height: 24rem;
    max-width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
}

    .guidelines-list li {
        position: relative;
        padding: .5rem;
        max-width: 40rem;
        background: #ebf1f7;
        border: 1px solid #fff;
        font-size: .875rem;
        padding-right: 1.5rem;
        word-break: break-word;
    }

    .guidelines-list .fa-remove {
        color: #627895;
        cursor: pointer;
        padding: .25rem;
        position: absolute;
        right: .25rem;
        top: .35rem;
    }

        .guidelines-list .fa-remove:hover {
            color: #0076D1;
        }

/* override for BS badge, requires .vw-badge */

.badge.wv-priority-badge {
    font-weight: normal;
    font-size: .7em;
    color: #fff;
    background: #0076D1;
    vertical-align: text-bottom;
    visibility: hidden;
}

.wv-priority-badge.priority-1,
.wv-priority-badge.priority-2,
.wv-priority-badge.priority-3 {
    visibility: visible;
}

.wv-priority-badge.priority-1 {
    background: #55c339;
}

.wv-priority-badge.priority-2 {
    background: #fb9012;
}

.wv-priority-badge.priority-3 {
    background: #e73b4e;
}

/*override display for searches optional .wic - means work item composer*/
.wic-nav-item {
    display: contents;
    position: relative;
}