.hero-section {
  background-image: url("../images/news/news-background.png");
  background-repeat: no-repeat;
  background-size: cover;
  height: 231px;
}

.hero-section .container {
  max-width: 950px;
}

.news-card {
  width: 220px;
  flex-shrink: 0;
}

@media only screen and (min-width: 768px) {
  .hero-section {
    height: 341px;
  }

  /* For notice highlight card */
  .notice-highlight-card {
    width: 490px;
    flex-shrink: 0;
  }
}

@media only screen and (min-width: 1024px) {
  .hero-section {
    height: 538px;
  }
  /* For The Latest News Card */
  .news-card img:not(.news-view-all img) {
    height: 200px;
  }
}