body {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  margin: 0;
  background: #ffbf79;
  overflow: hidden;
}

#goblin {
  position: absolute;
  top: 45%;
  left: 48%;
  transform: translate(-50%, -50%);
  max-width: 80%;
  max-height: 80%;
}

#gift {
  position: absolute;
  bottom: 10%;
  left: 50%;
  transform: translate(-50%, 25%);
}

#gift img.box {
  position: relative;
  top: 0;
  left: 0;
  height: 300px;
  transition: all 500ms;
}

#gift img.flare {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
  opacity: 0;
  animation: spin 10s linear infinite;
  transition: all 200ms;
  user-select: none;
  height: 100px;
}

#gift:hover img.box {
  height: 400px;
}

#gift:hover img.flare {
  opacity: 0.5;
  height: 600px;
}

@keyframes spin {
  from {transform: translate(-50%, -50%) rotate(  0deg);}
    to {transform: translate(-50%, -50%) rotate(360deg);}
}