diff --git a/src/components/VideoContentChapters.tsx b/src/components/VideoContentChapters.tsx
index 25aaf8f8..98bef86e 100644
--- a/src/components/VideoContentChapters.tsx
+++ b/src/components/VideoContentChapters.tsx
@@ -34,7 +34,7 @@ const VideoContentChapters = ({
   }, [player]);
 
   return (
-    <div className="w-full rounded-md border text-sm shadow-md lg:w-1/3">
+    <div className="w-full rounded-md border text-sm shadow-md semi:w-1/3">
       <div className="flex items-center justify-between bg-[#F5F5F5] p-2 py-3 dark:bg-[#212020]">
         <span>Chapters</span>
         <X onClick={onCancel} className="cursor-pointer" />
diff --git a/src/components/admin/ContentRendererClient.tsx b/src/components/admin/ContentRendererClient.tsx
index 7737ff8a..358cf0d3 100644
--- a/src/components/admin/ContentRendererClient.tsx
+++ b/src/components/admin/ContentRendererClient.tsx
@@ -88,7 +88,7 @@ export const ContentRendererClient = ({
   };
 
   return (
-    <div className="flex flex-col items-start gap-2 lg:flex-row">
+    <div className="flex flex-col items-start gap-2 semi:flex-row">
       <div className="w-full flex-1">
         <VideoPlayerSegment
           setQuality={setQuality}
diff --git a/tailwind.config.js b/tailwind.config.js
index 85199b2e..f6739cd8 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -15,6 +15,9 @@ module.exports = {
       padding: '2rem',
     },
     extend: {
+      screens: {
+        semi: '1140px'
+      },
       colors: {
         border: 'hsl(var(--border))',
         input: 'hsl(var(--input))',