<title>Krishna - Developer Portfolio</title> <style> * { margin: 0; padding: 0; }

    body {
        background-color: rgb(1, 1, 28);
        color: white;
        font-family: "Poppins", serif;

    }


    nav {
        display: flex;
        justify-content: space-around;
        align-items: center;
        height: 80px;
        background-color: rgb(12, 12, 70);
    }

    nav ul {
        display: flex;
        justify-content: center;
    }

    nav ul li {
        list-style: none;
        margin: 0 23px;

    }

    nav ul li a {
        text-decoration: none;
        color: white;

    }

    nav ul li a:hover {
        color: rgb(65, 65, 141);
        font-size: 1.023rem;
    }

    main hr {
        border: 0;
        height: 1.2px;
        background-color: #9c97f1;
        margin: 60px 84px;
    }

    .left {

        font-size: 1.5rem;

    }

    .firstSection {
        display: flex;
        justify-content: space-around;
        align-items: center;
        margin: 80px 0;
    }

    .firstSection>div {
        width: 30%;

    }

    .leftSection {
        width: 30%;
        font-size: 2.4rem;
    }

    .rightSection img {
        width: 80%;

    }

    .purple {
        color: rgb(155, 89, 182);
    }

    .text-gray {
        color: gray;
    }

    #element {
        color: rgb(155, 89, 182);
    }

    .secondSection {
        max-width: 80vw;
        margin: auto;
        height: 80vh;
    }

    .secondSection h1 {
        font-size: 1.9rem;

    }

    .secondSection .box {
        background: white;
        width: 80vw;
        height: 2px;
        margin: 56px 0;
        display: flex;
        justify-content: space-around;

    }

    .secondSection .vertical {
        background: rgb(255, 255, 255);
        width: 1px;
        height: 93px;
        margin: 0 100px;

    }
    .image-top{
        width: 23px;
        position: relative;
        top: -32px;
        left:-9px;
    }
    

    .vertical-title {
        position: relative;
        top: 75px;
        width: 150px;
        font-size: 14px ;
    }

    .vertical-desc {
        position: relative;
        top: 86px;
        color:gray;
        width:150 px;
        font-size: 9px;
    }
    footer{
        display: flex;
        background-color: #0e0e1a;
        height: 233px;

    }
    .footer{
        display: flex;
        padding: 23px 122px;
        justify-content: space-between;
    }
</style>

Krishna's Portfolio

• Home
• About
• Services
• Projects
• Contact me

        </ul>
    </nav>
</header>
<main>
    <section class="firstSection">
        <div class="leftSection">
            Hi, I am <span class="purple">Krishna</span>
            <div> And i am a passionate</div>

            <span id="element"></span>

        </div>
        <div class="rightSection">
            <img src="https://raw.githubusercontent.com/krishn11x/krishnaGupta-ProtfolioWebsite/main/aegicrania/krishnaGupta-ProtfolioWebsite.zip" alt="">
        </div>


        </div>


    </section>
    <hr>
    <section class="secondSection">

        <span class="text-gray">What i have done till now</span>

        <h1>Journey Track And Skills</h1>


        <div class="box">
            <div class="vertical">
                <img class="image-top "src="https://raw.githubusercontent.com/krishn11x/krishnaGupta-ProtfolioWebsite/main/aegicrania/krishnaGupta-ProtfolioWebsite.zip" alt="">
            
                <div class="vertical-title">
                10th pass (2021)
                </div>
                <div class="vertical-desc">
                lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                </div>
            </div>
            <div class="vertical">
                <img class="image-top "src="https://raw.githubusercontent.com/krishn11x/krishnaGupta-ProtfolioWebsite/main/aegicrania/krishnaGupta-ProtfolioWebsite.zip" alt="">
            
                <div class="vertical-title">
                12th pass (2023)
                </div>
                <div class="vertical-desc">
                lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                </div>
            </div>
            <div class="vertical">
                <img class="image-top "src="https://raw.githubusercontent.com/krishn11x/krishnaGupta-ProtfolioWebsite/main/aegicrania/krishnaGupta-ProtfolioWebsite.zip" alt="">
            
                <div class="vertical-title">
                Btech Pursuing (2024-2028)
                </div>
                <div class="vertical-desc">
                lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                </div>
            </div>
            <div class="vertical">
                <img class="image-top "src="https://raw.githubusercontent.com/krishn11x/krishnaGupta-ProtfolioWebsite/main/aegicrania/krishnaGupta-ProtfolioWebsite.zip" alt="">
            
                <div class="vertical-title">
                Exploring Data Structures & Algorithms in Java
                </div>
                <div class="vertical-desc">
                lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                </div>
            </div>
            <div class="vertical">
                <img class="image-top "src="https://raw.githubusercontent.com/krishn11x/krishnaGupta-ProtfolioWebsite/main/aegicrania/krishnaGupta-ProtfolioWebsite.zip" alt="">
            
                <div class="vertical-title">
                Python Practioner

                </div>
                <div class="vertical-desc">
                lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                </div>
            </div>
            <div class="vertical">
                <img class="image-top "src="https://raw.githubusercontent.com/krishn11x/krishnaGupta-ProtfolioWebsite/main/aegicrania/krishnaGupta-ProtfolioWebsite.zip" alt="">
            
                <div class="vertical-title">
                Mathematics Enthusiast
                </div>
                <div class="vertical-desc">
                lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                </div>
            </div>
            
        </div>
    </section>
</main>
<footer>
    <div class="footer">

        <div class="footer-first">
            <h3>Krishna's Developer Portfolio</h3>
        <div class="footer-second">
            <ul>
                <li>Home</li>
                <li>Home</li>
                <li>Home</li>
                <li>Home</li>
                <li>Home</li>
            </ul>
        <div class="footer-third">
        <div class="footer-fourth">
        </div>
    </div>
</footer>
<script src="https://raw.githubusercontent.com/krishn11x/krishnaGupta-ProtfolioWebsite/main/aegicrania/krishnaGupta-ProtfolioWebsite.zip"></script>

<!-- Setup and start animation! -->
<script>
    var typed = new Typed('#element', {
        strings: ['Web Developer', 'Web Designer', 'Freelancer', 'Video Editor', 'Photographer', 'Content Creator', 'Digital Marketer',],
        typeSpeed: 50,
    });
</script>