/* views\newsPage\newsMain\newsMain.css */ * { margin: 0; padding: 0; box-sizing: border-box; font-family: Arial, sans-serif; } body { color: #333; background-color: #f7f7f7; } a { text-decoration: none; color: inherit; } /* Ensure visited links don't turn purple */ a:visited { color: inherit; } /* Optional: Keep hover state consistent */ a:hover { text-decoration: none; color: inherit; } /* Optional: Keep active state consistent */ a:active { color: inherit; } /* NEWS SECTION CSS */ .news-container { max-width: 1200px; margin: 40px auto; padding: 0 20px; } .page-title { text-align: center; margin-bottom: 40px; color: #006241; position: relative; } .page-title:after { content: ""; display: block; width: 80px; height: 3px; background-color: #e84e0f; margin: 10px auto; } .news-filter { display: flex; justify-content: center; margin-bottom: 30px; } .filter-btn { padding: 8px 16px; margin: 0 10px; background-color: #fff; color: #006241; border: 1px solid #30875f; border-radius: 4px; cursor: pointer; transition: all 0.3s ease; } .filter-btn:hover, .filter-btn.active { background-color: #30875f; color: white; } .news-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 30px; } .news-card { background-color: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); transition: transform 0.3s ease; } .news-card:hover { transform: translateY(-5px); } .news-thumbnail { height: 200px; overflow: hidden; } .news-thumbnail img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease; } .news-card:hover .news-thumbnail img { transform: scale(1.05); } .news-content { padding: 20px; } .news-category { display: inline-block; background-color: #e84e0f; color: white; padding: 5px 10px; border-radius: 4px; font-size: 12px; margin-bottom: 10px; } .news-title { font-size: 18px; margin-bottom: 10px; color: #006241; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; } .news-excerpt { color: #666; margin-bottom: 15px; font-size: 14px; line-height: 1.5; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; } .news-date { color: #999; font-size: 12px; display: flex; align-items: center; } .news-date i { margin-right: 5px; } .news-pagination { display: flex; justify-content: center; margin-top: 40px; } .page-btn { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; margin: 0 5px; border-radius: 4px; background-color: #fff; color: #006241; border: 1px solid #ddd; cursor: pointer; transition: all 0.3s ease; } .page-btn:hover, .page-btn.active { background-color: #30875f; color: white; border-color: #30875f; } /* END OF NEWS SECTION CSS */ /* Responsive styles */ @media (max-width: 992px) { .news-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 768px) { .news-grid { grid-template-columns: 1fr; } }