{{ partial "header.html" . }}

<div class="header" style="background-color: whitesmoke; opacity: 100%">
    <h1 style="color: #065387; font-size: 44px">{{ .Title }}</h1>
    <h2 style="color: dimgrey; font-size: 22px">{{ with .Params.series }}{{.}}{{end}}</h2>
</div>

<div class="content" style="text-align: justify-all">
    <span style="width: 100%; padding: 2px; alignment: center">
    <div style="float:left; font-size:medium; font-weight:normal; padding: 2px; margin: 2px">
        <i class="fa fa-calendar fa-fw"></i>
        <time> {{ with .Site.Params.dateFormat }}{{ $.Date.Format . }}{{ else }}{{ .Date.Format "02 Jan 2006, 15:04 BST" }}{{ end }}</time>
    </div>
    <div style="float:right; font-size:small; font-weight: normal; padding: 2px; margin: 2px">
        <time><em>Updated: {{ .Lastmod.Format "02 Jan 2006, 15:04" }} </em></time>
    </div>
    {{ if isset .Params "image" }}
        <img class="featured-image" src="{{ .Site.Params.podcastCdnURL }}{{ with .Params.image }}{{ . }}{{ end }}" />
    {{ end }}
    </span>
    <span style="text-align: justify">
    {{ .Content }}
    </span>
    <script>
        let audio = document.getElementById("audio_player");

        function set_volume(){
            audio.volume = 0.4;
        }
    </script>
</div>

{{ partial "footer.html" . }}