CSS3打造粒子模糊背景色块随机显示动画
由CSS3打造的粒子模糊背景色块随机显示动画效果全部代码
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<title>CSS3打造粒子模糊背景色块随机显示动画</title>
<style>
*, *::before, *::after {
box-sizing: border-box;
}
html {
background: radial-gradient(#222222, #000000);
background-attachment: fixed;
}
body {
margin: 0;
overflow: hidden;
text-align: center;
}
.container {
width: 80%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.light-1 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 3.15s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #40bf63;
}
.light-2 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 3.825s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bf9c40;
}
.light-3 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 1.71s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #7840bf;
}
.light-4 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 1.74s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bf9c40;
}
.light-5 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 3.515s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #9640bf;
}
.light-6 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 1.675s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bf4057;
}
.light-7 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 0.515s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #59bf40;
}
.light-8 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 4.855s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #407abf;
}
.light-9 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 2.435s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #40bf54;
}
.light-10 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 1.735s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #8f40bf;
}
.light-11 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 3.695s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #87bf40;
}
.light-12 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 2.455s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #404dbf;
}
.light-13 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 4.955s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #6140bf;
}
.light-14 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 0.675s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #6140bf;
}
.light-15 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 2.955s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #4091bf;
}
.light-16 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 4.125s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #40b8bf;
}
.light-17 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 2.765s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #4099bf;
}
.light-18 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 4.79s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #96bf40;
}
.light-19 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 3.195s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #61bf40;
}
.light-20 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 2.175s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #4082bf;
}
.light-21 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 4.9s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #8740bf;
}
.light-22 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 4.985s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bf7d40;
}
.light-23 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 3.33s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bf6640;
}
.light-24 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 0.205s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #40bfb0;
}
.light-25 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 0.67s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #40bfa8;
}
.light-26 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 3.27s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bf4047;
}
.light-27 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 1.05s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #40b8bf;
}
.light-28 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 3.09s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #40a8bf;
}
.light-29 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 4.015s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bf8540;
}
.light-30 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 2.955s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bf7540;
}
.light-31 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 2.105s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #40bf8a;
}
.light-32 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 2.995s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bd40bf;
}
.light-33 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 4.045s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bf4066;
}
.light-34 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 2.915s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #6140bf;
}
.light-35 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 0.195s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #40a8bf;
}
.light-36 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 2.75s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bf409c;
}
.light-37 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 0.315s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #9e40bf;
}
.light-38 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 2.32s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #52bf40;
}
.light-39 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 1.945s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #4240bf;
}
.light-40 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 1.465s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #8fbf40;
}
.light-41 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 4.64s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bf4040;
}
.light-42 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 2.69s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #a640bf;
}
.light-43 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 1.635s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #40bf45;
}
.light-44 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 3s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #40bf99;
}
.light-45 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 1.48s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bf4740;
}
.light-46 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 0.185s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bfba40;
}
.light-47 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 2.545s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #59bf40;
}
.light-48 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 2.985s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bfb340;
}
.light-49 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 0.545s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #9ebf40;
}
.light-50 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 3.805s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #40bf4d;
}
.light-51 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 3.305s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #40bf6b;
}
.light-52 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 4.18s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bf405e;
}
.light-53 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 0.95s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #52bf40;
}
.light-54 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 2.465s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #8740bf;
}
.light-55 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 0.345s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #87bf40;
}
.light-56 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 4.6s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #8040bf;
}
.light-57 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 1.02s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #5940bf;
}
.light-58 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 4.845s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #bf40ab;
}
.light-59 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 1.205s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #5240bf;
}
.light-60 {
position: relative;
display: inline-block;
width: 0;
height: 0;
margin: 30px;
background-color: rgba(255, 255, 255, 0);
opacity: 0;
animation: light 4s linear infinite;
animation-delay: 2.905s;
border-radius: 50%;
box-shadow: 0 0 40px 20px rgba(255, 255, 255, 0.5), 0 0 50px 40px #69bf40;
}
@keyframes light {
0% {
opacity: 0;
}
30% {
opacity: 0.5;
}
70% {
opacity: 0;
}
}
</style>
<script src="js/prefixfree.min.js"></script>
</head>
<body>
<div class='container'>
<span class='light light-1'></span>
<span class='light light-2'></span>
<span class='light light-3'></span>
<span class='light light-4'></span>
<span class='light light-5'></span>
<span class='light light-6'></span>
<span class='light light-7'></span>
<span class='light light-8'></span>
<span class='light light-9'></span>
<span class='light light-10'></span>
<span class='light light-11'></span>
<span class='light light-12'></span>
<span class='light light-13'></span>
<span class='light light-14'></span>
<span class='light light-15'></span>
<span class='light light-16'></span>
<span class='light light-17'></span>
<span class='light light-18'></span>
<span class='light light-19'></span>
<span class='light light-20'></span>
<span class='light light-21'></span>
<span class='light light-22'></span>
<span class='light light-23'></span>
<span class='light light-24'></span>
<span class='light light-25'></span>
<span class='light light-26'></span>
<span class='light light-27'></span>
<span class='light light-28'></span>
<span class='light light-29'></span>
<span class='light light-30'></span>
<span class='light light-31'></span>
<span class='light light-32'></span>
<span class='light light-33'></span>
<span class='light light-34'></span>
<span class='light light-35'></span>
<span class='light light-36'></span>
<span class='light light-37'></span>
<span class='light light-38'></span>
<span class='light light-39'></span>
<span class='light light-40'></span>
<span class='light light-41'></span>
<span class='light light-42'></span>
<span class='light light-43'></span>
<span class='light light-44'></span>
<span class='light light-45'></span>
<span class='light light-46'></span>
<span class='light light-47'></span>
<span class='light light-48'></span>
<span class='light light-49'></span>
<span class='light light-50'></span>
<span class='light light-51'></span>
<span class='light light-52'></span>
<span class='light light-53'></span>
<span class='light light-54'></span>
<span class='light light-55'></span>
<span class='light light-56'></span>
<span class='light light-57'></span>
<span class='light light-58'></span>
<span class='light light-59'></span>
<span class='light light-60'></span>
</div>
</body>
</html>
