body {
  background-image: url("assets/images/bg1.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
}

.container {
  width: 900px;
  height: 647px;
  padding: 40px;
  border: 4px solid rgba(151, 151, 151, 0.2);
  text-align: center;
  box-sizing: border-box;
  border-radius: 10px;
  color: #ffffff;
  transform: translate(0%, 0%);
  background-color: rgba(255, 237, 237, 0.9);
}

p {
  font-family: url("fonts/!!!%20Handwritingg%20_3.ttf.ttf");
  font-size: 12px;
}

.panty {
  position: absolute;
  top: -25%;
  left: -13%;
  width: 27%;
  height: auto;
  pointer-events: none;
  z-index: 100;
}

.wings1 {
  position: absolute;
  top: -27%;
  left: -18%;
  width: 35%;
  height: auto;
  pointer-events: none;
  transform: rotate(10deg);
  z-index: 10;
}

.stocking {
  position: absolute;
  bottom: -6%;
  right: -8%;
  width: 22%;
  height: auto;
  pointer-events: none;
  z-index: 221;
}

.wings {
  position: absolute;
  bottom: 0%;
  right: -15%;
  width: 39%;
  height: auto;
  pointer-events: none;
  transform: rotate(12deg);
  z-index: 99;
}

.popout {
  position: absolute;
  top: -27%;
  left: 88%;
  width: 33%;
  height: auto;
  z-index: 10;
  animation: move2 0.7s steps(4) infinite alternate;
}

@keyframes move2 {
  from {
    transform: rotate(5deg);
  }
  to {
    transform: rotate(-22deg);
  }
}

.musicnote {
  position: absolute;
  top: 73%;
  left: -14%;
  width: 28%;
  transform: rotate(-10deg);
  height: auto;
  pointer-events: none;
  z-index: 10;
  animation: move 0.7s steps(3) infinite alternate;
}

@keyframes move {
  from {
    transform: rotate(5deg);
  }
  to {
    transform: rotate(-32deg);
  }
}

.me {
  position: absolute;
  top: -21%;
  left: 85%;
  width: 39%;
  height: auto;
  pointer-events: none;
  z-index: 10;
  animation: move2 1s steps(3) infinite alternate;
}

@keyframes move2 {
  from {
    transform: rotate(5deg);
  }
  to {
    transform: rotate(-5deg);
  }
}

.pbox {
  position: absolute;
  top: 50%;
  left: 48%;
  width: auto;
  height: auto;
  pointer-events: none;
  transform: rotate(-3deg);
  z-index: 10;
}

.gob {
  position: absolute;
  top: 67%;
  left: 51%;
  width: auto;
  height: auto;
  z-index: 50;
  transition: transform 0.3s ease; 
}

.gob:hover {
  transform: scale(1.2); 
}

.sbox {
  position: absolute;
  top: 50%;
  left: 17%;
  width: auto;
  height: auto;
  pointer-events: none;
  transform: rotate(-3deg);
  z-index: 10;
}

.enter {
  position: absolute;
  top: 67%;
  left: 23%;
  width: auto;
  height: auto;
  z-index: 50;
  transition: transform 0.3s ease; 
}

.enter:hover {
  transform: scale(1.2); 
}

body.box {
  margin: 0;
  height: 104vh;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #ffffff;
}

/* Start https://www.cursors-4u.com */
* {
  cursor: url(https://cur.cursors-4u.net/cursors/cur-3/cur243.ani),
    url(https://cur.cursors-4u.net/cursors/cur-3/cur243.png), auto !important;
}
/* End https://www.cursors-4u.com */