/*
Revided Aug 20th 2015
	Border applied to image
	z-index negative allows buttons to float above.
Revised Apr 10th 2015
	The four transforms for the animations,
	Selected by setReflection() in knotscript.incl
*/

.rotation0, .rotation1, .rotation2, .rotation3 {
	position-relative;
	z-index:-1;
	border-style: solid; 
	border-width: 1px; 
	border-color: #000000;  
}

.rotation1 {									/* Flip Horizontal */
	-moz-transform: scaleX(-1);
	-o-transform: scaleX(-1);
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
	filter: FlipH;
	-ms-filter: "FlipH";
}

.rotation2 {									/* Flip Vertical */
	-moz-transform: scaleY(-1);
	-o-transform: scaleY(-1);
	-webkit-transform: scaleY(-1);
	transform: scaleY(-1);
	filter: FlipV;
	-ms-filter: "FlipV";
}

.rotation3 {									/* Rotate 180 degrees */
	-moz-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
	-ms-transform: rotate(180deg);
}