Trying to recreate the album gallery from http://www.tomwaits.com/albums/

dabblet.css

* {margin: 0; padding: 0;box-sizing: border-box;}

html {
	height: 100%;
	background: linear-gradient(-25deg, orange, royalblue);
	}

body {
	margin: 50px auto;
	width: 600px;
	text-align: center;
	}
	
/* Trying to recreate the album gallery from http://www.tomwaits.com/albums/ */

.tile {
	width: 160px;
	height: 160px;
	display: inline-block;
	box-shadow: 0 0 15px black, inset 0 0 145px black;
	transition: margin .3s;
	}
	
	.tile:hover {
		box-shadow: 0 0 15px black;
		}
	.tile:first-child:hover, .tile:nth-child(4):hover,
	.tile:nth-child(7):hover {
		transform: rotate(2deg) translate(-5px,-10px) scale(1.1,1.1);
		margin: 15px;
		}		
	.tile:nth-child(2):hover, .tile:nth-child(5):hover,
	.tile:nth-child(8):hover {
		transform: rotate(3deg) translate(-5px,-10px) scale(1.1,1.1);
		margin: 15px;
		}
	.tile:nth-child(3):hover, .tile:nth-child(6):hover,
	.tile:nth-child(9):hover {
		transform: rotate(-3deg) translate(-5px,-10px) scale(1.1,1.1);
		margin: 15px;
		}
	
		.tile:first-child:hover ~ .tile:nth-child(2),
		.tile:nth-child(2):hover ~ .tile:nth-child(3),
		.tile:nth-child(3):hover ~ .tile:nth-child(6),
		.tile:nth-child(4):hover ~ .tile:nth-child(5),
		.tile:nth-child(5):hover ~ .tile:nth-child(6),
		.tile:nth-child(6):hover ~ .tile:nth-child(8),
		.tile:nth-child(7):hover ~ .tile:nth-child(8),
		.tile:nth-child(8):hover ~ .tile:nth-child(9) {
			transform: rotate(12deg);
			}
		.tile:first-child:hover ~ .tile:nth-child(4),
		.tile:nth-child(2):hover ~ .tile:nth-child(4),
		.tile:nth-child(3):hover ~ .tile:nth-child(5),
		.tile:nth-child(4):hover ~ .tile:nth-child(7),
		.tile:nth-child(5):hover ~ .tile:nth-child(7),
		.tile:nth-child(5):hover ~ .tile:nth-child(9),
		.tile:nth-child(6):hover ~ .tile:nth-child(9) {
			transform: rotate(-8deg);
			}
		.tile:first-child:hover ~ .tile:nth-child(5),
		.tile:nth-child(2):hover ~ .tile:nth-child(5),
		.tile:nth-child(4):hover ~ .tile:nth-child(8),
		.tile:nth-child(5):hover ~ .tile:nth-child(8) {
			transform: rotate(6deg);
			}
		
		.tile:nth-child(2):hover ~ .tile:nth-child(3) {
			
			}
	
	
	
	
	
	
	
	
	
	
	
	

dabblet.html

<div class="tile"></div>
<div class="tile"></div>
<div class="tile"></div>
<div class="tile"></div>
<div class="tile"></div>
<div class="tile"></div>
<div class="tile"></div>
<div class="tile"></div>
<div class="tile"></div>

settings.json

{"view":"separate","fontsize":"100","seethrough":"1","prefixfree":"1","page":"result"}