/*Fonte da logo*/
@import url('https://fonts.googleapis.com/css2?family=Lancelot&display=swap');

/*Fonte do cabeçalho e de quase todo o resto*/
@import url('https://fonts.googleapis.com/css2?family=Nanum+Myeongjo&display=swap');

/*Fonte do Radu no Instagram*/
@import url('https://fonts.googleapis.com/css2?family=Arsenal+SC:ital,wght@0,400;0,700;1,400;1,700&display=swap');

/*Lexend*/
@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@100..900&display=swap');

/*Arsenal*/
@import url('https://fonts.googleapis.com/css2?family=Arsenal:ital,wght@0,400;0,700;1,400;1,700&display=swap');

/*Lexend Exa*/
@import url('https://fonts.googleapis.com/css2?family=Lexend+Exa:wght@100..900&display=swap');

/*Lekton*/
@import url('https://fonts.googleapis.com/css2?family=Lekton:ital,wght@0,400;0,700;1,400&display=swap');

/*Lexend Zetta*/
@import url('https://fonts.googleapis.com/css2?family=Lexend+Zetta:wght@100..900&display=swap');

/*Junge*/
@import url('https://fonts.googleapis.com/css2?family=Junge&display=swap');

/*Lexend Mega*/
@import url('https://fonts.googleapis.com/css2?family=Lexend+Mega:wght@100..900&display=swap');

/*Lexend Deca*/
@import url('https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@100..900&display=swap');

/*Roboto*/
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');


/*----------------------Configurações Gerais---------------------*/
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body {
    grid-area: header
               main
               footer;
}

/*Cabeçalho*/
header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #730501;
  color: #ffffff;
  min-height: 7vmax;
}
.logo h1 {
  display: flex;
  justify-content: start;
  align-items: center;
  overflow: hidden;
  font-family: "Lancelot", serif;
  font-weight: 400;
  font-style: normal;
  justify-content: start;
  font-size: 4vmax;
  margin-top: 2vmax;
  margin-left: 2.3vmax;
  cursor: pointer;
}
.logo h1:hover {
  color: #000000;
}
.logo a {
  text-decoration: none;
  color: #ffffff;
}
.nav ul {
  display: flex;
  overflow: hidden;
  list-style-type: none;
  gap: 2vmax;
  font-family: "Nanum Myeongjo", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.6vmax;
  margin-top: 2vmax;
  margin-right: 2.3vmax;
  align-items: center;
}
.nav a:hover {
  color: #000000;
  cursor: pointer;
}
.nav a .material-icons-outlined {
  font-size: 2vmax;
}
.nav a {
  text-decoration: none;
  color: #ffffff;
}

/*Footer*/

/*Esse footer é sem cor para o home*/
.info {
  width: 100%;
  height: 20vmax;
}
/*E esse tem cor e é para todo o resto*/
.info2 {
  width: 100%;
  height: 20vmax;
  background-color: #ECE4E4;
  margin-top: 7vmax;
}
/*Só isso mesmo, o resto abaixo continua o mesmo footer para todas as páginas*/
.log img {
  width: 10vmax;
  height: 3.5vmax;
  margin-top: 0.5vmax;
  margin-left: 46vmax;
}

.textos {
  display: flex;
  justify-content: space-between;
  padding: 1vmax 10vmax;
}
.textos h4 {
  font-family: "Lexend Exa", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 1.5vmax;
  display: flex;
  justify-content: center;
  margin-bottom: 1vmax;
}
.textos p {
  font-family: "Lekton", monospace;
  font-weight: 400;
  font-style: normal;
  font-size: 1.2vmax;
}
.pagamento {
  display: table-column;
  flex-wrap: wrap;
  justify-content: center;
}
.pagamento img {
  width: 4vmax;
  height: 2.5vmax;
}
.barra {
  background-color: #730501;
  width: 100%;
  height: 6vmax;
  font-family: "Lexend", sans-serif;
  font-optical-sizing: auto;
  font-weight: 250;
  font-style: normal;
  color: #ffffff;
  font-size: 1.1vmax;
  display: flex;
  text-align: center;
  justify-content: center;
  align-items: center;
}

/*---------------Página Home - Coisas Específicas------------------*/

/*Banners*/
.banner-principal {
  width: 100%;
  height: 120vh;
  overflow: hidden;
  position: relative;
  cursor: pointer;
  z-index: 0;
  background-color: #000000;
}

.banner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  flex-shrink: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  animation: fadeSlide 15s infinite;
  animation-timing-function: ease-in-out;
  pointer-events: none;
}

.banner1 {
  background-image: url(home/banner1.png);
  animation-delay: 0s;
}

.banner2 {
  background-image: url(home/banner2.png);
  animation-delay: 3s;
}

.banner3 {
  background-image: url(home/banner3.png);
  animation-delay: 9s;
}

@keyframes fadeSlide {
  0%   { opacity: 0; pointer-events: none;}   /* invisível */
  10%  { opacity: 1; pointer-events: auto;}   /* começa a aparecer */
  30%  { opacity: 1; pointer-events: auto;}   /* ainda visível */
  50%  { opacity: 0; pointer-events: none;}  
  100% { opacity: 0; pointer-events: none;}   /* invisível de novo */
}

/*Conteúdo principal*/

.topicos {
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  gap: 1vmax;
  margin-top: 4rem;
  margin-bottom: 4rem;
}
.topicos > .linha {
  background-color: #707070;
  width: 36vw;
  height: 0.1vh;
}
.topicos > .linha2 {
  background-color: #707070;
  width: 40vw;
  height: 0.1vh;
}
.topicos h1 {
  font-family: "Nanum Myeongjo", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2vmax;
  flex-wrap: nowrap;
}

/*Produtos*/
.card-container {
  font-family: Arial, sans-serif;
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 10vmax;
}
.card {
  width: 18vmax;
  height: 22vmax;
  overflow: hidden;
  border: 0.1px solid #000000;
  cursor: pointer;
}
.card h3 {
  font-size: 1.2vmax;
  margin-bottom: 0.5vmax;
  text-align: justify;
  margin-left: 1.5vmax;
  margin-top: 0.5vmax;
}
.card p {
  color: #5D5D5D;
  font-size: 1.1vmax;
  text-align: justify;
  margin-left: 1.5vmax;
}
.card1 {
  width: 12vmax;
  height: 16vmax;
  margin-left: 3.3vmax;
}
.card2 {
  width: 14vmax;
  height: 12vmax;
  margin-left: 1.8vmax;
  margin-top: 4vmax;
}
.card3 {
  width: 12vmax;
  height: 14vmax;
  margin-left: 3vmax;
  margin-top: 1.8vmax;
}
.card4 {
  width: 14vmax;
  height: 12vmax;
  margin-left: 2vmax;
  margin-top: 4vmax;
}
.card5 {
  width: 12vmax;
  height: 13vmax;
  margin-left: 3vmax;
  margin-top: 3vmax;
}
.card6 {
  width: 12vmax;
  height: 12vmax;
  margin-left: 3vmax;
  margin-top: 4vmax;
}

/*Radu no Instagram*/
.radu h1 {
  font-family: "Arsenal SC", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 3vmax;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 2vmax;
  margin-top: 7vmax;
  cursor: pointer;
}
.instagram-cards {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 4vmax;
}
.instagram-cards img {
  width: 19vmax;
  height: 26vmax;
}

/*Loja Radu*/
.sobre {
  display: flex;
  align-items: center;
  background-color: #C8C8C8;
  width: 100%;
  height: 35vmax;
  margin-top: 5vmax;
}
.loja img {
  width: 48vmax;
  height: 24vmax;
  margin-top: 3vmax;
  margin-left: 4vmax;
}
.texto h1 {
  font-family: "Nanum Myeongjo", serif;
  font-weight: 600;
  font-style: normal;
  font-size: 3vmax;
  text-align: center;
  margin-bottom: 1vmax;
  margin-top: 2vmax;
}
.texto p {
  font-family: "Arsenal SC", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-align: center;
  font-size: 1.8vmax;
  margin-left: 3vmax;
  margin-right: 3vmax;
}

/*Cadastro*/
.cadastro {
  background-color: #9C5C5C;
  width: 100%;
  height: 10vmax;
}
.inscrevase {
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: "Arsenal SC", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.5vmax;
  gap: 0.5vmax;
}
.inscrevase p {
  margin-top: 1vmax;
} 
.inscrevase .material-icons-outlined {
  font-size: 1.7vmax;
  margin-top: 1vmax;
}

.fieldset {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1.5vmax;
  margin-top: 1vmax;
  border: none;
}
.email input{
  display: flex;
  align-items: center;
  background-color: #ffffff;
  border: 1px solid #000000;
  width: 18.5vmax;
  height: 2.5vmax;
  font-family: "Arsenal", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.3vmax;
  color: #7a7a7a;
  padding-left: 0.5vmax;
}

.cadastrar button {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #323232;
  border: 1px solid #000000;
  width: 10vmax;
  height: 2.5vmax;
  font-family: "Arsenal SC", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.2vmax;
  color: #ffffff;
  cursor: pointer;
}
.cadastrar button:hover {
  color: #323232;
  background-color: #ffffff; 
  border: 1px solid #323232;
}
.icons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1vmax;
  margin-top: 0.5vmax;
}
.icons p {
  font-family: "Arsenal SC", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.5vmax;
  color: #000000;
}
.icon1 img {
  width: 1.7vmax;
  height: 1.7vmax;
  margin-top: 0.5vmax;
  cursor: pointer;
}
.icon2 img {
  width: 1.7vmax;
  height: 1.7vmax;
  margin-top: 0.5vmax;
  cursor: pointer;
}
.icon3 img {
  width: 1.7vmax;
  height: 1.7vmax;
  margin-top: 0.5vmax;
  cursor: pointer;
}
.icons img:hover {
  background-color: #904848;
  border-radius: 3px;
}



/*------Páginas Banners - Coisas Gerais------*/

.title {
  text-align: center;
  flex-wrap: wrap;

}
.title h1 {
  font-family: "Nanum Myeongjo", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 5vmax;
  margin-top: 2vmax;
}
.title h4 {
  font-family: "Lexend Zetta", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 2.2vmax;
  color: #730501;
  text-transform: lowercase;
  margin-top: -1vmax;
}

.produtos {
  font-family: Arial, sans-serif;
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 7vmax;
  margin-top: 6vmax;
}
.produt {
  width: 18vmax;
  height: 22vmax;
  overflow: hidden;
  border: 0.1px solid #000000;
  cursor: pointer;
}
.produt h3 {
  font-size: 1.2vmax;
  margin-bottom: 0.5vmax;
  text-align: justify;
  margin-left: 1.5vmax;
  margin-top: 0.5vmax;
}
.produt p {
  color: #5D5D5D;
  font-size: 1.1vmax;
  text-align: justify;
  margin-left: 1.5vmax;
}

/*-- Las Femes -- Página --*/

.produt1 {
  width: 14vmax;
  height: 12vmax;
  margin-left: 2vmax;
  margin-top: 4vmax;
}
.produt2 {
  width: 14vmax;
  height: 12vmax;
  margin-left: 1.8vmax;
  margin-top: 4vmax;
}
.produt3 {
  width: 14vmax;
  height: 14vmax;
  margin-left: 2vmax;
  margin-top: 1.8vmax;
}
.produt4 {
  width: 13vmax;
  height: 14vmax;
  margin-left: 3vmax;
  margin-top: 1.8vmax;
}

/*-- Los Hombres -- Página --*/

.produ1 {
  width: 14vmax;
  height: 12vmax;
  margin-left: 1.5vmax;
  margin-top: 4vmax;
}
.produ2 {
  width: 14vmax;
  height: 12vmax;
  margin-left: 1.8vmax;
  margin-top: 4vmax;
}
.produ3 {
  width: 13vmax;
  height: 13vmax;
  margin-left: 2vmax;
  margin-top: 3vmax;
}
.produ4 {
  width: 13vmax;
  height: 14vmax;
  margin-left: 2.3vmax;
  margin-top: 1.8vmax;
}

/*-- New collection -- Página --*/

.titulo {
  text-align: center;
  flex-wrap: wrap;

}
.titulo h1 {
  font-family: "Nanum Myeongjo", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 5vmax;
  margin-top: 2vmax;
}
.titulo h4 {
  font-family: "Lexend Zetta", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 2.2vmax;
  color: #730501;
  text-transform: lowercase;
  margin-top: -1vmax;
}
.titulo h2 {
  font-family: "Nanum Myeongjo", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3vmax;
}

.bags {
  font-family: Arial, sans-serif;
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 7vmax;
  margin-top: 5vmax;
}
.bag {
  width: 18vmax;
  height: 22vmax;
  overflow: hidden;
  border: 0.1px solid #000000;
  cursor: pointer;
}
.bag img {
  width: 100%;
  height: 100%;
}

/*------------------PÁGINA NOVIDADES ------------------*/

.letreiro {
  display: flex;
  justify-content: center;
  margin-top: 1.5vmax;
}
.novidades h1 {
  font-family: "Nanum Myeongjo", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 3vmax;
}
.new {
  font-family: "Lexend Exa", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size: 1.5vmax;
  color: #730501;
  margin-top: 2vmax;
  margin-left: -0.6vmax;
}
.buzios {
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  margin-top: 1vmax;
}
.buzios h1 {
  font-family: "Junge", cursive;
  font-weight: 400;
  font-style: normal;
  font-size: 3.5vmax;
  color: #021846;
}
.buzios h2 {
  font-family: "Lexend Mega", sans-serif;
  font-optical-sizing: auto;
  font-weight: 100;
  font-style: normal;
  font-size: 3vmax;
  color: #021846;
}

.prod1 {
  width: 16vmax;
  height: 14vmax;
  margin-left: 1vmax;
  margin-top: 2vmax;
}
.prod2 {
  width: 16vmax;
  height: 14vmax;
  margin-left: 1vmax;
  margin-top: 2vmax;
}
.prod3 {
  width: 16vmax;
  height: 16vmax;
  margin-left: 1vmax;
}
.prod4 {
  width: 12vmax;
  height: 9vmax;
  margin-left: 3vmax;
  margin-bottom: 1vmax;
  margin-top: 6vmax;
}
.prod5 {
  width: 12vmax;
  height: 11vmax;
  margin-left: 2.5vmax;
  margin-top: 5vmax;
}
.prod6 {
  width: 12vmax;
  height: 7vmax;
  margin-left: 3vmax;
  margin-top: 9vmax;
}
.prod7 {
  width: 13vmax;
  height: 8vmax;
  margin-left: 2vmax;
  margin-top: 8vmax;
}
.prod8 {
  width: 13vmax;
  height: 8vmax;
  margin-left: 3vmax;
  margin-bottom: 0.5vmax;
  margin-top: 7.5vmax;
}


/*------------------PÁGINA FEMININO ------------------*/

.feminino h1 {
  font-family: "Nanum Myeongjo", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 6vmax;
}
.woman {
  font-family: "Lexend Exa", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size: 2vmax;
  color: #730501;
  margin-top: 4vmax;
  margin-left: -1vmax;
}

.pro1 {
  width: 13vmax;
  height: 14vmax;
  margin-left: 2.5vmax;
  margin-top: 2vmax;
}
.pro2 {
  width: 11vmax;
  height: 15vmax;
  margin-left: 3.5vmax;
  margin-top: 1vmax;
}
.pro3 {
  width: 11vmax;
  height: 11vmax;
  margin-left: 3vmax;
  margin-top: 5vmax;
}
.pro4 {
  width: 15vmax;
  height: 13vmax;
  margin-left: 1.5vmax;
  margin-top: 3vmax;
}
.pro5 {
  width: 15vmax;
  height: 7vmax;
  margin-left: 1vmax;
  margin-top: 9vmax;
}
.pro6 {
  width: 16vmax;
  height: 7vmax;
  margin-left: 1vmax;
  margin-top: 9vmax;
}
.pro7 {
  width: 15vmax;
  height: 6vmax;
  margin-left: 1vmax;
  margin-top: 10vmax;
}
.pro8 {
  width: 15vmax;
  height: 6vmax;
  margin-left: 1vmax;
  margin-top: 10vmax;
}
.pro9 {
  width: 15vmax;
  height: 9vmax;
  margin-left: 1vmax;
  margin-top: 7vmax;
}
.pro10 {
  width: 13vmax;
  height: 12vmax;
  margin-left: 2vmax;
  margin-top: 4vmax;
}
.pro11 {
  width: 13vmax;
  height: 10vmax;
  margin-left: 3vmax;
  margin-top: 6vmax;
}
.pro12 {
  width: 15vmax;
  height: 9vmax;
  margin-left: 1vmax;
  margin-top: 7vmax;
}
.pro13 {
  width: 11vmax;
  height: 14vmax;
  margin-left: 3vmax;
  margin-top: 2vmax;
}
.pro14 {
  width: 14vmax;
  height: 6vmax;
  margin-left: 2vmax;
  margin-top: 10vmax;
}
.pro15 {
  width: 15vmax;
  height: 8vmax;
  margin-left: 1vmax;
  margin-top: 8vmax;
}
.pro16 {
  width: 15vmax;
  height: 5vmax;
  margin-left: 1.5vmax;
  margin-top: 11vmax;
}
.pro17 {
  width: 14vmax;
  height: 10vmax;
  margin-left: 1.5vmax;
  margin-top: 6vmax;
}
.pro18 {
  width: 14vmax;
  height: 8vmax;
  margin-left: 2vmax;
  margin-top: 8vmax;
}
.pro19 {
  width: 13vmax;
  height: 9vmax;
  margin-left: 2vmax;
  margin-top: 7vmax;
}
.pro20 {
  width: 14vmax;
  height: 10vmax;
  margin-left: 2vmax;
  margin-top: 6vmax;
}

/*------------------ PÁGINA MASCULINO ------------------*/


.masculino h1 {
  font-family: "Nanum Myeongjo", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 6vmax;
}
.man {
  font-family: "Lexend Exa", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size: 2vmax;
  color: #730501;
  margin-top: 4vmax;
  margin-left: -1.3vmax;
}


.pr1 {
  width: 13vmax;
  height: 14vmax;
  margin-left: 2.5vmax;
  margin-top: 2vmax;
}
.pr2 {
  width: 11vmax;
  height: 8vmax;
  margin-left: 3vmax;
  margin-top: 8vmax;
}
.pr3 {
  width: 16vmax;
  height: 13vmax;
  margin-left: 1vmax;
  margin-top: 3vmax;
}
.pr4 {
  width: 15vmax;
  height: 13vmax;
  margin-left: 1.5vmax;
  margin-top: 3vmax;
}
.pr5 {
  width: 16vmax;
  height: 6vmax;
  margin-left: 1vmax;
  margin-top: 10vmax;
}
.pr6 {
  width: 16vmax;
  height: 7vmax;
  margin-left: 1vmax;
  margin-top: 9vmax;
}
.pr7 {
  width: 15vmax;
  height: 12vmax;
  margin-left: 1vmax;
  margin-top: 4vmax;
}
.pr8 {
  width: 14vmax;
  height: 10vmax;
  margin-left: 2vmax;
  margin-top: 6vmax;
}
.pr9 {
  width: 15vmax;
  height: 6.5vmax;
  margin-left: 1vmax;
  margin-top: 9.5vmax;
}
.pr10 {
  width: 18vmax;
  height: 12vmax;
  margin-top: 4vmax;
}
.pr11 {
  width: 15vmax;
  height: 9vmax;
  margin-left: 1.5vmax;
  margin-top: 7vmax;
}
.pr12 {
  width: 16vmax;
  height: 9vmax;
  margin-left: 1vmax;
  margin-top: 7vmax;
}
.pr13 {
  width: 11vmax;
  height: 14vmax;
  margin-left: 3vmax;
  margin-top: 2vmax;
}
.pr14 {
  width: 16vmax;
  height: 6vmax;
  margin-left: 1vmax;
  margin-top: 10vmax;
}
.pr15 {
  width: 18vmax;
  height: 6vmax;
  margin-top: 10vmax;
}
.pr16 {
  width: 17vmax;
  height: 7vmax;
  margin-left: 1vmax;
  margin-top: 9vmax;
}
.pr17 {
  width: 14vmax;
  height: 10vmax;
  margin-left: 2vmax;
  margin-top: 6vmax;
}
.pr18 {
  width: 18vmax;
  height: 8vmax;
  margin-top: 8vmax;
}
.pr19 {
  width: 17vmax;
  height: 9vmax;
  margin-left: 0.5vmax;
  margin-top: 7vmax;
}
.pr20 {
  width: 15vmax;
  height: 10vmax;
  margin-left: 1.5vmax;
  margin-top: 6vmax;
}



/*------------------ PÁGINA LIFESTYLE ------------------*/

.life h1 {
  font-family: "Nanum Myeongjo", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 7vmax;
}
.ra {
  font-family: "Lexend Exa", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size: 2vmax;
  color: #730501;
  margin-top: 5.3vmax;
  margin-left: -0.7vmax;
}

.p1 {
  width: 10vmax;
  height: 7vmax;
  margin-left: 4vmax;
  margin-top: 9vmax;
}
.p2 {
  width: 16vmax;
  height: 4vmax;
  margin-left: 1vmax;
  margin-top: 12vmax;
}
.p3 {
  width: 10vmax;
  height: 10vmax;
  margin-left: 4vmax;
  margin-top: 6vmax;
}
.p4 {
  width: 7vmax;
  height: 15vmax;
  margin-left: 5.5vmax;
  margin-top: 1vmax;
}
.p5 {
  width: 12vmax;
  height: 14vmax;
  margin-left: 2.5vmax;
  margin-top: 2vmax;
}
.p6 {
  width: 14vmax;
  height: 9vmax;
  margin-left: 2vmax;
  margin-top: 6vmax;
}
.p7 {
  width: 8vmax;
  height: 13vmax;
  margin-left: 4vmax;
  margin-top: 3vmax;
}
.p8 {
  width: 11vmax;
  height: 14vmax;
  margin-left: 3vmax;
  margin-top: 2vmax;
}



/*---------------------- PÁGINA CONTA ----------------------*/

/*titulo*/
.acesse{
  display: flex;
  justify-content: center;
  margin-top: 5vmax;
  margin-bottom: 4vmax;
}
.acesse h1 {
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
  font-size: 3vmax;
}
/*Preenchimento de dados*/
.container {
  display: flex;
  justify-content: center;
}
.EMAIL input {
  width: 65vmax;
  height: 4vmax;
  padding-left: 1vmax;
  margin-bottom: 2vmax;
}
.senha input {
  width: 65vmax;
  height: 4vmax;
  padding-left: 1vmax;
  margin-bottom: 0.5vmax;
}
.senhaa {
  display: flex;
  justify-content: end;
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 1.4vmax;
  gap: 0.5vmax;
  margin-right: 1vmax;
}
.senhaa .recuperar {
  color: #730501;
  cursor: pointer;
}
.recuperar:hover {
  color: #ff0000;
}
/*botões pretos grandes e linha*/
.button1 button {
  width: 65vmax;
  height: 4vmax;
  margin-top: 4vmax;
  border-radius: 0%;
  background-color: #000000;
  color: #ffffff;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  border: none; 
  cursor: pointer;
}
.button1 button:hover {
  color: #000000;
  background-color: #ffffff; 
  border: 0.5px solid #000000;
}
.ouu {
  display: flex;
  justify-content: center;
  margin-top: 4vmax;
  gap: 1.2vmax;
}
.line1 {
  width: 30vmax;
  height: 0.1vmax;
  background-color: #707070;
  display: flex;
  margin-top: 1.2vmax;
}
.ou {
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}
.line2 {
  width: 30vmax;
  height: 0.1vmax;
  background-color: #707070;
  display: flex;
  margin-top: 1.2vmax;
}
.button2 button {
  width: 65vmax;
  height: 4vmax;
  margin-top: 4vmax;
  margin-bottom: 4vmax;
  border-radius: 0%;
  background-color: #000000;
  color: #ffffff;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  border: none;
  cursor: pointer;
}
.button2 button:hover {
  color: #000000;
  background-color: #ffffff; 
  border: 0.5px solid #000000;
}



/*---------------------- PÁGINA CARRINHO ----------------------*/

/*tudo*/
.everything {
  display: flex;
  justify-content: center;
  gap: 2vmax;
}

/*quadrado que diz sacola vazia*/
.sacola-cep {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: start;
}
.sacola {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 40vmax;
  height: 10vmax;
  border: 0.5px solid #000000;
  color: #8D8D8D;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 1.3vmax;
  margin-bottom: 9.5vmax;
}
.sacola .material-icons-outlined {
  font-size: 4vmax;
}

/*parágrafo antes do preenchimento do cep*/
.entrega {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: start;
  gap: 1vmax;
}
.entrega h1 {
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 1.3vmax;
}
.entrega h2 {
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 200;
  font-style: normal;
  font-size: 1.1vmax;
}

/* colocar o cep*/
.cep {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: start;
}
.cep h3 {
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 1.2vmax;
  margin-bottom: 0.5vmax;
}
.cep input {
  width: 30vmax;
  height: 4vmax;
  border-radius: 0%;
  border: 0.5px solid #000000;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 1.2vmax;
  padding-left: 1vmax;
}
.cep button {
  width: 9.5vmax;
  height: 4vmax;
  border-radius: 0%;
  border: 0.5px solid #000000;
  color: #ffffff;
  background-color: #000000;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 1.3vmax;
  cursor: pointer;
}
.cep button:hover {
  color: #000000;
  background-color: #ffffff;
}
.cep h4 {
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 1vmax;
  color: #730501;
  margin-top: 0.5vmax;
  cursor: pointer;
}
.cep h4:hover {
  color: #ff0800;
}

/*quadrado que mostra o preço e cupom, e pra finalizar*/
.compra {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border: 0.5px solid #000000;
  width: 35vmax;
  height: 30.5vmax;
  gap: 1vmax;
}
.compra h1 {
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 1.5vmax;
  margin-right: 5vmax;
}
.codigo {
  display: flex;
  justify-content: center;
  align-items: center;
}
.codigo input {
  width: 20vmax;
  height: 4vmax;
  border-radius: 0%;
  border: 0.5px solid #8D8D8D;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 1.4vmax;
  padding-left: 1vmax;
}
.codigo button {
  width: 9.5vmax;
  height: 4vmax;
  border-radius: 0%;
  border: 0.5px solid #000000;
  color: #000000;
  background-color: #ffffff;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 1.4vmax;
  cursor: pointer;
}
.codigo button:hover {
  color: #ffffff;
  background-color: #000000;
}
.precoo {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 19vmax;
  margin-top: 1vmax;
}
.precoo p {
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 1.4vmax;
}
.precoo2 {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 21vmax;
  margin-top: 1vmax;
}
.precoo2 p {
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 1.4vmax;
}
.finalizar {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 2vmax;
}
.finalizar button {
  width: 30vmax;
  height: 4vmax;
  border-radius: 0%;
  border: 0;
  color: #ffffff;
  background-color: #000000;
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 1.4vmax;
  cursor: pointer;
}
.finalizar button:hover {
  border: 0.5px solid #000000;
  color: #000000;
  background-color: #ffffff;
}
.finalizar p {
  font-family: "Lexend Deca", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
  font-size: 1.4vmax;
  color: #730501;
  margin-top: 1vmax;
  cursor: pointer;
}
.finalizar p:hover {
  color: #ff0800;
}



@media (max-width: 768px) {

/*----------------Configurações Gerais--------------*/

/*Simbolos Navbar*/
nav li .material-icons-outlined {
  font-size: 2vmax;
}


/*Footer*/

.info {
  width: 100%;
  height: 20vmax;
}
.log img {
  width: 10vmax;
  height: 3.5vmax;
  margin-top: 0.5vmax;
  margin-left: 28vmax;
}

.textos {
  display: flex;
  justify-content: space-between;
  padding: 1vmax 4vmax;
  gap: 1vmax;
}
.textos h4 {
  font-size: 1.5vmax;
  margin-bottom: 1vmax;
}
.textos p {
  font-size: 1.2vmax;
}
.pagamento img {
  width: 3vmax;
  height: 1.5vmax;
}



/*------Página Home - Coisas Específicas-------*/

/* Banner em dispositivos menores */
.banner-principal {
  width: 100%;
  height: 60vmin;
  object-fit: cover;
}

/*DESTAQUES DA SEMANA*/
.topicos {
  gap: 0.5vmax;
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.topicos h1 {
  font-size: 1.9vmax; 
  text-align: center;
}
.topicos > .linha {
  width: 30.1vw;  
  height: 0.1vh;
}
.topicos > .linha2 {
  width: 36vw;
  height: 0.1vh;
}

/*Cards*/
.card-container {
  font-family: Arial, sans-serif;
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  margin-top: 3vmax;
  gap: 2vmax;
}
.card {
  border: 0.1px solid #000000;
}
.card1 {
  margin-left: 2vmax;
}
.card2 {
  margin-left: 0.6vmax;
}
.card3 {
  margin-left: 3vmax;
}
.card4 {
  margin-left: 2vmax;
}
.card5 {
  margin-left: 3vmax;
}
.card6 {
  margin-left: 3.5vmax;
}

/*Insta Cards*/
.instagram-cards {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 2vmax;
}
.radu h1 {
  font-size: 2.3vmax; 
}
.instagram-cards img {
  width: 13vmax;
  height: 19vmax;
}

/*Sobre a Radu*/
.sobre {
  width: 100%;
  height: 30vmax;
}
.loja img {
  width: 32vmax;
  height: 20vmax;
  margin-top: 3vmax;
  margin-left: 4vmax;
}
.texto h1 {
  font-family: "Nanum Myeongjo", serif;
  font-weight: 600;
  font-style: normal;
  font-size: 2vmax;
  text-align: center;
  margin-top: 2vmax;
  margin-bottom: 1vmax;
}
.texto p {
  font-size: 1.6vmax;
  margin-left: 2vmax;
  margin-right: 2vmax;
}


/*------------Páginas Banners----------------*/
.produtos {
  flex-wrap: wrap;
  gap: 7.2vmax;
  margin-top: 7vmax;
}
.produt {
  width: 22vmax;
  height: 26vmax;
}
.produt h3 {
  font-size: 1.5vmax;
  margin-bottom: 0.5vmax;
}
.produt p {
  font-size: 1.3vmax;
}

/*produtos da las femes*/
.produt1 {
  width: 18vmax;
  height: 16vmax;
  margin-left: 2vmax;
  margin-top: 4vmax;
}
.produt2 {
  width: 18vmax;
  height: 16vmax;
  margin-left: 1.8vmax;
  margin-top: 4vmax;
}
.produt3 {
  width: 18vmax;
  height: 18vmax;
  margin-left: 2vmax;
  margin-top: 1.8vmax;
}
.produt4 {
  width: 17vmax;
  height: 18vmax;
  margin-left: 3vmax;
  margin-top: 1.8vmax;
}

/*produtos dos los hombres*/
.produ1 {
  width: 20vmax;
  height: 16vmax;
  margin-left: 0vmax;
}
.produ2 {
  width: 20vmax;
  height: 16vmax;
}
.produ3 {
  width: 18vmax;
  height: 17vmax;
}
.produ4 {
  width: 17vmax;
  height: 18vmax;
}

/*produtos new collection*/
.bags {
  flex-wrap: wrap;
  gap: 7.2vmax;
  margin-top: 5vmax;
}
.bag {
  width: 22vmax;
  height: 26vmax;
}
.bag img {
  width: 100%;
  height: 100%;
}

.prod1 {
  width: 20vmax;
  height: 18vmax;
  margin-left: 1vmax;
  margin-top: 1vmax;
}
.prod2 {
  width: 20vmax;
  height: 18vmax;
  margin-left: 1.5vmax;
  margin-top: 1vmax;
}
.prod3 {
  width: 18vmax;
  height: 18vmax;
  margin-left: 1vmax;
  margin-top: 1vmax;
}
.prod4 {
  width: 16vmax;
  height: 11vmax;
  margin-left: 3vmax;
  margin-bottom: 1vmax;
  margin-top: 7vmax;
}
.prod5 {
  width: 16vmax;
  height: 15vmax;
  margin-left: 2.5vmax;
  margin-top: 4vmax;
}
.prod6 {
  width: 15vmax;
  height: 10vmax;
  margin-left: 3.5vmax;
  margin-top: 9vmax;
}
.prod7 {
  width: 15vmax;
  height: 10vmax;
  margin-left: 3vmax;
  margin-top: 9vmax;
}
.prod8 {
  width: 16vmax;
  height: 11vmax;
  margin-left: 3vmax;
  margin-bottom: 0.5vmax;
  margin-top: 7.5vmax;
}


/*----------------Página Feminino------------------*/

.pro1 {
  width: 16vmax;
  height: 17vmax;
  margin-left: 3vmax;
  margin-top: 2vmax;
}
.pro2 {
  width: 13vmax;
  height: 17vmax;
  margin-left: 4vmax;
  margin-top: 2vmax;
}
.pro3 {
  width: 14vmax;
  height: 14vmax;
  margin-left: 4vmax;
  margin-top: 5vmax;
}
.pro4 {
  width: 17vmax;
  height: 15vmax;
  margin-left: 2vmax;
  margin-top: 4vmax;
}
.pro5 {
  width: 18vmax;
  height: 8vmax;
  margin-left: 2vmax;
  margin-top: 11vmax;
}
.pro6 {
  width: 18vmax;
  height: 8vmax;
  margin-left: 2vmax;
  margin-top: 11vmax;
}
.pro7 {
  width: 18vmax;
  height: 7vmax;
  margin-left: 2vmax;
  margin-top: 12vmax;
}
.pro8 {
  width: 18vmax;
  height: 7vmax;
  margin-left: 2vmax;
  margin-top: 12vmax;
}
.pro9 {
  width: 19vmax;
  height: 12vmax;
  margin-left: 1vmax;
  margin-top: 7vmax;
}
.pro10 {
  width: 16vmax;
  height: 15vmax;
  margin-left: 2vmax;
  margin-top: 4vmax;
}
.pro11 {
  width: 17vmax;
  height: 13vmax;
  margin-left: 2vmax;
  margin-top: 6vmax;
}
.pro12 {
  width: 19vmax;
  height: 12vmax;
  margin-left: 1vmax;
  margin-top: 7vmax;
}
.pro13 {
  width: 13vmax;
  height: 17vmax;
  margin-left: 4vmax;
  margin-top: 2vmax;
}
.pro14 {
  width: 18vmax;
  height: 8vmax;
  margin-left: 2vmax;
  margin-top: 11vmax;
}
.pro15 {
  width: 18vmax;
  height: 10vmax;
  margin-left: 2vmax;
  margin-top: 9vmax;
}
.pro16 {
  width: 19vmax;
  height: 6vmax;
  margin-left: 1.5vmax;
  margin-top: 13vmax;
}
.pro17 {
  width: 18vmax;
  height: 13vmax;
  margin-left: 1.5vmax;
  margin-top: 6vmax;
}
.pro18 {
  width: 19vmax;
  height: 11vmax;
  margin-left: 1vmax;
  margin-top: 8vmax;
}
.pro19 {
  width: 17vmax;
  height: 13vmax;
  margin-left: 2vmax;
  margin-top: 6vmax;
}
.pro20 {
  width: 17vmax;
  height: 13vmax;
  margin-left: 2vmax;
  margin-top: 6vmax;
}


/*----------------Página Masculino------------------*/

.pr1 {
  width: 16vmax;
  height: 17vmax;
  margin-left: 3vmax;
  margin-top: 2vmax;
}
.pr2 {
  width: 15vmax;
  height: 11vmax;
  margin-left: 3vmax;
  margin-top: 8vmax;
}
.pr3 {
  width: 20vmax;
  height: 16vmax;
  margin-left: 1vmax;
  margin-top: 3vmax;
}
.pr4 {
  width: 20vmax;
  height: 16vmax;
  margin-left: 1vmax;
  margin-top: 3vmax;
}
.pr5 {
  width: 20vmax;
  height: 8vmax;
  margin-left: 1vmax;
  margin-top: 11vmax;
}
.pr6 {
  width: 20vmax;
  height: 9vmax;
  margin-left: 1vmax;
  margin-top: 10vmax;
}
.pr7 {
  width: 18vmax;
  height: 15vmax;
  margin-left: 1vmax;
  margin-top: 4vmax;
}
.pr8 {
  width: 18vmax;
  height: 14vmax;
  margin-left: 2vmax;
  margin-top: 5vmax;
}
.pr9 {
  width: 20vmax;
  height: 9vmax;
  margin-left: 1vmax;
  margin-top: 10vmax;
}
.pr10 {
  width: 20vmax;
  height: 15vmax;
  margin-left: 1vmax;
  margin-top: 4vmax;
}
.pr11 {
  width: 19vmax;
  height: 11vmax;
  margin-left: 1.5vmax;
  margin-top: 8vmax;
}
.pr12 {
  width: 20vmax;
  height: 12vmax;
  margin-left: 1vmax;
  margin-top: 7vmax;
}
.pr13 {
  width: 14vmax;
  height: 17vmax;
  margin-left: 4vmax;
  margin-top: 2vmax;
}
.pr14 {
  width: 20vmax;
  height: 8vmax;
  margin-left: 1vmax;
  margin-top: 11vmax;
}
.pr15 {
  width: 22vmax;
  height: 7vmax;
  margin-top: 12vmax;
}
.pr16 {
  width: 22vmax;
  height: 12vmax;
  margin-top: 7vmax;
}
.pr17 {
  width: 18vmax;
  height: 14vmax;
  margin-left: 2vmax;
  margin-top: 5vmax;
}
.pr18 {
  width: 22vmax;
  height: 10vmax;
  margin-top: 9vmax;
}
.pr19 {
  width: 21vmax;
  height: 10vmax;
  margin-left: 0.5vmax;
  margin-top: 9vmax;
}
.pr20 {
  width: 22vmax;
  height: 13vmax;
  margin-left: -0.5vmax;
  margin-top: 6vmax;
}



/*----------------Página Lifestyle------------------*/

.p1 {
  width: 16vmax;
  height: 11vmax;
  margin-left: 3vmax;
  margin-top: 8vmax;
}
.p2 {
  width: 22vmax;
  height: 7vmax;
  margin-left: 0vmax;
  margin-top: 12vmax;
}
.p3 {
  width: 14vmax;
  height: 14vmax;
  margin-left: 4vmax;
  margin-top: 5vmax;
}
.p4 {
  width: 9vmax;
  height: 18vmax;
  margin-left: 6vmax;
  margin-top: 1vmax;
}
.p5 {
  width: 14vmax;
  height: 16vmax;
  margin-left: 3.5vmax;
  margin-top: 3vmax;
}
.p6 {
  width: 17vmax;
  height: 11vmax;
  margin-left: 2vmax;
  margin-top: 8vmax;
}
.p7 {
  width: 10vmax;
  height: 16vmax;
  margin-left: 6vmax;
  margin-top: 3vmax;
}
.p8 {
  width: 14vmax;
  height: 17vmax;
  margin-left: 4vmax;
  margin-top: 2vmax;
}



/*-------------------Página Conta--------------------*/

/*Preenchimento de dados*/

.EMAIL input {
  margin-top: 2vmax;
  margin-bottom: 3.7vmax;
}
.senha input {
  margin-bottom: 1vmax;
}

/*botões pretos grandes e linhas*/
.button1 button {
  margin-top: 6vmax;
}
.ouu {
  margin-top: 5vmax;
  margin-bottom: 1vmax;
}
.line1 {
  width: 29vmax;
  margin-top: 1.4vmax;
}
.line2 {
  width: 29vmax;
  margin-top: 1.4vmax;
}



/*-------------------Página Carrinho--------------------*/

.everything {
  gap: 0vmax;
  margin-bottom: 10vmax;
}

/*quadrado que diz sacola vazia*/
.sacola {
  width: 32vmax;
  height: 10vmax;
  font-size: 1.5vmax;
  margin-bottom: 14vmax;
  margin-left: 2vmax;
  margin-top: 2vmax;
}
.sacola .material-icons-outlined {
  font-size: 5vmax;
}

/*parágrafo antes do preenchimento do cep*/
.entrega {
  gap: 1vmax;
  margin-left: 3vmax;
}
.entrega h1 {
  font-size: 1.8vmax;
}
.entrega h2 {
  font-size: 1.5vmax;
  margin-right: 4vmax;
  margin-bottom: 1vmax;
}

/* colocar o cep*/
.cep h3 {
  font-size: 1.8vmax;
  margin-bottom: 1vmax;
}
.cep input {
  width: 21vmax;
  height: 4vmax;
}
.cep h4 {
  font-size: 1.3vmax;
}

/*quadrado que mostra o preço e cupom, e pra finalizar*/
.compra {
  width: 36vmax;
  height: 40.5vmax;
  margin-top: 2vmax;
  margin-right: 2vmax;
}
.compra h1 {
  font-size: 1.5vmax;
  margin-right: 2vmax;
  margin-bottom: 0.8vmax;
}
.codigo input {
  width: 18vmax;
}
.codigo button {
  width: 8vmax;
  font-size: 1.4vmax;
  margin-bottom: 1vmax;
}

.precoo {
  gap: 14vmax;
  margin-top: 2vmax;
}
.precoo p {
  margin-left: 1vmax;
  margin-right: 1vmax;
}
.precoo2 {
  gap: 18vmax;
  margin-top: 1vmax;
  margin-left: 1vmax;
  margin-right: 1vmax;
  margin-bottom: 2vmax;
}
.finalizar {
  margin-top: 1vmax;
}
.finalizar button {
  width: 27vmax;
  margin-left: 2vmax;
  margin-right: 2vmax;
}

/*chaves que fecha o media*/
}