#message {
  opacity: 0.7;
  color: white;
  position: relative;
  font-size: 18pt;
  padding-top: 15%;
  margin-left: 15%;
  margin-right: 15%;}
#moths {
  position: absolute;
  left: 50%;
  transform: translate(-50%);
	animation-name: moth;
	animation-duration: 0.5s;}
#seal {
	animation-name: seal-of-solomon;
	animation-duration: 3s;}
#text {
	animation-name: quote;
	animation-duration: 12s;}
#hint {
	font-size: 12pt;
	color: #ffd11a;
	text-decoration: none;
	animation-name: hint;
	animation-duration: 900s;
	}
#hint:hover {
	text-decoration: underline;
	color: #fff0b3;}
	
@keyframes seal-of-solomon {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes quote {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes moth {
  0% {opacity: 0;}
  30% {opacity: 0;}
  90% {opacity: 1;}
  95% {opacity: 0.2;}
  100% {opacity: 0.7;}
  }
@keyframes hint {
  0% {display: none; opacity: 0; cursor: default;}
  75% {display: none; opacity: 0; cursor: default;}
  100% {display: block; opacity: 0.7; cursor: pointer;}
  }