/* Reset default styles */
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  overflow: hidden; /* Prevent scrolling */
}

.background {
  background-image: url('7.jpg'); /* Set the single background image */
  background-size: cover; /* Ensures the background covers the entire screen */
  background-position: center; /* Centers the background image */
  background-repeat: no-repeat; /* Prevents tiling */
  width: 100%;
  height: 100%;
  filter: hue-rotate(0deg); /* Initial hue rotation */
  transition: filter 1s ease; /* Smooth transition for hue change */
}