public/styles/css/classes.css

@@ -119,11 +119,15 @@ hr {
     image-rendering: pixelated;
 }
 
-fieldset {
+.ntfyOpts {
     -webkit-box-shadow: 0 0 20px var(--accent-color);
     -moz-box-shadow: 0 0 20px var(--accent-color);
     box-shadow: 0 0 20px var(--accent-color);
     border: 2.5px solid var(--accent);
     border-radius: 3px;
     display: inherit;
+    margin-left: 35%;
+    margin-right: 35%;
+    margin-bottom: -4%;
+    margin-top: 2%;
 }

public/styles/css/mobile.css

@@ -1,10 +1,18 @@
 @media (max-width: 768px) {
     :root {
-        font-size: 14px;
+        font-size: 12px;
     }
 
     h1 {
-        font-size: 32px;
+        font-size: 30px;
+    }
+
+    h2 {
+        font-size: 20px;
+    }
+
+   .ntfyOpts {
+        margin: initial;
     }
 
     .ntfyForm {

src/components/main-page/widgets/ntfy.astro

@@ -24,7 +24,7 @@
   </button>
   <br>
     <!-- OPTIONS BOXES -->
-    <fieldset style="margin-left: 35%; margin-right: 35%; margin-bottom: -4%; margin-top: 2%;">
+    <fieldset class="ntfyOpts">
         <div>
           <input type="checkbox" id="optionsCheckbox" name="optionsCheckbox" onchange="toggleOptions()"/>
           <label for="optionsCheckbox">More Options</label>