Video page styling

static/style/video.css

@@ -22,13 +22,20 @@ button {
 .media-card button {
     display: inline-block;
     padding: 10px 15px;
+    margin: 1rem;
     text-decoration: none;
     border-radius: 4px;
 }
 
-.new-transcode button {
-    background-color: green;
+.media-card a {
+    display: inline-block;
+    padding: 10px 15px;
+    margin: 1rem;
+    margin-bottom: 0;
+    background-color: #007bff;
     color: white;
+    text-decoration: none;
+    border-radius: 4px;
 }
 
 .media-card h3 {
@@ -38,6 +45,24 @@ button {
     background-color: #f8f8f8;
 }
 
+.new-transcode form {
+    display: flex;
+    flex-direction: column;
+}
+
+.new-transcode .selects {
+    display: flex;
+    flex-direction: row;
+}
+
+.new-transcode select {
+    padding: 0.5rem;
+    border-radius: 4px;
+    border: 1px solid #ccc;
+    flex-grow: 1;
+    margin: 1rem;
+}
+
 .audio-container audio {
     width: 100%;
 }
@@ -49,30 +74,20 @@ button {
     margin: 0 auto;
 }
 
-.media-download {
-    padding: 15px;
+.media-buttons {
     text-align: center;
 }
 
-.media-download a {
-    display: inline-block;
-    padding: 10px 15px;
-    background-color: #007bff;
-    color: white;
-    text-decoration: none;
-    border-radius: 4px;
-}
-
-.media-controls {
-    text-align: center;
-    padding-bottom: 15px;
-}
-
-.media-controls button {
+.delete-button {
     background-color: red;
     color: white;
 }
 
+.transcode-button {
+    background-color: green;
+    color: white;
+}
+
 /* narrower than 600px */
 @media (max-width: 600px) {
     .media-grid {