chenwl commited on
Commit
f37a19c
·
verified ·
1 Parent(s): 47dfaaa

Add 2 files

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +436 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Red Alert 1
3
- emoji: 🐢
4
- colorFrom: purple
5
- colorTo: purple
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: red-alert-1
3
+ emoji: 🐳
4
+ colorFrom: gray
5
+ colorTo: gray
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,436 @@
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>Red Alert Command Center</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ @import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&display=swap');
11
+
12
+ body {
13
+ font-family: 'Orbitron', sans-serif;
14
+ background-color: #0a0a0a;
15
+ color: #e0e0e0;
16
+ overflow: hidden;
17
+ user-select: none;
18
+ }
19
+
20
+ .game-container {
21
+ background: linear-gradient(135deg, #1a1a1a 0%, #0a0a0a 100%);
22
+ border: 2px solid #3a3a3a;
23
+ box-shadow: 0 0 20px rgba(255, 50, 50, 0.3);
24
+ }
25
+
26
+ .minimap {
27
+ background: linear-gradient(135deg, #1a2a1a 0%, #0a1a0a 100%);
28
+ border: 2px solid #4a4a4a;
29
+ box-shadow: inset 0 0 10px rgba(0, 255, 0, 0.3);
30
+ }
31
+
32
+ .unit-button {
33
+ background: linear-gradient(135deg, #2a2a2a 0%, #1a1a1a 100%);
34
+ border: 1px solid #4a4a4a;
35
+ transition: all 0.2s;
36
+ }
37
+
38
+ .unit-button:hover {
39
+ background: linear-gradient(135deg, #3a3a3a 0%, #2a2a2a 100%);
40
+ border-color: #ff3232;
41
+ transform: translateY(-2px);
42
+ }
43
+
44
+ .unit-button:active {
45
+ transform: translateY(0);
46
+ }
47
+
48
+ .health-bar {
49
+ height: 4px;
50
+ background: linear-gradient(90deg, #ff3232 0%, #32ff32 100%);
51
+ }
52
+
53
+ .construction-progress {
54
+ animation: pulse 2s infinite;
55
+ }
56
+
57
+ @keyframes pulse {
58
+ 0% { opacity: 0.7; }
59
+ 50% { opacity: 1; }
60
+ 100% { opacity: 0.7; }
61
+ }
62
+
63
+ .selection-box {
64
+ position: absolute;
65
+ border: 1px dashed rgba(255, 255, 255, 0.7);
66
+ background-color: rgba(100, 200, 255, 0.1);
67
+ pointer-events: none;
68
+ }
69
+
70
+ .alert-flash {
71
+ animation: alertFlash 0.5s infinite alternate;
72
+ }
73
+
74
+ @keyframes alertFlash {
75
+ from { box-shadow: 0 0 5px rgba(255, 50, 50, 0.5); }
76
+ to { box-shadow: 0 0 20px rgba(255, 50, 50, 0.9); }
77
+ }
78
+ </style>
79
+ </head>
80
+ <body class="h-screen w-screen flex items-center justify-center p-4">
81
+ <div class="game-container relative w-full h-full rounded-lg overflow-hidden flex flex-col">
82
+ <!-- Top Bar -->
83
+ <div class="bg-gray-900 bg-opacity-90 p-2 flex justify-between items-center border-b border-gray-800">
84
+ <div class="flex items-center space-x-4">
85
+ <div class="text-red-500 font-bold text-xl">
86
+ <span class="text-gray-400">SOVIET</span> COMMAND CENTER
87
+ </div>
88
+ <div class="text-yellow-400 flex items-center">
89
+ <i class="fas fa-coins mr-1"></i>
90
+ <span id="credits">10,000</span>
91
+ </div>
92
+ <div class="text-blue-400 flex items-center">
93
+ <i class="fas fa-bolt mr-1"></i>
94
+ <span id="power">100/150</span>
95
+ </div>
96
+ </div>
97
+ <div class="flex items-center space-x-4">
98
+ <div class="text-green-400 flex items-center">
99
+ <i class="fas fa-user-shield mr-1"></i>
100
+ <span id="units">12/50</span>
101
+ </div>
102
+ <div class="text-purple-400 flex items-center">
103
+ <i class="fas fa-flask mr-1"></i>
104
+ <span id="tech-level">1</span>
105
+ </div>
106
+ <button id="options-btn" class="bg-gray-800 hover:bg-gray-700 px-3 py-1 rounded">
107
+ <i class="fas fa-cog"></i>
108
+ </button>
109
+ </div>
110
+ </div>
111
+
112
+ <!-- Main Game Area -->
113
+ <div class="flex flex-1 overflow-hidden">
114
+ <!-- Sidebar -->
115
+ <div class="w-64 bg-gray-900 bg-opacity-80 border-r border-gray-800 flex flex-col">
116
+ <!-- Construction Queue -->
117
+ <div class="p-2 border-b border-gray-800">
118
+ <div class="text-gray-400 text-sm mb-1">CONSTRUCTION QUEUE</div>
119
+ <div id="construction-queue" class="space-y-1">
120
+ <div class="construction-item bg-gray-800 p-1 rounded flex items-center">
121
+ <div class="w-8 h-8 bg-red-900 rounded mr-2 flex items-center justify-center">
122
+ <i class="fas fa-hard-hat text-yellow-400"></i>
123
+ </div>
124
+ <div class="flex-1">
125
+ <div class="text-xs">War Factory</div>
126
+ <div class="construction-progress h-1 bg-red-500 rounded-full mt-1" style="width: 45%"></div>
127
+ </div>
128
+ </div>
129
+ <div class="construction-item bg-gray-800 p-1 rounded flex items-center opacity-70">
130
+ <div class="w-8 h-8 bg-red-900 rounded mr-2 flex items-center justify-center">
131
+ <i class="fas fa-shield-alt text-blue-400"></i>
132
+ </div>
133
+ <div class="flex-1">
134
+ <div class="text-xs">Tesla Coil</div>
135
+ <div class="h-1 bg-gray-700 rounded-full mt-1"></div>
136
+ </div>
137
+ </div>
138
+ </div>
139
+ </div>
140
+
141
+ <!-- Unit Info -->
142
+ <div id="unit-info" class="p-2 border-b border-gray-800 flex-1">
143
+ <div class="text-gray-400 text-sm mb-1">SELECTED UNITS (3)</div>
144
+ <div class="bg-gray-800 rounded p-2 mb-2">
145
+ <div class="flex justify-between text-xs mb-1">
146
+ <span>Conscript Squad</span>
147
+ <span class="text-yellow-400">$100</span>
148
+ </div>
149
+ <div class="health-bar rounded-full mb-1"></div>
150
+ <div class="flex justify-between text-xs text-gray-400">
151
+ <span>Health: 75%</span>
152
+ <span>Rank: Veteran</span>
153
+ </div>
154
+ </div>
155
+ <div class="grid grid-cols-3 gap-2">
156
+ <button class="unit-button rounded p-2 flex flex-col items-center">
157
+ <i class="fas fa-running text-green-400 mb-1"></i>
158
+ <span class="text-xs">Move</span>
159
+ </button>
160
+ <button class="unit-button rounded p-2 flex flex-col items-center">
161
+ <i class="fas fa-crosshairs text-red-400 mb-1"></i>
162
+ <span class="text-xs">Attack</span>
163
+ </button>
164
+ <button class="unit-button rounded p-2 flex flex-col items-center">
165
+ <i class="fas fa-undo text-blue-400 mb-1"></i>
166
+ <span class="text-xs">Stop</span>
167
+ </button>
168
+ <button class="unit-button rounded p-2 flex flex-col items-center">
169
+ <i class="fas fa-vector-square text-yellow-400 mb-1"></i>
170
+ <span class="text-xs">Guard</span>
171
+ </button>
172
+ <button class="unit-button rounded p-2 flex flex-col items-center">
173
+ <i class="fas fa-people-carry text-purple-400 mb-1"></i>
174
+ <span class="text-xs">Capture</span>
175
+ </button>
176
+ <button class="unit-button rounded p-2 flex flex-col items-center">
177
+ <i class="fas fa-layer-group text-gray-400 mb-1"></i>
178
+ <span class="text-xs">Formation</span>
179
+ </button>
180
+ </div>
181
+ </div>
182
+
183
+ <!-- Build Menu -->
184
+ <div id="build-menu" class="p-2">
185
+ <div class="text-gray-400 text-sm mb-1">BUILD MENU</div>
186
+ <div class="grid grid-cols-2 gap-2">
187
+ <button class="unit-button rounded p-2 flex flex-col items-center">
188
+ <div class="w-10 h-10 bg-red-900 rounded-full mb-1 flex items-center justify-center">
189
+ <i class="fas fa-hard-hat text-yellow-400"></i>
190
+ </div>
191
+ <span class="text-xs">War Factory</span>
192
+ <span class="text-xs text-yellow-400">$2000</span>
193
+ </button>
194
+ <button class="unit-button rounded p-2 flex flex-col items-center">
195
+ <div class="w-10 h-10 bg-red-900 rounded-full mb-1 flex items-center justify-center">
196
+ <i class="fas fa-shield-alt text-blue-400"></i>
197
+ </div>
198
+ <span class="text-xs">Tesla Coil</span>
199
+ <span class="text-xs text-yellow-400">$1500</span>
200
+ </button>
201
+ <button class="unit-button rounded p-2 flex flex-col items-center">
202
+ <div class="w-10 h-10 bg-red-900 rounded-full mb-1 flex items-center justify-center">
203
+ <i class="fas fa-radiation text-green-400"></i>
204
+ </div>
205
+ <span class="text-xs">Nuclear Reactor</span>
206
+ <span class="text-xs text-yellow-400">$2500</span>
207
+ </button>
208
+ <button class="unit-button rounded p-2 flex flex-col items-center">
209
+ <div class="w-10 h-10 bg-red-900 rounded-full mb-1 flex items-center justify-center">
210
+ <i class="fas fa-flag text-red-400"></i>
211
+ </div>
212
+ <span class="text-xs">Barracks</span>
213
+ <span class="text-xs text-yellow-400">$1000</span>
214
+ </button>
215
+ </div>
216
+ </div>
217
+ </div>
218
+
219
+ <!-- Game View -->
220
+ <div class="flex-1 relative overflow-hidden" id="game-view">
221
+ <!-- This would be the actual game canvas in a real implementation -->
222
+ <div class="absolute inset-0 bg-gradient-to-br from-gray-900 to-gray-800 flex items-center justify-center">
223
+ <div class="text-center text-gray-600">
224
+ <i class="fas fa-gamepad text-5xl mb-4"></i>
225
+ <div>GAME VIEW AREA</div>
226
+ </div>
227
+
228
+ <!-- Example units -->
229
+ <div class="absolute top-1/4 left-1/4 w-12 h-12 bg-red-800 rounded-sm flex items-center justify-center cursor-pointer hover:bg-red-700 border border-red-900">
230
+ <i class="fas fa-tank text-gray-300"></i>
231
+ </div>
232
+ <div class="absolute top-1/3 left-1/3 w-12 h-12 bg-red-800 rounded-sm flex items-center justify-center cursor-pointer hover:bg-red-700 border border-red-900">
233
+ <i class="fas fa-soldier text-gray-300"></i>
234
+ </div>
235
+ <div class="absolute top-1/2 left-1/2 w-16 h-16 bg-red-900 rounded-sm flex items-center justify-center cursor-pointer hover:bg-red-800 border border-red-700">
236
+ <i class="fas fa-hard-hat text-yellow-400 text-xl"></i>
237
+ </div>
238
+ </div>
239
+
240
+ <!-- Selection box (hidden by default) -->
241
+ <div class="selection-box hidden" id="selection-box"></div>
242
+ </div>
243
+
244
+ <!-- Minimap -->
245
+ <div class="w-48 h-48 bg-gray-900 bg-opacity-80 border-l border-gray-800 flex flex-col">
246
+ <div class="p-1 text-center text-xs text-gray-400 border-b border-gray-800">TACTICAL MAP</div>
247
+ <div class="minimap flex-1 m-2 relative">
248
+ <!-- Minimap content -->
249
+ <div class="absolute inset-0">
250
+ <!-- This would be the actual minimap in a real implementation -->
251
+ <div class="w-full h-full relative">
252
+ <!-- Terrain -->
253
+ <div class="absolute top-0 left-0 w-full h-full bg-green-900 opacity-30"></div>
254
+ <!-- Units -->
255
+ <div class="absolute top-1/4 left-1/4 w-2 h-2 bg-red-500 rounded-full"></div>
256
+ <div class="absolute top-1/3 left-1/3 w-2 h-2 bg-red-500 rounded-full"></div>
257
+ <div class="absolute top-1/2 left-1/2 w-3 h-3 bg-red-700 rounded-sm"></div>
258
+ <!-- Viewport indicator -->
259
+ <div class="absolute border border-yellow-400" style="top: 20%; left: 20%; width: 30%; height: 30%;"></div>
260
+ </div>
261
+ </div>
262
+ </div>
263
+ <div class="p-1 flex justify-between">
264
+ <button class="text-xs px-2 py-1 bg-gray-800 hover:bg-gray-700 rounded">
265
+ <i class="fas fa-search-plus"></i>
266
+ </button>
267
+ <button class="text-xs px-2 py-1 bg-gray-800 hover:bg-gray-700 rounded">
268
+ <i class="fas fa-search-minus"></i>
269
+ </button>
270
+ <button class="text-xs px-2 py-1 bg-gray-800 hover:bg-gray-700 rounded">
271
+ <i class="fas fa-map-marked-alt"></i>
272
+ </button>
273
+ </div>
274
+ </div>
275
+ </div>
276
+
277
+ <!-- Bottom Bar -->
278
+ <div class="bg-gray-900 bg-opacity-90 p-1 flex justify-between items-center border-t border-gray-800">
279
+ <div class="flex items-center space-x-2">
280
+ <button id="sell-btn" class="px-2 py-1 bg-red-900 hover:bg-red-800 rounded text-xs">
281
+ <i class="fas fa-dollar-sign mr-1"></i> Sell
282
+ </button>
283
+ <button id="repair-btn" class="px-2 py-1 bg-blue-900 hover:bg-blue-800 rounded text-xs">
284
+ <i class="fas fa-wrench mr-1"></i> Repair
285
+ </button>
286
+ <div class="ml-2 text-xs text-gray-400">
287
+ <span id="game-time">12:34</span> |
288
+ <span id="game-date">June 5, 1946</span>
289
+ </div>
290
+ </div>
291
+ <div class="flex items-center space-x-2">
292
+ <button id="chat-btn" class="px-2 py-1 bg-gray-800 hover:bg-gray-700 rounded text-xs">
293
+ <i class="fas fa-comment-alt mr-1"></i> Chat
294
+ </button>
295
+ <button id="help-btn" class="px-2 py-1 bg-gray-800 hover:bg-gray-700 rounded text-xs">
296
+ <i class="fas fa-question-circle mr-1"></i> Help
297
+ </button>
298
+ <button id="menu-btn" class="px-2 py-1 bg-gray-800 hover:bg-gray-700 rounded text-xs">
299
+ <i class="fas fa-bars mr-1"></i> Menu
300
+ </button>
301
+ </div>
302
+ </div>
303
+
304
+ <!-- Alert Message -->
305
+ <div id="alert-message" class="absolute top-20 left-1/2 transform -translate-x-1/2 bg-red-900 bg-opacity-90 px-4 py-2 rounded-lg shadow-lg alert-flash hidden">
306
+ <div class="flex items-center">
307
+ <i class="fas fa-exclamation-triangle mr-2"></i>
308
+ <span>ENEMY UNITS DETECTED NEAR BASE!</span>
309
+ </div>
310
+ </div>
311
+ </div>
312
+
313
+ <script>
314
+ // Game state
315
+ let credits = 10000;
316
+ let power = 100;
317
+ let maxPower = 150;
318
+ let units = 12;
319
+ let maxUnits = 50;
320
+ let techLevel = 1;
321
+ let gameTime = 0;
322
+
323
+ // Selection state
324
+ let isSelecting = false;
325
+ let startX, startY;
326
+
327
+ // DOM elements
328
+ const gameView = document.getElementById('game-view');
329
+ const selectionBox = document.getElementById('selection-box');
330
+ const creditsDisplay = document.getElementById('credits');
331
+ const powerDisplay = document.getElementById('power');
332
+ const unitsDisplay = document.getElementById('units');
333
+ const techLevelDisplay = document.getElementById('tech-level');
334
+ const gameTimeDisplay = document.getElementById('game-time');
335
+ const gameDateDisplay = document.getElementById('game-date');
336
+ const alertMessage = document.getElementById('alert-message');
337
+
338
+ // Initialize game
339
+ function initGame() {
340
+ updateDisplays();
341
+ startGameClock();
342
+
343
+ // Show alert message after 3 seconds
344
+ setTimeout(() => {
345
+ showAlert("ENEMY UNITS DETECTED NEAR BASE!");
346
+ }, 3000);
347
+ }
348
+
349
+ // Update all displays
350
+ function updateDisplays() {
351
+ creditsDisplay.textContent = credits.toLocaleString();
352
+ powerDisplay.textContent = `${power}/${maxPower}`;
353
+ unitsDisplay.textContent = `${units}/${maxUnits}`;
354
+ techLevelDisplay.textContent = techLevel;
355
+ }
356
+
357
+ // Game clock
358
+ function startGameClock() {
359
+ setInterval(() => {
360
+ gameTime += 1;
361
+ const minutes = Math.floor(gameTime / 60);
362
+ const seconds = gameTime % 60;
363
+ gameTimeDisplay.textContent = `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
364
+
365
+ // Update date occasionally
366
+ if (gameTime % 300 === 0) {
367
+ const days = Math.floor(gameTime / 300);
368
+ gameDateDisplay.textContent = `June ${5 + days}, 1946`;
369
+ }
370
+ }, 1000);
371
+ }
372
+
373
+ // Show alert message
374
+ function showAlert(message) {
375
+ alertMessage.querySelector('span').textContent = message;
376
+ alertMessage.classList.remove('hidden');
377
+
378
+ setTimeout(() => {
379
+ alertMessage.classList.add('hidden');
380
+ }, 5000);
381
+ }
382
+
383
+ // Selection handling
384
+ gameView.addEventListener('mousedown', (e) => {
385
+ if (e.button === 0) { // Left mouse button
386
+ isSelecting = true;
387
+ startX = e.clientX - gameView.getBoundingClientRect().left;
388
+ startY = e.clientY - gameView.getBoundingClientRect().top;
389
+
390
+ selectionBox.style.left = `${startX}px`;
391
+ selectionBox.style.top = `${startY}px`;
392
+ selectionBox.style.width = '0';
393
+ selectionBox.style.height = '0';
394
+ selectionBox.classList.remove('hidden');
395
+ }
396
+ });
397
+
398
+ gameView.addEventListener('mousemove', (e) => {
399
+ if (isSelecting) {
400
+ const currentX = e.clientX - gameView.getBoundingClientRect().left;
401
+ const currentY = e.clientY - gameView.getBoundingClientRect().top;
402
+
403
+ selectionBox.style.left = `${Math.min(startX, currentX)}px`;
404
+ selectionBox.style.top = `${Math.min(startY, currentY)}px`;
405
+ selectionBox.style.width = `${Math.abs(currentX - startX)}px`;
406
+ selectionBox.style.height = `${Math.abs(currentY - startY)}px`;
407
+ }
408
+ });
409
+
410
+ gameView.addEventListener('mouseup', (e) => {
411
+ if (isSelecting && e.button === 0) {
412
+ isSelecting = false;
413
+ selectionBox.classList.add('hidden');
414
+
415
+ // In a real game, we'd select units within the box here
416
+ }
417
+ });
418
+
419
+ // Handle button clicks
420
+ document.querySelectorAll('.unit-button').forEach(button => {
421
+ button.addEventListener('click', () => {
422
+ // Add visual feedback
423
+ button.classList.add('bg-gray-700');
424
+ setTimeout(() => {
425
+ button.classList.remove('bg-gray-700');
426
+ }, 100);
427
+
428
+ // In a real game, execute the command
429
+ });
430
+ });
431
+
432
+ // Initialize the game when the page loads
433
+ window.addEventListener('load', initGame);
434
+ </script>
435
+ <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 <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=chenwl/red-alert-1" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
436
+ </html>