@media (min-width: 768px) {
  .top-banner-component {
    padding-bottom: 45%;
  }
  .top-banner-component .top-banner-image {
    height: auto;
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  .top-banner-component > div.tw-container {
    top: 45%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
}
@media (min-width: 1920px) {
  .top-banner-component {
    height: 860px;
    padding-bottom: 0;
    background: #d6f1f9;
  }
}
@media (min-width: 2000px) {
  .top-banner-component {
    height: auto;
    padding-bottom: 45%;
    background: #d6f1f9;
  }
}
.top-banner-component .banner-overlay {
  width: 100%;
  height: 100%;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
  .top-banner-component .banner-overlay {
    background: -webkit-gradient(linear, left bottom, left top, color-stop(26.46%, rgba(50, 182, 185, 0.8)), color-stop(54.4%, rgba(214, 241, 249, 0)));
    background: linear-gradient(0deg, rgba(50, 182, 185, 0.8) 26.46%, rgba(214, 241, 249, 0) 54.4%);
  }
}
@media (max-width: 1024px) {
  .top-banner-component .banner-title {
    font-size: 40px !important;
  }
}
@media (max-width: 767px) {
  .top-banner-component .top-banner-image {
    max-width: none;
    width: 100%;
    height: auto;
  }
  .top-banner-component > div.tw-container {
    bottom: 20px;
  }
}