diff --git a/checkout/src/arquivos/js/components/Header.js b/checkout/src/arquivos/js/components/Header.js
index 6744524..f19f6a9 100644
--- a/checkout/src/arquivos/js/components/Header.js
+++ b/checkout/src/arquivos/js/components/Header.js
@@ -8,14 +8,240 @@ export default class Header {
 
     async init() {
         await this.selectors();
-        console.log(this.item);
+        this.createProgressBar();
+        await this.progressBarProgress();
     }
 
     async selectors() {
-        this.item = await waitElement("#my-element", {
-            //#my-element pode ser a class ou o id do elemento html qeu vocÊ quer pegar
-            timeout: 5000, // vai esperar 5 segundos antes de rejeitar a promise
-            interval: 1000, // vai verificar a cada 1 segundo se o elemento existe
-        });
+        this.header = await waitElement(".headerCheckout");
+        this.progressBar = await waitElement("#progressBar");
+    }
+    createProgressBar() {
+        if (this.progressBar && window.innerWidth > 1024) {
+            this.progressBar.innerHTML = `
+                <ul>
+                    <li>
+                        <div class="containerLi">
+                            <div>
+                                <p class="progress-bar-text">Meu carrinho</p>
+                                <p id="progress-bar-circle-1" class="progress-bar-circle-1"></p>
+                                <p class="progress-bar-line-1"></p>
+                            </div>
+                        </div>
+                    </li>
+                    <li class="central">
+                        <div class="containerLi">
+                            <div>
+                                <p class="progress-bar-text">Dados Pessoais</p>
+                                <p id="progress-bar-circle-2" class="progress-bar-circle-2"></p>
+                            </div>
+                        </div>
+                    </li>
+                    <li>
+                        <div class="containerLi">
+                            <div>
+                                <p class="progress-bar-text">Pagamento</p>
+                                <p id="progress-bar-circle-3" class="progress-bar-circle-3"></p>
+                                <p class="progress-bar-line-2"></p>
+                            </div>
+                        </div>
+                    </li>
+                </ul>
+            `;
+        }
+        if (this.progressBar && window.innerWidth <= 1024) {
+            this.progressBar.innerHTML = ``;
+        }
+    }
+    async progressBarProgress() {
+        if (this.progressBar && window.innerWidth > 1024) {
+            const progressBarList = document.querySelectorAll("#progressBar ul li");
+            progressBarList.forEach((li) => {
+                if (window.location.href == "https://m3academy.myvtex.com/checkout/#/cart") {
+                    if (li.children[0].children[0].children["progress-bar-circle-1"]) {
+                        li.children[0].children[0].children["progress-bar-circle-1"].classList.add(
+                            "active"
+                        );
+                    }
+                    if (li.children[0].children[0].children["progress-bar-circle-2"]) {
+                        if (
+                            li.children[0].children[0].children[
+                                "progress-bar-circle-2"
+                            ].classList.contains("active")
+                        ) {
+                            li.children[0].children[0].children[
+                                "progress-bar-circle-2"
+                            ].classList.remove("active");
+                        }
+                    }
+                    if (li.children[0].children[0].children["progress-bar-circle-3"]) {
+                        if (
+                            li.children[0].children[0].children[
+                                "progress-bar-circle-3"
+                            ].classList.contains("active")
+                        ) {
+                            li.children[0].children[0].children[
+                                "progress-bar-circle-3"
+                            ].classList.remove("active");
+                        }
+                    }
+                } else if (
+                    window.location.href == "https://m3academy.myvtex.com/checkout/#/email" ||
+                    window.location.href == "https://m3academy.myvtex.com/checkout/#/profile" ||
+                    window.location.href == "https://m3academy.myvtex.com/checkout/#/shipping"
+                ) {
+                    if (li.children[0].children[0].children["progress-bar-circle-1"]) {
+                        if (
+                            li.children[0].children[0].children[
+                                "progress-bar-circle-1"
+                            ].classList.contains("active")
+                        ) {
+                            li.children[0].children[0].children[
+                                "progress-bar-circle-1"
+                            ].classList.remove("active");
+                        }
+                    }
+
+                    if (li.children[0].children[0].children["progress-bar-circle-2"]) {
+                        li.children[0].children[0].children["progress-bar-circle-2"].classList.add(
+                            "active"
+                        );
+                    }
+                    if (li.children[0].children[0].children["progress-bar-circle-3"]) {
+                        if (
+                            li.children[0].children[0].children[
+                                "progress-bar-circle-3"
+                            ].classList.contains("active")
+                        ) {
+                            li.children[0].children[0].children[
+                                "progress-bar-circle-3"
+                            ].classList.remove("active");
+                        }
+                    }
+                } else if (
+                    window.location.href == "https://m3academy.myvtex.com/checkout/#/payment"
+                ) {
+                    if (li.children[0].children[0].children["progress-bar-circle-1"]) {
+                        if (
+                            li.children[0].children[0].children[
+                                "progress-bar-circle-1"
+                            ].classList.contains("active")
+                        ) {
+                            li.children[0].children[0].children[
+                                "progress-bar-circle-1"
+                            ].classList.remove("active");
+                        }
+                    }
+                    if (li.children[0].children[0].children["progress-bar-circle-2"]) {
+                        if (
+                            li.children[0].children[0].children[
+                                "progress-bar-circle-2"
+                            ].classList.contains("active")
+                        ) {
+                            li.children[0].children[0].children[
+                                "progress-bar-circle-2"
+                            ].classList.remove("active");
+                        }
+                    }
+                    if (li.children[0].children[0].children["progress-bar-circle-3"]) {
+                        li.children[0].children[0].children["progress-bar-circle-3"].classList.add(
+                            "active"
+                        );
+                    }
+                }
+                window.addEventListener("hashchange", () => {
+                    if (window.location.hash == "#/cart") {
+                        if (li.children[0].children[0].children["progress-bar-circle-1"]) {
+                            li.children[0].children[0].children[
+                                "progress-bar-circle-1"
+                            ].classList.add("active");
+                        }
+                        if (li.children[0].children[0].children["progress-bar-circle-2"]) {
+                            if (
+                                li.children[0].children[0].children[
+                                    "progress-bar-circle-2"
+                                ].classList.contains("active")
+                            ) {
+                                li.children[0].children[0].children[
+                                    "progress-bar-circle-2"
+                                ].classList.remove("active");
+                            }
+                        }
+                        if (li.children[0].children[0].children["progress-bar-circle-3"]) {
+                            if (
+                                li.children[0].children[0].children[
+                                    "progress-bar-circle-3"
+                                ].classList.contains("active")
+                            ) {
+                                li.children[0].children[0].children[
+                                    "progress-bar-circle-3"
+                                ].classList.remove("active");
+                            }
+                        }
+                    } else if (
+                        window.location.hash == "#/email" ||
+                        window.location.hash == "#/profile" ||
+                        window.location.hash == "#/shipping"
+                    ) {
+                        if (li.children[0].children[0].children["progress-bar-circle-1"]) {
+                            if (
+                                li.children[0].children[0].children[
+                                    "progress-bar-circle-1"
+                                ].classList.contains("active")
+                            ) {
+                                li.children[0].children[0].children[
+                                    "progress-bar-circle-1"
+                                ].classList.remove("active");
+                            }
+
+                            if (li.children[0].children[0].children["progress-bar-circle-2"]) {
+                                li.children[0].children[0].children[
+                                    "progress-bar-circle-2"
+                                ].classList.add("active");
+                            }
+                            if (li.children[0].children[0].children["progress-bar-circle-3"]) {
+                                if (
+                                    li.children[0].children[0].children[
+                                        "progress-bar-circle-3"
+                                    ].classList.contains("active")
+                                ) {
+                                    li.children[0].children[0].children[
+                                        "progress-bar-circle-3"
+                                    ].classList.remove("active");
+                                }
+                            }
+                        }
+                    } else if (window.location.hash == "#/payment") {
+                        if (li.children[0].children[0].children["progress-bar-circle-1"]) {
+                            if (
+                                li.children[0].children[0].children[
+                                    "progress-bar-circle-1"
+                                ].classList.contains("active")
+                            ) {
+                                li.children[0].children[0].children[
+                                    "progress-bar-circle-1"
+                                ].classList.remove("active");
+                            }
+                        }
+                        if (li.children[0].children[0].children["progress-bar-circle-2"]) {
+                            if (
+                                li.children[0].children[0].children[
+                                    "progress-bar-circle-2"
+                                ].classList.contains("active")
+                            ) {
+                                li.children[0].children[0].children[
+                                    "progress-bar-circle-2"
+                                ].classList.remove("active");
+                            }
+                        }
+                        if (li.children[0].children[0].children["progress-bar-circle-3"]) {
+                            li.children[0].children[0].children[
+                                "progress-bar-circle-3"
+                            ].classList.add("active");
+                        }
+                    }
+                });
+            });
+        }
     }
 }
diff --git a/checkout/src/arquivos/sass/checkout/_checkout-autenticacao.scss b/checkout/src/arquivos/sass/checkout/_checkout-autenticacao.scss
index 92f0375..1f2716a 100644
--- a/checkout/src/arquivos/sass/checkout/_checkout-autenticacao.scss
+++ b/checkout/src/arquivos/sass/checkout/_checkout-autenticacao.scss
@@ -1,289 +1,289 @@
 .checkout-container {
-	.client-pre-email {
-		border-color: $color-gray4;
-		font-family: $font-family;
-		padding-top: 8px;
+    .client-pre-email {
+        border-color: $color-gray4;
+        font-family: $font-family;
+        padding-top: 8px;
 
-		.link-cart {
-			a {
-				color: $color-black;
-				font-size: 14px;
+        .link-cart {
+            a {
+                color: $black;
+                font-size: 14px;
 
-				&:hover {
-					color: lighen($color-black, 10);
-				}
-			}
-		}
+                &:hover {
+                    color: lighen($black, 10);
+                }
+            }
+        }
 
-		.pre-email {
-			flex-direction: column;
-			display: flex;
-			align-items: center;
-			justify-content: center;
+        .pre-email {
+            flex-direction: column;
+            display: flex;
+            align-items: center;
+            justify-content: center;
 
-			h3 {
-				margin-bottom: 16px;
+            h3 {
+                margin-bottom: 16px;
 
-				span {
-					color: #303030;
-					font-size: 24px;
-				}
+                span {
+                    color: #303030;
+                    font-size: 24px;
+                }
 
-				small {
-					color: $color-gray4;
-				}
-			}
-		}
+                small {
+                    color: $color-gray4;
+                }
+            }
+        }
 
-		.client-email {
-			margin: 0 0 16px;
+        .client-email {
+            margin: 0 0 16px;
 
-			input {
-				box-shadow: none;
-				color: $color-black;
-				font-family: $font-family;
-				padding: 0 16px;
-				border: 2px solid $color-gray3;
-				box-sizing: border-box;
-				border-radius: 5px;
+            input {
+                box-shadow: none;
+                color: $black;
+                font-family: $font-family;
+                padding: 0 16px;
+                border: 2px solid $color-gray3;
+                box-sizing: border-box;
+                border-radius: 5px;
 
-				@media (max-width: 490px) {
-					width: auto;
-				}
-			}
+                @media (max-width: 490px) {
+                    width: auto;
+                }
+            }
 
-			button {
-				background-color: $color-black;
-				border-radius: 5px;
-				border: none;
-				font-family: $font-family;
-				height: 54px;
-				right: 0;
-				top: 0;
+            button {
+                background-color: $black;
+                border-radius: 5px;
+                border: none;
+                font-family: $font-family;
+                height: 54px;
+                right: 0;
+                top: 0;
 
-				@media (max-width: 490px) {
-					height: 48px;
-					margin: 0;
-					position: absolute;
-				}
-			}
+                @media (max-width: 490px) {
+                    height: 48px;
+                    margin: 0;
+                    position: absolute;
+                }
+            }
 
-			span.help.error {
-				color: red;
-			}
-		}
+            span.help.error {
+                color: red;
+            }
+        }
 
-		.emailInfo {
-			padding: 16px;
-			background-color: $color-white;
-			border: 1px solid $color-gray4;
-			border-radius: 0;
+        .emailInfo {
+            padding: 16px;
+            background-color: $white;
+            border: 1px solid $color-gray4;
+            border-radius: 0;
 
-			h3 {
-				color: #303030;
-				margin: 0 0 8px 0;
-			}
+            h3 {
+                color: #303030;
+                margin: 0 0 8px 0;
+            }
 
-			ul {
-				margin: 0;
+            ul {
+                margin: 0;
 
-				li {
-					span {
-						color: $color-black;
-					}
+                li {
+                    span {
+                        color: $black;
+                    }
 
-					i::before {
-						color: $color-black;
-						font-size: 1rem;
-						opacity: 1;
-					}
-				}
-			}
+                    i::before {
+                        color: $black;
+                        font-size: 1rem;
+                        opacity: 1;
+                    }
+                }
+            }
 
-			i::before {
-				color: $color-black;
-				font-size: 6rem;
-				opacity: 0.5;
-			}
-		}
-	}
+            i::before {
+                color: $black;
+                font-size: 6rem;
+                opacity: 0.5;
+            }
+        }
+    }
 
-	.shipping-data,
-	.payment-data,
-	.client-profile-data {
-		.accordion-group {
-			border-radius: 0;
-			border: 1px solid $color-gray4;
-			font-family: $font-family;
-			padding: 16px;
+    .shipping-data,
+    .payment-data,
+    .client-profile-data {
+        .accordion-group {
+            border-radius: 0;
+            border: 1px solid $color-gray4;
+            font-family: $font-family;
+            padding: 16px;
 
-			.accordion-heading {
-				span {
-					color: #303030;
-					margin-bottom: 8px;
-					padding: 0;
+            .accordion-heading {
+                span {
+                    color: #303030;
+                    margin-bottom: 8px;
+                    padding: 0;
 
-					i::before {
-						fill: #303030;
-					}
-				}
+                    i::before {
+                        fill: #303030;
+                    }
+                }
 
-				a {
-					align-items: center;
-					background-color: #303030;
-					border-radius: 8px;
-					border: none;
-					color: $color-white;
-					display: flex;
-					justify-content: center;
-					padding: 6px 5px 6px 8px;
-				}
-			}
+                a {
+                    align-items: center;
+                    background-color: #303030;
+                    border-radius: 8px;
+                    border: none;
+                    color: $white;
+                    display: flex;
+                    justify-content: center;
+                    padding: 6px 5px 6px 8px;
+                }
+            }
 
-			.accordion-inner {
-				padding: 0;
+            .accordion-inner {
+                padding: 0;
 
-				/* General configurations */
+                /* General configurations */
 
-				.client-notice {
-					color: $color-black;
-				}
+                .client-notice {
+                    color: $black;
+                }
 
-				p {
-					label {
-						color: $color-black;
-						font-weight: 500;
-					}
+                p {
+                    label {
+                        color: $black;
+                        font-weight: 500;
+                    }
 
-					select,
-					input {
-						border-radius: 0;
-						border: 1px solid $color-gray4;
-						box-shadow: none;
-					}
+                    select,
+                    input {
+                        border-radius: 0;
+                        border: 1px solid $color-gray4;
+                        box-shadow: none;
+                    }
 
-					.help.error {
-						color: red;
-					}
-				}
+                    .help.error {
+                        color: red;
+                    }
+                }
 
-				.box-client-info-pj {
-					.link a#is-corporate-client,
-					.link a#not-corporate-client {
-						color: $color-black;
-						font-weight: 500;
-						text-decoration: underline;
-					}
-				}
+                .box-client-info-pj {
+                    .link a#is-corporate-client,
+                    .link a#not-corporate-client {
+                        color: $black;
+                        font-weight: 500;
+                        text-decoration: underline;
+                    }
+                }
 
-				.state-inscription-box span {
-					font-weight: 500;
-				}
+                .state-inscription-box span {
+                    font-weight: 500;
+                }
 
-				button.submit {
-					border: none;
-					border-radius: 5px;
-					background: $color-black;
-					margin-top: 8px;
-					outline: none;
-					transition: all 0.2s linear;
+                button.submit {
+                    border: none;
+                    border-radius: 5px;
+                    background: $black;
+                    margin-top: 8px;
+                    outline: none;
+                    transition: all 0.2s linear;
 
-					&:hover {
-						background: lighten($color-black, 5);
-					}
+                    &:hover {
+                        background: lighten($black, 5);
+                    }
 
-					&:active {
-						background: darken($color-black, 5);
-					}
-				}
+                    &:active {
+                        background: darken($black, 5);
+                    }
+                }
 
-				/* Shipping configurations */
+                /* Shipping configurations */
 
-				.ship-postalCode small a {
-					color: #303030;
-					font-weight: 500;
-					text-decoration: underline;
-				}
+                .ship-postalCode small a {
+                    color: #303030;
+                    font-weight: 500;
+                    text-decoration: underline;
+                }
 
-				.vtex-omnishipping-1-x-deliveryGroup {
-					p {
-						color: #303030;
-						font-size: 14px;
-						font-weight: 500;
-					}
+                .vtex-omnishipping-1-x-deliveryGroup {
+                    p {
+                        color: #303030;
+                        font-size: 14px;
+                        font-weight: 500;
+                    }
 
-					.shp-lean {
-						border: 1px solid $color-gray4;
-						border-radius: 0;
+                    .shp-lean {
+                        border: 1px solid $color-gray4;
+                        border-radius: 0;
 
-						label {
-							background-color: $color-white;
-							box-shadow: none;
-							color: #303030;
-							padding: 8px 12px;
+                        label {
+                            background-color: $white;
+                            box-shadow: none;
+                            color: #303030;
+                            padding: 8px 12px;
 
-							svg path {
-								fill: #d8c8ac;
-							}
-						}
-					}
-				}
+                            svg path {
+                                fill: #d8c8ac;
+                            }
+                        }
+                    }
+                }
 
-				.delivery-address-title {
-					color: #303030;
-					font-size: 14px;
-					font-weight: 500;
-				}
+                .delivery-address-title {
+                    color: #303030;
+                    font-size: 14px;
+                    font-weight: 500;
+                }
 
-				.shp-summary-group-info {
-					border-color: $color-gray4;
-				}
+                .shp-summary-group-info {
+                    border-color: $color-gray4;
+                }
 
-				.address-summary {
-					background: none;
-					border-color: $color-gray4;
-					border-radius: 0;
-					color: #303030;
-					padding: 12px;
+                .address-summary {
+                    background: none;
+                    border-color: $color-gray4;
+                    border-radius: 0;
+                    color: #303030;
+                    padding: 12px;
 
-					@include mq(md, max) {
-						background-position: 8px 9px;
-					}
+                    @include mq(md, max) {
+                        background-position: 8px 9px;
+                    }
 
-					a {
-						color: #303030;
-						font-weight: 500;
-						text-decoration: underline;
-					}
-				}
+                    a {
+                        color: #303030;
+                        font-weight: 500;
+                        text-decoration: underline;
+                    }
+                }
 
-				.shp-summary-group-price,
-				.shp-summary-package {
-					color: $color-gray4;
-				}
+                .shp-summary-group-price,
+                .shp-summary-package {
+                    color: $color-gray4;
+                }
 
-				.shp-summary-group-price {
-					padding-right: 16px;
-				}
+                .shp-summary-group-price {
+                    padding-right: 16px;
+                }
 
-				.shp-summary-package {
-					padding-left: 16px;
-				}
+                .shp-summary-package {
+                    padding-left: 16px;
+                }
 
-				.vtex-omnishipping-1-x-summaryChange {
-					border-color: #303030;
-					color: #303030;
-				}
+                .vtex-omnishipping-1-x-summaryChange {
+                    border-color: #303030;
+                    color: #303030;
+                }
 
-				.vtex-omnishipping-1-x-deliveryChannelsToggle {
-					background-color: #d8c8ac;
-					border: 1px solid #d8c8ac;
-				}
+                .vtex-omnishipping-1-x-deliveryChannelsToggle {
+                    background-color: #d8c8ac;
+                    border: 1px solid #d8c8ac;
+                }
 
-				.vtex-omnishipping-1-x-deliveryOptionActive {
-					text-shadow: 1.3px 1px lighten($color-black, 50);
-				}
-			}
-		}
-	}
+                .vtex-omnishipping-1-x-deliveryOptionActive {
+                    text-shadow: 1.3px 1px lighten($black, 50);
+                }
+            }
+        }
+    }
 }
diff --git a/checkout/src/arquivos/sass/checkout/_checkout-carrinho.scss b/checkout/src/arquivos/sass/checkout/_checkout-carrinho.scss
index 195f487..b05b5c4 100644
--- a/checkout/src/arquivos/sass/checkout/_checkout-carrinho.scss
+++ b/checkout/src/arquivos/sass/checkout/_checkout-carrinho.scss
@@ -32,7 +32,7 @@
         font-family: $font-family;
         width: 100%;
         h2 {
-            background: $color-white;
+            background: $white;
             border: none;
             color: #303030;
             font-size: 14px;
@@ -70,7 +70,7 @@
 
         .summary-template-holder {
             border-top: none;
-            background: $color-white;
+            background: $white;
         }
 
         #go-to-cart-button a {
@@ -85,24 +85,24 @@
         }
 
         #payment-data-submit {
-            background: $color-black;
+            background: $black;
             border: none;
             border-radius: 0;
-            color: $color-white;
+            color: $white;
             outline: none;
             transition: all 0.2s linear;
             &:hover {
-                background: lighten($color-black, 5);
+                background: lighten($black, 5);
             }
 
             &:active {
-                background: darken($color-black, 5);
+                background: darken($black, 5);
             }
         }
     }
 
     .lookatme {
-        background-color: $color-white;
+        background-color: $white;
     }
 
     .cart-items {
@@ -111,7 +111,7 @@
         }
 
         th {
-            color: $color-black;
+            color: $black;
             padding: 0 0 16px;
             font-style: normal;
             font-weight: bold;
@@ -233,7 +233,7 @@
             }
 
             input {
-                background-color: $color-white;
+                background-color: $white;
                 border: 1px solid $color-gray3;
                 border-radius: 0;
                 border-width: 0 1px;
@@ -253,7 +253,7 @@
             .icon-plus-sign,
             .icon-minus-sign {
                 &::before {
-                    color: $color-black;
+                    color: $black;
                     display: block;
                     font-weight: 500;
                     padding: 1px 12px;
@@ -300,7 +300,7 @@
                 font-weight: normal;
                 font-size: 14px;
                 line-height: 16px;
-                color: $color-black;
+                color: $black;
             }
         }
 
@@ -326,7 +326,7 @@
 
         .item-unavailable-message {
             background-color: #d8c8ac;
-            color: $color-white;
+            color: $white;
 
             .icon-warning-sign {
                 color: #bb4f4f;
@@ -405,10 +405,10 @@
                 }
 
                 .srp-pickup-my-location__button {
-                    background-color: $color-black;
+                    background-color: $black;
                     border: none;
                     border-radius: 5px;
-                    color: $color-white;
+                    color: $white;
                     outline: none;
                     width: 100%;
 
@@ -419,11 +419,11 @@
                     letter-spacing: 0.05em;
 
                     &:hover {
-                        background-color: lighten($color-black, 5);
+                        background-color: lighten($black, 5);
                     }
 
                     &:active {
-                        background-color: darken($color-black, 5);
+                        background-color: darken($black, 5);
                     }
                 }
             }
@@ -432,7 +432,7 @@
                 margin: 0 0 34px;
 
                 &__wrapper {
-                    background-color: $color-white;
+                    background-color: $white;
                     border-radius: 100px;
                     width: 100%;
                     font-family: $font-family;
@@ -469,7 +469,7 @@
                         font-weight: normal;
                         font-size: 12px;
                         line-height: 14px;
-                        color: $color-black;
+                        color: $black;
                         margin-bottom: 12px;
                     }
 
@@ -485,10 +485,10 @@
                     }
 
                     & ~ button {
-                        background-color: $color-black;
+                        background-color: $black;
                         border: none;
                         border-radius: 5px;
-                        color: $color-white;
+                        color: $white;
                         font-size: 12px;
                         height: 36px;
                         letter-spacing: 1px;
@@ -501,11 +501,11 @@
                         text-transform: uppercase;
 
                         &:hover {
-                            background-color: lighten($color-black, 5);
+                            background-color: lighten($black, 5);
                         }
 
                         &:active {
-                            background-color: darken($color-black, 5);
+                            background-color: darken($black, 5);
                         }
                     }
 
@@ -673,10 +673,10 @@
                     }
 
                     button {
-                        background: $color-black;
+                        background: $black;
                         border: none;
                         border-radius: 5px;
-                        color: $color-white;
+                        color: $white;
                         font-size: 12px;
                         height: 36px;
                         letter-spacing: 1px;
@@ -691,11 +691,11 @@
                         }
 
                         &:hover {
-                            background-color: lighten($color-black, 5);
+                            background-color: lighten($black, 5);
                         }
 
                         &:active {
-                            background-color: darken($color-black, 5);
+                            background-color: darken($black, 5);
                         }
                     }
                 }
@@ -716,7 +716,7 @@
                             font-weight: normal;
                             font-size: 14px;
                             line-height: 16px;
-                            color: $color-black;
+                            color: $black;
                             padding: 12px 0;
                         }
 
@@ -737,7 +737,7 @@
                         font-weight: normal;
                         font-size: 18px;
                         line-height: 21px;
-                        color: $color-black;
+                        color: $black;
                     }
                 }
             }
@@ -800,7 +800,7 @@
                     font-weight: 500;
                     font-size: 13px;
                     letter-spacing: 0.05em;
-                    color: $color-white;
+                    color: $white;
                     text-transform: uppercase;
                     vertical-align: middle;
                     line-height: 19px;
diff --git a/checkout/src/arquivos/sass/checkout/_checkout-vazio.scss b/checkout/src/arquivos/sass/checkout/_checkout-vazio.scss
index 08f74e9..8f42ea5 100644
--- a/checkout/src/arquivos/sass/checkout/_checkout-vazio.scss
+++ b/checkout/src/arquivos/sass/checkout/_checkout-vazio.scss
@@ -1,38 +1,38 @@
 .empty-cart {
-	font-family: $font-family;
-	&-content {
-		color: $color-black;
-		text-align: center;
+    font-family: $font-family;
+    &-content {
+        color: $black;
+        text-align: center;
 
-		@include mq(md, max) {
-			padding: 0 16px;
-		}
-	}
+        @include mq(md, max) {
+            padding: 0 16px;
+        }
+    }
 
-	&-title {
-		font-size: 20px;
-	}
+    &-title {
+        font-size: 20px;
+    }
 
-	&-links {
-		.link-choose-products {
-			background: $color-black;
-			border: none;
-			border-radius: 5px;
-			transition: ease-in 0.22s all;
-			outline: none;
-			font-family: $font-family;
-			font-style: normal;
-			font-weight: 500;
-			font-size: 14px;
-			line-height: 16px;
-			text-align: center;
-			letter-spacing: 0.05em;
-			color: $color-white;
-			text-transform: uppercase;
+    &-links {
+        .link-choose-products {
+            background: $black;
+            border: none;
+            border-radius: 5px;
+            transition: ease-in 0.22s all;
+            outline: none;
+            font-family: $font-family;
+            font-style: normal;
+            font-weight: 500;
+            font-size: 14px;
+            line-height: 16px;
+            text-align: center;
+            letter-spacing: 0.05em;
+            color: $white;
+            text-transform: uppercase;
 
-			&:hover {
-				background: lighten($color-black, 5);
-			}
-		}
-	}
+            &:hover {
+                background: lighten($black, 5);
+            }
+        }
+    }
 }
diff --git a/checkout/src/arquivos/sass/checkout/_checkout.scss b/checkout/src/arquivos/sass/checkout/_checkout.scss
index 5e806dd..be76ff2 100644
--- a/checkout/src/arquivos/sass/checkout/_checkout.scss
+++ b/checkout/src/arquivos/sass/checkout/_checkout.scss
@@ -54,16 +54,16 @@ body {
 }
 
 .btn-success {
-    background: $color-black;
+    background: $black;
     text-shadow: none;
 
     &:hover {
-        background: lighten($color-black, 15%);
+        background: lighten($black, 15%);
     }
 }
 
 .emailInfo h3 {
-    color: $color-black !important;
+    color: $black !important;
 }
 
 #cart-title,
diff --git a/checkout/src/arquivos/sass/partials/_header.scss b/checkout/src/arquivos/sass/partials/_header.scss
index 0fc5aef..d7de79c 100644
--- a/checkout/src/arquivos/sass/partials/_header.scss
+++ b/checkout/src/arquivos/sass/partials/_header.scss
@@ -1,25 +1,85 @@
-/* _header.scss */
 .headerCheckout {
     .container {
         width: auto !important;
     }
     &__wrapper {
         display: flex;
+        position: relative;
         align-items: center;
         justify-content: space-between;
         padding: 16px;
-        border-bottom: 1px solid #000;
+        border-bottom: 1px solid $black;
+        @media (min-width: 1025px) {
+            padding: 33.5px 130px;
+        }
     }
-    @media (max-width: 1024px) {
-        .progress-bar {
-            display: none;
+    .progress-bar {
+        position: absolute;
+        right: 31.5%;
+        top: 33%;
+
+        .containerLi {
+            display: flex;
+            position: relative;
+            align-items: center;
+        }
+        ul {
+            display: flex;
+            margin: 0;
+            gap: 100px;
+            list-style: none;
+        }
+
+        p {
+            margin-bottom: 0;
+        }
+
+        &-text {
+            font-family: "Tenor Sans";
+            font-weight: 400;
+            font-size: 12px;
+            line-height: 14px;
+        }
+
+        &-line-1,
+        &-line-2 {
+            position: absolute;
+            width: 181px;
+            top: 199%;
+            left: 50%;
+            border: 1px solid $black;
+        }
+
+        &-line-2 {
+            left: -240%;
+        }
+
+        &-circle-1,
+        &-circle-2,
+        &-circle-3 {
+            display: flex;
+            position: absolute;
+            height: 10px;
+            width: 10px;
+            align-self: center;
+            background-color: $white;
+            border: 1px solid $black;
+            border-radius: 50%;
+            margin-left: 40%;
+            margin-top: 9px;
+            padding: 0;
+            z-index: map-get($z-index, level2);
+        }
+
+        .active {
+            background: $black;
         }
     }
 
     &__logo {
-        img {
-            height: 52px;
-            width: auto;
+        width: 15.66%;
+        @media (min-width: 1025px) {
+            width: 15.28%;
         }
     }
 
@@ -27,15 +87,15 @@
         display: flex;
 
         span {
-            align-items: center;
             display: flex;
             width: 100%;
+            align-items: center;
             text-transform: uppercase;
             font-family: $font-family;
             font-style: normal;
             font-weight: normal;
             font-size: 12px;
-            line-height: 14px;
+            line-height: 16px;
             color: $color-gray;
             margin-left: 8px;
         }
diff --git a/checkout/src/arquivos/sass/utils/_variaveis.scss b/checkout/src/arquivos/sass/utils/_variaveis.scss
index f000abe..9d51f4c 100644
--- a/checkout/src/arquivos/sass/utils/_variaveis.scss
+++ b/checkout/src/arquivos/sass/utils/_variaveis.scss
@@ -2,12 +2,12 @@
 @import url("https://fonts.googleapis.com/css2?family=Tenor+Sans&display=swap");
 @import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700;800&display=swap");
 $font-family: "Open Sans", sans-serif;
-$font-family-secundary:"Tenor Sans", sans-serif;
+$font-family-secundary: "Tenor Sans", sans-serif;
 
 /* Colors */
-$color-black: #292929;
+$black: #000;
 
-$color-white: #fff;
+$white: #fff;
 
 $color-gray: #6c6c6c;
 $color-gray2: #7d7d7d;
@@ -21,18 +21,18 @@ $color-green: #4caf50;
 
 /* Grid breakpoints */
 $grid-breakpoints: (
-	xs: 0,
-	cstm: 400,
-	sm: 576px,
-	md: 768px,
-	lg: 992px,
-	xl: 1200px
+    xs: 0,
+    cstm: 400,
+    sm: 576px,
+    md: 768px,
+    lg: 992px,
+    xl: 1200px,
 ) !default;
 
 $z-index: (
-	level1: 5,
-	level2: 10,
-	level3: 15,
-	level4: 20,
-	level5: 25
+    level1: 5,
+    level2: 10,
+    level3: 15,
+    level4: 20,
+    level5: 25,
 ) !default;