The first commented line is your dabblet’s title

dabblet.css

/**
 * The first commented line is your dabblet’s title
 http://codepen.io/anon/pen/KjhJt
 */

*{margin:0;padding:0;}
html{
height:450px;
background:linear-gradient(#9162D8,#382A99) no-repeat;
font:.8em sans-serif;
color:#111;
color:#eee;
text-shadow:0 -1px 0 rgba(0,0,0,.7);
}
ul{
/*display:table;border-spacing:20px;*/
margin:100px auto;
width:500px;height:160px;
perspective:500;
perspective-origin:50% 80px;
}
ul li{
margin-left:-15px;
box-sizing:border-box;
position:relative;
z-index:60;
background-color:#111;
background-image:linear-gradient(rgba(255,255,255,.1),rgba(255,255,255,0));
width:115px;height:165px;padding:10px;
list-style:none;text-align:center;
/*display:table-cell;*/
display:inline-block;
transform-origin:50% 50%;
transform:rotateY(45deg);
transition: all .5s;
border-radius:2px;
box-shadow:0 1px 0 rgba(255,255,255,.4) inset,
-5px 0px 5px -5px rgba(0,0,0,.8);

/*box-shadow:0 0 0px 3px rgba(255,255,255,.2);*/
}
ul li a.prix{
position:absolute;
bottom:5px;right:5px;
color:white;
text-decoration:none;
text-align:center;
font-size:1.1em;
padding:.5em;
border-radius:2px;
background-color:#222;
background-image:linear-gradient(rgba(255,255,255,.1),rgba(255,255,255,0));
transition: background-color 1s;
}
ul li img{
width:100%;
height:auto;
}
ul li:nth-child(3){
transform:rotateY(0) scale(1.22);
box-shadow:
0 1px 0 rgba(255,255,255,.4) inset, 
0 2px 10px rgba(0,0,0,.8),
0 15px 20px -10px rgba(0,0,0,.3);
background-color:#222;
}
ul li:nth-child(3) a.prix{
background-color:#09C;
}
ul:not(:hover) li:nth-child(3) ~ li{
transform:rotateY(-45deg);
/*background:green;*/
z-index:50;
box-shadow:0 1px 0 rgba(255,255,255,.4) inset,
5px 0px 5px -5px rgba(0,0,0,.8);
}
ul:not(:hover) li ~ li:last-child,
ul:hover li:hover ~ li:last-child{
z-index:40;
}
ul:hover li{
transform: rotateY(45deg);
box-shadow:0 1px 0 rgba(255,255,255,.4) inset,
-5px 0px 5px -5px rgba(0,0,0,.8);
background-color:#111;
/*background:blue;*/
}
ul:hover li a.prix{
background-color:#222;
}
ul:hover li:hover{
transform: rotateY(0) scale(1.22);
z-index:60;
box-shadow:
0 1px 0 rgba(255,255,255,.4) inset, 
0 2px 10px rgba(0,0,0,.8),
0 15px 20px -10px rgba(0,0,0,.3);
background-color:#222;
/*background:yellow;*/
}
ul:hover li:hover a.prix{
background-color:#09C;
}
ul:hover li:hover ~ li{
transform: rotateY(-45deg);
z-index:50;
box-shadow:0 1px 0 rgba(255,255,255,.4) inset,
5px 0px 5px -5px rgba(0,0,0,.8);
}

dabblet.html

<ul>
<li>
	<a href="http://www.spreadshirt.fr/html5-C4408A22159437/vp/22159437T6A17PC114218776PA4X7Y93#/detail/22159437T6A17PC114218776PA4X7Y93"><img src="http://image.spreadshirt.net/image-server/v1/products/106473196/views/1,width=200,height=200.png" alt="Tee shirt HTML5"/></a>
	#HTML5?!
	<a href="http://www.spreadshirt.fr/html5-C4408A22159437/vp/22159437T6A17PC114218776PA4X7Y93#/detail/22159437T6A17PC114218776PA4X7Y93" class="prix">19,40€</a>
</li><!--
--><li>
	<a href="http://www.spreadshirt.fr/css3-C4408A22159488/vp/22159488T6A389PC114219080PA4X25Y91S91#/detail/22159488T6A389PC114219080PA4X25Y91S91"><img src="http://image.spreadshirt.net/image-server/v1/products/106473235/views/1,width=200,height=200.png" alt="Tee shirt HTML5"/></a>
	#CSS3?!
	<a href="http://www.spreadshirt.fr/css3-C4408A22159488/vp/22159488T6A389PC114219080PA4X25Y91S91#/detail/22159488T6A389PC114219080PA4X25Y91S91" class="prix">19,40€</a>

</li><!--
--><li>
	<a href="http://www.spreadshirt.fr/html5-C4408A22159522"><img src="http://image.spreadshirt.net/image-server/v1/products/106459034/views/1,width=200,height=200.png" alt="Tee shirt HTML5"/></a>
	#HTML5?!
	<a href="http://www.spreadshirt.fr/html5-C4408A22159522" class="prix">27,40€</a>
</li><!--
--><li>
	<a href="http://www.spreadshirt.fr/css3-C4408A22159463"><img src="http://image.spreadshirt.net/image-server/v1/products/106458696/views/1,width=200,height=200.png" alt="Tee shirt HTML5"/></a>
	#CSS3?!
	<a href="http://www.spreadshirt.fr/css3-C4408A22159463" class="prix">23,40€</a>
</li><!--
--><li>
	<a href="http://www.spreadshirt.fr/html5-C4408A22159437"><img src="http://image.spreadshirt.net/image-server/v1/products/106458529/views/1,width=200,height=200.png" alt="Tee shirt HTML5"/></a>
	#HTML5?!
	<a href="http://www.spreadshirt.fr/html5-C4408A22159437" class="prix">23,40€</a>
</li>
</ul>

settings.json

{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}