From 8a47914957ff9a70ef84f65239f7eb8a1130061c Mon Sep 17 00:00:00 2001
From: "max.mehl" <max.mehl@fsfe.org>
Date: Tue, 29 Aug 2017 17:53:45 +0200
Subject: [PATCH] use dynamic video source and make it always 100% wide

---
 site/layouts/partials/about.html | 15 +++++----------
 site/static/css/custom.css       |  7 ++++++-
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/site/layouts/partials/about.html b/site/layouts/partials/about.html
index 2b52ad8..aec0e16 100644
--- a/site/layouts/partials/about.html
+++ b/site/layouts/partials/about.html
@@ -12,16 +12,11 @@
                 
                 <!-- VIDEO -->
                 <center>
-                  <video controls="controls" poster="/img/poster.jpg" crossorigin="crossorigin" width="640" height="360">
-                    <source src="https://download.fsfe.org/videos/pmpc/Fsfe-final-006-20k.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' media="screen and (min-device-width:1000px)" />
-<!--
-                    <source src="https://download.fsfe.org/videos/15years/FSFE15_38.webm"	type='video/webm; codecs="vp9, opus"' media="screen and (min-device-width:1000px)" />
-                    <source src="https://download.fsfe.org/videos/15years/FSFE15_mobile.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' media="screen and
-          (max-device-width:999px)" />
-                    <source src="https://download.fsfe.org/videos/15years/FSFE15_mobile.webm" type='video/webm; codecs="vp9, opus"' media="screen and (max-device-width:999px)" />
--->
+                  <video controls="controls" poster="/img/poster.jpg" crossorigin="crossorigin" width="100%">
+                    <source src="https://download.fsfe.org/videos/pmpc/pmpc_desktop.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' media="screen and (min-device-width:1000px)" />
+                    <source src="https://download.fsfe.org/videos/pmpc/pmpc_mobile.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' media="screen and (max-device-width:999px)" />
                     
-<!--
+                    <!--
                     <track src="https://download.fsfe.org/videos/15years/vtt/15years-FSFE.en.vtt" kind="subtitle" srclang="en" label="English" default="default">
                     <track src="https://download.fsfe.org/videos/15years/vtt/15years-FSFE.de.vtt" kind="subtitle" srclang="de" label="Deutsch">
                     <track src="https://download.fsfe.org/videos/15years/vtt/15years-FSFE.el.vtt" kind="subtitle" srclang="el" label="Ελληνικά">
@@ -45,7 +40,7 @@
                     <track src="https://download.fsfe.org/videos/15years/srt/15years-FSFE.tr.srt" kind="subtitle" srclang="tr" label="Türkçe">
                     <track src="https://download.fsfe.org/videos/15years/srt/15years-FSFE.sr.srt" kind="subtitle" srclang="sr" label="српски">
                     <track src="https://download.fsfe.org/videos/15years/srt/15years-FSFE.et.srt" kind="subtitle" srclang="et" label="eesti keel">
--->
+                    -->
 
                   </video>
                 </center>
diff --git a/site/static/css/custom.css b/site/static/css/custom.css
index 437df1b..24ca998 100644
--- a/site/static/css/custom.css
+++ b/site/static/css/custom.css
@@ -9,6 +9,12 @@
   text-align: center;
 }
 
+/* VIDEO in About section */
+#about video {
+  width: 100%    !important;
+  height: auto   !important;
+}
+
 /* LANGUAGE SECTION */
 #language {
     color: #fff;
@@ -147,7 +153,6 @@ a:not(.btn):not(.hiddenlink):hover::before, a:not(.btn):not(.hiddenlink):focus::
 }
 
 /* Bouncing down arrow */
-
 .arrow-bounce {
   text-align: center;
   margin: -30px 0;