body {
  background: #2B7637;
  background: #144906;
}

.fairy {
  width: 300px;
  height: 300px;
  top: 50%;
  left: 50%;
  margin: -150px 0 0 -150px;
  position: absolute;
  perspective: 250px;
  -webkit-animation: flying 12s linear infinite;
          animation: flying 12s linear infinite;
}

.glow {
  width: 56px;
  height: 56px;
  top: 50%;
  left: 50%;
  margin: -28px 0 0 -28px;
  position: absolute;
  transform-style: preserve-3d;
  border-radius: 100px;
  background: radial-gradient(ellipse at center, white 0%, #fff0f0 35%, #ffcccc 50%, #f2949a 65%, #df7e84 100%);
}
.glow:after {
  content: "";
  width: 54px;
  height: 54px;
  top: 50%;
  left: 50%;
  margin: -27px 0 0 -27px;
  position: absolute;
  border-radius: 100px;
  -webkit-animation: pulse 1.5s ease-in-out infinite alternate;
          animation: pulse 1.5s ease-in-out infinite alternate;
}

.sparkle {
  height: 3px;
  width: 3px;
  background: #FFAFB1;
  position: absolute;
  border-radius: 100px;
  opacity: 0;
  z-index: 100;
}
.sparkle:nth-child(1) {
  top: -20px;
  left: 15px;
}
.sparkle:nth-child(2) {
  top: 3px;
  left: 60px;
}
.sparkle:nth-child(3) {
  top: 60px;
  left: 50px;
}
.sparkle:nth-child(4) {
  top: 68px;
  left: 16px;
}
.sparkle:nth-child(5) {
  top: 50px;
  left: 0px;
}

.sparkle:nth-child(1) {
  -webkit-animation: sparkling 0.8s ease-in-out 0.2s infinite;
          animation: sparkling 0.8s ease-in-out 0.2s infinite;
}

.sparkle:nth-child(2) {
  -webkit-animation: sparkling 0.8s ease-in-out 0.4s infinite;
          animation: sparkling 0.8s ease-in-out 0.4s infinite;
}

.sparkle:nth-child(3) {
  -webkit-animation: sparkling 0.8s ease-in-out 0.6s infinite;
          animation: sparkling 0.8s ease-in-out 0.6s infinite;
}

.sparkle:nth-child(4) {
  -webkit-animation: sparkling 0.8s ease-in-out 0.8s infinite;
          animation: sparkling 0.8s ease-in-out 0.8s infinite;
}

.sparkle:nth-child(5) {
  -webkit-animation: sparkling 0.8s ease-in-out 1s infinite;
          animation: sparkling 0.8s ease-in-out 1s infinite;
}

.wings {
  position: relative;
  top: 50%;
  left: 50%;
  width: 144px;
  height: 114px;
  margin: -87px 0 0 -72px;
}
.wings:before, .wings:after {
  content: "";
  width: 64px;
  height: 114px;
  top: 50%;
  left: 50%;
  margin: -57px 0 0 -72px;
  position: absolute;
  transform-origin: right;
  -webkit-animation: flapping-left 0.2s ease-in-out infinite;
          animation: flapping-left 0.2s ease-in-out infinite;
  background: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/85486/wing-left.svg") no-repeat;
}
.wings:after {
  left: auto;
  right: 50%;
  margin: -57px -72px 0 0;
  transform-origin: left;
  -webkit-animation: flapping-right 0.2s ease-in-out infinite;
          animation: flapping-right 0.2s ease-in-out infinite;
  background: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/85486/wing-right.svg") no-repeat;
}

@-webkit-keyframes pulse {
  0%, 100% {
    box-shadow: 0 0 20px 5px rgba(239, 145, 145, 0.9), 0 0 30px 20px rgba(195, 66, 102, 0.8);
  }
  50% {
    box-shadow: 0 0 30px 7px rgba(239, 145, 145, 0.9), 0 0 35px 22px rgba(195, 66, 102, 0.8);
  }
}

@keyframes pulse {
  0%, 100% {
    box-shadow: 0 0 20px 5px rgba(239, 145, 145, 0.9), 0 0 30px 20px rgba(195, 66, 102, 0.8);
  }
  50% {
    box-shadow: 0 0 30px 7px rgba(239, 145, 145, 0.9), 0 0 35px 22px rgba(195, 66, 102, 0.8);
  }
}
@-webkit-keyframes sparkling {
  0%, 100% {
    transform: scale3d(0, 0, 1);
    opacity: 0;
  }
  25%, 75% {
    opacity: 1;
  }
  50% {
    transform: scale3d(1, 1, 1);
    opacity: 0;
  }
}
@keyframes sparkling {
  0%, 100% {
    transform: scale3d(0, 0, 1);
    opacity: 0;
  }
  25%, 75% {
    opacity: 1;
  }
  50% {
    transform: scale3d(1, 1, 1);
    opacity: 0;
  }
}
@-webkit-keyframes flapping-left {
  0%, 100% {
    transform: rotateX(-15deg) rotateY(-45deg);
  }
  50% {
    transform: rotateX(-10deg) rotateY(-20deg);
  }
}
@keyframes flapping-left {
  0%, 100% {
    transform: rotateX(-15deg) rotateY(-45deg);
  }
  50% {
    transform: rotateX(-10deg) rotateY(-20deg);
  }
}
@-webkit-keyframes flapping-right {
  0%, 100% {
    transform: rotateX(-15deg) rotateY(45deg);
  }
  50% {
    transform: rotateX(-10deg) rotateY(20deg);
  }
}
@keyframes flapping-right {
  0%, 100% {
    transform: rotateX(-15deg) rotateY(45deg);
  }
  50% {
    transform: rotateX(-10deg) rotateY(20deg);
  }
}
@-webkit-keyframes flying {
  0% {
    transform: rotate(50deg) translateX(0px) rotate(-50deg) scale(0.75);
  }
  50% {
    transform: rotate(180deg) translateX(80px) rotate(-180deg) scale(0.9);
  }
  100% {
    transform: rotate(360deg) translateX(0px) rotate(-360deg) scale(0.75);
  }
}
@keyframes flying {
  0% {
    transform: rotate(50deg) translateX(0px) rotate(-50deg) scale(0.75);
  }
  50% {
    transform: rotate(180deg) translateX(80px) rotate(-180deg) scale(0.9);
  }
  100% {
    transform: rotate(360deg) translateX(0px) rotate(-360deg) scale(0.75);
  }
}