.article.widget-basic-banner[data-banner-type="1"] {
  margin-left: 50%;
  width: 100vw;
  transform: translate3d(-50%, 0, 0);
}
.article.widget-basic-banner.fixed-height .wrap > .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.article.widget-basic-banner.done-loading .wrap > :is(.image, .play-button, .text-wrap) {
  opacity: 1;
  z-index: 1;
  transition: opacity 0.5s ease-in-out;
}
.article.widget-basic-banner.auto-height .wrap {
  float: left;
  width: 100%;
}
.article.widget-basic-banner.auto-height .wrap .image {
  position: relative;
  inset: auto;
}
.article.widget-basic-banner.auto-height .wrap .image img {
  display: block;
}
.article.widget-basic-banner.auto-height .wrap .text-wrap {
  position: absolute;
  inset: 0;
}
.article.widget-basic-banner > .margin > .padding {
  padding: 0;
}
.article.widget-basic-banner .wrap {
  position: relative;
}
.article.widget-basic-banner .wrap[data-fullscreen="1"] {
  height: 100vh;
}
.article.widget-basic-banner .wrap .image {
  position: absolute;
  inset: 0;
  opacity: 0;
  z-index: -1;
}
.article.widget-basic-banner .text-wrap {
  max-width: 1500px;
  margin: 0 auto;
  position: relative;
  opacity: 0;
  z-index: -1;
  overflow: hidden;
}
.article.widget-basic-banner .text-wrap.auto {
  height: 100%;
}
.article.widget-basic-banner .text-wrap.auto .overlay-text {
  display: table;
  height: 100%;
  left: 0;
}
.article.widget-basic-banner .text-wrap.auto .overlay-text > div {
  vertical-align: top;
  display: table-cell;
  position: relative;
  max-width: 100%;
}
.article.widget-basic-banner .text-wrap.tl {
  height: 100%;
}
.article.widget-basic-banner .text-wrap.tl .overlay-text {
  display: table;
  height: 100%;
  left: 0;
}
.article.widget-basic-banner .text-wrap.tl .overlay-text > div {
  vertical-align: top;
  display: table-cell;
  position: relative;
  max-width: 750px;
}
.article.widget-basic-banner .text-wrap.tc {
  height: 100%;
}
.article.widget-basic-banner .text-wrap.tc .overlay-text {
  display: table;
  height: 100%;
  margin: 0 auto;
  position: relative;
}
.article.widget-basic-banner .text-wrap.tc .overlay-text > div {
  vertical-align: top;
  display: table-cell;
  max-width: 750px;
}
.article.widget-basic-banner .text-wrap.tr {
  height: 100%;
}
.article.widget-basic-banner .text-wrap.tr .overlay-text {
  display: table;
  height: 100%;
  right: 0;
}
.article.widget-basic-banner .text-wrap.tr .overlay-text > div {
  vertical-align: top;
  display: table-cell;
  position: relative;
  max-width: 750px;
}
.article.widget-basic-banner .text-wrap.ml {
  height: 100%;
}
.article.widget-basic-banner .text-wrap.ml .overlay-text {
  display: table;
  height: 100%;
  left: 0;
}
.article.widget-basic-banner .text-wrap.ml .overlay-text > div {
  vertical-align: middle;
  display: table-cell;
  position: relative;
  max-width: 750px;
}
.article.widget-basic-banner .text-wrap.mc {
  height: 100%;
}
.article.widget-basic-banner .text-wrap.mc .overlay-text {
  display: table;
  height: 100%;
  margin: 0 auto;
  position: relative;
}
.article.widget-basic-banner .text-wrap.mc .overlay-text div {
  vertical-align: middle;
  display: table-cell;
  max-width: 750px;
  overflow: hidden;
  max-height: 100%;
}
.article.widget-basic-banner .text-wrap.mr {
  height: 100%;
}
.article.widget-basic-banner .text-wrap.mr .overlay-text {
  display: table;
  height: 100%;
  right: 0;
}
.article.widget-basic-banner .text-wrap.mr .overlay-text div {
  vertical-align: middle;
  display: table-cell;
  position: relative;
  max-width: 750px;
}
.article.widget-basic-banner .text-wrap.bl {
  height: 100%;
}
.article.widget-basic-banner .text-wrap.bl .overlay-text {
  display: table;
  height: 100%;
  left: 0;
}
.article.widget-basic-banner .text-wrap.bl .overlay-text > div {
  vertical-align: bottom;
  display: table-cell;
  position: relative;
  max-width: 750px;
}
.article.widget-basic-banner .text-wrap.bc {
  height: 100%;
}
.article.widget-basic-banner .text-wrap.bc .overlay-text {
  display: table;
  height: 100%;
  margin: 0 auto;
  position: relative;
}
.article.widget-basic-banner .text-wrap.bc .overlay-text div {
  vertical-align: bottom;
  display: table-cell;
  max-width: 750px;
}
.article.widget-basic-banner .text-wrap.br {
  height: 100%;
}
.article.widget-basic-banner .text-wrap.br .overlay-text {
  display: table;
  height: 100%;
  right: 0;
}
.article.widget-basic-banner .text-wrap.br .overlay-text > div {
  vertical-align: bottom;
  display: table-cell;
  position: relative;
  max-width: 750px;
}
.article.widget-basic-banner .text-wrap .overlay-text {
  position: absolute;
  z-index: 2;
  padding: 20px;
  height: 100%;
}
.article.widget-basic-banner .close-button {
  position: absolute;
  right: 20px;
  top: 20px;
  z-index: -1;
  opacity: 0;
  transition: opacity var(--shortTransition);
}
.article.widget-basic-banner .close-button > i {
  color: var(--defaultWhite);
  font-size: 30px;
  cursor: pointer;
}
.article.widget-basic-banner .play-button {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  text-align: center;
  display: table;
  opacity: 0;
  z-index: -1;
}
.article.widget-basic-banner .play-button div {
  vertical-align: middle;
  display: table-cell;
}
.article.widget-basic-banner .play-button div > i {
  font-size: 60px;
  height: 40px;
  width: 40px;
  color: var(--defaultWhite);
  border-radius: 50%;
  cursor: pointer;
  opacity: 0.9;
  margin-left: -20px;
  transition: opacity var(--shortTransition);
}
.article.widget-basic-banner .play-button div > i:hover {
  opacity: 1;
}
.article.widget-basic-banner .video-embed {
  display: none;
  opacity: 0;
  position: absolute;
  inset: 0;
  z-index: 5;
  overflow: hidden;
}
.article.widget-basic-banner .video-embed[data-background="1"] .cover {
  display: block;
}
.article.widget-basic-banner .video-embed[data-background="1"][data-auto-play="1"] ~ .close-button {
  display: none;
}
.article.widget-basic-banner .video-embed.active {
  display: block;
  opacity: 1;
}
.article.widget-basic-banner .video-embed.active ~ .close-button {
  opacity: 1;
  z-index: 6;
}
.article.widget-basic-banner .video-embed iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.article.widget-basic-banner .video-embed .cover {
  display: none;
  position: absolute;
  inset: 0;
}

/* Grade A */
/* Grade B */
/* Grade C */
@media (max-width: 767px) {
  .article.widget-basic-banner .close-button {
    right: 0px;
    top: 0px;
  }
  .article.widget-basic-banner .close-button > i {
    padding: 20px;
  }
}
/* Grade D */

/*# sourceMappingURL=basicBanner.css.map */