/* Styles for homepage news marquee */
.news-marquee{
    color:#FFFFFF;
    box-sizing:border-box;
    width:100%;
    max-width:1100px; /* constrain the band width */
    margin:0 auto; /* center */
    padding:6px 12px;
    line-height:1.15;
    font-size:15px;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:8px;
}
.news-marquee .item{
    display:inline-flex;
    align-items:center;
    max-width:calc(50% - 16px);
    white-space:normal;
    overflow:hidden;
    text-overflow:ellipsis;
    padding:2px 6px;
    vertical-align:middle;
}
.news-marquee .item a{ color:#fff; text-decoration:none; }

/* Smaller screens: allow single-column items and smaller font */
@media (max-width:600px){
    .news-marquee{ max-width:95%; font-size:14px; gap:6px; }
    .news-marquee .item{ max-width:100%; }
}


  
/* Inline CSS for accessible news ticker (replaces deprecated <marquee>) */
/* Responsive news area: prevent horizontal overflow and allow wrapping */
.news-marquee{
    color:#FFFFFF;
    overflow:hidden;
    box-sizing:border-box;
    width:100%;
    padding:0px 4px;
}
.news-marquee .item{
    display:block;
    max-width:100%;
    white-space:normal;
    word-break:break-word;
    overflow:hidden;
    text-overflow:ellipsis;
}
/* small visual cue instead of continuous animation to avoid layout issues */
.news-marquee .item:hover{transform:translateX(4px); transition:transform .3s;}
.news-marquee img{vertical-align:middle; max-width:16px; height:auto;}