html,body {
	background:#000;
}
@keyframes ring_bound {
	from {
	left:40px;
	top:40px;
	width:10px;
	height:10px;
}
to {
	left:0px;
	top:0px;
	width:100px;
	height:100px;
}
}@keyframes beautiful_bound {
	from {
	left:20px;
	top:20px;
	width:10px;
	height:10px;
}
to {
	left:0px;
	top:0px;
	width:50px;
	height:50px;
}
}.shineCircle {
	width:40px;
	height:20px;
	border:1px solid rgba(18,220,232,.25);
	border-radius:50%;
	background:radial-gradient(rgba(1,49,96,0.3) 20%,rgba(1,49,96,1) 100%);
	position:absolute;
	left:30px;
	top:70px;
	/*//   transition:1s;
	*/
            animation:ring_bound5 2s linear infinite;
}
/*.shineCircle2 {
	*/
        /*    width:80px;
	*/
        /*    height:40px;
	*/
        /*    border:1px solid rgba(18,220,232,.25);
	*/
        /*    border-radius:50%;
	*/
        /*    background:radial-gradient(rgba(1,49,96,0.1) 30%,rgba(1,49,96,1) 100%);
	*/
        /*    position:absolute;
	*/
        /*    left:10px;
	*/
        /*    top:50px;
	*/
        /*    animation:ring_bound2 2s linear infinite;
	*/
        /*
}
*/
        @keyframes ring_bound5 {
	0% {
	left:25px;
	top:70px;
	width:50px;
	height:20px;
}
100% {
	left:20px;
	top:65px;
	width:60px;
	height:30px;
}
}@keyframes ring_bound2 {
	0% {
	left:15px;
	top:63px;
	width:70px;
	height:32px;
}
100% {
	left:10px;
	top:60px;
	width:80px;
	height:40px;
}
}@keyframes ring_bound3 {
	0% {
	left:10px;
	top:60px;
	width:80px;
	height:40px;
}
100% {
	left:0px;
	top:50px;
	width:100px;
	height:60px;
}
}.gis-live {
	width:200px;
	height:200px;
	position:relative;
	border:1px #000 solid;
}
.shineCircle2 {
	width:60px;
	height:30px;
	border:1px solid rgba(18,220,232,.25);
	border-radius:50%;
	background:radial-gradient(rgba(1,49,96,0.1) 30%,rgba(1,49,96,1) 100%);
	position:absolute;
	left:10px;
	top:40px;
	transition:1s;
	animation:ring_bound2 2s linear infinite;
}
.shineCircle3 {
	width:80px;
	height:40px;
	border:1px solid rgba(18,220,232,.25);
	border-radius:50%;
	/*background:radial-gradient(rgba(1,49,96,0.1) 30%,rgba(1,49,96,1) 100%);
	*/
            position:absolute;
	left:10px;
	top:40px;
	transition:1s;
	animation:ring_bound3 2s linear infinite;
}
.icon01 {
	height:37px;
	width:53px;
	background:url("images/icon01.png") no-repeat center;
	position:absolute;
	top:53px;
	left:35px;
	z-index:20;
}
.icon02 {
	height:60px;
	width:86px;
	background:url("images/iconBig.png") no-repeat center;
	position:absolute;
	top:10px;
	left:102px;
	z-index:20;
}
/**第二个图**/
.circle-02-con {
	width:300px;
	height:200px;
	border:0px #ccc solid;
	position:relative;
}
.circle01 {
	position:absolute;
	z-index:3;
	border-radius:50%;
	left:10px;
	top:60px;
	width:100px;
	height:50px;
	background:radial-gradient(rgba(1,49,96,0.1) 30%,rgba(1,49,96,1) 100%);
	animation:circle01 2s linear infinite;
}
.circle02 {
	position:absolute;
	z-index:2;
	border-radius:50%;
	left:10px;
	top:60px;
	width:100px;
	height:50px;
	background:radial-gradient(rgba(1,49,96,0.1) 30%,rgba(1,49,96,1) 100%);
	animation:circle02 2s linear infinite;
}
.circle03 {
	position:absolute;
	z-index:1;
	border:1px solid rgba(18,220,232,.25);
	border-radius:50%;
	left:10px;
	top:60px;
	width:100px;
	height:50px;
	/*box-shadow:10px 10px 10px rgba(1,49,96,1) inset;
	*/ background:radial-gradient(rgba(1,49,96,0.1) 50%,rgba(1,49,96,1) 100%);
	animation:circle03 2s linear infinite;
}
@keyframes circle01 {
	0% {
	left:100px;
	top:60px;
	width:100px;
	height:25px;
}
100% {
	left:80px;
	top:50px;
	width:120px;
	height:30px;
}
}@keyframes circle02 {
	0% {
	left:80px;
	top:60px;
	width:140px;
	height:30px;
}
100% {
	left:50px;
	top:50px;
	width:180px;
	height:38px;
}
}@keyframes circle03 {
	0% {
	left:70px;
	top:60px;
	width:160px;
	height:30px;
}
100% {
	left:30px;
	top:50px;
	width:220px;
	height:42px;
}
}