{{ define "main" }}

    <div>
        <div id="mainBG" style="background-image: url('{{ if $.Site.Params.mainbg }}{{ $.Site.Params.mainbg }}{{ else }}https://picsum.photos/1920/1080{{ end }}');">

        <!-- layouts file variable -->
        {{ $layouts := .Site.Data.site.layouts }}

        <!-- Wave: load if enabled in data/site/layouts.single.enableWave -->
        {{ range $layouts.single }}
            {{if eq .enableWave "true"}}
                {{ partial "utilities/wave" .}}
            {{end}}
        {{end}}

            <div class="centerAll space-y-4">
                <div class="title font-bold text-center">
                    {{if  $.Title }}<h1>{{ .Title }}</h1>{{else}}Missing Title{{end}}
                </div>
                <div class="text-4xl italic text-center">
                    {{if  $.Params.Author }} by {{ .Params.Author }}{{end}}
                </div>
            </div>
        </div>


        <main class="container mx-auto mt-8 px-4 xl:px-0 justify-around space-y-2.5 whitespace-normal text-justify">
            {{ .Content }}
        </main>

    </div>
{{ end }}

