body { font-family: Arial, sans-serif; background: #fff; color: #111; }
    header { padding: 10px 0; }
    .sub_btn { border-radius: 0; font-size: 13px;
  padding: 8px 16px;
  font-weight: bold;
  color: #fff;background-color: #FF7300 !important;
  border: 1px solid #FF7300 !important; }
    .hr_new_top hr {
      margin: 46px 0px 0px 0px; border: 0; border-top: 2px solid #000;
    }
    .hr_new hr{ margin: 2px 0; border: 0; border-top: 2px solid #000;opacity: 1}
    .logo img { height: 60px; }
    .top-bar { font-size: 14px; color: #555; margin-top: 5px; }
    nav a { font-weight: 500; color: #111 !important; margin-right: 20px; }
    nav a.active { color: #FF7300 !important; }
    .live-update-badge {
      background: #FF7300; color: #fff; font-size: 12px;
      padding: 2px 8px; border-radius: 4px; margin-bottom: 10px; display: inline-block;
    }
    .article-card img { width: 100px; height: 100px; object-fit: cover; border-radius: 4px; }
    .article-card h6 { font-size: 14px; margin: 0; }
    .article-card small { font-size: 12px; color: #FF7300; }
    .featured img { width: 100%; border-radius: 5px; }
    .featured .meta { font-size: 13px; color: #888; }
    footer { padding: 20px; border-top: 1px solid #ddd; font-size: 14px; text-align: center; color: #555; }
    
    /* remove borders + hover bg on icons */
    .icon-btn {
      border: none !important;
      background: none !important;
      box-shadow: none !important;
    }
    .icon-btn:hover {
      background: none !important;
      color: red !important;
    }

    .date-time {
      font-size: 13px;
      color: #666;
      text-align: right;
    }
    .read-article {
  display: inline-block;
  margin-top: 5px;
  font-weight: 500;
  color: #000;
  text-decoration: none;
  font-size: 15px;
}

.read-article:hover {
  color: red;
}

.read-article .arrow-circle {
  margin-left: 6px;
  border: 1px solid #FF7300;
  border-radius: 50%;
  padding: 4px;
  font-size: 12px;
  transition: 0.3s;
  background-color: #FF7300;
  color: #fff;
}

.read-article:hover .arrow-circle {
  border-color: red;
  color: red;
}
.card {border: none;}
    .news-left .live {
      color: red;
      font-weight: bold;
    }
    .news-left h5 {
      font-weight: 600;
    }
    .see-updates {
      color: #000;
      font-weight: bold;
      text-decoration: none;
    }
    .see-updates:hover {
      text-decoration: underline;
    }
    .right-card img {
      width: 100%;
      height: auto;
      object-fit: cover;
    }
    .tabs-section .nav-link {
      font-weight: 600;
      color: #000;
    }
    .tabs-section .nav-link.active {
      background: #eee;
      border-radius: 5px;
    }
    .tab-content .card {
      border: none;
      text-align: center;
    }
    .tab-content img {
      border-radius: 6px;
      width: 100%;
      height: 160px;
      object-fit: cover;
    }
    .tab-content h6 {
      margin-top: 10px;
      font-size: 14px;
    }
    .scroll-cards {
      display: flex;
      gap: 20px;
      overflow-x: auto;
      padding-bottom: 10px;
    }
    .scroll-cards::-webkit-scrollbar {
      display: none;
    }
.carousel-indicators button {
  background-color: grey !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50%;
  border: none;
  margin: 0 4px;
}

.carousel-indicators .active {
  background-color: black;    /* active dot */
}
.b_left{border-left: 1px solid #dfdcdc;}
.op_omg{width: 80px;
  border-radius: 48px;}
.op_info span{color: #FF7300;
  font-size: 13px;}
  .op_info h5{
  font-size: 18px;}
/* gallery */
  .gallery-wrap{max-width:960px;margin:20px auto;padding:10px;}
    .gallery{display:grid;grid-template-columns:1fr 140px;gap:14px;}
    .main-card{border-radius:14px;overflow:hidden;position:relative;}
    .main-card .owl-item img{width:100%;height:420px;object-fit:cover;}
    .thumbs{display:flex;flex-direction:column;gap:12px;}
    .thumb{border-radius:12px;overflow:hidden;cursor:pointer;position:relative;height:130px;}
    .thumb img{width:100%;height:100%;object-fit:cover;}
    .thumb .overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,0.5);color:#fff;font-size:20px;font-weight:700;}
    @media(max-width:768px){
      .gallery{grid-template-columns:1fr;}
      .thumbs{flex-direction:row;overflow-x:auto;}
      .thumb{height:90px;width:120px;}
      .main-card .owl-item img{height:260px;}
    }
    .owl-nav{display: none;}
.opinion_sec span{color:#FF7300;
  font-size: 13px;}
  .opinion_sec h5{
  font-weight: 600;}
  .opinion_sec p{color: #333;margin-bottom: 0px;}
  .opinion_img{width: 120px;
  border-radius: 20px;
  height: 120px;}
  /* responsive */
        @media screen and (max-width:1400px) {
.offcanvas-body ul li{border-bottom: 1px solid #3336;}

        }
        @media screen and (min-width:1200px) and   (max-width:1399.98px) {
   .offcanvas-body ul li{border-bottom: 1px solid #3336;}

        }
        @media screen and (min-width:992px) and   (max-width:1199.98px) {
.offcanvas-body ul li{border-bottom: 1px solid #3336;}

        }
        @media screen  and (min-width:768px) and (max-width:991.98px) {
.offcanvas-body ul li{border-bottom: 1px solid #3336;}
.h3_text{font-size: 22px;}
.carousel {margin-top: 18px;}
.slide_btn{justify-content: center !important;
  align-items: center;}
  .right-card{margin-top: 18px;}
  .b_left {
  border-left: none;
}

        }
        @media screen and (min-width:576px) and (max-width:767.98px) {
    .sub_btn {
  padding: 4px 10px;margin-bottom: 6px
}
.h3_text{font-size: 15px;}
.read-article {
  font-size: 12px;
}
.carousel {margin-top: 18px;}
.slide_btn{justify-content: center !important;
  align-items: center;}
  .card {margin-top: 18px;}
  .tabs-section .nav-link {
  font-weight: 600;
  color: #000;
  padding: 8px 12px 8px 12px;
}
.scroll-cards {
  display: block;
  gap: 0px;
}
.b_left {
  border-left: none;
}


.opinion_img {
  width: 80px;
  height: 80px;
}
.navbar {display: none;}
.toggle_side{padding-right: 0;}
.logo img {
  height: 100%;
  width: 100%;
}
.offcanvas-body ul li{border-bottom: 1px solid #3336;}
.hr_new_top{display: none;}
.circle_imgg{display: flex;
  justify-content: end;}
        }
        @media screen  and (min-width:381px) and (max-width:575.98px){
    .sub_btn {
  padding: 4px 10px;margin-bottom: 6px
}
.h3_text{font-size: 15px;}
.read-article {
  font-size: 12px;
}
.carousel {margin-top: 18px;}
.slide_btn{justify-content: center !important;
  align-items: center;}
  .card {margin-top: 18px;}
  .tabs-section .nav-link {
  font-weight: 600;
  color: #000;
  padding: 8px 8px 8px 8px;
}
.scroll-cards {
  display: block;
  gap: 0px;
}
.b_left {
  border-left: none;
}


.opinion_img {
  width: 80px;
  height: 80px;
}
.navbar {display: none;}
.toggle_side{padding-right: 0;}
.logo img {
  height: 100%;
  width: 100%;
}
.offcanvas-body ul li{border-bottom: 1px solid #3336;}
.hr_new_top{display: none;}
        }
        @media screen and (min-width:320px) and (max-width:380.98px) {
 .sub_btn {
  padding: 4px 10px;margin-bottom: 6px
}
.h3_text{font-size: 18px;}
.read-article {
  font-size: 14px;
}
.carousel {margin-top: 18px;}
.slide_btn{justify-content: center !important;
  align-items: center;}
  .card {margin-top: 18px;}
  .tabs-section .nav-link {
  font-weight: 600;
  color: #000;
  font-size: 12px;
  padding: 8px 8px 8px 8px;
}
.scroll-cards {
  display: block;
  gap: 0px;
}
.b_left {
  border-left: none;
}
.opinion_sec h5 {
  font-size: 16px;
}
.opinion_sec p {
  font-size: 13px;
}
.opinion_img {
  width: 80px;
  height: 80px;
}
.navbar {display: none;}
.toggle_side{padding-right: 0;}
.logo img {
  height: 100%;
  width: 100%;
}
.offcanvas-body ul li{border-bottom: 1px solid #3336;}
.hr_new_top{display: none;}
.list-unstyled{text-align: start;}
.f_links{text-align: start;}
.adrs{text-align: start;}
.weather_side{margin-left: -30px;}
.weather-box span {
  font-size: 12px !important;
}
.hot-news-slider .slick-list {
  margin: 0 0px !important;
}
.logo img{width: 60px;}
.offcanvas {
  width: 320px !important;
}
.top-bar {
  font-size: 12px;
}
body {
  padding-top: 100px;
}
        }