<div class="m-4 rounded-lg p-4 min-h-[40.27px] flex flex-row justify-between items-center bg-[#F1F5FC] dark:bg-[#232333]">
  {{ with site.GetPage "_index.md" }}
  <div class="w-full flex flex-row justify-between items-center">
    <a class="flex justify-center items-center mb-2 sm:mb-0" aria-label="Back to home" href="/">
      <img class="block h-[40.2667px]" alt="{{ .Params.logoAlt }}" src="{{ .Params.logo }}" loading="lazy" />
    </a>
    <div class="flex flex-row gap-2 items-center">
      {{ range .Params.social.main }}
      <a target="_blank" aria-label="{{ .label }}" href="{{ .url | safeURL }}" class="fill-[#F1F5FC] h-5 w-5 flex items-center">
        {{ .icon | safeHTML }}
      </a>
      {{ end }}
    </div>
  </div>
  {{ end }}
</div>