.elo-banner-background {
  width: 100%; height: 498px; overflow: hidden; text-align: center; position: relative;
  flex-wrap: wrap; justify-content: center; align-items: center;
  display: -webkit-box; 
  display: -moz-box; 
  display: -ms-flexbox; 
  display: -webkit-flex; 
  display: flex;  
  background: #00ACCB;
}
  .elo-banner-image-desktop {
    display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; 
    background: #000 url('https://www.worldvisionphilanthropy.org/hubfs/ELO_2021/elo-banner-image_70.jpg') no-repeat center top; 
    background-size: cover;
  }
  .elo-banner-image-mobile  {
    display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; 
    background: #000 url('https://www.worldvisionphilanthropy.org/hubfs/ELO_2021/elo-banner-image_mobile_70.jpg') no-repeat center top;
    background-size: cover;
  }
  
    .elo-banner-text {
      width: 100%;  margin: 0 auto; text-align: left;
      color: #fff;font-size: 30px; line-height: 1em; font-weight: normal; 
      font-family: 'Lato', Helvetica, Arial, sans-serif;
    }

/* optional logos */
.elo-banner-text-top-left-logo {position: absolute; top: 40px; left: 0px; display: block; width: 100%; text-align: center;}
.elo-banner-text-bottom-right-logo {position: absolute; bottom: 40px; right: 0px; display: block; width: 100%; text-align: center;}
.elo-banner-text-absolute-logo-inner {width: 100%; max-width: 1230px; display: inline-block; margin: 0 auto;}
.elo-banner-text-top-left-logo .elo-banner-text-absolute-logo-inner {text-align: left;}
.elo-banner-text-bottom-right-logo .elo-banner-text-absolute-logo-inner {text-align: right;}

@media screen and (max-width: 1320px) {
  .elo-banner-text {padding: 25px 6%;}
  .elo-banner-text-top-left-logo {left: 6%; width: 88%;}
  .elo-banner-text-bottom-right-logo {right: 6%; width: 88%;}
}
@media screen and (max-width: 450px) {
  .elo-banner-background {height: 731px;}
  .elo-banner-image-desktop {display: none;}
  .elo-banner-image-mobile  {display: block;}
  .elo-banner-text-position {align-items: flex-end;}
  .elo-banner-text, .elo-banner-text * {text-align: center !important; float: none !important; margin: 0 auto;}
  .elo-banner-text img {max-width: 243px; height: auto; margin: 0 auto;}
  .elo-banner-text-top-left-logo,
  .elo-banner-text-bottom-right-logo {
    position: absolute; bottom: auto; top: 40px; left: 6%; right: auto; width: 88%; text-align: center;
    display: -webkit-block; 
    display: -moz-block; 
    display: -webkit-block;
    display: -ms-block; 
    display: block;  
  }
}
/* @media screen and (min-width: 1138px) {
.elo-banner-text-position {
    position: absolute;
    top: 212px;
    width: 170%;
    justify-content: right; align-items: right;
    display: flex;
    height: 100%;
    justify-content: flex-end;
    display: -webkit-box; 
    display: -moz-box; 
    display: -ms-flexbox; 
    display: -webkit-flex; 
    display: flex; 
  }
}

@media screen and (min-width: 651px) and (max-width:1137px) {
.elo-banner-text-position {
    align-items: right;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    height: 100%;
    justify-content: right;
    justify-content: flex-end;
    position: absolute;
    top: 325px;
    left: -374px;
    width: 170%;
}
}
@media screen and (max-width:650px) {
.elo-banner-text-position {
    align-items: right;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    /* display: flex; */
    height: 100%;
}
} */

@media screen and (max-width: 420px) {
  .elo-banner-background {height: 681px;}
  .elo-banner-text img {max-width: 223px;}
}
@media screen and (max-width: 380px) {
  .elo-banner-background {height: 615px;}
  .elo-banner-text img {max-width: 203px;}
}
@media screen and (max-width: 320px) {
  .elo-banner-background {height: 541px;}
  .elo-banner-text img {max-width: 180px;}
}