.container {
  position: relative;
}

.carrinho-teste1 {
  width: 35rem;
  min-height: 15rem;
  position: absolute;
  top: 6.3rem;
  right: 2rem;
  background: #f0f0f0;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s linear 700ms, opacity 700ms;
}

.carr2:hover + .carrinho-teste1 {
  visibility: visible;
  opacity: 1;
  transition: visibility 0s linear 0s, opacity 700ms;
}

.carrinho-teste1:hover {
  visibility: visible;
  opacity: 1;
  transition: visibility 0s linear 0s, opacity 700ms;
}

.container {
  background-color: #fff;

  grid-template-rows: 15vh 85vh;
}
nav {
  background-color: #f0f0f0;
}

.header {
  height: 100vh;
}

.aside {
  display: flex;
  width: 100%;
  gap: 3rem;
  align-items: center;
  margin-top: 8rem;
  margin-bottom: 8rem;
}

footer {
  margin-top: 2rem;
}

.link-superior {
  background-color: #f15b41;
  color: #fff;
  font-weight: 400;
  font-size: 1.5rem;
  padding: 18px;
  text-align: right;
  box-shadow: inset 0px -5px 2px 0px rgba(0, 0, 0, 0.13);
}
.link-superior a:link,
.link-superior a:visited {
  color: #fff;
  text-decoration: none;
  cursor: pointer;
}

.link-superior a:hover,
.link-superior a:active {
  color: #481b13;
  text-decoration: none;
  cursor: pointer;
}

.link--sup--2 {
  display: none;
}
.link--sup--3 {
  display: none;
}
.link--sup--4 {
  display: none;
}

/* Add a black background color to the top navigation */
.topnav {
  background-color: #f0f0f0;
  overflow: hidden;
  padding: 2.03rem;
  box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.13);
}

/* Style the links inside the navigation bar */
.topnav a {
  float: right;
  display: block;
  color: #495057;
  text-align: center;
  padding: 16px 16px;
  text-decoration: none;
  font-size: 1.4rem;
}

/* Add an active class to highlight the current page */
.active {
  background-color: #d8d8d8;
  color: #fff;
  border-radius: 12px;
  cursor: pointer;
}

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
  display: none;
}

/* Dropdown container - needed to position the dropdown content */
.dropdown {
  float: right;
  overflow: hidden;
}

/* Style the dropdown button to fit inside the topnav */
.dropdown .dropbtn {
  font-size: 1.4rem;
  border: none;
  outline: none;
  color: #495057;
  padding: 14px 16px;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

/* Style the dropdown content (hidden by default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  z-index: 1;
}

/* Style the links inside the dropdown */
.dropdown-content a {
  float: none;
  color: rgb(46, 46, 46);
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: right;
}

.topnav a:hover,
.dropdown:hover .dropbtn {
  background-color: #555;
  color: white;
  border-radius: 12px;
}

/* Add a dark background on topnav links and the dropdown button on hover */
/*.topnav a:hover,*/
.dropdown:hover .dropbtn {
  background-color: #555;
  border-radius: 12px;
  color: white;
}

/* Add a grey background to dropdown links on hover */
.dropdown-content a:hover {
  background-color: #777;
  color: #f0f0f0;
}

/* Show the dropdown menu when the user moves the mouse over the dropdown button */
.dropdown:hover .dropdown-content {
  display: block;
}

.dropdown-content .vermelho {
  background-color: rgb(252, 190, 3);
  border-radius: 12px;
  color: red; !important
}

h1 {
  font-size: 6rem;
  font-weight: 500;
  margin-top: 3rem;
  letter-spacing: -1px;
  line-height: 0.8;
}

.texto-principal {
  text-align: center;
}
.texto-principal p {
  margin-top: 1.5rem;
}
.btn-compre-aqui {
  background-color: #f15b41;
  padding: 16px 32px;
  font-size: 3rem;
  color: #fff;
  font-weight: 500;
  border-radius: 12px;
  cursor: pointer;
  display: inline-block;
  margin-top: 6rem;
  text-decoration: none;
}

.btn-compre-aqui a:link,
.btn-compre-aqui a:visited {
  color: #fff;
}
.btn-compre-aqui a:hover,
.btn-compre-aqui a:active {
  color: #fff;

  cursor: pointer;
}

.propaganda {
  text-align: center;
}

.txt-aside {
  flex-basis: 100%;
  justify-content: center;
}

.h2 {
  font-size: 3.8rem;
  margin-bottom: 5rem;
  text-align: center;
}
.frase-efeito {
  font-size: 1.8rem;
  text-align: center;
}
.btn-menor {
  font-size: 1.8rem;
}
.video {
  width: 50%;
}

.box-produtos {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  flex: 1;
  gap: 2rem;
  margin: 0 auto;
  width: auto;
}

.box-basis {
  flex-basis: 0;
  flex-grow: 1;
}

/**.box-produtos {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem;
  margin: 0 auto;
  width: auto;
}**/

.tamanho-foto-produto {
  max-height: 18rem;
  max-width: 18rem;
}

.produto {
  max-width: 22rem;
  min-width: 18rem;
  padding-bottom: 2rem;
  margin-bottom: 2rem;
  box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.15);
  display: flex;

  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
}

.img-produto {
  margin-bottom: 2rem;
  padding-top: 2rem;
}

.modelo-produto {
  font-size: 1.4rem;
  margin-bottom: 1.5rem;
}

.corr {
  height: 1rem;
}

.nome-produto {
  font-size: 1.4rem;
  font-weight: 500;
  margin-bottom: 1.5rem;
  text-align: center;
  line-height: 2rem;
  padding: 0 1rem;
}

.nome-produto a:link,
.nome-produto a:visited {
  color: #333;
  text-decoration: none;
}

.nome-produto a:hover,
.nome-produto a:active {
  color: #f15b41;
}

.valor-produto {
  font-size: 1.4rem;
  margin-bottom: 2rem;

  margin-top: auto;
}

.compre-aqui {
  display: inline-block;
  width: 100%;
}
h3 {
  font-size: 3.6rem;
  text-align: center;
  margin: 3rem 0;
}

.compre-online {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 2rem;
  max-width: 100%;
}

.img--1,
.img--2,
.img--3 {
  max-width: 100%;
  margin-left: 0;
}

.link-produto-capa {
  font-size: 1.5rem;
  font-weight: 700;
}

.link-produto-capa a:link,
.link-produto-capa a:visited {
  color: #333;
  text-decoration: none;
}

.link-produto-capa a:hover,
.link-produto-capa a:active {
  color: #f15b41;
}

.footer {
  background-color: #333;
  width: 100%;
  padding: 3rem 3rem;
}

.amigos {
  font-size: 1.3rem;
  margin-bottom: 3rem;
  color: #fff;
  letter-spacing: 4px;
}

.redes {
  display: flex;
  gap: 2rem;
}

.rede-social img {
  width: 4.6rem;
  margin-bottom: 3rem;
}

.menu-footer {
  font-size: 1.2rem;
  color: #fff;
  margin-bottom: 1.6rem;
}
.menu-footer a:link,
.menu-footer a:visited {
  color: #fff;
  text-decoration: none;
}

.menu-footer a:hover,
.menu-footer a:active {
  color: #f15b41;
}

.copy-footer {
  font-size: 1rem;
  color: #fff;
  text-align: center;
  margin-top: 3rem;
}

.telefone{
display: flex;
gap: 5px;
font-size: 1.4rem;
align-items: center;
}

.header-produtos {
  background-color: #f0f0f0;
  padding: 4rem;
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.banner-seminovos{
  max-width: 100%;

  margin-bottom: 3rem;
}

.h1-produtos {
  font-size: 4rem;
  margin-bottom: 2rem;
}
.produto-descricao {
  font-size: 1.6rem;
  width: 50%;
  line-height: 1.3;
}

.link-categoria {
  font-size: 1.4rem;
  padding-left: 4rem;
  margin-bottom: 4rem;
}

.link-categoria a:link,
.link-categoria a:visited {
  text-decoration: none;
  color: #333;
}

.link-categoria a:hover,
.link-categoria a:active {
  text-decoration: underline;
  color: #222;
}

.menuList {
  font-size: 1.8rem;
  font-weight: 500;
  padding-bottom: 1rem;
  list-style: none;
}

.menu-categorias {
  padding: 8rem 0 0 3rem;
  max-width: 25rem;
  min-width: 25rem;
}

.conjunto-produtos {
  display: flex;

  justify-content: left;
  margin-bottom: 2rem;
}

.paginacao {
  margin-bottom: 3rem;
  font-size: 1.8rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding-left: 4rem;
}

.btn {
  border: 1px solid #f15b41;
  height: 4.8rem;
  width: 4.8rem;
  border-radius: 50%;
  background: none;
  cursor: pointer;
}

.btn:hover {
  background-color: #f15b41;
}

.btn:hover .btn-icon {
  stroke: #fff;
}

.btn-icon {
  height: 2.4rem;
  width: 2.4rempx;
  stroke: #555;
}

.page-link:link,
.page-link:visited {
  font-size: 1.8rem;
  color: #343a40;
  text-decoration: none;
  height: 3.6rem;
  width: 3.6rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.page-link:hover,
.page-link:active,
.page-link.page-link--current {
  background-color: #f15b41;
  color: #fff;
}

.dots {
  color: #868e96;
}

.link-categoria-detalhe {
  margin-top: 3rem;
  margin-bottom: 2rem;
}

.img-principal img {
  width: 100%;
  margin-top: 4rem;
}
.img-principal-detalhe img {
  max-height: 50rem;
  max-width: 50rem;
  margin: 0 auto;
  margin-top: 4rem;
  margin-right: 2rem;
  margin-bottom: 1rem;
}

.thumb img {
  border: solid #c7c7c7 1px;
  width: 5.9rem;
  height: 5.9rem;
}

.thumbnails {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  max-width: 50rem;
  margin: 0 auto;
}

.principal-detalhe {
  display: grid;
  grid-template-columns: 53rem 1fr;
}

.titulo-produto {
  font-size: 3.2rem;
  font-weight: 600;
  margin-bottom: 3rem;
  line-height: 1.2;
}
.titulo-produto2 {
  display: none;
}

.rating {
  display: flex;
  align-items: center;
  margin-bottom: 3rem;
}
.txt-rating {
  font-size: 1.3rem;
  color: #333;
}

.caracteristicas {
  font-size: 1.8rem;
  margin-bottom: 2rem;
}
.detalhe-preco {
  font-size: 4.2rem;
  font-weight: 700;
  color: #666;
  margin: 3rem 0 3rem 0;
}

.botao-compra {
  background-color: #f15b41; /* Green */
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  cursor: pointer;
  border-radius: 12px;
}

.produto-esgotado {
  font-size: 1.6rem;
  color: #f15b41;
  font-weight: 700;
}
.hr-produto {
  margin-top: 3rem;
  margin-bottom: 1rem;
}

.texto-descricao {
  font-size: 1.6rem;
  line-height: 1.3;
  margin-bottom: 3rem;
}

.nome-produto-adicionar {
  font-size: 1.2rem;
}

.img-prod-compativel {
  padding-right: 8px;
}

.preco-acessorio {
  border: solid 1px #c7c7c7;
  padding: 8px;
  margin-bottom: 1rem;
}

.preco-acc {
  font-size: 1.4rem;
  color: #555;
  font-weight: 700;
  text-align: center;
  margin-bottom: 5px;
}

.adicionar-acessorio {
  display: flex;
  align-items: center;
  gap: 3px;
  justify-items: center;
  justify-content: center;
}

.fontePr {
  font-size: 1.1rem;
  color: #333;
}

.nome-produto-adic {
  font-size: 1.35rem;
}

.nome-produto-adic:link,
.nome-produto-adic:visited {
  color: #333;
  text-decoration: none;
}

.nome-produto-adic:hover,
.nome-produto-adic:active {
  color: #f15b41;
  text-decoration: underline;
}

.avaliacao-cinza {
  background-color: #e9e9e9;
  padding: 3rem;
  width: 100%;
  margin-bottom: 2rem;
}
.avaliacao-cinza2 {
  padding: 0;
  margin: 0;
}

.h3 {
  font-size: 2.4rem;
  font-weight: 600;
}

.avaliacoes {
  background-color: #fff;
  padding: 2rem;
  width: 100%;
  margin-top: 1.5rem;
}

.botao-avaliar {
  background-color: #f15b41; /* Green */
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.6rem;
  cursor: pointer;
  border-radius: 12px;
}

.botao-avaliar2 {
  background-color: #f15b41; /* Green */
  border: none;
  color: white;
  padding: 12px 24px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.4rem;
  cursor: pointer;
  border-radius: 12px;
  margin: 1.5rem 0 1.5rem 0;
}

.botao-avaliar2 {
  display: none;
}

.valor-avaliacao-media {
  font-size: 5rem;
  font-weight: 600;
}

.quant-avaliacoes {
  font-size: 1.8rem;
  padding-left: 1rem;
}

.titulo-avaliacao {
  font-size: 2.4rem;
  font-weight: 500;
  padding: 6rem 0 1rem 0;
}

.txt-opiniao {
  font-size: 1.5rem;
  line-height: 1.2;
  padding: 1rem 0 2rem 0;
}

.autor-review {
  font-size: 1.5rem;
}

.data-review {
  font-size: 1.2rem;
  margin-bottom: 2rem;
}

#perguntas {
  margin-top: 3rem;
}

.perguntas {
  background-color: #fff;
  padding: 0 2rem 2rem 2rem;
  margin-bottom: 3rem;
}
.txt-pergunta {
  font-size: 1.6rem;
  font-weight: 600;
  line-height: 1.2;
  padding: 1rem 0 1rem 0;
}
.quem-perguntou {
  font-size: 1.3rem;
  font-style: italic;
  padding-bottom: 3rem;
}

.nossa-resposta {
  font-size: 1.6rem;
  padding-bottom: 0 0 2rem 2rem;
  line-height: 1.2;
}
.botao-perguntas {
  background-color: #fff;
  padding: 16px 0;
  font-size: 2rem;
  color: #333;
  font-weight: 500;
  border-radius: 12px;
  cursor: pointer;
  width: 100%;
  margin: 6rem 0 6rem 0;
  border: 2px solid #f15b41;
}

.logo-resposta {
  margin-bottom: 2rem;
}

.faca-uma-pergunta {
  display: flex;
  gap: 2rem;
  align-items: center;
}
.carrinho-pequeno {
  font-size: 2.4rem;
  transform: translate(0px, 6px);
}
.carr {
  padding-left: 3rem;
}

.titulo-carrinho {
  font-size: 3.6rem;
  color: #333;
  font-weight: 600;
  margin-top: 3rem;
}

.titulos-carrinho {
  background-color: #dfdfdf;
  padding: 0.8rem 0 0.8rem 0;
  display: grid;
  grid-template-columns: 7fr 1fr 1fr 1fr 1fr;
  justify-items: center;
  font-size: 1.3rem;
  color: #333;
  margin-top: 2rem;
  margin-bottom: 1.5rem;
}

.itens-carrinho {
  display: grid;
  grid-template-columns: 55px 7.6fr 1.2fr 1fr 1.5fr 0.4fr;
  margin-bottom: 1rem;
  border: solid 1px #c7c7c7;
  gap: 1rem;
  align-items: center;
  justify-items: start;
  padding: 1rem;
  font-size: 1.5rem;
}

.carrinho--2 {
  justify-self: center;
}

.carrinho--3 {
  justify-self: center;
}

.carrinho--4 {
  justify-self: center;
}

.carrinho--5 {
  justify-self: center;
}

.subtotal-carrinho {
  font-size: 2.2rem;
  font-weight: 600;
  color: #333;
  width: 100%;
  text-align: right;
  margin: 2rem 0 2rem 0;
}

.cesta-vazia {
  font-size: 2.4rem;
  color: rgb(241, 92, 65);
  font-weight: 600;
  text-align: center;
  margin: 4rem 0 4rem 0;
}

.bnt-finalizar-pedido {
  display: flex;
  width: 100%;
  justify-content: flex-end;
  margin-bottom: 15rem;
}
.icone-ajuda {
  font-size: 4rem;
  color: #fff;
  border: solid 1px #f15b41;
  padding: 1rem;
  border-radius: 100%;
  width: 6rem;
  height: 6rem;
  background-color: #f15b41;
}

.flex-ajuda {
  display: flex;
}

.texto-pequeno {
  font-size: 1.3rem;
  color: #333;
  text-decoration: underline;
  margin-top: 1rem;
  font-size: 1.3rem;
  text-align: left;
  margin-bottom: 0;
  margin-left: 0;
  padding: 0;
}

.container-80 {
  padding: 2rem 6rem 2rem 6rem;
  width: 80%;
  margin: 0 auto;
  margin-top: 6rem;
}

/***************************************************************/
/*********************MEDIA QUERIES*****************************/
@media screen and (max-width: 1039px) {
  .principal-detalhe {
    display: block;
  }
  .imagens {
    margin: 0 auto;
    width: 100%;
  }
  .img-principal-detalhe {
    max-width: 50rem;
    margin: 0 auto;
  }

  .img-logo {
    transform: rotate(0deg);
    position: absolute;
    margin: 6.7rem 2rem 0 2rem;
  }
}

@media screen and (max-width: 1016px) {
  .h2 {
    font-size: 3rem;
    margin-bottom: 4rem;
  }
  .frase-efeito {
    font-size: 1.6rem;
  }
  .btn-menor {
    font-size: 1.6rem;
  }
}

@media screen and (max-width: 918px) {
  .link-superior {
    font-size: 1.3rem;
  }

  h1 {
    font-size: 4.8rem;
  }

  .btn-compre-aqui {
    padding: 12px 24px;
    font-size: 2.4rem;
  }
  .header {
    height: 100%;
  }

  .h2 {
    font-size: 2.4rem;
    margin-bottom: 4rem;
  }
  .frase-efeito {
    font-size: 1.5rem;
  }
  .btn-menor {
    font-size: 1.4rem;
  }

  .menu-categorias {
    padding: 7rem 0 0 0;
    margin-bottom: -2rem;
  }

  .menu-categorias {
    margin: 0;
    padding-top: 4rem;
  }

  .menu-categorias ul {
    padding: 0rem 0 0 0rem;
    display: flex;
    list-style: none;
    margin: 0;
    margin-top: -4rem;
  }

  .conjunto-produtos {
    display: block;
  }

  .titulo-produto {
    font-size: 2.8rem;
  }
}

@media screen and (max-width: 900px) {
  .titulos-carrinho {
    padding: 0.8rem 0 0.8rem 0;
    display: grid;
    grid-template-columns: 5fr 1.2fr 1.5fr 1fr 1fr;
    justify-items: center;
    font-size: 1.1rem;
  }

  .itens-carrinho {
    display: grid;
    grid-template-columns: 55px 6fr 1.5fr 1fr 1.5fr 0.6fr;

    font-size: 1.4rem;
  }
}

/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 850px) {
  .topnav a:not(:first-child),
  .dropdown .dropbtn {
    display: none;
  }
  .topnav a.icon {
    float: right;
    display: block;
  }
  .link-superior {
    text-align: right;
  }

  .topnav.responsive {
    position: relative;
  }
  .topnav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: right;
  }
  .topnav.responsive .dropdown {
    float: none;
  }
  .topnav.responsive .dropdown-content {
    position: relative;
  }
  .topnav.responsive .dropdown .dropbtn {
    display: block;
    width: 100%;
    text-align: right;
  }

  .paginacao {
    font-size: 1.5rem;
    gap: 0.1rem;
  }

  .btn {
    height: 2.2rem;
    width: 2.2rem;
  }

  .btn-icon {
    height: 1.5rem;
    width: 1.5rem;
  }
  .page-link:link,
  .page-link:visited {
    font-size: 1.5rem;
    height: 2.2rem;
    width: 2.2rem;
  }
  .produto-descricao {
    font-size: 1.5rem;
    width: 100%;
    line-height: 1.3;
  }
}

@media screen and (max-width: 839px) {
  .quant-avaliacoes {
    display: none;
  }
}

@media screen and (max-width: 819px) {
  .modelo-produto {
    text-align: center;
  }
  .valor-produto {
    text-align: center;
  }
}

@media screen and (max-width: 795px) {
  .link--sup--2 {
    display: block;
  }
  .link--sup--1 {
    display: none;
  }
}

@media screen and (max-width: 710px) {
  h1 {
    font-size: 3.2rem;
    margin-top: 2rem;
  }

  .h2 {
    font-size: 2rem;
    margin-bottom: 3rem;
  }

  .btn-compre-aqui {
    padding: 10px 20px;
    font-size: 2rem;
    margin-top: 3rem;
  }
  .btn-menor {
    font-size: 1.2rem;
  }
  h3 {
    font-size: 2.8rem;
    letter-spacing: -1px;
  }
  .tamanho-foto-produto {
    max-width: 13rem;
    max-height: 13rem;
    min-width: 13rem;
    min-height: 13rem;
  }
  .nome-produto {
    font-size: 1.2rem;
  }
  .modelo-produto {
    font-size: 1.1rem;
  }
  .compre-online {
    grid-template-columns: 1fr;
  }
  .compre-aqui {
    max-width: 100%;
  }
  .img--1,
  .img--2,
  .img--3 {
    width: 100%;
  }

  .link-produto-capa {
    font-size: 1.8rem;
  }

  .h1-produtos {
    font-size: 2.8rem;
  }
  .produto-descricao {
    font-size: 1.4rem;
  }
  .quant-avaliacoes {
    font-size: 1.4rem;
  }
  .botao-avaliar {
    display: none;
  }
  .botao-avaliar2 {
    display: block;
  }

  .titulos-carrinho {
    grid-template-columns: 2.5fr 1fr 1fr 1fr 1fr;

    font-size: 1.1rem;
  }

  .itens-carrinho {
    display: grid;
    grid-template-columns: 55px 1.8fr 1fr 1.8fr 1fr 2fr;
    grid-template-rows: 1fr 1fr;
    row-gap: 0;
  }
  .carrinho--6 {
    grid-column: 2 / 7;
  }
  .carrinho--2 {
    grid-column: 2 / 3;
  }
  .carrinho--6 {
    grid-column: 2 / 7;
  }
  .carrinho--6 {
    grid-column: 2 / 7;
  }
  .carrinho--6 {
    grid-column: 2 / 7;
  }
}

@media screen and (max-width: 619px) {
  .aside {
    display: block;
  }
  .h2 {
    margin-bottom: 1rem;
  }
  .frase-efeito {
    margin-bottom: -1rem;
  }
  .btn-menor {
    font-size: 1.4rem;
    padding: 7px 14px;
    margin-bottom: 2rem;
  }
  .video {
    width: 100%;
  }

  .link-categoria {
    font-size: 1.3rem;
  }
  .menuList {
    font-size: 1.8rem;
  }
  .titulo-produto {
    font-size: 2.4rem;
  }
  .faca-uma-pergunta {
    display: block;
  }
  .bnt-pergunta {
    margin-top: 2rem;
  }

  .titulo-avaliacao {
    font-size: 1.8rem;
  }
}

@media screen and (max-width: 560px) {
  .img-principal-detalhe img {
    max-height: 45rem;
    max-width: 45rem;

    margin: 0 auto;
    margin-top: 2rem;
    margin-bottom: 1rem;
  }
  .thumbnails {
    max-width: 40rem;
    margin-bottom: 4rem;
  }

  .img-logo {
    width: 12rem;
    height: auto;
    transform: rotate(0deg);
    position: absolute;
    margin: 7.5rem 2rem 0 2rem;
  }
  h1 {
    font-size: 2rem;
  }
  .btn-compre-aqui {
    padding: 8px 16px;
    font-size: 1.6rem;
    margin-top: 3rem;
  }
  .btn-menor {
    font-size: 1.4rem;
    padding: 7px 14px;
    margin-bottom: 2rem;
  }
  h3 {
    font-size: 2.4rem;
    letter-spacing: -1px;
  }
  .h1-produtos {
    font-size: 2.4rem;
  }
  .link-categoria {
    font-size: 1.2rem;
    letter-spacing: -0.5px;
    padding-left: 0;
  }
  .menuList {
    font-size: 1.7rem;
  }
  .menu-categorias ul {
    gap: 1.5rem;
  }
  .link--sup--3 {
    display: block;
  }
  .link--sup--1 {
    display: none;
  }
  .link--sup--2 {
    display: none;
  }
}

@media screen and (max-width: 530px) {
  .container {
    width: 510px;
  }
}

@media screen and (max-width: 475px) {
  .link--sup--4 {
    display: block;
  }
  .link--sup--3 {
    display: none;
  }
  .link--sup--1 {
    display: none;
  }
  .link--sup--2 {
    display: none;
  }
}

@media screen and (max-width: 440px) {
  .link--sup--3 {
    display: none;
  }
  h3 {
    font-size: 2.2rem;
    letter-spacing: -1px;
  }
  .h1-produtos {
    font-size: 2rem;
  }
}

@media screen and (max-width: 340px) {
  .tamanho-foto-produto {
    width: 12rem;
    height: 12rem;
  }
  .h1-produtos {
    font-size: 1.6rem;
  }
  .produto-descricao {
    font-size: 1.3rem;
  }
}
