| <!DOCTYPE html> |
| <html lang="ru"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>TRAFFIC MASTER | Ссылки</title> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
| <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&family=Montserrat:wght@400;700&display=swap" rel="stylesheet"> |
| <style> |
| @import url('https://fonts.cdnfonts.com/css/suisse-intl'); |
| |
| body { |
| font-family: 'Inter', 'Montserrat', 'Suisse Int\'l', sans-serif; |
| background-color: #000; |
| color: #E1E1E1; |
| letter-spacing: 0.03em; |
| overflow: hidden; |
| position: relative; |
| } |
| |
| .btn-hover-effect { |
| transition: all 0.3s ease; |
| transform: translateY(0); |
| } |
| |
| .btn-hover-effect:hover { |
| transform: translateY(-3px); |
| box-shadow: 0 10px 20px rgba(246, 252, 121, 0.2); |
| } |
| |
| .logo-text { |
| font-weight: 700; |
| text-transform: uppercase; |
| } |
| |
| .logo-traffic { |
| color: #f6fc79; |
| } |
| |
| .logo-master { |
| color: #E1E1E1; |
| } |
| |
| .divider { |
| height: 1px; |
| background: linear-gradient(90deg, transparent, rgba(246, 252, 121, 0.5), transparent); |
| } |
| |
| |
| .particles { |
| position: absolute; |
| top: 0; |
| left: 0; |
| width: 100%; |
| height: 100%; |
| z-index: -1; |
| } |
| |
| .particle { |
| position: absolute; |
| background-color: rgba(246, 252, 121, 0.3); |
| border-radius: 50%; |
| pointer-events: none; |
| } |
| |
| |
| .gradient-bars { |
| position: absolute; |
| top: 0; |
| left: 0; |
| width: 100%; |
| height: 100%; |
| z-index: -1; |
| opacity: 0.1; |
| } |
| |
| .gradient-bar { |
| position: absolute; |
| height: 100%; |
| width: 2px; |
| background: linear-gradient(to bottom, transparent, #f6fc79, transparent); |
| } |
| </style> |
| </head> |
| <body class="min-h-screen flex flex-col items-center justify-center p-4"> |
| |
| <div class="particles" id="particles"></div> |
| <div class="gradient-bars" id="gradient-bars"></div> |
| |
| <div class="w-full max-w-md mx-auto text-center relative z-10"> |
| |
| <div class="mb-10"> |
| <h1 class="text-4xl md:text-5xl font-bold tracking-tight"> |
| <span class="logo-text logo-traffic">TRAFFIC</span> |
| <span class="logo-text logo-master">MASTER</span> |
| </h1> |
| <p class="mt-4 text-sm uppercase tracking-widest opacity-70">АРБИТРАЖ НЕ ДЛЯ ВСЕХ. НО ЕСЛИ ТЫ ВОШЕЛ — ТЫ В ИГРЕ.</p> |
| </div> |
| |
| |
| <div class="space-y-4 mb-8"> |
| <a href="#" class="block"> |
| <div class="btn-hover-effect bg-[#f6fc79] hover:bg-[#f7ff9f] text-black font-bold py-4 px-6 rounded-lg flex items-center justify-center"> |
| <i class="fab fa-instagram text-xl mr-3"></i> |
| <span>INSTAGRAM</span> |
| </div> |
| </a> |
| |
| <a href="#" class="block"> |
| <div class="btn-hover-effect bg-[#f6fc79] hover:bg-[#f7ff9f] text-black font-bold py-4 px-6 rounded-lg flex items-center justify-center"> |
| <i class="fab fa-telegram text-xl mr-3"></i> |
| <span>TELEGRAM</span> |
| </div> |
| </a> |
| |
| <a href="#" class="block"> |
| <div class="btn-hover-effect bg-[#f6fc79] hover:bg-[#f7ff9f] text-black font-bold py-4 px-6 rounded-lg flex items-center justify-center"> |
| <i class="fab fa-whatsapp text-xl mr-3"></i> |
| <span>WHATSAPP</span> |
| </div> |
| </a> |
| |
| <a href="#" class="block"> |
| <div class="btn-hover-effect bg-[#f6fc79] hover:bg-[#f7ff9f] text-black font-bold py-4 px-6 rounded-lg flex items-center justify-center"> |
| <i class="fab fa-vk text-xl mr-3"></i> |
| <span>VKONTAKTE</span> |
| </div> |
| </a> |
| |
| <a href="#" class="block"> |
| <div class="btn-hover-effect bg-[#f6fc79] hover:bg-[#f7ff9f] text-black font-bold py-4 px-6 rounded-lg flex items-center justify-center"> |
| <i class="fas fa-globe text-xl mr-3"></i> |
| <span>САЙТ КУРСА</span> |
| </div> |
| </a> |
| |
| <a href="#" class="block"> |
| <div class="btn-hover-effect bg-[#f6fc79] hover:bg-[#f7ff9f] text-black font-bold py-4 px-6 rounded-lg flex items-center justify-center"> |
| <i class="fas fa-video text-xl mr-3"></i> |
| <span>ВЕБИНАР</span> |
| </div> |
| </a> |
| |
| <a href="#" class="block"> |
| <div class="btn-hover-effect bg-[#f6fc79] hover:bg-[#f7ff9f] text-black font-bold py-4 px-6 rounded-lg flex items-center justify-center"> |
| <i class="fas fa-headset text-xl mr-3"></i> |
| <span>МЕНЕДЖЕР ПОДДЕРЖКИ</span> |
| </div> |
| </a> |
| </div> |
| |
| |
| <div class="divider my-6"></div> |
| |
| |
| <div class="text-xs uppercase tracking-widest opacity-50"> |
| <p>© 2023 TRAFFIC MASTER</p> |
| <p class="mt-2">АРБИТРАЖ ТРАФИКА — ЭТО СТИЛЬ ЖИЗНИ</p> |
| </div> |
| </div> |
| |
| <script> |
| |
| document.addEventListener('DOMContentLoaded', () => { |
| const buttons = document.querySelectorAll('.btn-hover-effect'); |
| |
| buttons.forEach((btn, index) => { |
| setTimeout(() => { |
| btn.classList.add('opacity-0'); |
| btn.style.transform = 'translateY(20px)'; |
| |
| setTimeout(() => { |
| btn.classList.remove('opacity-0'); |
| btn.style.transform = 'translateY(0)'; |
| btn.style.transition = 'all 0.5s ease'; |
| }, 50); |
| }, index * 100); |
| }); |
| |
| |
| const particlesContainer = document.getElementById('particles'); |
| const particleCount = 30; |
| |
| for (let i = 0; i < particleCount; i++) { |
| const particle = document.createElement('div'); |
| particle.classList.add('particle'); |
| |
| |
| const size = Math.random() * 5 + 1; |
| const posX = Math.random() * window.innerWidth; |
| const posY = Math.random() * window.innerHeight; |
| const delay = Math.random() * 5; |
| const duration = Math.random() * 10 + 5; |
| |
| particle.style.width = `${size}px`; |
| particle.style.height = `${size}px`; |
| particle.style.left = `${posX}px`; |
| particle.style.top = `${posY}px`; |
| particle.style.animation = `float ${duration}s ease-in-out ${delay}s infinite`; |
| |
| particlesContainer.appendChild(particle); |
| } |
| |
| |
| const gradientBarsContainer = document.getElementById('gradient-bars'); |
| const barCount = 10; |
| |
| for (let i = 0; i < barCount; i++) { |
| const bar = document.createElement('div'); |
| bar.classList.add('gradient-bar'); |
| |
| const posX = (i / barCount) * 100 + '%'; |
| const opacity = Math.random() * 0.1 + 0.05; |
| const height = Math.random() * 50 + 50 + '%'; |
| const delay = Math.random() * 5; |
| |
| bar.style.left = posX; |
| bar.style.opacity = opacity; |
| bar.style.height = height; |
| bar.style.animation = `pulse 8s ease-in-out ${delay}s infinite`; |
| |
| gradientBarsContainer.appendChild(bar); |
| } |
| }); |
| |
| |
| const style = document.createElement('style'); |
| style.textContent = ` |
| @keyframes float { |
| 0%, 100% { |
| transform: translateY(0) translateX(0); |
| opacity: 0.3; |
| } |
| 50% { |
| transform: translateY(-20px) translateX(10px); |
| opacity: 0.8; |
| } |
| } |
| |
| @keyframes pulse { |
| 0%, 100% { |
| opacity: 0.1; |
| } |
| 50% { |
| opacity: 0.3; |
| } |
| } |
| `; |
| document.head.appendChild(style); |
| </script> |
| <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=timoon811/taplink" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
| </html> |
