html,body{
  height:100%;
  margin:0;
  padding:0;
  background: linear-gradient(to bottom, #d2b4f9, #f9b4c0);
  }

.bg{
  background-image:url('wall.jpg');
  background-position: center;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  height:100vh;
  width: 100%;
}


.sky-container {
  position: relative; 
  width: 100%;
  min-height: 100vh;
  background: linear-gradient(to bottom, #d2b4f9, #f9b4c0);
  background-attachment: fixed;
  overflow: hidden; 
}


.pixel-art {
  position: absolute;
  image-rendering: pixelated; 
}


.moon {
  top: 5%;
  left: 44%;
  width: 180px; 
  filter: brightness(125%);
  opacity:2;
}

.cloud-1 {
  top: 12%;
  left: 1%;
  width: 200px;
  opacity:0.8;
}

.cloud-2 {
  top: 6%;
  left: 15%;
  width: 190px;
  opacity:0.7;
}

.cloud-3 {
  top: 7%;
  left: 25%;
  width: 295px;
}

.cloud-4 {
  top: 7%;
  left: 55%;
  width: 200px;
}

.cloud-5 {
  top: 15%;
  left: 75%;
  width: 123px;
  opacity:0.8;
}

.cloud-6 {
  top: 10%;
  left: 85%;
  width: 110px;
  opacity:0.6;
}

.heart-handle {
  filter: brightness(120%);
  }



.cat {
  bottom: 0;
  left: 0;
  width: 160px;
  filter: brightness(120%);
}

.flower-l {
  bottom: 0;
  left: 20%;
  width: 80px;
  filter: brightness(125%);
  opacity:0.7;
}

.flower-r {
  bottom: 0;
  right: 20%;
  width: 80px;
  filter: brightness(125%);
    transform: scaleX(-1);
    opacity:0.7;
}

.mushroom {
  bottom: 0;
  right: 3%;
  width: 100px;
}