*{ margin:0; padding:0;}
#ul1{ position:relative; margin:20px auto; background:#1b1f2b; border: 1px solid #70735B; overflow:hidden;}
#ul1 li{ list-style:none;}

body {
	font-family:STSong,华文宋体;
	background:url("../images/bg.png");
	position:center;
	background-size:cover;
	background-repeat:no-repeat;

  margin: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  min-height: 100vh;
}

.classScale {
	animation: scale 2s linear infinite normal;
}
.classScale1 {
	animation: scale1 2s 1s linear infinite normal;
}
.classScale2 {
	animation: scale2 2s 1s linear infinite normal;
}


@keyframes scale {
	0% {
		transform: scale(0);
		background:#ff0000;
	}
	10% {
		transform: scale(0.1);
		background:#ff1d1d;
	}
	20% {
		transform: scale(0.2);
		background:#ff3939;
	}
	30% {
		transform: scale(0.3);
		background:#ff5e5e
	}
	40% {
		transform: scale(0.4);
		background:#ff7d7d;
	}
	50% {
		transform: scale(0.5);
		background:#ff9c9c;
	}
	60% {
		transform: scale(0.6);
		background:#ffb3b3;
	}
	70% {
		transform: scale(0.7);
		background:#ffcece;
	}
	80% {
		transform: scale(0.8);
		background:#ffeeee;
	}
	100% {
		transform: scale(0.9);
		background:orange;
	}
}

@keyframes scale1 {
	0% {
		transform: scale(0);
		background:#ff0000;
	}
	10% {
		transform: scale(0.1);
		background:#ff1d1d;
	}
	20% {
		transform: scale(0.2);
		background:#ff3939;
	}
	30% {
		transform: scale(0.3);
		background:#ff5e5e
	}
	40% {
		transform: scale(0.4);
		background:#ff7d7d;
	}
	50% {
		transform: scale(0.5);
		background:#ff9c9c;
	}
	60% {
		transform: scale(0.6);
		background:#ffb3b3;
	}
	70% {
		transform: scale(0.7);
		background:#ffcece;
	}
	80% {
		transform: scale(0.8);
		background:#ffeeee;
	}
	100% {
		transform: scale(0.9);
		background:orange;
	}
}


@keyframes scale2 {
	0% {
		transform: scale(0.6);
		background:#ff0000;
		color:blue;
	}
	25% {
		transform: scale(0.7);
		background:#ffcece;
		color:gray;
	}
	50% {
		transform: scale(0.8);
		background:#ffeeee;
		color:red;
	}
	75% {
		transform: scale(0.9);
		background:orange;
		color:blue;
	}
	100% {
		transform: scale(1);
		background:orange;
		color:red;
	}
}

.box0{ width:70px; height:70px; background:url(../images/1.jpg) no-repeat; float:left;}
.box1{ width:70px; height:70px; background:url(../images/2.jpg) no-repeat; float:left;}
.box2{ width:70px; height:70px; background:url(../images/3.jpg) no-repeat; float:left;}
.box3{ width:70px; height:70px; background:url(../images/4.jpg) no-repeat; float:left;}
.box4{ width:70px; height:70px; background:url(../images/5.jpg) no-repeat; float:left;}
.box5{ width:70px; height:70px; background:url(../images/6.jpg) no-repeat; float:left;}