diff --git a/checkout/src/arquivos/js/components/Header.js b/checkout/src/arquivos/js/components/Header.js
index fb5bd58..ad07941 100644
--- a/checkout/src/arquivos/js/components/Header.js
+++ b/checkout/src/arquivos/js/components/Header.js
@@ -43,7 +43,7 @@ export default class Header {
                             "active"
                         );
                     }
-                    
+
 
                     if (li.children[0].children[0].children["progress-bar-circle-2"]) {
                         if (
diff --git a/checkout/src/arquivos/sass/utils/_variaveis.scss b/checkout/src/arquivos/sass/utils/_variaveis.scss
index f000abe..26d6e40 100644
--- a/checkout/src/arquivos/sass/utils/_variaveis.scss
+++ b/checkout/src/arquivos/sass/utils/_variaveis.scss
@@ -10,10 +10,16 @@ $color-black: #292929;
 $color-white: #fff;
 
 $color-gray: #6c6c6c;
-$color-gray2: #7d7d7d;
 $color-gray3: #f0f0f0;
-$color-gray4: #8d8d8d;
-$color-gray5: #e5e5e5;
+
+$gray-50: #e5e5e5;
+$gray-100: #f0f0f0;
+$gray-125: #c4c4c4;
+$gray-150: #989898;
+$gray-200: #8d8d8d;
+$gray-500: #292929;
+
+$blue: #00c8ff;
 
 $color-blue: #4267b2;
 
@@ -22,11 +28,14 @@ $color-green: #4caf50;
 /* Grid breakpoints */
 $grid-breakpoints: (
 	xs: 0,
-	cstm: 400,
-	sm: 576px,
-	md: 768px,
-	lg: 992px,
-	xl: 1200px
+    Gf: 328px,
+    cstm: 400,
+    sm: 576px,
+    md: 768px,
+    lg: 992px,
+    dt: 1025px,
+    xl: 1200px,
+    tv: 2500px,
 ) !default;
 
 $z-index: (