/* Move down content because we have a fixed navbar that is 50px tall */
body {
    padding-top: 50px;
    padding-bottom: 20px;
    margin: 0;
    font-weight: 400;
    text-align: left;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

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


/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
    .jumbotron {
        margin-top: 20px;
    }

    .body-content {
        /*padding: 0;*/
    }
}

/* bobs custom styles */
.full {
    height: 100vh;
    height: 100%;
    /*background: url(http://placehold.it/1920x1080) no-repeat center center fixed;*/
    /*background: url('../images/belong2us.png') no-repeat center center fixed;*/
    background-image: url('../images/belong2us.png');
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: left center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

    /* override default navbar break points and more*/
    .navd800 {
        padding-right: 10px;
        height: auto;
    }
    .navbar-fixed-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse {
         max-height: none; 
    }

/* these were 1151 and 1150 pixels before help added */
/* this was 1214 before adding white label branding */
    @media (min-width: 1316px) {
        .navd800 {
            height: 51px;
        }
        /* shrinks navbar height so color bars on menu item hover show under the navbar */
    }
    /* collapsing navbar for smaller devices - changed from 1213px for new help item */
    /* wider version was 1330px */
/*    @media (max-width: 1213px) {
    .navbar-header {
        float: none;
    }

    .navbar-left, .navbar-right {
        float: none !important;
    }

    .navbar-toggle {
        display: block;
    }

    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }

    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
    }

    .navbar-collapse.collapse {
        display: none;
    }

    .navbar-nav {
        float: none !important;
        margin-top: 7.5px;
    }

        .navbar-nav > li {
            float: none;
        }

            .navbar-nav > li > a {
                padding-top: 10px;
                padding-bottom: 10px;
            }

    .collapse.in {
        display: block !important;
    }
}
*/
.mb-0 {
        margin-bottom: 0 !important;
    }

    .mb-1 {
        margin-bottom: 1px !important;
    }

    .mb-5 {
        margin-bottom: 5px !important;
    }
    /* for buttons when wrapping */
    .mb-8 {
        margin-bottom: 8px !important;
    }

    .mb-10 {
        margin-bottom: 10px !important;
    }

    .mb-15 {
        margin-bottom: 15px !important;
    }

    .mb-20 {
        margin-bottom: 20px !important;
    }

    .mb-30 {
        margin-bottom: 30px !important;
    }

    .mt-30 {
        margin-top: 30px !important;
    }

    .mt-0 {
        margin-top: 0 !important;
    }

    .mt-3em {
        margin-top: 3em !important;
    }

    .mt-5 {
        margin-top: 5px !important;
    }

    .mt-7 {
        margin-top: 7px !important;
    }

    .mt-8 {
        margin-top: 8px !important;
    }

    .mt-10 {
        margin-top: 10px !important;
    }

    .mt-20 {
        margin-top: 20px !important;
    }

    .mtb-10 {
        margin: 10px 0 !important;
    }

    .mtb-20 {
        margin: 20px 0
    }

    .mrl-0 {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .mrl-5 {
        margin-right: 5px !important;
        margin-left: 5px !important;
    }

    .mrl-10 {
        margin-right: 10px;
        margin-left: 10px;
    }

    .mrl-20 {
        margin-right: 20px;
        margin-left: 20px;
    }

    .mr-2em {
        margin-right: 2em;
    }

    .ml-0 {
        margin-left: 0px !important;
    }

    .ml-5 {
        margin-left: 5px !important;
    }

    .ml-10 {
        margin-left: 10px !important;
    }

    .ml-15 {
        margin-left: 15px !important;
    }

    .ml-20 {
        margin-left: 20px !important;
    }

    .ml-25 {
        margin-left: 25px !important;
    }

    .mr-0 {
        margin-right: 0 !important;
    }

    .mr-5 {
        margin-right: 5px !important;
    }

    .mr-10 {
        margin-right: 10px !important;
    }

    .mr-20 {
        margin-right: 20px !important;
    }

    .nomargin {
        margin: 0;
    }

    .pad-0 {
        padding: 0 !important;
    }

    .pad-2 {
        padding: 2px !important;
    }

    .pad-4 {
        padding: 4px !important;
    }

    .pad-5 {
        padding: 5px;
    }

    .pad-10 {
        padding: 10px;
    }

    .pad-15 {
        padding: 15px;
    }

    .prl-0 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .prl-5 {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }

    .prl-20 {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .pl-0 {
        padding-left: 0 !important;
    }

    .pl-5 {
        padding-left: 5px!important;
    }

    .pl-3 {
        padding-left: 3px!important;
    }

    .pl-10 {
        padding-left: 10px;
    }

    .pl-15 {
        padding-left: 15px;
    }

    .pl-20 {
        padding-left: 20px;
    }

    .pl-20i {
        padding-left: 20px !important;
    }

    .pl-fix {
        padding-left: 0 !important;
    }

    @media screen and (max-width: 768px) {
        .pl-fix {
            padding-left: 15px !important;
        }

        .group-fix {
            margin: 0 !important;
        }
    }

    .pr-fix {
        padding-right: 5px !important;
    }

    @media screen and (max-width: 768px) {
        .pr-fix {
            padding-right: 15px !important;
        }
    }

    .pr-0 {
        padding-right: 0 !important;
    }

    .pr-5 {
        padding-right: 5px !important;
    }

    .pr-7 {
        padding-right: 7px;
    }

    .pr-10 {
        padding-right: 10px;
    }

    .pr-14 {
        padding-right: 14px;
    }

    .pr-15 {
        padding-right: 15px;
    }

    .pr-20 {
        padding-right: 20px;
    }

    .pt-0 {
        padding-top: 0 !important;
    }

    .pt-3 {
        /*padding-top: 3px !important;*/
    }

    .pt-5 {
        padding-top: 5px !important;
    }

    .pt-10 {
        padding-top: 10px !important;
    }

    .pt-20 {
        padding-top: 20px !important;
    }

    .ptb-20 {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .ptb-10 {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .ptb-5 {
        padding-top: 5px;
        padding-bottom: 5px;
    }

    .pb-20 {
        padding-bottom: 20px !important;
    }

    .pb-10 {
        padding-bottom: 10px !important;
    }

    .pb-5 {
        padding-bottom: 5px !important;
    }

    .pb-0 {
        padding-bottom: 0 !important;
    }

    .pad-5-16 {
        padding: 5px 16px !important;
    }

    .pad-r-46 {
        padding-right: 46px;
    }
    /* for dashboard chart headings to wrap for download button when mobile */
    .fpx-12 {
        font-size: 12px;
    }

    .fem-1-2 {
        font-size: 1.2em;
    }

    .block {
        display: block;
    }

    .inline-block {
        display: inline-block
    }

    .vertMiddle {
        vertical-align: middle;
    }

    .vertMiddle-i {
        vertical-align: middle !important;
    }

    .vertTextBottom {
        vertical-align: text-bottom;
    }

    .vertBottom {
        vertical-align: bottom !important;
    }

    .vertTop {
        vertical-align: top !important;
    }

    .c-999 {
        color: #999999;
    }

    .c-666 {
        color: #666;
    }

    .c-333 {
        color: #333;
    }

    .fa-xl {
        font-size: 1.5em;
        line-height: .75em;
        vertical-align: -.14em;
    }

    .fa-1pt5x {
        font-size: 1.5em !important;
    }

    .fa-1pt2x {
        font-size: 1.2em !important;
    }

    .fa-2x-i {
        font-size: 2em !important;
    }

    .fa-3pt5x-i {
        font-size: 3.5em !important;
    }

    .fa-4x-i {
        font-size: 4em !important;
    }

    .f-large {
        font-size: large !important;
    }

    .f-bold {
        font-weight: bold !important;
    }

    .f-smaller {
        font-size: smaller;
    }

    .font-90 {
        font-size: 90% !important;
    }

    .pointer {
        cursor: pointer;
    }
    /* show pointer on hover over list item */
    .float-left {
        float: left;
    }

    .float-right {
        float: right;
    }

    .top-10 {
        top: 10px;
    }

    .text-muted-999 {
        color: #999;
    }

    .text-yellow {
        color: yellow;
    }

    .text-warning-bob {
        color: #f0ad4e;
    }

    .fa-wobble-fix {
        -webkit-filter: blur(0);
    }
    /* fixes font-awesome animated icon wobble */
    .visible {
        display: block;
    }

    .hidden {
        display: none !important;
    }

    .italic {
        font-style: italic;
    }

    .text-left-i {
        text-align: left !important;
    }

    .noborder-noshadow {
        border: none;
        webkit-box-shadow: none;
        box-shadow: none;
    }

    .nowrap {
        white-space: nowrap;
    }

    .ws-normal {
        white-space: normal !important;
    }

    .caps {
        text-transform: uppercase;
    }

    .center {
        text-align: center;
    }

    .col-centered {
        float: none !important;
        margin: 0 auto;
    }
    /* center a bootstrap column */
    .transparent {
        opacity: 0;
    }

    .opacity-7 {
        opacity: 0.7;
    }

    .opacity-8 {
        opacity: 0.8;
    }

    .td-width-sm {
        width: 50px;
    }

    .w-100 {
        width: 100% !important;
    }

    .w-66px {
        width: 66px !important;
    }

    .w-auto {
        width: auto !important;
    }

    .max-w-150 {
        max-width: 150px;
    }

    .w-200 {
        width: 200px!important;
    }
    .w-250 {
        width: 250px !important;
    }
    .w-300 {
        width: 300px !important;
    }

    .num-8em-w {
        width: 8em;
    }

    .pos-rel {
        position: relative;
    }

    .text-decoration-none {
        text-decoration: none !important;
    }

    .text-normal {
        font-weight: normal;
    }

    .no-hover:hover {
        text-decoration: none !important;
    }

    .text-italic {
        font-style: italic;
    }

    .outline-none {
        outline: none;
    }

    .fs-xs {
        font-size: .75em !important;
    }

    .fs-8-em {
        font-size: .8em !important;
    }

    .fs-sm {
        font-size: 1em !important;
    }

    .ul-nodisc {
        list-style-type: none;
        padding-inline-start: 10px !important
    }
    .url-wrap { overflow-wrap: break-word; }

    /* fix broken stuff via hacks */
    .table-purple > tbody > tr > th {
        background-color: var(--color-surface-inset, #f1f5f9) !important;
    }

    .table-purple > thead {
        background-color: var(--color-surface-inset, #f1f5f9) !important;
    }

    .table-callview > tbody > tr > th, .table-callview > thead {
        background-color: var(--color-surface-inset, #f1f5f9) !important;
    }

    .table > tbody > tr > td {
        vertical-align: middle;
    }
    /* change bootstrap vertical-align: top */
    .tbl-wrapper, floatThead-wrapper {
        overflow-y: auto;
    }

        .tbl-wrapper table thead {
            background-color: var(--color-surface-inset, #f1f5f9);
        }

    .floatThead-wrapper table thead {
        background-color: var(--color-surface-inset, #f1f5f9);
    }

    .lh-adjust {
        line-height: .6em;
    }
    /* adjust for font-awesome 2x icons in navbar menu */

    /* Vertially Center Bootstrap 3 Modal Using Flexbox */
    .centered-modal.in {
        display: flex !important;
    }

    .centered-modal .modal-dialog {
        margin: auto;
    }
    /*#popNotes modal-backdrop { z-index: -1!important; }
#popNotes modal-backdrop.in { z-index: -1!important; }*/
    #popNotes > #modal-backdrop, #popNotes > #modal-backdrop.in {
        display: none !important;
    }

    .hideBackdrop {
        width: 0px !important;
        height: 0px !important;
        position: relative !important;
    }

    .timepicker_wrap {
        width: 270px !important;
    }

    .mapWrapper {
        height: 360px;
        border: solid 1px #ccc;
    }

    .text-purple {
        color: #8557a2;
    }

        .text-purple:hover, .text-purple:active, .text-purple:focus {
            color: #774E8F !important;
            text-decoration: none !important;
        }

    .text-yellow-bob {
        color: #ffc966;
    }

    .chosen-multi-label {
        padding-top: 11px !important;
    }
    /* adjust for chosen multiple select height and bootstrap label in forms */
    .rangeslider__fill {
        background: #A66FDD !important;
    }
    /* override rangefinder green slider bar */
    /* pre hack to wrap */
    pre {
        white-space: pre-wrap;
        word-wrap: break-word;
        text-align: justify;
    }
    /* radio and check box fixes */
    #MainContent_radAudioMethod1, #MainContent_radAudioMethod2 {
        margin-right: 5px;
    }

    /* override select 2 navbar client dropdown box styles */
    .border-r-none {
        border-right: none;
    }

    /* some styles for huge number lists in unordered lists */
    #NumberList {
        list-style-type: none;
        padding-left: 0;
    }

        #NumberList > li {
            display: inline-block;
            width: 150px;
            border-bottom: 1px solid #efefef;
            margin-top: 5px;
        }

    #NumberList-TagVals {
        list-style-type: none;
        padding-left: 0;
    }

        #NumberList-TagVals > li {
            display: inline-block;
            width: 250px;
            border-bottom: 1px solid #efefef;
            margin-top: 5px;
        }

    @media (max-width: 992px) {
        #NumberSearch {
            margin-top: 0 !important;
            float: none !important;
        }
    }

    #MainContent_chkCustomerReports, #MainContent_chkGroupFeatures, #MainContent_chkGroupReports {
        list-style-type: none;
    }

        #MainContent_chkCustomerReports > li, #MainContent_chkGroupFeatures > li, #MainContent_chkGroupReports > li {
            display: inline-block;
            width: 190px;
            margin-top: 5px;
        }

            #MainContent_chkCustomerReports > li > input, #MainContent_chkGroupFeatures > li > input, #MainContent_chkGroupReports > li > input {
                width: 20px;
                vertical-align: top;
            }

        #MainContent_chkGroupFeatures > li {
            width: 252px;
        }
    /* end of checkbox list and radio adjustments */

    /* client selector select2 mods we probably don't need anymore */
    .select2-container--bootstrap {
        /*width: 256px !important;*/
    }

    /* select2 placeholder fix */
    .select2-container .select2-selection__rendered > *:first-child.select2-search--inline {
        width: 100% !important;
    }

        .select2-container .select2-selection__rendered > *:first-child.select2-search--inline .select2-search__field {
            width: 100% !important;
        }

    div.select2-group-pad > span > span > span.select2-selection.select2-selection--single {
        height: 26px;
        background-color: #222;
        border-color: #999;
        border-left: none;
    }

    .select2-addon {
        background-color: #444;
        height: 26px;
        border-color: #999;
    }

    #select2-ddlUserImpersonate-container, span#select2-ctl00_ddlUserImpersonate-container,
    #select2-ClientSelector-container, span#select2-ctl00_ClientSelector-container {
        margin-top: -2px !important;
        color: #ccc !important;
    }

    .userSelect {
        width: 240px !important;
    }

    .select2-group-pad {
        margin-top: 8px;
    }

    .select2-addon span {
        line-height: 0 !important;
        color: white;
    }
    /* end fix broken stuff via hacks */

    /* panel customizations for dashboard */
    .panel .panel-heading .panel-actions {
        float: right;
        margin-top: -.3em;
        /*margin-right: -15px;
    height: 40px;
    font-size: 0;*/
    }

    .panel .panel-title-dash {
        margin-top: 0;
        margin-bottom: 0;
        color: inherit;
    }

    .huge {
        font-size: 2rem;
        font-weight: 700;
        letter-spacing: -0.025em;
        color: inherit;
    }

    .card-subtext {
        font-size: 1.1em;
        color: inherit;
        font-weight: 500;
        opacity: 0.85;
    }

    /* modernized dashboard tile colors - white card with accent border */
    .bg-primary-muted {
        background-color: var(--color-surface-card, #fff) !important;
        color: var(--color-text-primary, #0f172a) !important;
        border-left: 4px solid #20a8d8 !important;
        box-shadow: var(--shadow-card, 0 1px 3px rgba(0,0,0,0.04));
        border-radius: var(--radius-lg, 0.75rem);
    }

    .bg-info-muted {
        background-color: var(--color-surface-card, #fff) !important;
        color: var(--color-text-primary, #0f172a) !important;
        border-left: 4px solid #63c2de !important;
        box-shadow: var(--shadow-card, 0 1px 3px rgba(0,0,0,0.04));
        border-radius: var(--radius-lg, 0.75rem);
    }

    .bg-warning-muted {
        background-color: var(--color-surface-card, #fff) !important;
        color: var(--color-text-primary, #0f172a) !important;
        border-left: 4px solid #ffc107 !important;
        box-shadow: var(--shadow-card, 0 1px 3px rgba(0,0,0,0.04));
        border-radius: var(--radius-lg, 0.75rem);
    }

    .bg-danger-muted {
        background-color: var(--color-surface-card, #fff) !important;
        color: var(--color-text-primary, #0f172a) !important;
        border-left: 4px solid #f86c6b !important;
        box-shadow: var(--shadow-card, 0 1px 3px rgba(0,0,0,0.04));
        border-radius: var(--radius-lg, 0.75rem);
    }

    .bg-success-muted {
        background-color: var(--color-surface-card, #fff) !important;
        color: var(--color-text-primary, #0f172a) !important;
        border-left: 4px solid #4dbd74 !important;
        box-shadow: var(--shadow-card, 0 1px 3px rgba(0,0,0,0.04));
        border-radius: var(--radius-lg, 0.75rem);
    }

    .bg-secondary-muted {
        background-color: var(--color-surface-card, #fff) !important;
        color: var(--color-text-primary, #0f172a) !important;
        border-left: 4px solid #6c757d !important;
        box-shadow: var(--shadow-card, 0 1px 3px rgba(0,0,0,0.04));
        border-radius: var(--radius-lg, 0.75rem);
        opacity: 1;
    }

    .text-white {
        color: white !important;
    }

    /* c3 custom styles */
    .c3-legend-item {
        fill: #999;
    }

    .c3-axis.c3-axis-x {
        fill: #999;
    }

    .c3-axis.c3-axis-y {
        fill: #999;
    }

    .panel-success {
        /*border-color: #3A9645;*/
        border: 1px solid rgba(58, 150, 69, 0.6 ) !important;
    }

        .panel-success > .panel-heading {
            /*color: #3c763d !important;*/
            color: white;
            background-color: #3A9645 !important;
            border-color: #3A9645 !important;
        }

    .panel-accuroute {
        border: 1px solid rgba(119, 78, 143, 0.6) !important;
    }

        .panel-accuroute > .panel-heading {
            color: #3c763d !important;
            background-color: #8557a2;
            border-color: #774E8F;
            opacity: .9;
        }

    .panel-primary {
        border: 1px solid rgba(51, 122, 183, 0.4) !important;
    }
    /* custom button colors to match some bootstrap 4 styles */
    .btn-secondary {
        color: #23282c;
        background-color: #c8ced3;
        border-color: #c8ced3
    }

        .btn-secondary:hover {
            color: #23282c;
            background-color: #b3bbc2;
            border-color: #acb5bc
        }

        .btn-secondary:focus,
        .btn-secondary.focus {
            box-shadow: 0 0 0 .2rem rgba(200, 206, 211, .5)
        }

        .btn-secondary.disabled,
        .btn-secondary:disabled {
            color: #23282c;
            background-color: #c8ced3;
            border-color: #c8ced3
        }

        .btn-secondary:not(:disabled):not(.disabled):active,
        .btn-secondary:not(:disabled):not(.disabled).active,
        .show > .btn-secondary.dropdown-toggle {
            color: #23282c;
            background-color: #acb5bc;
            border-color: #a5aeb7
        }

            .btn-secondary:not(:disabled):not(.disabled):active:focus,
            .btn-secondary:not(:disabled):not(.disabled).active:focus,
            .show > .btn-secondary.dropdown-toggle:focus {
                box-shadow: 0 0 0 .2rem rgba(200, 206, 211, .5)
            }

    .btn-light {
        color: #23282c;
        background-color: #f0f3f5;
        border-color: #f0f3f5
    }

        .btn-light:hover {
            color: #23282c;
            background-color: #d9e1e6;
            border-color: #d1dbe1
        }

        .btn-light:focus,
        .btn-light.focus {
            box-shadow: 0 0 0 .2rem rgba(240, 243, 245, .5)
        }

        .btn-light.disabled,
        .btn-light:disabled {
            color: #23282c;
            background-color: #f0f3f5;
            border-color: #f0f3f5
        }

        .btn-light:not(:disabled):not(.disabled):active,
        .btn-light:not(:disabled):not(.disabled).active,
        .show > .btn-light.dropdown-toggle {
            color: #23282c;
            background-color: #d1dbe1;
            border-color: #cad4dc
        }

            .btn-light:not(:disabled):not(.disabled):active:focus,
            .btn-light:not(:disabled):not(.disabled).active:focus,
            .show > .btn-light.dropdown-toggle:focus {
                box-shadow: 0 0 0 .2rem rgba(240, 243, 245, .5)
            }

    .btn-dark {
        color: #fff;
        background-color: #2f353a;
        border-color: #2f353a
    }

        .btn-dark:hover {
            color: #fff;
            background-color: #1e2225;
            border-color: #181b1e
        }

        .btn-dark:focus,
        .btn-dark.focus {
            color: #fff;
            box-shadow: 0 0 0 .2rem rgba(47, 53, 58, .5)
        }

        .btn-dark.disabled,
        .btn-dark:disabled {
            color: #fff;
            background-color: #2f353a;
            border-color: #2f353a
        }

        .btn-dark:not(:disabled):not(.disabled):active,
        .btn-dark:not(:disabled):not(.disabled).active,
        .show > .btn-dark.dropdown-toggle {
            color: #fff;
            background-color: #181b1e;
            border-color: #121517
        }

            .btn-dark:not(:disabled):not(.disabled):active:focus,
            .btn-dark:not(:disabled):not(.disabled).active:focus,
            .show > .btn-dark.dropdown-toggle:focus {
                box-shadow: 0 0 0 .2rem rgba(47, 53, 58, .5)
            }

    .btn-darkgreen {
        color: #ffffff;
        background-color: #449d44;
        border-color: #398439;
    }

        .btn-darkgreen:focus,
        .btn-darkgreen.focus {
            color: #ffffff;
            background-color: #449d44;
            border-color: #255625;
        }

        .btn-darkgreen:hover {
            color: #ffffff;
            background-color: #3c763d;
            border-color: #398439;
        }

        .btn-darkgreen:active,
        .btn-darkgreen.active,
        .open > .dropdown-toggle.btn-darkgreen {
            color: #ffffff;
            background-color: #449d44;
            border-color: #398439;
        }

            .btn-darkgreen:active:hover,
            .btn-darkgreen.active:hover,
            .open > .dropdown-toggle.btn-darkgreen:hover,
            .btn-darkgreen:active:focus,
            .btn-darkgreen.active:focus,
            .open > .dropdown-toggle.btn-darkgreen:focus,
            .btn-darkgreen:active.focus,
            .btn-darkgreen.active.focus,
            .open > .dropdown-toggle.btn-darkgreen.focus {
                color: #ffffff;
                background-color: #398439;
                border-color: #255625;
            }

        .btn-darkgreen:active,
        .btn-darkgreen.active,
        .open > .dropdown-toggle.btn-darkgreen {
            background-image: none;
        }

        .btn-darkgreen.disabled:hover,
        .btn-darkgreen[disabled]:hover,
        fieldset[disabled] .btn-darkgreen:hover,
        .btn-darkgreen.disabled:focus,
        .btn-darkgreen[disabled]:focus,
        fieldset[disabled] .btn-darkgreen:focus,
        .btn-darkgreen.disabled.focus,
        .btn-darkgreen[disabled].focus,
        fieldset[disabled] .btn-darkgreen.focus {
            background-color: #5cb85c;
            border-color: #4cae4c;
        }

        .btn-darkgreen .badge {
            color: #5cb85c;
            background-color: #ffffff;
        }

    /* custom text colors */
    .text-secondary {
        color: #c8ced3 !important
    }

    a.text-secondary:hover,
    a.text-secondary:focus {
        color: #acb5bc !important
    }

    .text-light {
        color: #f0f3f5 !important
    }

    a.text-light:hover,
    a.text-light:focus {
        color: #d1dbe1 !important
    }

    .text-dark {
        color: var(--color-text-secondary, #334155) !important;
    }

    a.text-dark:hover,
    a.text-dark:focus {
        color: #181b1e;
    }

    /*.panel .panel-heading .panel-actions i {
    display: inline-block;
    text-align: center;
    width: 34px;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
    text-decoration: none;
    font-size: 14px;
}
.panel .panel-heading .panel-actions a {
    text-decoration: none;
    font-size: 14px;
    text-align: center;
    display: inline-block;
    line-height: 32px;
    padding: 0;
    margin: 0;
    color: #333;
    border-left: 1px solid rgba(0,0,0,.09);
}*/

    /* other button colors - modernized with color-shift hover */
    .btn-purple {
        color: #ffffff !important;
        background-color: #8557a2;
        border-color: #774E8F;
    }

        .btn-purple:focus,
        .btn-purple.focus {
            color: #ffffff;
            border-color: #774E8F;
            box-shadow: 0 0 0 0.2rem rgba(133, 87, 162, 0.35);
        }

        .btn-purple:hover {
            color: #ffffff;
            background-color: #774E8F;
            border-color: #6a4580;
        }

    .btn-purple-dark {
        color: #ffffff;
        background-color: #8557a2;
        border-color: #774E8F;
    }

        .btn-purple-dark:focus,
        .btn-purple-dark.focus {
            color: #ffffff;
            border-color: #774E8F;
        }

        .btn-purple-dark:hover {
            color: #ffffff;
            background-color: #774E8F;
            border-color: #6a4580;
        }
    /* purple icon only button */
    .icn-purple {
        color: #8557a2;
        background-color: transparent !important;
    }

        .icn-purple:focus,
        .icn-purple.focus {
            color: #774E8F;
        }

        .icn-purple:hover {
            color: #6a4580;
        }
    /* callview button color - modernized */
    .btn-callview {
        color: #ffffff !important;
        background-color: #449d44;
        border-color: #398439;
    }

        .btn-callview:focus,
        .btn-callview.focus {
            box-shadow: 0 0 0 0.2rem rgba(68, 157, 68, 0.35);
        }

        .btn-callview:hover {
            background-color: #3c8c3c;
            border-color: #357835;
        }

    .btn-callview-dark {
    }

        .btn-callview-dark:focus,
        .btn-callview-dark.focus {
        }

        .btn-callview-dark:hover {
            background-color: #3c8c3c;
            border-color: #357835;
        }
    /* callview icon only button */
    .icn-callview {
        color: #449d44;
        background-color: transparent !important;
    }

        .icn-callview:focus,
        .icn-callview.focus {
            color: #3c8c3c;
        }

        .icn-callview:hover {
            color: #357835;
        }

    .text-callview {
        color: #449d44;
    }

    /* accuroute button color - modernized */
    .btn-accuroute {
        color: #ffffff !important;
        background-color: #8557a2;
        border-color: #774E8F;
    }

        .btn-accuroute:focus,
        .btn-accuroute.focus {
            color: #ffffff;
            border-color: #774E8F;
            box-shadow: 0 0 0 0.2rem rgba(133, 87, 162, 0.35);
        }

        .btn-accuroute:hover {
            color: #ffffff;
            background-color: #774E8F;
            border-color: #6a4580;
        }

    .btn-accuroute-dark {
        color: #ffffff;
        background-color: #8557a2;
        border-color: #774E8F;
    }

        .btn-accuroute-dark:focus,
        .btn-accuroute-dark.focus {
            color: #ffffff;
            border-color: #774E8F;
        }

        .btn-accuroute-dark:hover {
            color: #ffffff;
            background-color: #774E8F;
            border-color: #6a4580;
        }
    /* accuroute icon only button */
    .icn-accuroute {
        color: #8557a2;
        background-color: transparent !important;
    }

        .icn-accuroute:focus,
        .icn-accuroute.focus {
            color: #774E8F;
        }

        .icn-accuroute:hover {
            color: #6a4580;
        }

    .text-accuroute {
        color: #8557a2;
    }

    .text-rapidrecall {
        color: #F2CB5B;
    }

    /* font is now set in modern.css via design tokens */
    /* override bootstrap navbar-inverse */
    .navbar-inverse {
        /*background-color: #333333;*/
        background-color: #2B333E;
        border-color: #282828;
    }

        .navbar-inverse .navbar-brand {
            color: #999999;
            /*color: #ffffff!important;*/
        }

            .navbar-inverse .navbar-brand:hover,
            .navbar-inverse .navbar-brand:focus {
                color: #ffffff;
                background-color: transparent;
            }

        .navbar-inverse .navbar-text {
            /*color: #999999;*/
            color: #ffffff;
        }

        .navbar-inverse .navbar-nav > li {
            /*color: #999999;*/
            color: #ffffff;
            border-bottom: solid 5px transparent; /* keep menu items from moving when hovering in mobile views */
        }

            .navbar-inverse .navbar-nav > li > a:hover,
            .navbar-inverse .navbar-nav > li > a:focus {
                color: #ffffff;
                /*background-color: transparent;*/
                /*background-color: #222222;*/
            }

            .navbar-inverse .navbar-nav > li.text-rapidrecall > a {
                /*color: #999999;*/
                color: #F2CB5B;
                /*   border-bottom: solid 5px transparent;  keep menu items from moving when hovering in mobile views */
            }

                .navbar-inverse .navbar-nav > li.text-rapidrecall > a:hover,
                .navbar-inverse .navbar-nav > li.text-rapidrecall > a:focus {
                    color: #f2dda0;
                    /*background-color: transparent;*/
                    /*background-color: #222222;*/
                }


            /*.navbar-inverse .navbar-nav > li > a > span.menuSubtext {
        font-size: 13px;
        color: #cccccc;
    }

    .navbar-inverse .navbar-nav > li > a:hover > span.menuSubtext,
    .navbar-inverse .navbar-nav > li > a:focus > span.menuSubtext {
        color: #ffffff;
    }*/

            /* reworked for sprite icons */
            .navbar-inverse .navbar-nav > li > a > div.menuSubtext {
                font-size: 13px;
                color: #cccccc;
            }

            .navbar-inverse .navbar-nav > li > a:hover > div.menuSubtext,
            .navbar-inverse .navbar-nav > li > a:focus > div.menuSubtext {
                color: #ffffff;
                /*background-color: transparent;*/
            }

            .navbar-inverse .navbar-nav > li > a > i.navicon {
                color: #cccccc;
            }

            .navbar-inverse .navbar-nav > li > a:hover > i.navicon,
            .navbar-inverse .navbar-nav > li > a:focus > i.navicon {
                color: #ffffff;
            }

            .navbar-inverse .navbar-nav > li.callview:hover,
            .navbar-inverse .navbar-nav > li.callview:focus {
                background-color: #252c35; /* background was #222 */
                border-bottom: solid 5px #51BA50;
            }

            .navbar-inverse .navbar-nav > li.accuroute:hover,
            .navbar-inverse .navbar-nav > li.accuroute:focus {
                background-color: #252c35; /* background was #222 */
                border-bottom: solid 5px #8557a2;
            }

            .navbar-inverse .navbar-nav > li.rapidrecall:hover,
            .navbar-inverse .navbar-nav > li.rapidrecall:focus {
                background-color: #252c35; /* background was #222 */
                border-bottom: solid 5px #F2CB5B;
            }

    .anothernav-item {
        border-bottom: solid 5px #5D91D6;
    }

    .navbar-inverse .navbar-nav > li.callview.active {
        /*color: #ffffff;*/
        background-color: #252c35; /* background was #222 */
        border-bottom: solid 5px #51BA50;
    }

    .navbar-inverse .navbar-nav > li.accuroute.active {
        /*color: #ffffff;*/
        background-color: #252c35; /* background was #222 */
        border-bottom: solid 5px rgb(133, 87, 162);
    }

    .navbar-inverse .navbar-nav > li.rapidrecall.active {
        /*color: #ffffff;*/
        background-color: #252c35; /* background was #222 */
        border-bottom: solid 5px #F2CB5B;
    }

    /* overriding bootstrap navbar background stuff until I make custom font-awesome font-icons */
    .navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus {
        background-color: transparent !important;
    }

    .line {
        margin-bottom: -4px !important;
    }

    .navbar-brand {
        background-image: url(/images/wl-img-logo.png);
        background-repeat: no-repeat;
        background-position: left;
        /* removed for white label */
        /*width: 147px;
        height: 49px;*/
    }

    .menu {
        margin: 0 2em;
    }

    li.callview > span, li.accuroute > span, li.rapidrecall > span {
        position: absolute;
        display: block;
        top: 0px;
        left: 0px;
        margin: 12px 0px 0px 10px;
        width: 22px;
        height: 24px;
    }
    /* updated spite icon styles */
/*    li.callview > a > span, li.accuroute > a > span, li.rapidrecall > a > span {
        position: absolute;
        display: block;
        top: 0px;
        left: 0px;
        margin: 12px 0px 0px 10px;
        width: 22px;
        height: 24px;
    }
*/
    .svg-icon {
        width: 1.8em;
    }

    /* colored tables - modernized */
    .table.table-colored {
        border-bottom-color: var(--brand-primary, #E9563A);
    }

    .table-colored > thead > tr > th {
        border-color: var(--color-border-default, #e2e8f0);
        background-color: var(--color-surface-inset, #f1f5f9);
        color: var(--color-text-muted, #64748b);
        font-weight: 600;
        font-size: var(--font-size-xs, 0.75rem);
        text-transform: uppercase;
        letter-spacing: 0.05em;
        border-bottom: 2px solid var(--brand-primary, #E9563A);
    }

    .bg-danger-dark {
        background-color: #d9534f;
        color: white;
    }

    .bg-warning-bob {
        background-color: #ffc966 !important;
        color: #444444 !important;
    }

    .bg-success-dark {
        background-color: #007B1F;
        color: white;
    }

    .bg-purple {
        background-color: #A66FDD;
        opacity: .8;
        color: white;
    }

    .bg-accuroute {
        background-color: #8557a2 !important;
        opacity: .9;
        color: #fff !important;
    }

        .bg-accuroute .content .text,
        .bg-accuroute .content .number {
            color: #fff !important;
        }

    .bg-roundtrip {
        background-color: #0672B7 !important;
        color: #fff !important;
    }

        .bg-roundtrip .content .text, .bg-roundtrip .content .number {
            color: #fff !important;
        }

    /* override padding left on asp radio/checkbox controls */
    .radio label, .checkbox label {
        padding-left: 8px !important;
    }

    /* Separators - Modernized
---------------------------------- */
    .separator {
        width: 100%;
        margin: 20px auto 15px;
        position: relative;
        height: 1px;
    }

        .separator:after {
            height: 1px;
            background: var(--color-border-default, #e2e8f0);
            position: absolute;
            bottom: -1px;
            content: "";
            width: 100%;
            left: 0;
        }

    .separator-1 {
        width: 100%;
        margin: 10px auto 10px;
        position: relative;
        height: 1px;
    }

        .separator-1:after {
            height: 1px;
            background: var(--color-border-default, #e2e8f0);
            position: absolute;
            bottom: -1px;
            content: "";
            width: 100%;
            left: 0;
        }

    .dark-bg:not(.banner) .separator:after,
    #footer.dark .separator:after {
        background: #505050;
    }

    .default-bg .separator:after,
    .dark-translucent-bg .separator:after,
    .med-translucent-bg .separator:after,
    .default-translucent-bg .separator:after,
    .light.separator:after {
        background: rgba(255, 255, 255, 0.5);
    }

    .light-translucent-bg .separator:after,
    .two-col-translucent-bg .container > .row > div .separator:after,
    .dark.separator:after {
        background: rgba(0, 0, 0, 0.3);
    }

    h3 + .separator,
    h4 + .separator,
    h5 + .separator {
        margin-top: 15px;
    }

    .separator-2,
    .separator-3 {
        width: 100%;
        margin-bottom: 15px;
        position: relative;
        height: 1px;
    }

        .separator-2:after,
        .separator-3:after {
            height: 1px;
            background: var(--color-border-default, #e2e8f0);
            position: absolute;
            bottom: -1px;
            left: 0;
            content: "";
            width: 100%;
        }

    .dark-bg .separator-2:after,
    .dark-bg .separator-3:after,
    #footer.dark .separator-2:after,
    #footer.dark .separator-3:after {
        background: #505050;
    }

    .light-translucent-bg .separator-2:after,
    .light-translucent-bg .separator-3:after,
    .dark.separator-2:after,
    .dark.separator-3:after {
        background: rgba(0, 0, 0, 0.3);
    }

    .default-bg .separator-2:after,
    .default-bg .separator-3:after,
    .default-translucent-bg .separator-2:after,
    .default-translucent-bg .separator-3:after,
    .dark-translucent-bg .separator-2:after,
    .dark-translucent-bg .separator-3:after,
    .med-translucent-bg .separator-2:after,
    .med-translucent-bg .separator-3:after,
    .light.separator-2:after,
    .light.separator-3:after {
        background: rgba(255, 255, 255, 0.5);
    }

    /* custom separator for Rapid Recall banner */
    .separator-2rr {
        width: 100%;
        margin-bottom: 15px;
        position: relative;
        height: 1px;
    }

        .separator-2rr:after {
            height: 1px;
            background: var(--color-border-default, #e2e8f0);
            position: absolute;
            bottom: -1px;
            left: 0;
            content: "";
            width: 100%;
        }

    .footer-content .separator-2,
    .footer-content .separator-3 {
        margin-bottom: 25px;
    }

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

    /* pagination styles; color theme capable */
    .pager-ends {
        display: inline-block;
        margin-bottom: 15px;
        width: 80px;
        margin-left: -4px;
    }

    .page-list {
        vertical-align: middle !important;
        display: inline-block;
        margin-top: -2px !important;
        margin-left: -4px;
    }

    .pageActive.callview {
        background-color: #449d44;
        border-color: #398439;
        color: white;
        padding: 6px 12px;
        /*margin-left: -1px;*/
        line-height: 1.42857143;
        text-decoration: none;
        border: 1px solid #ddd;
        vertical-align: middle;
    }

    .pager-sr.callview {
        padding: 6px 12px;
        /*margin-left: -1px;*/
        line-height: 1.42857143;
        color: #449d44;
        text-decoration: none;
        background-color: #fff;
        border: 1px solid #ddd;
        vertical-align: middle;
    }

.pageActive.purple {
/*    background-color: #8557A2 !important;
    border-color: #8557A2 !important;
*/    
    background-color: #8557A2;
    border-color: #8557A2;
    color: white;
    padding: 6px 12px;
    /*margin-left: -1px;*/
    line-height: 1.42857143;
    text-decoration: none;
    border: 1px solid #ddd;
    vertical-align: middle;
}

    .pager-sr.purple {
        padding: 6px 12px;
        /*margin-left: -1px;*/
        line-height: 1.42857143;
        color: #8557A2;
        text-decoration: none;
        background-color: #fff;
        border: 1px solid #ddd;
        vertical-align: middle;
    }

.pageActive.rapidrecall {
/*    background-color: #F2CB5B !important;
    border-color: #eea236 !important;
*/    
    background-color: #F2CB5B;
    border-color: #eea236;
    color: white !important;
    padding: 6px 12px;
    /*margin-left: -1px;*/
    line-height: 1.42857143;
    text-decoration: none;
    border: 1px solid #ddd;
    vertical-align: middle;
}

    .pager-sr.rapidrecall {
        padding: 6px 12px;
        /*margin-left: -1px;*/
        line-height: 1.42857143;
        color: #444;
        text-decoration: none;
        background-color: #fff;
        border: 1px solid #ddd;
        vertical-align: middle;
    }

    a.sortable-column {
        position: relative;
        margin-right: 20px;
        display: inline-block;
        width: 100% !important;
    }

        a.sortable-column, a.sortable-column:hover, a.sortable-column:focus {
            text-decoration: none !important;
        }

    i.sort-muted {
        color: #ccc;
    }

    i.sort-up {
        position: absolute;
        top: -2px;
        right: 5px;
    }

    i.sort-dn {
        position: absolute;
        top: 8px;
        margin-left: 5px;
        right: 5px;
    }


    #MainContent_rptPaging, #ContentPlaceHolder1_rptPaging {
        margin-top: -1px;
    }
        /* fix pager page number display offset */
        #MainContent_rptPaging > tbody > tr > td > a:hover {
            background-color: #efefef;
            text-decoration: none;
        }

    #MainContent_lbFirst:hover, #MainContent_lbPrevious:hover, #MainContent_lbNext:hover, #MainContent_lbLast:hover {
        background-color: #efefef;
    }

    #MainContent_lbFirst.aspNetDisabled:hover, #MainContent_lbPrevious.aspNetDisabled:hover, #MainContent_lbNext.aspNetDisabled:hover, #MainContent_lbLast.aspNetDisabled:hover {
        background-color: white;
    }

    /* Alerts
---------------------------------- */
    .alert-bob {
        margin: 20px 15px;
        padding: 15px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
    }

    .alert-warningBob {
        color: #444444;
        background-color: #ffc966;
    }
    /*.alert {
  margin: 20px 15px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  border: none;
}
.alert-success {
  color: #2a5f2b;
  background-color: #bcdab0;
}
.alert-info {
  color: #1a4e68;
  background-color: #c6e8fa;
}
.alert-warning {
  color: #72582b;
  background-color: #f7f0ce;
}*/
    .alert-icon {
        padding-left: 70px !important;
        position: relative;
    }

        .alert-icon i {
            position: absolute;
            font-size: 28px;
            left: 21px;
            top: 13px;
            width: 30px;
            text-align: center;
        }

    .close {
        font-size: 28px;
        font-weight: normal;
        filter: alpha(opacity=40);
        opacity: 0.4;
    }

    select.form-control + .chosen-container.chosen-container-single .chosen-single {
        display: block;
        width: 100%;
        height: 34px;
        padding: 6px 12px;
        font-size: 14px;
        line-height: 1.428571429;
        color: #555;
        vertical-align: middle;
        background-color: #fff;
        border: 1px solid #ccc;
        border-radius: 4px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
        box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
        -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        background-image: none;
    }

        select.form-control + .chosen-container.chosen-container-single .chosen-single div {
            top: 4px;
            color: #000;
        }

    select.form-control + .chosen-container .chosen-drop {
        background-color: #FFF;
        border: 1px solid #CCC;
        border: 1px solid rgba(0, 0, 0, 0.15);
        border-radius: 4px;
        -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
        background-clip: padding-box;
        margin: 2px 0 0;
    }

    select.form-control + .chosen-container .chosen-search input[type=text] {
        display: block;
        width: 100%;
        height: 34px;
        padding: 6px 12px;
        font-size: 14px;
        line-height: 1.428571429;
        color: #555;
        vertical-align: middle;
        background-color: #FFF;
        border: 1px solid #CCC;
        border-radius: 4px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
        -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
        transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
        background-image: none;
    }

    select.form-control + .chosen-container .chosen-results {
        margin: 2px 0 0;
        padding: 5px 0;
        font-size: 14px;
        list-style: none;
        background-color: #fff;
        margin-bottom: 5px;
    }

        select.form-control + .chosen-container .chosen-results li,
        select.form-control + .chosen-container .chosen-results li.active-result {
            display: block;
            padding: 3px 20px;
            clear: both;
            font-weight: normal;
            line-height: 1.428571429;
            color: #333;
            white-space: nowrap;
            background-image: none;
        }

            select.form-control + .chosen-container .chosen-results li:hover,
            select.form-control + .chosen-container .chosen-results li.active-result:hover,
            select.form-control + .chosen-container .chosen-results li.highlighted {
                color: #FFF;
                text-decoration: none;
                background-color: #428BCA;
                background-image: none;
            }

    select.form-control + .chosen-container-multi .chosen-choices {
        display: block;
        width: 100%;
        min-height: 34px;
        padding: 6px;
        font-size: 14px;
        line-height: 1.428571429;
        color: #555;
        vertical-align: middle;
        background-color: #FFF;
        border: 1px solid #CCC;
        border-radius: 4px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
        -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
        transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
        background-image: none;
    }

        select.form-control + .chosen-container-multi .chosen-choices li.search-field input[type="text"] {
            height: auto;
            padding: 5px 0;
        }

        select.form-control + .chosen-container-multi .chosen-choices li.search-choice {
            background-image: none;
            padding: 3px 24px 3px 5px;
            margin: 0 6px 0 0;
            font-size: 14px;
            font-weight: normal;
            line-height: 1.428571429;
            text-align: center;
            white-space: nowrap;
            vertical-align: middle;
            cursor: pointer;
            border: 1px solid #ccc;
            border-radius: 4px;
            color: #333;
            background-color: #FFF;
            border-color: #CCC;
        }

            select.form-control + .chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
                top: 8px;
                right: 6px;
            }

    select.form-control + .chosen-container-multi.chosen-container-active .chosen-choices,
    select.form-control + .chosen-container.chosen-container-single.chosen-container-active .chosen-single,
    select.form-control + .chosen-container .chosen-search input[type=text]:focus {
        border-color: #66AFE9;
        outline: 0;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(102, 175, 233, 0.6);
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(102, 175, 233, 0.6);
    }

    select.form-control + .chosen-container-multi .chosen-results li.result-selected {
        display: list-item;
        color: #ccc;
        cursor: default;
        background-color: white;
    }

    /* custom dial800 nav tabs */
    a:hover.d800, a:focus.d800 {
        outline: none;
        text-decoration: none;
    }

    .nav-tabs.d800 {
        border-bottom: 2px solid #e8e8e8;
    }

        .nav-tabs.d800 li a {
            display: block;
            padding: 10px 20px;
            margin: 0 5px 1px 0;
            background: #fff;
            font-size: 16px;
            /*font-size: 20px;*/
            /*font-weight: 700;*/
            color: #333;
            text-align: center;
            border: none;
            border-radius: 0;
            z-index: 2;
            position: relative;
            transition: all 0.3s ease 0s;
        }

            .nav-tabs.d800 li a:hover,
            .nav-tabs.d800 li.active a {
                color: #8557A2;
                border: none !important;
            }

                .nav-tabs.d800 li.active a:before {
                    content: "\f078";
                    font-family: "Font Awesome 7 Pro";
                    font-weight: 900;
                    font-size: 25px;
                    color: #8557A2;
                    margin: 0 auto;
                    position: absolute;
                    bottom: -30px;
                    left: 0;
                    right: 0;
                }

                .nav-tabs.d800 li.active a:after {
                    content: "";
                    width: 100%;
                    height: 3px;
                    background: #8557A2;
                    position: absolute;
                    bottom: -1px;
                    left: 0;
                    z-index: -1;
                    transition: all 0.3s ease 0s;
                }

    .tab-content.d800 {
        padding: 30px 20px 20px;
        margin-top: 0;
        background: #fff;
        font-size: 15px;
        color: #7a9181;
        line-height: 30px;
        border-radius: 0 0 5px 5px;
    }

        .tab-content.d800 h3 {
            font-size: 24px;
            margin-top: 0;
        }

    @media only screen and (max-width: 479px) {
        .nav-tabs.d800 li {
            width: 100%;
            text-align: center;
        }

            .nav-tabs.d800 li.active a:before {
                content: "\f105";
                bottom: 15%;
                left: 0;
                right: auto;
            }
    }
    /* rangefinder slider styles */
    output {
        display: none;
        font-size: 1em;
        font-weight: bold;
        /*text-align: center;
    margin: 5px 0;
    width: 100%;*/
        position: absolute;
        margin-top: -1.7em;
        right: 1.6em;
    }

    .rangeslider--horizontal {
        height: .7em !important;
    }

        .rangeslider--horizontal .rangeslider__handle {
            top: -6px !important;
        }

    .rangeslider__handle {
        width: 1.6em !important;
        height: 1.5em !important;
    }

    /* Breadcrumb
---------------------------------- */
    .breadcrumb-container {
        background-color: #f8f8f8;
        border-bottom: 1px solid #f8dffe;
        /*position: fixed; */
        position: absolute; /* was absolute */
        z-index: 2; /* to cover other items */
        opacity: .94; /* to show content a bit */
        /*top: 45px;*/
        left: 0;
        width: 100%;
        height: 34px;
        display: block /* to hide - may enable later */
    }

    .dark.breadcrumb-container {
        background-color: #777777;
        border-color: #333333;
        color: #ffffff;
    }

    .breadcrumb {
        background-color: transparent;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;
        margin-bottom: 0;
        /*font-size: 12px;*/
        padding-left: 0;
    }

        .breadcrumb > li + li:before {
            font-family: "Font Awesome 7 Pro";
            content: "\f101";
            font-size: 11px;
            padding-left: 3px;
        }

    .dark .breadcrumb > li a,
    .dark .breadcrumb > li i,
    .dark .breadcrumb > .active,
    .dark .breadcrumb > li + li:before {
        color: #ffffff;
    }

    .breadcrumb a:hover {
        text-decoration: underline;
        color: rgb(51, 109, 183);
    }

    .breadcrumb > .active {
        color: #666 !important;
    }

    @media only screen and (max-width: 550px) {
        .breadcrumb-container {
            display: none;
        }
    }

    a.link-dark.home {
        color: #333 !important;
    }

    /* removed !important for all a.link-dark for whitelisting vars */
    a.link-dark.callview {
        color: #3c763d;
    }

    a.link-dark.accuroute {
        color: #8557a2;
    }

    a.link-dark.rapidrecall {
        color: #8a6d3b;
    }

    .breadcrumb > li > .ihome {
        color: #333; /* icon color */
    }

    /* Infobox ===================================== */
    .info-box {
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
        /*height: 10em;*/
        display: flex;
        cursor: pointer;
        background-color: #fff;
        position: relative;
        overflow: hidden;
        margin-bottom: 30px;
        min-height: 150px;
    }

        .info-box .icon {
            display: inline-block;
            text-align: center;
            background-color: rgba(0, 0, 0, 0.12);
            width: 80px;
            min-width: 80px;
        }

            .info-box .icon i {
                color: #fff;
                font-size: 50px;
                line-height: 80px;
            }

            .info-box .icon .chart.chart-bar {
                height: 100%;
                line-height: 100px;
            }

                .info-box .icon .chart.chart-bar canvas {
                    vertical-align: baseline !important;
                }

            .info-box .icon .chart.chart-pie {
                height: 100%;
                line-height: 123px;
            }

                .info-box .icon .chart.chart-pie canvas {
                    vertical-align: baseline !important;
                }

            .info-box .icon .chart.chart-line {
                height: 100%;
                line-height: 115px;
            }

                .info-box .icon .chart.chart-line canvas {
                    vertical-align: baseline !important;
                }

        .info-box .content {
            display: inline-block;
            padding: 7px 10px;
            margin-top: .5em;
        }

            .info-box .content .text {
                font-size: 13px;
                margin-top: 11px;
                color: #555;
            }

            .info-box .content .number {
                font-weight: normal;
                font-size: 26px;
                margin-top: -4px;
                color: #555;
            }

        .info-box.hover-zoom-effect .icon {
            overflow: hidden;
        }

            .info-box.hover-zoom-effect .icon i {
                -moz-transition: all 0.3s ease;
                -o-transition: all 0.3s ease;
                -webkit-transition: all 0.3s ease;
                transition: all 0.3s ease;
            }

        .info-box.hover-zoom-effect:hover .icon i {
            opacity: 0.4;
            -moz-transform: rotate(-32deg) scale(1.4);
            -ms-transform: rotate(-32deg) scale(1.4);
            -o-transform: rotate(-32deg) scale(1.4);
            -webkit-transform: rotate(-32deg) scale(1.4);
            transform: rotate(-32deg) scale(1.4);
        }

        .info-box.hover-expand-effect:after {
            background-color: rgba(0, 0, 0, 0.05);
            content: ".";
            position: absolute;
            left: 80px;
            top: 0;
            width: 0;
            height: 100%;
            color: transparent;
            -moz-transition: all 0.95s;
            -o-transition: all 0.95s;
            -webkit-transition: all 0.95s;
            transition: all 0.95s;
        }

        .info-box.hover-expand-effect:hover:after {
            width: 100%;
        }

    .info-box-2 {
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
        height: 80px;
        display: flex;
        cursor: default;
        background-color: #fff;
        position: relative;
        overflow: hidden;
        margin-bottom: 30px;
    }

        .info-box-2 .icon {
            display: inline-block;
            text-align: center;
            width: 80px;
        }

            .info-box-2 .icon i {
                color: #fff;
                font-size: 50px;
                line-height: 80px;
            }

        .info-box-2 .chart.chart-bar {
            height: 100%;
            line-height: 105px;
        }

            .info-box-2 .chart.chart-bar canvas {
                vertical-align: baseline !important;
            }

        .info-box-2 .chart.chart-pie {
            height: 100%;
            line-height: 123px;
        }

            .info-box-2 .chart.chart-pie canvas {
                vertical-align: baseline !important;
            }

        .info-box-2 .chart.chart-line {
            height: 100%;
            line-height: 115px;
        }

            .info-box-2 .chart.chart-line canvas {
                vertical-align: baseline !important;
            }

        .info-box-2 .content {
            display: inline-block;
            padding: 7px 10px;
        }

            .info-box-2 .content .text {
                font-size: 13px;
                margin-top: 11px;
                color: #555;
            }

            .info-box-2 .content .number {
                font-weight: normal;
                font-size: 26px;
                margin-top: -4px;
                color: #555;
            }

        .info-box-2.hover-zoom-effect .icon {
            overflow: hidden;
        }

            .info-box-2.hover-zoom-effect .icon i {
                -moz-transition: all 0.3s ease;
                -o-transition: all 0.3s ease;
                -webkit-transition: all 0.3s ease;
                transition: all 0.3s ease;
            }

        .info-box-2.hover-zoom-effect:hover .icon i {
            opacity: 0.4;
            -moz-transform: rotate(-32deg) scale(1.4);
            -ms-transform: rotate(-32deg) scale(1.4);
            -o-transform: rotate(-32deg) scale(1.4);
            -webkit-transform: rotate(-32deg) scale(1.4);
            transform: rotate(-32deg) scale(1.4);
        }

        .info-box-2.hover-expand-effect:after {
            background-color: rgba(0, 0, 0, 0.05);
            content: ".";
            position: absolute;
            left: 0;
            top: 0;
            width: 0;
            height: 100%;
            color: transparent;
            -moz-transition: all 0.95s;
            -o-transition: all 0.95s;
            -webkit-transition: all 0.95s;
            transition: all 0.95s;
        }

        .info-box-2.hover-expand-effect:hover:after {
            width: 100%;
        }

    .info-box-3 {
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
        height: 80px;
        display: flex;
        cursor: default;
        background-color: #fff;
        position: relative;
        overflow: hidden;
        margin-bottom: 30px;
    }

        .info-box-3 .icon {
            position: absolute;
            right: 10px;
            bottom: 2px;
            text-align: center;
        }

            .info-box-3 .icon i {
                color: rgba(0, 0, 0, 0.15);
                font-size: 60px;
            }

        .info-box-3 .chart {
            margin-right: 5px;
        }

            .info-box-3 .chart.chart-bar {
                height: 100%;
                line-height: 50px;
            }

                .info-box-3 .chart.chart-bar canvas {
                    vertical-align: baseline !important;
                }

            .info-box-3 .chart.chart-pie {
                height: 100%;
                line-height: 34px;
            }

                .info-box-3 .chart.chart-pie canvas {
                    vertical-align: baseline !important;
                }

            .info-box-3 .chart.chart-line {
                height: 100%;
                line-height: 40px;
            }

                .info-box-3 .chart.chart-line canvas {
                    vertical-align: baseline !important;
                }

        .info-box-3 .content {
            display: inline-block;
            padding: 7px 16px;
        }

            .info-box-3 .content .text {
                font-size: 13px;
                margin-top: 11px;
                color: #555;
            }

            .info-box-3 .content .number {
                font-weight: normal;
                font-size: 26px;
                margin-top: -4px;
                color: #555;
            }

        .info-box-3.hover-zoom-effect .icon i {
            -moz-transition: all 0.3s ease;
            -o-transition: all 0.3s ease;
            -webkit-transition: all 0.3s ease;
            transition: all 0.3s ease;
        }

        .info-box-3.hover-zoom-effect:hover .icon i {
            opacity: 0.4;
            -moz-transform: rotate(-32deg) scale(1.4);
            -ms-transform: rotate(-32deg) scale(1.4);
            -o-transform: rotate(-32deg) scale(1.4);
            -webkit-transform: rotate(-32deg) scale(1.4);
            transform: rotate(-32deg) scale(1.4);
        }

        .info-box-3.hover-expand-effect:after {
            background-color: rgba(0, 0, 0, 0.05);
            content: ".";
            position: absolute;
            left: 0;
            top: 0;
            width: 0;
            height: 100%;
            color: transparent;
            -moz-transition: all 0.95s;
            -o-transition: all 0.95s;
            -webkit-transition: all 0.95s;
            transition: all 0.95s;
        }

        .info-box-3.hover-expand-effect:hover:after {
            width: 100%;
        }

    .info-box-4 {
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
        height: 80px;
        display: flex;
        cursor: default;
        background-color: #fff;
        position: relative;
        overflow: hidden;
        margin-bottom: 30px;
    }

        .info-box-4 .icon {
            position: absolute;
            right: 10px;
            bottom: 2px;
            text-align: center;
        }

            .info-box-4 .icon i {
                color: rgba(0, 0, 0, 0.15);
                font-size: 60px;
            }

        .info-box-4 .chart {
            margin-right: 5px;
        }

            .info-box-4 .chart.chart-bar {
                height: 100%;
                line-height: 50px;
            }

                .info-box-4 .chart.chart-bar canvas {
                    vertical-align: baseline !important;
                }

            .info-box-4 .chart.chart-pie {
                height: 100%;
                line-height: 34px;
            }

                .info-box-4 .chart.chart-pie canvas {
                    vertical-align: baseline !important;
                }

            .info-box-4 .chart.chart-line {
                height: 100%;
                line-height: 40px;
            }

                .info-box-4 .chart.chart-line canvas {
                    vertical-align: baseline !important;
                }

        .info-box-4 .content {
            display: inline-block;
            padding: 7px 16px;
        }

            .info-box-4 .content .text {
                font-size: 13px;
                margin-top: 11px;
                color: #555;
            }

            .info-box-4 .content .number {
                font-weight: normal;
                font-size: 26px;
                margin-top: -4px;
                color: #555;
            }

        .info-box-4.hover-zoom-effect .icon i {
            -moz-transition: all 0.3s ease;
            -o-transition: all 0.3s ease;
            -webkit-transition: all 0.3s ease;
            transition: all 0.3s ease;
        }

        .info-box-4.hover-zoom-effect:hover .icon i {
            opacity: 0.4;
            -moz-transform: rotate(-32deg) scale(1.4);
            -ms-transform: rotate(-32deg) scale(1.4);
            -o-transform: rotate(-32deg) scale(1.4);
            -webkit-transform: rotate(-32deg) scale(1.4);
            transform: rotate(-32deg) scale(1.4);
        }

        .info-box-4.hover-expand-effect:after {
            background-color: rgba(0, 0, 0, 0.05);
            content: ".";
            position: absolute;
            left: 0;
            top: 0;
            width: 0;
            height: 100%;
            color: transparent;
            -moz-transition: all 0.95s;
            -o-transition: all 0.95s;
            -webkit-transition: all 0.95s;
            transition: all 0.95s;
        }

        .info-box-4.hover-expand-effect:hover:after {
            width: 100%;
        }

    .bg-red {
        background-color: #F44336 !important;
        color: #fff;
    }

        .bg-red .content .text,
        .bg-red .content .number {
            color: #fff !important;
        }

    .bg-pink {
        background-color: #E91E63 !important;
        color: #fff;
    }

        .bg-pink .content .text,
        .bg-pink .content .number {
            color: #fff !important;
        }

    .bg-purple {
        background-color: #9C27B0 !important;
        color: #fff;
    }

        .bg-purple .content .text,
        .bg-purple .content .number {
            color: #fff !important;
        }

    .bg-deep-purple {
        background-color: #673AB7 !important;
        color: #fff;
    }

        .bg-deep-purple .content .text,
        .bg-deep-purple .content .number {
            color: #fff !important;
        }

    .bg-indigo {
        background-color: #3F51B5 !important;
        color: #fff;
    }

        .bg-indigo .content .text,
        .bg-indigo .content .number {
            color: #fff !important;
        }

    .bg-blue {
        background-color: #2196F3 !important;
        color: #fff;
    }

        .bg-blue .content .text,
        .bg-blue .content .number {
            color: #fff !important;
        }

    .bg-light-blue {
        background-color: #03A9F4 !important;
        color: #fff;
    }

        .bg-light-blue .content .text,
        .bg-light-blue .content .number {
            color: #fff !important;
        }

    .bg-cyan {
        background-color: #00BCD4 !important;
        color: #fff;
    }

        .bg-cyan .content .text,
        .bg-cyan .content .number {
            color: #fff !important;
        }

    .bg-teal {
        background-color: #009688 !important;
        color: #fff;
    }

        .bg-teal .content .text,
        .bg-teal .content .number {
            color: #fff !important;
        }

    .bg-green {
        background-color: #4CAF50 !important;
        color: #fff;
    }

        .bg-green .content .text,
        .bg-green .content .number {
            color: #fff !important;
        }

    .bg-light-green {
        background-color: #8BC34A !important;
        color: #fff;
    }

        .bg-light-green .content .text,
        .bg-light-green .content .number {
            color: #fff !important;
        }

    .bg-lime {
        background-color: #CDDC39 !important;
        color: #fff;
    }

        .bg-lime .content .text,
        .bg-lime .content .number {
            color: #fff !important;
        }

    .bg-yellow {
        background-color: #ffe821 !important;
        color: #fff;
    }

        .bg-yellow .content .text,
        .bg-yellow .content .number {
            color: #fff !important;
        }

    .bg-amber {
        background-color: #FFC107 !important;
        color: #fff;
    }

        .bg-amber .content .text,
        .bg-amber .content .number {
            color: #fff !important;
        }

    .bg-orange {
        background-color: #FF9800 !important;
        color: #fff;
    }

        .bg-orange .content .text,
        .bg-orange .content .number {
            color: #fff !important;
        }

    .bg-deep-orange {
        background-color: #FF5722 !important;
        color: #fff;
    }

        .bg-deep-orange .content .text,
        .bg-deep-orange .content .number {
            color: #fff !important;
        }

    .bg-brown {
        background-color: #795548 !important;
        color: #fff;
    }

        .bg-brown .content .text,
        .bg-brown .content .number {
            color: #fff !important;
        }

    .bg-grey {
        background-color: #9E9E9E !important;
        color: #fff;
    }

        .bg-grey .content .text,
        .bg-grey .content .number {
            color: #fff !important;
        }

    .bg-blue-grey {
        background-color: #607D8B !important;
        color: #fff;
    }

        .bg-blue-grey .content .text,
        .bg-blue-grey .content .number {
            color: #fff !important;
        }

    .bg-black {
        background-color: #000000 !important;
        color: #fff;
    }

        .bg-black .content .text,
        .bg-black .content .number {
            color: #fff !important;
        }

    .bg-white {
        background-color: #ffffff !important;
        color: #fff;
    }

        .bg-white .content .text,
        .bg-white .content .number {
            color: #fff !important;
        }

    a.btnPanel:hover, a.btnPanel:focus {
        cursor: pointer !important;
        text-decoration: none;
    }

    /********************
 * LAYOUT
 ********************/
    #wrapper .sidebar {
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        width: 260px;
        height: 100%;
        float: left;
        /*background-color: #333;*/
        background-color: #2B333E;
        position: fixed;
        left: 0;
    }

    #wrapper .main {
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        width: calc(100% - 260px);
        left: 0;
        position: relative;
        float: right;
        background-color: #f5f5fa;
    }

    .main-float-sidebar {
        width: 100% !important;
        float: none !important;
    }

    #wrapper #sidebar-nav,
    #wrapper .main {
        /*padding-top: 10px;*/
    }

    @media screen and (max-width: 767px) {
        #wrapper #sidebar-nav,
        #wrapper .main {
            /*padding-top: 130px;*/
        }
    }

    .layout-fullwidth #wrapper .sidebar {
        left: -260px;
    }

    .layout-fullwidth #wrapper .dashedit {
        left: -260px;
    }

    .layout-fullwidth #wrapper .main {
        width: 100%;
    }

    .layout-fullwidth #wrapper .navbar {
        left: 0 !important;
    }

    .layout-fullwidth #wrapper .btn-toggle-fullwidth {
        color: #2B333E;
    }

    .offcanvas-active #wrapper .sidebar {
        left: 0;
    }

    .offcanvas-active #wrapper .dashedit {
        left: 0;
    }

    .offcanvas-active #wrapper .main {
        width: 100%;
        position: relative;
        left: 260px;
    }


    @media screen and (max-width: 1024px) {
        /*
    #wrapper .sidebar {
        left: -260px;
    }

    #wrapper .dashedit {
        left: -260px;
    }

    #wrapper .main {
        width: 100%;
    }

    #wrapper .navbar {
        left: 0 !important;
    }
*/

        #wrapper .btn-toggle-fullwidth {
            color: #2B333E;
        }

        .btn-toggle-minified {
            display: none;
        }
    }

    .main-content {
        padding: 28px 10px;
    }

    .navbar + .main-content {
        padding: 105px 0 28px 5px;
    }

    @media screen and (max-width: 767px) {
        .navbar + .main-content {
            /*padding-top: 155px;*/
        }
    }

    html.fullscreen-bg,
    html.fullscreen-bg body,
    html.fullscreen-bg #wrapper {
        height: 100%;
    }

    .vertical-align-wrap {
        position: absolute;
        width: 100%;
        height: 100%;
        display: table;
    }

    .vertical-align-middle {
        display: table-cell;
        vertical-align: middle;
    }
    /********************
 * SIDEBAR NAVIGATION
 ********************/
    .sidebar {
        z-index: 9;
    }

        .sidebar .nav > li > a {
            /*padding: 18px 30px;*/
            color: #AEB7C2;
            border-left: 5px solid transparent;
            max-width: 240px;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            padding: 8px 5px 3px 8px;
        }

            .sidebar .nav > li > a[name="dashboard"] {
                max-width: 210px;
            }
        /* limit dashboard name length for action icons */

        .sidebar .nav li {
            border-bottom: .5px solid #222; /* added subtle bottom line to sidebar list items */
        }

        .sidebar .nav > li > a:hover, .sidebar .nav > li > a:focus, .sidebar .nav > li > a.active {
            color: #fff;
            background-color: transparent;
        }

            .sidebar .nav > li > a:hover i, .sidebar .nav > li > a:focus i, .sidebar .nav > li > a.active i {
                color: #00AAFF;
            }

        .sidebar .nav > li > a:focus, .sidebar .nav > li > a.active {
            background-color: #252c35;
            border-left-color: #00AAFF;
        }

        .sidebar .nav > li.active {
            background-color: #252c35;
        }

        .sidebar .nav > li > a[data-toggle="collapse"] .icon-submenu {
            display: inline-block;
            vertical-align: middle;
            *vertical-align: auto;
            *zoom: 1;
            *display: inline;
            -webkit-transition: all 0.2s ease-out;
            -moz-transition: all 0.2s ease-out;
            -ms-transition: all 0.2s ease-out;
            -o-transition: all 0.2s ease-out;
            transition: all 0.2s ease-out;
            float: right;
            position: relative;
            top: 2px;
            font-size: 12px;
            line-height: 1.1;
            -moz-transform: rotate(-90deg);
            -ms-transform: rotate(-90deg);
            -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
        }

    /*adjustments for firefox */
    .pad-fix {
        padding-bottom: 0 !important;
    }

    .arrow-fix {
        top: -1.3em !important;
    }
    /*end adjustments for firefox */

    .sidebar .nav > li > a[data-toggle="collapse"].collapsed .icon-submenu {
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    .sidebar .nav > li > a .badge {
        font-weight: 400;
        background-color: #F9354C;
    }

    .sidebar .nav {
        /* submenu */
    }

        .sidebar .nav i {
            margin-right: 3px;
            font-size: 18px;
        }

        .sidebar .nav span {
            -webkit-transition: all 0.3s ease-in-out;
            -moz-transition: all 0.3s ease-in-out;
            -ms-transition: all 0.3s ease-in-out;
            -o-transition: all 0.3s ease-in-out;
            transition: all 0.3s ease-in-out;
            position: relative;
            top: -2px;
        }

        .sidebar .nav .nav {
            background-color: #252c35;
        }

            .sidebar .nav .nav > li > a {
                /*padding-left: 60px;
                padding-top: 10px;
                padding-bottom: 10px;*/
            }

                .sidebar .nav .nav > li > a:focus, .sidebar .nav .nav > li > a.active {
                    background-color: transparent;
                    border-left-color: transparent;
                }

                    .sidebar .nav .nav > li > a.active a {
                        color: #fff;
                    }

    #sidebarRight .user-info {
        padding: 13px 15px 12px 15px;
        white-space: nowrap;
        position: relative;
        background: url(/images/user-img-background.jpg) no-repeat no-repeat;
        height: 135px;
    }

    .sidebar .load-filter {
        /*padding: 13px 15px 12px 15px;*/
        padding: 5px 0;
        white-space: nowrap;
        position: relative;
        background: url(/images/load-filter-02.png) no-repeat no-repeat;
        width: 100%;
    }

    .profile {
        display: inline-block;
        border: 2px solid #2B333E;
        border-radius: 100% !important;
        width: 50px;
        height: 50px;
        background-position: center;
        background-size: cover;
        background-image: url(/images/profile-person-01.png);
        vertical-align: top;
    }

    .sidebar-dashicons {
        position: absolute !important;
        right: 5px !important;
        margin-top: 7px !important;
    }

    /********************
 * SIDEBAR NAVIGATION
 ********************/
    #wrapper .dashedit {
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        width: 260px;
        height: 100%;
        float: left;
        /*background-color: #333;*/
        background-color: #2B333E;
        position: fixed;
        left: 0;
    }

    .dashedit {
        z-index: 9;
    }

        .dashedit .nav > li > a {
            /*padding: 18px 30px;*/
            color: #AEB7C2;
            border-left: 5px solid transparent;
            /*max-width: 210px;*/
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            /*padding: 8px 5px 3px 8px;*/
        }

            .dashedit .nav > li > a:hover, .dashedit .nav > li > a:focus, .dashedit .nav > li > a.active {
                color: #fff;
                background-color: transparent;
            }

                .dashedit .nav > li > a:hover i, .dashedit .nav > li > a:focus i, .dashedit .nav > li > a.active i {
                    color: #00AAFF;
                }

            .dashedit .nav > li > a:focus, .dashedit .nav > li > a.active {
                background-color: #252c35;
                border-left-color: #00AAFF;
            }

            .dashedit .nav > li > a[data-toggle="collapse"] .icon-submenu {
                display: inline-block;
                vertical-align: middle;
                *vertical-align: auto;
                *zoom: 1;
                *display: inline;
                -webkit-transition: all 0.2s ease-out;
                -moz-transition: all 0.2s ease-out;
                -ms-transition: all 0.2s ease-out;
                -o-transition: all 0.2s ease-out;
                transition: all 0.2s ease-out;
                float: right;
                position: relative;
                top: 5px;
                font-size: 12px;
                line-height: 1.1;
                -moz-transform: rotate(-90deg);
                -ms-transform: rotate(-90deg);
                -webkit-transform: rotate(-90deg);
                transform: rotate(-90deg);
            }

            .dashedit .nav > li > a[data-toggle="collapse"].collapsed .icon-submenu {
                -moz-transform: rotate(0deg);
                -ms-transform: rotate(0deg);
                -webkit-transform: rotate(0deg);
                transform: rotate(0deg);
            }

            .dashedit .nav > li > a .badge {
                font-weight: 400;
                background-color: #F9354C;
            }

        .dashedit .nav {
            /* submenu */
        }

            .dashedit .nav i {
                margin-right: 10px;
                font-size: 18px;
            }

            .dashedit .nav span {
                -webkit-transition: all 0.3s ease-in-out;
                -moz-transition: all 0.3s ease-in-out;
                -ms-transition: all 0.3s ease-in-out;
                -o-transition: all 0.3s ease-in-out;
                transition: all 0.3s ease-in-out;
                position: relative;
                /*top: -2px;*/
            }

            .dashedit .nav .nav {
                background-color: #252c35;
            }sidebar-toggle-btn

                .dashedit .nav .nav > li > a {
                    /*padding-left: 60px;
                padding-top: 10px;
                padding-bottom: 10px;*/
                }

                    .dashedit .nav .nav > li > a:focus, .dashedit .nav .nav > li > a.active {
                        background-color: transparent;
                        border-left-color: transparent;
                    }

                        .dashedit .nav .nav > li > a.active a {
                            color: #fff;
                        }

.navbar-btn {
    position: absolute;
    right: -1.96em; /* was 1.6em */
    top: -0.1em;
    /*background-color: white;*/
}

    .navbar-btn-dashedit {
        position: absolute;
        right: -1.6em;
        top: .5em;
    }

    /* dashboard editor stuff */
    .dash-guides-wrapper {
        /*background-color: #efefef;*/
        min-width: 1920px;
        height: 1080px;
        position: relative;
    }

    .dash-editor-guides {
        border: 1px dashed #999;
        position: absolute;
    }

        .dash-editor-guides.s-1024 {
            width: 1024px;
            height: 768px;
        }

        .dash-editor-guides.s-1366 {
            width: 1366px;
            height: 768px;
        }

        .dash-editor-guides.s-1440 {
            width: 1440px;
            height: 900px;
        }

        .dash-editor-guides.s-1920 {
            width: 1920px;
            height: 1080px;
        }

    .dash-guides-text {
        color: #666;
        position: absolute;
        bottom: 0;
        right: 1em;
    }

    /* grid stuff */
    /* for browsers not supporting grid */
    .grid-wrapper div.card-sm {
        display: inline-block;
        vertical-align: top;
        width: calc(25% - 30px);
        margin: 0 5px 20px 5px;
        border: 1px dashed #ddd;
        padding: 1em;
    }

    /* for browsers supporting grid */
    @supports (display: grid) {
        .grid-wrapper .card .panel, .grid-wrapper .ecard .panel {
            min-height: 134px;
        }

        .grid-wrapper div.row25 {
            display: grid;
            grid-template-columns: 1fr 1fr 1fr 1fr;
            grid-gap: 10px;
        }

        .grid-wrapper div.card.sm {
            width: auto;
            margin: 0;
            border: 1px dashed #ddd;
            padding: 1em;
        }
        /* widgets for dashboard display */
        .grid-wrapper div.card.one-col {
            width: auto;
            margin: 0;
        }

        .grid-wrapper div.card.two-col {
            margin: 0;
            grid-column: auto / span 2;
        }

        .grid-wrapper div.card.three-col {
            margin: 0;
            grid-column: auto / span 3;
        }

        .grid-wrapper div.card.four-col {
            margin: 0;
            grid-column: auto / span 4;
        }
        /* widgets for dashboard editor display */
        .grid-wrapper div.ecard.one-col {
            width: auto;
            margin: 0;
            border: 1px dashed #ddd;
        }

        .grid-wrapper div.ecard.two-col {
            margin: 0;
            border: 1px dashed #ddd;
            grid-column: auto / span 2;
        }

        .grid-wrapper div.ecard.three-col {
            margin: 0;
            border: 1px dashed #ddd;
            grid-column: auto / span 3;
        }

        .grid-wrapper div.ecard.four-col {
            margin: 0;
            border: 1px dashed #ddd;
            grid-column: auto / span 4;
        }

        @media only screen and (max-width: 1199px) {
            .grid-wrapper div.ecard.one-col, .grid-wrapper div.card.one-col {
                grid-column: auto / span 2;
            }

            .grid-wrapper div.ecard.two-col, .grid-wrapper div.card.two-col {
                grid-column: auto / span 4;
            }

            .grid-wrapper div.ecard.three-col, .grid-wrapper div.card.three-col {
                grid-column: auto / span 2;
            }
        }

        @media only screen and (max-width: 599px) {
            .grid-wrapper div.ecard.one-col, .grid-wrapper div.ecard.three-col, .grid-wrapper div.card.one-col, .grid-wrapper div.card.three-col {
                grid-column: auto / span 4;
            }
        }
    }

    .btn-edit {
        float: right;
        margin-right: .5em;
    }

    .tile-header {
        cursor: move;
        /*cursor: -webkit-grabbing;*/
    }

    span.dash-settings {
        cursor: pointer;
    }

        span.dash-settings:hover {
            color: #333;
        }

    span.dash-view {
        cursor: pointer;
        opacity: 0.8;
    }

        span.dash-view:hover {
            opacity: 1.0;
        }

    /* filter stuff */
    .list-group-submenu {
        border-left: 4px solid #AAA;
    }

    .list-group-submenu-item {
        margin-left: 1em;
    }

    a.pad-5-16:hover, a.pad-5-16:active, a.pad-5-16:focus {
        text-decoration: none !important;
    }

    a.pad-5-16 > span.text-success:hover {
        color: #255625 !important;
    }

    .dropdown-colorselector {
        display: inline-block;
    }

    #dataTypeGroupTemplate > select.form-control {
        display: inline-block;
        width: 93%;
    }

    .list-group-item-light {
        color: #818182;
        background-color: #f9f9f9;
    }

    .list-group-item-0-5-padding {
        padding: 0 5px !important;
    }

    .badge-wrapper {
        position: relative;
    }

    .badge-mod {
        /*top: -1.8em !important;
            left: -4.8em;*/
        top: -8.5em !important;
        left: -1.5em;
        background-color: #444;
        color: #eee;
        border-radius: 100px !important;
        box-sizing: border-box;
        font-family: sans-serif;
        font-weight: 800;
    }

    .well-bg-light {
        background-color: #fcfcfc !important;
    }

    a div.well-bg-light:hover {
        background-color: #ddd !important;
    }

    /* set callview active tab active indication */
    .div-calls.active, .div-calls:hover {
        border-bottom: 4px solid #ccc !important;
    }

    .div-callers.active, .div-callers:hover {
        border-bottom: 4px solid #ccc !important;
    }

    .div-analytics.active, .div-analytics:hover {
        border-bottom: 4px solid #ccc !important;
    }

    .div-reports.active, .div-reports:hover {
        border-bottom: 4px solid #ccc !important;
    }

    .div-texts.active, .div-texts:hover {
        border-bottom: 4px solid #ccc !important;
    }

    .div-calls.dash {
        border-bottom: 4px solid transparent;
    }

    .div-callers.dash {
        border-bottom: 4px solid transparent;
    }

    .div-analytics.dash {
        border-bottom: 4px solid transparent;
    }

    .div-reports.dash {
        border-bottom: 4px solid transparent;
    }

    .modal-scroll-y {
        max-height: 760px;
        overflow-y: auto;
    }

    .modal-scroll-y-500 {
        max-height: 500px;
        overflow-y: auto;
    }

    .modal-scroll-y-650 {
        max-height: 650px;
        overflow-y: auto;
    }

    .modal-list-scroll-y410px {
        max-height: 410px;
        overflow-y: auto;
    }

    .note-scroll-y {
        max-height: 200px;
        overflow-y: auto;
    }

    .modal-scroll-y-400 {
        max-height: 400px;
        overflow-y: auto;
    }


    .select2group > span.select2-container--bootstrap, .select2group > span.select2-container--default {
        width: 100% !important;
    }

    span.select2-container--default.select2-container--focus .select2-selection--multiple {
        border: 1px solid #888 !important;
    }

    #loadFilter > div > span > span > span.select2-selection.select2-selection--single {
        height: 34px;
        line-height: 32px;
        background-color: #fff;
        border: 1px solid #ccc;
    }

    span#select2-selFilter-container.select2-selection__rendered {
        line-height: 32px !important;
    }

    #sideFilter > div > div > span > span > span.select2-selection.select2-selection--single {
        margin-top: 2px;
        height: 32px;
        background-color: #fff;
        border: 1px solid #ccc;
    }

    #sideFilter > div > div > span.select2-container--default {
        margin-top: 2px;
        height: 30px;
    }

    #select2-selLoadFilter-container {
        line-height: 34px;
    }

    #sideFilter {
        margin: 0 6px 5px 6px;
    }

    div.well.filter {
        background-color: rgba(0,0,0,0.6) !important;
        border: 1px solid #666 !important;
        padding: 5px 5px 5px 24px !important;
        font-size: .85em !important;
        color: #ccc !important;
        white-space: normal !important;
        margin: 0 5px 0 3px;
    }

    div.well.reports {
        background-color: #f5f5f5 !important;
        border: 1px solid #ddd;
        border-bottom: none;
        padding: 5px 5px 5px 24px !important;
        font-size: .85em !important;
        color: #ccc !important;
        white-space: normal !important;
    }
        /*div.well.filter > span, div.well.filter > span > span, div.well.filter > span > span > span {
        top: 0 !important;
    }*/

        div.well.filter span, div.well.reports span {
            top: 0 !important;
        }
    /* selects all spans that are children of */

    span.filter-active > i.fa-check {
        font-size: 1em !important;
        vertical-align: text-bottom !important;
    }
    /* the non-variable text in the active filters lists in the sidebar */
    .filter-text {
        color: #00AAFF;
        font-weight: bold;
        text-transform: uppercase
    }

    .sidebar-dashicons.top {
        top: 3px !important;
    }

    .sidebar-dashicons > a > span#saveFilt, .sidebar-dashicons > a > span#editFilt {
        font-size: smaller;
        top: .5px !important;
    }

    .sidebar-dashicons > a {
        color: #AEB7C2;
    }

        .sidebar-dashicons > a:hover, .sidebar-dashicons > a:focus, .sidebar-dashicons > a.active {
            color: #fff;
            background-color: transparent;
            text-decoration: none;
        }

            .sidebar-dashicons > a:hover i, .sidebar-dashicons > a:focus i, .sidebar-dashicons > a.active i {
                color: #00AAFF;
            }

    #ctl00_MainContent_geographyUpdate.active, #ctl00_MainContent_datesUpdate.active, #ctl00_MainContent_callsUpdate.active, #ctl00_MainContent_dateTimeUpdate.active, #ctl00_MainContent_tagsUpdate.active, #ctl00_MainContent_salesUpdate.active, #ctl00_MainContent_demographicsUpdate.active {
        padding: 4px;
        background-color: #666;
        border-radius: 0 !important;
    }

    /*#MainContent_selTrunk_chosen { width: unset!important; }*/

    /* rotate chevron for accordian panels */
    button[data-toggle="collapse"] .rotate {
        -webkit-transition: all 0.2s ease-out;
        -moz-transition: all 0.2s ease-out;
        -ms-transition: all 0.2s ease-out;
        -o-transition: all 0.2s ease-out;
        transition: all 0.2s ease-out;
        -moz-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
    }

    button[data-toggle="collapse"].collapsed .rotate {
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    #MainContent_ResNumbers > li, #MainContent_LicNumbers > li {
        display: inline-block;
        width: 100px;
    }

    span.licGlobalPartial > input, div.chkInput > input {
        margin-right: 5px;
    }

    .btn-colorselector {
        width: 34px !important;
       /* height: 34px !important;*/
        height: 1.9rem!important;
    }

    .sub-select {
        margin-left: 2.5em;
    }

    .acode {
        display: inline-block;
        width: 2.4em;
    }

    .divLic {
        font-weight: bold;
        margin-top: 8px;
    }

    .spanLic {
        display: inline-block;
        margin-right: 5px;
        /*font-weight: normal;*/
    }

    .btn-add-note {
        margin-bottom: 5px;
    }

    .noteContent {
        width: 90% !important;
        border: none;
        margin-left: 20px;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
    }

        .noteContent[disabled="disabled"] {
            background-color: #fafafa;
        }

    @media screen and (max-width: 991px) {
        .noteContent {
            width: 75% !important;
        }
    }

    .note-wrapper {
        border: 1px solid #ddd;
        padding-left: 5px;
        position: relative; /* to allow absolute positioning of collapse indicator */
    }

    .note-collapser {
        position: absolute;
        right: 0;
        top: -.35em;
    }

    .callViewNoteHeaderSpan {
        display: inline-block;
        margin-right: 10px;
    }

    /* rotate chevron for notes panels */
    a[data-toggle="collapse"] .rotate {
        -webkit-transition: all 0.2s ease-out;
        -moz-transition: all 0.2s ease-out;
        -ms-transition: all 0.2s ease-out;
        -o-transition: all 0.2s ease-out;
        transition: all 0.2s ease-out;
        -moz-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
    }

    a[data-toggle="collapse"].collapsed .rotate {
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    .loading {
        font-size: 16px;
    }

        .loading:after {
            overflow: hidden;
            display: inline-block;
            vertical-align: bottom;
            -webkit-animation: ellipsis steps(4,end) 900ms infinite;
            animation: ellipsis steps(4,end) 900ms infinite;
            content: "\2026"; /* ascii code for the ellipsis character */
            width: 0;
        }

    @keyframes ellipsis {
        to {
            width: 1em;
        }
    }

    @-webkit-keyframes ellipsis {
        to {
            width: 1em;
        }
    }

    .radPickers > input {
        margin-right: 5px;
    }

    .radPickers > label {
        margin-right: 10px;
    }

    #MainContent_chkUseNewOwner, #MainContent_chkUseNewRespOrg {
        margin-right: 5px;
    }

    /* User Sidebar Styles */
    .wrapperSide {
        display: block;
    }

    #sidebarRight {
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        right: 0;
        /*position: relative;
    float: right;
    background-color: #f5f5fa;*/
    }

    #sidebarRight {
        min-width: 260px;
        max-width: 260px;
        height: 100vh;
        position: fixed;
        top: 50px;
        right: -260px;
        /* top layer */
        z-index: 1049;
        background-color: #2B333E;
        border-top: 1px solid #222;
    }

        #sidebarRight.active {
            right: 0px;
        }

    .overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        /* full screen */
        width: 100vw;
        height: 100vh;
        /* transparent black */
        background: rgba(0, 0, 0, 0.7);
        /* middle layer, i.e. appears below the sidebar */
        z-index: 998;
        opacity: 0;
        /* animate the transition */
        transition: all 0.5s ease-in-out;
    }
        /* display .overlay when it has the .active class */
        .overlay.active {
            display: block;
            opacity: 1;
        }

    #dismiss {
        /*width: 35px;
    height: 35px;
    position: absolute;
    top: 10px;
    left: 10px;*/
        margin: .5em 0 0 .5em;
        font-size: 1.2em;
        color: #00AAFF;
    }

    #sidebarRight .nav > li > a {
        /*padding: 18px 30px;*/
        color: #AEB7C2;
        border-left: 5px solid transparent;
        max-width: 240px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        padding: 8px 5px 3px 8px;
    }

        #sidebarRight .nav > li > a[name="dashboard"] {
            max-width: 210px;
        }
    /* limit dashboard name length for action icons */

    #sidebarRight .nav li {
        border-bottom: .5px solid #222; /* added subtle bottom line to sidebar list items */
    }

    #sidebarRight .nav > li > a:hover, #sidebarRight .nav > li > a:focus, #sidebarRight .nav > li > a.active {
        color: #fff;
        background-color: transparent;
    }

        #sidebarRight .nav > li > a:hover i, #sidebarRight .nav > li > a:focus i, #sidebarRight .nav > li > a.active i {
            color: #00AAFF;
        }

    #sidebarRight .nav > li > a:focus, #sidebarRight .nav > li > a.active {
        background-color: #252c35;
        border-left-color: #00AAFF;
    }

    #sidebarRight .nav > li.active {
        background-color: #252c35;
    }

    .lbl-min-41 {
        min-width: 41px;
    }

    .lbl-min-53 {
        min-width: 53px;
    }

    #ctl00_MainContent_radFeedFtpFrequency,
    #ctl00_MainContent_radFeedFtpDirection,
    #ctl00_MainContent_radFeedFtpProtocol {
        list-style: none;
        padding-left: 0;
    }

        #ctl00_MainContent_radFeedFtpFrequency > li,
        #ctl00_MainContent_radFeedFtpDirection > li,
        #ctl00_MainContent_radFeedFtpProtocol > li {
            display: inline-block;
        }

            #ctl00_MainContent_radFeedFtpFrequency > li > input,
            #ctl00_MainContent_radFeedFtpDirection > li > input,
            #ctl00_MainContent_radFeedFtpProtocol > li > input {
                margin-right: 5px;
            }

            #ctl00_MainContent_radFeedFtpFrequency > li > label,
            #ctl00_MainContent_radFeedFtpDirection > li > label,
            #ctl00_MainContent_radFeedFtpProtocol > li > label {
                margin-right: 10px;
            }

    div.prog {
        position: absolute;
        top: 50%;
        left: 50%;
        margin-right: -50%;
        transform: translate(-50%, -50%);
        height: 3em;
    }
    /* work around for sidebar responsive tables - Calls & Callview */
    .table-responsive-callview {
        /*overflow-x: auto; removed to stop scrollbar on wider than 767px */
        min-height: 0.01%;
    }

    /* was 870px max-width; 1920 and 992 */
    @media screen and (max-width: 1920px) {
        .table-responsive-callview {
            width: 100%;
            margin-bottom: 15px;
            overflow-y: hidden;
            -ms-overflow-style: -ms-autohiding-scrollbar;
            border: 1px solid #dddddd;
        }

            .table-responsive-callview > .table {
                margin-bottom: 0;
            }

                .table-responsive-callview > .table > thead > tr > th,
                .table-responsive-callview > .table > tbody > tr > th,
                .table-responsive-callview > .table > tfoot > tr > th,
                .table-responsive-callview > .table > thead > tr > td,
                .table-responsive-callview > .table > tbody > tr > td,
                .table-responsive-callview > .table > tfoot > tr > td {
                    white-space: nowrap;
                }

            .table-responsive-callview > .table-bordered {
                border: 0;
            }

                .table-responsive-callview > .table-bordered > thead > tr > th:first-child,
                .table-responsive-callview > .table-bordered > tbody > tr > th:first-child,
                .table-responsive-callview > .table-bordered > tfoot > tr > th:first-child,
                .table-responsive-callview > .table-bordered > thead > tr > td:first-child,
                .table-responsive-callview > .table-bordered > tbody > tr > td:first-child,
                .table-responsive-callview > .table-bordered > tfoot > tr > td:first-child {
                    border-left: 0;
                }

                .table-responsive-callview > .table-bordered > thead > tr > th:last-child,
                .table-responsive-callview > .table-bordered > tbody > tr > th:last-child,
                .table-responsive-callview > .table-bordered > tfoot > tr > th:last-child,
                .table-responsive-callview > .table-bordered > thead > tr > td:last-child,
                .table-responsive-callview > .table-bordered > tbody > tr > td:last-child,
                .table-responsive-callview > .table-bordered > tfoot > tr > td:last-child {
                    border-right: 0;
                }

                .table-responsive-callview > .table-bordered > tbody > tr:last-child > th,
                .table-responsive-callview > .table-bordered > tfoot > tr:last-child > th,
                .table-responsive-callview > .table-bordered > tbody > tr:last-child > td,
                .table-responsive-callview > .table-bordered > tfoot > tr:last-child > td {
                    border-bottom: 0;
                }
    }

    @media screen and (max-width: 991px) {
        .btns-analytics {
            margin-top: 1.9em;
        }

        .lh-adjust {
            line-height: 1;
        }
    }

    @media screen and (max-width: 767px) {
        .btns-analytics {
            margin-top: 0;
        }
    }

    @media screen and (max-width: 1289px) {
        .card-subtext {
            font-size: 1.2em;
        }
    }

    @media screen and (max-width: 1199px) {
        .card-subtext {
            font-size: 1.4em;
        }
    }

    .data-type {
        position: absolute;
        right: -1em;
    }

    @media screen and (max-width: 767px) {
        .data-type {
            right: 0;
        }
    }

    #ctl00_MainContent_updAnalyticsDataTypes {
        width: 98%;
    }

    @media screen and (max-width: 767px) {
        #ctl00_MainContent_updAnalyticsDataTypes {
            width: 96%;
        }
    }

    @media screen and (max-width: 767px) {
        .pad-5-16 {
            padding: 5px 7px 0 7px !important;
        }
    }


    .heading-sub-span {
        font-size: .8em;
        margin-left: 1em;
        font-style: italic;
    }

    div#chkboxes > label.checkbox-inline {
        width: 182px;
    }

    span.jqCron-blocks > span {
        display: inline-block;
        margin-bottom: 5px;
    }

    /* fix analytics table select2 combo width */
    span[aria-labelledby="select2-ctl00_MainContent_ddlAnalyticsGroupBy-container"] > span {
        min-width: 200px;
    }

        span[aria-labelledby="select2-ctl00_MainContent_ddlAnalyticsGroupBy-container"] > span > b[role="presentation"] {
            left: 95% !important;
        }

    /* edit report column list */
    ul.report-cols {
        padding-left: 0 !important;
        margin-top: 8px;
    }

        ul.report-cols > li {
            display: inline-block;
            min-width: 12em;
        }

    span.report-cols {
        margin-top: 8px;
        display: inline-block;
    }

    #ctl00_MainContent_updLoadFilter > div.input-group > span.select2-container {
        top: 0 !important;
    }

    label[for="ctl00_MainContent_chPostToggle"] {
        margin-left: 5px;
        cursor: pointer;
    }

    /* dashboard alert triggered animation */
    @-webkit-keyframes pulse {
        0% {
            -webkit-transform: scale(1, 1);
        }

        50% {
            -webkit-transform: scale(1.1, 1.1);
        }

        100% {
            -webkit-transform: scale(1, 1);
        }
    }

    @keyframes pulse {
        0% {
            transform: scale(1, 1);
        }

        50% {
            transform: scale(1.1, 1.1);
        }

        100% {
            transform: scale(1, 1);
        }
    }

    .alert-triggered {
        width: 110px;
        -webkit-animation: pulse 1s linear infinite;
        animation: pulse 1s linear infinite;
    }

        .alert-triggered:hover {
            -webkit-animation: none;
            animation: none;
        }

    .ai-tags {
        font-size: .5em;
        left: .95em;
        top: .5em;
        color: white;
        text-shadow: -1px -1px 0 purple, 1px -1px 0 purple, -1px 1px 0 purple, 1px 1px 0 purple;
    }

    /* Reports Step Wizard Styles - Move to it's own file*/
    .stepwizard-step p {
        margin-top: 0;
        color: #999;
    }

    .stepwizard-row {
        display: table-row;
    }

    .stepwizard {
        display: table;
        width: 100%;
        position: relative;
    }

    .stepwizard-step button[disabled] {
        /*opacity: 1 !important;
    filter: alpha(opacity=100) !important;*/
    }

    .stepwizard .btn.disabled, .stepwizard .btn[disabled], .stepwizard fieldset[disabled] .btn {
        opacity: 1 !important;
        color: #bbb;
    }

    .stepwizard-row:before {
        top: 14px;
        bottom: 0;
        position: absolute;
        content: " ";
        width: 100%;
        height: 1px;
        background-color: #ccc;
        z-index: 0;
        left: 0;
    }

    .stepwizard-step {
        display: table-cell;
        text-align: center;
        position: relative;
        padding: 0;
    }

    .btn-circle {
        width: 30px;
        height: 30px;
        text-align: center;
        padding: 6px 0;
        font-size: 12px;
        line-height: 1.428571429;
        border-radius: 15px !important;
    }

    .wizard-step-title-number {
        background-color: rgb(230, 230, 230);
        border-radius: 300px !important;
        color: rgb(255, 255, 255);
        font-size: 28px;
        height: 60px;
        margin-right: 10px;
        text-align: center;
        width: 60px;
        font-weight: bold;
        padding-top: 12px;
        display: inline-block;
    }

    .wizard-step-title-text {
        color: rgb(21, 140, 186);
        font-size: 28px;
        margin-top: 8px;
        margin-right: 20px;
        display: inline-block;
    }

    .wizard-step-title-description {
        vertical-align: text-bottom;
        display: inline-block;
    }

    .valid-step {
        position: absolute;
        color: #666;
        font-size: 1.3em;
        font-weight: 900;
        top: -.1em;
        right: -.4em;
        display: none;
    }

    label[for="MainContent_radComparison1"], label[for="MainContent_radComparison2"] {
        margin-bottom: 0 !important;
    }

    /* reports step 3 things select2 fixes */
    #ctl00_MainContent_ddlStoredReport + span {
        width: unset !important;
        min-width: 243px !important;
        margin-bottom: 5px !important;
    }
    /* select next element */

    /* nav tabs stuff */
    .nav-tabs.style-2 {
        border-bottom: 1px solid #f1f1f1;
    }

        .nav-tabs.style-2 > li > a {
            color: #999999;
        }

            .nav-tabs.style-2 > li > a:hover {
                color: #333333;
                background-color: #fafafa !important;
                border-color: #f1f1f1;
                border-bottom-color: #fafafa !important;
            }

            .nav-tabs.style-2 > li > a:focus {
                border-color: transparent;
                background-color: transparent;
            }

        .nav-tabs.style-2 > li.active > a,
        .nav-tabs.style-2 > li.active > a:hover,
        .nav-tabs.style-2 > li.active > a:focus {
            color: #333333;
            cursor: default;
            background-color: #fafafa;
            border-color: #f1f1f1;
            border-bottom-color: transparent;
        }

        .nav-tabs.style-2 + .tab-content > .tab-pane {
            padding: 15px;
            border: 1px solid #f1f1f1;
            border-top: none;
            background-color: #fafafa;
        }

    .nav-tabs.style-3 {
        border-bottom: 1px solid #999999;
        background-color: #999999;
    }

        .nav-tabs.style-3 > li > a {
            color: #ffffff;
            -webkit-border-radius: 0;
            -moz-border-radius: 0;
            border-radius: 0;
            margin: 0;
        }
    /* Small devices (tablets, smartphones) */
    @media (min-width: 481px) and (max-width: 767px) {
        .nav-tabs > li > a {
            padding: 12px 10px;
            font-size: 11px;
            margin-right: 0;
        }
    }
    /* Extra small devices (phones, less than 480px) */
    @media (max-width: 480px) {
        .nav-tabs {
            background-color: #eaeaea;
            border-bottom: none !important;
        }

            .nav-tabs > li {
                float: none;
            }

                .nav-tabs > li a {
                    color: #ffffff;
                    margin-right: 0;
                    -webkit-border-radius: 0px !important;
                    -moz-border-radius: 0px !important;
                    border-radius: 0px !important;
                }
            .nav-tabs.bob-adjust-mobile > li a {
                /*color: #ffffff;*/
                margin-right: 0;
                -webkit-border-radius: 0px !important;
                -moz-border-radius: 0px !important;
                border-radius: 0px !important;
            }


            .nav-tabs.style-3 > li.active > a,
            .nav-tabs.style-3 > li.active > a:hover,
            .nav-tabs.style-3 > li.active > a:focus,
            .nav-tabs.style-3 > li > a:hover,
            .nav-tabs.style-3 > li > a:focus {
                border-bottom: 1px solid #999999 !important;
            }

            .nav-tabs.style-3 + .tab-content > .tab-pane {
                border-top: 1px solid #999999;
            }

            .nav-tabs > li a:after,
            .nav-tabs > li a:before {
                border-color: transparent transparent transparent transparent !important;
            }

        .panel-title-dash {
            font-size: 20px !important;
        }
    }
.nav-tabs {
    background-color: #eaeaea;
    border-bottom: none !important;
}

    #MainContent_cbApplyUntil {
        margin-right: 10px;
    }

    .wiz-confirm {
        font-size: 1.1em;
    }

    .wiz-checkbox {
        margin-right: 5px;
    }

        .wiz-checkbox > input {
            margin: 0 !important;
        }

    #MainContent_chkEnableRecording + label {
        padding-left: 0 !important;
    }

    /*#radioBtn > .notActive {
        color: #8557a2 !important;
        background-color: #fff;
    }*/

.col-trash {
    position: absolute;
    /*top: .3em;*/
    /*right: 1em;*/
    top: .1em;
    right: 0;
/*    width: 3rem;
    z-index: 10;
*/}

    .col-remove {
        position: absolute;
        top: .6em;
        right: 1em;
    }

    /*.btn-link, .btn-link:hover, .btn-link:focus, .btn-link:active {
    border-color: transparent;
}
.btn-link, .btn-link:active, .btn-link.active, .btn-link[disabled], fieldset[disabled] .btn-link {
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
}*/
    .btn-link-danger {
        /*color: #d9534f;*/
        color: #ccc;
        font-weight: normal;
        border-radius: 0;
    }

        .btn-link-danger:hover {
            color: #c9302c;
        }
    /* Popover Stuff */
    .popover-title {
        background-color: #63c2de !important;
        color: white;
        font-weight: bold;
    }

    div.popover.left {
        /*top: -30px!important;*/
        left: -280px !important;
    }

    .popover-content {
        width: 276px;
    }

    .btn-xs-circle {
        border-radius: 50% !important;
        width: 22px !important;
        height: 22px !important;
    }

    #ctl00_MainContent_radReportColumnFixedDirection_Left, #ctl00_MainContent_radReportColumnFixedDirection_Right {
        margin-right: 5px;
    }

    .chart-download {
        position: absolute;
        right: .5em;
        top: .5em;
    }


    /*#divTest > span:first-of-type { display: none; }*/
    #divTest > span.select2-container, #select2-ctl00_MainContent_ddlTest-container {
        min-width: 280px;
    }

    #divTest > span.select2-container {
        /*margin-top: -4px;*/
    }

        #divTest > span.select2-container .select2-selection--single {
            height: 30px;
        }
    /* for real-time call events */
    #divRealTime > span.select2-container, #select2-ctl00_MainContent_ddlTest-container {
        min-width: 280px;
    }

    #divRealTime > span.select2-container {
        margin-top: -4px;
    }

        #divRealTime > span.select2-container .select2-selection--single {
            height: 30px;
        }

    /* report wizard step 3 template select styles */
    .selWrapper {
        height: 50px;
    }

    .selWrapper-header {
        color: #888;
        text-transform: uppercase;
        font-size: 1.1em;
        border-bottom: dashed 1px #ccc;
    }

    img.selImage {
        max-width: 46px;
        float: left;
        margin: 0 10px 0 -10px;
    }

    .selTitle.stored {
        /*font-size: larger;*/
        display: inline-block;
        margin-top: 15px;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 150px;
        white-space: nowrap;
    }

    .selTitle.preset {
        margin-top: -10px;
    }

    .selDesc {
        min-width: 200px;
        font-size: small;
    }

    .imgTemplatePreview {
        border: solid 2px #bbb;
        /*padding: 5px;*/
        background-color: #dadada;
        text-align: center;
    }

    .select2-container .select2-results__group {
        padding: 4px;
    }

    .select2-container .select2-dropdown .select2-results__option {
        border-bottom: solid 1px #ddd;
    }

    li.select2-results__option .select2-results__option--highlighted {
        background-color: #bbbbbb !important;
    }
    /*li[aria-label="presets"] > ul > li { padding-top: 0!important; background-color: red;}*/ /*attempting to nudge preset template select text a couple pixels higher*/

    /* input margin right adjust for checboxes & radios */
    #MainContent_chkAniRemembranceEnableTag, #MainContent_chkAniMatchingEnableTag, #MainContent_chkGeoRoutingEnableTag, #MainContent_chkPhoneTypeEnableTag,
    #MainContent_chkTodEnableTag, #MainContent_chkMenuEnableTag, #MainContent_chkPlayEnableTag, #MainContent_chkPromptEnableTag, #MainContent_chkRemoteDecisionEnableTag,
    #MainContent_chkRemoteDialEnableTag, #MainContent_chkDialBoberdooEnableTag, #ctl00_MainContent_chkProximityLimit, #MainContent_chkLocationMenuEnableTag,
    #MainContent_radLocationMenuPressBefore, #MainContent_radLocationMenuPressAfter, #MainContent_chkLocationMenuDialSingle, #MainContent_chkLocationMenuRandomize {
        margin-right: 5px;
    }

    div.pending {
        padding: 8px 0 5px 10px;
    }

    div.targets > span {
        width: 88% !important;
        margin-bottom: 5px
    }

    div.targets-3col > span {
        width: 87% !important;
        margin-bottom: 5px
    }

    #MainContent_chkProximityLimit {
        margin-right: 5px;
    }

    .btn-nounderline {
        text-decoration: none !important;
    }

    .btn-nolink, .btn-nolink:hover {
        cursor: default;
    }

    .btn-notgood {
        color: #fff;
        display: inline-block;
        margin-bottom: 0;
        font-weight: normal;
        text-align: center;
        vertical-align: middle;
        -ms-touch-action: manipulation;
        touch-action: manipulation;
        /*cursor: pointer;*/
        background-image: none;
        border: 1px solid transparent;
        white-space: nowrap;
        padding: 6px 12px;
        font-size: 14px;
        line-height: 1.42857143;
        border-radius: 4px;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        background-color: #f97d24;
        border-color: #f97d24;
    }

        .btn-notgood:hover, .btn-notgood > i:hover {
            color: #fff;
        }

    .btn-success.btn-nolink {
        background-color: #5cb85c;
        border-color: #4cae4c;
    }

    .btn-warning.btn-nolink {
        background-color: #f0ad4e;
        border-color: #eea236;
    }

    .btn-danger.btn-nolink {
        background-color: #d9534f;
        border-color: #d43f3a;
    }

    .btn-default.btn-nolink {
        background-color: #eaeaea;
        border-color: #ccc;
    }
    /* style tag search filter select2 selects on accuroute pages */
    #MainContent_ddlFilterTagList + span {
        width: auto !important;
    }

        #MainContent_ddlFilterTagList + span > span > span {
            width: 400px;
            border-color: #ccc !important;
        }

    @media (max-width: 768px) {
        #MainContent_ddlFilterTagList + span {
            width: 100% !important;
        }

            #MainContent_ddlFilterTagList + span > span > span {
                width: 100%;
            }
    }

    #MainContent_selNewSipTrunk_chosen {
        width: 100% !important;
    }

    /* callview calls tab tags */
    a.bootstrap-tagsinput {
        text-decoration: none !important;
    }

    /* accouroute list layout fixes */
    .row.pager-accuroute {
        margin-top: 20px;
    }

    /* custom checkboxes column visibility */
    input[type="checkbox"].custom-checkbox {
        position: absolute;
        right: 9000px;
    }

    /*Check box*/
    input[type="checkbox"] + .label-text:before {
        content: "\f0c8";
        font-family: "Font Awesome 7 Pro";
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        width: 1em;
        display: inline-block;
        margin-right: 5px;
    }

    input[type="checkbox"]:checked + .label-text:before {
        content: "\f14a";
        color: #2980b9;
        font-weight: bold;
        animation: effect 250ms ease-in;
    }

    input[type="checkbox"]:disabled + .label-text {
        color: #aaa;
    }

        input[type="checkbox"]:disabled + .label-text:before {
            content: "\f0c8";
            color: #ccc;
        }
    /* custom radio buttons column visibility */
    input[type="radio"].custom-checkbox {
        position: absolute;
        right: 9000px;
    }

    /*Check box*/
    input[type="radio"] + .label-text:before {
        content: "\f0c8";
        font-family: "Font Awesome 7 Pro";
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        width: 1em;
        display: inline-block;
        margin-right: 5px;
    }

    input[type="radio"]:checked + .label-text:before {
        content: "\f14a";
        color: #2980b9;
        animation: effect 250ms ease-in;
    }

    input[type="radio"]:disabled + .label-text {
        color: #aaa;
    }

        input[type="radio"]:disabled + .label-text:before {
            content: "\f111";
            color: #ccc;
        }

    @keyframes effect {
        0% {
            transform: scale(0);
        }

        25% {
            transform: scale(1.3);
        }

        75% {
            transform: scale(1.4);
        }

        100% {
            transform: scale(1);
        }
    }

.form-check > label {
    /*width: 120px !important;*/
    width: 120px;
    display: inline-block;
    font-weight: bold;
}
.form-check.analytics > label {
    width: 11.1rem !important;
    display: inline-block;
    font-weight: bold;
}
/*        .form-check > label.chkArea {
            width: 50px !important;
        }

        .form-check > label.chkType {
            width: 180px !important;
        }

        .form-check > label.radPrice {
            width: 96px !important;
        }

        .form-check > label.chkTags {
            min-width: 150px;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }
*/
    input[type="checkbox"] + .label-text-area:before {
        content: "\f0c8";
        font-family: "Font Awesome 7 Pro";
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        width: 1em;
        display: inline-block;
        margin-right: 5px;
    }

    input[type="checkbox"]:checked + .label-text-area:before {
        content: "\f14a";
        color: #FBBE16;
        font-weight: bold;
        /*color: #2980b9;*/
        animation: effect 250ms ease-in;
    }

    input[type="radio"] + .label-text-area:before {
        content: "\f111";
        font-family: "Font Awesome 7 Pro";
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        width: 1em;
        display: inline-block;
        margin-right: 5px;
    }

    input[type="radio"]:checked + .label-text-area:before {
        content: "\f058";
        font-weight: bold;
        color: #FBBE16;
        /*color: #2980b9;*/
        animation: effect 250ms ease-in;
    }

    #doublescroll {
        overflow: auto;
        overflow-y: hidden;
    }

    #headingOne > h4 > div > i.fas {
        -webkit-transition: .3s transform ease-in-out;
        transition: .3s transform ease-in-out;
    }

    a.collapsed > #headingOne > h4 > div > i.fas {
        transform: rotate(-90deg);
    }

    #MainContent_chkPlayInputEnableTag, #MainContent_chkValidateInputEnableTag {
        margin-right: 5px;
    }

    .customCallerId > label {
        margin-right: 10px;
    }

    label[for="MainContent_radUploadMerge"], label[for="MainContent_radUploadReplace"] {
        margin-left: 5px;
    }

    #ctl00_MainContent_selAssignedDnis_chosen {
        width: auto !important;
    }

    /* disclaimer for accuroute default page */
    .disclaimer {
        color: #ededed;
        background: rgba(50,50,50,.4);
        border: none;
        padding: 5px 15px;
    }

    .text-light-ccc {
        color: #ccc;
    }

    /* Banner and Animation Styles */
    /*-----------------------------*/
    /*Translucent Backgrounds*/
    .no-touch .parallax,
    .no-touch .parallax-2,
    .no-touch .parallax-3,
    .no-touch .fixed-bg {
        background-attachment: fixed;
    }

    .light-translucent-bg,
    .dark-translucent-bg,
    .med-translucent-bg,
    .default-translucent-bg,
    .two-col-translucent-bg {
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        background-position: 50% 0;
        background-repeat: no-repeat;
        z-index: 1;
        position: relative;
        overflow: hidden;
    }

        .light-translucent-bg:after,
        .dark-translucent-bg:after,
        .med-translucent-bg:after,
        .default-translucent-bg:after,
        .two-col-translucent-bg:after {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            z-index: 2;
            width: 100%;
            height: 100%;
            -webkit-transition: all 0.2s ease-in-out;
            -o-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out;
            -webkit-backface-visibility: hidden;
            -webkit-transform: translateZ(0) scale(1, 1);
        }

        .light-translucent-bg > div,
        .dark-translucent-bg > div,
        .med-translucent-bg > div,
        .default-translucent-bg > div,
        .two-col-translucent-bg > div {
            z-index: 3;
            position: relative;
        }

    .light-translucent-bg {
        color: #333;
        border-bottom: 1px solid #dadada;
        border-top: 1px solid #dadada;
    }

        .light-translucent-bg:after {
            background-color: rgba(255, 255, 255, 0.7);
        }

        .light-translucent-bg.slight:after {
            background-color: rgba(255, 255, 255, 0.85);
        }

    .video-background.light-translucent-bg:after,
    .video-background-banner.light-translucent-bg:after {
        background-color: rgba(255, 255, 255, 0.5);
    }

    .light-translucent-bg.hovered:hover:after {
        background-color: rgba(255, 255, 255, 0.8);
    }

    .dark-translucent-bg:after {
        background-color: rgba(0, 0, 0, 0.5);
    }

    .med-translucent-bg:after {
        background-color: rgba(0, 0, 0, 0.3);
    }

    .dark-translucent-bg.hovered:hover:after {
        background-color: rgba(0, 0, 0, 0.6);
    }

    .med-translucent-bg.hovered:hover:after {
        background-color: rgba(0, 0, 0, 0.5);
    }

    .dark-translucent-bg,
    .med-translucent-bg,
    .med-translucent-bg h1,
    .med-translucent-bg h2,
    .med-translucent-bg h3,
    .med-translucent-bg h4,
    .med-translucent-bg h5,
    .med-translucent-bg h6,
    .dark-translucent-bg h1,
    .dark-translucent-bg h2,
    .dark-translucent-bg h3,
    .dark-translucent-bg h4,
    .dark-translucent-bg h5,
    .dark-translucent-bg h6 {
        color: #ffffff;
    }

        .dark-translucent-bg a:not(.btn), .med-translucent-bg a:not(.btn) {
            text-decoration: underline;
            color: #ffffff;
        }

            .dark-translucent-bg a:not(.btn):hover, .med-translucent-bg a:not(.btn):hover {
                text-decoration: none;
                color: #ffffff;
            }

    .two-col-translucent-bg {
        color: #333;
    }

        .two-col-translucent-bg:after {
            background-color: rgba(255, 255, 255, 0.7);
        }
    /* Medium devices (desktops, tablets, 992px and up) */
    @media (min-width: 992px) {
        .two-col-translucent-bg:after {
            background: -moz-linear-gradient(left, rgba(255, 255, 255, 0.7) 50%, rgba(0, 0, 0, 0.5) 50%);
            background: -webkit-gradient(left, rgba(255, 255, 255, 0.7) 50%, rgba(0, 0, 0, 0.5) 50%);
            background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.7) 50%, rgba(0, 0, 0, 0.5) 50%);
            background: -o-linear-gradient(left, rgba(255, 255, 255, 0.7) 50%, rgba(0, 0, 0, 0.5) 50%);
            background: -ms-linear-gradient(left, rgba(255, 255, 255, 0.7) 50%, rgba(0, 0, 0, 0.5) 50%);
            background: linear-gradient(to right, rgba(255, 255, 255, 0.7) 50%, rgba(0, 0, 0, 0.5) 50%);
        }

        .two-col-translucent-bg .container > .row > div + div,
        .two-col-translucent-bg .container > .row > div + div h1,
        .two-col-translucent-bg .container > .row > div + div h2,
        .two-col-translucent-bg .container > .row > div + div h3,
        .two-col-translucent-bg .container > .row > div + div h4,
        .two-col-translucent-bg .container > .row > div + div h5,
        .two-col-translucent-bg .container > .row > div + div h6 {
            color: #ffffff;
        }

            .two-col-translucent-bg .container > .row > div + div a:not(.btn) {
                text-decoration: underline;
                color: #ffffff;
            }

                .two-col-translucent-bg .container > .row > div + div a:not(.btn):hover {
                    text-decoration: none;
                    color: #ffffff;
                }
    }

    .default-translucent-bg:after {
        background-color: rgba(9, 175, 223, 0.7);
    }

    .default-translucent-bg.hovered:hover:after {
        background-color: rgba(9, 175, 223, 0.8);
    }

    .default-translucent-bg,
    .default-translucent-bg h1,
    .default-translucent-bg h2,
    .default-translucent-bg h3,
    .default-translucent-bg h4,
    .default-translucent-bg h5,
    .default-translucent-bg h6 {
        color: #ffffff;
    }

        .default-translucent-bg a:not(.btn) {
            text-decoration: underline;
            color: #ffffff;
        }

            .default-translucent-bg a:not(.btn):hover {
                text-decoration: none;
                color: #ffffff;
            }

    .default-hovered {
        -webkit-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }

        .default-hovered:hover:after,
        .default-hovered:hover {
            background-color: #09afdf;
        }

    .light-gray-bg.default-hovered:hover * {
        color: #ffffff;
    }
    /*Animated Backgrounds
---------------------------------- */
    /* Small devices (tablets, 768px and up) */
    @media (min-width: 768px) {
        .animated-text h2 {
            -webkit-transition: all 0.2s ease-in-out;
            -o-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out;
            position: absolute;
            top: 0;
            width: 100%;
        }

            .animated-text h2 + h2 {
                opacity: 0;
                filter: alpha(opacity=0);
                -webkit-transform: scale(1.15);
                -moz-transform: scale(1.15);
                -ms-transform: scale(1.15);
                -o-transform: scale(1.15);
                transform: scale(1.15);
            }

        .animated-text:hover h2 {
            opacity: 0;
            filter: alpha(opacity=0);
            -webkit-transform: scale(0.85);
            -moz-transform: scale(0.85);
            -ms-transform: scale(0.85);
            -o-transform: scale(0.85);
            transform: scale(0.85);
        }

            .animated-text:hover h2 + h2 {
                opacity: 1;
                filter: alpha(opacity=100);
                -webkit-transform: scale(1);
                -moz-transform: scale(1);
                -ms-transform: scale(1);
                -o-transform: scale(1);
                transform: scale(1);
            }
    }
    /* Small devices (tablets, phones less than 767px) */
    @media (max-width: 767px) {
        .animated-text h2 + h2 {
            display: none;
        }
    }

    /* non-visible for fade-in animation */
    .object-non-visible {
        opacity: 0;
        filter: alpha(opacity=0);
    }

    .object-visible,
    .touch .object-non-visible {
        opacity: 1 !important;
        filter: alpha(opacity=100) !important;
    }
    /* Targeting only Firefox for smoothest animations */
    @-moz-document url-prefix() {
        .object-visible,
        .touch .object-non-visible {
            -webkit-transition: opacity 0.6s ease-in-out;
            -moz-transition: opacity 0.6s ease-in-out;
            -o-transition: opacity 0.6s ease-in-out;
            -ms-transition: opacity 0.6s ease-in-out;
            transition: opacity 0.6s ease-in-out;
        }
    }
    /* banners */
    .banner.parallax,
    .banner.light-translucent-bg,
    .banner.dark-translucent-bg,
    .banner.med-translucent-bg,
    .banner.default-translucent-bg {
        min-height: 350px;
        padding-top: 20px;
        padding-bottom: 20px;
        /*margin-top: 34px;*/
    }

    .banner.video-background-banner {
        min-height: 400px;
        padding-top: 100px;
    }

    .bg-off-white {
        background-color: #efefef
    }

    .tile-header-tollfree {
        /*cursor: pointer;*/
        /*cursor: -webkit-grabbing;*/
    }

    .dlk-radio input[type="radio"],
    .dlk-radio input[type="checkbox"] {
        margin-left: -99999px;
        display: none;
    }

        .dlk-radio input[type="radio"] + .fa,
        .dlk-radio input[type="checkbox"] + .fa {
            opacity: 0.15
        }

        .dlk-radio input[type="radio"]:checked + .fa,
        .dlk-radio input[type="checkbox"]:checked + .fa {
            opacity: 1
        }

    #MainContent_selLocalStates_chosen > a, #MainContent_selLocalCity_chosen > a {
        text-decoration: none !important;
    }

    .divTypesWrapper {
        background: radial-gradient(#555, transparent);
        padding-top: 5px;
    }

    .num-results-wrapper {
        position: relative;
        min-height: 120px;
    }

    .num-results2-wrapper {
        position: relative;
        min-height: 143px;
    }

    .num-results3-wrapper {
        position: relative;
        min-height: 165px;
    }

    .num-results-btn {
        position: absolute;
        bottom: 10px;
        left: 0;
        padding: 0 10px;
    }

    /* live help stuff */
.live-help-wrapper {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000000;
    /*to be above toast on dashboards*/
    /*border-radius: 20px!important;*/
    transition: 2.6s ease-in-out !important;
}

    #live-help-header {
        cursor: pointer;
        background-color: #ff5500;
        color: white;
    }

        #live-help-header:hover {
            background-color: #e64c00;
        }

    .live-help-panel {
        width: 350px;
        position: fixed;
        right: 10px;
        bottom: -10px;
    }

    .live-help-panel-init {
        bottom: -600px;
        /*opacity: 0 !important;*/
        transition: all .5s ease-in-out,opacity .1s ease !important;
        animation: none !important;
    }

    .live-help-panel-hide {
        bottom: -600px;
        /*opacity: 0 !important;*/
        transition: all .5s ease-in-out,opacity .1s ease !important;
    }

    .live-help-close {
        font-size: 1.7em;
        margin-right: -5px;
        margin-top: -8px;
        color: white;
        opacity: .7;
    }

    .live-help-panel-show {
        width: 350px;
        position: fixed;
        right: 10px;
        bottom: -10px;
        /*opacity: 1.0 !important;*/
        transition: all .5s ease-in-out,opacity .1s ease !important;
    }

    .btn-live-help {
        overflow: hidden;
        width: 14em;
        -webkit-transition: width 0.2s ease-in-out;
        -moz-transition: width 0.2s ease-in-out;
        transition: width 0.2s ease-in-out;
        font-size: 1.3em !important;
        line-height: 36px !important;
        border-radius: 20px !important;
    }

    .btn-live-help-sm {
        overflow: hidden;
        width: 3em;
        -webkit-transition: width 0.2s ease-in-out;
        -moz-transition: width 0.2s ease-in-out;
        transition: width 0.2s ease-in-out;
        font-size: 1.3em !important;
        line-height: 36px !important;
        border-radius: 20px !important;
    }

    .btn-init {
        bottom: -100px !important;
        opacity: 0 !important;
        transition: all .2s ease-in-out,opacity .1s ease !important;
        animation: none !important;
    }

    .btn-hide {
        bottom: -100px !important;
        /*opacity: 0 !important;*/
        transition: all .5s ease-in-out,opacity .1s ease !important;
    }

    .btn-show {
        bottom: 20px !important;
        opacity: 1.0 !important;
        transition: all .5s ease-in-out,opacity .1s ease !important;
    }

    .btn-help-orange {
        color: #ffffff;
        background-color: #ff5500;
        border-color: #CFBF44;
    }

        .btn-help-orange:hover,
        .btn-help-orange:focus,
        .btn-help-orange:active,
        .btn-help-orange.active,
        .open .dropdown-toggle.btn-help-orange {
            color: #ffffff;
            background-color: #e64c00;
            border-color: #CFBF44;
        }

        .btn-help-orange:active,
        .btn-help-orange.active,
        .open .dropdown-toggle.btn-help-orange {
            background-image: none;
        }

        .btn-help-orange.disabled,
        .btn-help-orange[disabled],
        fieldset[disabled] .btn-help-orange,
        .btn-help-orange.disabled:hover,
        .btn-help-orange[disabled]:hover,
        fieldset[disabled] .btn-help-orange:hover,
        .btn-help-orange.disabled:focus,
        .btn-help-orange[disabled]:focus,
        fieldset[disabled] .btn-help-orange:focus,
        .btn-help-orange.disabled:active,
        .btn-help-orange[disabled]:active,
        fieldset[disabled] .btn-help-orange:active,
        .btn-help-orange.disabled.active,
        .btn-help-orange[disabled].active,
        fieldset[disabled] .btn-help-orange.active {
            background-color: #DEA60D;
            border-color: #CFBF44;
        }

        .btn-help-orange .badge {
            color: #DEA60D;
            background-color: #ffffff;
        }

    .lstDelGroups, .lstDelRoute {
        list-style-type: none;
    }

        .lstDelGroups > li, .lstDelRoute > li {
            display: inline-block;
            min-width: 14em;
            font-weight: bold;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

    .panel-collapse.delTarget {
        border: 1px solid #ccc;
        border-top: none;
    }

    .spin {
        transition: .3s transform ease-in-out;
    }

    #accordionHeaderGroups.collapsed > div > h4 > div > span.spin,
    #accordionHeaderProfiles.collapsed > div > h4 > div > span.spin {
        transform: rotate(-90deg);
    }

    #accordionHeaderGroupsText, #accordionHeaderProfiles {
        transition: .3s opacity ease-in-out;
    }

    /* text messages chat stuff */
    ul#chatContent {
        list-style: none;
        padding-left: 0;
        margin-top: 5px;
    }

        ul#chatContent li.outbound:before {
            content: "\f32b";
            font-family: "Font Awesome 7 Pro";
            speak: none;
            font-style: normal;
            font-weight: bold;
            font-variant: normal;
            text-transform: none;
            display: inline-block;
            height: 40px;
            width: 40px;
            background-size: 40px;
            vertical-align: top;
            margin: -10px 10px 0 0;
            font-size: 40px;
            color: #4CAF50;
            opacity: .7;
            /*content: '';
        display: inline-block;
        height: 40px;
        width: 40px;
        background-size: 40px;
        background-image: url('/images/profile-person-01.png');
        background-repeat: no-repeat;
        vertical-align: top;
        margin-right: 10px;*/
        }

        ul#chatContent li.inbound:before {
            /*content: "\f3ce";*/
            content: "\f3cf";
            font-family: "Font Awesome 7 Pro";
            speak: none;
            font-style: normal;
            font-weight: bold;
            font-variant: normal;
            text-transform: none;
            display: inline-block;
            height: 40px;
            width: 40px;
            background-size: 40px;
            vertical-align: top;
            margin: -5px 5px 0 5px;
            font-size: 40px;
            color: #ffc966;
            opacity: .9;
        }

        ul#chatContent li div.date-time {
            padding-left: 50px;
            margin-top: -14px;
            margin-bottom: 15px;
            padding-right: 15px;
        }

        ul#chatContent li div {
            padding-left: 50px;
            margin-top: -10px;
            margin-bottom: 15px;
            padding-right: 15px;
        }

        ul#chatContent li span.heading {
            font-weight: bold;
            display: inline-block;
        }

        ul#chatContent li span.userName {
            font-weight: normal;
            display: inline-block;
            color: #aaa;
            padding-left: 5px;
        }

        ul#chatContent li time {
            color: #aaa;
        }

    li.word-list {
        display: inline-block;
        min-width: 8em;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    /* override distribution grid select 2 style */
    select.ib + span {
        display: inline-block;
    }

    /* targets & numbers bulk search textarea */
    #MainContent_txtBulkSearch {
        height: 25em;
    }

    div.choices-location > div {
        width: auto !important;
    }

    .selLocMenu-Width {
        width: 190px !important;
    }

    .selLocMenu-Audio-Width + span.select2 {
        width: 190px !important;
    }

    select.w-auto + div.chosen-container {
        width: auto !important;
    }

    @media (max-width: 768px) {
        .selLocMenu-Width {
            width: 100% !important;
        }

        .selLocMenu-Audio-Width + span.select2 {
            width: 100% !important;
        }

        select.w-auto + div.chosen-container {
            width: 100% !important;
        }
        .tagAdj {
            margin-left: 0!important;
            padding-left: 0!important;
        }
        .txtPop {
            display: block;
        }

        .ddlPop {
            width: 17em!important;
            display: inline-block!important;
        }

        .btnDn {
            margin-bottom: 1px!important;
        }
        .fixChkLbl { margin-left: 10px; }
        #MainContent_chkEnableSms, #MainContent_chkEnableSmsSentiment {
            margin-left: -10px;
        }
        .smsLbl { display: none; }
    }

    /* profile designer - routing grid node import input */
#MainContent_routingGridImportUpload_ctl01, #ctl00_MainContent_locationGroupFileUpload_ctl02 {
    border: 1px solid #ddd;
}
#ctl00_MainContent_routingGridImportUpload_ctl02 { width: 270px!important; }
/* advanced report editor */
.advancedEditor {
    position: relative;
    height: 300px;
    font-size: 1em;
    border: 1px solid #efefef; /* for light editor */
}

div#ctl00_MainContent_updLoadView > span,
div.ddl-delete > span { margin-bottom: 5px; }
.tagAdj { margin-left: 23%; }
/* hide callview sub-menu icons on tablet and below size screens */
@media (max-width: 840px) {
    .icon-hide {
        display: none;
    }
}

@keyframes wiggle {
	0% {transform:rotate(7deg);}
	50% {transform:rotate(-7deg);}
	100% {transform:rotate(7deg);}
}
.wiggler {
    -webkit-animation: wiggle 0.5s infinite;
    -moz-animation: wiggle 0.5s infinite;
    animation: wiggle 0.5s infinite;
    transform-origin: bottom;
}
#MainContent_chkNewEnableSip, #MainContent_chkEnableSip, #MainContent_chkCreateWhisperHoldTime,
#MainContent_chkPropertiesAdvanced, #MainContent_chkCreateRandomOrder, #MainContent_chkCreateRelativePeriodicFrequency,
#MainContent_chkCreateFirstUserAnnouncements, #MainContent_chkCreateAnnouncePositionOnImprovementOnly,
#ctl00_MainContent_chkViewAll, #MainContent_chkPropertiesWhisperHoldTime, #MainContent_chkPropertiesRandomOrder,
#MainContent_chkPropertiesRelativePeriodicFrequency, #MainContent_chkPropertiesFirstUserAnnouncements,
#MainContent_chkPropertiesAnnouncePositionOnImprovementOnly, #MainContent_chkCreateCallbackRequests,
#MainContent_chkPropertiesCallbackRequests, #MainContent_chkMenuEnableExtensionEntry, #MainContent_chkVipRuleEnableTag,
#MainContent_chkPauseGlobal, #MainContent_chkResumeGlobal, #MainContent_chkNewEnablePPC, #MainContent_chkNewEnableSocial,
#MainContent_chkNewEnableOrganic, #MainContent_chkNewEnableDirect, #MainContent_chkEditEnablePPC, #MainContent_chkEditEnableSocial,
#MainContent_chkEditEnableOrganic, #MainContent_chkEditEnableDirect, #MainContent_chkEditEnableReferral, #MainContent_chkNewEnableReferral {
    margin-right: 5px;
}
#MainContent_radAudioUpload, #MainContent_radAudioTTS {
    margin-right: 5px;
    cursor: pointer;
}
#MainContent_radAudioUpload + label, #MainContent_radAudioTTS + label {
    cursor: pointer;
}
#MainContent_chkSoftphoneOutbound, #MainContent_chkNewSoftphoneOutbound {
    margin-left: -10px;
}
#ctl00_MainContent_chkViewAll {
    vertical-align: top;
    margin-right: 10px;
    width: 16px;
    height: 16px;
    /*display: none;*/
}
    #ctl00_MainContent_chkViewAll + label {
        padding-top: 3px;
        cursor: pointer;
    }

/* page back buttons */
@media (min-width: 550px) {
    a#btnBack {
        display: none !important;
    }
}
.text-color-333 { color: #333; }
.text-size-x-large { font-size: x-large; }
.pt-2 { padding-top: 2px; }

.info-ul > li { margin-bottom: 5px; }

#MainContent_chkSoftphoneVoicemail + label, #MainContent_chkNewSoftphoneVoicemail + label {
    padding-left: 0 !important;
}
/* provisioning - manage clients styles */
.btn-link.active-p {
    color: #155082;
    background-color: #efefef;
}
.btn-link.active-p:hover {
    background-color: #efefef!important;
}
.btn-link.tab:hover {
    background-color: #f7f7f7;
}
.text-success-light {
    color: #28a745!important;
}
.table-colored > thead > tr > th {
    border-color: #3697d9;
    background-color: #3697d9;
    color: #ffffff;
}
.text-blue {
    color: #3697d9;
}
.chkCustom > input, .chkCustom > span > input {
    vertical-align: middle;
    margin: 0 5px 0 0;
}
label [for="MainContent_chkFirst"] {
    margin: 0;
}
.border-top-0 { border-top: 0; }
.selected { background-color: RGBA(255,193,7,0.3)!important; }

#MainContent_chkNewTrunkEnabled { margin-bottom: 5px!important; }
#MainContent_cmbNewClient + span {
    margin-bottom: 5px;
}
@media only screen and (max-width: 640px) {
    #MainContent_cmbNewClient + span {
        width: 100% !important;
    }
}
.kbHelpRight {
    position: absolute;
    top: 1rem;
    right: 1rem;
}
.helpDesc {
    white-space: normal;
    padding-right: 3rem;
}
/* integrations stuff */
.integrations-marketing {
    border: none;
    background: white;
    min-height: 20px;
    padding: 0 20px 20px 20px;
    margin-bottom: 20px;
}

.integration-cards {
    background-color: white;
    padding: 30px;
    min-height: 280px;
    margin-bottom: 2rem;
}
.card-icon-salesforce { width: 80px; }
.card-icon-google { width: 55px; }
.card-icon-hubspot { width: 150px; }
.card-icon-microsoft { width: 200px; }
.card-icon-zendesk { width: 200px; }
.card-icon-analytics { width: 20px; vertical-align: text-top; }
.card-icon-ads, .card-icon-search { width: 32px; vertical-align: text-top; }
.modal-icon-analytics, .modal-icon-ads, .modal-icon-search { width: 20px; vertical-align: text-top; }