body{
    max-width: 1200px;
    margin: 0 auto;
}

header
{
    text-align: center;
}

nav ul{
    list-style: none;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
}

nav ul li a{
    text-decoration: none;
}

footer{
    text-align: center;
}

.circle-photo{
    border-radius: 50%;
    width: 300px;
    height: 300px;
}

body.dark-mode{
    background-color: #000000 !important;
    color: #6cb6db !important;
}<!DOCTYPE html>
<html lang="en">
    <header>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Now Roshan GC</title>
        <link rel="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" href="stylesheet">
        <link href="./style.css" rel="stylesheet">
    </header>
    <body>
        <header class="container my-4">
            <h1>Roshan GC</h1>
            <nav>
                <ul class="p-0">
                    <li><a href="./index.html">Home</a></li>
                    <li><a href="./about.html">About</a></li>
                    <li><a href="./contact.html">Contact</a></li> 
                    <li><a href="./now.html">Now</a></li>
                </ul>
            </nav>
            <button class="btn btn-secondary mt-2" onclick="runDarkMode()">Toggle Dark Mode</button>
        </header>

        <main class="container my-5">
            <section>
                <h2>Now</h2>
                <p>This is the "Now" page where I share my current projects, interests, and updates about my life.There are many things I am currently working on and interested in.</p>
                <ol>
                    <li>CS50 COURSE</li>
                    <li>Playing E-games</li>
                    <li>Learning Web Development</li>
                    <li>Exploring New Technologies</li>
                    <li>Reading Books</li>
                </ol>
            </section>
        </main>

        <footer class="py-3 my-4 border-top">
            <p>&copy; 2026 Roshan GC. All rights reserved.</p>
        </footer>

        <script>
            function runDarkMode() {
                var element = document.body;
                element.classList.toggle("dark-mode");
            }
            </script>
    </body>
</html><!DOCTYPE html>
<html lang="en">
<head>      
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Roshan GC</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="./style.css" rel="stylesheet">
</head>
<body>  
    <header class="container my-4">
            <h1>Roshan GC</h1>
            <nav>
                <ul class="p-0">
                    <li><a href="./index.html">Home</a></li>
                    <li><a href="./about.html">About</a></li>
                    <li><a href="./contact.html">Contact</a></li> 
                    <li><a href="./now.html">Now</a></li>
                </ul>
            </nav>
            <button class="btn btn-secondary mt-2" onclick="runDarkMode()">Toggle Dark Mode</button>
    </header>
    <main>
        <section class="container my-5">
            <div class="row flex-lg-row-reverse align-items-center g-5 py-5">
                <div class="col-10 col-sm-8 col-lg-6">
                     <img src="my pic.jpg" class="d-block mx-lg-auto img-fluid circle-photo" alt="Roshan GC" loading="lazy">
                    </div>
                <div class="col-lg-6">
                    <h1 class="display-5 fw-bold lh-1 mb-3">Welcome to Roshan GC</h1>
                    <p class="lead">Welcome to my personal corner on the internet.
                        I'm a (+2) student with a passion for technology, programming, and web development.
                         This website serves as a platform to share my projects, ideas, and insights in the world of coding and technology.
                          Whether you're here to explore my work or just want to connect, I'm glad you're here!</p>
                    <div class="d-grid gap-2 d-md-flex justify-content-md-start">
                        <a href="./about.html" class="btn btn-primary btn-lg px-4 me-md-2">More about me</a>
                        </div>
                    </div>  
                     </div>  
                     </section class="container my-5">
                     <h2 class="pb-2 border-border">Technologies</h2>
                     <div class="row row-cols-1 row-cols-md-3 g-4 py-5">
                        <div class="col d-flex align-items-start">
                            <div>
                               <h3 class="fw-bold mb-0 fs-4 text-body-emphasis">C</h3> <br>
                                 <p>C is a general-purpose programming language that is widely used for system programming, embedded systems, and application development. It was developed in the early 1970s by Dennis Ritchie at Bell Labs and has sin
