/*
  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,<svg\ xmlns=\'http://www.w3.org/2000/svg\'\ style=\'fill:\ white;\'\ width=\'10\'\ height=\'10\'><rect\ y=\'2\'\ width=\'2\'\ height=\'8\'/><rect\ x=\'4\'\ y=\'5\'\ width=\'2\'\ height=\'5\'/><rect\ x=\'8\'\ y=\'3\'\ width=\'2\'\ height=\'7\'/></svg>"); }
    .chart-legend .item.dot > .icon {
      background-image: url("data:image/svg+xml;utf8,<svg\ xmlns=\'http://www.w3.org/2000/svg\'\ style=\'fill:\ white;\'\ width=\'10\'\ height=\'10\'><circle\ cx=\'5\'\ cy=\'6\'\ r=\'2\'/></svg>"); }
    .chart-legend .item.dashed-line > .icon {
      background-image: url("data:image/svg+xml;utf8,<svg\ xmlns=\'http://www.w3.org/2000/svg\'\ style=\'fill:\ white;\'\ width=\'10\'\ height=\'10\'>\A \ \ \ \ \ \ \ \ <g\ style=\"stroke:\ white;\ fill:\ none;\ stroke-dasharray:\ 4px,2px;\">\A \ \ \ \ \ \ \ \ \ \ <path\ d=\'M0,6\ L10,6\'/>\A \ \ \ \ \ \ \ \ </g>\A \ \ \ \ \ \ </svg>"); }
    .chart-legend .item.line > .icon {
      background-image: url("data:image/svg+xml;utf8,<svg\ xmlns=\'http://www.w3.org/2000/svg\'\ style=\'fill:\ white;\'\ width=\'10\'\ height=\'10\'>\A \ \ \ \ \ \ \ \ <g\ style=\"stroke:\ white;\">\A \ \ \ \ \ \ \ \ \ \ <path\ d=\'M0,6\ L10,6\'/>\A \ \ \ \ \ \ \ \ </g>\A \ \ \ \ \ \ </svg>"); }
    .chart-legend .item.area > .icon {
      background-image: url("data:image/svg+xml;utf8,<svg\ xmlns=\'http://www.w3.org/2000/svg\'\ style=\'fill:\ white;\'\ width=\'10\'\ height=\'10\'><polygon\ points=\'0,10\ 2.428,3\ 5,6\ 7.625,5\ 10,10\ 10,10\ 0,10\'/></svg>"); }

.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;*/
    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; }
