.custom-vis-layout.animatedbubblechart text {
 cursor: default;
 }

.custom-vis-layout.animatedbubblechart h1 {
 font-weight: 400;
 }

.custom-vis-layout.animatedbubblechart #chart {
 height: 506px;
 }

.custom-vis-layout.animatedbubblechart text {
 font-size: 10px;
 }

.custom-vis-layout.animatedbubblechart .dot {

 }

.custom-vis-layout.animatedbubblechart .label {
 fill: rgb(119, 119, 119);
 }

.custom-vis-layout.animatedbubblechart .xlabel, .custom-vis-layout.animatedbubblechart .ylabel  {
  font-style: normal;
  font-variant-caps: normal;
  font-weight: 300;
  font-stretch: normal;
  font-size: 16px;
  line-height: normal;
  font-family: "Helvetica", sans-serif;
  fill: rgb(200, 200, 200);
}

.custom-vis-layout.animatedbubblechart .animation.label {
 font-style: normal;
 font-variant-caps: normal;
 font-weight: 300;
 font-stretch: normal;
 font-size: 36px;
 line-height: normal;
 font-family: "Helvetica", sans-serif;
 fill: rgb(221, 221, 221);
 }

.custom-vis-layout.animatedbubblechart .country.label {
 font-style: normal;
 font-variant-caps: normal;
 font-weight: 400;
 font-stretch: normal;
 font-size: 36px;
 line-height: normal;
 font-family: "Helvetica", sans-serif;
 fill: rgb(221, 221, 221);
 }

.custom-vis-layout.animatedbubblechart .year.label.active {
 fill: rgb(170, 170, 170);
 }

.custom-vis-layout.animatedbubblechart circle.pointTrajectory {
 pointer-events: none;
 stroke: lightgray;
 fill: black;
 opacity: 0;
 }

.custom-vis-layout.animatedbubblechart path.lineTrajectory {
 stroke-width: 2px;
 stroke-opacity: 0.5;
 stroke: black;
 fill: none;
 pointer-events: none;
 }

.custom-vis-layout.animatedbubblechart .selected {
 stroke-width: 4px;
 }

.custom-vis-layout.animatedbubblechart text {
 cursor: default;
 }

.custom-vis-layout.animatedbubblechart h1 {
 font-weight: 400;
 }

.custom-vis-layout.animatedbubblechart #chart {
 height: 506px;
 }

.custom-vis-layout.animatedbubblechart text {
 font-size: 10px;
 }

.custom-vis-layout.animatedbubblechart .dot {

 }

.custom-vis-layout.animatedbubblechart .yaxis path, .custom-vis-layout.animatedbubblechart .yaxis line {
 fill: none;
 stroke: rgb(0, 0, 0);
 shape-rendering: crispedges;
 }
.custom-vis-layout.animatedbubblechart .xaxis path, .custom-vis-layout.animatedbubblechart .xaxis line {
  fill: none;
  stroke: rgb(0, 0, 0);
  shape-rendering: crispedges;
}

.custom-vis-layout.animatedbubblechart .label {
 fill: rgb(119, 119, 119);
 }

.custom-vis-layout.animatedbubblechart .year.label {
 font-style: normal;
 font-variant-caps: normal;
 font-weight: 400;
 font-stretch: normal;
 font-size: 36px;
 line-height: normal;
 font-family: "Helvetica", sans-serif;
 fill: rgb(221, 221, 221);
 }

.custom-vis-layout.animatedbubblechart circle.pointTrajectory {
 pointer-events: none;
 stroke: lightgray;
 fill: black;
 opacity: 0;
 }

.custom-vis-layout.animatedbubblechart path.lineTrajectory {
 stroke-width: 2px;
 stroke-opacity: 0.5;
 stroke: black;
 fill: none;
 pointer-events: none;
 }

.custom-vis-layout.animatedbubblechart .selected {
 stroke-width: 4px;
 }

.custom-vis-layout.animatedbubblechart .referenceLine {
    stroke-width: 2px;
    stroke-dasharray: 5;
    stroke: red;
}



.custom-vis-layout.animatedbubblechart #playButton {
    position: absolute;
    left: 2px;
    bottom: 2px;
    height: 24px;
    width: 24px;
}

.custom-vis-layout.animatedbubblechart .play {
    background-image: url("images/playButton.png");
    background-size: contain;
}

.custom-vis-layout.animatedbubblechart .stop {
    background-image: url("images/stopButton.png");
    background-size: contain;
}

.custom-vis-layout.animatedbubblechart .tooltip {
    position: absolute;
    top: 2px;
    right: 2px;
    border-radius: 8px;
    padding: 8px;
    background: rgb(231, 231, 231);
    border: 2px solid lightgray;
}

.custom-vis-layout.animatedbubblechart .tooltip .attrName {
    padding: 2px;
    font-weight: bold;
}

.custom-vis-layout.animatedbubblechart .tooltip .attrValue {
    padding: 2px;
}

.custom-vis-layout.animatedbubblechart .bubbleLabelRect {
    visibility: none;
    fill: lightgray;
}

.custom-vis-layout.animatedbubblechart .bubbleLabelText {
    font-family: "Helvetica", sans-serif;
    fill: black;
    font-size: 10pt;
    opacity: 0.6;
    stroke: none;
    alignment-baseline: middle;
}

.custom-vis-layout.animatedbubblechart .trajectory {
    stroke: steelblue;
    stroke-width: 2;
    fill: none;
}

/* START - dragit.css */
.custom-vis-layout.animatedbubblechart path.lineTrajectory, path.subTrajectory {
    stroke-width: 2;
    stroke-opacity: 0.2;
    opacity: 0.5;
    fill-opacity: 0.3;
    stroke: gray;
    fill: none;
    pointer-events: none;
  }

  .custom-vis-layout.animatedbubblechart path.lineTrajectoryMonotone {
    stroke-width: 2;
    fill: none;
    pointer-events: none;
    stroke: lightgray;
  }

  .custom-vis-layout.animatedbubblechart circle.pointTrajectory {
     pointer-events: none;
     stroke: lightgray;
     fill: black;
     opacity: .5;
  }

  .custom-vis-layout.animatedbubblechart line.lineClosestTrajectory {
    stroke: black;
    stroke-dasharray: 4,4;
    display: block;
  }

  .custom-vis-layout.animatedbubblechart line.lineClosestPoint {
    stroke: black;
    opacity: .1;
    display: block;
  }

  .custom-vis-layout.animatedbubblechart .selected {
    opacity: .5;
  }

  .custom-vis-layout.animatedbubblechart circle.pointClosestTrajectory {
    opacity: .1;
    display: block;
  }

  .custom-vis-layout.animatedbubblechart circle.focusGuide {
    opacity: 1;
    display: block;
    fill: none;
    stroke: black;
  }
  /* END dragit.css */