div+css背景光芒照耀转动动画效果代码

代码语言:html

所属分类:背景

代码描述:div+css背景光芒照耀转动动画效果代码

代码标签: 照耀 转动 动画 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开


<!DOCTYPE html>
<html lang="en" >

<head>

  <meta charset="UTF-8">

<style>
html {
  height: 100%;
  background: #ffee00;
  overflow: hidden;
}

body {
  height: 100%;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
          justify-content: center;
  -webkit-box-align: center;
          align-items: center;
}

.line {
  position: absolute;
  top: 50%;
  left: -50%;
}

.lines0 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin0 10s linear infinite;
          animation: spin0 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(0deg);
          transform: rotateX(10deg) rotateZ(0deg);
}

.lines1 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin1 10s linear infinite;
          animation: spin1 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(3.6deg);
          transform: rotateX(10deg) rotateZ(3.6deg);
}

.lines2 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin2 10s linear infinite;
          animation: spin2 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(7.2deg);
          transform: rotateX(10deg) rotateZ(7.2deg);
}

.lines3 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin3 10s linear infinite;
          animation: spin3 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(10.8deg);
          transform: rotateX(10deg) rotateZ(10.8deg);
}

.lines4 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin4 10s linear infinite;
          animation: spin4 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(14.4deg);
          transform: rotateX(10deg) rotateZ(14.4deg);
}

.lines5 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin5 10s linear infinite;
          animation: spin5 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(18deg);
          transform: rotateX(10deg) rotateZ(18deg);
}

.lines6 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin6 10s linear infinite;
          animation: spin6 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(21.6deg);
          transform: rotateX(10deg) rotateZ(21.6deg);
}

.lines7 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin7 10s linear infinite;
          animation: spin7 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(25.2deg);
          transform: rotateX(10deg) rotateZ(25.2deg);
}

.lines8 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin8 10s linear infinite;
          animation: spin8 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(28.8deg);
          transform: rotateX(10deg) rotateZ(28.8deg);
}

.lines9 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin9 10s linear infinite;
          animation: spin9 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(32.4deg);
          transform: rotateX(10deg) rotateZ(32.4deg);
}

.lines10 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin10 10s linear infinite;
          animation: spin10 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(36deg);
          transform: rotateX(10deg) rotateZ(36deg);
}

.lines11 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin11 10s linear infinite;
          animation: spin11 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(39.6deg);
          transform: rotateX(10deg) rotateZ(39.6deg);
}

.lines12 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin12 10s linear infinite;
          animation: spin12 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(43.2deg);
          transform: rotateX(10deg) rotateZ(43.2deg);
}

.lines13 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin13 10s linear infinite;
          animation: spin13 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(46.8deg);
          transform: rotateX(10deg) rotateZ(46.8deg);
}

.lines14 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin14 10s linear infinite;
          animation: spin14 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(50.4deg);
          transform: rotateX(10deg) rotateZ(50.4deg);
}

.lines15 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin15 10s linear infinite;
          animation: spin15 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(54deg);
          transform: rotateX(10deg) rotateZ(54deg);
}

.lines16 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin16 10s linear infinite;
          animation: spin16 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(57.6deg);
          transform: rotateX(10deg) rotateZ(57.6deg);
}

.lines17 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin17 10s linear infinite;
          animation: spin17 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(61.2deg);
          transform: rotateX(10deg) rotateZ(61.2deg);
}

.lines18 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin18 10s linear infinite;
          animation: spin18 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(64.8deg);
          transform: rotateX(10deg) rotateZ(64.8deg);
}

.lines19 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin19 10s linear infinite;
          animation: spin19 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(68.4deg);
          transform: rotateX(10deg) rotateZ(68.4deg);
}

.lines20 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin20 10s linear infinite;
          animation: spin20 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(72deg);
          transform: rotateX(10deg) rotateZ(72deg);
}

.lines21 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin21 10s linear infinite;
          animation: spin21 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(75.6deg);
          transform: rotateX(10deg) rotateZ(75.6deg);
}

.lines22 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin22 10s linear infinite;
          animation: spin22 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(79.2deg);
          transform: rotateX(10deg) rotateZ(79.2deg);
}

.lines23 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin23 10s linear infinite;
          animation: spin23 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(82.8deg);
          transform: rotateX(10deg) rotateZ(82.8deg);
}

.lines24 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin24 10s linear infinite;
          animation: spin24 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(86.4deg);
          transform: rotateX(10deg) rotateZ(86.4deg);
}

.lines25 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin25 10s linear infinite;
          animation: spin25 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(90deg);
          transform: rotateX(10deg) rotateZ(90deg);
}

.lines26 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin26 10s linear infinite;
          animation: spin26 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(93.6deg);
          transform: rotateX(10deg) rotateZ(93.6deg);
}

.lines27 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin27 10s linear infinite;
          animation: spin27 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(97.2deg);
          transform: rotateX(10deg) rotateZ(97.2deg);
}

.lines28 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin28 10s linear infinite;
          animation: spin28 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(100.8deg);
          transform: rotateX(10deg) rotateZ(100.8deg);
}

.lines29 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin29 10s linear infinite;
          animation: spin29 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(104.4deg);
          transform: rotateX(10deg) rotateZ(104.4deg);
}

.lines30 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin30 10s linear infinite;
          animation: spin30 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(108deg);
          transform: rotateX(10deg) rotateZ(108deg);
}

.lines31 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin31 10s linear infinite;
          animation: spin31 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(111.6deg);
          transform: rotateX(10deg) rotateZ(111.6deg);
}

.lines32 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin32 10s linear infinite;
          animation: spin32 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(115.2deg);
          transform: rotateX(10deg) rotateZ(115.2deg);
}

.lines33 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin33 10s linear infinite;
          animation: spin33 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(118.8deg);
          transform: rotateX(10deg) rotateZ(118.8deg);
}

.lines34 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin34 10s linear infinite;
          animation: spin34 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(122.4deg);
          transform: rotateX(10deg) rotateZ(122.4deg);
}

.lines35 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin35 10s linear infinite;
          animation: spin35 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(126deg);
          transform: rotateX(10deg) rotateZ(126deg);
}

.lines36 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin36 10s linear infinite;
          animation: spin36 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(129.6deg);
          transform: rotateX(10deg) rotateZ(129.6deg);
}

.lines37 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin37 10s linear infinite;
          animation: spin37 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(133.2deg);
          transform: rotateX(10deg) rotateZ(133.2deg);
}

.lines38 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin38 10s linear infinite;
          animation: spin38 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(136.8deg);
          transform: rotateX(10deg) rotateZ(136.8deg);
}

.lines39 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin39 10s linear infinite;
          animation: spin39 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(140.4deg);
          transform: rotateX(10deg) rotateZ(140.4deg);
}

.lines40 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin40 10s linear infinite;
          animation: spin40 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(144deg);
          transform: rotateX(10deg) rotateZ(144deg);
}

.lines41 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin41 10s linear infinite;
          animation: spin41 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(147.6deg);
          transform: rotateX(10deg) rotateZ(147.6deg);
}

.lines42 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin42 10s linear infinite;
          animation: spin42 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(151.2deg);
          transform: rotateX(10deg) rotateZ(151.2deg);
}

.lines43 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin43 10s linear infinite;
          animation: spin43 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(154.8deg);
          transform: rotateX(10deg) rotateZ(154.8deg);
}

.lines44 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin44 10s linear infinite;
          animation: spin44 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(158.4deg);
          transform: rotateX(10deg) rotateZ(158.4deg);
}

.lines45 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin45 10s linear infinite;
          animation: spin45 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(162deg);
          transform: rotateX(10deg) rotateZ(162deg);
}

.lines46 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin46 10s linear infinite;
          animation: spin46 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(165.6deg);
          transform: rotateX(10deg) rotateZ(165.6deg);
}

.lines47 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin47 10s linear infinite;
          animation: spin47 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(169.2deg);
          transform: rotateX(10deg) rotateZ(169.2deg);
}

.lines48 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin48 10s linear infinite;
          animation: spin48 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(172.8deg);
          transform: rotateX(10deg) rotateZ(172.8deg);
}

.lines49 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin49 10s linear infinite;
          animation: spin49 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(176.4deg);
          transform: rotateX(10deg) rotateZ(176.4deg);
}

.lines50 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin50 10s linear infinite;
          animation: spin50 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(180deg);
          transform: rotateX(10deg) rotateZ(180deg);
}

.lines51 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin51 10s linear infinite;
          animation: spin51 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(183.6deg);
          transform: rotateX(10deg) rotateZ(183.6deg);
}

.lines52 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin52 10s linear infinite;
          animation: spin52 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(187.2deg);
          transform: rotateX(10deg) rotateZ(187.2deg);
}

.lines53 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin53 10s linear infinite;
          animation: spin53 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(190.8deg);
          transform: rotateX(10deg) rotateZ(190.8deg);
}

.lines54 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin54 10s linear infinite;
          animation: spin54 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(194.4deg);
          transform: rotateX(10deg) rotateZ(194.4deg);
}

.lines55 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin55 10s linear infinite;
          animation: spin55 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(198deg);
          transform: rotateX(10deg) rotateZ(198deg);
}

.lines56 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin56 10s linear infinite;
          animation: spin56 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(201.6deg);
          transform: rotateX(10deg) rotateZ(201.6deg);
}

.lines57 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin57 10s linear infinite;
          animation: spin57 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(205.2deg);
          transform: rotateX(10deg) rotateZ(205.2deg);
}

.lines58 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin58 10s linear infinite;
          animation: spin58 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(208.8deg);
          transform: rotateX(10deg) rotateZ(208.8deg);
}

.lines59 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin59 10s linear infinite;
          animation: spin59 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(212.4deg);
          transform: rotateX(10deg) rotateZ(212.4deg);
}

.lines60 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin60 10s linear infinite;
          animation: spin60 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(216deg);
          transform: rotateX(10deg) rotateZ(216deg);
}

.lines61 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin61 10s linear infinite;
          animation: spin61 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(219.6deg);
          transform: rotateX(10deg) rotateZ(219.6deg);
}

.lines62 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin62 10s linear infinite;
          animation: spin62 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(223.2deg);
          transform: rotateX(10deg) rotateZ(223.2deg);
}

.lines63 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin63 10s linear infinite;
          animation: spin63 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(226.8deg);
          transform: rotateX(10deg) rotateZ(226.8deg);
}

.lines64 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin64 10s linear infinite;
          animation: spin64 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(230.4deg);
          transform: rotateX(10deg) rotateZ(230.4deg);
}

.lines65 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin65 10s linear infinite;
          animation: spin65 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(234deg);
          transform: rotateX(10deg) rotateZ(234deg);
}

.lines66 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin66 10s linear infinite;
          animation: spin66 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(237.6deg);
          transform: rotateX(10deg) rotateZ(237.6deg);
}

.lines67 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin67 10s linear infinite;
          animation: spin67 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(241.2deg);
          transform: rotateX(10deg) rotateZ(241.2deg);
}

.lines68 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin68 10s linear infinite;
          animation: spin68 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(244.8deg);
          transform: rotateX(10deg) rotateZ(244.8deg);
}

.lines69 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin69 10s linear infinite;
          animation: spin69 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(248.4deg);
          transform: rotateX(10deg) rotateZ(248.4deg);
}

.lines70 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin70 10s linear infinite;
          animation: spin70 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(252deg);
          transform: rotateX(10deg) rotateZ(252deg);
}

.lines71 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin71 10s linear infinite;
          animation: spin71 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(255.6deg);
          transform: rotateX(10deg) rotateZ(255.6deg);
}

.lines72 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin72 10s linear infinite;
          animation: spin72 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(259.2deg);
          transform: rotateX(10deg) rotateZ(259.2deg);
}

.lines73 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin73 10s linear infinite;
          animation: spin73 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(262.8deg);
          transform: rotateX(10deg) rotateZ(262.8deg);
}

.lines74 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin74 10s linear infinite;
          animation: spin74 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(266.4deg);
          transform: rotateX(10deg) rotateZ(266.4deg);
}

.lines75 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin75 10s linear infinite;
          animation: spin75 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(270deg);
          transform: rotateX(10deg) rotateZ(270deg);
}

.lines76 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin76 10s linear infinite;
          animation: spin76 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(273.6deg);
          transform: rotateX(10deg) rotateZ(273.6deg);
}

.lines77 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin77 10s linear infinite;
          animation: spin77 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(277.2deg);
          transform: rotateX(10deg) rotateZ(277.2deg);
}

.lines78 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin78 10s linear infinite;
          animation: spin78 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(280.8deg);
          transform: rotateX(10deg) rotateZ(280.8deg);
}

.lines79 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin79 10s linear infinite;
          animation: spin79 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(284.4deg);
          transform: rotateX(10deg) rotateZ(284.4deg);
}

.lines80 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin80 10s linear infinite;
          animation: spin80 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(288deg);
          transform: rotateX(10deg) rotateZ(288deg);
}

.lines81 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin81 10s linear infinite;
          animation: spin81 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(291.6deg);
          transform: rotateX(10deg) rotateZ(291.6deg);
}

.lines82 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin82 10s linear infinite;
          animation: spin82 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(295.2deg);
          transform: rotateX(10deg) rotateZ(295.2deg);
}

.lines83 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin83 10s linear infinite;
          animation: spin83 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(298.8deg);
          transform: rotateX(10deg) rotateZ(298.8deg);
}

.lines84 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin84 10s linear infinite;
          animation: spin84 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(302.4deg);
          transform: rotateX(10deg) rotateZ(302.4deg);
}

.lines85 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin85 10s linear infinite;
          animation: spin85 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(306deg);
          transform: rotateX(10deg) rotateZ(306deg);
}

.lines86 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin86 10s linear infinite;
          animation: spin86 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(309.6deg);
          transform: rotateX(10deg) rotateZ(309.6deg);
}

.lines87 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin87 10s linear infinite;
          animation: spin87 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(313.2deg);
          transform: rotateX(10deg) rotateZ(313.2deg);
}

.lines88 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin88 10s linear infinite;
          animation: spin88 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(316.8deg);
          transform: rotateX(10deg) rotateZ(316.8deg);
}

.lines89 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin89 10s linear infinite;
          animation: spin89 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(320.4deg);
          transform: rotateX(10deg) rotateZ(320.4deg);
}

.lines90 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin90 10s linear infinite;
          animation: spin90 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(324deg);
          transform: rotateX(10deg) rotateZ(324deg);
}

.lines91 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin91 10s linear infinite;
          animation: spin91 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(327.6deg);
          transform: rotateX(10deg) rotateZ(327.6deg);
}

.lines92 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin92 10s linear infinite;
          animation: spin92 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(331.2deg);
          transform: rotateX(10deg) rotateZ(331.2deg);
}

.lines93 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin93 10s linear infinite;
          animation: spin93 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(334.8deg);
          transform: rotateX(10deg) rotateZ(334.8deg);
}

.lines94 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin94 10s linear infinite;
          animation: spin94 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(338.4deg);
          transform: rotateX(10deg) rotateZ(338.4deg);
}

.lines95 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin95 10s linear infinite;
          animation: spin95 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(342deg);
          transform: rotateX(10deg) rotateZ(342deg);
}

.lines96 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin96 10s linear infinite;
          animation: spin96 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(345.6deg);
          transform: rotateX(10deg) rotateZ(345.6deg);
}

.lines97 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin97 10s linear infinite;
          animation: spin97 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(349.2deg);
          transform: rotateX(10deg) rotateZ(349.2deg);
}

.lines98 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin98 10s linear infinite;
          animation: spin98 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(352.8deg);
          transform: rotateX(10deg) rotateZ(352.8deg);
}

.lines99 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin99 10s linear infinite;
          animation: spin99 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(356.4deg);
          transform: rotateX(10deg) rotateZ(356.4deg);
}

.lines100 {
  width: 200%;
  height: 10px;
  background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-animation: spin100 10s linear infinite;
          animation: spin100 10s linear infinite;
  -webkit-transform: rotateX(10deg) rotateZ(360deg);
          transform: rotateX(10deg) rotateZ(360deg);
}
@-webkit-keyframes spin0 {
  0% {
    -webkit-transform: rotateZ(0deg);
            transform: rotateZ(0deg);
  }
  100% {
    -webkit-transform: rotateZ(360deg);
            transform: rotateZ(360deg);
  }
}
@keyframes spin0 {
  0% {
    -webkit-transform: rotateZ(0deg);
            transform: rotateZ(0deg);
  }
  100% {
    -webkit-transform: rotateZ(360deg);
            transform: rotateZ(360deg);
  }
}
@-webkit-keyframes spin1 {
  0% {
    -webkit-transform: rotateZ(3.6deg);
            transform: rotateZ(3.6deg);
  }
  100% {
    -webkit-transform: rotateZ(363.6deg);
            transform: rotateZ(363.6deg);
  }
}
@keyframes spin1 {
  0% {
    -webkit-transform: rotateZ(3.6deg);
            transform: rotateZ(3.6deg);
  }
  100% {
    -webkit-transform: rotateZ(363.6deg);
            transform: rotateZ(363.6deg);
  }
}
@-webkit-keyframes spin2 {
  0% {
    -webkit-transform: rotateZ(7.2deg);
            transform: rotateZ(7.2deg);
  }
  100% {
    -webkit-transform: rotateZ(367.2deg);
            transform: rotateZ(367.2deg);
  }
}
@keyframes spin2 {
  0% {
    -webkit-transform: rotateZ(7.2deg);
            transform: rotateZ(7.2deg);
  }
  100% {
    -webkit-transform: rotateZ(367.2deg);
            transform: rotateZ(367.2deg);
  }
}
@-webkit-keyframes spin3 {
  0% {
    -webkit-transform: rotateZ(10.8deg);
            transform: rotateZ(10.8deg);
  }
  100% {
    -webkit-transform: rotateZ(370.8deg);
            transform: rotateZ(370.8deg);
  }
}
@keyframes spin3 {
  0% {
    -webkit-transform: rotateZ(10.8deg);
            transform: rotateZ(10.8deg);
  }
  100% {
    -webkit-transform: rotateZ(370.8deg);
            transform: rotateZ(370.8deg);
  }
}
@-webkit-keyframes spin4 {
  0% {
    -webkit-transform: rotateZ(14.4deg);
            transform: rotateZ(14.4deg);
  }
  100% {
    -webkit-transform: rotateZ(374.4deg);
            transform: rotateZ(374.4deg);
  }
}
@keyframes spin4 {
  0% {
    -webkit-transform: rotateZ(14.4deg);
            transform: rotateZ(14.4deg);
  }
  100% {
    -webkit-transform: rotateZ(374.4deg);
            transform: rotateZ(374.4deg);
  }
}
@-webkit-keyframes spin5 {
  0% {
    -webkit-transform: rotateZ(18deg);
            transform: rotateZ(18deg);
  }
  100% {
    -webkit-transform: rotateZ(378deg);
            transform: rotateZ(378deg);
  }
}
@keyframes spin5 {
  0% {
    -webkit-transform: rotateZ(18deg);
            transform: ro.........完整代码请登录后点击上方下载按钮下载查看

网友评论0