Below is a **ready‑to‑paste HTML snippet** that puts everything you posted together in a clean, responsive “Contact / Office” section:

* address with a “show directions” link
* opening‑hours block
* two YouTube videos (each in its own responsive iframe)
* an embedded Google Map (also responsive)

You can drop this straight into the body of any page (or into a template part) and then style it further with your own CSS.

—

## 1️⃣ Full HTML (copy‑and‑paste)

“`html

“`

—

## 2️⃣ What the markup does

| Block | What it contains | Why it’s useful |
|——|——————|—————–|
| **`.address`** | SVG “pin” icon, office address, link to directions | Gives a clear visual cue and a quick “how to get there” anchor |
| **`.hours`** | SVG “clock” icon, opening‑hours text | Visitors instantly see when you’re open |
| **`.videos`** | Two responsive YouTube iframes (wrapped in `.video-wrapper`) | Showcase your office, presentations, or anything else |
| **`.map`** | Google‑Maps embed (wrapped in `.map-wrapper`) | Interactive map that works on desktop **and** mobile |
| **`.contact-section`** | Overall container – you can set a background colour, padding, max‑width, etc. | Keeps everything nicely grouped |

—

## 3️⃣ Minimal CSS (optional)

If you want a quick, clean look without writing a full stylesheet, add the following `