@charset "utf-8";

ul { list-style-type: none; }
li {
	display: inline-block;
	margin: 20px;
}
li div {
	width: 200px;
	height: 200px;
	border: 1px solid #000;
}
.sample1 {
	background-image: -moz-linear-gradient(top, #fff 0%, #e20000 100%);
	background-image: -ms-linear-gradient(top, #fff 0%, #e20000 100%);
	background-image: -o-linear-gradient(top, #fff 0%, #e20000 100%);
	background-image: -webkit-linear-gradient(top, #fff 0%, #e20000 100%);
}
.sample2 {
	background-image: -moz-radial-gradient(center, circle cover, #fff 0%, #f37900 100%);
	background-image: -ms-radial-gradient(center, circle cover, #fff 0%, #f37900 100%);
	background-image: -o-radial-gradient(center, circle cover, #fff 0%, #f37900 100%);
	background-image: -webkit-radial-gradient(center, circle cover, #fff 0%, #f37900 100%);
}
.sample3 {
	background-image: -moz-repeating-linear-gradient(top, #fff, #eeee00 20px, #eeee00 20px, #fff 40px);
	background-image: -ms-repeating-linear-gradient(top, #fff, #eeee00 20px, #eeee00 20px, #fff 40px);
	background-image: -o-repeating-linear-gradient(top, #fff, #eeee00 20px, #eeee00 20px, #fff 40px);
	background-image: -webkit-repeating-linear-gradient(top, #fff, #eeee00 20px, #eeee00 20px, #fff 40px);
}
.sample4 {
	background-image: -moz-repeating-radial-gradient(center, #fff, #64c700 20px, #64c700 20px, #fff 40px);
	background-image: -ms-repeating-radial-gradient(center, #fff, #64c700 20px, #64c700 20px, #fff 40px);
	background-image: -o-repeating-radial-gradient(center, #fff, #64c700 20px, #64c700 20px, #fff 40px);
	background-image: -webkit-repeating-radial-gradient(center, #fff, #64c700 20px, #64c700 20px, #fff 40px);
}