Update preview button layout

index.html

@@ -30,12 +30,20 @@
         <p>THE FIVE TALL BOXING WIZARDS JUMP QUICKLY!</p>
         <p>0123456789.:,;(*!?')</p>
       </div>
+      <div id="previewButtons">
+        <div class="flex column">
           <button id="seriousButton">Serious Sans</button>
-      <button id="seriousItalicButton">Serious Sans Italic</button>
           <button id="seriousBoldButton">Serious Sans Bold</button>
-      <button id="seriousBoldItalicButton">Serious Sans Bold Italic</button>
           <button id="seriousLightButton">Serious Sans Light</button>
-      <button id="seriousLightItalicButton">Serious Sans Light Italic</button>
+        </div>
+        <div class="flex column">
+          <button id="seriousItalicButton">Serious Sans Italic</button>
+          <button id="seriousBoldItalicButton">Serious Sans Bold Italic</button>
+          <button id="seriousLightItalicButton">
+            Serious Sans Light Italic
+          </button>
+        </div>
+      </div>
       <br />
       <h2>Downloads</h2>
       <div id="downloads">

style.css

@@ -36,6 +36,10 @@
     display: flex;
     justify-content: space-evenly;
   }
+  #previewButtons {
+    display: flex;
+    justify-content: center;
+  }
 }
 
 body {
@@ -95,6 +99,14 @@ button {
   color: rgb(0, 188, 138);
 }
 
+.flex {
+  display: flex;
+}
+
+.column {
+  flex-direction: column;
+}
+
 .selected {
   background-color: #464646;
   color: #d4d4d4;