
.cptch_img:hover {
	cursor: default;
	position: relative;
	z-index: 10;
	-webkit-transition: 300ms ease-in-out;
	-moz-transition: 300ms ease-in-out;
	-o-transition: 300ms ease-in-out;
	transition: 300ms ease-in-out;
}
.cptch_left:hover {
	/* move to the right and increase the size of image */
	-webkit-transform: translateX(100%) scale(3, 3);
	-moz-transform: translateX(100%) scale(3, 3);
	-o-transform: translateX(100%) scale(3, 3);
	-ms-transform: translateX(100%) scale(3, 3);
	transform: translateX(100%) scale(3, 3);
}
.cptch_right:hover {
	/* move to the left and increase the size of image */
	-webkit-transform: translateX(-100%) scale(3, 3);
	-moz-transform: translateX(-100%) scale(3, 3);
	-ms-transform: translateX(-100%) scale(3, 3);
	-o-transform: translateX(-100%) scale(3, 3);
	transform: translateX(-100%) scale(3, 3);
}
.cptch_center:hover {
	/* increase the size of image */
	-webkit-transform: scale(3, 3);
	-moz-transform: scale(3, 3);
	-o-transform: scale(3, 3);
	-ms-transform: scale(3, 3);
	transform: scale(3, 3);
}
.cptch_reload_button:hover {
	cursor:pointer;
	opacity: 0.7;

	-webkit-animation-name: spin;
	-webkit-animation-duration: 800ms;
	-webkit-animation-timing-function: linear;
	-webkit-transform-origin: 50% 50%;

	-moz-animation-name: spin;
	-moz-animation-duration: 800ms;
	-moz-animation-timing-function: linear;
	-moz-transform-origin: 50% 50%;
	
	-ms-animation-name: spin;
	-ms-animation-duration: 800ms;
	-ms-animation-timing-function: linear;
	-ms-transform-origin: 50% 50%;

	-o-animation-name: spin;
	-o-animation-duration: 800ms;
	-o-animation-timing-function: linear;
	-o-transform-origin: 50% 50%;

	animation-name: spin;
	animation-duration: 800ms;
	animation-timing-function: linear;
	transform-origin: 50% 50%;
}
/* rotation with resizing */
@-webkit-keyframes spin {
	from { -webkit-transform: rotate(0deg) scale(1, 1); }
	50% { -webkit-transform: rotate(180deg) scale(1.3, 1.3); }
	to { -webkit-transform: rotate(360deg) scale(1, 1); }
}
@-moz-keyframes spin {
	from { -moz-transform: rotate(0deg) scale(1, 1); }
	50% { -moz-transform: rotate(180deg) scale(1.3, 1.3); }
	to { -moz-transform: rotate(360deg) scale(1, 1); }
}
@-ms-keyframes spin {
	from { -ms-transform: rotate(0deg) scale(1, 1); }
	50% { -ms-transform: rotate(180deg) scale(1.3, 1.3); }
	to { -ms-transform: rotate(360deg) scale(1, 1); }
}
@-o-keyframes spin {
	from { -o-transform: rotate(0deg) scale(1, 1); }
	50% { -o-transform: rotate(180deg) scale(1.3, 1.3); }
	to { -o-transform: rotate(360deg) scale(1, 1); }
}
@keyframes spin {
	from { transform: rotate(0deg) scale(1, 1); }
	50% { transform: rotate(180deg) scale(1.3, 1.3); }
	to { transform: rotate(360deg) scale(1, 1); }
}
