/**
 * This file is intended for re-usable classes, variables, and mixins.  If
 * you encounter something in the course of your project that seems broadly
 * useful, please feel free to add it to this file in the gfx-v2 repository:
 * https://github.com/themarshallproject/gfx-v2/blob/master/src/palette.scss
 *
 * Avoid making changes to this file on a per-project basis. If you need to
 * customize any of these styles, build off of them in `src/graphic.scss`.
 */
/*
 * VARIABLES
 */
/*
 * MIXINS
 */
/*
 * BASE GRAPHIC STYLES
 */
.graphic-head {
  font-family: 'acumin-pro', sans-serif;
  font-weight: 400;
  line-height: 1.1em;
  display: block;
  color: #353535;
  font-size: 28px;
  margin-top: 20px;
  margin-bottom: 18px;
  font-weight: 300; }
  @media (max-width: 740px) {
    .graphic-head {
      font-size: 22px; } }

.graphic-container-sidebar .graphic-head {
  line-height: 1.25;
  font-size: 24px;
  margin-top: 35px;
  margin-bottom: 22px;
  font-weight: 200; }
  @media (max-width: 740px) {
    .graphic-container-sidebar .graphic-head {
      font-size: 18px;
      margin-top: 15px; } }

.graphic-deck {
  font-family: 'acumin-pro', sans-serif;
  font-weight: 400;
  display: block;
  font-size: 18px;
  margin-bottom: 28px;
  color: #353535;
  font-weight: 100;
  line-height: 1.5em; }
  @media (max-width: 740px) {
    .graphic-deck {
      font-size: 16px; } }
  .graphic-deck .graphic-inline-legend {
    font-weight: 600; }

.graphic-container-sidebar .graphic-deck {
  font-size: 15px;
  margin-bottom: 22px;
  line-height: 1.4em; }
  @media (max-width: 740px) {
    .graphic-container-sidebar .graphic-deck {
      font-size: 15px; } }

.graphic-source {
  font-family: 'acumin-pro', sans-serif;
  font-weight: 400;
  font-weight: normal;
  letter-spacing: -0.2px;
  font-weight: 100;
  font-size: 14px;
  line-height: 18px;
  margin-top: 22px;
  margin-bottom: 53px;
  color: #888888; }
  .graphic-source a {
    color: #353535; }
  @media (max-width: 740px) {
    .graphic-source {
      font-size: 12px; } }

.graphic-container-sidebar .graphic-source {
  font-size: 12px;
  line-height: 18px;
  margin-top: 8px; }
  @media (max-width: 740px) {
    .graphic-container-sidebar .graphic-source {
      font-size: 12px;
      line-height: 14px; } }

.graphic-container-sidebar {
  float: left;
  margin-left: 0px;
  margin-right: 0px;
  width: 31%;
  padding-right: 2.35%;
  height: 0; }
  @media (max-width: 1050px) {
    .graphic-container-sidebar {
      margin-top: 0px;
      margin-bottom: 55px;
      margin-right: 0;
      margin-left: 34%;
      display: block;
      width: auto;
      height: auto; } }
  @media (max-width: 740px) {
    .graphic-container-sidebar {
      margin-left: 0px;
      margin-top: 0px;
      margin-bottom: 55px;
      margin-right: 0;
      display: block;
      width: 100%;
      height: auto; } }

.hidden {
  display: none; }

.invisible {
  opacity: 0; }

.hide-mobile {
  display: block; }
  @media (max-width: 579px) {
    .hide-mobile {
      display: none; } }

.hide-tablet {
  display: block; }
  @media (max-width: 939px) {
    .hide-tablet {
      display: none; } }

.hide-desktop {
  display: block; }
  @media (min-width: 940px) {
    .hide-desktop {
      display: none; } }

.chart-annotation-text {
  font-family: 'acumin-pro', sans-serif;
  font-weight: 400;
  letter-spacing: -0.2px;
  font-size: 14px;
  text-anchor: start; }

.chart-g {
  transform: translate(-50px, 0px); }

.inline-legend-request {
  color: #5641ce; }

.inline-legend-denial {
  color: #e55946; }

.inline-legend-approval {
  color: #8da400; }

.inline-legend-no-response {
  color: #40afe5; }

.annotation-text-request {
  fill: #5641ce;
  text-anchor: start; }

.annotation-text-no-response {
  fill: #40afe5; }

.annotation-text-denial {
  fill: #e55946; }

.annotation-text-approval {
  fill: #8da400; }

.annotation-text-hq-denial {
  fill: #8da400; }

.annotation-text-hq-approval {
  fill: #e55946; }

.graphic-annotation {
  font-family: 'acumin-pro', sans-serif;
  font-weight: 400;
  letter-spacing: -0.2px;
  position: absolute;
  font-size: 14px;
  margin-bottom: 0px;
  line-height: 1.1em;
  font-weight: 200; }
  @media (max-width: 740px) {
    .graphic-annotation {
      font-size: 12px; } }

.text-number {
  font-weight: 600;
  font-size: 16px; }
  @media (max-width: 740px) {
    .text-number {
      font-size: 14px; } }

.graphic-annotation-request {
  position: relative;
  color: #5641ce; }

.graphic-annotation-denials {
  color: #e55946; }

.graphic-annotation-hq-denied {
  color: #e55946; }

.graphic-annotation-approval {
  color: #8da400; }

.graphic-annotation-hq-approval {
  color: #8da400; }

.graphic-annotation-no-response {
  color: #40afe5; }