{{- $selection := .Page.Params -}}
<div class="min-w-[100vw] bg-light flex justify-center lg:pb-2">
  <div class="w-full max-w-[1000px] mx-auto flex flex-col items-center">
    {{ range $selection.quoteBox}}
    {{if .quoteImg}}
    {{range .quoteImg}}
    <div class="bg-white min-w-[100vw] flex justify-center relative -top-[7rem] -z-1">
      <img width="475px" height="300px" class="relative top-[9.5rem]" src="/assets/images/{{ .img}}" alt="{{ .alt}}">
    </div>
    {{end}}
    {{else}}
    <img loading="lazy" width="60px" height="60px" class="sm:my-4 sm:mb-2 pt-10" src="/assets/images/icons/{{.img}}"
      alt="quotation mark">
    {{end}}
    <div class="flex split-bg flex-col items-center px-8 pt-8 md:pt-4 pb-6 {{if .quoteImg}}mt-[5rem]{{end}}">
      <div class="sm:max-w-[600px] lg:max-w-full">
        <figure class="quote">
          <blockquote class="text-brand-blue font-semibold text-lg text-center leading-[1.5rem] md:px-16 max-w-[700px]">
            {{.quote | markdownify}}
          </blockquote>
          <figcaption class="text-base text-black pt-6 pb-10 text-center">
            {{.quoteAuthor | markdownify}}
          </figcaption>
        </figure>
      </div>
    </div>
    {{ end }}
  </div>
</div>