style.css

/* these are not necessary */

html {
    background-color:white;
    overflow:hidden;
}

body {
	background-color:white;
	margin:0;
    padding:0;
    width:100%;
    height:100%;
}

div {
    -webkit-tap-highlight-color:rgba(0,0,0,0);
}

#item1 {
	background-color:#fcc;
	position:absolute;
	left:50px;
	top:50px;
	width:300px;
	height:200px;
	border:1px solid red;
}

#item2 {
	background-color:#ccf;
	position:absolute;
	bottom:40px;
	right:40px;
	width:300px;
	height:200px;
	border:1px solid blue;
}

#item3 {
	background-color:#cfc;
	position:absolute;
	top:0px;
	right:100px;
	width:300px;
	height:200px;
	border:1px solid green;
	-webkit-transform: rotate(10deg) translate(0px,0px);
	-moz-transform: rotate(10deg) translate(0px,0px);
	-o-transform: rotate(10deg) translate(0px,0px);
}

#item3b {
	background-color:#cff;
	position:absolute;
	top:0px;
	left:0px;
	width:200px;
	height:100px;
	border:1px solid cyan;
	-webkit-transform: rotate(10deg) translate(200px,200px);
	-moz-transform: rotate(10deg) translate(200px,200px);
	-o-transform: rotate(10deg) translate(200px,200px);
}

#item2b {
	background-color:#99f;
	position:absolute;
	bottom:80px;
	right:80px;
	width:100px;
	height:100px;
	border:1px solid blue;
}

#item4 {
	background-color:#ffc;
	position:absolute;
	bottom:200px;
	left:200px;
	width:200px;
	height:200px;
	border:1px solid yellow;
	-webkit-transform: rotate(30deg) skew(20deg);
	-moz-transform: rotate(30deg) skew(20deg);
	-o-transform: rotate(30deg) skew(20deg);
}