<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta property="og:type" content="website">
    <meta property="og:title" content="Portfolio - DipuPlayz_">
    <meta property="og:description" content="Explore my services in Website Development, Minecraft Servers, and Discord Hosting.">
    <meta property="og:image" content="https://dipuplayz.netlify.app/images/poster.webp">
    <meta property="og:url" content="https://dipuplayz.netlify.app">
    <meta name="theme-color" content="#FF0000"> 
    <title>Portfolio - DipuPlayz_</title>
    <link rel="stylesheet" href="style.css">
    <link rel="icon" href="images/favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
</head>
<body>
    <!-- <<<====HEADER====>>> -->
    <div class="Header">
        <div class="HeaderLeft">
            <div class="logo">
                <a href="index.html">
                    <h1>
                        <i class="fa-solid fa-circle-user fa-lg" style="color: #ff7b00;"></i><span style="color: #e7511d;">Dipu</span><span style="color: white;">Playz_</span>
                    </h1>
                </a>
            </div>
        </div>
        <div class="HeaderRight">
            <div class="menu">
                <ul>
                    <li><i class="fa-solid fa-user-tie" style="color: #ff7300;"></i><a href="#AboutMe">Portfolio</a></li> 
                    <li><i class="fa-solid fa-gear" style="color: #ff7300;"></i><a href="#Services">Services</a></li>
                    <li><i class="fa-solid fa-star" style="color: #ff7300;"></i><a href="#Experience">Experience</a></li>
                    <li><i class="fa-solid fa-paper-plane" style="color: #ff7300"></i><a href="#Projects">Projects</a></li>
                </ul>
            </div>
        </div>
        <div class="HeaderRight1">
            <button>
                <a href="https://mail.google.com/mail/?view=cm&fs=1&to=vicient090@gmail.com&su=Contacting%20You%20From%20Your%20Portfolio%20Website" target="_blank">
                    <b><i class="fa-regular fa-envelope fa-bounce"></i>Contact Me</b></a>
            </button>
        </div>
    </div>

    <!-- <<<====ABOUT ME====>>> -->
    <div class="AboutMe" id="AboutMe">
        <div>
            <h2>Hii,</h2>
            <h1>
                <span class="black">I'm </span><span style="color: red;">DipuPlayz</span><span class="blink" style="color: red;">_</span> 
            </h1>
            <h3>A Frontend Developer</h3>
            <p>Hi! I’m DipuPlayz, Frontend developer and freelancer offering affordable, quality services.</p>
            <p>I deliver high-quality work with fast turnaround times for your web development needs.</p>
            <p>Let me help bring your vision to life with efficient and reliable solutions at a great price!</p><br>
            <p><i class="fa-regular fa-circle-check" style="color: #00ff00;"></i> HTML</p>
            <p><i class="fa-regular fa-circle-check" style="color: #00ff00;"></i> CSS</p>
            <p><i class="fa-regular fa-circle-check" style="color: #00ff00;"></i> PYTHON</p>
        </div>
        <img src="images/Logo.png" alt="Logo">
    </div>

    <!-- <<<====SERVICES====>>> -->
    <div class="Services">
        <div>
            <h2>My Services</h2>
            <h3>What I Offer</h3>
            <p1>I provide top-notch services in:</p1><br>
            <br><p><i class="fa-regular fa-circle-check" style="color: #00ff00;"></i> Website Development</p>
            <p><i class="fa-regular fa-circle-check" style="color: #00ff00;"></i> Minecraft Server Setup</p>
            <p><i class="fa-regular fa-circle-check" style="color: #00ff00;"></i> Discord Hosting & Management</p>
        </div>
        <img src="images/services.png" alt="Services">
    </div>


    <!-- <<<====EXPERIENCE====>>> -->
    <div class="Experience">
        <div>
            <h2>Experience</h2>
            <h3>My Background</h3>
            <p>With more than a year of experience, I’ve worked on:</p><br>
            <p><i class="fa-regular fa-circle-check" style="color: #00ff00;"></i> Multiple Web Development Projects</p>
            <p><i class="fa-regular fa-circle-check" style="color: #00ff00;"></i> Large-Scale Minecraft Server Setups</p>
            <p><i class="fa-regular fa-circle-check" style="color: #00ff00;"></i> Advanced Discord Bots & Automation</p>
        </div>
        <img src="images/experience.png" alt="Experience">
    </div>

    <!-- <<<====PROJECTS====>>> -->
    <div class="Projects">
        <div>
            <h2>Projects</h2>
            <h3>Some of My Work</h3>
            <p>Here are a few of my projects:</p><br>
                <p><i class="fa-regular fa-circle-check" style="color: #00ff00;"></i> E-Commerce Website</p>
                <p><i class="fa-regular fa-circle-check" style="color: #00ff00;"></i> Minecraft Minigame Server</p>
                <p><i class="fa-regular fa-circle-check" style="color: #00ff00;"></i> Discord Bot for Automation</p>
        </div>
        <video src="images/projects.mp4" alt="Projects" autoplay loop muted>
    </div>

<div class="footer">
     <p>&copy; 2025 DipuPlayz_. All rights reserved.</p>
</div>

    <script src="script.js"></script>
</body>
</html>
