diff --git a/src/index.html b/src/index.html
index ceb97f5..2aa0fd6 100644
--- a/src/index.html
+++ b/src/index.html
@@ -27,15 +27,15 @@ limitations under the License.
         <nav class="global-nav">
             <ul>
                 <li class="nav-item">
-                    seekra
+                    <a href="#">Seekra</a>
                 </li>
             </ul>
         </nav>
 
-        <div class="hero">
-            <header>
-                <h1>seekra</h1>
-                <p>
+        <div class="content-background">
+            <header class="global-header">
+                <h1>Seekra</h1>
+                <p class="slogan">
                     Built to search.
                 </p>
             </header>
@@ -43,12 +43,12 @@ limitations under the License.
             <form id="search-form">
                 <div class="search-wrapper">
                     <input type="search" name="search" placeholder="Search..." required />
-                    <button type="submit">Search</button>
+                    <button type="submit" class="search-button">Search</button>
                 </div>
             </form>
         </div>
         <footer>
-            <p>&copy; 2026 seekra.</p>
+            <p>&copy; 2026 Seekra.</p>
         </footer>
     </body>
 </html>
diff --git a/src/static/css/main.css b/src/static/css/main.css
index ddc3751..e1ee1c0 100644
--- a/src/static/css/main.css
+++ b/src/static/css/main.css
@@ -1,9 +1,8 @@
 body {
     margin: 0;
     background-color: #ffffff;
-    font-size: 16px;
 }
-.hero {
+.content-background  {
     background: 
         radial-gradient(ellipse at 40% 60%, rgba(255,255,255,0.55) 0%, transparent 75%),
         linear-gradient(160deg, #c8d8f0, #7aa0d8, #5077C7, #dce8f8);
@@ -12,11 +11,11 @@ body {
     flex-direction: column;
 }
 
-header {
+.global-header {
     text-align: center;
 }
 
-header h1 {
+.global-header h1 {
     display: inline-block;
     margin-bottom: 0;
     background: linear-gradient(to right, #689BDB, #5F8DDC, #5077C7, #4562BE, #374FA5, #22298F);
@@ -25,7 +24,7 @@ header h1 {
     background-clip: text;
 }
 
-header p {
+.slogan{
     margin-top: 0;
     font-size: small;
 }
@@ -38,16 +37,12 @@ form {
 }
 
 .search-wrapper {
-    --submit-button-padding-y: 8px;
-    --submit-button-content-height: 18px;
-    --padding: 4px;
     display: flex;
     align-items: center;
     width: 80%;
     border: 1.5px solid #ccc;
-    border-radius: calc(var(--submit-button-content-height) + var(--padding));
-    padding: var(--padding);
-    padding-left: calc(var(--submit-button-content-height) + var(--padding));
+    border-radius: 999px;
+    padding: 4px 4px 4px 16px;
 }
 
 .search-wrapper input {
@@ -58,19 +53,17 @@ form {
     background: transparent;
 }
 
-.search-wrapper button {
-    font-size: 1rem;
-    height: calc(var(--submit-button-content-height) + 2 * var(--submit-button-padding-y));
-    border-radius: calc(var(--submit-button-content-height) * 0.5 + var(--submit-button-padding-y));
+.search-button {
+    border-radius: 999px;
     border: none;
-    padding: var(--submit-button-padding-y) 20px;
+    padding: 8px 20px;
     background: #4562BE;
     color: white;
     cursor: pointer;
     white-space: nowrap;
 }
 
-.search-wrapper button:hover {
+.search-button:hover {
     background: #374FA5;
 }