---
import { Image } from "astro:assets"
import me from "../images/me.jpg"
import * as m from "../paraglide/messages.js"
import "../styles/global.css"
---

<div class="flex items-center justify-around flex-wrap">
  <div class="m-5">
    <h1 class="sm:text-7xl font-bold">
      {m.hiIm()}
      <br />
      Martin Berg Alstad
      <br />
      {m.position()}
    </h1>
    <p class="mx-1 sm:my-10">{m.aboutMe()}</p>
  </div>
  <Image src={me} alt="Me on a hike" width="400" height="400" class="p-5 mx-auto" />
</div>