* {
  margin: 0px;
  padding: 0px;
}
body {
  font-family: "Gabarito", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400px;
  font-style: normal;
}
.Navbar {
  padding: 10px;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  border-bottom: solid black 1px;
  align-items: center;
}
.Navbar__s1__title {
  color: #a435f0;
}
.Navbar__s2 {
  width: 60%;
  border: solid 1px;
  border-radius: 30px;
  padding: 10px;
  display: flex;
  gap: 10px;
}
.Navbar__s2 input {
  border: none;
  width: 100%;
  font-size: 16px;
}
.Navbar__s2 input:focus {
  outline: none;
}
.Navbar__s3 {
  display: flex;
  gap: 30px;
  justify-content: center;
  align-items: center;
}
.categories {
  display: flex;
  justify-content: space-evenly;
  padding: 10px;
  gap: 10px;
  border-bottom: solid black 1px;
  flex-wrap: wrap;
}
.categories__C1 {
  background-color: #a435f0;
  color: white;
  padding: 10px;
  border-radius: 30px;
  flex-grow: 1;
  flex-basis: 25%;
}
.sale__img img {
  width: 100%;
}
.recommend {
  padding: 10px;
}
.recommend__container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 10px;
  gap: 10px;
}

.recommend__c1,
.recommend__c2,
.recommend__c3,
.recommend__c4 {
  width: 250px;
  padding: 5px;
}
.recommend__c1 img,
.recommend__c2 img,
.recommend__c3 img,
.recommend__c4 img {
  height: 50%;
  width: 100%;
}
.topics {
  padding: 10px;
}
.topics__container {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 10px;
}
.topics__container p {
  border: solid grey 2px;
  padding: 10px;
  flex-grow: 1;
  flex-basis: 25%;
}
.popular {
  padding: 10px;
}
.popular__container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 10px;
}
.footer {
  background-color: black;
  color: white;
  padding: 10px
}
.footer__one {
  display: flex;
  gap: 30px;
  padding: 10px;
  margin: 10px;
}.footer__one__s1 p, .footer__one__s2 p{
  padding: 10px;

}
.footer__two{
  padding: 20px;
  display: flex;
  justify-content: space-between;
}
