/*@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,400;0,700;1,400&display=swap');*/
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,400;0,700;1,400&family=Poppins:wght@400;500;700;800&display=swap");
.text-plain {
  font-family: 'Fira Sans', sans-serif !important; }

.text-sans-serif {
  font-family: 'Poppins', sans-serif !important; }

.text-serif {
  font-family: 'Noto Serif', serif !important; }

h1, h2, h3, h4, .btn {
  font-family: 'Poppins', sans-serif !important; }

.btn {
  font-weight: 500; }
  .btn.primary {
    background-color: #FF9966; }
    .btn.primary:hover {
      background-color: #ff884d; }

a [class*="icon-"]:before {
  vertical-align: middle; }

.drop-shadow {
  -webkit-box-shadow: 0 5px 20px -5px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 20px -5px rgba(0, 0, 0, 0.2); }

.text-shadow {
  text-shadow: 0px 3px 20px #0000000f; }

nav .main-menu-container {
  font-family: 'Poppins', sans-serif !important; }
  nav .main-menu-container .main-menu {
    font-family: 'Poppins', sans-serif !important; }
    nav .main-menu-container .main-menu li a {
      font-family: 'Poppins', sans-serif !important; }

.storyline {
  position: relative;
  display: inline-block;
  width: 1em;
  height: .7em;
  margin: 0 auto 15px; }
  @media screen and (max-width: 480px) {
    .storyline {
      margin: 50px auto 15px; } }
  .storyline.inline {
    margin: auto auto auto -1em; }
  .storyline:before {
    content: '';
    width: 9px;
    height: 9px;
    background-color: transparent;
    border-radius: 50%;
    border: 1px solid #212529;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }
  .storyline:after {
    content: '';
    background-color: #212529;
    display: block;
    position: absolute;
    width: .9px;
    height: 80px;
    position: absolute;
    left: 50%;
    bottom: 50%;
    -webkit-transform: translate(-50%, -4px);
    -ms-transform: translate(-50%, -4px);
    transform: translate(-50%, -4px); }
    @media screen and (max-width: 480px) {
      .storyline:after {
        height: 50px; } }
  .storyline.gradient:after {
    -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(black));
    -webkit-mask-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), black); }
  .storyline.white:before {
    border-color: #fff; }
  .storyline.white:after {
    background-color: #fff; }
  .storyline.d90 {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg); }
  .storyline.d180 {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg); }
  .storyline.d270 {
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    margin-left: -1em;
    margin-right: -.2em; }

body.admin-bar .fake-header {
  top: 77px; }

.fake-header {
  z-index: 1;
  top: 45px;
  width: 100%;
  position: absolute;
  background-color: transparent; }
  @media screen and (max-width: 480px) {
    .fake-header {
      display: none; } }
  .fake-header .container .logo-ea {
    width: 230px;
    margin: 15px 0; }
    @media screen and (max-width: 1200px) {
      .fake-header .container .logo-ea {
        width: 220px; } }
    @media screen and (max-width: 992px) {
      .fake-header .container .logo-ea {
        width: 190px; } }
    @media screen and (max-width: 480px) {
      .fake-header .container .logo-ea {
        width: 140px; } }
    @media screen and (min-width: 480px) {
      .fake-header .container .logo-ea svg path, .fake-header .container .logo-ea svg g {
        fill: #FFF; } }

.main-header {
  border-bottom: 1px solid #E7E3EA;
  -webkit-transition: all .3s ease-out !important;
  -o-transition: all .3s ease-out !important;
  transition: all .3s ease-out !important;
  position: absolute !important; }
  @media screen and (min-width: 480px) {
    .main-header.top-header {
      -webkit-transform: translateY(-100%);
      -ms-transform: translateY(-100%);
      transform: translateY(-100%);
      opacity: 0; } }
  @media only screen and (min-width: 768px) {
    .main-header {
      position: fixed !important; } }
  @media only screen and (max-width: 768px) {
    .main-header {
      top: 0; }
      .main-header .logo-ea {
        width: 130px !important; } }
  .main-header.nope {
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%); }

@media (min-width: 1200px) {
  body.front-page .container.wide, body.page-template-new-homepage .container.wide {
    max-width: 1270px; } }

section.hp-cover {
  background-size: cover;
  background-color: #E7E3EA;
  background-position: center center;
  position: relative; }
  section.hp-cover:after {
    content: '';
    display: block;
    padding-top: 36%; }
    @media screen and (max-width: 1200px) {
      section.hp-cover:after {
        padding-top: 45%; } }
    @media screen and (max-width: 992px) {
      section.hp-cover:after {
        padding-top: 55%; } }
    @media screen and (max-width: 480px) {
      section.hp-cover:after {
        padding-top: 80%; } }
  section.hp-cover .container {
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    height: 100%;
    margin: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end; }
  section.hp-cover .text {
    margin-bottom: 40px; }
    @media screen and (max-width: 480px) {
      section.hp-cover .text {
        margin-bottom: 15px; } }
    section.hp-cover .text .label {
      background-color: #fff;
      color: #212529; }
    section.hp-cover .text h1 {
      font-size: 4em;
      line-height: .9em;
      max-width: 70vw;
      color: #fff;
      font-weight: 800;
      text-shadow: 0 3px 10px #0000002e;
      margin-bottom: 0.4em; }
      @media screen and (max-width: 1600px) {
        section.hp-cover .text h1 {
          font-size: 2.9em;
          font-size: 4em; } }
      @media screen and (max-width: 768px) {
        section.hp-cover .text h1 {
          font-size: 2.5em;
          max-width: none; }
          section.hp-cover .text h1 br {
            display: none; } }
      @media screen and (max-width: 480px) {
        section.hp-cover .text h1 {
          font-size: 1.4em;
          margin-right: 1em; } }
      section.hp-cover .text h1 strong, section.hp-cover .text h1 b {
        color: #FF9966; }

section.hp-sub-cover {
  margin: 20px 0;
  overflow: visible;
  position: relative;
  z-index: 1; }
  @media screen and (max-width: 1200px) {
    section.hp-sub-cover {
      margin: 30px 0; } }
  @media screen and (max-width: 480px) {
    section.hp-sub-cover {
      margin: 15px 0; } }
  section.hp-sub-cover .container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    @media screen and (max-width: 1200px) {
      section.hp-sub-cover .container {
        -webkit-box-align: initial;
        -ms-flex-align: initial;
        align-items: initial;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column; } }
  section.hp-sub-cover .archive {
    -webkit-box-flex: 1.9;
    -ms-flex: 1.9;
    flex: 1.9; }
  section.hp-sub-cover .donation-box {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1; }

section.cta-section {
  background-color: #FF9966;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0 0 30px 0; }
  section.cta-section .flickity-viewport {
    -webkit-transition: height 0.2s;
    -o-transition: height 0.2s;
    transition: height 0.2s; }
  section.cta-section .flickity-page-dots {
    width: 40px;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    top: 0;
    right: 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center; }
    @media screen and (max-width: 480px) {
      section.cta-section .flickity-page-dots {
        top: auto;
        bottom: 0;
        width: 100%;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        height: 50px; } }
    section.cta-section .flickity-page-dots .dot {
      width: 13px;
      height: 13px;
      border: 0;
      background-color: #fff;
      margin-bottom: 10px;
      -webkit-box-shadow: 0 5px 7px -5px rgba(0, 0, 0, 0.2);
      box-shadow: 0 5px 7px -5px rgba(0, 0, 0, 0.2); }
      @media screen and (max-width: 480px) {
        section.cta-section .flickity-page-dots .dot {
          margin: 0 4px; } }
      section.cta-section .flickity-page-dots .dot:last-child {
        margin-bottom: 0; }
  section.cta-section .cta-carousel {
    width: 100%; }
    section.cta-section .cta-carousel .cta-slide {
      width: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      position: relative; }
      @media screen and (max-width: 480px) {
        section.cta-section .cta-carousel .cta-slide {
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
          -ms-flex-direction: column;
          flex-direction: column; } }
      @media screen and (max-width: 480px) {
        section.cta-section .cta-carousel .cta-slide .storyline {
          display: none; } }
      section.cta-section .cta-carousel .cta-slide .image-container {
        -webkit-box-flex: 2;
        -ms-flex: 2;
        flex: 2;
        position: relative;
        overflow: hidden; }
        section.cta-section .cta-carousel .cta-slide .image-container .image {
          background-size: cover;
          background-position: center center;
          position: absolute;
          top: 0;
          right: 0;
          width: 100%;
          height: 100%; }
        @media screen and (max-width: 480px) {
          section.cta-section .cta-carousel .cta-slide .image-container {
            content: '';
            display: block;
            padding-top: 50%;
            width: 100%;
            top: 0;
            left: 0; } }
      section.cta-section .cta-carousel .cta-slide .text-container {
        -webkit-box-flex: 2.5;
        -ms-flex: 2.5;
        flex: 2.5; }
        section.cta-section .cta-carousel .cta-slide .text-container .text {
          margin: 50px 50px;
          max-width: 40vw; }
          @media screen and (max-width: 480px) {
            section.cta-section .cta-carousel .cta-slide .text-container .text {
              margin: 15px 15px 50px 15px;
              max-width: none; } }
          section.cta-section .cta-carousel .cta-slide .text-container .text .label {
            background-color: #fff;
            color: #212529; }
          section.cta-section .cta-carousel .cta-slide .text-container .text h3 {
            font-size: 2.1rem;
            text-transform: none;
            margin: .1em 0 .2em; }
            @media screen and (max-width: 480px) {
              section.cta-section .cta-carousel .cta-slide .text-container .text h3 {
                font-size: 1.6em; } }
          @media screen and (max-width: 992px) {
            section.cta-section .cta-carousel .cta-slide .text-container .text p {
              font-size: 1em; } }
  @media screen and (min-width: 992px) {
    section.cta-section .main-link {
      display: none; } }

section.related-posts {
  background-color: #F4F4F4;
  padding: 2em 0;
  margin: 0;
  max-width: 100%; }
  @media screen and (max-width: 480px) {
    section.related-posts .related-posts-list {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column; }
      section.related-posts .related-posts-list .related-post {
        width: 100%; } }
  section.related-posts .related-posts-list .related-post .description {
    padding: .2em 1em .2em 0; }

section.newsletter-benefitshop-container {
  padding: 2em 0; }
  @media screen and (max-width: 480px) {
    section.newsletter-benefitshop-container {
      padding: 0; } }

section.storytelling-section {
  margin: 0; }
  section.storytelling-section .sub-section {
    position: relative;
    text-align: center; }
    section.storytelling-section .sub-section .bg {
      position: absolute;
      overflow: hidden;
      top: 0;
      left: 0;
      width: 100%; }
      section.storytelling-section .sub-section .bg img {
        width: 100%;
        height: auto;
        display: block; }
    section.storytelling-section .sub-section .btn {
      z-index: 1; }
    section.storytelling-section .sub-section .container {
      position: relative;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      z-index: 1; }
    section.storytelling-section .sub-section h2 {
      font-size: 3.7em;
      line-height: 0.8em;
      margin: 0; }
      @media screen and (max-width: 1600px) {
        section.storytelling-section .sub-section h2 {
          font-size: 3.5em; } }
      @media screen and (max-width: 768px) {
        section.storytelling-section .sub-section h2 {
          font-size: 3em; } }
      @media screen and (max-width: 480px) {
        section.storytelling-section .sub-section h2 {
          font-size: 2.2em; }
          section.storytelling-section .sub-section h2 br {
            display: none; } }
      @media screen and (max-width: 320px) {
        section.storytelling-section .sub-section h2 {
          font-size: 2em; } }
      section.storytelling-section .sub-section h2 strong, section.storytelling-section .sub-section h2 b {
        color: #FF9966; }
    section.storytelling-section .sub-section p {
      font-family: 'Noto Serif', serif;
      font-size: 1.8em;
      margin: 0 0 .1em 0; }
      @media screen and (max-width: 768px) {
        section.storytelling-section .sub-section p {
          font-size: 1.6em; } }
      @media screen and (max-width: 480px) {
        section.storytelling-section .sub-section p {
          font-size: 1.2em; } }
      @media screen and (max-width: 320px) {
        section.storytelling-section .sub-section p {
          font-size: 1em; } }
      section.storytelling-section .sub-section p.align-end {
        margin: auto 0 0 0; }
      section.storytelling-section .sub-section p.next-section-intro {
        margin-bottom: -2em;
        position: relative; }
  section.storytelling-section .the-problem-section {
    background-color: #000;
    color: #fff; }
    section.storytelling-section .the-problem-section .data-source {
      font-size: 12px;
      line-height: 1em;
      position: absolute;
      bottom: 30px;
      margin: 5px;
      right: 0;
      -webkit-transform-origin: right bottom;
      -ms-transform-origin: right bottom;
      transform-origin: right bottom;
      -webkit-transform: rotate(-90deg) translateX(100%);
      -ms-transform: rotate(-90deg) translateX(100%);
      transform: rotate(-90deg) translateX(100%);
      z-index: 10; }
      @media screen and (max-width: 480px) {
        section.storytelling-section .the-problem-section .data-source {
          font-size: 9px; } }
    section.storytelling-section .the-problem-section .bg {
      -webkit-transition: all 3s ease-out;
      -o-transition: all 3s ease-out;
      transition: all 3s ease-out;
      top: 10%; }
      @media screen and (max-width: 480px) {
        section.storytelling-section .the-problem-section .bg {
          top: 30%;
          width: 200%; } }
      section.storytelling-section .the-problem-section .bg:before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 20%;
        /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&1+0,0+100 */
        background: -moz-linear-gradient(top, black 0%, rgba(0, 0, 0, 0) 100%);
        /* FF3.6-15 */
        background: -webkit-linear-gradient(top, black 0%, rgba(0, 0, 0, 0) 100%);
        /* Chrome10-25,Safari5.1-6 */
        background: -webkit-gradient(linear, left top, left bottom, from(black), to(rgba(0, 0, 0, 0)));
        background: -o-linear-gradient(top, black 0%, rgba(0, 0, 0, 0) 100%);
        background: linear-gradient(to bottom, black 0%, rgba(0, 0, 0, 0) 100%);
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 );
        /* IE6-9 */ }
      section.storytelling-section .the-problem-section .bg:after {
        content: '';
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 20%;
        /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,1+100 */
        background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, black 100%);
        /* FF3.6-15 */
        background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, black 100%);
        /* Chrome10-25,Safari5.1-6 */
        background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(black));
        background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, black 100%);
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, black 100%);
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 );
        /* IE6-9 */ }
    section.storytelling-section .the-problem-section .text {
      margin: auto 0 0 0;
      padding: 10% 0 0;
      text-shadow: 0px 3px 20px #0000000f; }
      @media screen and (max-width: 480px) {
        section.storytelling-section .the-problem-section .text h2 {
          font-size: 1.9em; } }
      @media screen and (max-width: 320px) {
        section.storytelling-section .the-problem-section .text h2 {
          font-size: 1.6em; } }
    section.storytelling-section .the-problem-section .data {
      margin: 20px auto 100px;
      max-width: 900px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      font-size: 16px; }
      @media screen and (max-width: 992px) {
        section.storytelling-section .the-problem-section .data {
          max-width: 70vw; } }
      @media screen and (max-width: 768px) {
        section.storytelling-section .the-problem-section .data {
          max-width: 85vw;
          margin: 60px auto 100px; } }
      @media screen and (max-width: 480px) {
        section.storytelling-section .the-problem-section .data {
          margin: 50px auto 0 auto;
          font-size: 12px;
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
          -ms-flex-direction: column;
          flex-direction: column; } }
      section.storytelling-section .the-problem-section .data .box {
        font-family: 'Poppins', sans-serif;
        position: relative;
        color: #fff;
        font-weight: 800;
        line-height: 1.2em;
        max-width: 100%;
        width: 265px;
        width: 17.5em;
        margin: 0 auto;
        -webkit-hyphens: none;
        -ms-hyphens: none;
        hyphens: none; }
        @media screen and (max-width: 480px) {
          section.storytelling-section .the-problem-section .data .box.box1 {
            margin: 0 auto 30px 0; } }
        section.storytelling-section .the-problem-section .data .box.box2 {
          margin-top: 30%; }
          @media screen and (max-width: 480px) {
            section.storytelling-section .the-problem-section .data .box.box2 {
              margin: 0 0 30px auto; } }
          section.storytelling-section .the-problem-section .data .box.box2 .storyline:after {
            height: 245px; }
        section.storytelling-section .the-problem-section .data .box .title {
          text-align: center;
          font-size: 7.2em;
          letter-spacing: -0.01em;
          margin-bottom: .05em;
          text-shadow: 0px 3px 20px #00000040; }
          section.storytelling-section .the-problem-section .data .box .title .big {
            font-size: 1.4em;
            line-height: .8em; }
          section.storytelling-section .the-problem-section .data .box .title .medium {
            font-size: .75em;
            line-height: .8em; }
          section.storytelling-section .the-problem-section .data .box .title .small {
            font-size: .52em;
            line-height: .8em; }
          section.storytelling-section .the-problem-section .data .box .title .micro {
            font-size: .25em;
            line-height: .8em; }
          section.storytelling-section .the-problem-section .data .box .title .comma {
            margin-left: -.2em; }
          section.storytelling-section .the-problem-section .data .box .title .storyline {
            position: absolute;
            top: 0;
            left: 0;
            margin: 10px 0 0 -25px;
            width: 10px;
            height: 10px; }
            @media screen and (max-width: 768px) {
              section.storytelling-section .the-problem-section .data .box .title .storyline {
                display: none; } }
        section.storytelling-section .the-problem-section .data .box .description {
          text-align: left;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          text-justify: inter-character;
          font-size: 1.5em;
          line-height: 1.2em;
          display: inline-block;
          margin: .2em 0 0 0; }
          section.storytelling-section .the-problem-section .data .box .description strong, section.storytelling-section .the-problem-section .data .box .description b {
            font-size: 1.3em;
            color: #FF9966;
            text-transform: uppercase; }
  section.storytelling-section .what-we-do-section {
    background-color: #000; }
    section.storytelling-section .what-we-do-section .bg {
      -webkit-transition: all 3s ease-out;
      -o-transition: all 3s ease-out;
      transition: all 3s ease-out; }
      section.storytelling-section .what-we-do-section .bg:before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 20%;
        /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&1+0,0+100 */
        background: -moz-linear-gradient(top, black 0%, rgba(0, 0, 0, 0) 100%);
        /* FF3.6-15 */
        background: -webkit-linear-gradient(top, black 0%, rgba(0, 0, 0, 0) 100%);
        /* Chrome10-25,Safari5.1-6 */
        background: -webkit-gradient(linear, left top, left bottom, from(black), to(rgba(0, 0, 0, 0)));
        background: -o-linear-gradient(top, black 0%, rgba(0, 0, 0, 0) 100%);
        background: linear-gradient(to bottom, black 0%, rgba(0, 0, 0, 0) 100%);
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 );
        /* IE6-9 */ }
      section.storytelling-section .what-we-do-section .bg:after {
        content: '';
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 20%;
        /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,1+100 */
        background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, black 100%);
        /* FF3.6-15 */
        background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, black 100%);
        /* Chrome10-25,Safari5.1-6 */
        background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(black));
        background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, black 100%);
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, black 100%);
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 );
        /* IE6-9 */ }
      @media screen and (max-width: 768px) {
        section.storytelling-section .what-we-do-section .bg img {
          width: 150%;
          margin-left: -25%; } }
      @media screen and (max-width: 480px) {
        section.storytelling-section .what-we-do-section .bg img {
          width: 200%;
          margin-left: -50%; } }
    section.storytelling-section .what-we-do-section .image-spacer {
      height: 40vw; }
      @media screen and (max-width: 768px) {
        section.storytelling-section .what-we-do-section .image-spacer {
          height: 56vw; } }
      @media screen and (max-width: 480px) {
        section.storytelling-section .what-we-do-section .image-spacer {
          height: 70vw; } }
    section.storytelling-section .what-we-do-section .data {
      background-color: #FF9966;
      position: relative;
      padding: 60px;
      text-align: center;
      margin: 0 auto;
      max-width: 1000px;
      color: #212529; }
      @media screen and (max-width: 480px) {
        section.storytelling-section .what-we-do-section .data {
          padding: 30px 15px; } }
      section.storytelling-section .what-we-do-section .data .storyline {
        top: 35px;
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%); }
        @media screen and (max-width: 480px) {
          section.storytelling-section .what-we-do-section .data .storyline {
            top: -40px; } }
      section.storytelling-section .what-we-do-section .data h4 {
        font-size: 2.8em;
        text-transform: uppercase;
        color: #fff;
        text-shadow: 0px 3px 20px #0000000f; }
        @media screen and (max-width: 768px) {
          section.storytelling-section .what-we-do-section .data h4 {
            font-size: 2.4em; } }
        @media screen and (max-width: 480px) {
          section.storytelling-section .what-we-do-section .data h4 {
            font-size: 2em; } }
        @media screen and (max-width: 320px) {
          section.storytelling-section .what-we-do-section .data h4 {
            font-size: 1.8em; } }
      section.storytelling-section .what-we-do-section .data .boxes {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        font-family: 'Poppins', sans-serif; }
        section.storytelling-section .what-we-do-section .data .boxes .box {
          text-transform: uppercase;
          font-weight: 800;
          font-size: 32px;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          line-height: 0.9em;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-orient: horizontal;
          -webkit-box-direction: normal;
          -ms-flex-direction: row;
          flex-direction: row;
          text-align: left;
          width: 49%;
          padding: 20px 0; }
          @media screen and (max-width: 1200px) {
            section.storytelling-section .what-we-do-section .data .boxes .box {
              width: 49%; } }
          @media screen and (max-width: 768px) {
            section.storytelling-section .what-we-do-section .data .boxes .box {
              font-size: 22px; } }
          @media screen and (max-width: 480px) {
            section.storytelling-section .what-we-do-section .data .boxes .box {
              width: 100%; } }
          section.storytelling-section .what-we-do-section .data .boxes .box .value {
            text-shadow: 0px 3px 20px #0000000f;
            color: #fff;
            text-align: right;
            font-size: 3em;
            text-transform: uppercase;
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            line-height: .6em;
            margin-right: .05em; }
            section.storytelling-section .what-we-do-section .data .boxes .box .value .small {
              font-size: .5em;
              margin-bottom: -.3em; }
            section.storytelling-section .what-we-do-section .data .boxes .box .value .micro {
              font-size: 0.35em;
              margin-bottom: -.7em; }
          section.storytelling-section .what-we-do-section .data .boxes .box .text {
            -webkit-box-flex: 1.4;
            -ms-flex: 1.4;
            flex: 1.4; }
      section.storytelling-section .what-we-do-section .data .btn {
        margin-top: 1.6em; }
  section.storytelling-section .changing-section {
    background-color: transparent;
    color: #212529;
    margin-top: -6vw;
    padding-top: 6vw; }
    section.storytelling-section .changing-section:before {
      content: '';
      background-color: #fff;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 50%; }
    section.storytelling-section .changing-section .container {
      min-height: 0; }
      section.storytelling-section .changing-section .container .text {
        padding: 35px 0 30px 0;
        text-shadow: 0px 3px 20px #0000000f; }
    @media screen and (max-width: 480px) {
      section.storytelling-section .changing-section .storyline {
        margin-top: 0; } }
  section.storytelling-section .solution-section {
    background-color: #fff;
    color: #212529;
    overflow: hidden;
    margin-top: -60px;
    z-index: -1; }
    @media screen and (max-width: 480px) {
      section.storytelling-section .solution-section {
        margin-top: -20px; } }
    section.storytelling-section .solution-section .bg {
      top: auto;
      bottom: 0;
      position: relative; }
      section.storytelling-section .solution-section .bg:after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 20%;
        /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&1+0,0+100;White+to+Transparent */
        background: -moz-linear-gradient(top, white 0%, rgba(255, 255, 255, 0) 100%);
        /* FF3.6-15 */
        background: -webkit-linear-gradient(top, white 0%, rgba(255, 255, 255, 0) 100%);
        /* Chrome10-25,Safari5.1-6 */
        background: -webkit-gradient(linear, left top, left bottom, from(white), to(rgba(255, 255, 255, 0)));
        background: -o-linear-gradient(top, white 0%, rgba(255, 255, 255, 0) 100%);
        background: linear-gradient(to bottom, white 0%, rgba(255, 255, 255, 0) 100%);
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
        /* IE6-9 */ }
      @media screen and (max-width: 480px) {
        section.storytelling-section .solution-section .bg img {
          width: 130%;
          height: auto;
          display: block;
          margin-left: -15%; } }
    section.storytelling-section .solution-section .container {
      -webkit-box-pack: initial;
      -ms-flex-pack: initial;
      justify-content: initial; }

@media screen and (max-width: 480px) {
  .homepage-newsletter-box {
    margin: 30px 0; }
    .homepage-newsletter-box .description p {
      font-size: 1.2em; } }

.homepage-newsletter-box form .input-container .select2 {
  margin-bottom: 15px; }
  .homepage-newsletter-box form .input-container .select2 [class^='select2-selection'] {
    font-size: 25px;
    height: 35px !important;
    line-height: 35px !important;
    font-size: 25px;
    text-indent: 7px;
    background: #f9f9f9;
    border-bottom: 1px solid #dedede; }
  .homepage-newsletter-box form .input-container .select2 [class$='arrow'] {
    background: #f9f9f9 !important; }

.benefitshop-box {
  padding: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; }
  @media screen and (max-width: 768px) {
    .benefitshop-box {
      padding: 15px; } }
  @media screen and (max-width: 480px) {
    .benefitshop-box {
      margin: 30px 0; } }
  .benefitshop-box .image {
    -ms-flex-item-align: start;
    align-self: flex-start; }
    .benefitshop-box .image img {
      max-height: 200px;
      width: auto; }
  .benefitshop-box .text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 0 0 0 15px; }
    .benefitshop-box .text .title {
      font-family: 'Poppins', sans-serif;
      font-size: 1.8em;
      line-height: 1em;
      margin: .2em 0 .4em 0;
      font-weight: 500; }
      @media screen and (max-width: 768px) {
        .benefitshop-box .text .title {
          font-size: 1.8em; } }
      @media screen and (max-width: 480px) {
        .benefitshop-box .text .title {
          font-size: 1.4em;
          font-weight: 600; } }
    .benefitshop-box .text .btn {
      margin: 0 0 .2em 0; }

.label {
  font-family: 'Poppins', sans-serif;
  background-color: #778f8d;
  color: #fff;
  font-weight: 500;
  display: inline-block;
  -ms-flex-item-align: start;
  align-self: flex-start;
  padding: 0 .5em;
  margin: 0 .1em .5em;
  font-size: .8em;
  text-transform: uppercase; }
  .label.primary {
    background-color: #FF9966;
    color: #212529; }
  .label.secondary {
    background-color: #778f8d;
    color: #212529; }
  .label.white {
    background-color: #fff;
    color: #212529; }

.small-title {
  font-family: 'Poppins', sans-serif;
  display: block;
  padding: 0;
  margin: 0 .1em .5em;
  font-size: .8em;
  line-height: 1.2em;
  text-transform: uppercase; }
  .small-title a:hover {
    color: #778f8d; }

.articles {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  /* article {
		flex: 1;
		background-size: cover;
		background-color: $light-gray;
		position: relative;
		margin-right: 15px;
		@media screen and (max-width: $xs) {
			margin-right: 0;
			margin-bottom: 15px;
		}
		&:last-child {
			margin-left: 0;
			@media screen and (max-width: $lg) {
				margin-right: 0;
			}
		}
		&:after {
			content: '';
			display: block;
			padding-top: 56%;
		}
		&:before {
			content: '';
			position: absolute;
			bottom: 0;
			left: 0;
			width: 100%;
			height: 50%;
			opacity: .5;
			background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
			background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
			background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 );
		}
		.text {
			position: absolute;
			top: 0;
			left: 0;
			padding: 15px;
			width: 100%;
			height: 100%;
			display: flex;
			flex-direction: column;
			justify-content: flex-end;
			h3 {
				color: $white;
				font-size: 1.1em;
				margin: 0;
				@media screen and (min-width: $md) and (max-width: $lg) {
					font-size: 1.5em;
				}
				br {
					display: none;
				}
			}
		}
	} */ }
  @media screen and (max-width: 480px) {
    .articles {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column; } }
  .articles article {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    position: relative;
    margin-right: 15px; }
    @media screen and (max-width: 480px) {
      .articles article {
        margin-right: 0;
        margin-bottom: 15px; } }
    .articles article:last-child {
      margin-left: 0; }
      @media screen and (max-width: 1200px) {
        .articles article:last-child {
          margin-right: 0; } }
    .articles article .bg {
      background-size: cover;
      background-position: center;
      background-color: #E7E3EA;
      position: relative; }
      .articles article .bg:before {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 50%;
        opacity: .5;
        background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, black 100%);
        background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, black 100%);
        background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(black));
        background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, black 100%);
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, black 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 ); }
      .articles article .bg:after {
        content: '';
        display: block;
        padding-top: 56%; }
      .articles article .bg .label {
        position: absolute;
        left: 0;
        bottom: 0;
        margin: 10px; }
    .articles article .text {
      padding: 8px 15px 10px 10px;
      width: 100%; }
      .articles article .text h3 {
        color: #212529;
        font-size: 1.1em;
        margin: 0; }
        @media screen and (min-width: 992px) and (max-width: 1200px) {
          .articles article .text h3 {
            font-size: 1.5em; } }
        .articles article .text h3 br {
          display: none; }

.donation-box {
  padding: 40px;
  margin: -60px 0 0;
  background-color: #fff; }
  @media screen and (max-width: 768px) {
    .donation-box {
      padding: 30px;
      margin: 0; } }
  @media screen and (min-width: 768px) and (max-width: 1200px) {
    .donation-box {
      margin: 15px auto 0;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
      flex-direction: row-reverse;
      -webkit-box-shadow: none;
      box-shadow: none;
      padding: 15px 0; }
      .donation-box .invite-to-donation {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1; }
      .donation-box .awards {
        margin-right: 30px;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1; } }
  @media screen and (max-width: 768px) {
    .donation-box .invite-to-donation {
      -webkit-box-flex: 1.5;
      -ms-flex: 1.5;
      flex: 1.5; }
    .donation-box .awards {
      -webkit-box-flex: 1;
      -ms-flex: 1;
      flex: 1; }
      .donation-box .awards .logos {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column; }
        .donation-box .awards .logos .logo {
          margin-bottom: 10px; } }
  .donation-box h2 {
    font-size: 1.7em;
    text-transform: none; }
  .donation-box p {
    font-size: 1em; }
  .donation-box form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 1em; }
    @media screen and (min-width: 768px) and (max-width: 1200px) {
      .donation-box form {
        margin-bottom: 0; } }
    .donation-box form .currency-symbol {
      font-family: 'Fira Sans', sans-serif !important;
      font-size: 1.5em;
      opacity: .7; }
    .donation-box form input {
      -webkit-appearance: none;
      border: 0; }
    .donation-box form .input-container {
      -webkit-box-flex: 2;
      -ms-flex: 2;
      flex: 2;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
      .donation-box form .input-container input[type="text"] {
        font-size: 3em;
        height: auto;
        border-bottom: 1px solid #e6e3ea;
        height: auto;
        margin-right: 15px; }
        @media screen and (max-width: 480px) {
          .donation-box form .input-container input[type="text"] {
            font-size: 2em; } }
    .donation-box form .btn {
      -webkit-box-flex: 3;
      -ms-flex: 3;
      flex: 3;
      z-index: 1; }
  .donation-box .logos {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
    .donation-box .logos .logo {
      margin-right: 10px;
      -webkit-box-flex: 1;
      -ms-flex: 1;
      flex: 1; }
      .donation-box .logos .logo:last-child {
        margin-left: 0; }
      .donation-box .logos .logo img {
        max-width: 100%; }
        @media screen and (min-width: 480px) {
          .donation-box .logos .logo img {
            max-height: 60px; } }