/* Base styles */ body { font-family: 'Helvetica Neue', Arial, sans-serif; line-height: 1.6; background-color: #f8f9fa; } /* Color scheme inspired by Basquiat's palette */ :root { --basquiat-red: #e63946; --basquiat-blue: #457b9d; --basquiat-yellow: #ffd166; --basquiat-black: #1a1a1a; } a:hover { color: var(--basquiat-red); } .nav-link:hover::after { background-color: var(--basquiat-red); } /* Custom animations */ @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .fade-in { animation: fadeIn 0.8s ease-in-out; } /* Gallery grid styles */ .gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 2rem; margin-bottom: 3rem; } /* Info box styles */ .info-box { background: rgba(255,255,255,0.9); border-radius: 0.5rem; padding: 1.5rem; margin: 2rem 0; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1); } /* Responsive adjustments */ @media (max-width: 768px) { .gallery-grid { grid-template-columns: 1fr; } } .gallery-item, .featured-period img { transition: all 0.3s ease; object-fit: cover; } .gallery-item:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,0.1); } /* Navbar link hover effects */ .nav-link { position: relative; } .nav-link::after { content: ''; position: absolute; width: 0; height: 2px; bottom: -2px; left: 0; background-color: currentColor; transition: width 0.3s ease; } .nav-link:hover::after { width: 100%; } /* Responsive video container */ .video-container { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; overflow: hidden; } .video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }