.chart-outer-container {
  display: table;
}

.btn-group .play-pause-button {
  font-size: 0.75rem;
}

.chart-container {
  position: relative;
  float: left;
  svg {
    overflow: hidden;
    width: 100%;
    height: 100%;
    text {
      font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
      font-weight: bold;
      font-size: 0.7rem;
      fill: #5a5a5a;
    }
  }
  .chart-overlay{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    .cursor-click-area {
      position: absolute;
      height: 100%;
      width: 100%;
      cursor: crosshair;
    }
    .cursor-hover-area {
      cursor: ew-resize;
    }
    .cursor {
      position: absolute;
      height: 100%;
      background: #555;
      width: 1px;
    }
    .cursor-info {
      width: 120px;
      text-align: center;
      z-index: 1;
    }
    .zoom-pan-target{
      opacity: .2;
      background: red;
    }
    .peak-indicator {
      position: absolute;
      height: 20px;
      background: #999;
      width: 1px;
    }
    .peak-info{
      width: 120px;
      text-align: center;
      z-index: 1;
    }
  }
}
.chart-controls {
  display: flex;
  justify-content: center;
  margin-bottom: 5px;
  .btn-group {
    margin-left: 20px;
    display: flex;
    justify-content: flex-start;
    label {
      margin-bottom: 0;
    }
  }
}