Hugging Face's logo

Spaces:
Altaire
/
leonard
Running

App Files Community
Altaire commited on
Commit
cd57ec8
·
verified ·
1 Parent(s): b5aa3a5

Add 2 files

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +814 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Leonard
3
- emoji: 🏢
4
- colorFrom: purple
5
- colorTo: yellow
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: leonard
3
+ emoji: 🐳
4
+ colorFrom: blue
5
+ colorTo: blue
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,814 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>David Leonard - The Future Prime Minister</title>
7
+ <link rel="preconnect" href="https://fonts.googleapis.com">
8
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
9
+ <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;600;700&family=Playfair+Display:wght@700&display=swap" rel="stylesheet">
10
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
11
+ <style>
12
+ :root {
13
+ --primary: #012169; /* UK blue */
14
+ --secondary: #C8102E; /* UK red */
15
+ --accent: #FFD700; /* Gold accent */
16
+ --light: #F8F9FA;
17
+ --dark: #212529;
18
+ --transition: all 0.3s ease;
19
+ }
20
+
21
+ * {
22
+ margin: 0;
23
+ padding: 0;
24
+ box-sizing: border-box;
25
+ }
26
+
27
+ body {
28
+ font-family: 'Montserrat', sans-serif;
29
+ line-height: 1.6;
30
+ color: var(--dark);
31
+ background-color: var(--light);
32
+ overflow-x: hidden;
33
+ }
34
+
35
+ h1, h2, h3, h4 {
36
+ font-family: 'Playfair Display', serif;
37
+ font-weight: 700;
38
+ }
39
+
40
+ .container {
41
+ width: 100%;
42
+ max-width: 1200px;
43
+ margin: 0 auto;
44
+ padding: 0 20px;
45
+ }
46
+
47
+ /* Header */
48
+ header {
49
+ background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
50
+ color: white;
51
+ padding: 20px 0;
52
+ position: fixed;
53
+ width: 100%;
54
+ z-index: 1000;
55
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
56
+ transition: var(--transition);
57
+ }
58
+
59
+ header.scrolled {
60
+ padding: 10px 0;
61
+ background: rgba(1, 33, 105, 0.95);
62
+ }
63
+
64
+ .header-content {
65
+ display: flex;
66
+ justify-content: space-between;
67
+ align-items: center;
68
+ }
69
+
70
+ .logo {
71
+ font-size: 1.8rem;
72
+ font-weight: 700;
73
+ display: flex;
74
+ align-items: center;
75
+ }
76
+
77
+ .logo span {
78
+ color: var(--accent);
79
+ }
80
+
81
+ .logo img {
82
+ height: 50px;
83
+ margin-right: 10px;
84
+ }
85
+
86
+ nav ul {
87
+ display: flex;
88
+ list-style: none;
89
+ }
90
+
91
+ nav ul li {
92
+ margin-left: 30px;
93
+ }
94
+
95
+ nav ul li a {
96
+ color: white;
97
+ text-decoration: none;
98
+ font-weight: 600;
99
+ font-size: 1rem;
100
+ transition: var(--transition);
101
+ position: relative;
102
+ }
103
+
104
+ nav ul li a:after {
105
+ content: '';
106
+ position: absolute;
107
+ width: 0;
108
+ height: 2px;
109
+ background: var(--accent);
110
+ bottom: -5px;
111
+ left: 0;
112
+ transition: var(--transition);
113
+ }
114
+
115
+ nav ul li a:hover:after {
116
+ width: 100%;
117
+ }
118
+
119
+ nav ul li a:hover {
120
+ color: var(--accent);
121
+ }
122
+
123
+ .mobile-menu-btn {
124
+ display: none;
125
+ background: none;
126
+ border: none;
127
+ color: white;
128
+ font-size: 1.5rem;
129
+ cursor: pointer;
130
+ }
131
+
132
+ /* Hero Section */
133
+ .hero {
134
+ height: 100vh;
135
+ background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('https://images.unsplash.com/photo-1444653614773-995cb1ef9efa?ixlib=rb-4.0.3&auto=format&fit=crop&w=1350&q=80') no-repeat center center/cover;
136
+ display: flex;
137
+ align-items: center;
138
+ justify-content: center;
139
+ text-align: center;
140
+ color: white;
141
+ padding-top: 80px;
142
+ position: relative;
143
+ }
144
+
145
+ .hero-content h1 {
146
+ font-size: 4rem;
147
+ margin-bottom: 1rem;
148
+ text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
149
+ }
150
+
151
+ .hero-content h2 {
152
+ font-size: 2rem;
153
+ font-weight: 300;
154
+ margin-bottom: 2rem;
155
+ text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
156
+ }
157
+
158
+ .hero-content p {
159
+ font-size: 1.2rem;
160
+ max-width: 800px;
161
+ margin: 0 auto 2rem;
162
+ }
163
+
164
+ .btn {
165
+ display: inline-block;
166
+ padding: 12px 30px;
167
+ background: var(--accent);
168
+ color: var(--primary);
169
+ text-decoration: none;
170
+ font-weight: 600;
171
+ border-radius: 50px;
172
+ transition: var(--transition);
173
+ border: none;
174
+ cursor: pointer;
175
+ font-size: 1rem;
176
+ margin: 0 10px;
177
+ }
178
+
179
+ .btn:hover {
180
+ transform: translateY(-3px);
181
+ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
182
+ }
183
+
184
+ .btn-outline {
185
+ background: transparent;
186
+ color: white;
187
+ border: 2px solid white;
188
+ }
189
+
190
+ .btn-outline:hover {
191
+ background: white;
192
+ color: var(--primary);
193
+ }
194
+
195
+ /* About Section */
196
+ .section {
197
+ padding: 100px 0;
198
+ }
199
+
200
+ .section-title {
201
+ text-align: center;
202
+ margin-bottom: 60px;
203
+ }
204
+
205
+ .section-title h2 {
206
+ font-size: 2.5rem;
207
+ margin-bottom: 15px;
208
+ color: var(--primary);
209
+ }
210
+
211
+ .section-title p {
212
+ color: #666;
213
+ max-width: 700px;
214
+ margin: 0 auto;
215
+ }
216
+
217
+ .about-content {
218
+ display: flex;
219
+ align-items: center;
220
+ gap: 50px;
221
+ }
222
+
223
+ .about-img {
224
+ flex: 1;
225
+ border-radius: 10px;
226
+ overflow: hidden;
227
+ box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
228
+ }
229
+
230
+ .about-img img {
231
+ width: 100%;
232
+ height: auto;
233
+ display: block;
234
+ }
235
+
236
+ .about-text {
237
+ flex: 1;
238
+ }
239
+
240
+ .about-text h3 {
241
+ font-size: 2rem;
242
+ margin-bottom: 20px;
243
+ color: var(--primary);
244
+ }
245
+
246
+ .about-text p {
247
+ margin-bottom: 15px;
248
+ color: #555;
249
+ }
250
+
251
+ .stats {
252
+ display: flex;
253
+ margin-top: 30px;
254
+ gap: 30px;
255
+ }
256
+
257
+ .stat-item {
258
+ text-align: center;
259
+ }
260
+
261
+ .stat-item .number {
262
+ font-size: 2.5rem;
263
+ font-weight: 700;
264
+ color: var(--secondary);
265
+ margin-bottom: 5px;
266
+ }
267
+
268
+ .stat-item .label {
269
+ font-size: 0.9rem;
270
+ color: #666;
271
+ }
272
+
273
+ /* Policies Section */
274
+ .policies {
275
+ background: #f5f7fa;
276
+ }
277
+
278
+ .policies-grid {
279
+ display: grid;
280
+ grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
281
+ gap: 30px;
282
+ }
283
+
284
+ .policy-card {
285
+ background: white;
286
+ border-radius: 10px;
287
+ overflow: hidden;
288
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
289
+ transition: var(--transition);
290
+ }
291
+
292
+ .policy-card:hover {
293
+ transform: translateY(-10px);
294
+ box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
295
+ }
296
+
297
+ .policy-icon {
298
+ height: 80px;
299
+ background: var(--primary);
300
+ color: white;
301
+ display: flex;
302
+ align-items: center;
303
+ justify-content: center;
304
+ font-size: 2.5rem;
305
+ }
306
+
307
+ .policy-content {
308
+ padding: 30px;
309
+ }
310
+
311
+ .policy-content h3 {
312
+ font-size: 1.5rem;
313
+ margin-bottom: 15px;
314
+ color: var(--primary);
315
+ }
316
+
317
+ /* News Section */
318
+ .news-grid {
319
+ display: grid;
320
+ grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
321
+ gap: 30px;
322
+ }
323
+
324
+ .news-card {
325
+ background: white;
326
+ border-radius: 10px;
327
+ overflow: hidden;
328
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
329
+ transition: var(--transition);
330
+ }
331
+
332
+ .news-card:hover {
333
+ transform: translateY(-5px);
334
+ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
335
+ }
336
+
337
+ .news-img {
338
+ height: 200px;
339
+ overflow: hidden;
340
+ }
341
+
342
+ .news-img img {
343
+ width: 100%;
344
+ height: 100%;
345
+ object-fit: cover;
346
+ transition: var(--transition);
347
+ }
348
+
349
+ .news-card:hover .news-img img {
350
+ transform: scale(1.1);
351
+ }
352
+
353
+ .news-content {
354
+ padding: 25px;
355
+ }
356
+
357
+ .news-date {
358
+ font-size: 0.8rem;
359
+ color: var(--secondary);
360
+ margin-bottom: 10px;
361
+ font-weight: 600;
362
+ }
363
+
364
+ .news-content h3 {
365
+ font-size: 1.3rem;
366
+ margin-bottom: 10px;
367
+ color: var(--dark);
368
+ }
369
+
370
+ .news-content p {
371
+ color: #666;
372
+ margin-bottom: 15px;
373
+ font-size: 0.95rem;
374
+ }
375
+
376
+ /* CTA Section */
377
+ .cta {
378
+ background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
379
+ color: white;
380
+ text-align: center;
381
+ padding: 80px 0;
382
+ }
383
+
384
+ .cta h2 {
385
+ font-size: 2.5rem;
386
+ margin-bottom: 20px;
387
+ }
388
+
389
+ .cta p {
390
+ font-size: 1.2rem;
391
+ max-width: 700px;
392
+ margin: 0 auto 40px;
393
+ }
394
+
395
+ /* Footer */
396
+ footer {
397
+ background: var(--dark);
398
+ color: white;
399
+ padding: 60px 0 20px;
400
+ }
401
+
402
+ .footer-content {
403
+ display: grid;
404
+ grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
405
+ gap: 40px;
406
+ margin-bottom: 40px;
407
+ }
408
+
409
+ .footer-column h3 {
410
+ font-size: 1.3rem;
411
+ margin-bottom: 20px;
412
+ color: var(--accent);
413
+ }
414
+
415
+ .footer-column ul {
416
+ list-style: none;
417
+ }
418
+
419
+ .footer-column ul li {
420
+ margin-bottom: 10px;
421
+ }
422
+
423
+ .footer-column ul li a {
424
+ color: #ddd;
425
+ text-decoration: none;
426
+ transition: var(--transition);
427
+ }
428
+
429
+ .footer-column ul li a:hover {
430
+ color: var(--accent);
431
+ }
432
+
433
+ .social-links {
434
+ display: flex;
435
+ gap: 15px;
436
+ margin-top: 20px;
437
+ }
438
+
439
+ .social-links a {
440
+ color: white;
441
+ background: rgba(255, 255, 255, 0.1);
442
+ width: 40px;
443
+ height: 40px;
444
+ border-radius: 50%;
445
+ display: flex;
446
+ align-items: center;
447
+ justify-content: center;
448
+ transition: var(--transition);
449
+ }
450
+
451
+ .social-links a:hover {
452
+ background: var(--accent);
453
+ color: var(--dark);
454
+ }
455
+
456
+ .copyright {
457
+ text-align: center;
458
+ padding-top: 20px;
459
+ border-top: 1px solid rgba(255, 255, 255, 0.1);
460
+ color: #aaa;
461
+ font-size: 0.9rem;
462
+ }
463
+
464
+ /* Responsive */
465
+ @media (max-width: 992px) {
466
+ .hero-content h1 {
467
+ font-size: 3rem;
468
+ }
469
+
470
+ .hero-content h2 {
471
+ font-size: 1.5rem;
472
+ }
473
+
474
+ .about-content {
475
+ flex-direction: column;
476
+ }
477
+
478
+ .about-img {
479
+ max-width: 500px;
480
+ }
481
+ }
482
+
483
+ @media (max-width: 768px) {
484
+ nav ul {
485
+ position: fixed;
486
+ top: 80px;
487
+ left: -100%;
488
+ width: 100%;
489
+ height: calc(100vh - 80px);
490
+ background: var(--primary);
491
+ flex-direction: column;
492
+ align-items: center;
493
+ justify-content: center;
494
+ transition: 0.5s;
495
+ z-index: 999;
496
+ }
497
+
498
+ nav ul.show {
499
+ left: 0;
500
+ }
501
+
502
+ nav ul li {
503
+ margin: 15px 0;
504
+ }
505
+
506
+ .mobile-menu-btn {
507
+ display: block;
508
+ }
509
+
510
+ .hero-content h1 {
511
+ font-size: 2.5rem;
512
+ }
513
+ }
514
+ </style>
515
+ </head>
516
+ <body>
517
+ <header id="header">
518
+ <div class="container">
519
+ <div class="header-content">
520
+ <div class="logo">
521
+ <i class="fas fa-landmark"></i>
522
+ <span>Leonard</span> for PM
523
+ </div>
524
+ <button class="mobile-menu-btn" id="mobileMenuBtn">
525
+ <i class="fas fa-bars"></i>
526
+ </button>
527
+ <nav>
528
+ <ul id="navMenu">
529
+ <li><a href="#home">Home</a></li>
530
+ <li><a href="#about">About</a></li>
531
+ <li><a href="#policies">Policies</a></li>
532
+ <li><a href="#news">News</a></li>
533
+ <li><a href="#contact">Contact</a></li>
534
+ </ul>
535
+ </nav>
536
+ </div>
537
+ </div>
538
+ </header>
539
+
540
+ <section class="hero" id="home">
541
+ <div class="container">
542
+ <div class="hero-content">
543
+ <h1>David Leonard</h1>
544
+ <h2>Leadership for a Stronger United Kingdom</h2>
545
+ <p>With a bold vision for economic prosperity, national unity, and global leadership, David Leonard represents the fresh leadership Britain needs in these challenging times.</p>
546
+ <div class="hero-btns">
547
+ <a href="#policies" class="btn">Our Policies</a>
548
+ <a href="#contact" class="btn btn-outline">Join the Movement</a>
549
+ </div>
550
+ </div>
551
+ </div>
552
+ </section>
553
+
554
+ <section class="section about" id="about">
555
+ <div class="container">
556
+ <div class="section-title">
557
+ <h2>Meet David Leonard</h2>
558
+ <p>A proven leader with a track record of delivering results for the British people.</p>
559
+ </div>
560
+ <div class="about-content">
561
+ <div class="about-img">
562
+ <img src="https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?ixlib=rb-4.0.3&auto=format&fit=crop&w=634&q=80" alt="David Leonard">
563
+ </div>
564
+ <div class="about-text">
565
+ <h3>The Leader Britain Needs</h3>
566
+ <p>Born in Manchester to working-class parents, David Leonard understands the challenges facing ordinary Britons. After studying at the London School of Economics, he built a successful career in business before entering politics.</p>
567
+ <p>As a Member of Parliament for the past 12 years, David has championed economic reforms, better public services, and a stronger Britain on the world stage. His pragmatic approach has earned respect across the political spectrum.</p>
568
+ <p>Married with two children, David is driven by a commitment to securing a brighter future for the next generation of Britons.</p>
569
+
570
+ <div class="stats">
571
+ <div class="stat-item">
572
+ <div class="number">12</div>
573
+ <div class="label">Years in Parliament</div>
574
+ </div>
575
+ <div class="stat-item">
576
+ <div class="number">32</div>
577
+ <div class="label">Bills Sponsored</div>
578
+ </div>
579
+ <div class="stat-item">
580
+ <div class="number">78%</div>
581
+ <div class="label">Approval Rating</div>
582
+ </div>
583
+ </div>
584
+ </div>
585
+ </div>
586
+ </div>
587
+ </section>
588
+
589
+ <section class="section policies" id="policies">
590
+ <div class="container">
591
+ <div class="section-title">
592
+ <h2>Our Vision for Britain</h2>
593
+ <p>A comprehensive plan to build a stronger, fairer, and more prosperous United Kingdom.</p>
594
+ </div>
595
+
596
+ <div class="policies-grid">
597
+ <div class="policy-card">
598
+ <div class="policy-icon">
599
+ <i class="fas fa-chart-line"></i>
600
+ </div>
601
+ <div class="policy-content">
602
+ <h3>Economic Growth</h3>
603
+ <p>Boost productivity through investment in infrastructure, skills, and innovation. Support British businesses to compete globally while protecting workers' rights.</p>
604
+ </div>
605
+ </div>
606
+
607
+ <div class="policy-card">
608
+ <div class="policy-icon">
609
+ <i class="fas fa-medal"></i>
610
+ </div>
611
+ <div class="policy-content">
612
+ <h3>National Security</h3>
613
+ <p>Strong defence policy with modern armed forces. Counter extremism while protecting civil liberties. Invest in cyber security to protect British interests.</p>
614
+ </div>
615
+ </div>
616
+
617
+ <div class="policy-card">
618
+ <div class="policy-icon">
619
+ <i class="fas fa-hand-holding-heart"></i>
620
+ </div>
621
+ <div class="policy-content">
622
+ <h3>Social Care Reform</h3>
623
+ <p>Create a National Care Service to ensure dignity for our elderly. Better pay and conditions for care workers with proper career progression.</p>
624
+ </div>
625
+ </div>
626
+
627
+ <div class="policy-card">
628
+ <div class="policy-icon">
629
+ <i class="fas fa-leaf"></i>
630
+ </div>
631
+ <div class="policy-content">
632
+ <h3>Green Revolution</h3>
633
+ <p>Ambitious targets for renewable energy and carbon reduction. Green industrial strategy to create jobs while protecting our environment.</p>
634
+ </div>
635
+ </div>
636
+
637
+ <div class="policy-card">
638
+ <div class="policy-icon">
639
+ <i class="fas fa-graduation-cap"></i>
640
+ </div>
641
+ <div class="policy-content">
642
+ <h3>Education First</h3>
643
+ <p>Increase funding for schools, reform curriculum to prepare students for the future. Invest in lifelong learning and vocational training.</p>
644
+ </div>
645
+ </div>
646
+
647
+ <div class="policy-card">
648
+ <div class="policy-icon">
649
+ <i class="fas fa-home"></i>
650
+ </div>
651
+ <div class="policy-content">
652
+ <h3>Housing for All</h3>
653
+ <p>Ambitious house-building programme with affordable homes. Rent controls and protections for tenants. Help for first-time buyers.</p>
654
+ </div>
655
+ </div>
656
+ </div>
657
+ </div>
658
+ </section>
659
+
660
+ <section class="section" id="news">
661
+ <div class="container">
662
+ <div class="section-title">
663
+ <h2>Latest News</h2>
664
+ <p>Updates from the campaign and positive developments for Britain.</p>
665
+ </div>
666
+
667
+ <div class="news-grid">
668
+ <div class="news-card">
669
+ <div class="news-img">
670
+ <img src="https://images.unsplash.com/photo-1521791136064-7986c2920216?ixlib=rb-4.0.3&auto=format&fit=crop&w=1350&q=80" alt="Manufacturing">
671
+ </div>
672
+ <div class="news-content">
673
+ <div class="news-date">June 15, 2023</div>
674
+ <h3>British Manufacturing Sees Record Growth</h3>
675
+ <p>New government-backed initiatives have led to the strongest manufacturing growth in a decade, creating 25,000 new jobs across the Midlands and North.</p>
676
+ <a href="#" class="btn">Read More</a>
677
+ </div>
678
+ </div>
679
+
680
+ <div class="news-card">
681
+ <div class="news-img">
682
+ <img src="https://images.unsplash.com/photo-1523240795612-9a054b0db644?ixlib=rb-4.0.3&auto=format&fit=crop&w=1350&q=80" alt="Climate">
683
+ </div>
684
+ <div class="news-content">
685
+ <div class="news-date">June 10, 2023</div>
686
+ <h3>UK Leads Global Climate Initiative</h3>
687
+ <p>Britain has taken charge of a new international coalition to accelerate clean energy technology, with commitments from 15 major nations.</p>
688
+ <a href="#" class="btn">Read More</a>
689
+ </div>
690
+ </div>
691
+
692
+ <div class="news-card">
693
+ <div class="news-img">
694
+ <img src="https://images.unsplash.com/photo-1507679799987-c73779587ccf?ixlib=rb-4.0.3&auto=format&fit=crop&w=1351&q=80" alt="NHS">
695
+ </div>
696
+ <div class="news-content">
697
+ <div class="news-date">June 5, 2023</div>
698
+ <h3>NHS Waiting Times Reach Two-Year Low</h3>
699
+ <p>Healthcare reforms have reduced average waiting times by 18% since January, with particular improvements in A&E and cancer treatments.</p>
700
+ <a href="#" class="btn">Read More</a>
701
+ </div>
702
+ </div>
703
+ </div>
704
+ </div>
705
+ </section>
706
+
707
+ <section class="section cta">
708
+ <div class="container">
709
+ <h2>Be Part of the Change</h2>
710
+ <p>Britain needs fresh leadership with bold ideas. Join thousands of supporters across the country who believe in a better future.</p>
711
+ <div class="hero-btns">
712
+ <a href="#" class="btn">Donate</a>
713
+ <a href="#" class="btn btn-outline">Volunteer</a>
714
+ </div>
715
+ </div>
716
+ </section>
717
+
718
+ <footer id="contact">
719
+ <div class="container">
720
+ <div class="footer-content">
721
+ <div class="footer-column">
722
+ <h3>Campaign HQ</h3>
723
+ <p><i class="fas fa-map-marker-alt"></i> 123 Westminster, London SW1A 1AA</p>
724
+ <p><i class="fas fa-phone"></i> 020 7123 4567</p>
725
+ <p><i class="fas fa-envelope"></i> info@leonardforpm.uk</p>
726
+ <div class="social-links">
727
+ <a href="#"><i class="fab fa-facebook-f"></i></a>
728
+ <a href="#"><i class="fab fa-twitter"></i></a>
729
+ <a href="#"><i class="fab fa-instagram"></i></a>
730
+ <a href="#"><i class="fab fa-linkedin-in"></i></a>
731
+ <a href="#"><i class="fab fa-youtube"></i></a>
732
+ </div>
733
+ </div>
734
+
735
+ <div class="footer-column">
736
+ <h3>Quick Links</h3>
737
+ <ul>
738
+ <li><a href="#about">About David</a></li>
739
+ <li><a href="#policies">Our Policies</a></li>
740
+ <li><a href="#news">Latest News</a></li>
741
+ <li><a href="#">Events</a></li>
742
+ <li><a href="#">Endorsements</a></li>
743
+ </ul>
744
+ </div>
745
+
746
+ <div class="footer-column">
747
+ <h3>Get Involved</h3>
748
+ <ul>
749
+ <li><a href="#">Volunteer</a></li>
750
+ <li><a href="#">Donate</a></li>
751
+ <li><a href="#">Host an Event</a></li>
752
+ <li><a href="#">Join Our Team</a></li>
753
+ <li><a href="#">Voter Registration</a></li>
754
+ </ul>
755
+ </div>
756
+
757
+ <div class="footer-column">
758
+ <h3>Stay Updated</h3>
759
+ <p>Sign up for campaign updates and breaking political news.</p>
760
+ <form class="newsletter-form">
761
+ <input type="email" placeholder="Your email address" required>
762
+ <button type="submit" class="btn">Subscribe</button>
763
+ </form>
764
+ </div>
765
+ </div>
766
+
767
+ <div class="copyright">
768
+ <p>&copy; 2023 Leonard for PM. All rights reserved.</p>
769
+ </div>
770
+ </div>
771
+ </footer>
772
+
773
+ <script>
774
+ // Mobile menu toggle
775
+ const mobileMenuBtn = document.getElementById('mobileMenuBtn');
776
+ const navMenu = document.getElementById('navMenu');
777
+
778
+ mobileMenuBtn.addEventListener('click', () => {
779
+ navMenu.classList.toggle('show');
780
+ });
781
+
782
+ // Header scroll effect
783
+ const header = document.getElementById('header');
784
+
785
+ window.addEventListener('scroll', () => {
786
+ if (window.scrollY > 100) {
787
+ header.classList.add('scrolled');
788
+ } else {
789
+ header.classList.remove('scrolled');
790
+ }
791
+ });
792
+
793
+ // Smooth scrolling for anchor links
794
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
795
+ anchor.addEventListener('click', function(e) {
796
+ e.preventDefault();
797
+
798
+ // Close mobile menu if open
799
+ if (navMenu.classList.contains('show')) {
800
+ navMenu.classList.remove('show');
801
+ }
802
+
803
+ const target = document.querySelector(this.getAttribute('href'));
804
+ if (target) {
805
+ window.scrollTo({
806
+ top: target.offsetTop - 80,
807
+ behavior: 'smooth'
808
+ });
809
+ }
810
+ });
811
+ });
812
+ </script>
813
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <a href="https://enzostvs-deepsite.hf.space" style="color: #fff;" target="_blank" >DeepSite</a> <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;"></p></body>
814
+ </html>