Screensavers FTW

by Ronny

HTML

<div><div><div><div><div><div><div><div><div><div><div><div><div><div><div><div>

CSS

body {padding-top: 5em;}
div {
    padding: 1em; width: 90%; height: 90%; background: rgba(0,40,80,0.2);
    -moz-border-radius: 80% 300%; 
    -webkit-border-radius: 80% 300%;
    -moz-transform: rotate(14.3deg);
    -webkit-transform: rotate(14.3deg);
}

div:hover {
    -moz-transform: rotate3d(1,1,0, 45deg);
    -webkit-transform: rotate3d(1,1,0, 45deg); 
    transform: rotate3d(1,1,0, 45deg);
    -webkit-transition: all 1.5s ease-in-out;
    -webkit-perspective: 700;
}