@font-face {
  font-family: 'hackney';
  src: url('https://www.globalpartnership.org/docs/fonts/hackney-vector-webfont.woff2') format('woff2'),
       url('https://www.globalpartnership.org/docs/fonts/hackney-vector-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
.selectedItem, .gridder-list, .gridder-list .img-fluid, .text-overlay { transition: all 150ms ease-in-out; }
.hackney { font-family: 'hackney'; }

/*
.node__content .field__item:nth-child(odd) section, .node__content .field__item:nth-child(even) .gridder-show { background: #eef1f4 !important; }
.node__content .field__item:nth-child(even) section, .node__content .field__item:nth-child(odd) .gridder-show { background: #fff !important; }
*/

#page .gridder-expanded-content h2 {
  margin: 1rem 0;
  line-height: 1;
  font-family: "Poppins", sans-serif;
  font-size: 1.8888rem;
  font-weight: 600;
}
.gridder-expanded-content h3 {
  font-size: 1.2rem;
  position: relative;
  font-weight: 700;
}

.img-fluid { border-radius: 3px; }
.gridder-list .img-fluid { z-index: 1; }
.gridder-list .img-fluid:hover {
  -webkit-filter: brightness(1.05);
  filter: brightness(1.05);
}
.text-overlay {
  background: rgba(6,33,114,0.8);
  padding: 10px;
  color: #fff;
  opacity: 0;
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
  z-index: 100;
  width: 100%;
  bottom: -10px;
}
.gridder-list:hover .text-overlay, .selectedItem .text-overlay {
  opacity: 1.0;
  bottom: 0;
}
.text-overlay .text-overlay strong {
  font-weight: 700;
  font-size: 1.2222 rem;
}
.champion-text {
  font-size: 0.9rem;
  margin: 0 0 20px 0;
}
.champion-quote {
  font-family: 'hackney';
  font-size: 35px;
  line-height: 1;
  text-transform: uppercase;
  position: relative;
  color: #062172;
  padding: 80px 0;
  position: relative;
  text-align: center;
}
.open-quote, .close-quote {
  font-family: 'hackney';
  color: #43d596;
  font-size: 160px;
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
}
.open-quote { top: 60px; }
.close-quote { bottom: -170px; }

.gridder { margin: 0px; padding: 0px; list-style-type: none; font-size: 0; text-align: center; }
.gridder .gridder-list { display: inline-block; vertical-align: top; cursor: pointer; position: relative; width: 200px; margin-bottom: 0.5%; margin-right: 0.5%; }
.gridder .gridder-list .image { background-color: #313131; background-size: cover; background-position: center; width: 200px; height: 250px; position: relative; }
.gridder .overlay { position: absolute; left: 10%; top: 10%; color: #FFF; line-height: 130%; text-align: left; }
.gridder .selectedItem:after { content: ' '; display: block; border-bottom: 10px solid #fff; border-left: 10px solid transparent; border-right: 10px solid transparent; height: 0%; position: absolute; top: 101%; width: 0; left: 43%; margin-bottom: -4px; }
.gridder.hasSelectedItem .gridder-list:not(.selectedItem) { opacity: 0.6; }
.gridder-show { padding: 4%; background: #fff; position: relative; display: block; float: left; width: 100%; margin-bottom: 0.5%; text-align: left; border-radius: 3px; }
.gridder-show img { width: 100%; box-shadow: 0px 0px 20px 5px rgba(0, 0, 0, 0.2); }
.gridder-content { display: none; }
.gridder-navigation .gridder-nav { height: 77px; padding: 0; position: absolute; width: 32px; z-index: 1; background-color: #454545; background-image: linear-gradient(top, #3e3e3e, #333); border: 1px solid #141414; border-radius: 2px; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06), 1px 1px 0 rgba(255, 255, 255, 0.03), -1px -1px 0 rgba(0, 0, 0, 0.02), inset 1px 1px 0 rgba(255, 255, 255, 0.05); color: #aaa !important; cursor: pointer !important; /* display: inline-block; */ display: none; filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#303030',EndColorStr='#262626'); font-size: 11px; font-weight: bold; margin: 0 5px; outline: 0; text-align: center; text-decoration: none !important; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); -webkit-user-select: none; user-select: none; vertical-align: middle; white-space: normal; word-wrap: normal; top: 50%; margin-top: -40px; overflow: hidden; }
.gridder-navigation .gridder-nav span { display: block; bottom: 0; height: 23px; left: 0; margin: auto; position: absolute; right: 0; top: 0; width: 14px; }
.gridder-navigation .gridder-nav.prev { left: -6px; }
.gridder-navigation .gridder-nav.prev span { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAXBAMAAADJv2OxAAAAMFBMVEX///+ZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZnHHh8xAAAAD3RSTlMAESIzRFVmd4iZqrvM3e5GKvWZAAAAdElEQVQI12NgAAH2v2CKsf83mJb8vxBEMe3/KQCitf83gLn3n4Flff8FgCjW90/A3Pw/BiBK4v0lMHf+bwUw/R/CZVj/SwBq5kaIQD1UAfv7yxCBuH8OYJrl/VWIgM3/AjDNdP45REDq/0SI+9b/gghw/AUAn68l+4HFkZUAAAAASUVORK5CYII=) center no-repeat; }
.gridder-navigation .gridder-nav.next { right: -6px; -webkit-transform: scaleX(-1); transform: scaleX(-1); }
.gridder-navigation .gridder-nav.next span { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAXBAMAAADJv2OxAAAAMFBMVEX///+ZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZnHHh8xAAAAD3RSTlMAESIzRFVmd4iZqrvM3e5GKvWZAAAAdElEQVQI12NgAAH2v2CKsf83mJb8vxBEMe3/KQCitf83gLn3n4Flff8FgCjW90/A3Pw/BiBK4v0lMHf+bwUw/R/CZVj/SwBq5kaIQD1UAfv7yxCBuH8OYJrl/VWIgM3/AjDNdP45REDq/0SI+9b/gghw/AUAn68l+4HFkZUAAAAASUVORK5CYII=) center no-repeat; }
.gridder-navigation .gridder-nav:hover { background: #3d3d3d; }
.gridder-navigation .gridder-close { background: url(data:image/gif;base64,R0lGODlhFAAUAJEAAE1NTf///////wAAACH5BAEHAAIALAAAAAAUABQAAAIzBISpK+YMm5Enpodw1HlCfnkKOIqU1VXk55goVb2hi7Y0q95lfG70uurNaqLgTviyyUoFADs=) no-repeat center center; cursor: pointer; height: 30px; padding: 7px; position: absolute; right: 10px; top: 10px; width: 30px; z-index: 2; }
.gridder-navigation .gridder-close:hover { opacity: 0.7; }

@media (max-width: 768px) and (min-width: 0px) {
  .gridder .gridder-list { width: 90%; }
  .gridder .gridder-list.selectedItem { width: 100%; }
  .gridder-list .text-overlay { opacity: 1.0; }
  .col-md-5 .img-fluid, .col-md-6 .img-fluid { display: none; }
}