diff --git a/Form-Controls/index.html b/Form-Controls/index.html
index 65a866cdb..0bbef9038 100644
--- a/Form-Controls/index.html
+++ b/Form-Controls/index.html
@@ -1,27 +1,100 @@
 <!DOCTYPE html>
 <html lang="en">
   <head>
-    <meta charset="utf-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <title>My form exercise</title>
-    <meta name="description" content="" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>T-Shirt Order Form</title>
   </head>
   <body>
     <header>
-      <h1>Product Pick</h1>
+      <h1>T-Shirt Sales form</h1>
+      <p>Please confirm your details and choose your preferred colour and size.</p>
     </header>
     <main>
-      <form>
-        <!-- write your html here-->
-        <!-- 
-          try writing out the requirements first as comments
-        this will also help you fill in your PR message later-->
+      <form aria-label="T-shirt order form">
+       <br> 
+       <!-- Customer Name -->
+        <div>
+          <label for="name">Full Name:</label>
+          <input
+            type="text"
+            id="name"
+            name="name"
+            minlength="2"
+            required
+            aria-required="true"
+            placeholder="Enter your full name"
+          />
+        </div>
+       <br>
+ <!-- Customer Email -->
+        <div>
+          <label for="email">Email Address:</label>
+          <input
+            type="email"
+            id="email"
+            name="email"
+            required
+            aria-required="true"
+            placeholder="Enter your email address"
+          />
+        </div>
+       <br> 
+<!-- T-shirt Colour -->
+        <div>
+          <label for="colour">T-shirt Colour:</label>
+          <select id="colour" name="colour" required aria-required="true">
+            <option value="">Select a colour</option>
+            <option value="black">Black</option>
+            <option value="white">White</option>
+            <option value="blue">Blue</option>
+          </select>
+        </div>
+         <br>
+ <!-- T-shirt Size -->
+        <fieldset>
+          <legend>T-shirt Size:</legend>
+         <br>
+          <div>
+            <input type="radio" id="xs" name="size" value="XS" required />
+            <label for="xs">XS</label>
+          </div>
+         <br>
+          <div>
+            <input type="radio" id="s" name="size" value="S" />
+            <label for="s">S</label>
+          </div>
+         <br>
+          <div>
+            <input type="radio" id="m" name="size" value="M" />
+            <label for="m">M</label>
+          </div>
+       <br>
+          <div>
+            <input type="radio" id="l" name="size" value="L" />
+            <label for="l">L</label>
+          </div>
+         <br>
+          <div>
+            <input type="radio" id="xl" name="size" value="XL" />
+            <label for="xl">XL</label>
+          </div>
+       <br>
+       <div>
+            <input type="radio" id="xxl" name="size" value="XXL" />
+            <label for="xxl">XXL</label>
+          </div>
+       <br>
+       </fieldset>
+       
+       <br>
+ <!-- Submit Button -->
+        <button type="submit">Submit Order</button>
       </form>
     </main>
+    <br>
     <footer>
-      <!-- change to your name-->
-      <h2>By HOMEWORK SOLUTION</h2>
+      <p>&copy 2025 Chibuikem Okwu. All rights reserved.</p>
     </footer>
   </body>
 </html>
diff --git a/Wireframe/style.css b/Wireframe/style.css
index be835b6c7..0f6730cc9 100644
--- a/Wireframe/style.css
+++ b/Wireframe/style.css
@@ -45,14 +45,23 @@ svg {
 Setting the overall rules for page regions
 https://www.w3.org/WAI/tutorials/page-structure/regions/
 */
+header{
+  text-align: center ;
+}
 main {
   max-width: var(--container);
   margin: 0 auto calc(var(--space) * 4) auto;
+  padding-bottom: 3em;
 }
 footer {
+  background-color: #333;
+  color: white;
+  text-align: center;
+  padding: 1em;
   position: fixed;
   bottom: 0;
-  text-align: center;
+  width: 100%;
+
 }
 /* ====== Articles Grid Layout ====
 Setting the rules for how articles are placed in the main element.
@@ -77,13 +86,46 @@ Keeping things orderly and separate is the key to good, simple CSS.
 article {
   border: var(--line);
   padding-bottom: var(--space);
-  text-align: left;
+  text-align: center;
   display: grid;
   grid-template-columns: var(--space) 1fr var(--space);
   > * {
     grid-column: 2/3;
   }
   > img {
-    grid-column: span 3;
+    grid-column: 2/3;
+  }
+}
+article {
+  border: var(--line);
+  padding-bottom: var(--space);
+  text-align: left;
+  display: grid;
+  grid-template-columns: var(--space) 1fr var(--space);
+  >  {
+    grid-column: 2/3;
+  }
+  > img {
+    grid-column: 2/3;
   }
 }
+article > div {
+  display: grid;
+  grid-template-columns: 1fr ;
+  align-items: center;
+  gap: var(--space);
+  margin-top: var(--space);
+}
+.uniform-size {
+  width: 300px;
+  height: 150px;
+  object-fit: contain;
+}
+
+.parent {
+  text-align: ;  /* aligns contents to the right */
+}
+.parent .child {
+  display: inline-block;  /* allows the child to be sized and aligned */
+  text-align: bottom;  /* aligns text inside the child to the left */
+}
\ No newline at end of file
