body {
  font-weight:800;
  color: red;
  font-family: 'Arial', sans-serif;
}

h3 {
  font-weight:100;
  color: black;
  font-family: 'Arial', sans-serif;
  text-align: center;
  Font-size: 25px
}
h1 {
  font-size: 100px;
  color: red;
  font-family: "Jacquard 12", system-ui;
  font-weight:600;
  font-style: normal;
  letter-spacing:30%;
  text-align: left;
  
}

h2 {
  font-size: 50px;
  color: red; 
  text-shadow:5px 5px LAVENDER;
  text-align: left;
  
}


body {
  background-image: url('lilypad photo.png');
  background-color: rgba(255, 255, 255, 0.1); /* 60% white overlay */
  background-blend-mode: lighten;
  background-position: center;
  /* Always provide a background color in case the image fails to load */
  background-attachment: fixed;
  background-repeat: repeat;
  background-size: 75vh;
}

.grid-card img {
      width: 100%;
      transition: transform 0.2s ease;
    }
        .grid-card img:hover {
      transform: scale(1.02);
      outline: 2px solid #ff00ff; /* Neon border on hover */
    }
    
    ul {
  padding-left: 0;
  margin-left: 0;
  list-style-position: inside; /* Keeps the bullets visible inside the container */
}
    
html {
  scroll-behavior: smooth;
}
.center-text {
  text-align: center;
}

.image-container {
  display: flex;
  flex-wrap: wrap;
  width: 100vw; /* Or width: 100vw; for full viewport width */
  
}

.snow-image {
  height: auto;
  width: auto;
}
  
  @media (max-width: 400px) {
  .snow-image {
    height: 25vw;
    width: 50vw;
  }
}

.stay-on-screen {
  position: fixed;   /* Keeps the image in place relative to the screen */
  bottom: 20px;      /* Places it 20 pixels from the bottom */
  right: 20px;       /* Places it 20 pixels from the right */
  width: 100px;      /* Set your desired width */
  z-index: 1000; 
  position: sticky;
  top: 0;
}
  
.sticky-right-image {
            position: fixed;   /* Keeps the image in a fixed position relative to the screen */
            right: 0;          /* Aligns the image tightly to the right edge */
            top: 10%;          /* Vertically centers the image */
            transform: translateY(-50%);
            transform: translateX(-150%);/* Ensures perfect vertical centering alignment */
            z-index: 1000;     /* Keeps the image on top of other content */
            max-width: 150px;  /* Limits the image size so it doesn't block the page */
            height: auto;      /* Maintains aspect ratio */
        } 
  
}