Untitled

dabblet.css

body {background-color: orange}
.zoom {
background-image: url(data:image/png;base64,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);
background-repeat: no-repeat;
height: 150px;
width: 150px;
-webkit-transition: -webkit-transform 2s ease-in-out;
-webkit-transform: scale(.7)}

.zoom-out {
background-position: bottom;
position: relative;
margin-top: -151px;
opacity: 0;
}

.zoom:hover {
-webkit-transform: rotate(45deg);

}

dabblet.html

<div>
<div class="zoom"></div>
<div class="zoom zoom-out"></div>
</div>

settings.json

{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}