diff --git a/index.html b/index.html
index 500d645..4d97705 100644
--- a/index.html
+++ b/index.html
@@ -182,6 +182,10 @@
 <p class="date">2025-04-13</p>
 </header>
 <div class="header-container">
+<div class="mobile-image">
+<img src="./picture.jpg" alt="A picture of me" class="header-image" />
+<img src="./pfp.png" alt="My typical profile picture" class="header-image" />
+</div>
 <img src="./picture.jpg" alt="A picture of me" class="header-image left" />
 <div class="header-details">
 <h1>
diff --git a/jaytux.com.md b/jaytux.com.md
index 6d65be7..4382827 100644
--- a/jaytux.com.md
+++ b/jaytux.com.md
@@ -11,6 +11,10 @@ header-includes:
 ---
 
 <div class="header-container">
+ <div class="mobile-image">
+  <img src="./picture.jpg" alt="A picture of me" class="header-image" />
+  <img src="./pfp.png" alt="My typical profile picture" class="header-image" />
+ </div>
  <img src="./picture.jpg" alt="A picture of me" class="header-image left" />
  <div class="header-details">
   <h1>Jonas Sys</h1>
diff --git a/overrides.css b/overrides.css
index cd4c81c..f0a2f40 100644
--- a/overrides.css
+++ b/overrides.css
@@ -32,3 +32,18 @@ header {
   vertical-align: middle;
   height: 1em;
 }
+
+.mobile-image {
+  display: none;
+}
+
+@media(max-width: 700px) {
+  .mobile-image {
+    display: flex;
+    flex-direction: column;
+  }
+
+  .left, .right {
+    display: none;
+  }
+}