diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index a1d5691..78840a0 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -309,7 +309,7 @@ function App() {
           />
         </div>
 
-        <div className="relative z-10 flex flex-col gap-12 items-center lg:px-32 w-full lg:w-auto lg:max-w-7xl mx-auto -translate-y-56">
+        <div className="relative z-10 flex flex-col gap-12 items-center lg:px-24 w-full lg:w-auto lg:max-w-7xl mx-auto -translate-y-56">
           <h2
             id="previous-events"
             className="text-[#d7cfeb] text-6xl font-bold text-center mb-8 font-amatic"
diff --git a/frontend/src/components/StoryCard.tsx b/frontend/src/components/StoryCard.tsx
index e7bcc75..eb25600 100644
--- a/frontend/src/components/StoryCard.tsx
+++ b/frontend/src/components/StoryCard.tsx
@@ -7,7 +7,7 @@ interface StoryCardProps {
 
 function StoryCard({ imageSrc, imageAlt, title, description }: StoryCardProps) {
   return (
-    <div className="bg-[#d9d9d9] rounded-2xl p-6 flex flex-col gap-2 w-[347px] h-[557px] shadow-[0px_4px_4px_0px_rgba(0,0,0,0.25)]">
+    <div className="bg-white p-6 flex flex-1 basis-0 flex-col gap-2 h-[557px] shadow-[16px_16px_0px_0px_rgba(0,0,0,0.3)]">
       <img 
         src={imageSrc}
         alt={imageAlt}