

.news-container {
  position: bottom;
  top: 0;
  right: 0;
  left: 0;
  font-size: 16px;
  background: #003262;
  color: #73c2fb;
  padding: 10px 32px;
  display: flex;
  box-shadow: 0 4px 40px -8px rgb(0, 51, 98);
  overflow: hidden;
  margin-bottom: 4px;
}

.news-container::after {
  position: bottom;
  content: "";
  bottom: 0;
  left: 0;
  right: 0;
  height: 10px;
  background: linear-gradient(transparent, #003262);
}

.news-container .news-heading {
  font-weight: bold;
  padding-right: 20px;
  margin-right: 20px;
  border-right: 1px solid #fff;
}

.news-container .news {
  position: relative;
  width: 100%;
}

.news-container .news-single {
  color: #fff;
  text-decoration: none;
  font-weight: normal;
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  transform: translateY(-8px);
  transition: all 400ms ease;
  pointer-events: none;
}

.news-container .news-single.active {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

