Move introductory video to about page

Move video to about page

Author: axel-lauer

.gitignore

@@ -2,6 +2,8 @@
 _site
 .sass-cache
 .vagrant
+.bundle
+vendor/
 
 # general
 .DS_Store

_config.yml

@@ -21,7 +21,6 @@ navbar-links:
     - Gallery: "gallery"
     - References: "references"
     - Roadmap: "roadmap"
-    - Video: "video"
     - Tutorials: "tutorials"
     - License: "esmvaltool_license"
   Team:
@@ -272,6 +271,7 @@ exclude:
   - README.md
   - screenshot.png
   - docs/
+  - vendor/
 
 plugins:
   - jekyll-paginate

about.md

@@ -22,6 +22,8 @@ and reanalysis datasets. The development of ESMValTool is supported by several
 ESMValTool has been used in several chapters of the
 [Working Group I contribution to the Intergovernmental Panel on Climate Change's Sixth Assessment Report (IPCC AR6)](https://www.ipcc.ch/report/sixth-assessment-report-working-group-i/).
 
+
+
 ## Main Features
 
 * Community effort with more than [200 developers from over 60 institutes](https://www.esmvaltool.org/team)
@@ -34,3 +36,34 @@ ESMValTool has been used in several chapters of the
 * Well-documented source code and diagnostics.
 * Extensive [user documentation](https://docs.esmvaltool.org/).
 * Step-by-step [tutorial](https://tutorial.esmvaltool.org/) for new users and developers.
+
+
+## Video Introduction
+
+ESMValTool is listed as one of the [model benchmarking and evaluation tools on the CMIP website](https://wcrp-cmip.org/tools/model-benchmarking-and-evaluation-tools/). The [ESMValTool video](https://youtu.be/sidM4EB6Sbo?list=PLfNPd2rlkdzOxdo5tAZHS3VUeMFn2QwAj) from the CMIP Model Benchmarking Task Team is available on YouTube.
+
+<link rel="stylesheet" type="text/css" href="../assets/css/video.css">
+
+<div class="video" style="background-image: url('../assets/img/esmvaltool_video_preview_dark.jpg')">
+  <iframe
+    class="video__iframe"
+    width="736"
+    height="360"
+    data-src="https://www.youtube-nocookie.com/embed/sidM4EB6Sbo?si=u14rSG-pr7uYRiGY"
+    frameborder="0"
+    allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+    allowfullscreen="allowfullscreen"
+  ></iframe>
+  <form class="video__notice">
+    <p>
+      We've embedded content from YouTube here. As YouTube collects personal data and tracks your
+      viewing behavior, we'll only load the video after you consent to their use of cookies and
+      the technologies described in their
+      <a href="https://www.youtube.com/t/privacy">privacy policy</a>.
+    </p>
+	<input id="user_consent" type="button" value="Allow content from YouTube" onclick="activateVideos();" />
+  </form>
+</div>
+
+
+<script src="../assets/js/video.js"></script>