diff --git a/src/lib/Brukere.svelte b/src/lib/Brukere.svelte
index 842f065..21b4ecd 100644
--- a/src/lib/Brukere.svelte
+++ b/src/lib/Brukere.svelte
@@ -1,6 +1,6 @@
 <script>
-	import Navlogo from './icons/Navlogo.svelte';
-	import SsblogoFull from './icons/SsblogoFull.svelte';
+	import Navlogo from "./icons/Navlogo.svelte";
+	import SsblogoFull from "./icons/SsblogoFull.svelte";
 </script>
 
 <div class="section">
@@ -10,7 +10,8 @@
 		<SsblogoFull />
 	</div>
 	<div>
-		<a class="mail" href="mailto:nais@nav.no">Snakk med oss</a> om Nais kan passe hos dere
+		<a class="mail" href="mailto:nais@nav.no">Snakk med oss</a>
+		 om Nais kan passe hos dere
 	</div>
 </div>
 
@@ -18,7 +19,7 @@
 	.section {
 		font-size: 1.5rem;
 		padding-block: 4rem;
-		padding-inline: 4vw;
+		padding-inline: min(4vw, 3.6rem);
 		max-width: var(--content-max-width);
 		text-align: center;
 		display: grid;
@@ -29,7 +30,7 @@
 	}
 	.section::after {
 		position: absolute;
-		content: '';
+		content: "";
 		height: 300px;
 		width: 500px;
 		left: 40%;
diff --git a/src/lib/Glances.svelte b/src/lib/Glances.svelte
index 0956993..414f065 100644
--- a/src/lib/Glances.svelte
+++ b/src/lib/Glances.svelte
@@ -1,13 +1,13 @@
 <script>
-	import Glance from '$lib/Glance.svelte';
+	import Glance from "$lib/Glance.svelte";
 	import {
 		BulletListIcon,
 		CogRotationIcon,
 		HandShakeHeartIcon,
 		RocketIcon,
 		SealCheckmarkIcon,
-		VitalsIcon
-	} from '@nais/ds-svelte-community/icons';
+		VitalsIcon,
+	} from "@nais/ds-svelte-community/icons";
 </script>
 
 <div class="glances">
@@ -45,7 +45,7 @@
 <style>
 	.glances {
 		font-size: 1.15rem;
-		padding: 8vw 4vw;
+		padding: min(8vw, 7.2rem) min(4vw, 3.6rem);
 		max-width: var(--content-max-width);
 		display: grid;
 		grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
@@ -57,7 +57,7 @@
 	}
 	.glances::after {
 		position: absolute;
-		content: '';
+		content: "";
 		height: 300px;
 		width: 500px;
 		left: 0;
diff --git a/src/lib/Header.svelte b/src/lib/Header.svelte
index c08b065..84153b6 100644
--- a/src/lib/Header.svelte
+++ b/src/lib/Header.svelte
@@ -1,7 +1,7 @@
 <script>
-	import { page } from '$app/stores';
-	import { get } from 'svelte/store';
-	import Nais from './icons/Nais.svelte';
+	import { page } from "$app/stores";
+	import { get } from "svelte/store";
+	import Nais from "./icons/Nais.svelte";
 
 	const isActive = (/** @type {string} */ path) => get(page).url.pathname.startsWith(`/${path}`);
 	let isOpen = $state(false);
@@ -22,14 +22,14 @@
 			fill="none"
 			viewBox="0 0 24 24"
 			focusable="false"
-			role="img"
-			><path
+			role="img">
+			<path
 				fill="currentColor"
 				fill-rule="evenodd"
 				d="M2.75 6a.75.75 0 0 1 .75-.75h17a.75.75 0 0 1 0 1.5h-17A.75.75 0 0 1 2.75 6m0 6a.75.75 0 0 1 .75-.75h17a.75.75 0 0 1 0 1.5h-17a.75.75 0 0 1-.75-.75m.75 5.25a.75.75 0 0 0 0 1.5h17a.75.75 0 0 0 0-1.5z"
-				clip-rule="evenodd"
-			></path></svg
-		>
+				clip-rule="evenodd">
+			</path>
+		</svg>
 	</button>
 	<nav class="main-menu" class:isOpen>
 		<ul class="main-menu-list">
@@ -41,44 +41,42 @@
 			</li> -->
 			<li><a class="main-menu-item" href="mailto:nais@nav.no">Kontakt oss</a></li>
 		</ul>
-		<a class="mobile-github-link" href="https://github.com/nais" aria-label="nais github"
-			><svg width="1em" height="1em" viewBox="0 0 98 98" xmlns="http://www.w3.org/2000/svg"
-				><path
+		<a class="mobile-github-link" href="https://github.com/nais" aria-label="nais github">
+			<svg width="1em" height="1em" viewBox="0 0 98 98" xmlns="http://www.w3.org/2000/svg">
+				<path
 					fill-rule="evenodd"
 					clip-rule="evenodd"
 					d="M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172 33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59 2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015 4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235 4.074.404-3.178 1.699-5.378 3.074-6.6-10.839-1.141-22.243-5.378-22.243-24.283 0-5.378 1.94-9.778 5.014-13.2-.485-1.222-2.184-6.275.486-13.038 0 0 4.125-1.304 13.426 5.052a46.97 46.97 0 0 1 12.214-1.63c4.125 0 8.33.571 12.213 1.63 9.302-6.356 13.427-5.052 13.427-5.052 2.67 6.763.97 11.816.485 13.038 3.155 3.422 5.015 7.822 5.015 13.2 0 18.905-11.404 23.06-22.324 24.283 1.78 1.548 3.316 4.481 3.316 9.126 0 6.6-.08 11.897-.08 13.526 0 1.304.89 2.853 3.316 2.364 19.412-6.52 33.405-24.935 33.405-46.691C97.707 22 75.788 0 48.854 0z"
-					fill="currentColor"
-				/></svg
-			></a
-		>
+					fill="currentColor" />
+			</svg>
+		</a>
 	</nav>
-	<a class="desktop-github-link" href="https://github.com/nais" aria-label="nais github"
-		><svg width="1em" height="1em" viewBox="0 0 98 98" xmlns="http://www.w3.org/2000/svg"
-			><path
+	<a class="desktop-github-link" href="https://github.com/nais" aria-label="nais github">
+		<svg width="1em" height="1em" viewBox="0 0 98 98" xmlns="http://www.w3.org/2000/svg">
+			<path
 				fill-rule="evenodd"
 				clip-rule="evenodd"
 				d="M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172 33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59 2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015 4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235 4.074.404-3.178 1.699-5.378 3.074-6.6-10.839-1.141-22.243-5.378-22.243-24.283 0-5.378 1.94-9.778 5.014-13.2-.485-1.222-2.184-6.275.486-13.038 0 0 4.125-1.304 13.426 5.052a46.97 46.97 0 0 1 12.214-1.63c4.125 0 8.33.571 12.213 1.63 9.302-6.356 13.427-5.052 13.427-5.052 2.67 6.763.97 11.816.485 13.038 3.155 3.422 5.015 7.822 5.015 13.2 0 18.905-11.404 23.06-22.324 24.283 1.78 1.548 3.316 4.481 3.316 9.126 0 6.6-.08 11.897-.08 13.526 0 1.304.89 2.853 3.316 2.364 19.412-6.52 33.405-24.935 33.405-46.691C97.707 22 75.788 0 48.854 0z"
-				fill="currentColor"
-			/></svg
-		></a
-	>
+				fill="currentColor" />
+		</svg>
+	</a>
 </header>
 
 <style>
 	.header {
 		display: grid;
 		grid-template-areas:
-			'home button'
-			'menu menu';
+			"home button"
+			"menu menu";
 		align-items: center;
-		padding-inline: 4vw;
+		padding-inline: min(4vw, 3.6rem);
 		position: relative;
 		overflow-x: clip;
 	}
 	.header::before,
 	.header::after {
 		position: absolute;
-		content: '';
+		content: "";
 		height: 300px;
 		width: 500px;
 		left: 50%;
@@ -157,7 +155,7 @@
 	}
 	@media (min-width: 768px) {
 		.header {
-			grid-template-areas: 'home menu github';
+			grid-template-areas: "home menu github";
 			grid-template-columns: auto 1fr auto;
 			justify-items: center;
 			max-width: var(--content-max-width);
diff --git a/src/lib/Hero.svelte b/src/lib/Hero.svelte
index 790cfa5..77ee7c5 100644
--- a/src/lib/Hero.svelte
+++ b/src/lib/Hero.svelte
@@ -1,5 +1,5 @@
 <script>
-	import Navlogo from '$lib/icons/Navlogo.svelte';
+	import Navlogo from "$lib/icons/Navlogo.svelte";
 </script>
 
 <div class="hero">
@@ -19,13 +19,13 @@
 
 <style>
 	.hero {
-		padding: 8vw 4vw;
+		padding: min(8vw, 7.2rem) min(4vw, 3.6rem);
 		max-width: var(--content-max-width);
 		margin: auto;
 		display: flex;
 		flex-direction: column;
 		align-items: center;
-		gap: 8vw;
+		gap: min(8vw, 7.2rem);
 	}
 	.content {
 		font-size: 1.5rem;