diff --git a/src/static/css/main.css b/src/static/css/main.css
index 5d0d086..9c09a3b 100644
--- a/src/static/css/main.css
+++ b/src/static/css/main.css
@@ -41,13 +41,17 @@ 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: 999px;
-    padding: 4px 4px 4px 16px;
     box-shadow: 0 0px 32px rgba(69, 98, 190, 0.25);
+    border-radius: calc(var(--submit-button-content-height) * 0.5 + var(--submit-button-padding-y) + var(--padding));
+    padding: var(--padding);
+    padding-left: calc(var(--submit-button-content-height) + var(--padding));
 }
 
 .search-wrapper input {
@@ -59,9 +63,11 @@ form {
 }
 
 .search-button {
-    border-radius: 999px;
+    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));
     border: none;
-    padding: 8px 20px;
+    padding: var(--submit-button-padding-y) 20px;
     background: #4562BE;
     color: white;
     cursor: pointer;