body {
    overflow-x: hidden;
    margin: 0;
    font-family: 'SolaimanLipi', Arial, sans-serif;
    font-size: 22px;
    font-weight: 400;
    line-height: 25px;
    color: #333;
    background-color: #fff;
    text-align: justify;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

@font-face {
  font-family: 'SolaimanLipi';
    src: url('/fonts/solaimanlipi.woff2') format('woff2'),
     url('/fonts/solaimanlipi.woff') format('woff'),
     url('/fonts/solaimanlipi.ttf') format('truetype');
  font-display: swap;
}

.scroll-news {
    overflow: hidden;
    white-space: nowrap;
}

/* --- যো করা হয়েছে: Flexbox Utility Classes --- */
.d-flex { display: flex !important; }
.flex-column { flex-direction: column !important; }
.flex-fill { flex: 1 1 auto !important; }
.align-items-stretch { align-items: stretch !important; }
.mt-auto { margin-top: auto !important; }
.mb-0 { margin-bottom: 0 !important; }
.w-100 { width: 100% !important; }
.h-100 { height: 100% !important; }
.order-1 { order: 1 !important; }
.order-2 { order: 2 !important; }
.order-3 { order: 3 !important; }
.row {
    display: flex;
    flex-wrap: wrap;
}
/* --- যোগ কা ষ --- */


.marquee-content {
    display: inline-block;
    animation: scroll 30s linear infinite; /* Adjust duration for slower scrolling */
}

@keyframes scroll {
    0% { transform: translateX(100%); }
    100% { transform: translateX(-100%); }
}

.logo {
    width: 240px;
    height: 100px;
    display: block;
    margin: 0 auto;
    object-fit: contain; /* েজ    ব */
}
.container h3 {
    font-size: 22px; /* Adjust as needed */
    line-height: 29px; /* Optional for spacing */
}

.custom-lg-only {
    display: none;
}

#login .form-select option {
    color: #000000 !important; /* Force black text color for options */
    background-color: #ffffff !important; /* Force white background for options */
}

/* Ensure the selected value inside the select box is also visible */
#login .form-select {
     color: #212529 !important; /* Force dark text color for the selected value */
     background-color: #ffffff !important; /* Force white background for the select box itself */
}
/* Footer start */
.footer-name {
    margin-bottom: 5px; 
    }
    footer {
        color: white;
    }
    footer a {
        text-decoration: none;
        color: #fff !important;
    }

    .footer-heading {
        border-bottom: 1px solid rgba(255, 255, 255, 0.2); 
        padding-bottom: 0.5rem; 
        color: #ef7ea6; 
    }
.footer-policy-content p,
.footer-policy-content div,
.footer-policy-content br { 
    margin-bottom: 0.5rem; 
    display: block;
}
    footer .d-flex.justify-content-md-end {
        gap: 1rem;
    }
    .social-icon-link {
          opacity: 1;
          transition: opacity 0.3s ease-in-out;
      }
    .social-icon-link:hover {
          opacity: 0.75; 
      }

   footer a.text-warning {
            color: var(--bs-warning) !important;
        }
/* Footer end */
@media (min-width: 992px) {
    .custom-lg-only {
        display: block;
    }
}
.menu-body {
background-color:#000000;
}
.menu-nav-bg {
background-color:#6e1341;
}
.menu-bg {
background-color:#d50000;
}
.menu-font {
font-size:22px;
}
.nav-link {
    color: #FFF !important;
    font-weight: normal !important;
}

.nav-link:hover {
    color: #cc0000 !important; /*    দ */
}
.navbar-brand {
	color: #FFF !important;
    font-size: 22px !important;
    font-weight: bold;
    padding-top: 7px !important;
}
a.custom-black-link {
    color: #000 !important;
    text-decoration: none !important;
}

.site-search .search-btn
 {
    background: url(../images/search-n.png) no-repeat scroll 1px center #ebe5e5;
    border: 1px solid #837474 !important;
    color: #000000;
    cursor: pointer;
    padding: 1px 10px 2px 26px;
}
/* two category news start */
.equal-height-row {
    display: flex !important;
    flex-wrap: wrap !important;
}

.equal-height-col {
    display: flex;
    flex-direction: column;
}

.equal-height-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.cat-two-headline {
color:#fff;
}
/* amader kotha start */
  .responsive-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
  }

  .responsive-box {
    flex: 1 1 calc(33.33% - 1rem); /* ৩টি ক ে্সট */
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background-color: #f8f9fa;
    padding: 1rem;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
  }

  .responsive-box strong {
    display: block;
    width: 100%;
    padding: 0.5rem;
    background-color: #e9ecef;
    border-bottom: 3px solid #007bff;
    font-weight: bold;
    font-size: 1rem;
    margin-bottom: 1rem;
    text-align: center;
  }
 .responsive-box strong {
   font-size: 26px; /*  ছল 1rem */
  }
 .responsive-box p {
  margin: 0.25rem 0;
  font-size: 22px; /* ে ছ 0.95rem */
  }

  @media (max-width: 991.98px) {
    .responsive-box {
      flex: 1 1 100%; /* ো ১ কলম ে */
    }
  }
/* amader kotha end */
/* two category news end */
.dropdown-menu.show {
    display: block !important;
}

  .reporter-photo {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	object-fit: cover;
}
  .news-details-scroll {
    max-height: 400px; /*  মত হট ন */
    overflow-y: auto;
    padding-right: 10px; /* ্ থকল ্প তে রে */
}
/*  সশ  */
.scrolling-menu {
        display: flex;
        overflow-x: auto;
        white-space: nowrap;
        scrollbar-width: none; /* Firefox */
        -ms-overflow-style: none;  /* IE 10+ */
        flex: 1;
        padding: 8px 0;
    }

    .scrolling-menu::-webkit-scrollbar {
        display: none; /* Chrome, Safari */
    }

    .scrolling-menu a {
        flex-shrink: 0;
        margin: 0 5px;
        padding: 0px 9px;
        text-decoration: none;
        color: #f8f9fa;
        font-size: 19px;
        line-height: 19px;
    }

    .scrolling-menu a:hover {
        background-color: #e2e6ea;
    }
    .scrolling-menu a.active {

        color: #000;
        font-weight: bold;

    }


    @media (min-width: 992px) {
        .scrolling-menu {
            display: none;
        }
        .mb-topn {
    		margin-bottom: 16px;
      }
      
    }

.article-details p img {
    max-width: 100% !important; 
    height: auto !important;   
    display: block; 
    margin-left: auto; 
    margin-right: auto; 
}

.article-details p img {
    margin-top: 15px;
    margin-bottom: 15px;
}

/*  <table>   border="1", cellpadding="1"   য */

table[border="1"] {
  width: 100% !important;
  border-collapse: collapse !important;
  border: 1px solid #dee2e6 !important;
  margin-bottom: 1rem !important;
  color: #212529 !important;
  font-size: 0.95rem !important;
}

table[border="1"] th,
table[border="1"] td {
  border: 1px solid #dee2e6 !important;
  padding: 0.5rem !important;
  text-align: center !important;
  vertical-align: middle !important;
  font-size: 20px !important;
}

table[border="1"] thead {
  background-color: #f8f9fa !important;
  font-weight: bold !important;
}

table[border="1"] tr:nth-child(even) {
  background-color: #f2f2f2 !important;
}

table[border="1"] {
  overflow-x: auto !important;
  white-space: nowrap !important;
}

@media (max-width: 576px) {
    .carousel-caption {
        bottom: 0px; /* Bring the caption closer to the bottom on small screens */
        font-size: 12px;
    }

    .carousel-caption h3 {
        font-size: 18px; /* Adjust headline for extra small screens */
        line-height: 22px;
    }

    .carousel-caption p {
        font-size: 12px; /* Adjust intro text for extra small screens */
    }
}
@media (max-width: 576px) {
    .hide-on-small-screen {
        display: none;
    }
}

/* Custom styles for carousel slider caption */
.article-details h1 {
    font-size: 28px;
    font-weight: bold;
    line-height: 34px;
    text-align: left;
}
#news-detials {
    text-align: justify;
}
.dask-name {
    font-size: 16px;
    text-align: left;
}
.news-details {
    text-align:justify;
}

/* news tag */
.news-tags-container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px; 
    margin-bottom: 20px; 
}
.tags-label {
    font-weight: bold;
}
.tag-link {
    display: inline-block;
    background-color: #e1dede;
    color: #150101;
    padding: 5px 10px;
    border-radius: 4px;
    text-decoration: none;
    font-size: 22px;
    transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
}
.tag-link:hover {
    background-color: #555555;
    color: #ffffff;
}
/* Add this to your external CSS file */
.fixed-image {
    width: 100px;
    height: 75px;
    object-fit: cover;
}
.underliner a {
    text-decoration: none;
    font-weight: bold;
    font-size: 23px;
    color: #212529;
}

.underliner a:hover {
    text-decoration: underline; /* Optional: add underline on hover */
}
/* Adjust icon size */
.news-link i {
    font-size: 1.2rem; /* Adjust icon size */
}

/* Responsive adjustments for smaller screens */
@media (max-width: 576px) {
    .section-title {
        font-size: 1.3rem; /* Slightly smaller title on small screens */
    }
    .news-link {
        font-size: 1rem; /* Adjust font size for smaller screens */
    }
}

/* Custom CSS for dropdown items */
.dropdown-menu {
    width: auto; /* Adjust to content */
    max-width: 300px; /* Set a max width */
    left: 0; /* Align dropdown to the left */
    right: auto; /* Prevent it from aligning to the right */
    white-space: nowrap; /* Prevent wrapping */
}

.dropdown-item {
    display: flex; /* Use flexbox for alignment */
    align-items: center; /* Center align items vertically */
}

.title-wrapper {
    display: inline-block; /* Keep wrapper inline */
    overflow: hidden; /* Hide overflow */
    text-overflow: ellipsis; /* Add ellipsis for overflowing text */
    white-space: nowrap; /* Prevent wrapping */
    min-width: 0; /* Allow shrinking */
    max-width: calc(100% - 100px); /* Adjust based on image width */
    margin-left: 10px; /* Add spacing between image and title */
    flex-grow: 1; /* Allow title to take remaining space */
}

.img-small {
    width: 90px; /* Set a specific width for small images */
    height: 80px; /* Set a specific height for small images */
}

.card {
    transition: transform 0.2s; /* Smooth scale effect on hover */
}

.card:hover {
    transform: scale(1.05); /* Slightly scale up the card on hover */
}

/* Responsive adjustments */
@media (max-width: 576px) {
    .fixed-image {
        width: 80px;
        height: 60px;
    }
}

@media (max-width: 375px) {
    .fixed-image {
        width: 60px;
        height: 45px;
    }
}

/* Responsive example */
@media (min-width: 768px) {
    container h3 {
        font-size: 23px; /* Larger screens */
    }
}
/* Responsive top lead and bellow home top */
.image-container {
    width: 107px; /* Width of the image */
    height: auto; /* Maintain aspect ratio */
}

.image-container img {
    max-width: 100%; /* Ensure the image is responsive */
    height: auto; /* Maintain aspect ratio */
}

.headline a {
    font-size: 23px;
    color: #212529;
    font-weight: bold;
}

.top-headline a {
    font-size: 26px;
    color: #212529;
    font-weight: bold;
    line-height: 35px;
}
.ticker-top {
    color: #d50000;
     text-align: left;
}
.line-height {    
    line-height:28px;
}
.text-justify{
    text-align:justify;
}

@media (max-width: 576px) {
    .headline {
        font-size: 20px; /* Slightly smaller headline on very small screens */
    }
}

/* Responsive top lead and bellow home top */

/* category backgroud color */
.cat-headline {
    background-color: #6e1341;
    padding: 0px 0px 5px 20px;/* Spacing around the text */
    border-radius: 8px; /* Rounded corners */
    transition: background-color 0.3s ease; /* Smooth background change */
}

.cat-headline a {
    font-size: 2rem;
    color: #fff;
}

.details-page-text {
    color: #fff !important;
}

.cat.headline:hover {
    background-color: #0056b3; /* Darker shade on hover */
}
/* category backgroud color */
/* Common styles for unordered lists */
ul {
    list-style-type: none;    /* Remove default bullets */
    padding: 0;               /* Remove default padding */
    margin: 0;                /* Remove default margin */
}

ul li {
    margin-bottom: 10px;      /* Spacing between items */
}

ul li a {
    display: block;
    padding: 10px 15px;
    text-decoration: none;
    color: #212529;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 5px;
    transition: background-color 0.3s, color 0.3s;
    font-weight: bold !important;
    font-size: 22px;
}

ul li a:hover {
    background-color: #e7f3ff; /* Light blue background on hover */
    color: #0056b3;             /* Darker blue on hover */
}

/* Responsive styles */
@media (max-width: 768px) {
    ul li a {
        padding: 8px 10px;     /* Less padding on links for smaller screens */
    }
}
/* ----- start order classes for max-width: 767px ----- */
@media (max-width: 767px) {
    .order-1 { order: 1 !important; }
    .order-2 { order: 2 !important; }
    .order-3 { order: 3 !important; }
}
/* ----- end order classes for max-width: 767px ----- */

@media (max-width: 767px) {
    .latest-news {
        display: none;
    }
    .news-slider {
       display: none;
    }
        .col-12.col-sm-6.mt-2.mt-sm-0.position-relative {
        display: none;
    }
}
@media (max-width: 991.98px) {
    /* Navbar এ collapse ্গ্ান্ া */
    .navbar,
    .navbar-collapse {
        background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
    }

    /*  িঙগো  ব  াে া */
    .navbar .nav-link {
        color: #000000 !important;
        padding-left: 15px;
    }

    /* িি ে চ  ব্ */
    .navbar-nav .nav-item {
        border-bottom: 1px solid #e0e0e0;
    }

    /* scrolling-menu র ঙ  */
    .scrolling-menu a {
        color: #fff !important;
    }

    /* .menu-bg ক */
    .menu-bg {
        background-color: #ffffff !important;
    }

    /* container  উ  ন হ র */
	.mobile-border
    	{
		background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity));
    	}
  .full-border  {
  padding: 0px !important;
  }
}
/* ড্ ভ (min-width: 768px) */
@media (min-width: 768px) {
    /* --- যোগ কা য়েছে: Desktop Flexbox Utility Classes --- */
    .order-md-1 { order: 1 !important; }
    .order-md-2 { order: 2 !important; }
    .order-md-3 { order: 3 !important; }
    /* --- য করা শেষ --- */
    
    /* ব নি ঝ  */
    .lead-news {
        order: 1;
        padding: 0px 10px 0 10px;
    }

    /* ব  ন া  উ */
    .left-side-news, .right-side-news {
        order: 1;
    }
}

/* বা  (max-width: 767px) */
@media (max-width: 767px) {
    /* ড় উজ ্ (ুর)  */
    .lead-news {
        order: -1; /* ে  ি  */
        margin-bottom: 20px; /* স্  হেছ */
    }

    /* ব  ন  র */
    .left-side-news, .right-side-news {
        order: 1;
    }

    /* বাল ন ফে ম */
    .row.g-3 {
        flex-direction: column;
    }
}


/* ম েত ং সট া */
.show-on-mobile {
    display: block;
}

.show-on-desktop {
    display: none;
}
.center-all {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

@media (min-width: 768px) {
    /* 768px    ্্ সজ ্  */
    .show-on-mobile {
        display: none;
    }

    .show-on-desktop {
        display: block;
    }
}

/* CSS for smaller screens (mobiles) to keep image and text side-by-side */
@media (max-width: 767.98px) {
    /* ত কা ্যবহ  নটইক Flexbox বনান */
    .mobile-side-by-side {
        display: flex; /* Flexbox ব্বা কু আউের ন */
        align-items: flex-start; /* ব বং টকে ে align  */
    }

    /* > selector দ শুধ্ সাস child-র target রা ্ছ */
    .mobile-side-by-side > .float-start {
        float: none !important; /* Bootstrap-এর float ্ রুন ইে */
        flex-shrink: 0; /* ছ  ছো া হয়  */
        /* me-3 কলা   া্ি োগ  */
    }

    /* েখর div-িে  জগা ন ি */
    .mobile-side-by-side > .text-justify {
        flex-grow: 1; /* লখ  প জয়গা ে  */
        min-width: 0; /* flex item- text overflow-এ স মধানর ন্ ট যর ক  */
    }

    /* য show-on-desktop/show-on-mobile কা ্বহ করন */
    /* মোে ডকর ক্ কিয়ে দ */
     .mobile-side-by-side .show-on-desktop {
        display: none !important;
    }
    /* মোব োইলর ন্্ট েখ */
     .mobile-side-by-side .show-on-mobile {
         display: block !important; /* বা inline-block/flex আ প্য়ন ুযা */
     }
}

/* Optional: ডসপ ন default চণ  ত পন */
@media (min-width: 768px) {
     .mobile-side-by-side {
         display: block; /*  initial/unset */
     }
     .mobile-side-by-side > .float-start {
         float: left; /*  initial/unset */
         flex-shrink: unset; /* ব initial */
     }
     .mobile-side-by-side > .text-justify {
         flex-grow: unset; /* া initial */
     }
  
  
}

@media (min-width: 768px) {
    .mt-md-auto {
        margin-top: auto !important;
    }
}