*{
	margin: 0;
	padding:0;
}

body{
	background-color: cadetblue;

}

li{
	font-family:"Comic Sans MS";
	font-size:3vw;
	padding: 20px;
	margin:40PX;
	display: inline-block;
	border: 5px solid black;
	border-color: yellow;
	border-radius: 10%;
	box-shadow: 5px 5px 5px black;
}

li:hover{
	cursor: pointer;
}

li#scale:hover{
	transform: scale(1.2);
	background-color: yellow;
}

li#rotate:hover{
	transform: rotate(45deg);
	background-color: yellow;
	}

li#skew:hover{
	transform: skew(15deg);
	background-color: yellow;
}

li#translate:hover{
	transform: translateX(100px)translateY(100px);
	background-color: yellow;
}




li#scale-2:hover{
	transform: scale(1.5);
	background-color: pink;
}

li#rotate-2:hover{
	transform: rotate(90deg);
	background-color: pink;
	}

li#skew-2:hover{
	transform: skew(30deg);
	background-color: pink;
}

li#translate-2:hover{
	transform: translateX(-100px)translateY(100px);
	background-color: pink;
}


li#scale-3:hover{
	transform: scale(2);
	background-color: red;
}

li#rotate-3:hover{
	transform: rotate(-45deg);
	background-color: red;
	}

li#skew-3:hover{
	transform: skew(-15deg);
	background-color: red;
}

li#translate-3:hover{
	transform: translateX(100px)translateY(-100px);
	background-color: red;
}



li#scale-4:hover{
	transform: scale(2.5);
	background-color: white;
}

li#rotate-4:hover{
	transform: rotate(180deg);
	background-color: white;
	}

li#skew-4:hover{
	transform: skew(90deg);
	background-color: white;
}

li#translate-4:hover{
	transform: translateX(50px)translateY(100px);
	background-color: white;
}



li#scale-5:hover{
	transform: scale(1.8);
	background-color: orange;
}

li#rotate-5:hover{
	transform: rotate(145deg);
	background-color: orange;
	}

li#skew-5:hover{
	transform: skew(10deg);
	background-color: orange;
}

li#translate-5:hover{
	transform: translateX(50px)translateY(50px);
	background-color: orange;
}



li#scale-6:hover{
	transform: scale(1.2);
	background-color: cyan;
}

li#rotate-6:hover{
	transform: rotate(75deg);
	background-color: cyan;
	}

li#skew-6:hover{
	transform: skew(20deg);
	background-color: cyan;
}

li#translate-6:hover{
	transform: translateX(38px)translateY(62px);
	background-color: cyan;
}