portfolio / index.html
simplyyyXinfinity's picture
Add 2 files
5d91b70 verified
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Prince Barai | Cybersecurity Prodigy</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">
<style>
@keyframes matrixRain {
0% { transform: translateY(-100%); opacity: 1; }
100% { transform: translateY(100vh); opacity: 0; }
}
@keyframes float {
0% { transform: translateY(0px); }
50% { transform: translateY(-20px); }
100% { transform: translateY(0px); }
}
@keyframes pulse {
0% { box-shadow: 0 0 0 0 rgba(0, 120, 215, 0.7); }
70% { box-shadow: 0 0 0 15px rgba(0, 120, 215, 0); }
100% { box-shadow: 0 0 0 0 rgba(0, 120, 215, 0); }
}
@keyframes typing {
from { width: 0 }
to { width: 100% }
}
@keyframes blink {
from, to { border-color: transparent }
50% { border-color: #0078D7 }
}
.matrix-char {
position: absolute;
color: #0078D7;
font-family: 'Courier New', monospace;
animation: matrixRain 3s linear infinite;
user-select: none;
}
.floating {
animation: float 6s ease-in-out infinite;
}
.pulse {
animation: pulse 2s infinite;
}
.typing {
overflow: hidden;
white-space: nowrap;
border-right: 3px solid;
animation: typing 3.5s steps(40, end), blink 0.75s step-end infinite;
}
.glow-text {
text-shadow: 0 0 10px rgba(0, 120, 215, 0.7);
}
.hexagon {
clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}
.skill-bar {
transition: width 1.5s ease-in-out;
}
.terminal {
background: rgba(0, 0, 0, 0.8);
box-shadow: 0 0 30px rgba(0, 120, 215, 0.3);
border: 1px solid rgba(0, 120, 215, 0.2);
}
.terminal::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 30px;
background: rgba(0, 120, 215, 0.1);
border-bottom: 1px solid rgba(0, 120, 215, 0.2);
}
.terminal-dots {
position: absolute;
top: 10px;
left: 15px;
}
.terminal-dot {
width: 12px;
height: 12px;
border-radius: 50%;
display: inline-block;
margin-right: 8px;
}
.dot-red { background: #FF5F56; }
.dot-yellow { background: #FFBD2E; }
.dot-green { background: #27C93F; }
.rain-effect {
position: absolute;
width: 100%;
height: 100%;
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 800 800"><path d="M400 0L200 400h400L400 0zm0 800L200 400h400L400 800z" fill="%230078D7" opacity="0.03"/></svg>');
opacity: 0.1;
pointer-events: none;
}
</style>
</head>
<body class="bg-black text-gray-100 min-h-screen font-mono overflow-x-hidden">
<!-- Matrix Rain Background -->
<div id="matrixRain" class="fixed inset-0 overflow-hidden z-0 opacity-10"></div>
<div class="rain-effect fixed inset-0 z-0"></div>
<!-- Header -->
<header class="relative z-10 py-20 px-4 md:px-0">
<div class="container mx-auto">
<div class="terminal rounded-lg p-8 max-w-4xl mx-auto relative overflow-hidden">
<div class="terminal-dots">
<span class="terminal-dot dot-red"></span>
<span class="terminal-dot dot-yellow"></span>
<span class="terminal-dot dot-green"></span>
</div>
<div class="mt-10">
<h1 class="text-4xl md:text-6xl font-bold mb-4 text-blue-400 glow-text">
<span class="typing">Prince Barai</span>
</h1>
<div class="text-xl md:text-2xl text-gray-300 mb-8">
<span class="text-blue-400">root@prince:~#</span> Cybersecurity Researcher | Ethical Hacker | Microsoft Ambassador
</div>
<div class="text-gray-400 mb-2">$ whoami</div>
<div class="text-gray-300 mb-8 leading-relaxed">
Red Teamer by heart, bug bounty hunter by profession. I break things to make them stronger.
Currently fortifying the digital world while studying Cybersecurity at Parul University.
</div>
<div class="flex flex-wrap gap-4">
<a href="#contact" class="bg-blue-600 hover:bg-blue-700 px-6 py-3 rounded font-medium transition flex items-center group">
<i class="fas fa-terminal mr-2 group-hover:animate-pulse"></i> Contact Me
</a>
<a href="#projects" class="border border-blue-600 text-blue-400 hover:bg-blue-900 hover:bg-opacity-30 px-6 py-3 rounded font-medium transition flex items-center group">
<i class="fas fa-code mr-2 group-hover:rotate-90 transition-transform"></i> View Exploits
</a>
</div>
</div>
</div>
</div>
</header>
<!-- Main Content -->
<main class="relative z-10 container mx-auto px-4 py-12">
<!-- About Section -->
<section id="about" class="mb-24">
<div class="flex flex-col lg:flex-row items-center gap-12">
<div class="lg:w-1/3 flex justify-center">
<div class="hexagon bg-gray-900 w-64 h-64 flex items-center justify-center border-2 border-blue-400 relative floating pulse">
<i class="fas fa-user-secret text-6xl text-blue-400"></i>
<div class="absolute inset-0 border-2 border-blue-400 rounded-full opacity-70 animate-ping"></div>
</div>
</div>
<div class="lg:w-2/3">
<h2 class="text-3xl font-bold mb-8 text-blue-400 flex items-center">
<i class="fas fa-id-card mr-3"></i> About The Hacker
</h2>
<div class="bg-gray-900 bg-opacity-70 rounded-lg p-6 border border-gray-800">
<p class="text-gray-300 mb-6 leading-relaxed">
Second-year B.Tech Cybersecurity student who finds peace in the sound of rain and harmony in nature's rhythm.
Core member of TryHackMe and The Hackers Meet-Up, specializing in offensive security with a passion for AI security.
</p>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="flex items-start">
<i class="fas fa-shield-alt text-blue-400 mt-1 mr-3"></i>
<div>
<h3 class="font-bold text-white">Affiliations</h3>
<p class="text-gray-400">Beta Microsoft Learn Student Ambassador</p>
<p class="text-gray-400">TryHackMe Top Learner</p>
</div>
</div>
<div class="flex items-start">
<i class="fas fa-bug text-blue-400 mt-1 mr-3"></i>
<div>
<h3 class="font-bold text-white">Specialties</h3>
<p class="text-gray-400">Penetration Testing</p>
<p class="text-gray-400">AI Security Research</p>
</div>
</div>
<div class="flex items-start">
<i class="fas fa-heart text-blue-400 mt-1 mr-3"></i>
<div>
<h3 class="font-bold text-white">Loyalties</h3>
<p class="text-gray-400">Microsoft Defender</p>
<p class="text-gray-400">Google Inspired</p>
</div>
</div>
<div class="flex items-start">
<i class="fas fa-trophy text-blue-400 mt-1 mr-3"></i>
<div>
<h3 class="font-bold text-white">Achievements</h3>
<p class="text-gray-400">Multiple CTF Wins</p>
<p class="text-gray-400">Azure AI Event Host</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Projects Section -->
<section id="projects" class="mb-24">
<h2 class="text-3xl font-bold mb-12 text-center text-blue-400">
<i class="fas fa-project-diagram mr-3"></i> My Exploits (The Legal Kind)
</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<!-- Project 1 -->
<div class="group relative overflow-hidden rounded-lg border border-gray-800 hover:border-blue-400 transition-all duration-500">
<div class="h-48 bg-gradient-to-br from-gray-900 to-black flex items-center justify-center">
<i class="fas fa-lock text-6xl text-blue-400 group-hover:scale-110 transition-transform duration-500"></i>
</div>
<div class="absolute inset-0 bg-gradient-to-t from-black to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
<div class="p-6 bg-gray-900 bg-opacity-70">
<h3 class="text-xl font-bold mb-2 text-blue-400">LockChat</h3>
<p class="text-gray-400 mb-4">
Encrypted chat application with military-grade encryption, dark mode, and emoji support.
Built with end-to-end encryption and secure user authentication.
</p>
<div class="flex flex-wrap gap-2">
<span class="bg-gray-800 text-blue-400 text-xs px-3 py-1 rounded-full">Encryption</span>
<span class="bg-gray-800 text-blue-400 text-xs px-3 py-1 rounded-full">React</span>
<span class="bg-gray-800 text-blue-400 text-xs px-3 py-1 rounded-full">Node.js</span>
</div>
</div>
</div>
<!-- Project 2 -->
<div class="group relative overflow-hidden rounded-lg border border-gray-800 hover:border-blue-400 transition-all duration-500">
<div class="h-48 bg-gradient-to-br from-gray-900 to-black flex items-center justify-center">
<i class="fas fa-vote-yea text-6xl text-blue-400 group-hover:scale-110 transition-transform duration-500"></i>
</div>
<div class="absolute inset-0 bg-gradient-to-t from-black to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
<div class="p-6 bg-gray-900 bg-opacity-70">
<h3 class="text-xl font-bold mb-2 text-blue-400">Secure Blockchain Voting</h3>
<p class="text-gray-400 mb-4">
Tamper-proof voting platform using blockchain technology to ensure transparency
and prevent electoral fraud. Each vote is cryptographically secured.
</p>
<div class="flex flex-wrap gap-2">
<span class="bg-gray-800 text-blue-400 text-xs px-3 py-1 rounded-full">Blockchain</span>
<span class="bg-gray-800 text-blue-400 text-xs px-3 py-1 rounded-full">Solidity</span>
<span class="bg-gray-800 text-blue-400 text-xs px-3 py-1 rounded-full">Ethereum</span>
</div>
</div>
</div>
<!-- Project 3 -->
<div class="group relative overflow-hidden rounded-lg border border-gray-800 hover:border-blue-400 transition-all duration-500">
<div class="h-48 bg-gradient-to-br from-gray-900 to-black flex items-center justify-center">
<i class="fas fa-chart-line text-6xl text-blue-400 group-hover:scale-110 transition-transform duration-500"></i>
</div>
<div class="absolute inset-0 bg-gradient-to-t from-black to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
<div class="p-6 bg-gray-900 bg-opacity-70">
<h3 class="text-xl font-bold mb-2 text-blue-400">District Integrated Dashboard</h3>
<p class="text-gray-400 mb-4">
Smart administration tool for real-time district management with data visualization,
project tracking, and secure communication channels for officials.
</p>
<div class="flex flex-wrap gap-2">
<span class="bg-gray-800 text-blue-400 text-xs px-3 py-1 rounded-full">DataViz</span>
<span class="bg-gray-800 text-blue-400 text-xs px-3 py-1 rounded-full">Python</span>
<span class="bg-gray-800 text-blue-400 text-xs px-3 py-1 rounded-full">Django</span>
</div>
</div>
</div>
<!-- Project 4 -->
<div class="group relative overflow-hidden rounded-lg border border-gray-800 hover:border-blue-400 transition-all duration-500">
<div class="h-48 bg-gradient-to-br from-gray-900 to-black flex items-center justify-center">
<i class="fas fa-toolbox text-6xl text-blue-400 group-hover:scale-110 transition-transform duration-500"></i>
</div>
<div class="absolute inset-0 bg-gradient-to-t from-black to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
<div class="p-6 bg-gray-900 bg-opacity-70">
<h3 class="text-xl font-bold mb-2 text-blue-400">All-in-One Cybersecurity Toolkit</h3>
<p class="text-gray-400 mb-4">
Swiss Army knife for security professionals featuring port scanning, XSS automation,
brute-forcing, SQLi detection, phishing email generation, and malware analysis tools.
</p>
<div class="flex flex-wrap gap-2">
<span class="bg-gray-800 text-blue-400 text-xs px-3 py-1 rounded-full">Python</span>
<span class="bg-gray-800 text-blue-400 text-xs px-3 py-1 rounded-full">Security</span>
<span class="bg-gray-800 text-blue-400 text-xs px-3 py-1 rounded-full">Automation</span>
</div>
</div>
</div>
</div>
</section>
<!-- Blog Section -->
<section id="blog" class="mb-24">
<h2 class="text-3xl font-bold mb-12 text-center text-blue-400">
<i class="fas fa-keyboard mr-3"></i> Hacker's Journal
</h2>
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
<!-- Article 1 -->
<div class="group relative overflow-hidden rounded-lg border border-gray-800 hover:border-blue-400 transition-all duration-300 h-full flex flex-col">
<div class="h-40 bg-gradient-to-br from-gray-900 to-black flex items-center justify-center">
<i class="fas fa-laptop-code text-5xl text-blue-400 group-hover:scale-110 transition-transform duration-300"></i>
</div>
<div class="p-6 bg-gray-900 bg-opacity-70 flex-grow">
<h3 class="text-xl font-bold mb-3 text-blue-400">Developer Security 101</h3>
<p class="text-gray-400 mb-4">
How to write code that doesn't make security professionals cry. Common pitfalls
and how to avoid them, explained with funny memes and real-world analogies.
</p>
<div class="mt-auto">
<span class="text-blue-400 text-sm">Read Time: 8 min</span>
</div>
</div>
</div>
<!-- Article 2 -->
<div class="group relative overflow-hidden rounded-lg border border-gray-800 hover:border-blue-400 transition-all duration-300 h-full flex flex-col">
<div class="h-40 bg-gradient-to-br from-gray-900 to-black flex items-center justify-center">
<i class="fab fa-python text-5xl text-blue-400 group-hover:scale-110 transition-transform duration-300"></i>
</div>
<div class="p-6 bg-gray-900 bg-opacity-70 flex-grow">
<h3 class="text-xl font-bold mb-3 text-blue-400">Python Security Pitfalls</h3>
<p class="text-gray-400 mb-4">
Why your Python scripts might be giving hackers free access to your systems.
Learn secure coding practices with hands-on vulnerable code examples.
</p>
<div class="mt-auto">
<span class="text-blue-400 text-sm">Read Time: 12 min</span>
</div>
</div>
</div>
<!-- Article 3 -->
<div class="group relative overflow-hidden rounded-lg border border-gray-800 hover:border-blue-400 transition-all duration-300 h-full flex flex-col">
<div class="h-40 bg-gradient-to-br from-gray-900 to-black flex items-center justify-center">
<i class="fas fa-robot text-5xl text-blue-400 group-hover:scale-110 transition-transform duration-300"></i>
</div>
<div class="p-6 bg-gray-900 bg-opacity-70 flex-grow">
<h3 class="text-xl font-bold mb-3 text-blue-400">Security in the Age of AI</h3>
<p class="text-gray-400 mb-4">
How artificial intelligence is changing the cybersecurity landscape. Both as
a weapon and a shield, with practical examples from my research.
</p>
<div class="mt-auto">
<span class="text-blue-400 text-sm">Read Time: 15 min</span>
</div>
</div>
</div>
</div>
<div class="text-center mt-10">
<a href="#" class="border border-blue-600 text-blue-400 hover:bg-blue-900 hover:bg-opacity-30 px-6 py-3 rounded font-medium transition inline-flex items-center group">
<i class="fas fa-book-open mr-2 group-hover:animate-bounce"></i> Read All Articles
</a>
</div>
</section>
<!-- Certifications Section -->
<section id="certifications" class="mb-24">
<h2 class="text-3xl font-bold mb-12 text-center text-blue-400">
<i class="fas fa-certificate mr-3"></i> Badges of Honor
</h2>
<div class="grid grid-cols-2 md:grid-cols-4 gap-6">
<div class="bg-gray-900 bg-opacity-70 rounded-lg p-6 border border-gray-800 hover:border-blue-400 transition-all duration-300 text-center">
<div class="text-5xl text-blue-400 mb-4">
<i class="fab fa-microsoft"></i>
</div>
<h3 class="text-lg font-bold text-white mb-2">Beta Microsoft Learn Student Ambassador</h3>
<p class="text-gray-400 text-sm">Recognized for technical expertise and community leadership</p>
</div>
<div class="bg-gray-900 bg-opacity-70 rounded-lg p-6 border border-gray-800 hover:border-blue-400 transition-all duration-300 text-center">
<div class="text-5xl text-blue-400 mb-4">
<i class="fas fa-shield-alt"></i>
</div>
<h3 class="text-lg font-bold text-white mb-2">TryHackMe Top Learner</h3>
<p class="text-gray-400 text-sm">Completed 100+ rooms with top 1% ranking</p>
</div>
<div class="bg-gray-900 bg-opacity-70 rounded-lg p-6 border border-gray-800 hover:border-blue-400 transition-all duration-300 text-center">
<div class="text-5xl text-blue-400 mb-4">
<i class="fas fa-chess-knight"></i>
</div>
<h3 class="text-lg font-bold text-white mb-2">Hack The Box Active Hacker</h3>
<p class="text-gray-400 text-sm">Rooted 50+ machines with advanced penetration techniques</p>
</div>
<div class="bg-gray-900 bg-opacity-70 rounded-lg p-6 border border-gray-800 hover:border-blue-400 transition-all duration-300 text-center">
<div class="text-5xl text-blue-400 mb-4">
<i class="fas fa-flag"></i>
</div>
<h3 class="text-lg font-bold text-white mb-2">CTF Champion</h3>
<p class="text-gray-400 text-sm">Multiple Capture The Flag wins in national competitions</p>
</div>
</div>
</section>
<!-- Contact Section -->
<section id="contact" class="mb-12">
<h2 class="text-3xl font-bold mb-12 text-center text-blue-400">
<i class="fas fa-user-secret mr-3"></i> Secure Comms
</h2>
<div class="flex flex-col lg:flex-row gap-12">
<div class="lg:w-1/2">
<div class="bg-gray-900 bg-opacity-70 rounded-lg p-8 border border-gray-800 h-full">
<h3 class="text-2xl font-bold mb-6 text-blue-400">Direct Message</h3>
<form class="space-y-6">
<div>
<label for="name" class="block text-gray-300 mb-2">Your Alias</label>
<input type="text" id="name" class="w-full bg-gray-800 border border-gray-700 rounded-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent">
</div>
<div>
<label for="email" class="block text-gray-300 mb-2">Secure Contact</label>
<input type="email" id="email" class="w-full bg-gray-800 border border-gray-700 rounded-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent" placeholder="e.g. protonmail@securedomain.com">
</div>
<div>
<label for="message" class="block text-gray-300 mb-2">Encrypted Message</label>
<textarea id="message" rows="5" class="w-full bg-gray-800 border border-gray-700 rounded-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent" placeholder="Your message will be encrypted with PGP"></textarea>
</div>
<div class="flex items-center">
<input id="secure-check" type="checkbox" class="w-4 h-4 bg-gray-800 border-gray-700 rounded focus:ring-blue-500">
<label for="secure-check" class="ml-2 text-sm text-gray-400">I understand this communication will be encrypted</label>
</div>
<button type="submit" class="w-full bg-blue-600 hover:bg-blue-700 px-6 py-4 rounded-lg font-bold transition flex items-center justify-center group">
<i class="fas fa-lock mr-2 group-hover:animate-bounce"></i> Send Encrypted Message
</button>
</form>
</div>
</div>
<div class="lg:w-1/2">
<div class="bg-gray-900 bg-opacity-70 rounded-lg p-8 border border-gray-800 h-full">
<h3 class="text-2xl font-bold mb-6 text-blue-400">Other Channels</h3>
<div class="space-y-6">
<a href="https://github.com/princebarai" target="_blank" class="flex items-center p-4 bg-gray-800 rounded-lg hover:bg-gray-700 transition group">
<div class="bg-black p-3 rounded-full mr-4 group-hover:bg-blue-900 transition">
<i class="fab fa-github text-2xl text-blue-400"></i>
</div>
<div>
<h4 class="font-bold text-white">GitHub</h4>
<p class="text-gray-400">github.com/princebarai</p>
</div>
<div class="ml-auto text-blue-400">
<i class="fas fa-external-link-alt"></i>
</div>
</a>
<a href="https://linkedin.com/in/princebarai" target="_blank" class="flex items-center p-4 bg-gray-800 rounded-lg hover:bg-gray-700 transition group">
<div class="bg-black p-3 rounded-full mr-4 group-hover:bg-blue-900 transition">
<i class="fab fa-linkedin-in text-2xl text-blue-400"></i>
</div>
<div>
<h4 class="font-bold text-white">LinkedIn</h4>
<p class="text-gray-400">linkedin.com/in/princebarai</p>
</div>
<div class="ml-auto text-blue-400">
<i class="fas fa-external-link-alt"></i>
</div>
</a>
<a href="https://instagram.com/princebarai" target="_blank" class="flex items-center p-4 bg-gray-800 rounded-lg hover:bg-gray-700 transition group">
<div class="bg-black p-3 rounded-full mr-4 group-hover:bg-blue-900 transition">
<i class="fab fa-instagram text-2xl text-blue-400"></i>
</div>
<div>
<h4 class="font-bold text-white">Instagram</h4>
<p class="text-gray-400">@princebarai (project highlights)</p>
</div>
<div class="ml-auto text-blue-400">
<i class="fas fa-external-link-alt"></i>
</div>
</a>
<div class="flex items-center p-4 bg-gray-800 rounded-lg">
<div class="bg-black p-3 rounded-full mr-4">
<i class="fas fa-envelope text-2xl text-blue-400"></i>
</div>
<div>
<h4 class="font-bold text-white">Encrypted Email</h4>
<p class="text-gray-400">princebarai@example.com</p>
</div>
</div>
</div>
<div class="mt-8">
<h4 class="font-bold text-white mb-3">PGP Key</h4>
<div class="bg-black p-4 rounded-lg overflow-x-auto">
<code class="text-blue-400 text-sm">
-----BEGIN PGP PUBLIC KEY BLOCK-----<br>
mQENBFyY5+YBCADJwZJ3w9JzY5M2hJk3Q8X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X<br>
9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X<br>
9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6<br>
v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5<br>
X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9<br>
Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7W6v5X9Z7<br>
W6v5X9Z7W6v5X9Z7W6v5X9Z7W6
</html>