diff --git a/layouts/media/single.html b/layouts/media/single.html
index 6578601..613820d 100644
--- a/layouts/media/single.html
+++ b/layouts/media/single.html
@@ -22,59 +22,70 @@
         </div>
       </div>
 
-      {{ range .Params.Videos }}
-        <div class="video-container">
-          <iframe
-            src="{{ .embed }}"
-            frameborder="0"
-            allow="autoplay; fullscreen; picture-in-picture; clipboard-write"
-            style="width:100%;height:100%;"
-            title="{{ .title }}">
-          </iframe>
-        </div>
-      {{ end }}
-
-      <div class="dark:text-white">
-        {{ .Content }}
-      </div>
-
-      {{ $hasGoodSpeaker := false }}
-      {{ range .Params.Speakers }}
-        {{ if or .bio .image }}
-          {{ $hasGoodSpeaker = true }}
-        {{ end }}
-      {{ end }}
-      {{ if $hasGoodSpeaker }}
-        <h4>About the speaker{{ if (gt (len .Params.Speakers) 1) }}s{{ end }}</h4>
-        {{ range .Params.Speakers }}
-          <div class="flex gap-8">
-            <div class="grow">
-              <div class="font-bold dark:text-white">{{ .name }}</div>
-              {{ if .bio }}
-                <div>
-                  {{ .bio | markdownify }}
-                </div>
-              {{ end }}
+      <div class="flex flex-col lg:flex-row gap-5">
+        <div class="flex-grow flex flex-col gap-5">
+          {{ range .Params.Videos }}
+            <div class="video-container">
+              <iframe
+                src="{{ .embed }}"
+                frameborder="0"
+                allow="autoplay; fullscreen; picture-in-picture; clipboard-write"
+                style="width:100%;height:100%;"
+                title="{{ .title }}">
+              </iframe>
             </div>
-            {{ if .image }}
-              {{ $imageurl := resources.Get .image }}
-              {{ if $imageurl}}
-                <div
-                  class="rounded-full aspect-square overflow-hidden shrink-0 w-32 self-start"
-                  style="background: url({{ $imageurl.RelPermalink }}) center top no-repeat; background-size: cover;"
-                  title="{{ .name }}"
-                ></div>
+          {{ end }}
+        </div>
+        <div class="flex flex-col gap-5 lg:w-1/3">
+          <div class="dark:text-white">
+            {{ .Content }}
+          </div>
+
+          {{ $hasGoodSpeaker := false }}
+          {{ range .Params.Speakers }}
+            {{ if or .bio .image }}
+              {{ $hasGoodSpeaker = true }}
+            {{ end }}
+          {{ end }}
+          {{ if $hasGoodSpeaker }}
+            <div>
+              <h4 class="mb-2">About the speaker{{ if (gt (len .Params.Speakers) 1) }}s{{ end }}</h4>
+              <div class="flex flex-col gap-3">
+                {{ range .Params.Speakers }}
+                  <div class="flex gap-8 items-center">
+                    <div class="grow">
+                      <div class="font-bold dark:text-white">{{ .name }}</div>
+                      {{ if .bio }}
+                        <div>
+                          {{ .bio | markdownify }}
+                        </div>
+                      {{ end }}
+                    </div>
+                    {{ if .image }}
+                      {{ $imageurl := resources.Get .image }}
+                      {{ if $imageurl}}
+                        <div
+                          class="rounded-full aspect-square overflow-hidden shrink-0 w-24 self-start"
+                          style="background: url({{ $imageurl.RelPermalink }}) center top no-repeat; background-size: cover;"
+                          title="{{ .name }}"
+                        ></div>
+                      {{ end }}
+                    {{ end }}
+                  </div>
+                {{ end }}
+              </div>
+            </div>
+          {{ end }}
+
+          <div class="flex flex-col gap-2">
+            {{ range .Params.Videos }}
+              {{ if .download_link }}
+                <a class="btn btn-outline-primary" href="{{ .download_link }}">Download video: {{ .title }}</a>
               {{ end }}
             {{ end }}
           </div>
-        {{ end }}
-      {{ end }}
-
-      {{ range .Params.Videos }}
-        {{ if .download_link }}
-          <a class="btn btn-outline-primary self-start" href="{{ .download_link }}">Download video: {{ .title }}</a>
-        {{ end }}
-      {{ end }}
+        </div>
+      </div>
     </div>
   </section>
 {{ end }}