.stats {
  background-color: black;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-flow: row nowrap;
  color: white;
  --padding: calc(var(--step-8) * 2);
  padding-top: var(--padding);
  padding-bottom: var(--padding); }
  .stats .logo-white {
    width: 4em;
    height: auto;
    margin-bottom: 2em; }
  .stats figure {
    margin: 0;
    -webkit-box-flex: 1;
            flex: 1 0 auto;
    max-width: 25%;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-flow: column nowrap;
    -webkit-box-pack: end;
            justify-content: flex-end;
    -webkit-box-align: center;
            align-items: center;
    text-align: center;
    position: relative; }
    .stats figure .dial {
      width: 100%;
      height: auto; }
    .stats figure:nth-child(1) {
      max-width: 40%;
      margin-right: auto; }
      .stats figure:nth-child(1) .dial {
        width: 66.6%;
        margin: 0 auto; }
    .stats figure:last-child {
      margin-left: 2em; }
  .stats .dial circle {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
    stroke-dasharray: 603;
    stroke-dashoffset: 603; }
  .stats .dial-outer, .stats .dial-inner {
    position: relative;
    border-radius: 50%;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
            flex-flow: row nowrap;
    -webkit-box-pack: center;
            justify-content: center;
    -webkit-box-align: center;
            align-items: center;
    width: 100%;
    font-size: var(--step-6);
    font-family: 'Oswald', sans-serif;
    line-height: 0.6; }
    .stats .dial-outer small, .stats .dial-inner small {
      text-transform: uppercase;
      font-size: 0.3em; }
    .stats .dial-outer p, .stats .dial-inner p {
      position: absolute;
      margin: 0; }
    .stats .dial-outer.small, .stats .dial-inner.small {
      font-size: var(--step-3); }
      .stats .dial-outer.small small, .stats .dial-inner.small small {
        font-size: 0.7em; }
  .stats .dial-inner {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 0;
    width: 100%;
    padding-top: 100%; }
    .stats .dial-inner svg {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0; }
  .stats figure:nth-child(1) .dial-inner {
    width: 66.6%;
    padding-top: 66.6%;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%); }
  @media screen and (max-width: 1440px) {
    .stats .dial-outer {
      font-size: var(--step-3); }
    .stats .dial-outer.small {
      font-size: var(--step-1); } }
  @media screen and (max-width: 1024px) {
    .stats {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
              flex-flow: row wrap; }
      .stats figure {
        margin: 2em auto;
        max-width: 33.3%; }
      .stats figure:first-child {
        max-width: 100%;
        -webkit-box-flex: 1;
                flex: 1 0 100%; }
      .stats .dial-outer {
        font-size: var(--step-5); } }
  @media screen and (max-width: 768px) {
    .stats {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
              flex-flow: column nowrap; }
      .stats figure {
        max-width: 100%;
        -webkit-box-flex: 1;
                flex: 1 0 100%;
        margin: 2em auto; }
        .stats figure:last-child {
          margin-left: auto; }
        .stats figure:nth-child(1) .dial {
          width: 100%;
          margin: 0 auto; }
      .stats figure:nth-child(1) .dial-inner {
        width: 100%;
        padding-top: 100%;
        left: 0%;
        -webkit-transform: translateX(0%);
                transform: translateX(0%); } }