diff --git a/packages/features/bookings/Booker/components/EventMeta.tsx b/packages/features/bookings/Booker/components/EventMeta.tsx
index 32fad2b847ee17..5741907ccd583f 100644
--- a/packages/features/bookings/Booker/components/EventMeta.tsx
+++ b/packages/features/bookings/Booker/components/EventMeta.tsx
@@ -12,6 +12,7 @@ import { useTimePreferences } from "@calcom/features/bookings/lib";
 import type { BookerEvent } from "@calcom/features/bookings/types";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 
+import "../../../bookings/lib/global.css";
 import { fadeInUp } from "../config";
 import { useBookerStore } from "../store";
 import { FromToTime } from "../utils/dates";
@@ -121,7 +122,7 @@ export const EventMeta = ({
           )}
           <EventTitle className={`${classNames?.eventMetaTitle} my-2`}>{event?.title}</EventTitle>
           {event.description && (
-            <EventMetaBlock contentClassName="mb-8 break-words max-w-full max-h-[180px] scroll-bar pr-4">
+            <EventMetaBlock contentClassName="mb-8 break-words max-w-full max-h-[180px] overflow-y-auto pr-4">
               <div dangerouslySetInnerHTML={{ __html: event.description }} />
             </EventMetaBlock>
           )}
diff --git a/packages/features/bookings/lib/global.css b/packages/features/bookings/lib/global.css
new file mode 100644
index 00000000000000..08d75de69e0b68
--- /dev/null
+++ b/packages/features/bookings/lib/global.css
@@ -0,0 +1,16 @@
+/* Scrollbar styles */
+::-webkit-scrollbar {
+    width: 12px;
+  }
+  
+  ::-webkit-scrollbar-track {
+    border: 1px solid rgb(231, 232, 229);
+    border-radius: 10px;
+  }
+  
+  ::-webkit-scrollbar-thumb {
+    background:rgb(231, 232, 229);
+    border-radius: 10px;
+  }
+
+  
\ No newline at end of file