/*
Don't change this file unless you know what you're doing. If you file an issue
on GitHub and we find out it was all caused because you modified this file,
we'll release the kraken and you, your beloved ones, your postman, the guy who
delivers pizza to your house, everyone.
Seriously, the chart's styling is easier to change than in v1. Don't make us
regret that decision.
lorem--ipsum
*/
.chart-legend {
margin-left: 20px; }
.chart-legend .item {
cursor: pointer;
font-family: sans-serif;
height: 16px;
font-size: 0.8em;
font-weight: 100;
display: inline-block;
margin-right: 10px; }
.chart-legend .item > * {
vertical-align: middle;
display: inline-block; }
.chart-legend .item > .legend-label {
height: 16px;
line-height: 17px; }
.chart-legend .item > .icon {
width: 16px;
border-radius: 50%;
height: 16px;
margin-right: 5px;
background-repeat: no-repeat;
background-position: 50% 25%; }
.chart-legend .item.legend-hidden {
opacity: 0.4; }
.chart-legend .item.column > .icon {
background-image: url("data:image/svg+xml;utf8,"); }
.chart-legend .item.dot > .icon {
background-image: url("data:image/svg+xml;utf8,"); }
.chart-legend .item.dashed-line > .icon {
background-image: url("data:image/svg+xml;utf8,"); }
.chart-legend .item.line > .icon {
background-image: url("data:image/svg+xml;utf8,"); }
.chart-legend .item.area > .icon {
background-image: url("data:image/svg+xml;utf8,"); }
.tooltip-line {
stroke: grey;
stroke-width: 1;
shape-rendering: crispEdges; }
.tooltip-dot {
stroke-width: 2px;
fill: white; }
.chart-tooltip {
position: absolute;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-color: white;
z-index: 100;
box-shadow: 1px 1px 2px rgba(61, 61, 61, 0.5);
padding: 5px 10px;
border-radius: 1px;
font-family: sans-serif;
font-weight: 100; }
.chart-tooltip > .abscissas {
margin-bottom: 5px;
font-size: 0.7em;
white-space: nowrap; }
.chart-tooltip .tooltip-item {
font-size: 0.8em;
white-space: nowrap; }
.chart-tooltip .tooltip-item:not(:last-child) {
margin-bottom: 0.2em; }
.chart-tooltip .tooltip-item > * {
display: inline-block; }
.chart-tooltip .tooltip-item > *:not(:last-child) {
margin-right: 0.4em; }
.chart-tooltip .tooltip-item .color-dot {
width: 10px;
height: 10px;
border-radius: 50%; }
.chart-tooltip .tooltip-item .y-value {
font-weight: 500; }
.chart {
position: relative;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none; }
.chart .axis {
font: 10px Roboto;
shape-rendering: crispEdges; }
.chart .axis.x2-axis {
display: none; }
.chart .axis > path {
fill: none;
stroke: black; }
.chart .axis > .tick > text {
fill: black; }
.chart .axis > .tick > line {
stroke: black; }
.chart .grid .tick > text {
display: none; }
.chart .grid .tick > line {
stroke: #eee;
stroke-width: 1;
shape-rendering: crispEdges; }
.chart .dot-series circle {
fill: white;
stroke-width: 2px; }
.chart .line-series path {
stroke-width: 1px; }
.chart .column-series {
fill-opacity: 0.3; }
.chart .area-series {
opacity: 0.3; }
.chart .chart-brush {
fill: rgba(166, 166, 166, 0.5); }
.chart .hline {
shape-rendering: crispEdges;
stroke-width: 1px; }