Hritthik
diff --git a/‎.DS_Store
0 Bytes b/‎.DS_Store
0 Bytes
diff --git a/‎assets/.DS_Store
0 Bytes b/‎assets/.DS_Store
0 Bytes
diff --git a/‎assets/css/style.css
+10-2 b/‎assets/css/style.css
+10-2
diff --git a/‎assets/images/.DS_Store
-2 KB b/‎assets/images/.DS_Store
-2 KB
diff --git a/‎assets/js/script.js
+11-1 b/‎assets/js/script.js
+11-1
diff --git a/‎index.html
+25-4 b/‎index.html
+25-4
diff --git a/‎lara.html
+46 b/‎lara.html
+46
@@ -209,6 +209,12 @@ body.active { overflow: hidden; }
   border-color: var(--raw-seinna);
   color: var(--black);
 }
+.btn-secondaryy {
+  background: var(--raw-seinna);
+  border-color: var(--raw-seinna);
+  color: var(--black);
+  margin-top: 144px;
+}
 
 .btn-secondary:is(:hover, :focus) { --raw-seinna: hsl(24, 74%, 64%); }
 
@@ -465,13 +471,14 @@ main { overflow-x: hidden; }
 
 :is(.hero-social-list, .scroll-down) { display: none; }
 
-.hero-content { max-width: 450px; }
+.hero-content { max-width: max-content; }
 
 .hero-title {
   text-align: center;
   margin-bottom: 30px;
 }
 
+
 .hero .btn-primary { margin-inline: auto; }
 
 
@@ -1310,4 +1317,5 @@ textarea.input-field {
 
   .about-banner { max-width: 450px; }
 
-}
+}
+
@@ -102,4 +102,14 @@ if (localStorage.getItem("theme") === "light_theme") {
   themeToggleBtn.classList.remove("active");
   document.body.classList.remove("light_theme");
   document.body.classList.add("dark_theme");
-}
+}
+
+// var typed = new Typed(".text", {
+//     strings: ["Frontend Developer . . ." , "Programmer . . ." , "Web Developer . . ."],
+//     typeSpeed: 70,
+//     backSpeed: 50,
+//     backDelay: 1000,
+//     loop: true
+// })
+
+
@@ -6,6 +6,9 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Joy - personal portfolio</title>
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
+
+
 
     <!-- 
     - favicon
@@ -25,6 +28,14 @@
     <link
         href="https://fonts.googleapis.com/css2?family=Poppins:wght@700&family=Roboto:wght@400;700&family=Saira+Stencil+One&display=swap"
         rel="stylesheet">
+        <style>  
+            .text {
+                color:hsl(24, 74%, 64%);
+                font-size: 30px;
+                font-weight: bold;
+               text-align: left;
+            }
+        </style>
 </head>
 
 <body id="top" class="dark_theme">
@@ -119,11 +130,10 @@ <h1 class="h1 logo">
 
                 <div class="hero-content">
 
-                    <h2 class="h2 hero-title">I Design & Build Creative AI</h2>
-
-                    <a href="#contact" class="btn btn-primary">Get in touch</a>
-
+                    <h2 class="h2 hero-title">I Design & Build</h2>
+                    <h2><span class="text"></span></h2>                  
                 </div>
+            <div class="hero-content"><a href="#contact" class="btn btn-secondaryy">Get in touch</a></div>
 
                 <ul class="hero-social-list">
 
@@ -939,6 +949,17 @@ <h3 class="h4 contact-item-title">Email:</h3>
   -->
     <script type="module" src="https://unpkg.com/[email protected]/dist/ionicons/ionicons.esm.js"></script>
     <script nomodule src="https://unpkg.com/[email protected]/dist/ionicons/ionicons.js"></script>
+    <script>
+        document.addEventListener('DOMContentLoaded', function () {
+            var typed = new Typed(".text", {
+                strings: ["Creative AI . . .", "Creative AI . . .", "Creative AI . . ."],
+                typeSpeed: 70,
+                backSpeed: 50,
+                backDelay: 10,
+                loop: true
+            });
+        });
+    </script>
 
 </body>
 
 
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Typed.js Animation</title>
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
+    <style>
+        body {
+            font-family: 'Arial', sans-serif;
+            background-color: #f0f0f0;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            height: 100vh;
+            margin: 0;
+        }
+
+        .text {
+            color: #4CAF50;
+            font-size: 24px;
+            font-weight: bold;
+        }
+    </style>
+</head>
+
+<body>
+
+    <span class="text"></span>
+
+    <script>
+        document.addEventListener('DOMContentLoaded', function () {
+            var typed = new Typed(".text", {
+                strings: ["Frontend Developer . . .", "Programmer . . .", "Web Developer . . ."],
+                typeSpeed: 70,
+                backSpeed: 50,
+                backDelay: 1000,
+                loop: true
+            });
+        });
+    </script>
+
+</body>
+
+</html>