diff --git a/index.html b/index.html
index 69d1e1d..60119c6 100644
--- a/index.html
+++ b/index.html
@@ -1,24 +1,77 @@
-<!-- 1. create the basic html structure. your structure should include a blue heading and a red paragragh with font size 15px -->
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>HTML Structure</title>
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+    <header>
+        <h1 class="blue-heading">HACKATHON</h1>
+        <p class="red-paragraph">Do you want to hear a joke? Well, I thought the hackathon was about hacking, meaning gaining unauthorized access to data in a system or computer. Turns out, the meaning is a social coding event that brings computer programmers and other interested people together to improve upon or build a new software program.</p>
+    </header>
 
+    <a href="file:///C:/Users/NEEMA/Documents/hack.html" target="_blank">CLICK HERE TO VIEW MY AMAZING WEBSITE</a>
 
-<!-- 2. in your html file, add a link that opens a new tab to an external resource  -->
+    <section class="image-section">
+        <img src="C:\Users\NEEMA\Downloads\pexels-vlada-karpovich-4050405.jpg" alt="Sample Image">
+    </section>
 
+    <section class="form-section">
+        <form action="#" method="post">
+            <label for="name">Name:</label>
+            <input type="text" id="name" name="name" required><br>
 
-<!-- 3. create a section and add an image, using css; place a green border on the image, the image should be 500px wide and 500px high -->
+            <label for="email">Email Address:</label>
+            <input type="email" id="email" name="email" required><br>
 
+            <label for="phone">Phone Number:</label>
+            <input type="tel" id="phone" name="phone" required><br>
 
-<!-- 4. create another section add a form that takes in the following input:
-  a. name
-  b. email address
-  c. phone number
-  d. age
-  e. radio checkbox for gender (use fieldset to group the gender input)
-  f. dropdown for multi-selection of subjects: English, Math, Science, Art and Craft, Agriculture, Geography and History
-  g. password
-  h. a hidden field to capture sessionId
-  i. cancel button that clears form inputs
-  j. submit button with text register
-  make sure to incorporate relevant labels in your form elements using the necessary and relevant input types and element attributes
--->
+            <label for="age">Age:</label>
+            <input type="number" id="age" name="age" required><br>
 
-<!-- 5. all styling should be placed in the style.css, make sure to correctly embed the external css file on the index.html file using the relevant tag  -->
+            <fieldset>
+                <legend>Gender:</legend>
+                <input type="radio" id="male" name="gender" value="male" required>
+                <label for="male">Male</label>
+                <input type="radio" id="female" name="gender" value="female" required>
+                <label for="female">Female</label>
+            </fieldset>
+
+            <label for="subjects">Subjects:</label>
+            <select id="subjects" name="subjects[]" multiple required>
+                <option value="English">English</option>
+                <option value="Math">Math</option>
+                <option value="Science">Science</option>
+                <option value="Art and Craft">Art and Craft</option>
+                <option value="Agriculture">Agriculture</option>
+                <option value="Geography">Geography</option>
+                <option value="History">History</option>
+            </select><br>
+
+            <label for="password">Password:</label>
+            <input type="password" id="password" name="password" required><br>
+
+            <input type="hidden" id="sessionId" name="sessionId" value="sessionID123"><br>
+
+            <button type="button" onclick="clearForm()">Cancel</button>
+            <button type="submit">Register</button>
+        </form>
+    </section>
+
+    <script>
+        function clearForm() {
+            document.getElementById("name").value = "";
+            document.getElementById("email").value = "";
+            document.getElementById("phone").value = "";
+            document.getElementById("age").value = "";
+            document.getElementById("male").checked = false;
+            document.getElementById("female").checked = false;
+            document.getElementById("subjects").selectedIndex = -1;
+            document.getElementById("password").value = "";
+        }
+    </script>
+</body>
+</html>
diff --git a/style.css b/style.css
index 8b13789..97bc836 100644
--- a/style.css
+++ b/style.css
@@ -1 +1,14 @@
+h1 {
+    color: blue; /* Making headlines blue */
+}
 
+p {
+    color: red; /* Making paragraphs red */
+    font-size: 15px;
+}
+
+.image-section img {
+    width: 500px;
+    height: 500px;
+    border: 5px solid green;
+}
