diff --git a/src/components/layout/WideContainer.tsx b/src/components/layout/WideContainer.tsx
index c5cb49ad..a1d49f03 100644
--- a/src/components/layout/WideContainer.tsx
+++ b/src/components/layout/WideContainer.tsx
@@ -11,8 +11,8 @@ export function WideContainer(props: WideContainerProps) {
     <div
       className={`mx-auto max-w-full px-8 ${
         props.ultraWide
-          ? "w-[1300px] 2xl:w-[2000px] 3xl:w-[2400px] 4xl:w-[2800px]"
-          : "w-[900px] 2xl:w-[1400px] 3xl:w-[1600px] 4xl:w-[1800px]"
+          ? "w-[1300px] xl:w-[18000px] 3xl:w-[2400px] 4xl:w-[2800px]"
+          : "w-[900px] xl:w-[1200px] 3xl:w-[1600px] 4xl:w-[1800px]"
       } ${props.classNames || ""}`}
     >
       {props.children}
diff --git a/src/components/media/MediaGrid.tsx b/src/components/media/MediaGrid.tsx
index fad039a1..26873a10 100644
--- a/src/components/media/MediaGrid.tsx
+++ b/src/components/media/MediaGrid.tsx
@@ -8,7 +8,7 @@ export const MediaGrid = forwardRef<HTMLDivElement, MediaGridProps>(
   (props, ref) => {
     return (
       <div
-        className="grid grid-cols-2 gap-6 sm:grid-cols-3 md:grid-cols-4 2xl:grid-cols-6 3xl:grid-cols-8 4xl:grid-cols-10"
+        className="grid grid-cols-2 gap-6 sm:grid-cols-3 md:grid-cols-4 xl:grid-cols-6 3xl:grid-cols-8 4xl:grid-cols-10"
         ref={ref}
       >
         {props.children}