JSFiddle - React, Tailwind, and code Playground

by Jon Eyrick

HTML

<div class=logo><ul class=cube-inner><li class=front></li><li class=back></li><li class=right></li><li class=left></li><li class=top></li><li class=bottom></li></ul><ul class=cube><li class=front></li><li class=back></li><li class=right></li><li class=left></li><li class=top></li><li class=bottom></li><li class=floor></li></ul></div><div class=name>NextLocal</div><div class=tagline>Local Search</div>

CSS

@import url(http://fonts.googleapis.com/css?family=Averia+Sans+Libre:400,700|Ubuntu+Mono:400,700|Kreon:400,700|Roboto:700);@-moz-keyframes slowspin {
	0% {
		-webkit-transform: rotateX(-33.5deg)rotateY(45deg);
		-moz-transform: rotateX(-33.5deg)rotateY(45deg);
		-o-transform: rotateX(-33.5deg)rotateY(45deg);
		-ms-transform: rotateX(-33.5deg)rotateY(45deg);
		transform: rotateX(-33.5deg)rotateY(45deg)
	}

	10%,100% {
		-webkit-transform: rotateX(-33.5deg)rotateY(225deg);
		-moz-transform: rotateX(-33.5deg)rotateY(225deg);
		-o-transform: rotateX(-33.5deg)rotateY(225deg);
		-ms-transform: rotateX(-33.5deg)rotateY(225deg);
		transform: rotateX(-33.5deg)rotateY(225deg)
	}
}

@-webkit-keyframes slowspin {
	0% {
		-webkit-transform: rotateX(-33.5deg)rotateY(45deg);
		-moz-transform: rotateX(-33.5deg)rotateY(45deg);
		-o-transform: rotateX(-33.5deg)rotateY(45deg);
		-ms-transform: rotateX(-33.5deg)rotateY(45deg);
		transform: rotateX(-33.5deg)rotateY(45deg)
	}

	10%,100% {
		-webkit-transform: rotateX(-33.5deg)rotateY(225deg);
		-moz-transform: rotateX(-33.5deg)rotateY(225deg);
		-o-transform: rotateX(-33.5deg)rotateY(225deg);
		-ms-transform: rotateX(-33.5deg)rotateY(225deg);
		transform: rotateX(-33.5deg)rotateY(225deg)
	}
}

@-o-keyframes slowspin {
	0% {
		-webkit-transform: rotateX(-33.5deg)rotateY(45deg);
		-moz-transform: rotateX(-33.5deg)rotateY(45deg);
		-o-transform: rotateX(-33.5deg)rotateY(45deg);
		-ms-transform: rotateX(-33.5deg)rotateY(45deg);
		transform: rotateX(-33.5deg)rotateY(45deg)
	}

	10%,100% {
		-webkit-transform: rotateX(-33.5deg)rotateY(225deg);
		-moz-transform: rotateX(-33.5deg)rotateY(225deg);
		-o-transform: rotateX(-33.5deg)rotateY(225deg);
		-ms-transform: rotateX(-33.5deg)rotateY(225deg);
		transform: rotateX(-33.5deg)rotateY(225deg)
	}
}

@-ms-keyframes slowspin {
	0% {
		-webkit-transform: rotateX(-33.5deg)rotateY(45deg);
		-moz-transform: rotateX(-33.5deg)rotateY(45deg);
		-o-transform:...