.grid line {
    stroke: #ccc;
    stroke-opacity: 0.7;
  }
  
  /* Need to discuss this with the team */
  .axis path,
  .axis line {
    stroke: none; /* Changes the color of the axis lines */
  }
  
  .grid .tick {
    stroke: lightgrey; /* Changes the color of the gridlines */
    stroke-opacity: 0.7;
    shape-rendering: crispEdges; /* Makes the gridlines appear more crisp */
  }
  .grid path {
    stroke-width: 0; /* Removes the line along the y-axis */
  }

  .dataLabel {
    font-weight: 600;
    font-size: 14px;
  }

  body {
    padding-top: 3px;
  }

  @keyframes lineTrans {
    from {stroke: #dadada;}
    to {stroke: #871A5B;}
  }
  
  path.selected {
     animation-name: lineTrans;
     animation-duration: 500ms;
     stroke: #871A5B;
  }

  @keyframes circleTrans {
    from {opacity: 0;}
    to {opacity: 1; }
  }
  
  circle.selected {
     animation-name: circleTrans;
     animation-duration: 500ms;
     opacity: 1;
  }

  text.selected {
    opacity: 1;
    transition: 500ms ease;
  }

 #legend {
  padding-top: 20px;
  padding-bottom: 10px;
 }

 #source {
  font-weight: 700 !important;
  color: #323132 !important;
 }