/* Background image for Hero Section */
#home {
  /* Replace with your own image */
  background-image: url('/assets/Images/BabyBackground.png');
  background-size: cover;
  background-position: center;
  background-attachment: fixed; /* Parallax effect for Hero section */
  color: white;
}

/* Background image for About Us */
#about {
  background-image: url('/assets/Images/BabyBackground.png'); /* Replace with your own image */
  background-size: cover;
  background-position: center;
  background-attachment: fixed; /* Parallax effect for About Us section */
  color: white;
}

/* Background image for Products Section */
#products {
  background-image: url('/assets/Images/BabyBackground.png'); /* Replace with your own image */
  background-size: cover;
  background-position: center;
  background-attachment: fixed; /* Parallax effect for Products section */
}

/* Background image for Why Choose Us */
#why-choose-us {
  background-image: url('/assets/Images/BabyBackground.png'); /* Replace with your own image */
  background-size: cover;
  background-position: center;
  background-attachment: fixed; /* Parallax effect for Why Choose Us section */
  color: white;
}

/* Background image for Contact Us */
#contact {
  background-image: url('/assets/Images/BabyBackground.png'); /* Replace with your own image */
  background-size: cover;
  background-position: center;
  background-attachment: fixed; /* Parallax effect for Contact Us section */
  color: white;
}

#testimonials {
  background-image: url('/assets/Images/BabyBackground.png'); /* Replace with your own image */
  background-size: cover;
  background-position: center;
  background-attachment: fixed; /* Parallax effect for Contact Us section */
  color: white;
}

/* Dark overlay to make text more readable */
.dark-overlay {
  background-color: rgba(73, 0, 0, 0.921);
  padding: 60px 0;
}

/* Styling buttons to have a white background and rounded shape */
.btn-primary {
  background-color: white !important; /* Change button color to white */
  color: #490000eb !important; /* Optional: Change text color to original button color */
  border-radius: 50px !important; /* Makes the button rounded */
  border: 1px solid #ff0000; /* Add a border for visibility */
  
}

.btn-primary:hover {
  background-color: #490000eb !important; /* Slightly darker shade on hover */
  color: rgba(255, 255, 255, 0.921) !important; /* Retain text color on hover */
  border: 1px solid #ff00003d; /* Add a border for visibility */
}