diff --git a/src/components/brief.astro b/src/components/brief.astro
index d0160558..fa948a9b 100644
--- a/src/components/brief.astro
+++ b/src/components/brief.astro
@@ -50,7 +50,7 @@ const { title } = Astro.props;
     font-weight: 400;
     font-stretch: extra-condensed;
   }
-  .heading *:not(a) {
+  .heading {
     padding-left: 5%;
     padding-right: 5%;
     font-size: 1.2rem;
diff --git a/src/components/contact-footer.astro b/src/components/contact-footer.astro
new file mode 100644
index 00000000..0f3c1af0
--- /dev/null
+++ b/src/components/contact-footer.astro
@@ -0,0 +1,69 @@
+---
+import ContactForm from '@components/contact-form.astro';
+---
+
+<section class="contact-footer">
+  <div class="container">
+    <img src="/assets/about-bjerk.jpg" alt="Bilde av Bjerk" />
+    <section class="content">
+        <h2>Vi vil gjerne høre fra deg!</h2>
+        <p>
+          Uansett om du har en idé som vil forandre verden, eller om det er en
+          liten sak i hverdagen som må fikses, så er vi like ivrige.
+        </p>
+        <p>Ta kontakt med oss for en hyggelig kaffeprat!</p>
+        <ContactForm />
+    </section>
+  </div>
+</section>
+
+<style>
+  .contact-footer {
+    background-color: hsl(var(--blue-base) 95%);
+  }
+
+  a {
+    --link-color: hsl(var(--blue-base) 50%);
+  }
+
+  img {
+    max-width: 550px;
+    border-radius: 1rem;
+  }
+
+  @media (hover) {
+    a:hover {
+      --link-color: hsl(var(--blue-base) 25%);
+    }
+  }
+
+  .container {
+    width: var(--container-width);
+    margin-inline: auto;
+    padding-block: 4rem;
+    display: grid;
+    grid-template-columns: 1.5fr 1fr;
+    justify-content: center;
+    align-items: center;
+    flex-wrap: wrap;
+  }
+
+  .content {
+    flex-grow: 1;
+    max-width: 60ch;
+  }
+
+  .content p:last-child {
+    font-size: 0.8rem;
+  }
+
+  @media (max-width: 1024px) {
+    .container {
+      display: flex;
+      gap: 2rem;
+    }
+    img {
+      display: none;
+    }
+  }
+</style>
diff --git a/src/components/contact-form.astro b/src/components/contact-form.astro
new file mode 100644
index 00000000..5372d6f4
--- /dev/null
+++ b/src/components/contact-form.astro
@@ -0,0 +1,37 @@
+---
+---
+
+<form action="">
+  <div>
+    <input
+      placeholder="E-postadresse"
+      type="text"
+      name="name"
+      id="name"
+      required
+    />
+  </div>
+  <div>
+    <textarea
+      placeholder="Hva dreier deg seg om?"
+      name="text"
+      id="text"
+      rows="5"
+      required
+    >
+    </textarea>
+    <button class="primary" type="submit" id="submit">Send inn</button>
+  </div>
+</form>
+
+<style>
+  form,
+  div {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+  }
+  form {
+    gap: 2rem;
+  }
+</style>
diff --git a/src/components/footer.astro b/src/components/footer.astro
index f406f0ee..6dd6c72b 100644
--- a/src/components/footer.astro
+++ b/src/components/footer.astro
@@ -59,7 +59,6 @@ import LinkedInIcon from '~icons/ph/linkedin-logo-fill';
 
 <style>
   footer {
-    margin-top: 4rem;
     background-color: hsl(var(--blue-base) 20%);
   }
 
diff --git a/src/layouts/default.astro b/src/layouts/default.astro
index d6a88af5..02357ad5 100644
--- a/src/layouts/default.astro
+++ b/src/layouts/default.astro
@@ -3,6 +3,7 @@ import type { WithContext, Thing } from "schema-dts";
 import "@fontsource-variable/sora";
 import { jsonLd } from "./json-ld";
 import Header from "@components/header.astro";
+import ContactFooter from "@components/contact-footer.astro";
 import Footer from "@components/footer.astro";
 import { ViewTransitions } from "astro:transitions";
 
@@ -31,12 +32,12 @@ export type Props = {
    */
   headline?: string;
 
-    /**
+  /**
    * The heading on the page next to headline. Should be longer than headline.
    *
    * @default title
    */
-   heading?: string;
+  heading?: string;
 
   /**
    * The title for social media platforms. The ideal length is approximately 47 characters.
@@ -85,6 +86,11 @@ export type Props = {
    */
   articleAuthor?: string;
 
+  /**
+   * Set to false for pages that shouldn't have a contact form at the bottom.
+   */
+  contactFooter?: boolean;
+
   /**
    * JSON-LD structured data for the page.
    */
@@ -112,6 +118,7 @@ const {
   schema,
   articleAuthor,
   articlePublishDate,
+  contactFooter = true,
 } = Astro.props;
 
 // const parsedImages = images.map((image) => parseSocialMediaImage(image));
@@ -191,6 +198,10 @@ const canonical = new URL(path, Astro.site);
   <body>
     <Header />
     <slot />
+    {
+      contactFooter && 
+      <ContactFooter />
+    }
     <Footer />
     <style is:global>
       :root {
@@ -210,7 +221,6 @@ const canonical = new URL(path, Astro.site);
         --border-radius: 0.25rem;
         --border-radius-sm: 0.125rem;
       }
-
       html {
         font-family:
           'Sora Variable',
@@ -226,6 +236,9 @@ const canonical = new URL(path, Astro.site);
         -moz-osx-font-smoothing: grayscale;
         font-feature-settings: 'kern', 'liga';
       }
+      main {
+        margin-bottom: 4rem;
+      }
 
       body {
         margin: 0;
@@ -247,6 +260,25 @@ const canonical = new URL(path, Astro.site);
         color: #1d1d1d;
       }
 
+      .primary {
+        font-size: 1rem;
+        padding: 0.25rem 1rem;
+        border-radius: 16px;
+        border: solid;
+        border-width: 2px;
+        border-color: hsl(var(--green-base) 75%);
+        text-decoration: none;
+        background-color: hsl(var(--green-base) 75%);
+        width: fit-content;
+      }
+      .primary:hover {
+        background-color: hsl(var(--green-base) 75%);
+      }
+      .primary:active {
+        border-color: hsl(var(--green-base) 55%);
+        background-color: hsl(var(--green-base) 55%);
+      }
+
       body *::-webkit-scrollbar {
         background-color: hsl(var(--blue-base) 90%);
       }
@@ -275,6 +307,35 @@ const canonical = new URL(path, Astro.site);
         text-underline-offset: 0.125em;
       }
 
+      input,
+      textarea {
+        width: auto;
+        padding: 1em;
+        resize: none;
+        font-family:
+          'Sora Variable',
+          system-ui,
+          -apple-system,
+          sans-seri;
+        transition: all 0.5s ease;
+        max-width: 60ch;
+        background-color: transparent;
+      }
+      input {
+        border: none;
+        border-block-end: 1px solid grey;
+        padding: 16px 0;
+      }
+      textarea {
+        border-radius: 8px;
+      }
+      textarea:focus,
+      input:focus {
+        background-color: hsl(var(--blue-base) 95%);
+        padding: 16px 1em;
+        background-color: white;
+      }
+
       @media (hover) {
         a:hover {
           --link-color: hsl(var(--blue-base) 5%);
diff --git a/src/pages/kontakt/index.astro b/src/pages/kontakt/index.astro
index 546152ea..1ca79719 100644
--- a/src/pages/kontakt/index.astro
+++ b/src/pages/kontakt/index.astro
@@ -1,6 +1,8 @@
 ---
+import Brief from '@components/brief.astro';
 import Person from '@components/person.astro';
 import Layout from '@layouts/default.astro';
+import ContactForm from '@components/contact-form.astro';
 import { getCollection } from 'astro:content';
 
 const people = await getCollection('people');
@@ -26,6 +28,7 @@ const employees = people.filter(person => person.data.email.includes('@bjerk.io'
   socialMediaTitle="🚀 Start samtalen med Bjerk: Bli med å skap noe med oss!"
   socialMediaDescription="Start en samtale med Bjerk i dag for å lage skreddersydde løsningerog få tilgang på ekspertise innen digital innovasjon."
   path="/kontakt"
+  contactFooter={false}
   schema={{
     '@context': 'https://schema.org',
     '@type': 'ProfessionalService',
@@ -64,36 +67,44 @@ const employees = people.filter(person => person.data.email.includes('@bjerk.io'
   }}
 >
   <main>
-    <section class="brief">
-      <h1>Vi gleder oss til å høre fra deg!</h1>
-      <p>
-        Bjerk har kontorer i Oslo ved Akersgata 51, 0180 Oslo og Finland. Du får
-        tak i oss via e-post til
-        <a href="mailto:kontoret@bjerk.io">kontoret@bjerk.io</a>.
-      </p>
-    </section>
-
-    <section class="details">
-      <dl>
-        <div>
-          <dt>E-post</dt>
-          <dd>kontoret@bjerk.io</dd>
-        </div>
-        <div>
-          <dt>Adresse</dt>
-          <dd>
-            <a
-              href="https://maps.app.goo.gl/67ck5eWotdaAxZA5A"
-              target="_blank"
-              rel="noopener noreferrer"
-            >
-              Arbins gate 11, 0253 Oslo <!-- <ArrowSquareOut /> -->
-            </a>
-          </dd>
-        </div>
-      </dl>
-    </section>
-
+    <Brief title='Kontakt'>
+      <div class="contact-info">
+        <section>
+          <p>Vi gleder oss til å høre fra deg!</p>
+          <p>
+            Bjerk har kontorer i Oslo ved Arbins gate 11, 0253 Oslo og Finland. Du får
+            tak i oss via e-post til
+            <a href="mailto:kontoret@bjerk.io">kontoret@bjerk.io</a>.
+          </p>
+        </section>
+        <section class="details">
+          <dl>
+            <div>
+              <dt>E-post</dt>
+              <dd><a href="mailto:kontoret@bjerk.io">kontoret@bjerk.io</a></dd>
+            </div>
+            <div>
+              <dt>Adresse</dt>
+              <dd>
+                <a
+                  href="https://goo.gl/maps/FkcqThLgRtCauPmZA"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
+                  Arbins gate 11, 0253 Oslo <!-- <ArrowSquareOut /> -->
+                </a>
+              </dd>
+            </div>
+          </dl>
+        </section>
+        <section class="contact-form">
+          <p>
+            Send oss en melding
+          </p> 
+          <ContactForm />
+        </section>
+      </div>
+    </Brief>
     <section class="employees">
       {employees.map(person => <Person person={person} />)}
     </section>
@@ -111,6 +122,11 @@ const employees = people.filter(person => person.data.email.includes('@bjerk.io'
   .brief {
     max-width: 64ch;
   }
+  .contact-info {
+    display: flex;
+    flex-direction: column;
+    gap: 1em;
+  }
 
   main {
     width: var(--container-width);
@@ -119,12 +135,20 @@ const employees = people.filter(person => person.data.email.includes('@bjerk.io'
   }
 
   dl {
-    display: grid;
-    gap: 1rem;
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    font-size: 1rem;
+    gap: 2rem;
+    font-family:
+          'Sora Variable',
+          system-ui,
+          -apple-system,
+          sans-seri;
   }
 
   dl div > dt {
-    font-weight: bold;
+    opacity: 50%;
   }
 
   dl div > dd {
@@ -134,7 +158,6 @@ const employees = people.filter(person => person.data.email.includes('@bjerk.io'
   dl div > dd a {
     color: inherit;
   }
-
   .employees {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(244px, 1fr));