diff --git a/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.html b/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.html
index 2f30e19..43e86ea 100644
--- a/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.html
+++ b/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.html
@@ -29,7 +29,7 @@
   >
     <div class="title">{{ currentMovie[0].title }}</div>
     <div
-      class="description"
+      class="description hide-scrollbar"
       [ngClass]="{
         fullVhDescription: !screenWidth
       }"
diff --git a/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.scss b/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.scss
index 6d9cf81..8277bce 100644
--- a/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.scss
+++ b/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.scss
@@ -33,7 +33,7 @@ section {
 
 .content {
   position: absolute;
-  width: 50%;
+  width: 60%;
   top: 120px;
   left: 96px;
   gap: 32px;
@@ -52,9 +52,6 @@ section {
   font-size: 18px;
   font-weight: 400;
   max-height: 96px;
-  height: fit-content;
-  overflow: hidden;
-  word-wrap: break-word;
   text-shadow: 1px 1px 2px $black;
 }
 
@@ -119,3 +116,16 @@ section {
   background-position: center;
   background-repeat: no-repeat;
 }
+
+// Hide scrollbar
+
+.hide-scrollbar {
+  overflow-y: auto;
+  overflow-x: hidden;
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+
+.hide-scrollbar::-webkit-scrollbar {
+  width: 0px;
+}