* {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

body {
	background-color: cyan;
}

h1, h2 {
	text-align: center;
}

li{
	background-color: white;
	font-family: sans-serif;
	font-size: 1vw;
	padding: 15px;
	margin: 50px;
	border: 3px solid black;
	display: inline-block;
	border-radius: 10%;
	box-shadow: 5px 5px 5px black;
}

li:hover {
	background-color: yellow;
	cursor: pointer;
}

li#scale-1:hover {
	transform: scale(0.2);
}

li#rotate-1:hover {
	transform: rotate(180deg);
}

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

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

li#scale-2:hover {
	transform: scale(4);
}

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

li#skew-2:hover {
	transform: skew(-50deg);
}

li#translate-2:hover {
	transform: translateX(-35px);
}

li#scale-3:hover {
	transform: scale(0.5);
}

li#rotate-3:hover {
	transform: rotate(-100deg);
}

li#skew-3:hover {
	transform: skewX(15deg)skewY(15deg);
}

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

li#scale-4:hover {
	transform: scale(2);
}

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

li#skew-4:hover {
	transform: skewY(35deg);
}

li#translate-4:hover {
	transform: translateY(50px);
}

li#scale-5:hover {
	transform: scale(0.75);
}

li#rotate-5:hover {
	transform: rotate(-80deg);
}

li#skew-5:hover {
	transform: skewY(75deg);
}

li#translate-5:hover {
	transform: translateX(20px);
}

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

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

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

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