@charset "UTF-8";

@font-face{
    font-family:'Material Icons';
    font-style:normal;
    font-weight:400;
    src:url(https://d2ffvluimla00s.cloudfront.net/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2')
}

body{
    font-family: Arial, Helvetica, sans-serif;
}

:root{
    --accent-color:rgb(50, 50, 50);
    --grid-color:rgb(199, 199, 199);
    --pad-left-base: 33px;
    --row-num-width: 75px;
    --reg-font-size: 17px
}


.relly{
    position:relative
}

.hide{
    display:none!important;
    max-height:0;
    max-width:0;
    top:0;
    left:0;
    opacity:0
}

.ovy{
    overflow: auto;
}

.no-ovy-y{
    overflow-y: hidden !important;
}

.pad-top-sm{
    padding-top:4px!important
}

.pad-top-ten{
    padding-top:10px!important
}

.pad-top-teen{
    padding-top:17px
}

.pad-top-thirty, .pad-top-trey{
    padding-top:33px
}

.pad-top-much{
    padding-top:75px
}

.o-visible{
    overflow: visible;
}

.dontwrap{
    white-space:nowrap
}

.inline-b{
    display:inline-block
}

.inline{
    display:inline
}
.half-wid{
    width:50%;
    vertical-align:top;
    display:inline-block
}
.qtr-wid{
    width:25%;
    vertical-align:top;
    display:inline-block
}
.third-wid{
    width:33.3%;
    vertical-align:top;
    display:inline-block
}

.two-third-wid{
    width:66.6%;
    vertical-align:top;
    display:inline-block
}

.three-qtr-wid{
    width:75%;
    vertical-align:top;
    display:inline-block
}

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

.v-mid{
    vertical-align: middle !important;
}

.v-bot{
    vertical-align: bottom !important;
}

.lg-text{
    font-size:larger
}

.xlg-text{
    font-size:x-large !important
}

.md-text{
    font-size:var(--reg-font-size)!important
}

.small-text{
    font-size:small
}

.tiny-text{
    font-size:x-small
}

.invisible{
    visibility:hidden
}

.flex-center{
    display:flex;
    justify-content:center;
    align-items:center
}

.flex-item{
    flex:1 1 auto
}

.o-x-hidden{
    overflow-x:hidden!important
}

.no-weight{
    font-weight: 400 !important;
}

.semi-heavy{
    font-weight:500!important
}

.heavy{
    font-weight:bold!important
}

.marauto{
    margin:0 auto
}

.center{
    text-align:center
}

.left{
    text-align:left
}

.right{
    text-align:right
}

.file-select-div {
    min-height: 70px;
}
.btn-file-select {
    left: 0;
    top: 18px;
    width: 150px;
    height: 44px;
    font-size: 16px;
    font-weight: 600;
    position: absolute;
}
#dataFile {
    left: 0;
    top: 18px;
    opacity: 0;
    width: 150px;
    height: 44px;
    cursor: pointer;
    position: absolute;
}

.btn-theme,
.btn-switch-sheets {
    border: none;
    color: #fff;
    padding: 4px;
    background: var(--accent-color);
}
.btn-theme:hover,
.btn-switch-sheets:hover,
.mock-button-hover {
    background: #4b4b4b;
    box-shadow: 0 0 4px 1px var(--accent-color);
    -webkit-box-shadow: 0 0 4px 1px var(--accent-color);
    -moz-box-shadow: 0 0 4px 1px var(--accent-color);
}

.btn-reset{
    border:none;
    color:#fff;
    padding: 7px 11px;
    background:maroon
}

.error-message{
    color:maroon;
    font-weight: 500;
}

.success{
    color:green;
    font-weight: 500;
}

.neutral{
    color: var(--accent-color);
}

#topLevelDataFilter{
    float: left;
    padding: 7px 5px;
    vertical-align: middle;
    box-shadow: 0 0 1px 1px var(--grid-color);
    -moz-box-shadow: 0 0 1px 1px var(--grid-color);
    -webkit-box-shadow: 0 0 1px 1px var(--grid-color);
}

input, select{
    border:none;
    padding:3px;
    border-radius:3px;
    box-sizing: border-box;
    font-family:'Roboto Condensed', Arial, Helvetica, sans-serif;
    box-shadow:0 0 1px 1px #afafaf;
    -moz-box-shadow:0 0 1px 1px #afafaf;
    -webkit-box-shadow:0 0 1px 1px #afafaf
}

input[type=radio], input[type=checkbox] {
    cursor: pointer;
    box-shadow: none !important;
    -moz-box-shadow: none!important;
    -webkit-box-shadow: none !important;
}

button, .deebo-dd-opt label{
    cursor: pointer;
}

button:focus,input:focus,select:focus{
    outline-width:0
}

button:disabled,input:disabled,select:disabled{
    opacity:.5;
    cursor: not-allowed;
}

.controls{
    text-align:right;
    padding:16px 11px 6px;
    max-width:100%;
    clear: both;
    overflow-x:auto;
    white-space:nowrap
}

.controls button{
    font-size: var(--reg-font-size);
    margin-right:31px;
    vertical-align:middle
}

.controls button span{
    vertical-align: middle;
}

.controls button:last-of-type{
    margin-right:0
}

.data-table{
    margin-top:17px;
    overflow:hidden;
    box-shadow:0 -1px 3px 1px var(--grid-color);
    -moz-box-shadow:0 -1px 3px 1px var(--grid-color);
    -webkit-box-shadow:0 -1px 3px 1px var(--grid-color)
}

.sel-rows-checked, .controls button:not(.btn-chart) .material-icons:not(.error-message):hover{
    color: rgba(0, 168, 243, 0.6) !important;
}

.row-group-panel{
    padding: 17px 11px;
    border-bottom: 1px dotted var(--accent-color);
}

.open-panel{
    box-shadow: 0 1px 3px 1px var(--grid-color);
    -moz-box-shadow: 0 1px 3px 1px var(--grid-color);
    -webkit-box-shadow: 0 1px 3px 1px var(--grid-color);
}

.deebo-dd-select-hide{
    opacity: 0;
    max-height: 0;
    min-width: 0;
    max-width: 0;
    overflow: hidden;
}

.deebo-dd-contain-div{
    margin: 0 31px;
}

.deebo-dd-contain-div:last-of-type{
    margin-right: 0 !important;
}

.deebo-dd-contain{
    height:36px;
    border:none;
    padding: 0 7px;
    cursor: pointer;
    border-radius:3px;
    display: inline-flex;
    background: white;
    vertical-align: middle;
    box-sizing: border-box;
    border-bottom: none !important;
    box-shadow:0 0 1px 1px var(--grid-color);
    -moz-box-shadow:0 0 1px 1px var(--grid-color);
    -webkit-box-shadow:0 0 1px 1px var(--grid-color);
    font-family:'Roboto Condensed', Arial, Helvetica, sans-serif
}

.deebo-dd-selected{
    position: relative;
}

.deebo-dd-contain button, .deebo-dd-contain label{
    padding: 0;
    overflow: hidden;
    vertical-align: middle;
}

.deebo-dd-contain button span, .deebo-dd-contain button i{
    vertical-align: middle;
    font-size: var(--reg-font-size);
}

.deebo-dd-opt{
    padding: 15px 7px;
    overflow-x: hidden;
    text-overflow: ellipsis;
    border-bottom: 1px solid var(--grid-color);
}

.deebo-dd-opt label:hover{
    text-decoration: underline;
}

.deebo-dd-opt button, .deebo-dd-opt div{
    width: 100%;
    text-align: left;
    font-size: var(--reg-font-size);
}

.btn-deebo-dd i{
    margin-left: 5px;
}

.deebo-dd-select{
    right: 0;/*keeps export dd from flowing off page horiz*/
    top: -150px;
    z-index: 10;
    border-radius: 3px;
    position: absolute;
    background: white;
    opacity: 1 !important;
    overflow: auto !important;
    min-height: 120px;
    white-space: normal;
    min-width: 200px !important;
    max-width: 275px !important;
    max-height: 300px !important;
    box-shadow:0 0 2px 2px var(--grid-color);
    -moz-box-shadow:0 0 2px 2px var(--grid-color);
    -webkit-box-shadow:0 0 2px 2px var(--grid-color);
    transition: opacity 0.2s ease;
}

.deebo-dd-opt:hover{
    background: #ebebeb;
}

.deebo-dd-opt:last-of-type{
    border-bottom: none;
}

.btn-export{
    width: 100%;
}

.btn-export:hover{
    text-decoration: underline;
}

.btn-ctrl-sel-rows{
    border:none;
    padding: 3px 4px;
    border-radius:5px;
    background:#f5f5f5;
    box-shadow:0 0 2px 1px gray;
    -moz-box-shadow:0 0 2px 1px gray;
    -webkit-box-shadow:0 0 2px 1px gray;
}

.btn-ctrl-sel-rows:hover{
    background:#ebebeb;
    box-shadow:0 0 6px 2px gray; 
    -moz-box-shadow:0 0 6px 2px gray; 
    -webkit-box-shadow:0 0 6px 2px gray;
}

.btn-center-selected{
    padding: 2px 4px;
    border-radius:5px;
    background:#f5f5f5;
    box-shadow:0 0 6px 2px gray; 
    -moz-box-shadow:0 0 6px 2px gray; 
    -webkit-box-shadow:0 0 6px 2px gray;
}

.btn-ctrl-sel-rows .material-icons{
    font-size: 18px;
    font-weight: 600;
    vertical-align: middle;
}

.btn-ctrl-sel-rows .material-icons:not(.error-message){
    color: var(--accent-color);
}

.btn-o-design .material-icons{
    font-size: 18px;
    font-weight: 600;
    vertical-align: middle;
    color: var(--accent-color);
}

#dataTableBody{
    height:500px;
    overflow:auto
}

.btn-x-advice{
    top: 3px;
    right: 3px;
    border: none;
    background: none;
    position: absolute;
    color: white;
    font-size: larger;
    text-shadow: 1px -1px black;
}

.data-table-headers{
    cursor: pointer;
    white-space:nowrap;
    border-bottom: 1px solid var(--grid-color);
}

.data-table-row{
    white-space:nowrap;
}

.data-table-row:hover, .data-table-row .col-item-freeze:hover/*, .data-table-row:not(.data-row-selected):nth-of-type(even):hover*/{
    background:#f3f3f3
}

/*.data-table-row:not(.data-row-selected):nth-of-type(even){
    background:#fafafa
}*/

.data-row-selected{
    background:#d6d6d6 !important;
}

.select-row-check{
    left: 9px;
    z-index: 10;
    cursor: pointer;
    margin: 0 0 0 0;
    position: absolute;
    padding: 0 !important;
}

.gb-row-num{
    left: 2px;
    z-index: 10;
    cursor: pointer;
    margin: 0 0 0 0;
    font-size: x-small;
    position: absolute;
    padding: 0 !important;
}

.btn-chart, .btn-clear-grp{
    border-radius: 3px;
}

.btn-chart i{
    font-size: 28px;
    vertical-align: middle;
    color: var(--accent-color);
}

.btn-chart:hover, .btn-clear-grp:hover{
    background: #e9e9e9;
    transition: background 0.5s ease;
}

.has-symbol::after{
    content: attr(data-symbol);
    padding-left: 3px;
}

.has-symbol-b::before{
    content: attr(data-symbol);
    padding-right: 3px;
}

.data-table-row-no-data{
    font-size: xx-large;
    color: gray;
    font-weight: 500;
    text-shadow: -1px -1px var(--accent-color);
}

.data-row-selected .col-item-freeze, .data-row-selected .data-cell{
    background:#d6d6d6 !important;
}

.data-row-selected:hover, .data-row-selected .col-item-freeze:hover, .data-row-selected .data-cell:hover{
    background:#d6d6d6 !important;
}

.data-table-headers .col-item-freeze:first-of-type{
    border-bottom: 1px solid var(--grid-color);
}

.col-header{
    z-index:2;
    width:125px;
    overflow:auto;
    cursor: grab;
    padding:7px 3px;
    text-align:center;
    position:relative;
    box-sizing:border-box;
    display:inline-block;
    vertical-align: top;
    white-space:pre-wrap;
    word-wrap: break-word;
    background: #fafafa;
    border-right:1px solid var(--grid-color)
}

.col-header button, .col-header span, .col-header select{
    cursor: pointer;
    vertical-align:middle
}

.col-header input{
    vertical-align:middle
}

.col-header-img-container{
    overflow-y: hidden;
    text-align: center;
    display: inline-block;
    vertical-align: middle;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
    
.col-header-minimized{
    width:0!important;
    height:0!important;
    padding:0!important;
    overflow:hidden!important;
    border-bottom:none!important;
    border-right:none!important;
    transition:width 0.3s ease
}

.btn-maximize-col{
    border:none;
    border-radius:5px;
    background:#f5f5f5;
    box-shadow:0 0 3px 2px gray;
    font-size:var(--reg-font-size);
    margin-right:27px;
    padding:4px
}

.no-btn{
    border:none;
    background:none
}

.col-item-freeze{
    left: 0;
    z-index: 3;
    position: sticky;
    background: white;
    box-shadow: 2px 0px 3px 0px var(--grid-color);
    -moz-box-shadow: 2px 0px 3px 0px var(--grid-color);
    -webkit-box-shadow: 2px 0px 3px 0px var(--grid-color);
}

.col-header input, .select-filter{
    width:40%;
    margin:11px 0 1px 0
}

#selFilContainer, #validatedEdit{
    z-index: 10;
}

.edit-input{
    border: none;
    font-size: 15px;
    box-shadow:none;
    position: absolute;
    background: white;
    -moz-box-shadow:none;
    -webkit-box-shadow: none;
    box-sizing: border-box;
}

.edit-input[type=number]{
    text-align: right;
}

.edit-input[type=date]{
    padding-left: 17px;
}

.edit-input-option-cont{
    left: 0;
    right: 0;
}

.edit-input-opt button{
    width: 100%;
    font-size: 15px;
    padding: 11px 0 11px 17px;
    text-align: left !important;
}

.selfil-opt-contain, .edit-input-option-cont{
    overflow: auto;
    max-height: 240px;
    border-radius: 5px;
    position: absolute;
    background: white;
    box-shadow: 0 1px 3px 1px var(--grid-color);
    -moz-box-shadow: 0 1px 3px 1px var(--grid-color);
    -webkit-box-shadow: 0 1px 3px 1px var(--grid-color);
}

.selfil-div, .edit-input-opt{
    cursor: pointer;
    text-align: left;
    border-bottom: 1px solid var(--grid-color);
}

.selfil-div:hover, .edit-input-opt:hover{
    background: rgb(235, 235, 235);
}

.selfil-div:last-of-type, .edit-input-opt:last-of-type{
    border-bottom: none;
}

.selfil-div label{
    width: calc(100% - 22px);
    font-size: 15px;
    cursor: pointer;
    padding: 11px;
    display: inline-block
}

.selfil-div label input[type=checkbox]{
    margin-right: 11px;
    vertical-align: middle;
}

.select-filter-comparator{
    width:36px;
    z-index: 3;
    opacity: 0;
    position: relative;
    margin:11px 0 1px 15px
}

.btn-fil-comp{
    top:2px;
    left: -36px;
    border: none;
    position: absolute;
    background: #fafafa;
}

.btn-fil-comp i{
    color: var(--accent-color);
}

@media screen and (min-width:960px){
    .col-header input, .select-filter, .select-filter-comparator{
        margin-top:7px;
        margin-bottom:1px
    }
    .file-select-div {
        min-height: 52px;
    }
    .btn-file-select,
    #dataFile {
        top: 0;
    }
}

.btn-x-filter{
    padding: 0;
    float: left;
    border: none;
    color: maroon;
    background: none;
    font-size: x-large;
    line-height: 16px;
    margin: 17px 0 0 3px;
}

.btn-x-filter:hover{
    background: #fdf3f3;
}

.data-cell{
    width:125px;
    padding: 11px 6px 11px 17px;
    overflow:auto;
    font-size: 15px;
    word-wrap: break-word;
    white-space:pre-line;
    vertical-align: top;
    box-sizing:border-box;
    display:inline-flex;
    align-items: center;
    border-right:1px solid var(--grid-color);
    border-bottom:1px solid var(--grid-color);
}

input.edit-input{
    border-radius: 0;
}

.data-cell:focus, input.edit-input:focus{
    outline: 1px solid #00a8f3;
}

.dragger-cell-focused{
    background: rgba(0, 168, 243, 0.2);
    border-left: 1px solid #00a8f3;
    border-right: 1px solid #00a8f3 !important;
}

.focused-cell-dragger{
    width: 9px;
    height: 9px;
    cursor:crosshair;
    position: absolute;
    background: #00a8f3;
    box-shadow: 0 0 1px 1px var(--accent-color);
    -moz-box-shadow: 0 0 1px 1px var(--accent-color);
    -webkit-box-shadow: 0 0 1px 1px var(--accent-color);
}

.holding-check{
    padding-left: 44px;
}

.data-cell-riiight{
    padding: 11px 17px 11px 6px;
    justify-content: right
}

.data-cell-ceeenter{
    padding: 11px 6px;
    justify-content: center !important
}

.data-cell img{
    max-width: 100%;
    height: auto;
    margin: 0;
    vertical-align: middle;
}

.cell-og-link{
    line-height: 0;
    visibility: hidden;
}

.cell-og-link::before{
    visibility: visible;
    content: attr(data-title);
}

.moveable-col{
    cursor: col-resize !important;
}

.moveable-row{
    cursor: row-resize !important;
}

.bot-bord-cell{
    display: block;
    cursor: pointer;
    padding-left: 24px;
    border-bottom: 1px solid var(--grid-color);
}

.data-sort-arr{
    cursor:pointer;
    margin-left:11px;
    border:none;
    background:none;
    padding: 0 0 0 2px;
    color:var(--accent-color)
}

.data-sort-arr .material-icons{
    font-size:20px;
}

.data-col-info{
    left:10px;
    top: 12px;
    padding: 0;
    border:none;
    cursor:pointer;
    background:none;
    position: absolute;
    color:var(--accent-color)
}

.data-col-info .material-icons{
    font-size:16px;
}

.sort-order-indicator{
    font-weight: 600;
    vertical-align: middle;
    font-size: 16px;
}

.btn-min-col{
    cursor:pointer;
    top:0;
    right:2px;
    font-size:20px;
    border:none;
    background:none;
    position:absolute;
    padding:0 2px 5px 0;
    color:var(--accent-color)
}

.btn-min-col-hide{
    z-index: 0;
    visibility: hidden;
    pointer-events: none;
}

.btn-freeze-col{
    float:left;
    border:none;
    cursor:pointer;
    background:none
}

.btn-freeze-col .material-icons{
    font-size:16px;
    color:var(--accent-color)
}

.hidden-cols{
    max-width:100%;
    overflow-x:auto;
    clear: both;
    white-space:nowrap
}

.hidden-cols button:first-of-type::before{
    content:'Hidden Columns';
    font-size:12px;
    font-weight:600;
    padding-right:11px;
    vertical-align:middle
}

.col-header span{
    word-wrap: break-word;
    vertical-align:middle;
    font-size: var(--reg-font-size);
}

.data-table-footer{
    padding:15px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
    box-shadow:0 1px 3px 1px var(--grid-color);
    -moz-box-shadow:0 1px 3px 1px var(--grid-color);
    -webkit-box-shadow:0 1px 3px 1px var(--grid-color)
}

#skipTo{
    min-width: 120px;
}

.skip-to-contain{
    position: relative;
    display: inline-block;
    vertical-align: middle;
}

.skip-to-options-hide{
    opacity: 0;
    max-height: 0;
    min-width: 0;
    max-width: 0;
    overflow: hidden;
}

.skip-to-options{
    right: 0;
    z-index: 10;
    bottom:33px;
    border-radius: 3px;
    position: absolute;
    background: white;
    vertical-align: middle;
    opacity: 1 !important;
    overflow: auto !important;
    min-width: 175px !important;
    max-width: 200px !important;
    max-height: 200px !important;
    min-height: 150px;
    box-shadow:0 0 3px 2px var(--grid-color);
    -moz-box-shadow:0 0 3px 2px var(--grid-color);
    -webkit-box-shadow:0 0 3px 2px var(--grid-color);
    transition: opacity 0.2s ease;
}

.skip-to-options div{
    cursor: pointer;
    padding: 15px 7px;
    text-align: left !important;
    border-bottom: 1px solid var(--grid-color);
}

.skip-to-options div:hover{
    text-decoration: underline;
}

.skip-to-options div:last-of-type{
    border-bottom: none;
}


.paginator-half-wid{
    white-space:nowrap;
    overflow:auto
}

.selected-row-insights{
    opacity: 0;
    z-index: 10;
    height: 500px;
    position: fixed;
    overflow: hidden;
    min-width: 300px;
    padding: 11px 15px;
    border-radius: 7px;
    background: white;
    box-sizing: border-box;
}

.selected-row-insights-show{
    opacity: 1 !important;
    transition: opacity 0.7s ease;
}

.selected-row-insights h2, .insights h2{
    font-weight: 400;
}

.sel-ins-scrl-cont{
    overflow: auto;
}

.selected-row-insights .insight-field-row:last-of-type{
    border-bottom: none;
}

.dt-checks{
    margin-left: var(--row-num-width);
}

.row-numbers{
    margin-top: 11px;
    display: inline-block;
    width: var(--row-num-width);
}

.row-num-header{
    background: #e9e9e9;
    box-sizing: border-box;
    border-bottom: 1px solid var(--accent-color);
    border-right: 1px solid var(--accent-color);
    box-shadow:0 -1px 3px 1px var(--grid-color);
    -moz-box-shadow:0 -1px 3px 1px var(--grid-color);
    -webkit-box-shadow:0 -1px 3px 1px var(--grid-color)
}

.num-row{
    white-space:nowrap;
    box-sizing:border-box;
    border-left: 1px solid var(--grid-color);
    border-bottom: 1px solid var(--grid-color);
}

.inline-table{
    display: inline-block;
    width: calc(100% - var(--row-num-width));
}

.insights{
    padding-top:33px
}

.insight-field{
    padding: 21px 0;
    font-size: large;
    white-space:pre-wrap;
    word-wrap: break-word;
    border-bottom:1px solid lightgray
}

.btn-refresh-insights{
    margin-left: 11px;
    background: none;
    border: none;
    font-weight: 600;
    border-radius: 3px;
    vertical-align: middle;
}

.btn-refresh-insights i{
    vertical-align: middle;
}

.btn-refresh-insights:hover{
    background: #d6d6d6;
    transition: background 0.3s ease;
}

.o-ins-div span, .o-ins-div i{
    vertical-align: middle;
    font-size: 16px;
}

@media screen and (max-width: 760px){
    .insight-field:first-of-type{
        padding-top: 7px;
    }
}

@media screen and (min-width:760px){
    .insight-field-row{
        border-bottom:1px solid lightgray
    }

    .insight-field, .aux-chip{
        width:50%;
        vertical-align:top;
        display:inline-block;
        border-bottom:none
    }
}

@media screen and (min-width:1024px){
    .insight-field, .aux-chip{
        width:33%
    }
}

.insight-field div{
    box-sizing: border-box;
    padding:7px 7px 0 2px
}

.insight-field .half-wid{
    padding: 0 !important;
    margin: 11px 0 7px 0;
}

.insight-field .half-wid span{
    vertical-align: middle;
}

.chart-label-cont{
    padding-top: 10px;
    text-align: center;
}

.pie-piece-label{
    padding-top: 5px;
    margin-right: 27px;
    display: inline-block;
}

.pie-piece-label-sq{
    width: 11px;
    height: 11px;
    margin: 0 0 0 2px;
    display: inline-block;
    vertical-align: middle;
}

.pie-piece-label span{
    font-size: small;
}

.pie-piece-label span::before{
    font-size: smaller;
    padding-right: 4px;
    font-weight: 600;
    content: attr(data-percent);
}

.pie-layover{
    border-radius: 50%;
    background: white;
    position: absolute;
    padding: 5px !important;
    display: flex;
    font-size: 17px;
    align-items: center;
    overflow: hidden;
    box-sizing: border-box;
    justify-content: center;
    color: var(--accent-color);
}

.pie-layover div{
    font-weight: 600;
    padding: 0 !important;
}

.inner-bg-contain{
    position: relative;
    box-sizing: border-box;
}

.inner-bg-contain::before{
    top: 50%;
    left: -48px;
    font-size: x-large;
    position: absolute;
    display: block;
    color: var(--grid-color);
    content: attr(data-yaxis);
    transform: rotate(-90deg);
}

.inner-bg-contain div{
    padding: 0;
}

.stat-opt-contain{
    white-space: nowrap;
    margin-bottom: 27px;
    padding: 0 !important;
}

.stat-opt-contain .inline-b{
    width: 16.6%;/*6 stat opts*/
    padding: 0 !important;
}

.stat-opt-btn{
    width: 100%;
    padding-bottom: 3px;
    box-sizing: border-box;
}

.stat-opt-btn-active{
    font-weight: bold;
    border-bottom: 2px solid var(--grid-color);
}

.bar-graph-y-cols{
    z-index: 5;
    margin-left: 5px;
    overflow: visible;
    position: relative;
    vertical-align: top;
    box-sizing: border-box;
    display: inline-block;
    border-right: 1px solid var(--grid-color);
}

.bar-graph-real-vals{
    position: relative;
}

.bar-graph-x-cols{
    white-space: nowrap;
    overflow-x: visible;
    padding: 11px 0 0 0 !important;
    border-top: 1px solid var(--grid-color);
}

.bg-dep-var{
    overflow: hidden;
    height: 70px;
    width: 100%;
    display: flex;
    padding: 0 5px;
    font-size: 14px;
    line-height: 14px;
    align-items: end;
    font-weight: 600;
    justify-content: right;
    box-sizing: border-box;
}

.bg-dep-var div{
    word-break:break-all;
    color: var(--accent-color);
}

.bg-dep-var:first-of-type{
    height: 17px !important;
    position: relative;
    overflow: visible !important;
}

.bg-dep-var:first-of-type::before{
    top: 0;
    overflow: visible;
    position: absolute;
    content: attr(data-number);
    visibility: visible !important
}

.bg-dep-var:last-of-type{
    overflow: visible !important;
}

.bg-dep-var:last-of-type::after{
    content: attr(data-number);
    margin-bottom: -7px;
}

.graph-actual-bar{
    bottom: 0;
    position: absolute;
    align-items: center;
    background: white;
}

.graph-actual-bar div{/*these divs are the actual colored bars*/
    height: 0;
    width: 80%;
    margin: 0 auto;
    background: #afafaf;
    transition: height 0.3s ease-out;
}

.graph-actual-bar:hover{
    z-index: 10;
}

.graph-actual-bar:hover::before{
    width: 150px;
    display: block;
    font-weight: 500;
    font-size: small;
    white-space: nowrap;
    background: white;
    padding: 1px 2px 3px 2px;
    content: attr(data-value);
    border-radius: 3px;
}

 .bg-ind-var{
    font-size: small;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    color: var(--accent-color);
    transform: rotate(45deg);
}

.lbl-show{
    overflow: visible !important;
    transition: overflow 0.2s ease;
}

.bar-graph-x-label{
    font-size: x-large;
    font-weight: 500;
    padding: 17px 0 0 0 !important;
    text-align: center;
    overflow-x: hidden;
}

.ins-even-dist-ct{
    font-size: 24px;
    font-weight: 500;
}

.line-graph-container{
    padding: 11px 0 33px 7px !important;
    box-sizing: border-box;
    margin-left: 11px;
}

.lg-title-cont{
    padding: 0 !important;
    text-align: center;
    margin: 17px 11px;
}

.lg-n-marker-cont{
    width: 60px;
    position: relative;
    padding: 0 !important;
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
}

.lg-n-marker-cont::before{
    top: 45%;
    left: -37px;
    display: block;
    position: absolute;
    white-space: nowrap;
    color: var(--grid-color);
    content: attr(data-column);
    transform: rotate(-90deg);
}

.lg-n-marker, .lg-n-marker-h{
    padding: 0 11px 0 0!important;
    font-size: small;
    position: relative;
    text-align: right;
    white-space: nowrap;
    box-sizing: border-box;
}

.line-graph{
    width: calc(92% - 60px);
    position: relative;
    box-sizing: border-box;
    display: inline-block;
    vertical-align: top;
    padding: 0 !important;
    border-left: 1px solid var(--accent-color);
    border-bottom: 1px solid var(--accent-color);
}

.aux-opts-cont{
    padding: 0 0 17px 0 !important;
}

.lg-lbl-x{
    left: 0;
    right: 0;
    bottom: -45px;
    font-size: small;
    font-weight: 500;
    text-align: center;
    position: absolute;
    padding: 0 !important;
}

.btn-line-graph-opts{
    margin: 0;
    padding: 4px;
    background: none;
    border-top: 1px solid var(--accent-color);
    border-left: 1px solid var(--accent-color);
    border-bottom: 1px solid var(--accent-color);
}

.sp-line-graph-title{
    margin-top: 7px;
    font-size: large;
    text-decoration: underline;
}

.lg-dt-marker, .lg-dt-marker-h, .vd-n-marker, .vd-n-marker-h{
    bottom: -22px;
    font-size: small;
    position: absolute;
    text-align: center;
    padding: 0 !important;
    display: inline-block;
    box-sizing: border-box;
}

.lg-dt-marker-h, .vd-n-marker-h{
    visibility: hidden;
}

.lg-dt-marker.visible-marker{
    margin-left: 21px;
}

.lg-n-marker-h{
    height: 0;/*very important for line graph/dot plot*/
    visibility: hidden;
}

.visible-marker{
    z-index: 2;
    font-weight: 600;
    background: white;
    height: unset !important;
    padding: 1px 2px !important;
    visibility: visible !important;
    box-shadow:0 0 2px 1px #afafaf;
    -moz-box-shadow:0 0 2px 1px #afafaf;
    -webkit-box-shadow:0 0 2px 1px #afafaf
}

.visible-marker::before{
    font-weight: 600;
}

.lg-dt-marker::before{
    top: -15px;
    left: 0;
    content: "|";
    position: absolute;
}

.vd-n-marker::before{
    top: -15px;
    left: 50%;
    content: "|";
    left: calc(50% - 2px);
    position: absolute;
}

.lg-n-marker::before{
    top: -4px;
    right: -3px;
    content: "-";
    font-weight: 600;
    font-size: large;
    position: absolute;
    background: white;
}

.btn-line-graph-opts:hover{
    background: #d6d6d6;
    transition: background 0.3s ease;
}

.btn-line-graph-opts:last-of-type{
    border-right: 1px solid var(--accent-color);
}

.btn-lg-sel{
    color: white !important;
    background: var(--accent-color);
    box-shadow:0 0 2px 1px #afafaf;
    -moz-box-shadow:0 0 2px 1px #afafaf;
    -webkit-box-shadow:0 0 2px 1px #afafaf
}

.btn-lg-sel:hover{
    background: var(--accent-color);
}

.lg-plot{
    height: 8px;
    width: 8px;
    opacity: .3;
    cursor: pointer;
    border-radius: 50%;
    position: absolute;
    padding: 0 !important;
    background: var(--accent-color);
}

.lg-plot:hover{
    z-index: 100;
    opacity: 1 !important;
}

.lg-plot:hover::after{
    padding: 3px;
    display: inline-block;
    font-size: small;
    border-radius: 5px;
    margin: 0 0 0 25px;
    font-weight: bold;
    content: attr(data-number);
    background: white !important;
    box-shadow:0 0 2px 1px #afafaf;
    -moz-box-shadow:0 0 2px 1px #afafaf;
    -webkit-box-shadow:0 0 2px 1px #afafaf
}

.lg-plot-opq{
    opacity: 0;
    background: white;
}

.lg-plot-opq:hover{
    opacity: 1 !important;
    background: var(--grid-color);
    transition: opacity 0.2s ease;
}

.lg-canvas{
    top: 0;
    left: 0;
    bottom: 0;
    position: absolute;
}

.lg-msg{
    top: 0; 
    left: 0; 
    right: 0;
    position: absolute; 
    color: var(--accent-color);
}

.num-col-val-dist-cont{
    height: 36px;
    margin: 17px 0;
    position: relative;
    box-sizing: border-box;
    padding: 0 !important;
    border-bottom: 1px solid var(--grid-color);
}

.num-col-val-dist-bar{
    top: 6px;
    bottom: 0;
    width: 12px;
    opacity: 0.1;
    height: 30px;
    position: absolute;
    padding: 0 !important;
    box-sizing: border-box;
    background: var(--accent-color);
}

.num-col-avg-dist-bar{
    top: 3px;
    bottom: 0;
    width: 1px !important;
    position: absolute;
    padding: 0 !important;
    box-sizing: border-box;
    background: #00a8f3;
}

.num-col-avg-dist-bar::before{
    display: block;
    content: "Avg.";
    font-size: small;
    white-space: nowrap;
    margin: -15px 0 0 -9px;
}

.num-col-val-dist-bar:hover{
    opacity: 1;
    z-index: 2;
}

.num-col-val-dist-bar:hover::before, .num-col-avg-dist-bar:hover::before{
    display: block;
    font-size: small;
    white-space: nowrap;
    margin: -15px 0 0 -5px;
    background: white;
    padding: 2px;
    content: attr(data-number);
}

.material-icons{
    font-family:'Material Icons';
    font-weight:400;
    font-style:normal;
    font-size:24px;
    line-height:1;
    letter-spacing:normal;
    text-transform:none;
    display:inline-block;
    white-space:nowrap;
    word-wrap:normal;
    direction:ltr;
    font-feature-settings:'liga';
    -webkit-font-smoothing:antialiased;
    -webkit-font-feature-settings:'liga';
    -webkit-font-smoothing:antialiased
}