.header { position: fixed; top: 0; left: 0; width: 100%; z-index: 100; display: flex; align-items: center; justify-content: space-between; padding: 0.8rem 2rem; background: linear-gradient(15deg, rgba(10, 114, 40, 1) 55%, rgba(101, 101, 184, 1) 100%); flex-wrap: wrap; /* Allow wrapping on mobile */ } .header-text { display: flex; flex-direction: column; justify-content: center; flex: 1; text-align: left; } .desktop-text { color: white; font-family: Roboto, sans-serif; font-size: 1.5rem; line-height: 1.2; } .desktop-address { font-family: Roboto, sans-serif; color: white; font-size: 0.9rem; text-shadow: 1px 1px 2px blue; margin-top: 0.25rem; } /* Mobile styles */ .mobile-text { color: white; font-family: Roboto, sans-serif; font-size: 1rem; line-height: 1.2; display: none; text-align: center; } /* Media query for mobile */ @media screen and (max-width: 768px) { .header { justify-content: center; padding: 0.5rem 0.75rem; } .header-logo { width: 50px; margin-bottom: 0.5rem; } .header-text { text-align: center; flex-direction: column; } .desktop-text, .desktop-address { display: none; } .mobile-text { display: block; font-size: 0.9rem; } }