html {
  min-width: 100%;
  min-height: 100%;
   background-image: linear-gradient(180deg, #ffcccc, #F189A4);
   cursor: url("cursor.png"), auto;
  }

body {
  cursor: url("cursor.png"), auto;
}
 h1 {
  margin: auto;
  font-size: 90px;
 color: #ff729c;
 font-family: NewYearNewDay;
 text-align: center;
 background-color: white;
 text-shadow: 1px 1px 0 #ab2650, 1px 1px 0 #ab2650, 1px 1px 0 #ab2650, 1px 1px 0 #ab2650;
 border-radius: 20px; 
 width: 900px;
 max-width: 90vw;
}
p {
  
  font-family: Strawberry Muffins;
  color: #D54C67;
  font-size: 20px;
    }
.particle {
      position: absolute;
      width: 20px;
      height: 20px;
      pointer-events: none;
      background-image: url('particles.png'); /* Replace with your image */
      background-size: cover;
      opacity: 1;
      transition: transform 1s ease-out, opacity 1s ease-out;
      }
  #sideMenu {
  height: 100%;
  width: 0; /* hidden by default */
  position: fixed;
  top: 0;
  left: 0;
  background-color: #f189a4;
  overflow-x: hidden;
  transition: 0.3s;
  padding-top: 60px;
  z-index: 1000;
}

#sideMenu a {
  padding: 10px 20px;
  display: block;
  color: white;
   background: linear-gradient(180deg, pink, beige);
      /* This is our CSS Linear Gradient for Text */
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      /* The above properties ensure text reveals the gradient*/
  font-family: Strawberry Muffins !important;
  font-size: 50px;
    text-decoration: none;
}

#menuBtn {
  position: fixed;
  top: 20px;
  left: 20px;
  z-index: 1001;
  font-size: 24px;
  background: pink;
  border: none;
  border-radius: 20px;
  padding: 10px;
  cursor: pointer;
  color: beige;
  font-family: Strawberry Muffins;
}