/* #590507 */
/*$max-width: 1088px;*/
:focus {
  outline: hsl(215deg, 100%, 11%) auto 1px;
}

@media (prefers-reduced-motion: no-preference) {
  :focus {
    transition: outline-offset 0.1s ease-in;
    outline-offset: 0.2rem;
  }
}
@keyframes heartbeat {
  0% {
    transform: scale(0.8);
    transform-origin: center;
    opacity: 0.7;
  }
  5% {
    transform: scale(0.9);
  }
  10% {
    transform: scale(0.8);
  }
  15% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(0.8);
  }
  100% {
    transform: scale(0.8);
    opacity: 0.7;
    transform-origin: center;
  }
}
@keyframes heartbeat-vertical {
  0% {
    transform: translateY(0%);
    transform-origin: center;
    opacity: 0.7;
  }
  5% {
    transform: translateY(-5%);
  }
  10% {
    transform: translateY(0%);
  }
  15% {
    transform: translateY(-10%);
    opacity: 1;
  }
  50% {
    transform: translateY(0%);
  }
  100% {
    transform: translateY(0%);
    opacity: 0.7;
    transform-origin: center;
  }
}
.selection-label {
  font-size: 1.75rem;
  margin-top: 1em;
  font-family: "Open Sans", "Helvetica Neue", Helvetica, "Roboto", Arial, sans-serif;
  font-weight: bold;
}

.select {
  padding: 0.5rem 1rem;
  display: block;
  width: 100%;
  max-width: 50ch;
}

.select-year, .select-level {
  position: absolute;
  opacity: 0;
  left: -10000px;
}

.select-years, .select-levels {
  display: flex;
  flex-wrap: wrap;
}

.rdo-label {
  margin-top: 0.2rem;
  padding: 0.6em 1em;
  border: solid 2px #D3D7DF;
  border-radius: 3px;
  box-shadow: 0px 2px 4px -2px rgba(0, 0, 0, 0.15);
  cursor: pointer;
  font-family: "Open Sans", "Helvetica Neue", Helvetica, "Roboto", Arial, sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.94em;
  color: rgb(97, 111, 117);
}
.rdo-label:hover {
  color: #2a3033;
  background-color: #f7f9fb;
  border-color: #A7AFBF;
  box-shadow: 0 4px 6px -4px rgba(0, 0, 0, 0.2);
}
.rdo-label ~ .rdo-label {
  margin-left: 0.25rem;
}

.select-level + .rdo-label {
  border: solid 2px rgba(0, 93, 168, 0.5);
  border-radius: 3px;
  display: block;
}
.select-level + .rdo-label.rdo-label--emt {
  border-radius: 24px;
}
.select-level + .rdo-label.rdo-label--paramedic {
  background-color: rgba(255, 221, 73, 0.3);
}
.select-level + .rdo-label.rdo-label--aemt, .select-level + .rdo-label.rdo-label--paramedic {
  border-radius: 24px;
  position: relative;
}
.select-level + .rdo-label.rdo-label--aemt::after, .select-level + .rdo-label.rdo-label--paramedic::after {
  content: "";
  display: block;
  position: absolute;
  bottom: -5px;
  width: 68%;
  height: 4px;
  border: solid 2px rgba(0, 93, 168, 0.5);
  border-top: none;
  left: 16%;
  z-index: -1;
}
.select-level + .rdo-label:hover {
  background-color: #fbfdff;
  border-color: rgba(0, 93, 168, 0.7);
  box-shadow: 0 4px 6px -4px rgba(0, 0, 0, 0.25);
}
.select-level + .rdo-label:hover.rdo-label--paramedic {
  background-color: rgba(255, 221, 73, 0.5);
}
.select-level + .rdo-label ~ .rdo-label {
  margin-left: 0.5rem;
}

.select-level:checked + .rdo-label {
  color: #2a3033;
  background-color: #fff;
  border-color: hsl(215deg, 100%, 11%);
  box-shadow: inset 0px 0px 2px 0px hsl(215deg, 100%, 11%), 0 4px 6px -4px rgba(0, 0, 0, 0.4);
}
.select-level:checked + .rdo-label.rdo-label--paramedic {
  background-color: rgba(255, 221, 73, 0.75);
}
.select-level:checked:focus + .rdo-label {
  box-shadow: 0px 2px 4px -2px rgba(0, 0, 0, 0.4), 0px 0px 8px 5px rgba(0, 93, 168, 0.3);
}

.select-year + .rdo-label {
  position: relative;
}
.select-year + .rdo-label ~ .rdo-label::before {
  content: "";
  position: absolute;
  height: 2px;
  width: 4px;
  left: -6px;
  top: 44%;
  background-color: #D3D7DF;
}
.select-year:checked + .rdo-label {
  color: #2a3033;
  background-color: #fafcfe;
  border-color: hsl(215deg, 100%, 11%);
  box-shadow: inset 0px 0px 2px 0px hsl(215deg, 100%, 11%), 0px 2px 4px -2px rgba(0, 0, 0, 0.15);
}
.select-year:checked:focus + .rdo-label {
  box-shadow: inset 0px 0px 0px 2px hsl(215deg, 100%, 11%), 0px 2px 4px -2px rgba(0, 0, 0, 0.15), 0px 0px 8px 5px rgba(0, 93, 168, 0.3);
}

/* Focus state for both levels and years*/
.select-year:focus + .rdo-label,
.select-level:focus + .rdo-label {
  box-shadow: 0px 0px 8px 5px rgba(0, 93, 168, 0.3);
  z-index: 1;
}

/* Disabled state for both levels and years */
.select-year:disabled + .rdo-label, .select-level:disabled + .rdo-label {
  color: #D3D7DF;
  cursor: default;
  pointer-events: none;
}

.jvectormap-container {
  position: absolute;
}

#us-map {
  margin-top: 2rem;
  max-width: 1000px;
  width: 100%;
  overflow: hidden;
  position: relative;
}

#us-map::before {
  content: "";
  display: none;
  position: absolute;
  height: 2rem;
  width: 2rem;
  background-color: hsl(215deg, 100%, 11%);
  border-radius: 50%;
  top: 0;
  z-index: 1;
  left: 50%;
  top: 50%;
  margin: -2rem 0 0 -1rem;
  box-shadow: -3rem 0px hsl(215deg, 100%, 11%), 3rem 0px hsl(215deg, 100%, 11%);
  animation: heartbeat 1.2s infinite;
}

#us-map.loading::before {
  display: block;
}

#ncca-data {
  display: none;
}

.ncca-data-report {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem 1.8rem;
  padding-bottom: 8px;
}

.ncca-data-report__title {
  flex: 1 0 100%;
  margin: 0 !important;
}

.ncca-data-section {
  padding: 1.2rem 1.4rem;
  background-color: #f2f4f6;
  border-radius: 3px;
  box-shadow: 0 4px 8px -4px rgba(0, 0, 0, 0.15);
  flex-grow: 1;
  flex-basis: 40%;
}

.ncca-data-section__levels {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 0.6rem;
}

.ncca-data-section__label {
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.9em;
  opacity: 0.85;
  margin-top: 0.8em;
}

.ncca-data-section__value {
  font-size: 1.6rem;
  font-family: "Open Sans", "Helvetica Neue", Helvetica, "Roboto", Arial, sans-serif;
  max-width: max-content;
  transform-origin: bottom center;
  animation: number-animation 350ms cubic-bezier(0.01, 0.81, 1, 1.94);
}

@keyframes number-animation {
  0% {
    opacity: 0.1;
    transform: translateY(5px);
    /*transform: scale(0.75);*/
  }
  100% {
    opacity: 1;
    /*transform: scale(1);*/
    transform: translateY(0px);
  }
}
.ncca-data-section__category {
  margin: 0 !important;
  margin-bottom: 0.2em !important;
}

#ncca-data-tables {
  display: none;
}

.text-right {
  text-align: right;
}

.hide {
  display: none;
}

#level-totals-container {
  text-align: center;
  margin-top: 2rem;
  padding: 1rem;
  border-radius: 4px;
  background-color: #f2f4f6;
  box-shadow: 0px 4px 8px -4px rgba(0, 0, 0, 0.15);
  font-family: "Open Sans", "Helvetica Neue", Helvetica, "Roboto", Arial, sans-serif;
}

.level-totals-container__heading {
  margin-top: 0.4em !important;
}

.level-totals__numeral {
  font-size: 1.6rem;
}

.level-totals__category {
  text-transform: uppercase;
  opacity: 0.8;
}

.level-totals {
  display: flex;
  flex-wrap: wrap;
}
.level-totals > * {
  margin-top: 0.5rem;
  padding: 0.6em;
  flex-shrink: 1;
  flex-grow: 1;
}

.charts-container {
  display: flex;
  flex-wrap: wrap;
  margin-top: 4rem;
  position: relative;
}
.charts-container::before, .charts-container::after {
  content: "";
  position: absolute;
  top: -1rem;
  left: 50%;
  height: 2px;
  width: 26vw;
  margin-left: -13vw;
  background-color: #D3D7DF;
}
.charts-container::after {
  top: auto;
  bottom: -1rem;
}

.charts-container__donut {
  flex-shrink: 1;
  flex-grow: 1;
  flex-basis: 300px;
  padding: 2rem;
}
.charts-container__donut > h3 {
  margin-top: 0;
}

.charts-container__bar {
  flex-shrink: 1;
  flex-grow: 2;
  flex-basis: 400px;
  padding: 2rem;
}
.charts-container__bar > h3 {
  margin-top: 0;
}

.stats-container {
  display: flex;
  flex-wrap: wrap;
  margin-top: 4rem;
  margin-left: -1rem;
  margin-bottom: 1rem;
}

.stats-box {
  padding: 1rem;
  flex: 1 1 200px;
  background-color: #f2f4f6;
  margin-left: 1rem;
  margin-bottom: 1rem;
  box-shadow: 0px 4px 8px -4px rgba(0, 0, 0, 0.15);
  border-radius: 4px;
}
.stats-box:nth-child(even) {
  /*background-color: #fff;*/
}

.stats-box__header {
  font-size: 1.75rem;
  font-family: "Open Sans", "Helvetica Neue", Helvetica, "Roboto", Arial, sans-serif;
  font-weight: bold;
}

/* this CSS is taken from http://cdn.oesmith.co.uk/morris-0.4.3.min.css */
.morris-hover {
  position: absolute;
  z-index: 1000;
}

.morris-hover.morris-default-style {
  border-radius: 10px;
  padding: 6px;
  color: #666;
  background: rgba(255, 255, 255, 0.8);
  border: solid 2px rgba(230, 230, 230, 0.8);
  font-family: "Open Sans", "Helvetica Neue", Helvetica, "Roboto", Arial, sans-serif;
  font-size: 12px;
  text-align: center;
}

.morris-hover.morris-default-style .morris-hover-row-label {
  font-weight: bold;
  margin: 0.25em 0;
}

.morris-hover.morris-default-style .morris-hover-point {
  white-space: nowrap;
  margin: 0.1em 0;
}