diff --git a/stylesheets/components/CallingLobby.scss b/stylesheets/components/CallingLobby.scss
index 8e2b6b8757c0..186e28579fe7 100644
--- a/stylesheets/components/CallingLobby.scss
+++ b/stylesheets/components/CallingLobby.scss
@@ -7,9 +7,12 @@
     object-fit: cover;
     opacity: 0.6;
     position: absolute;
-    transform: rotateY(180deg);
     width: 100%;
     z-index: -1;
+
+    &--camera-is-on {
+      transform: rotateY(180deg);
+    }
   }
 
   &__camera-is-off {
diff --git a/ts/components/CallingLobby.tsx b/ts/components/CallingLobby.tsx
index b7f864456336..d2ba46024950 100644
--- a/ts/components/CallingLobby.tsx
+++ b/ts/components/CallingLobby.tsx
@@ -153,13 +153,13 @@ export const CallingLobby = ({
     <div className="module-calling__container">
       {shouldShowLocalVideo ? (
         <video
-          className="module-CallingLobby__local-preview"
+          className="module-CallingLobby__local-preview module-CallingLobby__local-preview--camera-is-on"
           ref={localVideoRef}
           autoPlay
         />
       ) : (
         <CallBackgroundBlur
-          className="module-CallingLobby__local-preview"
+          className="module-CallingLobby__local-preview module-CallingLobby__local-preview--camera-is-off"
           avatarPath={me.avatarPath}
           color={me.color}
         />