pretty premium selector

src/public/css/offers.css

@@ -48,30 +48,30 @@
   width: 80%;
   margin-left: auto;
   margin-right: auto;
-}
-
-#premium-content-area > * {
-  display: inline-block;
-  margin: 0 auto;
-}
-
-#premium-selector-area > * {
-  display: inline-block;
+  display: flex;
 }
 
 #premium-selector-area {
   width: 23%;
   margin-left: 0;
   margin-right: 5%;
+  display: flex;
 }
 
 #premium-value {
   border: 1px solid gray;
-  width: 100%;
+  width: 50%;
+  align-content: center;
+}
+
+#premium-buttons-container {
+  width:50%;
 }
 
 .premium-button {
-  width: 45%;
+  width: 100%;
+  height: 50%;
+  font-size: 1em;
 }
 
 #premium-price-display-area {
@@ -86,8 +86,6 @@
   margin-right: auto;
 }
 
-
-
 .money-amount-input-area {
   padding: 0;
   width: 100%;

src/views/offers.ejs

@@ -48,11 +48,13 @@
           <div id="premium-content-area">
             <div id="premium-selector-area">
               <div id="premium-value">0%</div>
-              <button class="premium-button" id="button-increase-premium">
-                +</button
-              ><button class="premium-button" id="button-decrease-premium">
-                -
-              </button>
+              <div id="premium-buttons-container">
+                <button class="premium-button" id="button-increase-premium">
+                  +</button
+                ><button class="premium-button" id="button-decrease-premium">
+                  -
+                </button>
+              </div>
             </div>
             <div id="premium-price-display-area">
               <p>