diff --git a/_layouts/default.html b/_layouts/default.html
index 06d4ebe..673a7b6 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -26,15 +26,42 @@
     {% endif %}
     {% endfor %}
     {% endif %}
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
   </head>
 
   <body>
     {%- include header.html -%}
+    <header>
+      <div id="postSlider" class="carousel slide slider-container" data-bs-ride="carousel">
+        <div class="carousel-inner">
+          {% for post in site.posts %}
+          <div class="carousel-item {% if forloop.first %}active{% endif %}">
+            <div class="email-circle">
+              <img src="{{ post.featured_image | default: post.content | split: '!' | first | split: '(' | last | split: ')' | first | default: 'default-image.jpg' }}" alt="{{ post.title }}">
+            </div>
+            <h3 class="post-title">{{ post.title }}</h3>
+            <p class="post-summary">{{ post.excerpt | strip_html | truncatewords: 20 }}</p>
+          </div>
+          {% endfor %}
+        </div>
+
+        <!-- Controls -->
+        <button class="carousel-control-prev" type="button" data-bs-target="#postSlider" data-bs-slide="prev">
+          <span class="carousel-control-prev-icon" aria-hidden="true"></span>
+          <span class="visually-hidden">Previous</span>
+        </button>
+        <button class="carousel-control-next" type="button" data-bs-target="#postSlider" data-bs-slide="next">
+          <span class="carousel-control-next-icon" aria-hidden="true"></span>
+          <span class="visually-hidden">Next</span>
+        </button>
+      </div>
+    </header>
     <main class="container" role="main" aria-label="Content">
         {{ content }}
     </main>
     {%- include footer.html -%}
     <script src="{{ '/assets/js/index.js' | relative_url }}"></script>
     <script src="https://kit.fontawesome.com/1bbe56de49.js" crossorigin="anonymous"></script>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
   </body>
 </html>
diff --git a/_layouts/index.html b/_layouts/index.html
index a3b4b19..542321c 100644
--- a/_layouts/index.html
+++ b/_layouts/index.html
@@ -2,10 +2,6 @@
 layout: default
 ---
 <div class="home">
-  {% assign t = site.data.locales[page.lang][page.lang] %} {% if page.title %} {% assign header = page.title %} {% else %} {% assign header = site.title %} {% endif %}
-  <article class="hero">
-    <div class="hero-text">{{ t.index.lead }}</div>
-  </article>
   {{ content }}
 
   <img src="{{'/assets/images/dcus.jpg' | relative_url }}"  alt="DjangoCon US 2023"/>
diff --git a/assets/css/bpd.css b/assets/css/bpd.css
index 7c53dd0..7b095f1 100644
--- a/assets/css/bpd.css
+++ b/assets/css/bpd.css
@@ -517,3 +517,51 @@ ul.speaking-list {
     max-width: 60%;
   }
 }
+
+header {
+  padding: 40px 20px;
+  margin-bottom: 20px;
+  /* background-color: black; */
+}
+.slider-container {
+  min-height: 300px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  /* background-image: url("/assets/images/hero-bpd-background.jpg"); */
+  background-color: #222;
+  padding: 40px;
+  border-radius: 10px;
+  margin: 0 auto;
+  width: 85%;
+  /* max-width: 1000px; */
+}
+.email-circle {
+  width: 200px;
+  height: 200px;
+  background-color: #fff;
+  border-radius: 50%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin: 0 auto 15px;
+  overflow: hidden;
+}
+.email-circle img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+.carousel-item {
+  text-align: center;
+}
+.post-title {
+  font-size: 25px;
+  font-weight: bold;
+  color: white;
+  margin-bottom: 10px;
+}
+.post-summary {
+  font-size: 15px;
+  color: #f1f1f1;
+}
