diff --git a/assets/css/app.css b/assets/css/app.css
index 454f64b..76b36d9 100644
--- a/assets/css/app.css
+++ b/assets/css/app.css
@@ -970,3 +970,10 @@ body {
 }
 
 
+
+
+/*****************************************  Bulk Archives **************************************/
+
+@media screen and (max-width: 350px) {.responsive-form {width: auto;}}
+@media screen and (min-width: 350px) {.responsive-form {width: 300px;}}
+@media screen and (min-width: 550px) {.responsive-form {width: 500px;}}
\ No newline at end of file
diff --git a/lib/bookmark_web/live/bulk_archives.ex b/lib/bookmark_web/live/bulk_archives.ex
index b68cff5..5d0276b 100644
--- a/lib/bookmark_web/live/bulk_archives.ex
+++ b/lib/bookmark_web/live/bulk_archives.ex
@@ -24,11 +24,11 @@ defmodule BookmarkWeb.BulkArchivesLive do
               <% end %>
             </ul>
         <% else %>
-          <.form for={@form} phx-submit="save">
+          <.form for={@form} phx-submit="save" class="responsive-form">
             <textarea placeholder="Paste your URLs here, one per line:
             https://www.example.com/
             https://www.google.com/"
-            name="urls" style="height: 100px; width: 500px; background-color: white; font-size: 16px;"><%= if  @links, do: @links%></textarea>
+            name="urls" style="height: 100px; width: 100%; background-color: white; font-size: 16px;"><%= if  @links, do: @links%></textarea>
 
             <button class="donate-button">Bulk archive</button>
           </.form>