.homeviews-with-banner {
  background: #f1f1f1;
}

.m-container {
  max-width: 768px;
  margin-right: auto;
  margin-left: auto;
  padding-right: 15px;
  padding-left: 15px;

  h2.widget-title {
    font-family: "ITC Avant Garde Gothic W05 Bol", helvetica, arial, sans-serif;
    font-size: 21px;
    line-height: 28px;
  }

  .homeview-widget--wrapper {
    height: auto;

    .homeview-widget--frame {
      width: 100%;
      height: 100%;
      margin: 0 1rem 1rem 1rem;

      .homeviews-widget {
        margin: 0;
        width: 100% !important;
        height: 100% !important;
        max-width: unset;
        overflow: hidden;
      }
    }

    .homeview-widget--banner {
      height: 100%;
      width: 100%;
      margin: 1rem;
      overflow: hidden;

      .banner-container {
        position: relative;
        overflow: hidden;

        .banner-image-wrapper {
          position: relative;

          img {
            width: auto;
            height: 100%;
          }


          .img-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: #000;
            opacity: .3;
          }
        }

        .banner-content-wrapper {
          position: absolute;
          color: #fff;
          top: 50%;
          left: 50%;
          -webkit-transform: translate(-50%,-50%);
          -ms-transform: translate(-50%,-50%);
          transform: translate(-50%,-50%);
          font-size: 45px;
          line-height: 45px;
          letter-spacing: -.42px;
          width: 75%;

          .banner-logo-wrapper {
            img {
              width: 100%;
            }
          }

          h2 {
            font-family: "ITC Avant Garde Gothic W05 Bol", helvetica, arial, sans-serif;
            font-size: 22px;
            line-height: 28px;
            margin-bottom: 25px;
          }
        }
      }
    }
  }
}
@media (min-width: 768px) {
  .m-container {
    max-width: 768px;

    .homeview-widget--wrapper {
      height: 482px;

      .homeview-widget--frame {
        width: 40%;
        top: 0;
        position: absolute;
        margin: 0;
      }

      .homeview-widget--banner {
        width: 60%;
        margin: 0 0 0 40%;
        flex: 1;
        padding-left: 10px;

        .banner-container {
          height: 100%;

          .banner-image-wrapper {
            height: 100%;
          }
        }
      }
    }
  }
}


@media (min-width:992px) {
  .m-container {
    max-width: 960px;

    h2.widget-title {
      font-size: 30px;
      line-height: 30px;
      letter-spacing: -.4px;
    }

    .homeview-widget--wrapper {
      height: 485px;

      .homeview-widget--frame {
        width: 30%;
      }

      .homeview-widget--banner {
        width: 70%;
        margin-left: 30%;
        padding-left: 10px;

        .banner-container {
          height: 100%;
          .banner-image-wrapper {
            height: 100%;
          }

          .banner-content-wrapper {
            width: 550px;

            h2 {
              font-size: 30px;
              line-height: 30px;
              letter-spacing: -.4px;
            }


            .banner-logo-wrapper {
              img {
                width: auto
              }
            }
          }
        }
      }

    }


  }
}

@media (min-width:1200px) {
  .m-container {
    max-width: 1280px;

    .homeview-widget--wrapper {
      height: 445px;

      .homeview-widget--banner {
        .banner-container {

          .banner-content-wrapper {
            .banner-logo-wrapper {
              img {
                width: auto
              }
            }
          }
        }
      }
    }
  }
}