Update style.css

style.css

@@ -30,7 +30,7 @@ html, body {
     color: white;
     display: flex;
     flex-direction: column;
-    justify-content: center;
+    justify-content: space-around;
     align-items: center;
     text-align: center;
 }
@@ -41,24 +41,25 @@ html, body {
 
 .settings {
     display: flex;
-    flex-direction: row;
     flex-wrap: wrap;
     justify-content: space-around;
     width: 80%;
 }
 
 .color-options, .font-options, .toggle-options, .spacing-options, .size-options, .background-options {
-    margin: 20px;
+    margin: 10px;
 }
 
 .color-option, .font-option, .toggle-option, .background-option {
     padding: 10px;
     cursor: pointer;
     border-radius: 10px;
+    background: #444;
+    margin-bottom: 5px;
 }
 
 .color-option:hover, .font-option:hover, .toggle-option:hover, .background-option:hover {
-    background: #444;
+    background: #555;
 }
 
 button {
@@ -68,14 +69,21 @@ button {
     background: #555;
     border: none;
     color: white;
-    margin-top: 20px;
     border-radius: 20px;
+    margin: 10px;
 }
 
 button:hover {
     background: #777;
 }
 
+.menu-buttons {
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    width: 100%;
+}
+
 input[type="checkbox"] {
     margin-right: 10px;
 }