.headerpic-announcement{position:relative;height:250px;display:flex;align-items:center;justify-content:center;color:rgb(255,255,255);font-size:50px;font-weight:bolder;overflow:hidden;background:linear-gradient(rgba(0,0,0,.5),rgba(0,0,0,.5)),url(/Images/brgyheaderpic.JPG) no-repeat 50%/cover;background-position:center 55%;margin-bottom:50px}.TitlePage-announcement{background-color:rgba(255,255,255,.7);width:800px;height:100px;border-radius:25px;display:flex;justify-content:space-between;align-items:center;margin:0 auto 2rem;padding-left:1rem;padding-right:1rem;word-wrap:break-word;overflow:hidden;border:2px solid #ddd}.TitlePage-announcement p{color:#DF7426;font-size:24px;font-weight:700;text-overflow:ellipsis;white-space:normal;overflow:hidden;width:100%;margin-left:1.5rem}.aboutus-image-announcement{width:160px;height:80px}.main-container-announcement{height:100%;width:100%;background-image:url(/Images/bghome.jpg)}.announcements-section-announcement{display:grid;grid-template-columns:repeat(3,1fr);gap:3.5rem;padding:2rem}@media (min-width:640px){.announcements-section-announcement{grid-template-columns:repeat(2,1fr)}}@media (min-width:1024px){.announcements-section-announcement{grid-template-columns:repeat(3,1fr)}}.announcement-card-announcement{background-color:rgba(255,255,255,.7);box-shadow:0 4px 6px rgba(0,0,0,.1);border-radius:.5rem;width:100%;height:500px;display:flex;flex-direction:column;border:2px solid #ddd;box-shadow:0 4px 8px rgba(0,0,0,.1);transition:transform .3s ease,box-shadow .3s ease}.announcement-card-announcement:hover{transform:translateY(-10px);box-shadow:0 6px 12px rgba(0,0,0,.15)}.calendar-icon{width:16px;height:16px;object-fit:contain}.announcements-header{text-align:center;margin:3rem auto 2rem;padding:50px 1rem 0;max-width:900px;width:100%}.announcements-title{font-size:2.5rem;font-weight:700;color:#214666;text-align:center;display:flex;align-items:center;justify-content:center;gap:1rem;animation:slideDown 1s ease .3s forwards;transform:translateY(-50px);opacity:0}@keyframes slideDown{to{transform:translateY(0);opacity:1}}.announcements-title:after,.announcements-title:before{content:"";flex:1;border-top:1px solid #ccc}.announcements-underline{width:100px;height:4px;background-color:#DF7426;margin:.5rem auto 1.5rem;border-radius:5px}.layout-announcement{display:flex;gap:2rem;padding:2rem;margin-left:50px;margin-right:50px}.left-section-announcement{flex:3;padding-right:1rem}.right-section-announcement{flex:1;position:sticky;top:100px;align-self:flex-start;background:#fff;padding:1rem;border-radius:10px;box-shadow:0 4px 6px rgba(0,0,0,.1)}.recent-posts-announcement h3,.year-filter-announcement h3{font-weight:700;margin-bottom:1rem;font-size:1.2rem;color:#214666}.year-buttons{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}.year-btn{padding:.4rem .8rem;border:1px solid #ccc;background:#f9f9f9;border-radius:5px;cursor:pointer;font-size:.9rem}.year-btn:hover{background:#DF7426;color:white}.recent-posts-announcement{margin-top:2rem}.announcement-img{width:100px}.recent-post-card{cursor:pointer;background:#fff;border-radius:10px;padding:10px;display:flex;gap:10px;transition:transform .2s ease,box-shadow .2s ease}.recent-post-card img{width:130px;height:60px;object-fit:cover;border-radius:5px}.recent-post-card:hover{transform:translateY(-4px);box-shadow:0 4px 12px rgba(0,0,0,.1)}.recent-post-content{width:100%}.recent-post-card p{font-size:.9rem;font-weight:500;margin:0}.recent-post-card span{font-size:.75rem;color:gray}.recent-post-card-link{text-decoration:none;color:inherit;display:block}.announcement-card-announcement{background:#fff;border-radius:10px;overflow:hidden;margin-bottom:1.5rem;border:1px solid #ddd;box-shadow:0 2px 6px rgba(0,0,0,.1);height:auto}.announcement-image-container{width:100%;overflow:hidden}.announcement-image-announcement{width:100%;height:auto;object-fit:contain;display:block}.announcement-content-announcement{padding:1rem;display:flex;flex-direction:column;justify-content:space-between}.announcement-title-announcement{font-size:1.7rem;font-weight:700;margin-bottom:.5rem;color:#214666;text-align:left}.announcement-description-announcement{font-size:.9rem;color:#444;margin-bottom:1rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.announcement-footer-announcement{display:flex;justify-content:space-between;align-items:center;padding-top:20px;padding-bottom:10px;border-top:1px solid #ccc}.announcement-date-announcement{font-size:1rem;color:#DF7426;display:flex;flex-direction:row;gap:10px;align-items:center}.read-more-announcement{font-size:.9rem;color:#0066cc;text-decoration:underline}.pagination-announcement{display:flex;justify-content:center;gap:.5rem;margin-top:1.5rem}.pagination-announcement button{padding:.4rem .8rem;border:1px solid #ccc;background:#f9f9f9;cursor:pointer;border-radius:5px;transition:.2s}.pagination-announcement button:hover:not(:disabled){background:#DF7426;color:#fff}.pagination-announcement .active-page{background:#214666;color:white;font-weight:700}.pagination-announcement button:disabled{opacity:.5;cursor:not-allowed}@media (max-width:1024px) and (min-width:769px){.headerpic-announcement{height:120px;font-size:23px;background-position:center 50%}.announcements-header{margin:2rem auto 1.5rem;padding:0 2rem}.announcements-title{font-size:2rem;gap:.5rem}.announcements-title:after,.announcements-title:before{flex:0.5}.layout-announcement{flex-direction:column;margin-left:1rem;margin-right:1rem}.left-section-announcement{flex:none;width:100%;padding-right:0}.right-section-announcement{flex:none;width:100%;position:relative;top:auto;margin-top:2rem}}@media (max-width:768px){.headerpic-announcement{height:120px;font-size:23px;background-position:center 50%}.announcements-header{margin:1.5rem auto 1rem;padding:0 1rem}.announcements-title{font-size:1.6rem;flex-direction:column;gap:.3rem}.announcements-title:after,.announcements-title:before{display:none}.layout-announcement{flex-direction:column;margin:0 auto 2rem;max-width:95%;padding:0 .8rem}.left-section-announcement{flex:none;width:100%;padding-right:0}.right-section-announcement{flex:none;width:100%;position:relative;top:auto;margin-top:1.5rem}}