* {
	margin: 0;
	padding: 0;
}

	body {
		background-color: red;
	}

	li {
		border: 4px solid black;
		float: left;
		border-radius: 10%;
		font-size: 25px;
		font-family: impact;
		padding: 7vh;
		margin: 10px;
		background-color: black;
		color: white;
		box-shadow: 5px 5px 5px grey;
	}

	li:hover {
		background-color: blue;
		cursor: pointer;
		font-size: 2vw;
		transform: scale(1.0);
	}

	li#scale:hover {
		font-size: 2vw;
		transform: scale(1.0);
	}

	li#rotate:hover {
		transform: rotate(45deg);
	}


	li#skew:hover {
		transform: skew(15deg);
	}

	li#translate:hover {
		transform: translateX(100px)translateY(100px);
	}



	li.scale2:hover {
		font-size: 2vw;
		transform: scale(2.0);
	}

	li.scaleX:hover {
		font-size: 2vw;
		transform: scale(2.5);
	}

	li.scaleY:hover {
		font-size: 2vw;
		transform: scale(3.0);
	}

	li.scaleZ:hover {
		font-size: 2vw;
		transform: scale(3.5);
	}

	li#rotate2:hover {
		transform: rotate(45deg);
	}

	li#rotateX:hover {
		transform: rotate(90deg);
	}

	li#rotateY:hover {
		transform: rotate(180deg);
	}
	
	li#rotateZ:hover {
		transform: rotate(360deg);
	}

	li.skewX:hover {
		transform: skew(15deg);
	}
	
	li.skewY:hover {
		transform: skew(30deg);
	}
	
	li.skew2:hover {
		transform: skewX(15deg) skewY(15deg);
	}

	li.skew3:hover {
		transform: skewX(30deg) skewY(30deg);
	}
	
	li.translate1:hover {
		transform: translateX(100px)translateY(100px)
	}
	
	li.translateX:hover {
		transform: translateX(200px)translateY(200px)
	}

		li.translateY:hover {
		transform: translateX(300px)translateY(300px)
	}

		li.translateZ:hover {
		transform: translateX(400px)translateY(400px)
	}