h2 {
    float: right;
    font-weight: bold;
    }
h2 span {
    font-size:0.4375vw;
    font-weight: normal;
    }

span.ad {
    color: var(--secondary-color);
    font-size: 0.95vw;
    font-weight: bold;
    }

h4 {
    font-weight: bold;
    }

h2 span a, 
h4 span a, 
h2 span a:visited,
h4 span a:visited {
    font-size:0.45vw;
    font-weight: normal;
    color: #08c !important;
    }

.dashboardTab {
    display: flex;
    flex-flow: column wrap;
    justify-content: space-evenly;
    align-items: center;
	overflow-x:hidden;
	overflow-y:auto;
    }

.chartLine {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
    }

.buttonsLine {
    width: 50%;
    display: flex;
    flex-flow: row wrap; 
    justify-content: center;

    }

.buttonsLine button, .date-range {
    margin: 0.3125vw 0.15625vw 0.3125vw 0.15625vw;
    }

.buttonsGroup{
    }


.container {
    display: flex;
    padding-bottom: 2.1875vw;
    }
.gridster{
    display:flex;
    margin: 0.3125vw;
    background-color: #f2f2f2;
    width: 99%;
    height: 100%;
    }

div.widget {
    background-color: white;
	box-shadow: 0.1vw 0.031vw 0.25vw #555;
	border-radius: 0.15625vw;
	padding: 0.0625vw;
    }

div.gridster > div > div {
    width: 100%;
    height: 100%;
    //padding: 10;
    }

header.grab {
    color: #B2B2B2;
    font-weight: bold; 
    cursor: -webkit-grab;
    cursor: grab;
    display: flex;
    flex-flow:  wrap;
    justify-content: center;
    visibility: hidden;
    }
header.chartBtn {
    color: #B2B2B2;
	background-color: lightgrey;
    font-weight: bold; 
    /*cursor: zoom-in;*/
    cursor: grab;
    display: flex;
    /*flex-flow:  wrap;*/
    justify-content: right;
    visibility: hidden;
    }
div.dash-chart{
    width: 100%;
    height: 100%;
     left:1.5625vw;
     top:1.5625vw;
    }

    
.legend-area{
	position:absolute;
	bottom:0;
	right:0;
	padding:0.3125vw;
	background:#fff;
	outline:0.1vw solid #000;
	line-height:1em}
h4{
	padding:0;
	margin: 0 0 0 .156vw;
}

.minLegend{float:left}
.maxLegend{float:right}
 span{
     font-size:0.45vw;
     margin:0;
     padding:0;
	 font-size: 0.65vw;
     }
 
 .tooltip{position:absolute;
     left:0;
     top:0;
     background:rgba(0,0,0,.8);
     color:#fff;
     font-size:0.45vw;
     padding:0.156vw;
     line-height:0.6vw;
     display:none
     }
 .demo-wrapper{
     position:relative
     }
     
 .slider-div {
    color:Green;
    background-color:#aaa;
    border:0.7vw solid #333;
    display:none;
    text-align:justify;
}
.slider-div p {
    margin: 0.468vw;
    font-size: 0.46vw;
}

.compass-btn {
    position: absolute;
    right:0; top:50%;
    width:2.1875vw; height:2.1875vw;
    margin: -0.5625vw 0.5625vw 0 0.5625vw;
    cursor: pointer;
}
.compass {
    position: absolute;
    width:100%; height:100%;
    background: #fff;
    border-radius: 0 50% 50% 50%;
    border: 0.1vw solid grey;
    box-shadow: 0 0 0.125vw rgba(200,100,100,.2);
    border-right-color: #aa5050;
    border-bottom-color: #aa5050;
    transition: border-radius .2s;
    box-sizing: border-box;
}
.compass-btn:hover .compass {
    border-radius: 50%;
}
.compass-msg {
    position: absolute;
    width:100%; height:100%;
    line-height: 2.1875vw;
    text-align: center;
    color: #aaa;
    font-family: 'Roboto', sans-serif;
    font-size: 0.468vw;
    font-weight: 150;
}

.slider-selection {
  background: #BABABA;
}

.filterList  {
	/*position:relative;*/
	/*top:1.5vw;*/
    width:100%; 
    text-align: left;
    color: #888;
    font-family: 'Roboto', sans-serif;
    font-size: 0.625vw;
    margin-bottom: 0;
}

.filtersChart{
	position:relative;
	width:100%;
	top:1.5vw;
    /*text-align: left; */
    color: #888;
    font-family: 'Roboto', sans-serif;
    font-size: 0.5vw;
}

.chart-title{
    color: #888;
    font-family: 'Roboto', sans-serif;
    font-size: 0.8vw;
}


.hmp-info{
    color: #888;
    font-family: 'Roboto', sans-serif;
    font-size: 0.8vw;
}

.hmp-info h4{
    color: #888;
    font-family: 'Roboto', sans-serif;
    font-size: 0.8vw;
}

.hide {
	display: none;
}

.lockBtn:hover + .hide {
	display: block;
	color:var(--secondary-color);
}

.dc-chart g.row text {
	mix-blend-mode: difference!important;
}


.widgetMenu{
	width:4vw;
	position:absolute;
	right:0;
}

.widgetTitle + .widgetHidden:hover {
	opacity :1;
	color: var(--secondary-color);
}

.widgetHidden {
	/*display: none;*/
	opacity:0;
}

.chart-error-div{
	align-content: center;
	justify-content: center;
	vertical-align: middle;
	text-align: center;
	width: 100%;
	height: 50%;
	top: 50%;
	position: absolute;
}

.dc-select-menu {
	width: 100%;
}