diff --git a/app/missions/layout.tsx b/app/missions/layout.tsx
index 1c52723d..f97c0c79 100644
--- a/app/missions/layout.tsx
+++ b/app/missions/layout.tsx
@@ -1,9 +1,6 @@
 "use client";
 
 import React from "react";
-import { ScrollArea } from "@/components/ui/scroll-area";
-import { Button } from "@/components/ui/button";
-import { Kanban, Plus } from "lucide-react";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 
@@ -15,33 +12,20 @@ export default function MissionsLayout({
   const pathname = usePathname();
   
   return (
-    <div className="flex h-screen">
-      {/* Sidebar */}
-      <div className="w-[246px] min-w-[246px] border-r bg-white">
-        <ScrollArea className="h-full">
-          <div className="p-4 space-y-2">
-            <Link href="/missions" passHref>
-              <div className={`w-full p-3 rounded-md ${pathname === "/missions" ? "bg-slate-100" : "hover:bg-slate-50"}`}>
-                <span className="text-sm font-medium">Mes Missions</span>
-              </div>
-            </Link>
-            <Link href="/missions/new" passHref>
-              <div className={`w-full p-3 rounded-md ${pathname === "/missions/new" ? "bg-slate-100" : "hover:bg-slate-50"}`}>
-                <span className="text-sm font-medium">Nouvelle Mission</span>
-              </div>
-            </Link>
-          </div>
-        </ScrollArea>
+    <div className="flex h-screen overflow-hidden">
+      {/* Sidebar - simple with just nav items */}
+      <div className="w-[235px] min-w-[235px] bg-white overflow-y-auto">
+        <nav className="py-0">
+          <Link href="/missions" passHref>
+            <div className={`px-6 py-3 ${pathname === "/missions" ? "bg-slate-100" : "hover:bg-slate-50"}`}>
+              <span className="text-sm font-medium">Mes Missions</span>
+            </div>
+          </Link>
+        </nav>
       </div>
       
-      {/* Main content */}
-      <div 
-        className="flex-1 overflow-auto bg-cover bg-center" 
-        style={{ 
-          backgroundImage: "url('/images/wood-background.jpg')",
-          backgroundRepeat: "repeat",
-        }}
-      >
+      {/* Main content - full-width, no padding */}
+      <div className="flex-1 overflow-auto">
         {children}
       </div>
     </div>
diff --git a/app/missions/page.tsx b/app/missions/page.tsx
index 601770a9..ce883876 100644
--- a/app/missions/page.tsx
+++ b/app/missions/page.tsx
@@ -47,65 +47,74 @@ export default function MissionsPage() {
   );
   
   return (
-    <div className="p-0">
-      <div className="flex items-center justify-between bg-blue-900 bg-opacity-20 p-6">
-        <h1 className="text-lg font-semibold text-white">Gérez vos missions et opportunités de bénévolat</h1>
-        <div className="flex items-center space-x-2">
-          <div className="relative">
-            <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-500 h-4 w-4" />
-            <Input
-              placeholder="Rechercher une mission..."
-              className="pl-9 pr-4 py-2 bg-white/90 border-0 w-64"
-              value={searchTerm}
-              onChange={(e) => setSearchTerm(e.target.value)}
-            />
+    <div 
+      className="min-h-screen bg-cover bg-center"
+      style={{
+        backgroundImage: "url('https://images.unsplash.com/photo-1483921020237-2ff51e8e4b22?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1170&q=80')"
+      }}
+    >
+      <div className="pt-0">
+        <div className="flex items-center justify-between bg-black bg-opacity-30 px-4 py-2 mb-4">
+          <h1 className="text-white text-sm font-normal">Gérez vos missions et opportunités de bénévolat</h1>
+          <div className="flex items-center">
+            <div className="relative mr-2">
+              <Search className="absolute left-2 top-1/2 transform -translate-y-1/2 text-gray-500 h-4 w-4" />
+              <Input
+                placeholder="Rechercher une mission..."
+                className="pl-8 pr-2 py-1 text-sm h-8 bg-white border-0 rounded-sm w-48"
+                value={searchTerm}
+                onChange={(e) => setSearchTerm(e.target.value)}
+              />
+            </div>
+            <Link href="/missions/new">
+              <Button className="bg-blue-600 hover:bg-blue-700 text-white h-8 text-sm px-3 py-0 rounded-sm">
+                <Plus className="h-3.5 w-3.5 mr-1" />
+                Nouvelle Mission
+              </Button>
+            </Link>
           </div>
-          <Link href="/missions/new">
-            <Button className="bg-blue-600 hover:bg-blue-700 text-white">
-              <Plus className="h-4 w-4 mr-2" />
-              Nouvelle Mission
-            </Button>
-          </Link>
         </div>
-      </div>
-      
-      <div className="p-6 grid grid-cols-1 md:grid-cols-3 gap-6">
-        {filteredMissions.map(mission => (
-          <div key={mission.id} className="bg-white rounded-lg overflow-hidden shadow">
-            <div className="p-4">
-              <div className="flex justify-between items-start mb-3">
-                <span className="inline-block px-2 py-1 text-xs rounded bg-gray-200 text-gray-800 font-medium">
-                  {mission.category}
-                </span>
-                <span className="text-sm text-gray-500 border border-gray-200 rounded px-2 py-1">
-                  {mission.duration}
-                </span>
-              </div>
-              
-              <h2 className="text-lg font-semibold mb-2">{mission.title}</h2>
-              <p className="text-sm text-gray-600 mb-4">Location: {mission.location}</p>
-              
-              <div className="flex flex-wrap gap-1 mb-4">
-                {mission.skills.map(skill => (
-                  <span key={skill} className="bg-gray-100 text-gray-700 px-2 py-1 rounded text-xs">
-                    {skill}
+        
+        <div className="px-4 grid grid-cols-1 md:grid-cols-3 gap-4">
+          {filteredMissions.map((mission, index) => (
+            <div key={mission.id} className="bg-white rounded-sm shadow-md overflow-hidden max-w-full mx-0">
+              <div className="p-0">
+                <div className="flex items-center justify-between px-4 pt-4 pb-2">
+                  <span className="inline-block px-2 py-1 text-xs bg-gray-100 text-gray-800 rounded-sm">
+                    {mission.category}
                   </span>
-                ))}
-              </div>
-              
-              <div className="flex justify-between items-center mt-2">
-                <span className="text-xs text-gray-500">
-                  Créée le {mission.createdAt}
-                </span>
-                <Link href={`/missions/${mission.id}`}>
-                  <span className="px-3 py-1 bg-black text-white text-xs rounded font-medium">
-                    Voir détails
+                  <span className="text-xs text-gray-500 px-2 py-1 border border-gray-200 rounded-sm">
+                    {mission.duration}
                   </span>
-                </Link>
+                </div>
+                
+                <div className="px-4 pb-4">
+                  <h2 className="text-base font-semibold mb-1">{mission.title}</h2>
+                  <p className="text-sm text-gray-600 mb-4">Location: {mission.location}</p>
+                  
+                  <div className="flex flex-wrap gap-1 mb-4">
+                    {mission.skills.map(skill => (
+                      <span key={skill} className="bg-gray-100 text-gray-700 px-2 py-1 rounded-sm text-xs">
+                        {skill}
+                      </span>
+                    ))}
+                  </div>
+                </div>
+                
+                <div className="flex justify-between items-center px-4 py-2 border-t border-gray-100">
+                  <span className="text-xs text-gray-500">
+                    Créée le {mission.createdAt.replace('2023-', '')}
+                  </span>
+                  <Link href={`/missions/${mission.id}`}>
+                    <Button className="bg-black text-white text-xs px-3 py-1 h-7 rounded-sm">
+                      Voir détails
+                    </Button>
+                  </Link>
+                </div>
               </div>
             </div>
-          </div>
-        ))}
+          ))}
+        </div>
       </div>
     </div>
   );