diff --git a/templates/index.html b/templates/index.html
index 71575e7..c0b3fab 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,14 +1,27 @@
+{% extends 'public_base.html' %}
+{% block content %}
+
+ <div class="container">
+<img src="static/images/sec-1.jpeg" alt="Soccer Player" class="background-image" />
+
+<div class="text-content">
+  <h1 class="title">PLAY IT REAL</h1>
+  <p class="subtitle">SOCCER TRAINING THAT HITS LIKE GAME DAY</p>
+  
+  <!-- Using image as button -->
+  <button class="btn-image">
+    <img src="static/images/btn-2.png" alt="Boost Your Game" />
+  </button>
+   <button class="btn-image">
+    <img src="static/images/but-1.png" alt="Boost Your Game" />
+  </button>
+  
+</div>
+
+  </div>
 
 <style>
 
-  body, html {
-    margin: 0;
-    padding: 0;
-    height: 100%;
-    font-family: 'Arial Black', Arial, sans-serif;
-    background-color: #222;
-    color: #222;
-  }
   .container {
     position: relative;
     height: 90vh;
@@ -100,27 +113,9 @@
 }
 
 </style>
-</head>
-<body>
-  <div class="container">
-<img src="static/images/sec-1.jpeg" alt="Soccer Player" class="background-image" />
 
-<div class="text-content">
-  <h1 class="title">PLAY IT REAL</h1>
-  <p class="subtitle">SOCCER TRAINING THAT HITS LIKE GAME DAY</p>
-  
-  <!-- Using image as button -->
-  <button class="btn-image">
-    <img src="static/images/btn-2.png" alt="Boost Your Game" />
-  </button>
-   <button class="btn-image">
-    <img src="static/images/but-1.png" alt="Boost Your Game" />
-  </button>
-  
-</div>
-
-
-  </div>
+{% endblock %}
+
 
 
 
