.card {
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2);
}

.card-header {
    font-size: 16px;
    border-bottom-style: solid;
    border-bottom-width: thin;
}

.banner {
    font-size: 12px;
}

.banner1 {
    font-size: 10px;
}

.filter {
    font-size: 10px;
}

/*Bullet Chart*/
.bullet .range.s0 {
    fill: #1f7a1f;
}

.bullet .range.s1 {
    fill: #80ff80;
}

.bullet .range.s2 {
    fill: #e6e600;
}

.bullet .measure.s0 {
    fill: #6666ff;
}

.bullet .measure.s1 {
    fill: #0000cc;
}
/* circle packing */
 
.nodes {
    cursor: pointer;
}

.nodes:hover {
    stroke: #000;
    stroke-width: 1.5px;
}

.node--leafcircle {
    fill: white;
}

.labels {
    font: 15px "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-anchor: middle;
    /*text-shadow: 0 1px 0 #fff, 1px 0 0 #fff, -1px 0 0 #fff, 0 -1px 0 #fff;*/
}
/* Month by product category */
.barmpc:hover {
    fill: #bcbcbc ;
}
.axis-grid line {
    stroke:white;
    stroke-width:2px;
}
/*Product category by month*/
.dotpcm:hover {
    fill: #bcbcbc ;
}
.barmspc:hover {
    fill: #bcbcbc ;
}

/* Timeseries */
.d3_timeseries.axis {
    font: 10px sans-serif
}
.d3_timeseries.axis path,
.d3_timeseries.axis linetime {
    fill: none;
    stroke: #000;
    stroke-width: 1;
    shape-rendering: crispEdges
}

.d3_timeseries.mousevline {
    fill: none;
    stroke: #666;
    stroke-dasharray: 3, 6;
    stroke-width: 1
}

.d3_timeseries.mousevline-text {
    font: 10px sans-serif
}

.d3_timeseries.tooltip {
    position: absolute;
    background: white;
    border-radius: 5px;
    pointer-events:none;
    border-width: .1px;
    border-style: groove;
    padding: 12px;
}

.d3_timeseries.tooltip h4 {
    margin-top: 2px;
    margin-bottom: 2px
}

.d3_timeseries.axis text {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    cursor: default
}
/* lollipop */
.dropdown {
    position: absolute;
    top: 15px;
    right: 15px;
}

.grid-line {
    stroke: black;
    opacity: 0.2;
}

.selection-line {
    stroke: black;
    stroke-dasharray: 5,5;
}

.lollipop-line {
    stroke: black;
    stroke-width: 1px;
}

circle.lollipop-start {
    fill: #808080;
    stroke-width: 1px;
    stroke: black;
}

.lollipop-end {
    fill: blue;
    stroke-width: 1px;
    stroke: black;
}

.lollipop-average {
    fill: white;
    stroke-width: 1px;
    stroke: black;
}

/*co-occurences	*/
text.active {
    fill: red;
}
 /**metric graphics*/
.mg-active-datapoint{fill:#000;font-size:.9rem;font-weight:400;opacity:.8}
.mg-area-color{fill:#000}.mg-area1-color{fill:#00f}
.mg-area2-color{fill:#05b378}.mg-area3-color{fill:#db4437}
.mg-area4-color{fill:#f8b128}.mg-area5-color{fill:#5c5c5c}
.mg-area6-color{fill:#4682b4}.mg-area7-color{fill:#f673bf}
.mg-area8-color{fill:#0b73b0}.mg-area9-color{fill:#006400}
.mg-area10-color{fill:#92514f}text.mg-barplot-group-label{font-weight:900}
.mg-barplot rect.mg-bar{shape-rendering:auto}
.mg-barplot rect.mg-bar.default-bar{fill:#b6b6fc}
.mg-barplot rect.mg-bar.default-active{fill:#9e9efc}.mg-barplot .mg-bar-prediction{fill:#5b5b5b}
.mg-barplot .mg-bar-baseline{stroke:#5b5b5b;stroke-width:2}
.mg-bar-target-element{font-size:11px;padding-left:5px;padding-right:5px;font-weight:300}
.mg-baselines line{opacity:1;shape-rendering:auto;stroke:#b3b2b2;stroke-width:1px}
.mg-baselines text{fill:#000;font-size:.9rem;opacity:.6;stroke:none}
.mg-baselines-small text{font-size:.6rem}.mg-category-guides line{stroke:#b3b2b2}
.mg-header{cursor:default;font-size:1.2rem}
.mg-header .mg-chart-description{fill:#ccc;font-family:FontAwesome;font-size:1.2rem}
.mg-header .mg-warning{fill:#ccc;font-family:FontAwesome;font-size:1.2rem}
.mg-points circle{opacity:.65}.mg-popover{font-size:.95rem}
.mg-popover-content{cursor:auto;line-height:17px}.mg-data-table{margin-top:30px}
.mg-data-table thead tr th{border-bottom:1px solid #a9a9a9;cursor:default;font-size:1.1rem;font-weight:400;padding:5px 5px 8px 5px;text-align:right}
.mg-data-table thead tr th .fa{color:#ccc;padding-left:4px}
.mg-data-table thead tr th .popover{font-size:1rem;font-weight:400}
.mg-data-table .secondary-title{color:#a9a9a9}
.mg-data-table tbody tr td{margin:2px;padding:5px;vertical-align:top}
.mg-data-table tbody tr td.table-text{opacity:.8;padding-left:30px}
.mg-y-axis line.mg-extended-yax-ticks{opacity:.4}
.mg-x-axis line.mg-extended-xax-ticks{opacity:.4}
.mg-histogram .axis line,.mg-histogram .axis path{fill:none;opacity:.7;shape-rendering:auto;stroke:#ccc}tspan.hist-symbol{fill:#9e9efc}
.mg-histogram .mg-bar rect{fill:#b6b6fc;shape-rendering:auto}
.mg-histogram .mg-bar rect.active{fill:#9e9efc}
.mg-least-squares-line{stroke:red;stroke-width:1px}
.mg-lowess-line{fill:none;stroke:red}
.mg-rollover-rect *{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.mg-line-color{stroke:#000}
.mg-hover-line-color{fill:#000}
.mg-line1-color{stroke:#4040e8}
.mg-hover-line1-color{fill:#4040e8}
.mg-line2-color{stroke:#05b378}
.mg-hover-line2-color{fill:#05b378}
.mg-line3-color{stroke:#db4437}
.mg-hover-line3-color{fill:#db4437}
.mg-line4-color{stroke:#f8b128}
.mg-hover-line4-color{fill:#f8b128}
.mg-line5-color{stroke:#5c5c5c}
.mg-hover-line5-color{fill:#5c5c5c}
.mg-line6-color{stroke:#4682b4}
.mg-hover-line6-color{fill:#4682b4}
.mg-line7-color{stroke:#f673bf}
.mg-hover-line7-color{fill:#f673bf}
.mg-line8-color{stroke:#0b73b0}
.mg-hover-line8-color{fill:#0b73b0}
.mg-line9-color{stroke:#006400}
.mg-hover-line9-color{fill:#006400}
.mg-line10-color{stroke:#92514f}
.mg-hover-line10-color{fill:#92514f}
.mg-line-legend text{font-size:.9rem;font-weight:300;stroke:none}
.mg-line-legend-color{color:#000;fill:#000}
.mg-line1-legend-color{color:#4040e8;fill:#4040e8}
.mg-line2-legend-color{color:#05b378;fill:#05b378}
.mg-line3-legend-color{color:#db4437;fill:#db4437}
.mg-line4-legend-color{color:#f8b128;fill:#f8b128}
.mg-line5-legend-color{color:#5c5c5c;fill:#5c5c5c}
.mg-line6-legend-color{color:#4682b4;fill:#4682b4}
.mg-line7-legend-color{color:#f673bf;fill:#f673bf}
.mg-line8-legend-color{color:#0b73b0;fill:#0b73b0}
.mg-line9-legend-color{color:#006400;fill:#006400}
.mg-line10-legend-color{color:#92514f;fill:#92514f}
.mg-main-area-solid svg .mg-main-area{fill:#ccf;opacity:1}
.mg-markers line{opacity:1;shape-rendering:auto;stroke:#b3b2b2;stroke-width:1px}
.mg-markers text{fill:#000;font-size:.8rem;opacity:.6}
.mg-missing-text{opacity:.9}
.mg-missing-background{stroke:#00f;fill:none;stroke-dasharray:10,5;stroke-opacity:.05;stroke-width:2}
.mg-missing .mg-main-line{opacity:.1}
.mg-missing .mg-main-area{opacity:.03}path.mg-main-area{opacity:.2;stroke:none}path.mg-confidence-band{fill:#ccc;opacity:.4;stroke:none}path.mg-main-line{fill:none;opacity:.8;stroke-width:1.1px}
.mg-points circle{fill-opacity:.4;stroke-opacity:1}circle.mg-points-mono{fill:#00f;stroke:#00f}tspan.mg-points-mono{fill:#00f;stroke:#00f}
.mg-points circle.selected{fill-opacity:1;stroke-opacity:1}
.mg-voronoi path{fill:none;pointer-events:all;stroke:none;stroke-opacity:.1;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.mg-x-rug-mono,.mg-y-rug-mono{stroke:#000}
.mg-x-axis line,.mg-y-axis line{opacity:1;shape-rendering:auto;stroke:#b3b2b2;stroke-width:1px}
.mg-histogram .axis text,.mg-x-axis text,.mg-y-axis text{fill:#000;font-size:.9rem;opacity:.6}
.mg-axis .label,.mg-x-axis .label,.mg-y-axis .label{font-size:.8rem;text-transform:uppercase;font-weight:400}
.mg-active-datapoint-small,.mg-x-axis-small text,.mg-y-axis-small text{font-size:.6rem}
.mg-x-axis-small .label,.mg-y-axis-small .label{font-size:.65rem}
.mg-year-marker text{fill:#000;font-size:.7rem;opacity:.6}
.mg-year-marker line{opacity:1;shape-rendering:auto;stroke:#b3b2b2;stroke-width:1px}
.mg-year-marker-small text{font-size:.6rem}
.mg-brush-container{cursor:crosshair}
.mg-brush-container .mg-brushing{cursor:ew-resize}
.mg-brushed,.mg-brushed *{cursor:zoom-out}
.mg-brush rect.mg-extent{fill:rgba(0,0,0,.3)}
.mg-brushing-in-progress{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
/*# sourceMappingURL=metricsgraphics.min.css.map */
div.speech-bubble {
	position: absolute;
	background: white;
	border-radius: 5px;
	pointer-events:none;
	border-width: .1px;
	border-style: groove;
	padding: 12px;
}

div.speech-bubble:after {
	content: '';
	position: absolute;
	pointer-events:none;
	left: 0;
	top: 50%;
	width: 0;
	height: 0;
	border: 20px transparent;
	border-right-color: white;
	border-style: groove;
	border-left: 0;
	margin-top: -20px;
	margin-left: -20px;
}

/*Map*/
.tooltipmap {
      position: absolute;
      background-color:grey;
      text-align:left;
      border-radius: 5px;
      border: 1px solid black;
      z-index: 100;
      pointer-events: none;
}
.city-label {
    font-size : 10px;
}
.path-map {
    stroke: black;
    stroke-width: 0.7px;
}
.legend-map {
    position:absolute;
   	right:-10px;
   	bottom:40px;
}
.toplabel {
	position:absolute;
	right:45px;
	top:130px;
}
/*text font*/
.axisL10 { font: 10px sans-serif; }
.axisL12 { font: 12px sans-serif; }
.axisL14 { font: 14px sans-serif; }
.axisL16 { font: 16px sans-serif; }
.axisL18 { font: 18px sans-serif; }
.axisL20 { font: 20px sans-serif; }
.axisL22 { font: 22px sans-serif; }
.axisL24 { font: 24px sans-serif; }
.axisL26 { font: 26px sans-serif; }

/*.axis { font: 14px sans-serif; }*/
/*CSS for table bar chart sorting icons*/
th.tbc-header:after {
    font-family: 'Font Awesome\ 5 Free';
    color:white;
    content: " \f0dc";
}
/*CSS for table bar chart descending icon*/
th.tbc-des:after {
    font-family: 'Font Awesome\ 5 Free';
    color:Gold;
    content: "\f885";
}
/*CSS for table bar chart ascending icon*/
th.tbc-aes:after {
    font-family: 'Font Awesome\ 5 Free';
    color:Gold;
    content: "\f884";
}
/*for table bar, report headers to be sticky at the top*/
th {
    position: sticky;
    top: 0;
    white-space: nowrap;
    background-color: white;
}

.d3-context-menu {
	position: absolute;
	display: none;
	background-color: #f2f2f2;
	border-radius: 4px;
	font-family: Arial, sans-serif;
	font-size: 14px;
	min-width: 150px;
	border: 1px solid #d4d4d4;
	z-index:1200;
}

.d3-context-menu ul {
	list-style-type: none;
	margin: 4px 0px;
	padding: 0px;
	cursor: default;
}

.d3-context-menu ul li {
	padding: 4px 16px;
}

.d3-context-menu ul li:hover {
	background-color: #4677f8;
	color: #fefefe;
}
/*for the d3 report*/
.reptd {
    border: 1px solid #808080;
    padding-left: 10px;
    padding-right: 5px;
}
/*treemap*/
rect {
  stroke: #fff;
}
rect.parent,
grandparent rect {
  stroke-width: 4px;
}
.ctext {
    font-size:12px;
}
.overlay {
        fill: none;
        pointer-events: all;
    }
  .focus circle {
        stroke-width: 1px;

    }

    .focus text {
        font-size: 14px;
    }

    .tooltip {
        fill: white;
        stroke: #000;
        pointer-events:none;
        background: white;
        padding: 12px;
        border-width: 0.5px;
        border-style: groove;
        position: absolute;
        line-height: 1;

    }

    .tooltip-date, .tooltip-likes {
        font-weight: bold;
    }

.tooltip.hidden {
  display: none;
}

.plotdashed
{
 	stroke-dasharray: 3,3;
}
.plotline
{
stroke-width:3;
}
/* sankey */
.sank-node rect {
  fill-opacity: .9;
  shape-rendering: crispEdges;
}

.sank-node text {
  pointer-events: none;
  text-shadow: 0 1px 0 #fff;
}

.sank-link {
  fill: none;
  stroke: #000;
  stroke-opacity: .5;
}

.sank-link:hover {
  stroke-opacity: .8;
}

div1.tooltip {
  position: absolute;
  text-align: center;
  background-color:white;
   text-align:left;
   border-radius: 5px;
   border: 1px solid black;
  font: 12px sans-serif;
  pointer-events: none;
}

.dot-bar
{
  opacity:0.2;
}

.toolTip {
    position: absolute;
    display: none;
    width: auto;
    height: auto;
    background: none repeat scroll 0 0 white;
    border: 0 none;
    border-radius: 8px 8px 8px 8px;
    box-shadow: -3px 3px 15px #888888;
    color: black;
    font: 12px sans-serif;
    padding: 5px;
    text-align: center;
}
.bo-card
{
    margin-top:20px;
}
/*bubbleChart3M*/

.bubbles {
    stroke-width: 2px;
    stroke: white;
    opacity:0.5;
}
.bubbles:hover {
    stroke: black;
}
.xAxisDendo {
    font-size: 25px;
}