.wrap {
	width : 100px;
	height : 100px;
	margin : 0px auto;
	margin-top : 100px;
	position : relative;
	transition : all 0.2s linear 0s;
	-ms-transition : all 0.2s linear 0s;
	-moz-transition : all 0.2s linear 0s;
	-webkit-transition : all 0.2s linear 0s;
	-o-transition : all 0.2s linear 0s;
}
.div {
	width : 100%;
	height : 100%;
	position : absolute;
	top : 0px;
	left : 0px;
	transition : all 0.2s linear 0s;
	-ms-transition : all 0.2s linear 0s;
	-moz-transition : all 0.2s linear 0s;
	-webkit-transition : all 0.2s linear 0s;
	-o-transition : all 0.2s linear 0s;
}
.front {
	background-color : pink;
}
.back {
	background-color : yellow;
	opacity : 0;
	transform : rotateY(180deg);
	-webkit-transform : rotateY(180deg);
	-moz-transform : rotateY(180deg);
	-o-transform : rotateY(180deg);
	-ms-transform : rotateY(180deg);
}
.wrap:hover .front {
	opacity : 0;
	transform : rotateY(180deg);
	-webkit-transform : rotateY(180deg);
	-moz-transform : rotateY(180deg);
	-o-transform : rotateY(180deg);
	-ms-transform : rotateY(180deg);
}
.wrap:hover .back {
	opacity : 1;
	transform : rotateY(0deg);
	-webkit-transform : rotateY(0deg);
	-moz-transform : rotateY(0deg);
	-o-transform : rotateY(0deg);
	-ms-transform : rotateY(0deg);
}