diff --git a/index.html b/index.html
index 4c504bd..ad1ffc9 100644
--- a/index.html
+++ b/index.html
@@ -63,6 +63,15 @@ <h1>ChatVenture</h1>
       -->
     </div>
   </template>
+
+  <template id="game-over-template">
+    <div class="game-over-container">
+      <div class="game-over-logo">☠</div>
+      <h2>Game Over!!!</h2>
+      <p class="game-over-message"></p>
+      <button>Play again</button>
+    </div>
+  </template>
 </body>
 
 </html>
diff --git a/main.js b/main.js
index d89b080..4627960 100644
--- a/main.js
+++ b/main.js
@@ -34,6 +34,18 @@ const createImage = async (genre, setting) => {
   document.querySelector('.stage-image').innerHTML = `<img src="${image}" alt="${setting}" >`
 }
 
+const gameOver = (setting) => {
+  const gameOverTemplate = document.querySelector('#game-over-template');
+  const gameOver = gameOverTemplate.content.cloneNode(true);
+
+  gameOver.querySelector('.game-over-message').innerText = setting;
+  gameOver.querySelector('.game-over-container button').addEventListener(
+    'click',
+    () => window.location.reload()
+  );
+  stageContainer.append(gameOver);
+}
+
 const createStage = async (genre, setting, actions) => {
   const stageTemplate = document.querySelector('#stage-template');
   const stage = stageTemplate.content.cloneNode(true);
@@ -71,7 +83,11 @@ const setStage = async (genre) => {
     // Add the generated message to our message history
     chatGptMessages.push(message)
 
-    await createStage(genre, setting, actions);
+    if(actions.length) {
+      await createStage(genre, setting, actions);
+    } else {
+      gameOver(setting);
+    }
 
     showLoadingAnimation(false);
   } catch (error) {
diff --git a/style.css b/style.css
index f1aa04e..79d4a46 100644
--- a/style.css
+++ b/style.css
@@ -29,6 +29,22 @@ header {
   padding: 32px;
 }
 
+button {
+  background-color: transparent;
+  padding: 16px;
+  font-family: 'Space Grotesk', sans-serif;
+  font-size: 20px;
+  text-align: center;
+  color: white;
+  border: 2px solid #a1d2ff;
+  cursor: pointer;
+}
+
+button:hover {
+  background-color: rgba(255,255,255,0.7);
+  border: 4px solid #f1c82d;
+}
+
 .container {
   max-width: 720px;
   margin: 0 auto;
@@ -45,17 +61,6 @@ header {
   padding: 16px;
 }
 
-.stage-actions button {
-  background-color: transparent;
-  padding: 16px;
-  font-family: 'Space Grotesk', sans-serif;
-  font-size: 20px;
-  text-align: center;
-  color: white;
-  border: 2px solid #a1d2ff;
-  cursor: pointer;
-}
-
 .stage-image {
   display: grid;
   place-items: center;
@@ -65,6 +70,20 @@ header {
   max-width: 100%;
 }
 
+.game-over-container {
+  position: relative;
+  padding: 24px;
+  text-align: center;
+}
+
+.game-over-container .game-over-logo {
+  font-size: 60px;
+}
+
+.game-over-container button {
+  width: 100%;
+}
+
 .loading {
   display: flex;
   justify-content: center;
@@ -90,6 +109,7 @@ header {
 
 .genre {
   background-color: transparent;
+  padding: 0;
   width: 100px;
   height: 100px;
   overflow: hidden;
@@ -100,11 +120,6 @@ header {
   cursor: pointer;
 }
 
-.genre:hover {
-  background-color: rgba(255,255,255,0.7);
-  border: 4px solid #f1c82d;
-}
-
 .hidden {
   display: none;
 }