body {
  margin:0;
  font-family: Arial, sans-serif;
  background: #2f5d36;
  color: white;
}

.top {
  background: #2f5d36;
  text-align: center;
  padding: 3vw 0vw;
}

.logo {
  font-size: 60px;
  letter-spacing: 20px;
}

.nav-buttons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 3vw 0vw;
}

button {
  padding: 20px 70px;
  border: none;
  background: #3c6fb6;
  color: white;
  font-weight: bold;
  flex: 1;
}

button.gold {
  background: #d4a14b;
}

button.blue {
  background: #5fa6c9;
}

.products {
  display: flex;            
  align-items: center;
  justify-content: center;   
  gap: 5vw;
  padding:0vw 10vw 3vw 10vw;
}

.product_red {
  background: #e85050;
  flex: 50%;
}

.product_pink {
  background: #e77bb4;
  flex: 50%;
}
 .products img {
  object-fit: cover;
 }

.container {
  display: flex;
  align-items:center;
  height: 15vh;
  padding-bottom: 5px;
  width: auto;
  overflow: hidden;

}

.scroll {
  white-space: nowrap;
  margin: 0 2em;
}

.scroll div {
  display: flex;
  gap: 2em;
}

.scroll p {
  font-size: 5em;
  color: white;
  background-color: #3c6fb6;
  padding: 5vw 0 5vw 0;
  font-weight: bold;
  margin-bottom: 15px;
  line-height: 10px;
}

.RightToLeft {
  animation: RightToLeft 50s infinite linear;
}
@keyframes RightToLeft {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(-50%);
  }
}


.feature {
  display: flex;
  flex-direction: row;
  
}

.left-text {
  background: #5fa6c9;
  display: flex;
  flex: 50%;
  text-align: left;
  margin-left: 15px;
  margin-right: 15px;
  margin-top: 15px;
  font-size: 50pt;
  padding: 0 25px 25px 25px;
}

.right-img {
  flex: 50%;
  margin-right: 15px;
  margin-top: 15px;
  
}

.about {
  display: flex
}

.about-text {
  background: #c45a8c;
  padding: 20px;
  margin-left: 15px;
  margin-right: 15px;
  flex: 50%;
  margin-top: 15px;
  font-size: 40pt;
}

.gif{
  width: 50%;
  height: auto;
  flex: 50%;
  margin-right: 15px;
  margin-top: 15px;
}

.icons {
  display: flex;
  flex-direction:row;
  margin: 15px;
}
.icons01 {
  width: 12%;
  padding: 1%;
  flex: 16%;
}

.lifestyle {
  display: flex;
  gap: 2vw;
  overflow: hidden;
  margin-right: 15px;
  margin-left: 15px;
  
}

.snack {
  flex: 50%;
}

.snack img{
  width: 50vw; 
  height: 50vw; 
  object-fit: cover; 
}

.text {
  flex: 50%;
  background: #3c6fb6;
  padding: 20px;
  font-size: 40pt;
}

.stores {
  display: flex;
  gap: 2vw;
  overflow: hidden;
  margin: 15px;
 
}

.list {
  background: #e85050;
  flex: 50%;
  padding: 20px;
  font-size: 40pt;
}

.stores ul {
  list-style: none;
  padding: 0;
  font-size: 30pt;
}

.stores_image{
  flex: 50%;
}

.stores_image img{
  width: 50vw; 
  height: 50vw; 
  object-fit: cover; 
}

footer {
  text-align: center;
  padding: 20px;
}