diff --git a/src/components/GenerateCourse/AICourseContent.tsx b/src/components/GenerateCourse/AICourseContent.tsx
index 8abe38b58..86930bde7 100644
--- a/src/components/GenerateCourse/AICourseContent.tsx
+++ b/src/components/GenerateCourse/AICourseContent.tsx
@@ -291,14 +291,14 @@ export function AICourseContent(props: AICourseContentProps) {
               onUpgrade={() => setShowUpgradeModal(true)}
               onShowLimits={() => setShowAILimitsPopup(true)}
             />
-          </div>
 
-          <AIRoadmapViewSwitch
-            viewMode={viewMode}
-            setViewMode={setViewMode}
-            isLoading={isLoading}
-            variant="text"
-          />
+            <AIRoadmapViewSwitch
+              viewMode={viewMode}
+              setViewMode={setViewMode}
+              isLoading={isLoading}
+              variant="text"
+            />
+          </div>
         </div>
       </header>
 
diff --git a/src/components/GenerateCourse/AICourseRoadmapView.tsx b/src/components/GenerateCourse/AICourseRoadmapView.tsx
index 4a479ef5f..987805e77 100644
--- a/src/components/GenerateCourse/AICourseRoadmapView.tsx
+++ b/src/components/GenerateCourse/AICourseRoadmapView.tsx
@@ -199,7 +199,7 @@ export function AICourseRoadmapView(props: AICourseRoadmapViewProps) {
   );
 
   return (
-    <div className="relative mx-auto min-h-[500px] rounded-xl border border-gray-200 bg-white shadow-sm lg:max-w-7xl">
+    <div className="relative mx-auto min-h-[500px] rounded-xl border border-gray-200 bg-white shadow-sm lg:max-w-5xl">
       {isLoading && (
         <div className="absolute inset-0 flex h-full w-full items-center justify-center">
           <Loader2Icon className="h-10 w-10 animate-spin stroke-[3px]" />