/* :root { --red: #001a6e; --maroon: #410445; --orange: #e52020; --blue: #ff2df1; } .navbar { background-color: var(--maroon); /* height: 4rem; */ } .navbar-brand, .nav-link { color: #fff !important; } .nav-link:hover { color: var(--orange) !important; } .donate-btn { background-color: var(--orange); /* or use a hex code like #FFA725 */ color: white; padding: 8px 20px; border-radius: 30px; font-weight: 600; text-transform: uppercase; transition: all 0.3s ease; } .donate-btn:hover { background-color: #050505; /* slightly darker for hover effect */ color: white; } .gallery-overlay { background: linear-gradient( to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.9) ); color: #fff; padding: 100px 0; text-align: center; } .gallery-item { position: relative; overflow: hidden; border-radius: 12px; } .gallery-img { width: 100%; height: 250px; object-fit: cover; transition: transform 0.3s ease; } .gallery-item:hover .gallery-img { transform: scale(1.05); } .gallery-caption { position: absolute; bottom: 0; left: 0; width: 100%; padding: 10px; background: rgba(0, 0, 0, 0.6); color: #db3611; font-weight: bold; text-align: center; opacity: 0; transition: opacity 0.3s ease; } .gallery-item:hover .gallery-caption { opacity: 1; } */