

/* main container */
.container{
	background:#fff;
	width:200px;
	position:absolute;
	left:45%;

}

.imageOverlayer{
	display:block;
	width:240px;
	height:160px;
	background:url("imageHover.png");
	position:absolute;
	cursor:pointer;
	opacity:0;
	filter:alpha(opacity=0); /* For IE8 and earlier */
	
	-webkit-transition: opacity 0.2s linear;
	-moz-transition: opacity 0.2s linear;
	-o-transition: opacity 0.2s linear;
	transition: opacity 0.2s linear;

}

.imageOverlayer:hover{
	opacity:0.9;
	filter:alpha(opacity=0.9);
}


.imageOverlayer2{
	display:block;
	width:240px;
	height:160px;
	background:#1e1e20;
	position:absolute;
	cursor:pointer;
	opacity:0;
	filter:alpha(opacity=0); /* For IE8 and earlier */
	
	-webkit-transition: opacity 0.2s linear;
	-moz-transition: opacity 0.2s linear;
	-o-transition: opacity 0.2s linear;
	transition: opacity 0.2s linear;

}

.imageOverlayer2:hover{
	opacity:0.5;
	filter:alpha(opacity=0.5);

}

.imageOverlayer3, .imageOverlayer4, .imageOverlayer5{
	cursor:pointer;
	
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	-ms-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;

}


.imageOverlayer3:hover{
	
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
	-ms-transform: rotateY(180deg);
	transform: rotateY(180deg);
}



.imageOverlayer4:hover{
	
	-webkit-transform: rotateX(180deg);
	-moz-transform: rotateX(180deg);
	-o-transform: rotateX(180deg);
	-ms-transform: rotateX(180deg);
	transform: rotateX(180deg);
}

.imageOverlayer5:hover{
	
	-webkit-transform: rotateZ(180deg);
	-moz-transform: rotateZ(180deg);
	-o-transform: rotateZ(180deg);
	-ms-transform: rotateZ(180deg);
	transform: rotateZ(180deg);
}