body {
  background-color: #fff; }

.colors--inverted {
  background-color: rgba(0, 0, 0, 0.87);
  color: #fff; }

.colors--alternate {
  background-color: rgba(0, 0, 0, 0.02); }

.map section {
  overflow: visible;
  /* shows scaled grid items */ }

.map .cap {
  font: 400 18px / 24px "Neue Machina Regular", -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", "Helvetica", sans-serif; }

.map h1 {
  margin-top: 16px;
  margin-bottom: 16px;
  padding-top: 0;
  padding-bottom: 0;
  font: 500 55px / 58px "Neue Machina Ultrabold", -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", "Helvetica", sans-serif; }

.map-header {
  display: flex;
  justify-content: space-between; }
  @media (min-width: 730px) {
    .map-header {
      align-items: center; } }
  @media (max-width: 730px) {
    .map-header {
      flex-direction: column; } }
  .map-header a {
    color: #262626;
    padding: 16px 16px; }
    .map-header a.active {
      color: #0000EE;
      border-bottom: 3px solid #0000EE; }

.map h4 {
  font-weight: normal; }

.view-filters {
  padding-top: 32px;
  padding-bottom: 32px;
  background-color: #fff;
  display: flex; }
  .view-filters > div {
    flex: 1 1 auto; }
  @media (max-width: 730px) {
    .view-filters {
      flex-direction: column; }
      .view-filters > div {
        margin-bottom: 8px; } }
  @media (min-width: 730px) {
    .view-filters > div:not(:last-child) {
      margin-right: 8px; }
    .view-filters .category,
    .view-filters .location,
    .view-filters .language {
      max-width: 200px; }
    .view-filters .status {
      max-width: 100px; } }

@media (min-width: 730px) {
  .sticky {
    position: fixed;
    top: 0;
    left: 0;
    padding-left: 32px;
    padding-right: 32px;
    width: 100%;
    border-bottom: 1px solid #262626;
    z-index: 10; }

  body.filters-top + .grid-view,
  body.filters-top + .list-view {
    padding-top: 102px; } }
.projects {
  padding: 0;
  margin: 0;
  list-style: none;
  -ms-box-orient: horizontal;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex; }

.grid-view {
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-left: -6px;
  margin-right: -6px; }

.view-controls {
  display: flex;
  justify-content: space-between; }
  .view-controls .how-to-read-button button {
    border: none;
    margin: 0;
    padding: 0;
    width: auto;
    overflow: visible;
    background: transparent;
    /* inherit font & color from ancestor */
    color: inherit;
    font: inherit;
    /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */
    line-height: normal;
    /* Corrects font smoothing for webkit */
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
    /* Corrects inability to style clickable `input` types in iOS */
    -webkit-appearance: none;
    font: 400 12px / 16px -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", "Helvetica", sans-serif;
    padding: 8px;
    text-transform: uppercase;
    color: #646464;
    cursor: pointer; }
    .view-controls .how-to-read-button button svg {
      fill: #B7B7B7; }
    .view-controls .how-to-read-button button:hover, .view-controls .how-to-read-button button.active {
      color: #4C4CFF; }
      .view-controls .how-to-read-button button:hover svg, .view-controls .how-to-read-button button.active svg {
        fill: #4C4CFF; }
    .view-controls .how-to-read-button button span {
      display: flex;
      align-items: center; }
    .view-controls .how-to-read-button button #open-help {
      display: none; }

.project-block {
  margin-right: 6px;
  margin-left: 6px;
  list-style-type: none;
  word-wrap: break-word;
  width: 80px;
  transition: all .1s ease-in-out; }
  .project-block a {
    color: #262626; }
  .project-block:hover {
    transform: scale(1.1); }

.map .project-name {
  font: 400 12px / 12px -apple-system, "Roboto Condensed", sans-serif; }

.map .funder-link {
  display: block; }

.map .funder-type {
  font: 400 12px / 16px -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", "Helvetica", sans-serif; }

.map .ag-theme-material {
  color: #646464;
  font: 400 16px / 22px -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", "Helvetica", sans-serif; }
  .map .ag-theme-material .ag-header {
    color: #262626;
    font: 400 16px / 22px -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", "Helvetica", sans-serif;
    font-weight: 500;
    border-bottom: 1px solid #e2e2e2; }
  .map .ag-theme-material .ag-cell {
    padding-top: 16px;
    padding-bottom: 16px;
    line-height: inherit; }
  .map .ag-theme-material .ag-header-cell {
    transition: background-color 200ms ease-out; }
    .map .ag-theme-material .ag-header-cell:active {
      background-color: #DADAFF; }
    .map .ag-theme-material .ag-header-cell:hover .ag-header-cell-resize {
      background-color: #DADAFF; }
    .map .ag-theme-material .ag-header-cell:hover .ag-header-icon {
      opacity: 1 !important;
      /* overrides js */ }
    .map .ag-theme-material .ag-header-cell .ag-header-cell-resize:active {
      background-color: #4C4CFF; }

.how-to-read-panel {
  background-color: #646464;
  color: #fff;
  margin-top: 32px;
  margin-bottom: 32px;
  padding: 16px 32px; }
  .how-to-read-panel .close {
    display: flex;
    justify-content: flex-end; }
    .how-to-read-panel .close svg {
      width: 16px;
      height: 16px; }
    .how-to-read-panel .close button {
      border: none;
      margin: 0;
      padding: 0;
      width: auto;
      overflow: visible;
      background: transparent;
      /* inherit font & color from ancestor */
      color: inherit;
      font: inherit;
      /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */
      line-height: normal;
      /* Corrects font smoothing for webkit */
      -webkit-font-smoothing: inherit;
      -moz-osx-font-smoothing: inherit;
      /* Corrects inability to style clickable `input` types in iOS */
      -webkit-appearance: none; }
  .how-to-read-panel .how-to-read {
    display: flex; }
    @media (max-width: 730px) {
      .how-to-read-panel .how-to-read {
        flex-direction: column; } }
  @media (min-width: 730px) {
    .how-to-read-panel .graphic,
    .how-to-read-panel .text {
      flex: 1 1 50%; }
    .how-to-read-panel .graphic {
      display: flex;
      justify-content: center;
      align-items: center; } }
  .how-to-read-panel a, .how-to-read-panel .text {
    color: #fff;
    font: 400 16px / 20px -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", "Helvetica", sans-serif; }
  .how-to-read-panel a {
    border-bottom-color: #fff; }
  .how-to-read-panel h5 {
    margin-top: 8px;
    margin-bottom: 8px; }

.map .ag-theme-material .funder-link,
.map .ag-theme-material .project-name {
  font: 400 20px / 28px -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", "Helvetica", sans-serif;
  font-weight: 500;
  color: #262626; }

.map .ag-theme-material .funder-description, .map .ag-theme-material .funder-link, .map .ag-theme-material .project-name {
  white-space: normal; }