.axis {
  shape-rendering: crispEdges; }
  .axis .domain,
  .axis .tick line {
    stroke: #AAA; }
  .axis .tick text {
    font-size: .9em; }
  .axis.x .domain + .tick text {
    transform: translate(10px, 0px); }
  .axis.x .tick:last-child text {
    transform: translate(-35px, 0px); }

.axis .tick:nth-child(1) {
  background: red !important; }

.tooltip {
  position: absolute;
  z-index: 1;
  width: 0;
  height: 0;
  top: 0;
  left: 0;
  pointer-events: none;
  font-family: 'Arial', serif; }
  .tooltip__content {
    width: 155px;
    min-height: 30px;
    background: rgba(255, 255, 255, 0.8);
    padding: 5px 8px;
    border: 1px solid #630505;
    border-radius: 3px;
    transform: translate(-50%, -120%);
    font-size: 11px;
    box-shadow: 2px 2px 1px 1px #BBB; }
  .tooltip__row {
    overflow: hidden;
    font-size: 10px;
    margin-bottom: 0; }
  .tooltip__key {
    float: left;
    color: #212121; }
  .tooltip__val {
    float: right;
    color: #888; }

.zoom {
  opacity: .1;
  pointer-events: none; }

.visualization {
  background: #EEE;
  border: 1px solid #CDCDCD;
  padding: 10px;
  position: relative;
  margin-bottom: 40px; 
     overflow: hidden;
  }
  .visualization__chart {
    background: #FFF;
    border: 1px solid #CDCDCD;
    margin-bottom: 20px;
    position: relative;
    opacity: 0;
    transition: opacity .8s; }
    .visualization__chart.initialized {
      opacity: 1; }
  .visualization__legend {
    float: right;
    margin-top: 10px;
    text-align: right;
    opacity: .35;
    transition: opacity .5s; }
    .visualization__legend:hover {
      cursor: help;
      opacity: 1; }

.data-provider {
  font-size: 11px;
  padding: 0;
  color: #999;
  transform: translate(0, -30px); }
  .data-provider__image {
    transform: translate(0px, 4.5px); }

.chart-meta {
  float: left;
  width: 40%;
  min-width: 180px; }
  .chart-meta__row {
    margin-bottom: 20px; }
    .chart-meta__row:last-child {
      margin-bottom: 0; }
  .chart-meta__key {
    display: block;
    font-size: 9px;
    color: #888;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 5px; }
  .chart-meta__value {
    font-size: 28px;
    font-weight: bold;
    color: #212121; }
    .chart-meta__value .js-unit {
      display: inline-block;
      font-size: 16px;
      white-space: nowrap; }
    .chart-meta__value--change[data-tendention='up'] {
      color: #80b507; }
    .chart-meta__value--change[data-tendention='down'] {
      color: red; }

.chart-navigation {
  float: left;
  width: 60%;
  max-width: calc(100% - 180px); }
  .chart-navigation__header {
    font-weight: normal;
    letter-spacing: 1px;
    margin-bottom: 0;
    font-size: 9px;
    text-transform: uppercase;
    color: #888; }
  .chart-navigation__button {
    padding: 3px 6px;
    border: 1px solid #DDD;
    background: #FFF;
    margin: 0 8px 5px 0;
    outline: none;
    transition: background .5s; }
    .chart-navigation__button:hover {
      background: #DDD; }
    .chart-navigation__button.js-current {
      background: #75171D;
      color: #FFF; }

.chart-table {
  margin-bottom: 10px; }
  .chart-table__header {
    padding: 10px 7px;
    border-bottom: 1px solid #888; }
    .chart-table__header--change {
      text-align: center; }
  .chart-table__row {
    transition: opacity .5s; }
    .chart-table__row--change {
      text-align: center; }
    .chart-table__row:hover {
      background: #FAFAFA;
      cursor: pointer; }
  .chart-table__cell {
    font-size: 10px;
    padding: 11px;
    border-bottom: 1px solid #EEE;
    color: #999; }
    .chart-table__cell--change {
      text-align: center; }
  .chart-table__change--positive {
    color: #80b507; }
  .chart-table__change--negative {
    color: red; }
  .chart-table__item-name {
    font-size: 12px;
    font-weight: bold;
    color: #75171D; }

.table-actions {
  margin-bottom: 40px; }

.chart {
  position: relative; }
  .chart * {
    box-sizing: border-box; }

.dragging {
  cursor: ew-resize; }

/*# sourceMappingURL=style.css.map*/