body{
  background-color: #1a1b1f;
}
.lanternContainer{
  position: relative;
  //border: 1px solid black;
  height: 325px;
  width: 220px;
  margin:auto;
  animation: bob 3s infinite;
  //animation-play-state: paused;
}
.lanternContainer:hover{
  animation-play-state: running;
}
.Lantern {
  position: relative;
  //border: 1px solid black;
  height: 325px;
  width: 220px;
  margin:auto;
  animation: sway 4s infinite;
  //animation-play-state: paused;
}
.Lantern:hover{
  animation-play-state: running;
}
.Glow {
  height: 200px;
  width: 150px;
  position: absolute;
  top: 65px;
  left: 30px;
  box-shadow: 0 0 300px #efc259;
  animation: flicker 0.2s infinite;
}
.Bottom {
		fill: url(#bottomGradient);
		position: absolute;
		width: 140px;
		height: 45px;
    bottom: 0px;
    left: 40px;
   }
.Top {
		fill: url(#topGradient);
    position: absolute;
		width: 140px;
		height: 45px;
    left: 40px;
	}
.lanternMain {
    fill: url(#lanternGradient);
		position: absolute;
		width: 220px;
		height: 240px;
    top: 43px;
	}
.Ridges {
    opacity: 0.4;
		fill: url(#Ridges);
		position: absolute;
		width: 220px;
		height: 240px;
    top: 43px;
	}
.leftSeam {
		opacity: 0.35;
		fill: rgba(166,0,0,1);
		position: absolute;
		width: 30px;
		height: 240px;
    top: 43px;
    left: 25px;
	}
.middleSeam {
    opacity: 0.35;
		fill: rgba(155,0,0,1);
		position: absolute;
		width: 10.px;
		height: 240px;
    top: 43px;
    left: 100px;
	}
.rightSeam {
    opacity: 0.35;
		fill: rgba(166,0,0,1);
		position: absolute;
		width: 30px;
		height: 240px;
    top: 43px;
    right: 25px;
	}
@keyframes flicker {
  50% {opacity: 0.95;}
}
@keyframes sway {
  0% {transform: rotate(3deg);}
  50% {transform: rotate(-3deg);}
  100% {transform: rotate(3deg);}
}
@keyframes bob {
  0% {top: 20px}
  50% {top: 50px}
  100% {top:20px}
}