diff --git a/www/src/components/BlogPost.astro b/www/src/components/BlogPost.astro
index 0f43f00d9..77fa75f3f 100644
--- a/www/src/components/BlogPost.astro
+++ b/www/src/components/BlogPost.astro
@@ -11,7 +11,7 @@ export let heroImage: string;
   <article class="content">
   <div>
     <header>
-      {heroImage && <img width="1600" height="480" class="hero-image" loading="lazy" src={heroImage} />}
+      {heroImage && <img width="720" height="360" class="hero-image" loading="lazy" src={heroImage} />}
       <p class="publish-date">{publishDate}</p>
       <h1 class="title">{title}</h1>
       <Author authorId={author} />
@@ -24,11 +24,7 @@ export let heroImage: string;
 
 <style>
 .hero-image {
-  width: 100vw;
-  min-height: 320px;
-  height: 60vh;
-  max-height: 480px;
-  object-position: bottom center;
+  width: 100%;
   object-fit: cover;
   margin-bottom: 4rem;
 }