body {
	text-align: center;
	font-size: 14px;
}

.ninja {
    color: black;
    display: none;
}

#logo {
	margin: auto;
	width: 12em;
	height: 12em;
	
	-webkit-transform: translate(0, 4em) rotate(45deg);
	transform: translate(0, 4em) rotate(45deg);
}

#logo div {
	width: 1em;
	height: 1em;
	position: absolute;
	background-color: #333;
	
	-webkit-transform-origin: top left;
	transform-origin: top left;
}

#logo .f.v {
	-webkit-transform: translate(4em, 0) scale(2, 12);
	transform: translate(4em, 0) scale(2, 12);
}

#logo .f.h {
	-webkit-transform: translate(4em, 0) scale(8, 2);
	transform: translate(4em, 0) scale(8, 2);
}

#logo .f.h:nth-child(2) {
	-webkit-transform: translate(4em, 4em) scale(8, 2);
	transform: translate(4em, 4em) scale(8, 2);
}

#logo .r.v {
	background-color: #666;
	
	-webkit-transform: translate(7em, 7em) scale(2, 5);
	transform: translate(7em, 7em) scale(2, 5);
}

#logo .r.h {
	background-color: #666;
	
	-webkit-transform: translate(7em, 7em) scale(5, 2);
	transform: translate(7em, 7em) scale(5, 2);
}