diff --git a/bigbluebutton-html5/imports/ui/components/nav-bar/recording-indicator/component.jsx b/bigbluebutton-html5/imports/ui/components/nav-bar/recording-indicator/component.jsx
index a8caaad553a8f6d5f51f0c803348cac9c1f56e3b..2e13d6cf070ed49a54e5f537f6d30cfddab512e2 100755
--- a/bigbluebutton-html5/imports/ui/components/nav-bar/recording-indicator/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/nav-bar/recording-indicator/component.jsx
@@ -10,8 +10,7 @@ export default class RecordingIndicator extends Component {
   render() {
     const { beingRecorded } = this.props;
     let classNames = {};
-    classNames[styles.indicator] = true;
-    classNames[styles.beingRecorded] = beingRecorded;
+    classNames[styles.indicator] = beingRecorded;
 
     return (
       <span className={cx(classNames)}></span>
diff --git a/bigbluebutton-html5/imports/ui/components/nav-bar/recording-indicator/styles.scss b/bigbluebutton-html5/imports/ui/components/nav-bar/recording-indicator/styles.scss
index 7f80be87b1cf6719026e907a0b78066a433a706d..79740d6932f7fd9efd48ae92f976fd2c8092ea23 100755
--- a/bigbluebutton-html5/imports/ui/components/nav-bar/recording-indicator/styles.scss
+++ b/bigbluebutton-html5/imports/ui/components/nav-bar/recording-indicator/styles.scss
@@ -19,11 +19,6 @@
     margin-left: -($font-size-base / 4);
     border-radius: 50%;
     background-color: $color-white;
-  }
-}
-
-.beingRecorded {
-  &:after {
     background-color: $color-danger !important;
   }
 }