@charset "utf-8";
/* CSS Document */
@keyframes warn {

50% {
transform: scale(0.5);
-webkit-transform: scale(0.5);
opacity: 0.0;
}

55% {
transform: scale(0.55);
-webkit-transform: scale(0.55);
opacity: 0.1;
}
60% {
transform: scale(0.6);
-webkit-transform: scale(0.6);
opacity: 0.2;
}
65% {
transform: scale(0.65);
-webkit-transform: scale(0.65);
opacity: 0.3;
}
70% {
transform: scale(0.7);
-webkit-transform: scale(0.7);
opacity: 0.4;
}
75% {
transform: scale(0.75);
-webkit-transform: scale(0.75);
opacity: 0.5;
}
80% {
transform: scale(0.8);
-webkit-transform: scale(0.8);
opacity: 0.4;
}
85% {
transform: scale(0.85);
-webkit-transform: scale(0.85);
opacity: 0.3;
}
90% {
transform: scale(0.9);
-webkit-transform: scale(0.9);
opacity: 0.2;
}
95% {
transform: scale(0.95);
-webkit-transform: scale(0.95);
opacity: 0.1;
}

}

@keyframes warn1 {

50% {
transform: scale(0.5);
-webkit-transform: scale(0.5);
opacity: 0.0;
}

55% {
transform: scale(0.525);
-webkit-transform: scale(0.525);
opacity: 0.1;
}
60% {
transform: scale(0.55);
-webkit-transform: scale(0.55);
opacity: 0.2;
}
65% {
transform: scale(0.575);
-webkit-transform: scale(0.575);
opacity: 0.3;
}
70% {
transform: scale(0.625);
-webkit-transform: scale(0.625);
opacity: 0.4;
}
75% {
transform: scale(0.65);
-webkit-transform: scale(0.65);
opacity: 0.5;
}
80% {
transform: scale(0.675);
-webkit-transform: scale(0.675);
opacity: 0.4;
}
85% {
transform: scale(0.7);
-webkit-transform: scale(0.7);
opacity: 0.3;
}
90% {
transform: scale(0.725);
-webkit-transform: scale(0.725);
opacity: 0.2;
}
95% {
transform: scale(0.75);
-webkit-transform: scale(0.75);
opacity: 0.1;
}

}


.smico-container {
position: relative;
width: 40px;
height: 40px;
	margin:0 auto;

}
/* 保持大小不变的小圆圈 */
.smicodot {
position: absolute;
width: 40px;
height: 40px;
left: 0;
top: 0;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
	box-shadow: 0px 0px 20px rgba(255,255,255,.5);
border-radius: 50%; 
z-index: 2;
	
}
/* 产生动画（向外扩散变大）的圆圈 第一个圆 */
.smicopulse {
position: absolute;
width: 80px;
height: 80px;
left: -20px;
top: -20px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
z-index: 1;
opacity: 0;
-webkit-animation: warn 2s ease-out;
-moz-animation: warn 2s ease-out;
animation: warn 2s ease-out;
-webkit-animation-iteration-count: infinite;
-moz-animation-iteration-count: infinite;
animation-iteration-count: infinite;
box-shadow: 1px 1px 30px #fff; /* 阴影效果 */
}
/* 产生动画（向外扩散变大）的圆圈 第二个圆 */
.smicopulse1 {
position: absolute;
width: 80px;
height: 80px;
left: -20px;
top: -20px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
z-index: 1;
opacity: 0;
-webkit-animation: warn1 2s ease-out;
-moz-animation: warn1 2s ease-out;
animation: warn1 2s ease-out;
-webkit-animation-iteration-count: infinite;
-moz-animation-iteration-count: infinite;
animation-iteration-count: infinite;
box-shadow: 1px 1px 30px #fff; /* 阴影效果 */
}