body {
   font-family: 'Arial', sans-serif;
   margin: 0;
   padding: 0;
   background-color: none
   color(srgb red green blue) #333;}

/* Navigation bar */
nav.navigation {
   display: flex;
   justify-content: space-between;
   align-items: center;
   background-color: #fff;
   padding: 10px 20px;
   box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

nav .logo img {
   height: 50px;
}

nav .nav-links a {
   margin: 0 10px;
   text-decoration: none;
   color: #333;
}

nav .nav-links a:hover {
   color: #000000;
}

/* Hero banner */
section.hero-banner {
   position: relative;
   text-align: center;
   color: white;
}

section.hero-banner img {
   width: 100%;
   height: auto;
   opacity: 0.8;
   border-radius: 75px;
}

section.hero-banner .banner-content {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}



section.hero-banner .button {
   background-color: #7A5085;
   color: #fff;
   padding: 10px 20px; 
   border: none;
   cursor: pointer;
   display: inline-block;
   text-transform: uppercase;
   font-size: bold;
   text-decoration: none;
   border-radius: 70px;
}

section.hero-banner p {
   color: #6b3a76;
   font-size: 1.2em;
}

/* Products section menu */
section.products {
   padding: 50px 20px;
   text-align: center;
}

section.products h2 {
   font-size: 2em;
   margin-bottom: 20px;
   color: #6a1b9a;
}

section.products .product-images {
   display: flex;
   justify-content: space-between;
   gap: 20px;
   flex-wrap: nowrap;
   overflow-x: auto;
}

section.products .product-thumbnail {
   text-align: center;
   flex: 0 0 auto;
}

section.products .product-thumbnail img {
   width: 150px;
   height: 150px;
   border-radius: 10px;
}

section.products .product-thumbnail p {
   margin-top: 10px;
   font-size: 1.1em;
   color: #6a1b9a;
}

/* About section */
section.about {
   background-color: #f8e7fc;
   padding: 50px 20px;
   text-align: center;
}

section.about h1 {
   font-size: 2em;
   color: #6a1b9a;
}

section.about p {
   max-width: 600px;
   margin: 20px auto;
   line-height: 1.6em;
   color: #333;
}

section.about .order-image img {
   width: 40%;
   height: 40%;
   border-radius: 30%;
   margin-bottom: 20px;
}

.about .button {
   display: inline-block;
   background-color: #7A5085;
   color: white;
   padding: 10px 20px;
   text-decoration: none;
   border-radius: 70px;
   font-weight: bold;
}
/* Footer */
.footer {
   background-color: #7A5085;
   color: white;
   padding: 20px;
   display: flex;
   justify-content: space-between;
   align-items: center;
}

.footer a {
   color: white;
   text-decoration: none;
   margin: 5px 0;
}

.footer a:hover {
   text-decoration: underline;
}

.quick-links,
.social-links,
.google-maps,
.copyright {
   flex: 1;
}

/* Quick links styling */
.quick-links {
   display: flex;
   flex-direction: column;
}

.quick-links a {
   margin-bottom: 10px;
}

/* Social links styling */
.footer-contact {
   font-weight: bold;
   margin-bottom: 10px;
}

.footer-social-icons {
   display: flex;
   justify-content: space-between;
   width: 150px;
}

.footer-social-icons img {
   width: 24px;
   height: 24px;
}

/* Google Maps styling */
.google-maps-footer {
   width: 200px;
   height: auto;
   border-radius: 30px;
}

/* Copyright styling */
.footer-copyright {
   font-size: 12px;
   text-align: center;
   flex-basis: 100%;
   margin-top: 20px;
}

/* Responsive design */
@media (max-width: 768px) {
   .footer {
       flex-direction: column;
       text-align: center;
   }

   .quick-links,
   .social-links,
   .google-maps {
       margin-bottom: 20px;
   }

   .footer-social-icons {
       margin: 0 auto;
   }
}