diff --git a/webpage/index.html b/webpage/index.html
index a7e2acb..c84f7c0 100644
--- a/webpage/index.html
+++ b/webpage/index.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 
 <head>
-   <title>index.html</title>
+   <title>Here To There</title>
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&display=swap" rel="stylesheet">
 </head>
 
@@ -9,7 +9,7 @@
    <style>
       .title,
       .main {
-         background-color: hsl(10, 100%, 51%);
+         background-color: hsl(0, 0%, 0%);
          backdrop-filter: blur(10px);
          color: white;
          padding: 20px;
@@ -40,9 +40,11 @@
       .download {
          color: white;
          border-radius: 20px;
-         background-color: #fe0000;
+         background-color: #000000;
          margin: 20px;
          padding: 20px;
+         width: 300px;
+         height: 200px;
       }
 
       input,
@@ -50,7 +52,7 @@
          padding: 10px;
          margin: 10px;
          border-radius: 20px;
-         background-color: rgb(52, 52, 52);
+         background-color: rgb(79, 79, 79);
          border: none;
          color: rgb(222, 222, 222);
 
@@ -65,7 +67,7 @@
 
    <body>
       <div class="title">
-         <h1>Here to there</h1>
+         <h1>Here To There</h1>
          <h2>A simple file transfer website</h2>
       </div>
       <div class="main">
@@ -81,8 +83,9 @@
          <div class="download">
             <h2>Retrieve a File</h2>
             <form action="download" method="get">
-               <p>id:</p>
-               <input type="text" name="code" placeholder="Enter file code" />
+               <input type="text" name="code" placeholder="Enter the code for the file" />
+               <br>
+               <br>
                <button type="submit">Retrieve</button>
             </form>
          </div>
diff --git a/webpage/popup.html b/webpage/popup.html
index f566b05..4dd9a26 100644
--- a/webpage/popup.html
+++ b/webpage/popup.html
@@ -9,7 +9,18 @@
    <style>
       body {
          font-family: 'Montserrat', sans-serif;
-         background-color: rgb(37, 37, 37);
+         font-family: 'Montserrat', sans-serif;
+         background: hsla(198, 100%, 50%, 1);
+
+         background: linear-gradient(90deg, hsla(198, 100%, 50%, 1) 0%, hsla(188, 92%, 49%, 1) 48%, hsla(201, 100%, 49%, 1) 97%);
+
+         background: -moz-linear-gradient(90deg, hsla(198, 100%, 50%, 1) 0%, hsla(188, 92%, 49%, 1) 48%, hsla(201, 100%, 49%, 1) 97%);
+
+         background: -webkit-linear-gradient(90deg, hsla(198, 100%, 50%, 1) 0%, hsla(188, 92%, 49%, 1) 48%, hsla(201, 100%, 49%, 1) 97%);
+
+         filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#00B2FF", endColorstr="#0AD2F1", GradientType=1);
+         background-repeat: no-repeat;
+         background-size: cover;
       }
 
       .popup {
@@ -17,7 +28,8 @@
          height: 90%;
          color: white;
          border-radius: 20px;
-         background-color: #ff0000;
+         background-color: hsla(0, 0%, 37%, 0.676);
+         backdrop-filter: blur(20px);
          margin: 20px;
          padding: 20px;
       }
@@ -57,6 +69,7 @@
          <a class="button" href="/">Home</a>
 
       </div>
+      <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br><br> <br> <br> <br> <br> <br><br> <br> <br> <br> 
    </body>
 
    </html>
