html * {
	margin:0;
	padding:0;
	-webkit-font-smoothing:antialiased;
	font-family:'微软雅黑','Microsoft YaHei',Verdana,Helvetica,Arial,serif,sans-serife;
	font-size:14px;
}
body {
	color:#2d2d2d;
	background:#f2f1f1;
}
ul,ul li {
	list-style:none;
}
a:link {
	color:#2d2d2d;
	text-decoration:none;
}
a:visited {
	color:#2d2d2d;
	text-decoration:none;
}
a:hover {
	color:#09C;
	text-decoration:none;
}
a:active {
	color:#09C;
	text-decoration:none;
}
p {
	font-size:10px;
}
.main {
	width:100%;
	overflow:hidden;
	padding:20px;
}
.progress {
	width:400px;
	height:10px;
	margin:20px auto;
	overflow:hidden;
}
.progress span {
	display:block;
	width:0px;
	height:100%;
	color:#fff;
	font-size:10px;
	line-height:10px;
	text-align:right;
	background-color:#ddd;
	border-radius:10px;
}
.pro1 span {
	background-color:#0099CC;
	animation:move 1.5s ease-in-out forwards;
}
.pro1 span p {
	margin-right:10px;
}
.pro2 span {
	background-color:#008000;
	width:50%;
}
.pro3 span {
	background:linear-gradient(-45deg,#f00 25%,#ccc 0,#ccc 50%,#f00 0,#f00 75%,#ccc 0);
	background-size:10px 10px;
	width:40%;
	color:#000;
}
.pro4 span {
	background:linear-gradient(-45deg,#FF6D10 25%,#ddd 0,#ddd 50%,#FF6D10 0,#FF6D10 75%,#ddd 0);
	background-size:10px 10px;
	width:80%;
	animation:scroll 12s linear infinite;
}
@-webkit-keyframes move {
	from {
	width:0px;
}
to {
	width:30%;
}
}@-webkit-keyframes scroll {
	from {
	background-position:0 0;
}
to {
	background-position:100% 0
}
}