.summary-data-header {
  padding-bottom: 10px;
  font-size: 2vw;
  font-weight: 300;
}

.fund-column {
  padding: 0 1em;
}

.fund-item {
  background-color: #f0f4f8;
  color: #002848;
  padding: 1em;
  justify-content: center;
  display: flex;
}

.fund-item div:nth-child(1) {
  font-size: 1.5vw;
}

.fund-item div:nth-child(2) {
  font-size: 3vw;
  font-weight: bold;
}

#spent-donut, #obligated-donut,
#obligated-donut .highcharts-container,
#spent-donut .highcharts-container {
  overflow: visible !important;
}

#obligated-donut .highcharts-container {
  z-index: auto !important;
}

#obligated-donut .highcharts-data-label span {
  background: #FFFFFF;
}

#obligated-donut .highcharts-data-label span,
#spent-donut .highcharts-data-label span{
  font-size: .8vw !important;
  font-weight: normal !important;
  line-height: 1.2 !important;
}

#obligated-donut .highcharts-data-label span span.donut-sub-label,
#spent-donut .highcharts-data-label span span.donut-sub-label{
  font-weight: bold !important;
  display: inline-block;
  color: #0e7bc0;
}

#obligated-donut .highcharts-title,
#spent-donut .highcharts-title {
  font-size: 1vw !important;
  text-align: center !important;
}

#obligated-donut .highcharts-title .donut-center-txt-amt,
#spent-donut .highcharts-title .donut-center-txt-amt{
  font-size: 1.5vw !important;
}

.program-count-label {
  font-weight: bold;
  color: #0e7bc0;
}

@media (min-width: 1700px) {
  #obligated-donut .highcharts-title,
  #spent-donut .highcharts-title {
    font-size: 18px !important;
  }

  #obligated-donut .highcharts-title .donut-center-txt-amt,
  #spent-donut .highcharts-title .donut-center-txt-amt{
    font-size: 27px !important;
  }
}

@media(min-width: 640px) {
  .states-landing-page-spending-summary-container {
    padding-left: 2rem;
  }
}

@media(max-width: 600px) {
  .fund-item {
    margin-bottom: 10px
  }

  .summary-data-header {
    font-size: 5vw;
  }

  .fund-item div:nth-child(1) {
    font-size: 4vw;
  }

  .fund-item div:nth-child(2) {
    font-size: 8vw;
  }

  #obligated-donut .highcharts-title,
  #spent-donut .highcharts-title {
    font-size: 3.5vw !important;
  }

  #obligated-donut .highcharts-title .donut-center-txt-amt,
  #spent-donut .highcharts-title .donut-center-txt-amt{
    font-size: 6vw !important;
  }

  #obligated-donut .highcharts-data-label span,
  #spent-donut .highcharts-data-label span{
    font-size: 3vw !important;
  }
}

.summary-subtext p {
  width: 100%;
  margin: 0;
  inline-size: 100%;
  font-size: 0.75rem;
  line-height: 1.5;
  color: #757575;
  overflow-wrap: break-word;
}

@media(min-width: 640px) {
  .summary-subtext p {
    width: 24em;
    margin: 0 auto;
    inline-size: 24em;
  }
}

@media(min-width: 960px) {
  .summary-subtext p {
    width: 27em;
    margin: 0 auto;
    inline-size: 27em;
  }
}

@media(min-width: 1250px) {
  .summary-subtext p {
    width: 32em;
    inline-size: 32em;
  }
}