slimming some UI spacing issues

tubearchivist/home/templates/home/channel_id.html

@@ -2,9 +2,6 @@
 {% block content %}
 {% load static %}
 {% load humanize %}
-<div class="title-bar">
-    <h1>Channel: {{ channel_info.channel_name }}</h1>
-</div>
 <div class="channel-banner">
     <a href="/channel/{{ channel_info.channel_id }}/"><img src="/cache/channels/{{ channel_info.channel_id }}_banner.jpg" alt="channel_banner"></a>
 </div>

tubearchivist/home/templates/home/video.html

@@ -2,17 +2,15 @@
 {% block content %}
 {% load static %}
 {% load humanize %}
-<div class="title-bar">
-    <h1>Video: {{ video.title }}</h1>
-</div>
 <div class="video-main">
     <video 
         src="/media/{{ video.media_url }}" 
         poster="/cache/{{ video.vid_thumb_url }}" controls preload="false" 
         type='video/mp4' width="100%" playsinline>
     </video>
+    <h1>{{ video.title }}</h1>
 </div>
-<div class="info-box info-box-3 padding-box">
+<div class="info-box info-box-3">
     <div class="info-box-item">
         <div class="round-img">
             <a href="{% url 'channel_id' video.channel.channel_id %}">

tubearchivist/static/css/style.css

@@ -118,7 +118,6 @@ button:hover {
 
 .top-banner {
     text-align: center;
-    margin-top: 10px;
 }
 
 .top-banner img {
@@ -483,7 +482,10 @@ button:hover {
 .info-box {
     display: grid;
     grid-gap: 1rem;
-    margin: 1rem 0;
+}
+
+.description-box {
+    margin-top: 1rem;
 }
 
 .info-box-3 {
@@ -578,9 +580,15 @@ button:hover {
 }
 
 /* video page */
+.video-main {
+    margin-bottom: 1rem;
+}
+
 .video-main video {
     max-height: 70vh;
+    margin-bottom: 1rem;
 }
+
 .video-info-watched {
     display: flex;
     align-items: center;
@@ -614,7 +622,7 @@ button:hover {
 }
 
 .channel-item.list {
-    padding: 20px 0;
+    padding-bottom: 1rem;
 }
 
 .channel-item.grid > .info-box {