.news-banner{
    position:relative;
    width: 100%;
    aspect-ratio: 16 / 9;
  }
  .news-box{
    background-size: cover ;background-position: 50% 50%; background-repeat: no-repeat; 
    border:2px solid rgb(75, 75, 75);
  }
  .news-shadow {
      border-bottom-left-radius: 12px;
      border-bottom-right-radius: 12px;
      height:350px;
      position:absolute;  
      width:100%;    
      bottom:0px;
      background: rgb(0,0,0);
      background: -moz-linear-gradient(0deg, rgba(0,0,0,0.9360119047619048) 3%, rgba(0,0,0,0) 100%);
      background: -webkit-linear-gradient(0deg, rgba(0,0,0,0.9360119047619048) 3%, rgba(0,0,0,0) 100%);
      background: linear-gradient(0deg, rgba(0,0,0,0.8360119047619048) 3%, rgba(0,0,0,0) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1); 
   }
  
  .news-text {
    padding:20px;
    z-index:100;
    text-align: left;
    position: absolute;
    bottom: 0px;
  }
  .news-date {
    margin: 0px;
    font-size:14px;
    font-weight:400;
    color: rgba(255,255,255,0.8);
  }
  .news-title {
    padding:0px 0px;
    font-size:24px;
    font-weight: bold;
    color: white;
  }
  .news-desc {
    color: rgba(255,255,255,0.8);
    font-size:14px;
  }
  .show-more{
    font-size:14px;
  }
  .img-more{
    width: 38px;
  }

  .news-detail-source {
    margin: 10px 0px;
  }

  .news-detail-date {
    margin: 10px 0px;
    font-size:14px;
    font-weight:400;
  }
  .news-detail-title {
    padding:0px 0px;
    font-size:28px;
    font-weight: bold;
  }

  .news-detail-desc {
    font-weight: 400;
    padding-right: 15px;
  }

  .news-detail-source {
    font-weight: 400;
    padding-top: 20px;
  }


  .news-related {
    margin: 0px;
    font-size:18px;
    font-weight:bold;
    padding-bottom:15px;
    margin-bottom:25px;
    border-bottom:1px solid rgba(255,255,255,0.1)
  }
  
  .news-related-title {
    padding:0px 0px;
    font-size:14px;
    font-weight: bold;
  }
  .news-related-date {
    font-size:12px;
    font-weight: 400;
  }

   @media only screen and (max-width: 768px) {
 
    .news-banner{
      height: 50vh;position:relative;
      width: 100%;
    }
    .news-text {
      padding:0px 10px 0px 10px;
      z-index:100;
      right:0%;
      bottom:10px;
    }
    .news-date {
      font-size:12px;
    }
    .news-title {
      font-size:16px;
    }
    .news-desc {
      font-size:14px;
    }
    .show-more{
      margin-bottom:5px;
    }
    .img-more{
      width: 20px;
      margin-bottom:5px;
    }
    
  }