.bar {
  fill: var(--blue);
}

.bar_transparent {
  fill-opacity: var(--standard-see-through);
}

.bar_container {
}

.curve {
  fill-opacity: 0;
  stroke: var(--blue);
  stroke-width: 2px;
}

.curve_container {
}

.x_axis {
}

.bar_label {
  font-family: var(--font-family);
  font-size: var(--font-size-xs);
  text-anchor: middle;
}

.centile_root {
  display: flex;
  flex-direction: row;
  justify-content: center;
  overflow: hidden;
}

.centile_root > div {
  flex: 0 1 51rem;

  svg {
    overflow: visible;
  }
}

@media (--phone-break-point) {
  .centile_root {
    .bar_label {
      font-size: var(--font-size-mdlg);
    }

    .x_axis g:nth-child(2n+1) {
      display: none;
    }
  }
}