visual stuff

src/public/css/offers.css

@@ -7,6 +7,10 @@
   #close-offer-controls-x {
     width: 25px;
   }
+
+  #premium-selector-area {
+    width: 60px;
+  }
 }
 
 @media (min-width: 769px) {
@@ -18,14 +22,18 @@
   #close-offer-controls-x {
     width: 50px;
   }
-}
 
+  #premium-selector-area {
+    width: 100px;
+  }
+  
+}
 
 #create-offer-controls > * {
   text-align: center;
   margin-left: 15%;
   margin-right: 15%;
-  width: 70%
+  width: 70%;
 }
 
 #close-offer-controls-area {
@@ -33,6 +41,46 @@
   justify-content: end;
 }
 
+#premium-area > * {
+  display: block;
+}
+
+#premium-content-area {
+  width: 80%;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+#premium-content-area > * {
+  display: inline-block;
+  margin: 0 auto;
+}
+
+#premium-selector-area > * {
+  display: inline-block;
+}
+
+#premium-selector-area {
+  width:23%;
+  margin-left: 0;
+  margin-right: 5%;
+}
+
+#premium-value {
+  border: 1px solid gray;
+  width: 100%;
+}
+
+.premium-button {
+  width: 45%;
+}
+
+#premium-price-display-area {
+  margin-left: 0;
+  margin-right: 0;
+  width: 70%;
+}
+
 .money-amount-input-area {
   padding: 0;
   width: 10em;

src/public/css/seca.css

@@ -31,7 +31,7 @@
   .button-medium {
     height: 3em;
     padding: 1em;
-    border-radius: 10px; 
+    border-radius: 10px;
   }
 }