header {
	position: relative;
}
section header {
	border-bottom: 0;
}
section header h2 {
	border-bottom: 1px solid #3c8243;
}
.nav li {
	float: left;
	margin-right: 2em;
}
.book {
	max-width: 800px;
	margin: 0 auto 20px;
}
.book .column {
	display: inline-block;
	width: 48%;
	vertical-align: top;
}
.book .column:nth-child(2) {
	margin-left: 2.5%;
}
.book .cover {
	display: block;
	position: relative;
}
#fcover {
	width: 100%;
}
#bcover {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}
#fcover {
	transform: rotateY(0deg) translateX(0px);
	transition: 1s ease-out 1s;
}
#bcover {
	transform: rotateY(90deg) translateX(0px);
	transition: 1s ease-in;
}
.cover:hover #fcover {
	transform: rotateY(90deg) translateX(0px);
	transition: 1s ease-in;
}
.cover:hover #bcover {
	transform: rotateY(0deg) translateX(0px);
	transition: 1s ease-out 1s;
}
ul + .legend,
.quicklinks {
	clear: both;
}
.legend,
.quicklinks li {
	float: left;
	width: 47%;
	margin-right: 3%;
}
.quicklinks img {
	width: 16px;
}
.feature {
	border: 0;
}
.anim, .back, .music {
	position: absolute;
	top: 0;
	width: 24px;
	height: 32px;
	color: transparent;
	text-indent: 999px;
	overflow: hidden;
}
.anim {
	right: 32px;
}
.anim:after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	display: inline-block;
	width:24px;
	height: 32px;
	background: url(../img/dance-link.png) center no-repeat;
	animation-name: spin;
	animation-duration: 4s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
} 
@keyframes spin {
	from {
		transform: rotateY(0deg);
	}
	to {
		transform: rotateY(360deg);
	}
}
.back {
	right: 0px;
	background: url(../img/back.png) center no-repeat;
}
.music {
	right: 64px;
	overflow: visible;
}
.music:after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	display: inline-block;
	width:24px;
	height: 32px;
	background: url(../img/music-link.png) center no-repeat;
	animation-name: wiggle;
	animation-duration: 4s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
} 
@keyframes wiggle {
	from {
		transform: rotate(0deg);
	}
	25% {
		transform: rotate(15deg);
	}
	50% {
		transform: rotate(0deg);
	}
	75% {
		transform: rotate(-15deg);
	}
	to {
		transform: rotate(0deg);
	}
}
.dance {
	clear: both;
}
.dance .metadata {
	padding: 0em;
	list-style: none;
}
.dance .metadata li {
	float: left;
	padding: 0em 1em;
	border-left: 2px solid #3c8243;
}
.dance .metadata li:first-child {
	padding-left: 0em;
	border-left: none;
}
.dance table {
	width: 100%;
}
.dance table td:first-child {
	width: 10%;
}
.dance table td:last-child {
	width: 90%;
}
.wl1, .wl2, .wl3 {
	display: inline-block;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	opacity: 0.66;
}
.legend .wl1, .legend .wl2, .legend .wl3 {
	width: 24px;
	height: 24px;
	margin: 0 4px;
}
.wl1 {
	background-color: red;
}
.wl2 {
	background-color: green;
}
.wl3 {
	background-color: blue;
}
blockquote {
	margin: 1em 0em 1em 2em;
}
blockquote:before, blockquote:after {
	content: "";
}
@media screen and (max-width: 767px) {
	.legend,
	.quicklinks li {
		width: 100%;
	}
}