Perfect — CSS is working! Now delete that test line and we can get to work.

But here's the honest truth: to get that Tulare GOP look with the big hero photo, you'll need to do a tiny bit of page editing — not just CSS. It's not hard, I'll walk you through it step by step.

Here's my suggested plan:

**Step 1 (today)** — CSS overhaul: white background, red nav, gold accents, clean fonts. This alone will be a huge improvement.

**Step 2 (next)** — Add your group photo as a hero banner on the homepage with text over it.

Want to start with Step 1? Delete the lightblue line, paste this, save, and tell me what you see:

```css
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700&family=Inter:wght@400;500;600&display=swap');

/* Base */
body {
  background-color: #ffffff !important;
  font-family: 'Inter', sans-serif !important;
  color: #1a1a1a !important;
}

/* Nav bar */
#navigationWrapper, .WaGlobalNavigationWrapper,
nav, .afNavigationBar, [id*="nav"], [class*="nav-bar"],
[class*="NavigationWrapper"] {
  background-color: #B22234 !important;
  border-bottom: 3px solid #8B1A1A !important;
}

/* Nav links */
#navigationWrapper a, .afNavigationBar a,
[class*="NavigationWrapper"] a {
  color: #ffffff !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}

#navigationWrapper a:hover,
[class*="NavigationWrapper"] a:hover {
  color: #CFB53B !important;
  text-decoration: none !important;
}

/* Header */
#headerWrapper, [class*="HeaderWrapper"] {
  background-color: #ffffff !important;
  border-bottom: 1px solid #eeeeee !important;
  padding: 20px 0 !important;
}

/* Headings */
h1, h2, h3, h4 {
  font-family: 'Playfair Display', serif !important;
  color: #1a1a1a !important;
}

/* Buttons */
input[type="submit"], .WaButtonPrimary,
a.WaButtonPrimary, [class*="btn"], .button {
  background-color: #B22234 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 3px !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  padding: 12px 24px !important;
  transition: background-color 0.2s !important;
}

input[type="submit"]:hover, .WaButtonPrimary:hover {
  background-color: #8B1A1A !important;
}

/* Content area */
#contentWrapper, [class*="ContentWrapper"] {
  max-width: 1100px !important;
  margin: 0 auto !important;
  padding: 40px 24px !important;
  background-color: #ffffff !important;
}

/* Footer */
#footerWrapper, [class*="FooterWrapper"] {
  background-color: #1a1a2e !important;
  color: #aaaaaa !important;
  padding: 30px !important;
  text-align: center !important;
  font-size: 13px !important;
}

#footerWrapper a, [class*="FooterWrapper"] a {
  color: #CFB53B !important;
}
```
That's already a big improvement! White background, red nav bar, clean layout. Good progress. A few things to fix:

1. **Nav links are showing in red/blue** instead of white
2. **Header is huge** — the logo and title are taking up way much space
3. **Nav text needs to be white**

Add these lines to the bottom of your existing CSS to fix it:

```css
/* Fix nav link colors */
.afNavigationBar a, .afNavigationBar li a,
ul.afNavigationBar a {
  color: #ffffff !important;
}

ul.afNavigationBar li.selected a,
ul.afNavigationBar li a:hover {
  color: #CFB53B !important;
  text-decoration: none !important;
}

/* Shrink the header */
#headerWrapper img {
  max-height: 80px !important;
  width: auto !important;
}

#headerWrapper {
  padding: 12px 24px !important;
  display: flex !important;
  align-items: center !important;
}

/* Hide the big text title if it's separate from the logo */
#headerWrapper h1, #headerWrapper h2 {
  display: none !important;
}
```

Paste that at the **bottom** of what's already in your CSS box (don't replace it), save, and send me another screenshot. We're getting close!