.cmeImageBanner {
  max-width: 2300px;
  margin: 0 auto;
}
.cmeImageBanner .cmeImageBannerItems > li {
  height: 100%;
}
.cmeImageBanner.cmeImageBannerSmall,
.cmeImageBanner.cmeImageBannerSmall > .cmeImageBannerItems > li img {
  height: 258px;
}
.cmeImageBanner.cmeImageBannerLarge,
.cmeImageBanner.cmeImageBannerLarge > .cmeImageBannerItems > li img {
  height: 358px;
}
.cmeImageBanner.cmeImageBannerSlide > .cmeImageBannerOverlay {
  top: 50%;
}
@media screen and (min-width: 767px) {
  .cmeImageBanner.cmeImageBannerSlide > .cmeImageBannerOverlay {
    transform: skew(0, -4deg);
  }
}
@media screen and (max-width: 767px) {
  .cmeImageBannerSection {
    padding: 20px 10px 10px 20px;
    bottom: 32% !important;
    top: auto;
  }
  .cmeImageBanner.cmeImageBannerSlide > .cmeImageBannerOverlay {
    top: 0;
  }
  .cmeImageBannerOverlay {
    background-color: rgba(0, 0, 0, 0.5);
  }
}
.cmeImageBannerSelect {
  top: initial;
  bottom: 46%;
  right: 13%;
  width: 100%;
}
.cmeImageBannerNav {
  top: 45%;
}
.cmeImageBannerNav#prev:before,
.cmeImageBannerNav#next:before {
  height: initial;
  line-height: initial;
  text-shadow: 0 0 15px #272727;
}
.cmeImageBannerNav#prev {
  left: 0;
}
.cmeImageBannerNav#next {
  right: 0;
}
.cmeImageBannerSection {
  top: auto;
  bottom: 10px;
}
.cmeImageBannerSection .cmeImageBannerOverlay {
  left: 0;
  width: 100%;
  height: 258px;
  transform: skew(0, -4deg);
}
.cmeImageBanner.cmeImageBannerSmall .cmeImageBannerSection .cmeImageBannerOverlay {
  height: 258px;
}
.cmeImageBanner.cmeImageBannerLarge .cmeImageBannerSection .cmeImageBannerOverlay {
  height: 358px;
}
.cmeImageBannerSection .cmeImageBannerOverlayContent {
  width: 85%;
  margin: 0 auto;
  padding: 0;
  text-align: center;
  z-index: 2;
}
.cmeImageBannerSection .cmeImageBannerOverlayContent h3 {
  font-size: 5vw;
  line-height: 5vw;
}
@media (min-width: 480px) {
  .cmeImageBannerSection .cmeImageBannerOverlayContent h3 {
    font-size: 4vw;
    line-height: 4vw;
  }
}
@media (min-width: 640px) {
  .cmeImageBannerSection {
    bottom: 0;
    top: auto;
  }
}
@media screen and (min-width: 769px) {
  .cmeImageBannerSection {
    bottom: 18px;
    top: auto;
  }
  .cmeImageBannerLarge .cmeImageBannerSection {
    bottom: 40px;
    top: auto;
  }
}
@media (min-width: 981px) {
  .cmeImageBannerSelect {
    top: 0;
    bottom: initial;
    width: 48%;
  }
  .cmeImageBannerSection .cmeImageBannerOverlayContent h3 {
    font-size: 40px;
    line-height: 40px;
    max-width: 750px;
    margin: 0;
    padding: 0 0 0 20px;
  }
  .cmeImageBannerLarge .cmeImageBannerSection .cmeImageBannerOverlayContent h3 {
    padding: 0 0 0 60px;
  }
  .cmeImageBannerNav {
    top: 45%;
    bottom: initial;
  }
  .cmeImageBannerNav#prev {
    left: 25px;
  }
  .cmeImageBannerNav#next {
    right: 25px;
  }
  .cmeImageBannerSection {
    position: relative;
    display: table;
    height: 100%;
    padding: 0 0 0 12%;
    max-width: 60%;
  }
  .cmeImageBanner.cmeImageBannerSmall .cmeImageBannerSection {
    top: -258px;
  }
  .cmeImageBanner.cmeImageBannerLarge .cmeImageBannerSection {
    top: -358px;
    padding: 0 0 0 8%;
  }
  .cmeImageBannerSection .cmeImageBannerOverlay {
    background-color: #272727;
    opacity: .9;
    width: 70%;
    transform: skew(-25deg, 0);
  }
  .cmeImageBannerSmall .cmeImageBannerSection .cmeImageBannerOverlay {
    left: 104px;
  }
  .cmeImageBannerLarge .cmeImageBannerSection .cmeImageBannerOverlay {
    left: 81px;
  }
  .cmeImageBannerSection .cmeImageBannerOverlayContent {
    width: 70%;
    display: table-cell;
    vertical-align: middle;
    margin: 0;
    padding: 0 0 70px 20px;
  }
}
@media screen and (min-width: 1455px) {
  .cmeImageBannerSmall .cmeImageBannerSection .cmeImageBannerOverlay {
    left: 165px;
  }
  .cmeImageBannerLarge .cmeImageBannerSection .cmeImageBannerOverlay {
    left: 142px;
  }
}
@media screen and (min-width: 1980px) {
  /*.cmeImageBannerSection, .cmeImageBannerSection .cmeImageBannerOverlay {
    max-width: 60%;
  }*/
  .cmeImageBannerSection {
    max-width: 60%;
  }
  .cmeImageBannerLarge .cmeImageBannerSection .cmeImageBannerOverlayContent h3 {
    margin-left: 0;
    max-width: 550px;
  }
}
/* Body content overlapped above banner: */
.cmeSectionRegionLayout.cmePromoBodyContent {
  background: #fff;
  padding: 20px;
}
.cmePineapple .cmeBannerMask {
  display: none;
}
/* Previously injected image banner styles */
.cmePineapple .homeLandingTemplate.cmeHasPineappleImageBanner .addthis-smartlayers-desktop #at4-share,
.cmePineapple .primaryLandingTemplate.cmeHasPineappleImageBanner .addthis-smartlayers-desktop #at4-share {
  top: 458px !important;
}
.cmePineapple .homeLandingTemplate.cmeHasPineappleImageBanner.cmeHasPrimaryNav.cmeHasLegendaryNav .addthis-smartlayers-desktop #at4-share,
.cmePineapple .primaryLandingTemplate.cmeHasPineappleImageBanner.cmeHasPrimaryNav.cmeHasLegendaryNav .addthis-smartlayers-desktop #at4-share {
  top: 450px !important;
}
@media screen and (min-width: 980px) {
  .cmePineapple .homeLandingTemplate.cmeHasPineappleImageBanner .cmePromoContent {
    z-index: 7000;
    position: relative;
  }
  .cmePineapple .homeLandingTemplate.cmeHasPineappleImageBanner .cmePromoBodyContent {
    z-index: 7001;
    position: relative;
    margin-top: -60px;
  }
}
@media (min-width: 981px) {
  .cmeImageBannerSelect {
    top: 25px;
    bottom: initial;
    width: 100%;
    padding: 0;
  }
  .cmeImageBannerSelect > ul {
    left: 550px;
    position: absolute;
  }
  .cmeImageBannerSection .cmeImageBannerOverlay {
    width: 600px;
  }
  .cmeImageBannerSection .cmeImageBannerOverlayContent {
    width: 434px;
    padding: 0px 0 70px 70px;
  }
  .cmeImageBannerSection .cmeImageBannerOverlayContent h3 {
    font-size: 40px;
    line-height: 46px;
    max-width: 750px;
    margin: 0;
    padding: 0 0 0 20px;
  }
  .cmeImageBannerLarge .cmeImageBannerSection .cmeImageBannerOverlayContent h3 {
    padding: 0;
  }
}
@media screen and (max-width: 980px) {
  .cmeImageBannerSelect {
    display: none;
    width: 100%;
    padding: 0px !important;
    margin: 0px !important;
    left: auto;
    right: 5px;
    top: 20px;
  }
}
/* WIDE */
@media screen and (min-width: 1455px) {
  .cmeImageBannerLarge .cmeImageBannerSection .cmeImageBannerOverlay {
    width: 600px;
    margin: 0 auto;
    left: 0;
  }
  .cmeImageBanner.cmeImageBannerLarge .cmeImageBannerSection {
    top: -358px;
    padding: 0 0 0 117px;
    left: -180px;
    margin: 0 auto;
    width: 694px;
    max-width: 694px;
  }
  .cmeImageBannerSection .cmeImageBannerOverlayContent {
    padding: 0 0 70px 70px;
    width: 434px;
    left: -83px;
  }
  .cmeImageBannerSelect {
    position: absolute;
  }
  .cmeImageBannerSelect > ul {
    left: 48%;
    position: relative;
    float: none;
  }
}
/* TABLET */
@media screen and (max-width: 767px) {
  .cmeImageBannerSection .cmeImageBannerOverlayContent h3 {
    font-size: 3vw;
    line-height: 3vw;
  }
}
/* Mobile */
@media screen and (max-width: 480px) {
  .cmeImageBannerSection .cmeImageBannerOverlayContent h3 {
    font-size: 5vw;
    line-height: 5vw;
  }
}
/* Image Banner BG */
.cmePineapple .homeLandingTemplate.cmeHasPineappleImageBanner .cmePromoContent,
.cmePineapple .primaryLandingTemplate.cmeHasPineappleImageBanner .cmePromoContent {
  background: #939598 url(../../../../content/dam/cmegroup/images/common/loaders/banner-loader.gif) no-repeat 50% 30%;
}
