diff --git a/src/components/ProgressPopup/index.jsx b/src/components/ProgressPopup/index.jsx
index 28e064b4d..074baf17d 100644
--- a/src/components/ProgressPopup/index.jsx
+++ b/src/components/ProgressPopup/index.jsx
@@ -70,7 +70,7 @@ const ProgressPopup = ({
                 role="tab"
                 tabIndex={0}
               >
-                <div className={cn(styles["level-check-icon"], getLevelClass(level))}>
+                <div className={cn(styles["level-check-icon"], styles[getLevelClass(level)])}>
                   {getLevelClass(level) === "done" && (
                     <IconCheck className={styles["icon-check"]} />
                   )}
diff --git a/src/components/ProgressPopup/styles.module.scss b/src/components/ProgressPopup/styles.module.scss
index da1403ad4..34117296b 100644
--- a/src/components/ProgressPopup/styles.module.scss
+++ b/src/components/ProgressPopup/styles.module.scss
@@ -19,33 +19,33 @@
     &.current {
       cursor: pointer;
     }
-  }
-
-  .level-check-icon {
-    width: 24px;
-    height: 24px;
-    background: #f4f4f4;
-    border-radius: 50%;
-    margin-right: 10px;
-
-    &.done {
-      background: #06d6a0;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-
-      .icon-check {
-        height: 14px;
 
-        * {
-          fill: #ffffff;
+    .level-check-icon {
+      width: 24px;
+      height: 24px;
+      background: #f4f4f4;
+      border-radius: 50%;
+      margin-right: 10px;
+  
+      &.done {
+        background: #06d6a0;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+  
+        .icon-check {
+          height: 14px;
+  
+          * {
+            fill: #ffffff;
+          }
         }
       }
-    }
-
-    &.current {
-      border: 2px solid #06d6a0;
-      background: #ffffff;
+  
+      &.current {
+        border: 2px solid #06d6a0;
+        background: #ffffff;
+      }
     }
   }