diff --git a/src/css/_base.scss b/src/css/_base.scss
index e1c49130b..408467ba0 100644
--- a/src/css/_base.scss
+++ b/src/css/_base.scss
@@ -61,7 +61,7 @@ body .root .content {
 body .root .content.theme.rtl {
   @import "base/breakpoints";
 
-  @media (min-width: $breakpoint-lg) {
+  @media (min-width: $breakpoint-xl) {
     header {
       h1 {
         font-size: xx-large;
diff --git a/src/js/components/SurahStream/Stream.tsx b/src/js/components/SurahStream/Stream.tsx
index 25372eb4f..f7f964a3e 100644
--- a/src/js/components/SurahStream/Stream.tsx
+++ b/src/js/components/SurahStream/Stream.tsx
@@ -25,7 +25,7 @@ export function Stream({ locale, surah, stream, endOfStream, isPaused, t }: Prop
         className={classNames(
           "body stream scroll-y list-none p-0 m-0 h-5/6",
           ...className,
-          { "mt-4": ltr, "mt-7": rtl },
+          { "mt-4": ltr, "mt-5": rtl },
         )}
         ref={ref}
       >