body {
background-color: tan;
}


.smokum-regular {
  font-family: "Smokum", serif;
  font-weight: 400;
  font-style: normal;
}



h2 {
	margin: 0em;
	margin-top: 2em;
	margin-bottom: 0.75em;
	font-size:3em;
	font-weight:600;
	perspective: 1000px;
	transform-style: preserve-3d;
}


@keyframes flipUp {
	from {transform:rotateX(90deg);}
	to {transform:rotateX(0deg);}
}

@keyframes flipDown {
	to {transform:rotateX(-180deg);}
}


span {
	animation: flipUp 1s cubic-bezier(0.34, 1.56, 0.64, 1) both,
				flipDown 1s cubic-bezier(0.34, 1.56, 0.64, 1) 2.75s;
	transform-origin: 50% 70%;
}

	
span:nth-child(2) {
			margin-right: 0.45em;
			animation-delay: 0.2s, 2.95s;
	}
	
span:nth-child(3) {
			margin-right: 0.15em;
			animation-delay: 0.4s, 3.15s;
	}
	
span:nth-child(4) {
			margin-right: 0.15em;
			animation-delay: 0.6s, 3.35s;
	}
	
span:nth-child(5) {
			margin-right: 0.15em;
			animation-delay: 0.8s, 3.55s;
	}
	
span:nth-child(6) {
			margin-right: 0.15em;
			animation-delay: 1s, 3.75s;
	}