.image-text-fade-row {
  position: relative; }
  .image-text-fade-row:not(.has-image) {
    padding: 40px 0; }
  .image-text-fade-row.has-image {
    align-items: center;
    display: flex;
    min-height: 37vw;
    max-height: 535px;
    background: var(--wp--preset--color--dark-gray);
    overflow: hidden;
    width: calc( 100vw - var(--scrollbar));
    color: #fff; }
    #content > .image-text-fade-row.has-image {
      margin: 0; }
    .image-text-fade-row.has-image:before {
      content: '';
      margin-right: -1px;
      position: absolute;
      top: 0;
      right: 50%;
      width: 300px;
      height: 100%;
      display: none; }
    .image-text-fade-row.has-image .text-container > *:first-child {
      margin-top: 0; }
    .image-text-fade-row.has-image h1 + h3, .image-text-fade-row.has-image h2 + h3 {
      margin-top: 0.5em; }
    .image-text-fade-row.has-image .btn {
      background: var(--wp--preset--color--green);
      color: #fff !important; }
      .image-text-fade-row.has-image .btn:hover, .image-text-fade-row.has-image .btn:focus {
        background: var(--wp--preset--color--dark-green);
        border-color: var(--wp--preset--color--dark-green); }
    .image-text-fade-row.has-image > .container {
      display: flex;
      position: relative;
      z-index: 1;
      height: 100%;
      width: 100%;
      padding-top: 80px;
      padding-bottom: 80px; }
      .image-text-fade-row.has-image > .container .text-container {
        width: 100%;
        max-width: 800px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        height: 100%;
        text-align: left;
        padding-right: 40px;
        padding-left: 0px;
        position: relative;
        z-index: 1; }
      .image-text-fade-row.has-image > .container .background-video-container {
        height: 0;
        padding-bottom: 56%;
        box-shadow: 0px 0px 46px #0D1420; }
    .image-text-fade-row.has-image .background-image {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      right: 0;
      z-index: 0; }
      .image-text-fade-row.has-image .background-image > img,
      .image-text-fade-row.has-image .background-image > picture {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center center; }
      .image-text-fade-row.has-image .background-image .background-video-container {
        height: 100%;
        width: 100%; }
    .image-text-fade-row.has-image.has-fade > .container:before {
      content: '';
      position: absolute;
      top: -100%;
      bottom: 0;
      margin-left: -50vw;
      width: 50vw;
      background: var(--wp--preset--color--black);
      height: 300%;
      opacity: .8; }
    .image-text-fade-row.has-image.has-fade > .container:after {
      content: '';
      margin-left: 0px;
      position: absolute;
      top: -100%;
      height: 300%;
      width: 60%;
      background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
      background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
      background: -o-linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
      background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%); }
    @media (max-width: 1400px) {
      .image-text-fade-row.has-image > .container {
        padding-top: 50px;
        padding-bottom: 50px; }
      .image-text-fade-row.has-image h1.is-style-big,
      .image-text-fade-row.has-image h2.is-style-big {
        font-size: 8vw; }
      .image-text-fade-row.has-image h3 {
        font-size: 3.2vw; } }
    @media (max-width: 991px) {
      .image-text-fade-row.has-image {
        height: auto;
        max-height: none; } }
    @media (max-width: 767px) {
      .image-text-fade-row.has-image {
        height: auto;
        max-height: none; }
        .image-text-fade-row.has-image > .container {
          flex-wrap: wrap;
          padding-top: 45px;
          padding-bottom: 45px; }
          .image-text-fade-row.has-image > .container .text-container {
            width: 600px;
            max-width: 100%;
            padding-right: 0; }
        .image-text-fade-row.has-image .button-group {
          margin-top: 20px; }
        .image-text-fade-row.has-image.has-fade > .container:after {
          width: 80%; } }
