this string has no description
rsd
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>CNJTF - Concord Joint Task Force</title>
7 <script src="https://kit.fontawesome.com/0ca27f8db1.js" crossorigin="anonymous"></script>
8 <style>
9 :root {
10 --primary: #7f0000;
11 --primary-dark: #8d3f3f;
12 --bg-black: #000000;
13 --bg-gray: #0a0a0a;
14 --bg-card: #111111;
15 --text-white: #ffffff;
16 --text-gray: #a1a1aa;
17 --text-light: #d4d4d8;
18 --border: #8d3f3f;
19 }
20
21 * {
22 margin: 0;
23 padding: 0;
24 box-sizing: border-box;
25 }
26
27 body {
28 font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
29 background: var(--bg-black);
30 color: var(--text-white);
31 line-height: 1.7;
32 }
33
34 /* Navigation */
35 nav {
36 position: fixed;
37 top: 0;
38 left: 0;
39 right: 0;
40 background: rgba(0, 0, 0, 0.95);
41 backdrop-filter: blur(10px);
42 border-bottom: 1px solid var(--border);
43 padding: 1rem 0;
44 z-index: 1000;
45 }
46
47 nav .container {
48 max-width: 1200px;
49 margin: 0 auto;
50 padding: 0 2rem;
51 display: flex;
52 justify-content: space-between;
53 align-items: center;
54 }
55
56 .logo {
57 display: flex;
58 align-items: center;
59 gap: 0.75rem;
60 font-size: 1.5rem;
61 font-weight: 700;
62 color: var(--text-white);
63 letter-spacing: -0.5px;
64 }
65
66 .logo img {
67 width: 40px;
68 height: 40px;
69 object-fit: contain;
70 }
71
72 .nav-links {
73 display: flex;
74 gap: 2rem;
75 list-style: none;
76 }
77
78 .nav-links a {
79 color: var(--text-light);
80 text-decoration: none;
81 font-weight: 500;
82 font-size: 0.95rem;
83 transition: color 0.2s ease;
84 }
85
86 .nav-links a:hover {
87 color: var(--primary);
88 }
89
90 /* Container */
91 .container {
92 max-width: 1200px;
93 margin: 0 auto;
94 padding: 0 2rem;
95 }
96
97 /* Hero Section */
98 .hero {
99 padding: 8rem 0 6rem;
100 background:
101 linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.6)),
102 url('https://media.discordapp.net/attachments/1324271316492095489/1464268163242918073/611.png?ex=697c19be&is=697ac83e&hm=cf7bf8bb66f5c5c9e8b5c997d233e8367b46640422d0c439fe80fd267762690d&=&format=webp&quality=lossless&width=1078&height=606');
103 background-size: cover;
104 background-position: center;
105 background-attachment: scroll;
106 text-align: center;
107 margin-top: 64px;
108 position: relative;
109 }
110
111 .hero h1 {
112 font-size: 3.5rem;
113 font-weight: 800;
114 color: var(--text-white);
115 margin-bottom: 1rem;
116 letter-spacing: -1px;
117 text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
118 }
119
120 .hero .subtitle {
121 font-size: 1.5rem;
122 font-weight: 500;
123 color: var(--text-white);
124 margin-bottom: 1rem;
125 text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
126 }
127
128 .hero .tagline {
129 font-size: 1.1rem;
130 color: var(--text-light);
131 margin-bottom: 2.5rem;
132 text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
133 }
134
135 .cta-button {
136 display: inline-flex;
137 align-items: center;
138 gap: 0.5rem;
139 padding: 0.875rem 2rem;
140 background: var(--primary);
141 color: white;
142 font-weight: 600;
143 font-size: 1rem;
144 text-decoration: none;
145 border-radius: 8px;
146 transition: all 0.2s ease;
147 }
148
149 .cta-button:hover {
150 background: var(--primary-dark);
151 transform: translateY(-1px);
152 box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
153 }
154
155 /* Section Styling */
156 section {
157 padding: 5rem 0;
158 }
159
160 .section-title {
161 font-size: 2.5rem;
162 font-weight: 700;
163 color: var(--text-white);
164 margin-bottom: 0.5rem;
165 text-align: center;
166 letter-spacing: -0.5px;
167 }
168
169 .section-subtitle {
170 text-align: center;
171 color: var(--text-gray);
172 font-size: 1.1rem;
173 margin-bottom: 3rem;
174 }
175
176 /* About Section */
177 #about {
178 background: var(--bg-gray);
179 }
180
181 .about-content {
182 max-width: 900px;
183 margin: 0 auto;
184 text-align: center;
185 }
186
187 .about-content p {
188 font-size: 1.1rem;
189 color: var(--text-light);
190 line-height: 1.8;
191 margin-bottom: 1.5rem;
192 }
193
194 .stats-grid {
195 display: grid;
196 grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
197 gap: 2rem;
198 margin-top: 3rem;
199 }
200
201 .stat-card {
202 text-align: center;
203 padding: 2rem;
204 background: var(--bg-card);
205 border: 1px solid var(--border);
206 border-radius: 12px;
207 }
208
209 .stat-number {
210 font-size: 2.5rem;
211 font-weight: 800;
212 color: var(--primary);
213 margin-bottom: 0.5rem;
214 }
215
216 .stat-label {
217 color: var(--text-gray);
218 font-size: 0.95rem;
219 }
220
221 /* Subdivisions Grid */
222 #subdivisions {
223 background: var(--bg-black);
224 }
225
226 .subdivisions-grid {
227 display: grid;
228 grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
229 gap: 2rem;
230 margin-top: 3rem;
231 }
232
233 .subdivision-card {
234 background: var(--bg-card);
235 border: 1px solid var(--border);
236 border-radius: 12px;
237 padding: 2rem;
238 transition: all 0.2s ease;
239 }
240
241 .subdivision-card:hover {
242 box-shadow: 0 8px 30px rgba(37, 99, 235, 0.15);
243 transform: translateY(-4px);
244 border-color: var(--primary);
245 }
246
247 .subdivision-card h3 {
248 font-size: 1.5rem;
249 font-weight: 700;
250 color: var(--text-white);
251 margin-bottom: 0.75rem;
252 }
253
254 .subdivision-card .badge {
255 display: inline-block;
256 padding: 0.25rem 0.75rem;
257 background: rgba(37, 99, 235, 0.1);
258 color: var(--primary);
259 font-size: 0.8rem;
260 font-weight: 600;
261 border-radius: 20px;
262 margin-bottom: 1rem;
263 }
264
265 .subdivision-card p {
266 color: var(--text-gray);
267 line-height: 1.7;
268 margin-bottom: 1.5rem;
269 }
270
271 .subdivision-card ul {
272 list-style: none;
273 padding-left: 0;
274 }
275
276 .subdivision-card ul li {
277 color: var(--text-gray);
278 padding: 0.5rem 0;
279 padding-left: 1.5rem;
280 position: relative;
281 font-size: 0.95rem;
282 }
283
284 .subdivision-card ul li::before {
285 content: '•';
286 position: absolute;
287 left: 0;
288 color: var(--primary);
289 font-weight: bold;
290 }
291
292 /* Quick Links */
293 #links {
294 background: var(--bg-gray);
295 }
296
297 .quick-links-grid {
298 display: grid;
299 grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
300 gap: 1.5rem;
301 margin-top: 3rem;
302 }
303
304 .quick-link {
305 background: var(--bg-card);
306 border: 1px solid var(--border);
307 border-radius: 12px;
308 padding: 2rem;
309 text-align: center;
310 text-decoration: none;
311 color: var(--text-white);
312 transition: all 0.2s ease;
313 }
314
315 .quick-link:hover {
316 border-color: var(--primary);
317 box-shadow: 0 4px 20px rgba(37, 99, 235, 0.2);
318 transform: translateY(-2px);
319 }
320
321 .quick-link .icon {
322 font-size: 2.5rem;
323 margin-bottom: 1rem;
324 }
325
326 .quick-link h3 {
327 font-size: 1.1rem;
328 font-weight: 700;
329 margin-bottom: 0.5rem;
330 color: var(--text-white);
331 }
332
333 .quick-link p {
334 color: var(--text-gray);
335 font-size: 0.9rem;
336 }
337
338 /* Media Gallery */
339 #media {
340 background: var(--bg-black);
341 }
342
343 .media-gallery {
344 display: grid;
345 grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
346 gap: 2rem;
347 margin-top: 3rem;
348 }
349
350 .media-item {
351 position: relative;
352 aspect-ratio: 16/9;
353 background: var(--bg-card);
354 border: 1px solid var(--border);
355 border-radius: 12px;
356 overflow: hidden;
357 cursor: pointer;
358 transition: all 0.2s ease;
359 }
360
361 .media-item:hover {
362 transform: translateY(-4px);
363 box-shadow: 0 8px 30px rgba(37, 99, 235, 0.2);
364 border-color: var(--primary);
365 }
366
367 .media-placeholder {
368 width: 100%;
369 height: 100%;
370 display: flex;
371 align-items: center;
372 justify-content: center;
373 background: var(--bg-card);
374 font-size: 3rem;
375 color: var(--text-gray);
376 }
377
378 .media-caption {
379 position: absolute;
380 bottom: 0;
381 left: 0;
382 right: 0;
383 padding: 1rem;
384 background: linear-gradient(to top, rgba(0, 0, 0, 0.9), transparent);
385 color: white;
386 font-weight: 600;
387 font-size: 0.9rem;
388 opacity: 0;
389 transition: opacity 0.2s ease;
390 }
391
392 .media-item:hover .media-caption {
393 opacity: 1;
394 }
395
396 /* Footer */
397 footer {
398 background: var(--bg-gray);
399 border-top: 1px solid var(--border);
400 padding: 3rem 0 2rem;
401 margin-top: 0;
402 text-align: center;
403 }
404
405 footer .footer-content {
406 margin-bottom: 2rem;
407 }
408
409 footer h3 {
410 font-size: 1.25rem;
411 font-weight: 700;
412 color: var(--text-white);
413 margin-bottom: 0.5rem;
414 }
415
416 footer p {
417 color: var(--text-gray);
418 margin-bottom: 0.25rem;
419 font-size: 0.95rem;
420 }
421
422 .footer-links {
423 display: flex;
424 justify-content: center;
425 gap: 2rem;
426 margin-top: 1.5rem;
427 }
428
429 .footer-links a {
430 color: var(--text-gray);
431 text-decoration: none;
432 font-size: 0.9rem;
433 transition: color 0.2s ease;
434 }
435
436 .footer-links a:hover {
437 color: var(--primary);
438 }
439
440 .copyright {
441 color: var(--text-gray);
442 font-size: 0.85rem;
443 padding-top: 2rem;
444 border-top: 1px solid var(--border);
445 }
446
447 /* Responsive */
448 @media (max-width: 768px) {
449 .hero h1 {
450 font-size: 2.5rem;
451 }
452
453 .hero .subtitle {
454 font-size: 1.25rem;
455 }
456
457 .nav-links {
458 gap: 1rem;
459 flex-wrap: wrap;
460 }
461
462 .subdivisions-grid,
463 .quick-links-grid,
464 .media-gallery,
465 .stats-grid {
466 grid-template-columns: 1fr;
467 }
468
469 .section-title {
470 font-size: 2rem;
471 }
472 }
473 </style>
474</head>
475<body>
476 <!-- Navigation -->
477 <nav>
478 <div class="container">
479 <div class="logo">
480 <img src="https://media.discordapp.net/attachments/1404328302948253827/1408251443458211951/jtf_rsd.png?ex=697bffdc&is=697aae5c&hm=924d6d7177c2b16e99110508176ac6d45fefc9d7b9416c2cdab4d81544041b9a&=&format=webp&quality=lossless&width=710&height=710" alt="CNJTF Logo">
481 JTF-RSD
482 </div>
483 <ul class="nav-links">
484 <li><a href="#home">Home</a></li>
485 <li><a href="#about">About RSD</a></li>
486 <li><a href="#subdivisions">FMU</a></li>
487 <li><a href="#subdivisions">FPT</a></li>
488 <li><a href="#links">Resources</a></li>
489 <li><a href="#media">Media</a></li>
490 </ul>
491 </div>
492 </nav>
493
494 <!-- Hero Section -->
495 <section id="home" class="hero">
496 <div class="hero-content">
497 <h1>JTF-RSD</h1>
498 <div class="subtitle">Concord Joint Task Force Rescue Service Division </div>
499 <div class="tagline">idk what to put here</div>
500 <a href="https://discord.gg/your-invite-link" class="cta-button">
501 Subdivisions<i class="fa-solid fa-arrows-split-up-and-left"></i>
502 </a>
503 <a href="https://discord.gg/your-invite-link" class="cta-button">
504 About <i class="fa-solid fa-book"></i>
505 </a>
506 </div>
507 </section>
508
509 <!-- About Section -->
510 <section id="about">
511 <div class="container">
512 <h2 class="section-title">About RSD</h2>
513 <p class="section-subtitle">JTF Rescue Service Division</p>
514
515 <div class="about-content">
516 <p>
517Welcome to the Rescue Service Division of the Concord Joint Task Force. This is a roleplay-focused subdivision. Agents in this division will be deployed for Fire & EMS style operations.
518 </p>
519 <p></p>
520 </div>
521 </div>
522 </section>
523
524 <!-- Subdivisions Section -->
525 <section id="subdivisions">
526 <div class="container">
527 <h2 class="section-title">Subdivisions</h2>
528 <p class="section-subtitle">Specialized units operating in perfect coordination</p>
529
530 <div class="subdivisions-grid">
531 <div class="subdivision-card">
532 <div class="badge">RIU</div>
533 <h3>Rapid Intervention Unit</h3>
534 <p>Elite tactical unit specializing in high-risk operations, reconnaissance, and rapid response missions. Our operators are trained for the most demanding scenarios.</p>
535 <ul>
536 <li>Advanced combat tactics</li>
537 <li>Covert reconnaissance</li>
538 <li>Hostage rescue operations</li>
539 <li>Counter-terrorism missions</li>
540 </ul>
541 </div>
542
543 <div class="subdivision-card">
544 <div class="badge">RSD</div>
545 <h3>Rescue Service Division</h3>
546 <p>Maintaining order and discipline within the task force. Our MPs ensure security protocols are followed and handle internal investigations with precision.</p>
547 <ul>
548 <li>Base security operations</li>
549 <li>Law enforcement protocols</li>
550 <li>Investigation services</li>
551 <li>Detention management</li>
552 </ul>
553 </div>
554 </div>
555 </div>
556 </section>
557
558 <!-- Quick Links Section -->
559 <section id="links">
560 <div class="container">
561 <h2 class="section-title">Resources</h2>
562 <p class="section-subtitle">Essential resources and connections</p>
563
564 <div class="quick-links-grid">
565 <a href="https://www.roblox.com/games/your-game-id" class="quick-link">
566 <div class="icon">🎮</div>
567 <h3>Play Game</h3>
568 <p>Join CNJTF on Roblox</p>
569 </a>
570
571 <a href="https://discord.gg/your-invite-link" class="quick-link">
572 <div class="icon">💬</div>
573 <h3>Discord Server</h3>
574 <p>Connect with the community</p>
575 </a>
576
577 <a href="#" class="quick-link">
578 <div class="icon">📋</div>
579 <h3>Recruitment</h3>
580 <p>Join our ranks</p>
581 </a>
582
583 <a href="#" class="quick-link">
584 <div class="icon">📖</div>
585 <h3>Training Manual</h3>
586 <p>Learn tactics and procedures</p>
587 </a>
588
589 <a href="#" class="quick-link">
590 <div class="icon">🏆</div>
591 <h3>Leaderboards</h3>
592 <p>View top operatives</p>
593 </a>
594
595 <a href="#" class="quick-link">
596 <div class="icon">📰</div>
597 <h3>News & Updates</h3>
598 <p>Latest developments</p>
599 </a>
600
601 <a href="#" class="quick-link">
602 <div class="icon">⚙️</div>
603 <h3>Rules & Regulations</h3>
604 <p>Code of conduct</p>
605 </a>
606
607 <a href="#" class="quick-link">
608 <div class="icon">🎯</div>
609 <h3>Mission Archive</h3>
610 <p>Past operations</p>
611 </a>
612 </div>
613 </div>
614 </section>
615
616 <!-- Media Section -->
617 <section id="media">
618 <div class="container">
619 <h2 class="section-title">Media Gallery</h2>
620 <p class="section-subtitle">Screenshots from operations and training</p>
621
622 <div class="media-gallery">
623 <div class="media-item">
624 <div class="media-placeholder">📷</div>
625 <div class="media-caption">Base Operations Center</div>
626 </div>
627
628 <div class="media-item">
629 <div class="media-placeholder">📷</div>
630 <div class="media-caption">Special Operations Training</div>
631 </div>
632
633 <div class="media-item">
634 <div class="media-placeholder">📷</div>
635 <div class="media-caption">Air Support Mission</div>
636 </div>
637
638 <div class="media-item">
639 <div class="media-placeholder">📷</div>
640 <div class="media-caption">Formation Drill</div>
641 </div>
642
643 <div class="media-item">
644 <div class="media-placeholder">📷</div>
645 <div class="media-caption">Combat Patrol</div>
646 </div>
647
648 <div class="media-item">
649 <div class="media-placeholder">📷</div>
650 <div class="media-caption">Medical Training Exercise</div>
651 </div>
652
653 <div class="media-item">
654 <div class="media-placeholder">📷</div>
655 <div class="media-caption">Night Operations</div>
656 </div>
657
658 <div class="media-item">
659 <div class="media-placeholder">📷</div>
660 <div class="media-caption">Joint Task Force Assembly</div>
661 </div>
662
663 <div class="media-item">
664 <div class="media-placeholder">📷</div>
665 <div class="media-caption">Engineering Operations</div>
666 </div>
667 </div>
668
669 <p style="text-align: center; margin-top: 2rem; color: var(--text-gray);">
670 Replace the placeholder camera icons with your actual Roblox game screenshots
671 </p>
672 </div>
673 </section>
674
675 <!-- Footer -->
676 <footer>
677 <div class="container">
678 <div class="copyright">
679 © 2026 CNJTF - Concord Joint Task Force. All rights reserved.
680 <p>This is a fan made website, and is not offical</p>
681 </div>
682 </div>
683 </footer>
684
685 <script>
686 // Smooth scrolling for navigation links
687 document.querySelectorAll('a[href^="#"]').forEach(anchor => {
688 anchor.addEventListener('click', function (e) {
689 e.preventDefault();
690 const target = document.querySelector(this.getAttribute('href'));
691 if (target) {
692 target.scrollIntoView({
693 behavior: 'smooth',
694 block: 'start'
695 });
696 }
697 });
698 });
699 </script>
700</body>
701</html>