{{- $src := .Get "src" | default (.Get 0) -}}
{{- $title := .Get "title" | default "Shared video" }}
<div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;">
  <video controls controlslist="noremoteplayback" preload="metadata" poster="{{ .Page.Permalink }}{{ $src }}.jpg">
    <source src="{{ .Page.Permalink }}{{ $src }}.webm" type="video/webm" />
    <source src="{{ .Page.Permalink }}{{ $src }}.ogv" type="video/ogv" />
    <source src="{{ .Page.Permalink }}{{ $src }}.mp4" type="video/mp4" />
    Oh sorry, we could not show you the video!<br />
    We had the following sources:
    <a href="{{ .Page.Permalink }}{{ $src }}.webm">webm</a>,
    <a href="{{ .Page.Permalink }}{{ $src }}.ogv">ogv</a>,
    <a href="{{ .Page.Permalink }}{{ $src }}.mp4">mp4</a>
  </video>
</div>